Migrate design library from Bootstrap/CoreUI to Material UI

[devin-ai-integration]

Migrate design library from Bootstrap/CoreUI to Material UI

Summary

This PR migrates the admin template from Bootstrap/CoreUI to Material UI (MUI). The migration covers the core layout components, dashboard, widgets, and authentication pages.

Key changes include replacing CoreUI components with MUI equivalents (AppBar, Drawer, Card, Grid, etc.), switching from @coreui/icons to @mui/icons-material, migrating charts from @coreui/react-chartjs to react-chartjs-2, and replacing CoreUI's useColorModes hook with MUI's ThemeProvider for theming.

The following components were migrated: DefaultLayout, AppHeader, AppSidebar, AppFooter, AppContent, AppBreadcrumb, AppSidebarNav, AppHeaderDropdown, Dashboard, MainChart, WidgetsDropdown, WidgetsBrand, Login, Register, Page404, and Page500.

Note that this is a partial migration. Some views under /views/base, /views/buttons, /views/forms, /views/charts, /views/icons, and /views/notifications still reference CoreUI components and will need separate migration work. CoreUI dependencies have been retained in package.json to support these unmigrated files.

Updates since last revision

• Tested the application locally with npm start
• Verified Dashboard, Login, Register, and 404 pages render correctly with MUI components
• Re-added CoreUI dependencies to package.json to allow unmigrated views to function

Local Testing Screenshots

Dashboard:

Login Page:

Register Page:

404 Page:

Screen Recording:

View original video (rec-59770b9292f440c4a70c58ffbf0dd32c-edited.mp4)

Review & Testing Checklist for Human

• Verify responsive sidebar behavior - the sidebar uses MUI Drawer with responsive breakpoints; test on mobile/tablet viewports to ensure it collapses/expands correctly
• Check theme colors - the MUI theme palette was manually configured to match CoreUI colors; verify primary (#321fdb), success (#2eb85c), info (#39f), warning (#f9b115), and error (#e55353) look correct
• Test unmigrated pages - navigate to pages under Base, Buttons, Forms, Charts, Icons, and Notifications to verify they still work with the retained CoreUI dependencies
• Test sidebar navigation - the nav structure changed from component: CNavItem to a simpler object format; verify all menu items and nested groups work correctly

Recommended test plan: Start the dev server (npm start), navigate through all pages (both migrated and unmigrated), resize the browser to test responsive sidebar behavior, and compare the visual appearance against the original CoreUI template.

Notes

There are 2 pre-existing lint errors in Charts.js and Widgets.js related to Math.random() being called during render. These files were not part of this migration and still use CoreUI components.

Link to Devin run: https://partner-workshops.devinenterprise.com/sessions/47b08bf2d9004033bf555aff267258dc

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment and CI monitoring