Migrate from Bootstrap/CoreUI to Material UI

[devin-ai-integration]

Migrate from Bootstrap/CoreUI to Material UI

Summary

This PR completely replaces the Bootstrap/CoreUI styling framework with Material UI (MUI). All 58 component files have been rewritten to use MUI components, theming, and styling patterns.

Key changes:

• Replaced CoreUI React components with Material UI equivalents (Cards, Buttons, Forms, Tables, etc.)
• Added MUI theme configuration with light/dark mode support via src/theme.js
• Migrated layout system (Drawer-based sidebar, AppBar header, responsive content area)
• Replaced CoreUI icons with @mui/icons-material
• Migrated charts from CoreUI/Chart.js to @mui/x-charts
• Updated navigation system to work with MUI Drawer and List components
• Removed all CoreUI, Bootstrap, and related dependencies from package.json

Updates Since Last Revision

• Fixed remaining CoreUI imports in DocsExample.js, AppHeaderDropdown.js, and DocsLink.js
• App tested locally and verified working:
  • Dashboard renders with widgets and charts
  • Theme switching (light/dark mode) works correctly
  • Navigation through Forms, Buttons, Alerts, Charts, and Modals pages verified
  • Modal dialogs open and close properly
• All CI checks pass (6/6 builds successful across Ubuntu and Windows with Node 16.x, 17.x, 18.x)

Review & Testing Checklist for Human

This is a high-risk PR due to the complete framework replacement. Please verify:

• Navigate through all routes - verify sidebar navigation works correctly and all pages render
• Test theme switching - click the theme toggle in the header to switch between light/dark modes
• Verify form functionality - test inputs, checkboxes, selects, and form validation on the Forms pages
• Check chart rendering - verify Dashboard charts and Charts page display correctly (migrated to MUI X Charts)
• Test responsive behavior - resize browser window and verify layout adapts properly

Recommended Test Plan

1. Run npm install then npm start
2. Navigate to Dashboard - verify widgets and main chart render
3. Click through each sidebar menu item to verify all pages load
4. Test the sidebar collapse/expand functionality
5. Toggle theme between light and dark mode
6. Test a form submission on the Validation page
7. Open a modal on the Modals page

Notes

• MainChart.js uses hardcoded sample data instead of random generation (to satisfy React purity lint rules)
• The Widgets.js page was simplified from the original extensive widget showcase
• Navigation config (_nav.js) uses a different structure - component references are now objects with name properties
• Minor console warnings about leftAxis/bottomAxis props in MUI X Charts (does not affect functionality)

Link to Devin run: https://partner-workshops.devinenterprise.com/sessions/044f6122432049d2b8998e7c69b5c5e2

[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