Skip to content

chore: upgrade MUI to v9.1.0 #163

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
rchalamala merged 2 commits into from
Jun 11, 2026
Merged

chore: upgrade MUI to v9.1.0 #163

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
8e8bdfb
chore: upgrade MUI to v9.1.0 (HelpOutline -> HelpOutlined icon rename)
devin-ai-integration[bot] Jun 11, 2026
ecff48c
fix: use HelpOutlineOutlined to preserve original HelpOutline glyph
devin-ai-integration[bot] Jun 11, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
94 changes: 47 additions & 47 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@
"@emotion/styled": "^11.14.0",
"@formkit/auto-animate": "^0.8.2",
"@hello-pangea/dnd": "^18.0.1",
"@mui/icons-material": "^7.3.11",
"@mui/material": "^7.3.11",
"@mui/icons-material": "^9.1.0",
"@mui/material": "^9.1.0",
Comment on lines +10 to +11

@devin-ai-integration devin-ai-integration Bot Jun 11, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚩 MUI v7→v9 is a major version jump skipping v8

The PR bumps @mui/icons-material and @mui/material from ^7.3.11 directly to ^9.1.0, skipping major version 8 entirely. While TypeScript compilation passes and all current imports resolve correctly, skipping a major version means two sets of breaking changes and migration guides apply. There may be subtle runtime behavioral changes (e.g., default prop values, styling/theming changes, accessibility attributes) that wouldn't surface at compile time. Worth verifying visually that components like Collapse, Switch, IconButton, and Dialog render and behave as expected.

Open in Devin Review

Was this helpful? React with 👍 or 👎 to provide feedback.

@devin-ai-integration devin-ai-integration Bot Jun 11, 2026

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Verified visually: ran the app on both MUI 7 (main) and MUI 9 (this branch) side by side and exercised Dialog (help + More Info), Collapse, Switch, and all IconButtons through the UI — identical rendering and behavior, no console errors. Note MUI Core has no v8 release on npm (versions go 7.3.11 → 9.0.0-alpha.0), so only the single v7→v9 migration guide applies; the only relevant breaking change was the removed HelpOutline icon alias, handled in this PR. Full evidence in the test results comment.

"@preact/signals": "^2.9.1",
"@schedule-x/calendar": "^4.6.0",
"@schedule-x/events-service": "^4.6.0",
Expand Down
4 changes: 2 additions & 2 deletions src/HelpButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { useState } from "react";
import { m } from "motion/react";
import HelpOutlineIcon from "@mui/icons-material/HelpOutline";
import HelpOutlineOutlinedIcon from "@mui/icons-material/HelpOutlineOutlined";
import Modal from "./Modal";
import Hyperlink from "./Hyperlink";

Expand All @@ -16,7 +16,7 @@ export default function HelpButton() {
className="h-8 w-8 rounded-full border-none bg-white p-0"
onClick={() => setModalOpen(true)}
>
<HelpOutlineIcon
<HelpOutlineOutlinedIcon
className="text-orange-500 bg-transparent"
style={{ width: "auto", height: "auto" }}
/>
Expand Down