diff --git a/src/client/components/Routes.js b/src/client/components/Routes.js
index 9c4572daaa..35e6d69a05 100644
--- a/src/client/components/Routes.js
+++ b/src/client/components/Routes.js
@@ -2,6 +2,8 @@ import React, { useState, useEffect } from 'react';
 import {
   Route, Switch, withRouter, Redirect,
 } from 'react-router-dom';
+import List from 'payload/custom-components/views/collections/List';
+import DefaultList from './views/collections/List';
 import getSanitizedClientConfig from '../config/getSanitizedClientConfig';
 import { useUser } from './data/User';
 import Dashboard from './views/Dashboard';
@@ -11,7 +13,6 @@ import NotFound from './views/NotFound';
 import CreateFirstUser from './views/CreateFirstUser';
 import MediaLibrary from './views/MediaLibrary';
 import Edit from './views/collections/Edit';
-import List from './views/collections/List';
 import EditGlobal from './views/globals/Edit';
 import { requests } from '../api';
 
@@ -19,7 +20,8 @@ const config = getSanitizedClientConfig();
 
 const CollectionRoutes = ({ match }) => {
   const collectionRoutes = config?.collections.reduce((routesToRender, collection) => {
-    const ListComponent = List;
+    let ListComponent = (typeof List === 'object' && List[collection.slug]) ? List[collection.slug] : List;
+    if (!ListComponent) ListComponent = DefaultList;
     routesToRender.push({
       path: `${match.url}/collections/${collection.slug}`,
       component: ListComponent,
diff --git a/src/client/components/layout/DefaultTemplate/index.js b/src/client/components/layout/DefaultTemplate/index.js
index ee1a6cf381..1c61ba1577 100644
--- a/src/client/components/layout/DefaultTemplate/index.js
+++ b/src/client/components/layout/DefaultTemplate/index.js
@@ -1,6 +1,6 @@
 import React, { useEffect } from 'react';
 import PropTypes from 'prop-types';
-import Sidebar from 'payload/Sidebar';
+import Sidebar from 'payload/custom-components/layout/Sidebar';
 import StepNav, { useStepNav, StepNavProvider } from '../../modules/StepNav';
 import { StatusListProvider } from '../../modules/Status';
 import Localizer from '../../modules/Localizer';
diff --git a/src/client/config/getWebpackDevConfig.js b/src/client/config/getWebpackDevConfig.js
index 29f6e0067b..dd76b8f0d1 100644
--- a/src/client/config/getWebpackDevConfig.js
+++ b/src/client/config/getWebpackDevConfig.js
@@ -105,7 +105,8 @@ module.exports = (config) => {
       alias: {
         'payload-scss-overrides': config.paths.scssOverrides,
         'payload-config': config.paths.config,
-        'payload/Sidebar': (config.customComponents.layout && config.customComponents.layout.Sidebar) ? config.customComponents.layout.Sidebar : path.resolve(__dirname, '../components/layout/Sidebar/index.js'),
+        'payload/custom-components/layout/Sidebar': (config.customComponents.layout && config.customComponents.layout.Sidebar) ? config.customComponents.layout.Sidebar : path.resolve(__dirname, '../components/layout/Sidebar/index.js'),
+        'payload/custom-components/views/collections/List': (config.customComponents.views && config.customComponents.views.collections) ? config.customComponents.views.collections.List : path.resolve(__dirname, '../components/views/collections/List/index.js'),
       },
     },
   };