Skip to content
This repository has been archived by the owner on Dec 27, 2024. It is now read-only.

🐛 Bug Report: [ThemeProvider - mui v5 upgrade] Error opening Announcements page #472

Closed
1 task done
stephenglass opened this issue Oct 7, 2024 · 20 comments
Closed
1 task done
Assignees
Labels
bug An issue with the system help wanted Anyone is welcome to open a pull request to fix this issue

Comments

@stephenglass
Copy link

stephenglass commented Oct 7, 2024

📜 Description

Going to the announcements route (<AnnouncementsPage/>) shows an error and unable to load the page.
Noticed this when upgrading @procore-oss/backstage-plugin-announcements from 0.10.0 -> 0.11.1. The last working version is 0.10.5.

Error suggests that AnnouncementsPage component need to be wrapped in a ThemeProvider to be able to access the theme params in the makeStyles.

👍 Expected behavior

Should be able to open the announcements page

👎 Actual Behavior with Screenshots

image

Console error logs:

getStylesCreator.js:21 
 MUI: The `styles` argument provided is invalid.
You are providing a function without a theme in the context.
One of the parent elements needs to use a ThemeProvider.
getStylesCreator.js:21 
 MUI: The `styles` argument provided is invalid.
You are providing a function without a theme in the context.
One of the parent elements needs to use a ThemeProvider.
getStylesCreator.js:24 
 Uncaught TypeError: Cannot read properties of undefined (reading 'text')
    at eval (AnnouncementsPage.esm.js:32:1)
    at Object.create (getStylesCreator.js:16:1)
    at attach (makeStyles.js:81:1)
    at eval (makeStyles.js:199:1)
    at useSynchronousEffect (makeStyles.js:159:1)
    at useStyles (makeStyles.js:191:1)
    at AnnouncementsGrid (AnnouncementsPage.esm.js:128:1)
    at renderWithHooks (react-dom.development.js:15486:1)
    at mountIndeterminateComponent (react-dom.development.js:20103:1)
    at beginWork (react-dom.development.js:21626:1)
getStylesCreator.js:21 
 MUI: The `styles` argument provided is invalid.
You are providing a function without a theme in the context.
One of the parent elements needs to use a ThemeProvider.
getStylesCreator.js:21 
 MUI: The `styles` argument provided is invalid.
You are providing a function without a theme in the context.
One of the parent elements needs to use a ThemeProvider.
getStylesCreator.js:24 
 Uncaught TypeError: Cannot read properties of undefined (reading 'text')
    at eval (AnnouncementsPage.esm.js:32:1)
    at Object.create (getStylesCreator.js:16:1)
    at attach (makeStyles.js:81:1)
    at eval (makeStyles.js:199:1)
    at useSynchronousEffect (makeStyles.js:159:1)
    at useStyles (makeStyles.js:191:1)
    at AnnouncementsGrid (AnnouncementsPage.esm.js:128:1)
    at renderWithHooks (react-dom.development.js:15486:1)
    at mountIndeterminateComponent (react-dom.development.js:20103:1)
    at beginWork (react-dom.development.js:21626:1)


react-dom.development.js:18704 
 The above error occurred in the <AnnouncementsGrid> component:

    at AnnouncementsGrid (webpack-internal:///../../node_modules/@procore-oss/backstage-plugin-announcements/dist/components/AnnouncementsPage/AnnouncementsPage.esm.js:169:3)
    at article
    at Content (webpack-internal:///../../node_modules/@backstage/core-components/dist/layout/Content/Content.esm.js:40:11)
    at main
    at ThemeProvider (webpack-internal:///../../node_modules/@material-ui/styles/esm/ThemeProvider/ThemeProvider.js:45:24)
    at Page (webpack-internal:///../../node_modules/@backstage/core-components/dist/layout/Page/Page.esm.js:34:11)
    at AnnouncementsPage (webpack-internal:///../../node_modules/@procore-oss/backstage-plugin-announcements/dist/components/AnnouncementsPage/AnnouncementsPage.esm.js:242:82)
    at RenderedRoute (webpack-internal:///../../node_modules/react-router/dist/index.js:578:5)
    at Routes (webpack-internal:///../../node_modules/react-router/dist/index.js:1279:5)
    at Router
    at RoutableExtensionWrapper (webpack-internal:///../../node_modules/@backstage/core-plugin-api/dist/extensions/extensions.esm.js:34:107)
    at AnalyticsContext (webpack-internal:///../../node_modules/@backstage/core-plugin-api/dist/analytics/AnalyticsContext.esm.js:30:11)
    at PluginErrorBoundary (webpack-internal:///../../node_modules/@backstage/core-plugin-api/dist/extensions/PluginErrorBoundary.esm.js:9:1)
    at Suspense
    at Result (webpack-internal:///../../node_modules/@backstage/core-plugin-api/dist/extensions/extensions.esm.js:97:79)
    at RenderedRoute (webpack-internal:///../../node_modules/react-router/dist/index.js:578:5)
    at FlatRoutes (webpack-internal:///../../node_modules/@backstage/core-app-api/dist/routing/FlatRoutes.esm.js:19:81)
    at div
    at StyledComponent (webpack-internal:///../../node_modules/@material-ui/styles/esm/styled/styled.js:96:28)
    at SidebarPinStateProvider (webpack-internal:///../../node_modules/@backstage/core-components/dist/layout/Sidebar/SidebarPinStateContext.esm.js:23:11)
    at SidebarPage (webpack-internal:///../../node_modules/@backstage/core-components/dist/layout/Sidebar/Page.esm.js:54:82)
    at Root (webpack-internal:///./src/components/Root/Root.tsx:108:17)
    at SignInPageWrapper (webpack-internal:///../../node_modules/@backstage/core-app-api/dist/app/AppRouter.esm.js:39:14)
    at Router (webpack-internal:///../../node_modules/react-router/dist/index.js:1213:15)
    at BrowserRouter (webpack-internal:///../../node_modules/react-router-dom/dist/index.js:703:5)
    at AppRouter (webpack-internal:///../../node_modules/@backstage/core-app-api/dist/app/AppRouter.esm.js:55:138)
    at Suspense
    at RoutingProvider (webpack-internal:///../../node_modules/@backstage/core-app-api/dist/routing/RoutingProvider.esm.js:18:3)
    at ThemeProvider (webpack-internal:///../../node_modules/@material-ui/styles/esm/ThemeProvider/ThemeProvider.js:45:24)
    at StylesProvider (webpack-internal:///../../node_modules/@material-ui/styles/esm/StylesProvider/StylesProvider.js:50:24)
    at RtlProvider (webpack-internal:///../../node_modules/@backstage/theme/node_modules/@mui/system/esm/RtlProvider/index.js:22:7)
    at ThemeProvider (webpack-internal:///../../node_modules/@backstage/theme/node_modules/@mui/private-theming/ThemeProvider/ThemeProvider.js:45:5)
    at ThemeProvider (webpack-internal:///../../node_modules/@backstage/theme/node_modules/@mui/system/esm/ThemeProvider/ThemeProvider.js:59:5)
    at ThemeProvider (webpack-internal:///../../node_modules/@backstage/theme/node_modules/@mui/material/styles/ThemeProvider.js:26:14)
    at StyledEngineProvider (webpack-internal:///../../node_modules/@mui/styled-engine/StyledEngineProvider/StyledEngineProvider.js:31:5)
    at UnifiedThemeProvider (webpack-internal:///../../node_modules/@backstage/theme/dist/unified/UnifiedThemeProvider.esm.js:27:11)
    at Provider (webpack-internal:///./src/App.tsx:150:26)
    at AppThemeProvider (webpack-internal:///../../node_modules/@backstage/core-app-api/dist/app/AppThemeProvider.esm.js:50:29)
    at AppContextProvider (webpack-internal:///../../node_modules/@backstage/core-app-api/dist/app/AppContext.esm.js:14:3)
    at ApiProvider (webpack-internal:///../../node_modules/@backstage/core-app-api/dist/apis/system/ApiProvider.esm.js:19:11)
    at Provider (webpack-internal:///../../node_modules/@backstage/core-app-api/dist/app/AppManager.esm.js:176:25)
    at AppRoot

React will try to recreate this component tree from scratch using the error boundary you provided, PluginErrorBoundary.

👟 Reproduction steps

Go to the route serving the <AnnouncementsPage/> component

📃 Provide the context for the Bug.

Unable to display the announcements page

🖥️ Your Environment

Backstage v1.31.3

"@procore-oss/backstage-plugin-announcements-backend": "^0.10.3",
"@procore-oss/backstage-plugin-search-backend-module-announcements": "^0.3.2",
OS:   Linux 5.15.153.1-microsoft-standard-WSL2 - linux/x64
node: v20.16.0
yarn: 4.3.1
cli:  0.27.1 (installed)
backstage:  1.31.3

Dependencies:
  @backstage/app-defaults                                          1.5.11
  @backstage/backend-app-api                                       1.0.0
  @backstage/backend-common                                        0.24.1, 0.25.0
  @backstage/backend-defaults                                      0.5.0
  @backstage/backend-dev-utils                                     0.1.5
  @backstage/backend-openapi-utils                                 0.1.18
  @backstage/backend-plugin-api                                    0.8.1, 1.0.0
  @backstage/backend-tasks                                         0.6.1
  @backstage/backend-test-utils                                    1.0.0
  @backstage/catalog-client                                        1.7.0
  @backstage/catalog-model                                         1.7.0
  @backstage/cli-common                                            0.1.14
  @backstage/cli-node                                              0.2.8
  @backstage/cli                                                   0.27.1
  @backstage/config-loader                                         1.9.1
  @backstage/config                                                1.2.0
  @backstage/core-app-api                                          1.15.0
  @backstage/core-compat-api                                       0.2.8, 0.3.0
  @backstage/core-components                                       0.14.10, 0.15.0
  @backstage/core-plugin-api                                       1.9.4
  @backstage/dev-utils                                             1.1.1
  @backstage/e2e-test-utils                                        0.1.1
  @backstage/errors                                                1.2.4
  @backstage/eslint-plugin                                         0.1.9
  @backstage/frontend-app-api                                      0.8.0
  @backstage/frontend-plugin-api                                   0.7.0, 0.8.0
  @backstage/integration-aws-node                                  0.1.12
  @backstage/integration-react                                     1.1.31, 1.1.32
  @backstage/integration                                           1.15.0
  @backstage/plugin-api-docs                                       0.11.10
  @backstage/plugin-app-backend                                    0.3.75
  @backstage/plugin-app-node                                       0.1.25
  @backstage/plugin-auth-backend-module-atlassian-provider         0.3.0
  @backstage/plugin-auth-backend-module-auth0-provider             0.1.0
  @backstage/plugin-auth-backend-module-aws-alb-provider           0.2.0
  @backstage/plugin-auth-backend-module-azure-easyauth-provider    0.2.0
  @backstage/plugin-auth-backend-module-bitbucket-provider         0.2.0
  @backstage/plugin-auth-backend-module-bitbucket-server-provider  0.1.0
  @backstage/plugin-auth-backend-module-cloudflare-access-provider 0.3.0
  @backstage/plugin-auth-backend-module-gcp-iap-provider           0.3.0
  @backstage/plugin-auth-backend-module-github-provider            0.2.0
  @backstage/plugin-auth-backend-module-gitlab-provider            0.2.0
  @backstage/plugin-auth-backend-module-google-provider            0.2.0
  @backstage/plugin-auth-backend-module-guest-provider             0.2.0
  @backstage/plugin-auth-backend-module-microsoft-provider         0.2.0
  @backstage/plugin-auth-backend-module-oauth2-provider            0.3.0
  @backstage/plugin-auth-backend-module-oauth2-proxy-provider      0.2.0
  @backstage/plugin-auth-backend-module-oidc-provider              0.3.0
  @backstage/plugin-auth-backend-module-okta-provider              0.1.0
  @backstage/plugin-auth-backend-module-onelogin-provider          0.2.0
  @backstage/plugin-auth-backend                                   0.23.0
  @backstage/plugin-auth-node                                      0.5.2
  @backstage/plugin-auth-react                                     0.1.6
  @backstage/plugin-bitbucket-cloud-common                         0.2.23
  @backstage/plugin-catalog-backend-module-github-org              0.3.1
  @backstage/plugin-catalog-backend-module-github                  0.7.4
  @backstage/plugin-catalog-backend-module-scaffolder-entity-model 0.2.0
  @backstage/plugin-catalog-backend                                1.26.1
  @backstage/plugin-catalog-common                                 1.1.0
  @backstage/plugin-catalog-graph                                  0.4.10
  @backstage/plugin-catalog-import                                 0.12.4
  @backstage/plugin-catalog-node                                   1.13.0
  @backstage/plugin-catalog-react                                  1.13.0, 1.13.1
  @backstage/plugin-catalog                                        1.23.1
  @backstage/plugin-events-backend                                 0.3.12
  @backstage/plugin-events-node                                    0.4.0
  @backstage/plugin-home-react                                     0.1.17
  @backstage/plugin-home                                           0.7.11
  @backstage/plugin-notifications-backend                          0.4.0
  @backstage/plugin-notifications-common                           0.0.5
  @backstage/plugin-notifications-node                             0.2.6
  @backstage/plugin-notifications                                  0.3.1
  @backstage/plugin-org                                            0.6.30
  @backstage/plugin-permission-backend-module-allow-all-policy     0.2.0
  @backstage/plugin-permission-backend                             0.5.49
  @backstage/plugin-permission-common                              0.8.1
  @backstage/plugin-permission-node                                0.8.3
  @backstage/plugin-permission-react                               0.4.26
  @backstage/plugin-proxy-backend                                  0.5.6
  @backstage/plugin-scaffolder-backend-module-azure                0.2.0
  @backstage/plugin-scaffolder-backend-module-bitbucket-cloud      0.2.0
  @backstage/plugin-scaffolder-backend-module-bitbucket-server     0.2.0
  @backstage/plugin-scaffolder-backend-module-bitbucket            0.3.0
  @backstage/plugin-scaffolder-backend-module-gerrit               0.2.0
  @backstage/plugin-scaffolder-backend-module-gitea                0.2.0
  @backstage/plugin-scaffolder-backend-module-github               0.5.0
  @backstage/plugin-scaffolder-backend-module-gitlab               0.5.0
  @backstage/plugin-scaffolder-backend                             1.25.0
  @backstage/plugin-scaffolder-common                              1.5.6
  @backstage/plugin-scaffolder-node-test-utils                     0.1.12
  @backstage/plugin-scaffolder-node                                0.4.11
  @backstage/plugin-scaffolder-react                               1.12.1
  @backstage/plugin-scaffolder                                     1.25.1
  @backstage/plugin-search-backend-module-catalog                  0.2.2
  @backstage/plugin-search-backend-module-pg                       0.5.35
  @backstage/plugin-search-backend-module-techdocs                 0.2.2
  @backstage/plugin-search-backend-node                            1.3.2
  @backstage/plugin-search-backend                                 1.5.17
  @backstage/plugin-search-common                                  1.2.14
  @backstage/plugin-search-react                                   1.8.0
  @backstage/plugin-search                                         1.4.17
  @backstage/plugin-signals-backend                                0.2.0
  @backstage/plugin-signals-node                                   0.1.11
  @backstage/plugin-signals-react                                  0.0.5
  @backstage/plugin-signals                                        0.0.10
  @backstage/plugin-techdocs-backend                               1.10.13
  @backstage/plugin-techdocs-common                                0.1.0
  @backstage/plugin-techdocs-module-addons-contrib                 1.1.15
  @backstage/plugin-techdocs-node                                  1.12.11
  @backstage/plugin-techdocs-react                                 1.2.8
  @backstage/plugin-techdocs                                       1.10.10
  @backstage/plugin-user-settings-common                           0.0.1
  @backstage/plugin-user-settings                                  0.8.13
  @backstage/release-manifests                                     0.0.11
  @backstage/repo-tools                                            0.9.7
  @backstage/test-utils                                            1.6.0
  @backstage/theme                                                 0.5.7
  @backstage/types                                                 1.1.1
  @backstage/version-bridge                                        1.0.9

👀 Have you spent some time to check if this bug has been raised before?

  • I checked and didn't find similar issue

Are you willing to submit PR?

No, but I'm happy to collaborate on a PR with someone else

@stephenglass stephenglass added the bug An issue with the system label Oct 7, 2024
@stephenglass stephenglass changed the title 🐛 Bug Report: Error opening Announcement page 🐛 Bug Report: Error opening Announcements page Oct 7, 2024
@kurtaking kurtaking changed the title 🐛 Bug Report: Error opening Announcements page 🐛 Bug Report: [ThemeProvider - mui v5 upgrade] Error opening Announcements page Oct 13, 2024
@kurtaking kurtaking self-assigned this Oct 13, 2024
@kurtaking
Copy link
Contributor

@stephenglass - will look into this tomorrow. This has something to do with the upgrade to mui v5.

What version is your instance on, and are you using a custom theme?

@kurtaking kurtaking added the help wanted Anyone is welcome to open a pull request to fix this issue label Oct 13, 2024
@stephenglass
Copy link
Author

Thanks! I'm using Backstage 1.31.3 and still using MUI v4 with a custom theme.

@kurtaking
Copy link
Contributor

@stephenglass, have you migrated to use the <UnifiedThemeProvider /> ?

@stephenglass
Copy link
Author

@stephenglass, have you migrated to use the <UnifiedThemeProvider /> ?

Yes, we're using <UnifiedThemeProvider /> according to the Backstage docs.

@kurtaking
Copy link
Contributor

@stephenglass, have you migrated to use the <UnifiedThemeProvider /> ?

Yes, we're using <UnifiedThemeProvider /> according to the Backstage docs.

I haven't been able to reproduce this locally. We use a custom theme and a mixute of material 4/5 internally.

@stephenglass
Copy link
Author

I upgraded our Backstage version from 1.31.3 to 1.32.1, dropped the announcements database, restarted and now it's working. I'm honestly at a loss on what the issue was or how it was resolved. Perhaps it was some bad dependency resolution that was fixed by the upgrade, not sure.

@jvanalstyne-mdsol
Copy link

jvanalstyne-mdsol commented Oct 18, 2024

When updating our Backstage version to 1.32.1 and announcements to 0.11.1, I ran into an issue that seems to be very closely related to this.

The errors I see are different (see Details):

TypeError
undefined is not an object (evaluating 'theme.palette.text')
Call Stack
 undefined
  :undefined:undefined
 create
  :undefined:undefined
 attach
  :undefined:undefined
 undefined
  :undefined:undefined
 useSynchronousEffect
  :undefined:undefined
 useStyles
  :undefined:undefined
 AnnouncementsGrid
  :undefined:undefined
 renderWithHooks
  :undefined:undefined
 mountIndeterminateComponent
  :undefined:undefined
 callCallback
  :undefined:undefined
ERROR
undefined is not an object (evaluating 'theme.palette.text')
@
create@
attach@
@
useSynchronousEffect@
useStyles@
AnnouncementsGrid@
renderWithHooks@
mountIndeterminateComponent@
callCallback@
runTask@
invokeTask@
invokeTask@
globalCallback@
dispatchEvent@[native code]
invokeGuardedCallbackDev@
invokeGuardedCallback@
beginWork$1@
performUnitOfWork@
workLoopConcurrent@
renderRootConcurrent@
performConcurrentWorkOnRoot@
workLoop@
flushWork@
performWorkUntilDeadline@

Despite the different errors, it appears the core issue is similar, which is that theme is undefined.
Reverting the announcements plugin to v0.10.3 fixed this, though I haven't tried v0.10.5 which was noted above as working.

I noticed that the announcements plugin's migration to MUI v5 seemed to remove the @backstage/theme dependency, which is normally included when creating a new plugin - could this prevent the UnifiedThemeProvider from being loaded in the plugin's scope, causing these issues?

AFAIU, the theme package does some overriding of MUI's types/props to enable UnifiedThemeProvider to work.

@jvanalstyne-mdsol
Copy link

jvanalstyne-mdsol commented Nov 12, 2024

I am no longer seeing this issue after updating to Backstage v1.32.5 and announcements v0.11.2.

Edit: Added the environment details below where I am no longer experiencing the issue.

Environment details/backstage-cli info dump
"@procore-oss/backstage-plugin-announcements": "^0.11.2"
"@procore-oss/backstage-plugin-announcements-backend": "^0.10.4"
OS:   Darwin 23.6.0 - darwin/arm64
node: v18.19.1
yarn: 1.22.22
cli:  0.28.2 (installed)
backstage:  1.32.5

Dependencies:
  @backstage/app-defaults                                          1.5.12
  @backstage/backend-app-api                                       0.8.0, 1.0.1
  @backstage/backend-common                                        0.23.3, 0.24.1, 0.25.0
  @backstage/backend-defaults                                      0.4.1, 0.5.1, 0.5.2
  @backstage/backend-dev-utils                                     0.1.5
  @backstage/backend-openapi-utils                                 0.2.0
  @backstage/backend-plugin-api                                    0.7.0, 0.8.1, 1.0.1
  @backstage/backend-tasks                                         0.5.27, 0.6.1
  @backstage/backend-test-utils                                    1.0.1, 1.0.2
  @backstage/catalog-client                                        1.7.1
  @backstage/catalog-model                                         1.7.0
  @backstage/cli-common                                            0.1.14
  @backstage/cli-node                                              0.2.9
  @backstage/cli                                                   0.28.2
  @backstage/config-loader                                         1.9.1
  @backstage/config                                                1.2.0
  @backstage/core-app-api                                          1.15.1
  @backstage/core-compat-api                                       0.3.1
  @backstage/core-components                                       0.13.10, 0.14.10, 0.15.1
  @backstage/core-plugin-api                                       1.10.0
  @backstage/dev-utils                                             1.1.2
  @backstage/errors                                                1.2.4
  @backstage/eslint-plugin                                         0.1.10
  @backstage/frontend-app-api                                      0.10.0
  @backstage/frontend-defaults                                     0.1.1
  @backstage/frontend-plugin-api                                   0.8.0, 0.9.0
  @backstage/frontend-test-utils                                   0.2.1
  @backstage/integration-aws-node                                  0.1.12
  @backstage/integration-react                                     1.2.0
  @backstage/integration                                           1.15.1
  @backstage/plugin-api-docs                                       0.11.11
  @backstage/plugin-app-backend                                    0.3.76
  @backstage/plugin-app-node                                       0.1.26
  @backstage/plugin-app                                            0.1.1
  @backstage/plugin-auth-backend-module-atlassian-provider         0.3.1
  @backstage/plugin-auth-backend-module-auth0-provider             0.1.1
  @backstage/plugin-auth-backend-module-aws-alb-provider           0.2.1
  @backstage/plugin-auth-backend-module-azure-easyauth-provider    0.2.1
  @backstage/plugin-auth-backend-module-bitbucket-provider         0.2.1
  @backstage/plugin-auth-backend-module-bitbucket-server-provider  0.1.1
  @backstage/plugin-auth-backend-module-cloudflare-access-provider 0.3.1
  @backstage/plugin-auth-backend-module-gcp-iap-provider           0.3.1
  @backstage/plugin-auth-backend-module-github-provider            0.2.1
  @backstage/plugin-auth-backend-module-gitlab-provider            0.2.1
  @backstage/plugin-auth-backend-module-google-provider            0.2.1
  @backstage/plugin-auth-backend-module-microsoft-provider         0.2.1
  @backstage/plugin-auth-backend-module-oauth2-provider            0.3.1
  @backstage/plugin-auth-backend-module-oauth2-proxy-provider      0.2.1
  @backstage/plugin-auth-backend-module-oidc-provider              0.3.1
  @backstage/plugin-auth-backend-module-okta-provider              0.1.1
  @backstage/plugin-auth-backend-module-onelogin-provider          0.2.1
  @backstage/plugin-auth-backend                                   0.23.1
  @backstage/plugin-auth-node                                      0.4.17, 0.5.3
  @backstage/plugin-auth-react                                     0.1.7
  @backstage/plugin-catalog-backend-module-aws                     0.4.4
  @backstage/plugin-catalog-backend-module-backstage-openapi       0.4.1
  @backstage/plugin-catalog-backend-module-github                  0.7.6
  @backstage/plugin-catalog-backend-module-openapi                 0.2.3
  @backstage/plugin-catalog-backend                                1.27.1
  @backstage/plugin-catalog-common                                 1.1.0
  @backstage/plugin-catalog-graph                                  0.4.11
  @backstage/plugin-catalog-node                                   1.13.1
  @backstage/plugin-catalog-react                                  1.14.0
  @backstage/plugin-catalog                                        1.24.0
  @backstage/plugin-events-backend                                 0.3.13
  @backstage/plugin-events-node                                    0.3.8, 0.4.1, 0.4.4
  @backstage/plugin-home-react                                     0.1.18
  @backstage/plugin-home                                           0.8.0
  @backstage/plugin-kubernetes-common                              0.8.3
  @backstage/plugin-org                                            0.6.31
  @backstage/plugin-permission-backend                             0.5.50
  @backstage/plugin-permission-common                              0.8.1
  @backstage/plugin-permission-node                                0.8.4
  @backstage/plugin-permission-react                               0.4.27
  @backstage/plugin-proxy-backend                                  0.5.7
  @backstage/plugin-scaffolder-common                              1.5.6
  @backstage/plugin-scaffolder-node                                0.4.8
  @backstage/plugin-search-backend-module-catalog                  0.2.4
  @backstage/plugin-search-backend-module-elasticsearch            1.6.1
  @backstage/plugin-search-backend-module-techdocs                 0.3.1
  @backstage/plugin-search-backend-node                            1.3.3, 1.3.4
  @backstage/plugin-search-backend                                 1.6.1
  @backstage/plugin-search-common                                  1.2.14
  @backstage/plugin-search-react                                   1.8.1
  @backstage/plugin-search                                         1.4.18
  @backstage/plugin-signals-node                                   0.1.12
  @backstage/plugin-signals-react                                  0.0.5, 0.0.6
  @backstage/plugin-techdocs-backend                               1.11.1
  @backstage/plugin-techdocs-common                                0.1.0
  @backstage/plugin-techdocs-module-addons-contrib                 1.1.16
  @backstage/plugin-techdocs-node                                  1.12.12
  @backstage/plugin-techdocs-react                                 1.2.9
  @backstage/plugin-techdocs                                       1.11.0
  @backstage/plugin-user-settings-common                           0.0.1
  @backstage/plugin-user-settings                                  0.8.14
  @backstage/release-manifests                                     0.0.11
  @backstage/test-utils                                            1.7.0
  @backstage/theme                                                 0.5.7, 0.6.0
  @backstage/types                                                 1.1.1
  @backstage/version-bridge                                        1.0.10

@lynettelopez
Copy link

I'm on Backstage v1.32.5 and Announcements v0.11.0 - v0.11.2 are all showing this issue for me. The last stable one is v0.10.5.

@matdtr
Copy link

matdtr commented Nov 20, 2024

@jvanalstyne-mdsol could you share the output of yarn why @mui/material ?

I'm also having this issue after the mui v5 update. I suppose me as the others having some mismatch in the version between the various plugins.

@jvanalstyne-mdsol
Copy link

@/jvanalstyne-mdsol could you share the output of yarn why @mui/material ?

I'm also having this issue after the mui v5 update. I suppose me as the others having some mismatch in the version between the various plugins.

Sure thing - here is the output:

=> Found "@mui/[email protected]"
info Has been hoisted to "@mui/material"
info Reasons this module exists
   - "workspace-aggregator-542716a8-8469-406d-bd32-0d8521d1da40" depends on it
   - Hoisted from "_project_#@backstage#theme#@mui#material"
   - Hoisted from "_project_#app#@mui#material"
   - Hoisted from "_project_#@internal#plugin-search#@mui#material"
   - Hoisted from "_project_#@internal#plugin-catalog-react#@mui#material"
   - Hoisted from "_project_#app#@procore-oss#backstage-plugin-announcements#@mui#material"
   - Hoisted from "_project_#app#@pagerduty#backstage-plugin#@mui#material"
   - Hoisted from "_project_#app#backstage-plugin-techdocs-addon-mermaid#@backstage#theme#@mui#material"
   - Hoisted from "_project_#app#@pagerduty#backstage-plugin#@backstage#theme#@mui#material"
info Disk size without dependencies: "22.08MB"
info Disk size with unique dependencies: "34.16MB"
info Disk size with transitive dependencies: "38.86MB"
info Number of shared dependencies: 24
=> Found "@internal/plugin-tech-insights#@mui/[email protected]"
info This module exists because "_project_#@internal#plugin-tech-insights" depends on it.
info Disk size without dependencies: "20.16MB"
info Disk size with unique dependencies: "37.55MB"
info Disk size with transitive dependencies: "45.13MB"
info Number of shared dependencies: 26

Hope this helps!!

@yoramshai
Copy link

same as @lynettelopez it works for me only with "@procore-oss/backstage-plugin-announcements": "^0.10.5"
however, now the admin page is not loading.

@yoramshai
Copy link

Any idea how to work around this ?

@drodil
Copy link
Contributor

drodil commented Nov 25, 2024

I think you should revert the MUI5 update. See this RFC: backstage/backstage#27726

@kurtaking
Copy link
Contributor

I think you should revert the MUI5 update. See this RFC: backstage/backstage#27726

I've been out again the past two weeks - What about this message @drodil?

Quick update, will need to respond to other bits later: Don't migrate back to MUI v4 from v5.

@drodil
Copy link
Contributor

drodil commented Dec 10, 2024

Hi @kurtaking

Yes, there was a discussion about this and it's not necessary to revert MUI5 changes (if they work 😆 ). I reverted my own plugin as it wasn't really functional with MUI5. So I think it's your call!

@kurtaking
Copy link
Contributor

I think the best course of action right now is reverting.

@kurtaking
Copy link
Contributor

Working on this PR to revert back to MUI 4.

@kurtaking
Copy link
Contributor

Working on this PR to revert back to MUI 4.

Looking for reviews on the PR if anyone is interested.

@kurtaking
Copy link
Contributor

Has this resolved itself with the revert to mui 4?

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug An issue with the system help wanted Anyone is welcome to open a pull request to fix this issue
Projects
None yet
Development

No branches or pull requests

7 participants