diff --git a/packages/edit-site/src/components/layout/index.js b/packages/edit-site/src/components/layout/index.js
index 7c3f9e2115256..2be74d69d7f3d 100644
--- a/packages/edit-site/src/components/layout/index.js
+++ b/packages/edit-site/src/components/layout/index.js
@@ -155,9 +155,10 @@ function Layout() {
 											isResizableFrameOversized
 										}
 									/>
+									{ areas.mobile }
 								</SidebarContent>
 							) }
-							{ areas.mobile }
+							{ canvas === 'edit' ? areas.mobile : null }
 						</div>
 					) }
 
diff --git a/packages/edit-site/src/components/site-editor-routes/patterns.js b/packages/edit-site/src/components/site-editor-routes/patterns.js
index 48207cfe1c1d2..12af51a8b794c 100644
--- a/packages/edit-site/src/components/site-editor-routes/patterns.js
+++ b/packages/edit-site/src/components/site-editor-routes/patterns.js
@@ -1,15 +1,39 @@
+/**
+ * WordPress dependencies
+ */
+import { privateApis as routerPrivateApis } from '@wordpress/router';
+
 /**
  * Internal dependencies
  */
+import Editor from '../editor';
+import { unlock } from '../../lock-unlock';
 import SidebarNavigationScreenPatterns from '../sidebar-navigation-screen-patterns';
 import PagePatterns from '../page-patterns';
 
+const { useLocation } = unlock( routerPrivateApis );
+
+function MobilePatternsView() {
+	const { query = {} } = useLocation();
+	const { canvas = 'view', postType, categoryId } = query;
+
+	if ( canvas === 'edit' ) {
+		return <Editor />;
+	}
+
+	if ( postType === 'wp_block' && !! categoryId ) {
+		return <PagePatterns />;
+	}
+
+	return <SidebarNavigationScreenPatterns backPath="/" />;
+}
+
 export const patternsRoute = {
 	name: 'patterns',
 	path: '/pattern',
 	areas: {
 		sidebar: <SidebarNavigationScreenPatterns backPath="/" />,
 		content: <PagePatterns />,
-		mobile: <SidebarNavigationScreenPatterns backPath="/" />,
+		mobile: <MobilePatternsView />,
 	},
 };
diff --git a/packages/edit-site/src/components/site-editor-routes/templates.js b/packages/edit-site/src/components/site-editor-routes/templates.js
index 06ba07fcd0659..cb9f650bbf926 100644
--- a/packages/edit-site/src/components/site-editor-routes/templates.js
+++ b/packages/edit-site/src/components/site-editor-routes/templates.js
@@ -1,29 +1,10 @@
-/**
- * WordPress dependencies
- */
-import { privateApis as routerPrivateApis } from '@wordpress/router';
-
 /**
  * Internal dependencies
  */
 import Editor from '../editor';
 import SidebarNavigationScreenTemplatesBrowse from '../sidebar-navigation-screen-templates-browse';
-import { unlock } from '../../lock-unlock';
 import PageTemplates from '../page-templates';
 
-const { useLocation } = unlock( routerPrivateApis );
-
-function MobileTemplatesView() {
-	const { query = {} } = useLocation();
-	const { canvas = 'view' } = query;
-
-	return canvas === 'edit' ? (
-		<Editor />
-	) : (
-		<SidebarNavigationScreenTemplatesBrowse backPath="/" />
-	);
-}
-
 export const templatesRoute = {
 	name: 'templates',
 	path: '/template',
@@ -34,7 +15,7 @@ export const templatesRoute = {
 			const isListView = query.layout === 'list';
 			return isListView ? <Editor /> : undefined;
 		},
-		mobile: <MobileTemplatesView />,
+		mobile: <PageTemplates />,
 	},
 	widths: {
 		content( { query } ) {