[docs] Fallback for searchbar during SSR #46364
Conversation
- Extract SearchButton styled component and related components into separate SearchButton.tsx file - Add TypeScript interfaces with optional onClick prop that disables button when not provided - Use React state for keyboard shortcut to prevent SSR hydration errors - Update AppFrame to use SearchButton as Suspense fallback for better UX 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <[email protected]>
Janpot
changed the title
Netlify deploy previewhttps://deploy-preview-46364--material-ui.netlify.app/ Bundle size report@mui/material parsed: 0B(0.00%) gzip: 0B(0.00%) Show details for 100 more bundles (86 more not shown)@mui/lab/AdapterDateFns parsed: 0B(0.00%) gzip: 0B(0.00%) |
Janpot
changed the title
The esmExternals experimental option is no longer needed in modern Next.js versions and has been removed from the docs configuration.
…js config" This reverts commit 5a1ecf3.
Was looking into this code for another purpose and this annoyed me, had Claude Code update it to show a proper fallback for the searchbar. We can just extract the presentational part of the searchbutton and show as fallback, it won't affect the bundle size much. Only the shortcut is hidden until after hydration.
Not sure why, but for me this improves the perceived performance.