feat(#4037): move app drawer module into app-defaults plugin

workspaces/app-defaults/.changeset/move-drawer-to-app-defaults.md

@@ -0,0 +1,13 @@
+---
+'@red-hat-developer-hub/backstage-plugin-app-defaults': patch
+'@red-hat-developer-hub/backstage-plugin-app-react': minor
+---
+
+Moved `appDrawerModule` from `@red-hat-developer-hub/backstage-plugin-app-react` into `@red-hat-developer-hub/backstage-plugin-app-defaults` where default module registrations belong. The reusable building blocks (`ApplicationDrawer`, `appDrawerContentDataRef`, `AppDrawerContentBlueprint`, `useAppDrawer`, `DrawerPanel`) remain in app-react.
+
+**Migration:** Update your imports:
+
+```diff
+-import { appDrawerModule } from '@red-hat-developer-hub/backstage-plugin-app-react/alpha';
++import { appDrawerModule } from '@red-hat-developer-hub/backstage-plugin-app-defaults';
+```

workspaces/app-defaults/packages/app/package.json

@@ -44,6 +44,7 @@
     "@mui/icons-material": "^5.18.0",
     "@mui/material": "^5.18.0",
     "@red-hat-developer-hub/backstage-plugin-app-auth": "workspace:^",
+    "@red-hat-developer-hub/backstage-plugin-app-defaults": "workspace:^",
     "@red-hat-developer-hub/backstage-plugin-app-integrations": "workspace:^",
     "@red-hat-developer-hub/backstage-plugin-app-react": "workspace:^",
     "@red-hat-developer-hub/backstage-plugin-global-header": "^1.21.0",

workspaces/app-defaults/packages/app/src/App.tsx

@@ -18,7 +18,7 @@ import { createApp } from '@backstage/frontend-defaults';
 import catalogPlugin from '@backstage/plugin-catalog/alpha';
 import { appAuthModule } from '@red-hat-developer-hub/backstage-plugin-app-auth/alpha';
 import { appIntegrationsModule } from '@red-hat-developer-hub/backstage-plugin-app-integrations/alpha';
-import { appDrawerModule } from '@red-hat-developer-hub/backstage-plugin-app-react/alpha';
+import { appDrawerModule } from '@red-hat-developer-hub/backstage-plugin-app-defaults';
 import {
   globalHeaderModule,
   globalHeaderTranslationsModule,

workspaces/app-defaults/plugins/app-defaults/README.md

@@ -1,8 +1,22 @@
 # @red-hat-developer-hub/backstage-plugin-app-defaults
 
-Empty RHDH app module for the **new frontend system**, registered against `pluginId: 'app'`.
+RHDH app modules for the **new frontend system**, registered against `pluginId: 'app'`.
 
 ## Usage
 
-- **Dynamic loading**: default export is a `FrontendModule` suitable for `@backstage/frontend-dynamic-feature-loader`.
-- **Static / alpha**: import from `@red-hat-developer-hub/backstage-plugin-app-defaults/alpha` for `appDefaultsModule`.
+- **Dynamic loading**: default export is the `appDrawerModule` `FrontendModule` suitable for `@backstage/frontend-dynamic-feature-loader`.
+- **Static**: import from `@red-hat-developer-hub/backstage-plugin-app-defaults` for `appDrawerModule` and `appDefaultsModule`.
+
+### App Integration
+
+```typescript
+import { createApp } from '@backstage/frontend-defaults';
+import { appDrawerModule } from '@red-hat-developer-hub/backstage-plugin-app-defaults';
+
+export default createApp({
+  features: [
+    appDrawerModule,
+    // ...other plugins and modules
+  ],
+});
+```

workspaces/app-defaults/plugins/app-defaults/package.json

@@ -47,7 +47,9 @@
     "postpack": "backstage-cli package postpack"
   },
   "dependencies": {
-    "@backstage/frontend-plugin-api": "^0.17.2"
+    "@backstage/frontend-plugin-api": "^0.17.2",
+    "@backstage/plugin-app-react": "^0.2.4",
+    "@red-hat-developer-hub/backstage-plugin-app-react": "workspace:^"
   },
   "peerDependencies": {
     "react": "^16.13.1 || ^17.0.0 || ^18.0.0"

workspaces/app-defaults/plugins/app-defaults/report-alpha.api.md

@@ -5,7 +5,7 @@
 ```ts
 import { FrontendModule } from '@backstage/frontend-plugin-api';
 
-// @alpha
+// @public
 const appDefaultsModule: FrontendModule;
 export { appDefaultsModule };
 export default appDefaultsModule;

workspaces/app-defaults/plugins/app-defaults/report.api.md

@@ -3,7 +3,13 @@
 > Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
 
 ```ts
+import { FrontendModule } from '@backstage/frontend-plugin-api';
+
+// @public
+export const appDefaultsModule: FrontendModule;
+
 // @public
-const _default: {};
-export default _default;
+const appDrawerModule: FrontendModule;
+export { appDrawerModule };
+export default appDrawerModule;
 ```

workspaces/app-defaults/plugins/app-defaults/src/appDefaultsModule.ts

@@ -20,7 +20,7 @@ import { createFrontendModule } from '@backstage/frontend-plugin-api';
  * Empty RHDH app module for `pluginId: 'app'`.
  * Default-export this module for dynamic frontend loading.
  *
- * @alpha
+ * @public
  */
 export const appDefaultsModule = createFrontendModule({
   pluginId: 'app',

workspaces/app-defaults/plugins/app-react/src/drawer/extensions/appDrawerModule.tsx → workspaces/app-defaults/plugins/app-defaults/src/appDrawerModule.tsx

@@ -19,9 +19,10 @@ import {
   createFrontendModule,
 } from '@backstage/frontend-plugin-api';
 import { AppRootWrapperBlueprint } from '@backstage/plugin-app-react';
-
-import { ApplicationDrawer } from '../components/ApplicationDrawer';
-import { appDrawerContentDataRef } from './appDrawerContentDataRef';
+import {
+  ApplicationDrawer,
+  appDrawerContentDataRef,
+} from '@red-hat-developer-hub/backstage-plugin-app-react/alpha';
 
 /**
  * Wrapper extension that renders the ApplicationDrawer around the app content.
@@ -51,7 +52,7 @@ const appDrawerExtension = AppRootWrapperBlueprint.makeWithOverrides({
  * Registers a wrapper extension that renders the drawer and accepts
  * drawer content contributions via inputs.
  *
- * @alpha
+ * @public
  */
 export const appDrawerModule = createFrontendModule({
   pluginId: 'app',

workspaces/app-defaults/plugins/app-defaults/src/index.ts

@@ -15,9 +15,12 @@
  */
 
 /**
- * Stub package root export for API reporting and bundlers. This plugin targets
- * the new frontend system only; use `./alpha` for public APIs.
+ * New Frontend System: default app modules for the app plugin.
  *
  * @packageDocumentation
  */
-export default {};
+
+export { appDefaultsModule } from './appDefaultsModule';
+export { appDrawerModule } from './appDrawerModule';
+
+export { appDrawerModule as default } from './appDrawerModule';

workspaces/app-defaults/plugins/app-react/README.md

@@ -14,11 +14,12 @@ yarn add @red-hat-developer-hub/backstage-plugin-app-react
 
 ## App Integration
 
-Register the drawer module in your app's `createApp` call:
+Register the drawer module from `@red-hat-developer-hub/backstage-plugin-app-defaults`
+in your app's `createApp` call:
 
 ```typescript
 import { createApp } from '@backstage/frontend-defaults';
-import { appDrawerModule } from '@red-hat-developer-hub/backstage-plugin-app-react/alpha';
+import { appDrawerModule } from '@red-hat-developer-hub/backstage-plugin-app-defaults';
 
 export default createApp({
   features: [
@@ -147,4 +148,3 @@ function MyDrawerContent() {
 
 - `appDrawerContentDataRef` -- extension data ref
 - `AppDrawerContentBlueprint` -- blueprint for contributing drawers
-- `appDrawerModule` -- frontend module (registers the drawer wrapper extension)

workspaces/app-defaults/plugins/app-react/report-alpha.api.md

@@ -6,7 +6,6 @@
 import { ConfigurableExtensionDataRef } from '@backstage/frontend-plugin-api';
 import { ExtensionBlueprint } from '@backstage/frontend-plugin-api';
 import { ExtensionDataRef } from '@backstage/frontend-plugin-api';
-import { FrontendModule } from '@backstage/frontend-plugin-api';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 
 // @public
@@ -67,9 +66,6 @@ export const appDrawerContentDataRef: ConfigurableExtensionDataRef<
   {}
 >;
 
-// @alpha
-export const appDrawerModule: FrontendModule;
-
 // @public
 export const ApplicationDrawer: (
   input: ApplicationDrawerProps,

workspaces/app-defaults/plugins/app-react/src/drawer/index.ts

@@ -20,7 +20,6 @@ export { DrawerPanel } from './components/DrawerPanel';
 
 export { appDrawerContentDataRef } from './extensions/appDrawerContentDataRef';
 export { AppDrawerContentBlueprint } from './extensions/AppDrawerContentBlueprint';
-export { appDrawerModule } from './extensions/appDrawerModule';
 
 export type { ApplicationDrawerProps } from './components/ApplicationDrawer';
 export type { DrawerPanelProps } from './components/DrawerPanel';

workspaces/app-defaults/yarn.lock

@@ -9446,13 +9446,15 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@red-hat-developer-hub/backstage-plugin-app-defaults@workspace:plugins/app-defaults":
+"@red-hat-developer-hub/backstage-plugin-app-defaults@workspace:^, @red-hat-developer-hub/backstage-plugin-app-defaults@workspace:plugins/app-defaults":
   version: 0.0.0-use.local
   resolution: "@red-hat-developer-hub/backstage-plugin-app-defaults@workspace:plugins/app-defaults"
   dependencies:
     "@backstage/cli": "npm:^0.36.3"
     "@backstage/frontend-plugin-api": "npm:^0.17.2"
+    "@backstage/plugin-app-react": "npm:^0.2.4"
     "@backstage/test-utils": "npm:^1.7.19"
+    "@red-hat-developer-hub/backstage-plugin-app-react": "workspace:^"
     "@testing-library/jest-dom": "npm:^6.0.0"
     "@testing-library/react": "npm:^16.0.0"
     "@types/react": "npm:^18"
@@ -14226,6 +14228,7 @@ __metadata:
     "@mui/material": "npm:^5.18.0"
     "@playwright/test": "npm:1.61.1"
     "@red-hat-developer-hub/backstage-plugin-app-auth": "workspace:^"
+    "@red-hat-developer-hub/backstage-plugin-app-defaults": "workspace:^"
     "@red-hat-developer-hub/backstage-plugin-app-integrations": "workspace:^"
     "@red-hat-developer-hub/backstage-plugin-app-react": "workspace:^"
     "@red-hat-developer-hub/backstage-plugin-global-header": "npm:^1.21.0"