Skip to content
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.

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

fix: Dark Mode style regressions #11123

Open
wants to merge 2 commits into
base: develop
Choose a base branch
from

Conversation

bnussman-akamai
Copy link
Member

@bnussman-akamai bnussman-akamai commented Oct 17, 2024

Description 📝

Related Docs 📖

See https://v5.mui.com/material-ui/customization/theming/#createtheme-options-args-theme

I think the key point is

Only the first argument (options) is processed by the createTheme function.

Calling createTheme before merging the raw options has implications that I didn't foresee. Calling createTheme with the theme options merged first fixes the issues we are seeing

Screenshots of the Issues 📷

Screenshot 2024-10-17 at 2 04 37 PM
Screenshot 2024-10-17 at 2 03 54 PM
Screenshot 2024-10-17 at 2 02 44 PM

How to test 🧪

  • Checkout this PR (or just use the preview link)
  • Verify the regressions in the "Screenshots" section are all fixed 🔧

As an Author I have considered 🤔

  • 👀 Doing a self review
  • ❔ Our contribution guidelines
  • 🤏 Splitting feature into small PRs
  • ➕ Adding a changeset
  • 🧪 Providing/Improving test coverage
  • 🔐 Removing all sensitive information from the code and PR description
  • 🚩 Using a feature flag to protect the release
  • 👣 Providing comprehensive reproduction steps
  • 📑 Providing or updating our documentation
  • 🕛 Scheduling a pair reviewing session
  • 📱 Providing mobile support
  • ♿ Providing accessibility support

@bnussman-akamai bnussman-akamai added Bug Fixes for regressions or bugs UX/UI Changes for UI/UX to review labels Oct 17, 2024
@bnussman-akamai bnussman-akamai self-assigned this Oct 17, 2024
@bnussman-akamai bnussman-akamai requested a review from a team as a code owner October 17, 2024 19:08
@bnussman-akamai bnussman-akamai requested review from cpathipa and hkhalil-akamai and removed request for a team October 17, 2024 19:08
@@ -25,6 +25,7 @@
"@lukemorales/query-key-factory": "^1.3.4",
"@mui/icons-material": "^5.14.7",
"@mui/material": "^5.14.7",
"@mui/utils": "^5.14.7",
Copy link
Member Author

@bnussman-akamai bnussman-akamai Oct 17, 2024

Choose a reason for hiding this comment

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

This does add a new explicit dependency but I don't think it's doing much harm. It is already installed by yarn because @mui/material depends on it

If anyone prefers we use a custom deepMerge like we did previously, happy to discuss

Copy link
Contributor

Choose a reason for hiding this comment

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

I think that's great cause we already importing this in many places, so another step closer to PNPM

Copy link
Member Author

Choose a reason for hiding this comment

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

Oh wow. Good call. I didn't even realize that!

Copy link
Contributor

@abailly-akamai abailly-akamai left a comment

Choose a reason for hiding this comment

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

Confirming regressions gone, ty!

@@ -25,6 +25,7 @@
"@lukemorales/query-key-factory": "^1.3.4",
"@mui/icons-material": "^5.14.7",
"@mui/material": "^5.14.7",
"@mui/utils": "^5.14.7",
Copy link
Contributor

Choose a reason for hiding this comment

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

I think that's great cause we already importing this in many places, so another step closer to PNPM

@@ -107,4 +108,4 @@ declare module '@mui/material/styles/createTheme' {

export const inputMaxWidth = _inputMaxWidth;
export const light = createTheme(lightTheme);
export const dark = createTheme(lightTheme, darkTheme);
export const dark = createTheme(deepmerge(lightTheme, darkTheme));
Copy link
Contributor

Choose a reason for hiding this comment

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

👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug Fixes for regressions or bugs UX/UI Changes for UI/UX to review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants