fix(bulk-import): use rhdhThemeModule in NFS app and fix changeset to minor (#2568)

Signed-off-by: its-mitesh-kumar <itsmiteshkumar98@gmail.com>

Author: its-mitesh-kumar

workspaces/bulk-import/.changeset/itchy-geckos-change.md

@@ -1,5 +1,5 @@
 ---
-'@red-hat-developer-hub/backstage-plugin-bulk-import': patch
+'@red-hat-developer-hub/backstage-plugin-bulk-import': minor
 '@red-hat-developer-hub/backstage-plugin-bulk-import-common': patch
 '@red-hat-developer-hub/backstage-plugin-bulk-import-backend': patch
 ---

workspaces/bulk-import/.changeset/update-nfs-theme-module.md

@@ -0,0 +1,5 @@
+---
+'@red-hat-developer-hub/backstage-plugin-bulk-import': patch
+---
+
+Updated NFS app and dev harness to use `rhdhThemeModule` from `@red-hat-developer-hub/backstage-plugin-theme/alpha` instead of manually constructing ThemeBlueprint extensions

workspaces/bulk-import/packages/app/package.json

@@ -56,7 +56,7 @@
     "@mui/material": "5.18.0",
     "@mui/styles": "5.18.0",
     "@red-hat-developer-hub/backstage-plugin-bulk-import": "workspace:^",
-    "@red-hat-developer-hub/backstage-plugin-theme": "^0.12.0",
+    "@red-hat-developer-hub/backstage-plugin-theme": "^0.13.0",
     "react": "^18.0.2",
     "react-dom": "^18.0.2",
     "react-router-dom": "^6.3.0"
@@ -72,7 +72,7 @@
     "@backstage/dev-utils": "^1.1.19",
     "@backstage/test-utils": "^1.7.14",
     "@playwright/test": "1.57.0",
-    "@red-hat-developer-hub/backstage-plugin-theme": "^0.11.0",
+    "@red-hat-developer-hub/backstage-plugin-theme": "^0.13.0",
     "@spotify/prettier-config": "^15.0.0",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",

workspaces/bulk-import/packages/app/src/App.tsx

@@ -17,13 +17,12 @@
 import { createApp } from '@backstage/frontend-defaults';
 import {
   SignInPageBlueprint,
-  ThemeBlueprint,
   createFrontendModule,
   githubAuthApiRef,
   gitlabAuthApiRef,
 } from '@backstage/frontend-plugin-api';
 import { SignInPage } from '@backstage/core-components';
-import { getThemes } from '@red-hat-developer-hub/backstage-plugin-theme';
+import { rhdhThemeModule } from '@red-hat-developer-hub/backstage-plugin-theme/alpha';
 
 import { navModule } from './modules/nav';
 
@@ -70,23 +69,6 @@ const signInModule = createFrontendModule({
   extensions: [signInPageExtension],
 });
 
-// Create theme extensions from RHDH themes
-const rhdhThemes = getThemes();
-const themeExtensions = rhdhThemes.map(theme =>
-  ThemeBlueprint.make({
-    name: theme.id,
-    params: {
-      theme: theme,
-    },
-  }),
-);
-
-// Wrap themes in a module
-const themesModule = createFrontendModule({
-  pluginId: 'app',
-  extensions: themeExtensions,
-});
-
 /**
  * NFS app: A Backstage app using the New Frontend System (NFS)
  *
@@ -108,8 +90,8 @@ const app = createApp({
     userSettingsPlugin,
     // Sign-in module with GitHub and GitLab providers
     signInModule,
-    // RHDH themes (light/dark modes)
-    themesModule,
+    // RHDH themes
+    rhdhThemeModule,
     // Translations module (language selector configured via app-config.yaml)
     bulkImportTranslationsModule,
     // Custom sidebar with logo

workspaces/bulk-import/plugins/bulk-import/dev/index.tsx

@@ -39,10 +39,7 @@ import {
   ApiBlueprint,
   createFrontendModule,
 } from '@backstage/frontend-plugin-api';
-import {
-  NavContentBlueprint,
-  ThemeBlueprint,
-} from '@backstage/plugin-app-react';
+import { NavContentBlueprint } from '@backstage/plugin-app-react';
 import { catalogApiRef } from '@backstage/plugin-catalog-react';
 import { permissionApiRef } from '@backstage/plugin-permission-react';
 import { mockApis } from '@backstage/test-utils';
@@ -53,7 +50,7 @@ import Menu from '@material-ui/core/Menu';
 import MenuItem from '@material-ui/core/MenuItem';
 import AutoIcon from '@mui/icons-material/BrightnessAuto';
 
-import { getAllThemes } from '@red-hat-developer-hub/backstage-plugin-theme';
+import { rhdhThemeModule } from '@red-hat-developer-hub/backstage-plugin-theme/alpha';
 
 import bulkImportPlugin, { bulkImportTranslationsModule } from '../src/alpha';
 import {
@@ -207,16 +204,9 @@ const devSidebarContent = NavContentBlueprint.make({
   },
 });
 
-const themeExtensions = getAllThemes().map(theme =>
-  ThemeBlueprint.make({
-    name: theme.id,
-    params: { theme },
-  }),
-);
-
 const devNavModule = createFrontendModule({
   pluginId: 'app',
-  extensions: [devSidebarContent, ...themeExtensions],
+  extensions: [devSidebarContent],
 });
 
 const defaultPage = '/bulk-import';
@@ -226,6 +216,7 @@ const app = createApp({
     bulkImportPlugin,
     bulkImportTranslationsModule,
     bulkImportDevModule,
+    rhdhThemeModule,
     devNavModule,
   ],
 });

workspaces/bulk-import/plugins/bulk-import/package.json

@@ -84,7 +84,7 @@
     "@backstage/ui": "^0.11.2",
     "@material-ui/core": "^4.12.4",
     "@playwright/test": "1.57.0",
-    "@red-hat-developer-hub/backstage-plugin-theme": "^0.12.0",
+    "@red-hat-developer-hub/backstage-plugin-theme": "^0.13.0",
     "@spotify/prettier-config": "^15.0.0",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.0.0",

workspaces/bulk-import/yarn.lock

@@ -12350,7 +12350,7 @@ __metadata:
     "@mui/styles": "npm:5.18.0"
     "@playwright/test": "npm:1.57.0"
     "@red-hat-developer-hub/backstage-plugin-bulk-import-common": "workspace:^"
-    "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.12.0"
+    "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.13.0"
     "@spotify/prettier-config": "npm:^15.0.0"
     "@tanstack/react-query": "npm:^4.29.21"
     "@testing-library/dom": "npm:^10.0.0"
@@ -12570,9 +12570,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@red-hat-developer-hub/backstage-plugin-theme@npm:^0.12.0":
-  version: 0.12.1
-  resolution: "@red-hat-developer-hub/backstage-plugin-theme@npm:0.12.1"
+"@red-hat-developer-hub/backstage-plugin-theme@npm:^0.13.0":
+  version: 0.13.0
+  resolution: "@red-hat-developer-hub/backstage-plugin-theme@npm:0.13.0"
   dependencies:
     "@mui/icons-material": "npm:^5.17.1"
   peerDependencies:
@@ -12582,7 +12582,7 @@ __metadata:
     "@mui/icons-material": ^5.17.1
     "@mui/material": ^5.0.0
     react: ^16.13.1 || ^17.0.0 || ^18.0.0
-  checksum: 10c0/99506cde84cf8ad35c367a9625ea19e453685f0067f8ba6e058e90daf427e11b009e2c83f06b3a0ab23bd2395116ef9005262128553b098db97ef48b187fd06b
+  checksum: 10c0/561c04203e9047f4df3fd9a0c29eb0e6b578740899dc3da07870f807a4c3324fb6880e2501f168b60d9a121521eb1f6a9d65d9d837e803f469415e2c0f526053
   languageName: node
   linkType: hard
 
@@ -17293,7 +17293,7 @@ __metadata:
     "@mui/styles": "npm:5.18.0"
     "@playwright/test": "npm:1.57.0"
     "@red-hat-developer-hub/backstage-plugin-bulk-import": "workspace:^"
-    "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.11.0"
+    "@red-hat-developer-hub/backstage-plugin-theme": "npm:^0.13.0"
     "@spotify/prettier-config": "npm:^15.0.0"
     "@testing-library/dom": "npm:^10.0.0"
     "@testing-library/jest-dom": "npm:^6.0.0"