u

src/components/AppShell.jsx

@@ -1,4 +1,4 @@
-import { PureComponent } from 'react';
+import { PureComponent, lazy, Suspense } from 'react';
 import Box from '@mui/material/Box';
 import List from '@mui/material/List';
 import ListItemButton from '@mui/material/ListItemButton';
@@ -21,6 +21,10 @@ import {
 } from '../colors';
 import { ChatFab, ChatDrawer } from './chat';
 
+const BreakpointOverlay = import.meta.env.DEV
+  ? lazy(() => import('./BreakpointOverlay'))
+  : null;
+
 
 const SIDEBAR_WIDTH = 144;
 const SUB_NAV_WIDTH = 88;
@@ -322,6 +326,11 @@ export default function AppShell() {
       </Box>
       <ChatFab />
       <ChatDrawer />
+      {BreakpointOverlay && (
+        <Suspense fallback={null}>
+          <BreakpointOverlay />
+        </Suspense>
+      )}
     </Box>
   );
 }