Migrate Bazaar Plugin MUI to BUI#9799
Open
AmbrishRamachandiran wants to merge 3 commits into
Open
Conversation
Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>
Contributor
Changed Packages
|
Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>
Contributor
There was a problem hiding this comment.
Pull request overview
Migrates the Bazaar plugin UI away from Material-UI v4 styling patterns toward Backstage UI (BUI), switching components to @backstage/ui, replacing MUI icons with Remix Icons, and moving styling from makeStyles to CSS Modules within the Bazaar workspace.
Changes:
- Add BUI + Remix Icons dependencies and remove
@material-ui/icons. - Replace MUI
makeStylesusage with.module.cssstyling across multiple components. - Migrate selected UI elements (buttons, text/typography, grids, cards, icon buttons) from MUI to
@backstage/ui.
Reviewed changes
Copilot reviewed 38 out of 39 changed files in this pull request and generated 6 comments.
Show a summary per file
| File | Description |
|---|---|
| workspaces/bazaar/yarn.lock | Locks new @backstage/ui and @remixicon/react dependencies and removes @material-ui/icons. |
| workspaces/bazaar/plugins/bazaar/package.json | Adds @backstage/ui and @remixicon/react, removes @material-ui/icons. |
| workspaces/bazaar/plugins/bazaar/.eslintrc.js | Disables react/forbid-elements to allow additional native elements used in the migration. |
| workspaces/bazaar/plugins/bazaar/src/components/UserSelector/UserSelector.tsx | Replaces makeStyles usage with CSS module classes. |
| workspaces/bazaar/plugins/bazaar/src/components/UserSelector/UserSelector.module.css | Adds CSS module styles for UserSelector. |
| workspaces/bazaar/plugins/bazaar/src/components/SortView/SortView.tsx | Migrates MUI Button to BUI Button and moves styles to CSS modules. |
| workspaces/bazaar/plugins/bazaar/src/components/SortView/SortView.module.css | Adds CSS module styles for SortView. |
| workspaces/bazaar/plugins/bazaar/src/components/SortMethodSelector/SortMethodSelector.tsx | Moves makeStyles styling to CSS modules. |
| workspaces/bazaar/plugins/bazaar/src/components/SortMethodSelector/SortMethodSelector.module.css | Adds CSS module styles for SortMethodSelector. |
| workspaces/bazaar/plugins/bazaar/src/components/ProjectSelector/ProjectSelector.tsx | Migrates MUI Typography to BUI Text and adopts CSS modules. |
| workspaces/bazaar/plugins/bazaar/src/components/ProjectSelector/ProjectSelector.module.css | Adds CSS module styles for ProjectSelector. |
| workspaces/bazaar/plugins/bazaar/src/components/ProjectPreview/ProjectPreview.tsx | Migrates MUI grid usage to BUI Grid layout and CSS modules. |
| workspaces/bazaar/plugins/bazaar/src/components/ProjectPreview/ProjectPreview.module.css | Adds CSS module styles for ProjectPreview. |
| workspaces/bazaar/plugins/bazaar/src/components/ProjectDialog/ProjectDialog.tsx | Migrates MUI Button to BUI Button API (onPress, variant). |
| workspaces/bazaar/plugins/bazaar/src/components/ProjectCard/ProjectCard.tsx | Replaces MUI Card components with a styled native button + BUI Text. |
| workspaces/bazaar/plugins/bazaar/src/components/ProjectCard/ProjectCard.module.css | Adds CSS module styles for the new button-based card layout. |
| workspaces/bazaar/plugins/bazaar/src/components/LinkProjectDialog/LinkProjectDialog.tsx | Migrates action button to BUI and moves dialog content padding to CSS module. |
| workspaces/bazaar/plugins/bazaar/src/components/LinkProjectDialog/LinkProjectDialog.module.css | Adds CSS module styles for LinkProjectDialog. |
| workspaces/bazaar/plugins/bazaar/src/components/HomePageBazaarInfoCard/HomePageBazaarInfoCard.tsx | Migrates header/actions to BUI (ButtonIcon, Text) and switches icons to Remix. |
| workspaces/bazaar/plugins/bazaar/src/components/HomePageBazaarInfoCard/HomePageBazaarInfoCard.module.css | Adds CSS module styles for the new header layout and divider styling. |
| workspaces/bazaar/plugins/bazaar/src/components/EntityBazaarInfoContent/EntityBazaarInfoContent.tsx | Migrates header/actions to BUI and switches icons to Remix. |
| workspaces/bazaar/plugins/bazaar/src/components/EntityBazaarInfoContent/EntityBazaarInfoContent.module.css | Adds CSS module styles for EntityBazaarInfoContent header and divider. |
| workspaces/bazaar/plugins/bazaar/src/components/EntityBazaarInfoCard/EntityBazaarInfoCard.tsx | Migrates container Card to BUI. |
| workspaces/bazaar/plugins/bazaar/src/components/EditProjectDialog/EditProjectDialog.tsx | Migrates buttons/typography styling to BUI + CSS modules. |
| workspaces/bazaar/plugins/bazaar/src/components/EditProjectDialog/EditProjectDialog.module.css | Adds CSS module styles for EditProjectDialog. |
| workspaces/bazaar/plugins/bazaar/src/components/DoubleDateSelector/DoubleDateSelector.tsx | Replaces MUI typography separator with native element + CSS module styling. |
| workspaces/bazaar/plugins/bazaar/src/components/DoubleDateSelector/DoubleDateSelector.module.css | Adds CSS module styles for DoubleDateSelector. |
| workspaces/bazaar/plugins/bazaar/src/components/DateSelector/DateSelector.tsx | Replaces MUI clear icon button with BUI ButtonIcon + Remix icon. |
| workspaces/bazaar/plugins/bazaar/src/components/CustomDialogTitle/CustomDialogTitle.tsx | Migrates title/close button to BUI and moves styles to CSS modules. |
| workspaces/bazaar/plugins/bazaar/src/components/CustomDialogTitle/CustomDialogTitle.module.css | Adds CSS module styles for custom dialog title/content/actions. |
| workspaces/bazaar/plugins/bazaar/src/components/ConfirmationDialog/ConfirmationDialog.tsx | Migrates confirmation button to BUI (onPress, variant). |
| workspaces/bazaar/plugins/bazaar/src/components/CardContentFields/CardContentFields.tsx | Migrates layout/typography/card to BUI Grid, Card, CardBody, Text; moves styles to CSS modules. |
| workspaces/bazaar/plugins/bazaar/src/components/CardContentFields/CardContentFields.module.css | Adds CSS module styles for avatar sizing and member alignment. |
| workspaces/bazaar/plugins/bazaar/src/components/CardContentFields/AboutField.tsx | Replaces MUI Grid/Typography/makeStyles with BUI Text + CSS module styling. |
| workspaces/bazaar/plugins/bazaar/src/components/CardContentFields/AboutField.module.css | Adds CSS module styles for AboutField label/value. |
| workspaces/bazaar/plugins/bazaar/src/components/BazaarOverviewCard/BazaarOverviewCard.tsx | Switches action icon to Remix and removes MUI IconButton wrapper. |
| workspaces/bazaar/plugins/bazaar/src/components/About/About.tsx | Migrates layout/typography to BUI Grid/Text and CSS module styling. |
| workspaces/bazaar/plugins/bazaar/src/components/About/About.module.css | Adds CSS module styles for About page subheaders. |
Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>
awanlin
requested changes
Jul 14, 2026
awanlin
left a comment
Contributor
There was a problem hiding this comment.
Same feedback as from there: #9784 (review)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Migrate Bazaar Plugin MUI to BUI