Skip to content

Commit 497eb35

Browse files
debsmita1debsmita1
committed
feat(fab): add new mountpoints to support provider
1 parent 350a58b commit 497eb35

File tree

15 files changed

+233
-3
lines changed

15 files changed

+233
-3
lines changed

‎.rhdh/docker/Dockerfile

+1
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,7 @@ COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/roadiehq-backstage-plugin-
7474
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-dynamic-home-page/package.json ./dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-dynamic-home-page/package.json
7575
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import/package.json ./dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import/package.json
7676
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import-backend-dynamic/package.json ./dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import-backend-dynamic/package.json
77+
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/package.json ./dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/package.json
7778
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/parfuemerie-douglas-scaffolder-backend-module-azure-repositories-dynamic/package.json ./dynamic-plugins/wrappers/parfuemerie-douglas-scaffolder-backend-module-azure-repositories-dynamic/package.json
7879
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/pagerduty-backstage-plugin/package.json ./dynamic-plugins/wrappers/pagerduty-backstage-plugin/package.json
7980
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/pagerduty-backstage-plugin-backend-dynamic/package.json ./dynamic-plugins/wrappers/pagerduty-backstage-plugin-backend-dynamic/package.json

‎app-config.dynamic-plugins.yaml

+20
Original file line numberDiff line numberDiff line change
@@ -242,6 +242,14 @@ dynamicPlugins:
242242
anyOf:
243243
- isQuayAvailable
244244
red-hat-developer-hub.backstage-plugin-bulk-import:
245+
mountPoints:
246+
- mountPoint: global.floatingactionbutton/component
247+
config:
248+
slot: 'page-end'
249+
icon: bulkImportIcon
250+
label: 'Bulk import'
251+
toolTip: 'Register multiple repositories in bulk'
252+
to: /bulk-import/repositories
245253
appIcons:
246254
- name: bulkImportIcon
247255
importName: BulkImportIcon
@@ -251,6 +259,18 @@ dynamicPlugins:
251259
menuItem:
252260
icon: bulkImportIcon
253261
text: Bulk import
262+
red-hat-developer-hub.backstage-plugin-global-floating-action-button:
263+
mountPoints:
264+
- mountPoint: application/provider
265+
importName: DynamicGlobalFloatingActionButton
266+
- mountPoint: application/listener # Test and implement this
267+
importName: DynamicGlobalFloatingActionButtonRouteListener
268+
- mountPoint: global.floatingactionbutton/component
269+
config:
270+
icon: github
271+
label: 'Git'
272+
toolTip: 'Github'
273+
to: https://github.com/debsmita1
254274
red-hat-developer-hub.backstage-plugin-dynamic-home-page:
255275
dynamicRoutes:
256276
- path: /

‎docker/Dockerfile

+1
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,7 @@ COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/roadiehq-backstage-plugin-
7575
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-dynamic-home-page/package.json ./dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-dynamic-home-page/package.json
7676
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import/package.json ./dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import/package.json
7777
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import-backend-dynamic/package.json ./dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import-backend-dynamic/package.json
78+
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/package.json ./dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/package.json
7879
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/parfuemerie-douglas-scaffolder-backend-module-azure-repositories-dynamic/package.json ./dynamic-plugins/wrappers/parfuemerie-douglas-scaffolder-backend-module-azure-repositories-dynamic/package.json
7980
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/pagerduty-backstage-plugin/package.json ./dynamic-plugins/wrappers/pagerduty-backstage-plugin/package.json
8081
COPY $EXTERNAL_SOURCE_NESTED/dynamic-plugins/wrappers/pagerduty-backstage-plugin-backend-dynamic/package.json ./dynamic-plugins/wrappers/pagerduty-backstage-plugin-backend-dynamic/package.json

‎dynamic-plugins.default.yaml

+17
Original file line numberDiff line numberDiff line change
@@ -523,6 +523,23 @@ plugins:
523523
icon: bulkImportIcon
524524
text: Bulk import
525525

526+
# Group: Global floating action button
527+
- package: ./dynamic-plugins/dist/red-hat-developer-hub-backstage-plugin-global-floating-action-button
528+
disabled: false
529+
pluginConfig:
530+
dynamicPlugins:
531+
frontend:
532+
red-hat-developer-hub.backstage-plugin-global-floating-action-button:
533+
mountPoints:
534+
- mountPoint: application/context
535+
importName: DynamicGlobalFloatingActionButton
536+
- mountPoint: global.floatingactionbutton/component
537+
config:
538+
icon: github
539+
label: 'Git'
540+
toolTip: 'Github'
541+
to: https://github.com/debsmita1
542+
526543
# Homepage
527544
- package: ./dynamic-plugins/dist/red-hat-developer-hub-backstage-plugin-dynamic-home-page
528545
disabled: false

‎dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-bulk-import/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
"backstage": {
1313
"role": "frontend-plugin",
1414
"supported-versions": "1.32.6",
15-
"pluginId": "red-hat-developer-hub-backstage-plugin-bulk-import-backend",
15+
"pluginId": "red-hat-developer-hub-backstage-plugin-bulk-import",
1616
"pluginPackages": [
1717
"red-hat-developer-hub-backstage-plugin-bulk-import",
1818
"red-hat-developer-hub-backstage-plugin-bulk-import-backend"

‎dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/.eslintignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
dist-dynamic
2+
dist-scalprum

‎dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/.eslintrc.js

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
module.exports = require("@backstage/cli/config/eslint-factory")(__dirname);

‎dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/package.json

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
{
2+
"name": "red-hat-developer-hub-backstage-plugin-global-floating-action-button",
3+
"version": "0.0.3",
4+
"main": "src/index.ts",
5+
"types": "src/index.ts",
6+
"license": "Apache-2.0",
7+
"publishConfig": {
8+
"access": "public",
9+
"main": "dist/index.esm.js",
10+
"types": "dist/index.d.ts"
11+
},
12+
"backstage": {
13+
"role": "frontend-plugin",
14+
"supported-versions": "1.32.5",
15+
"pluginId": "red-hat-developer-hub-backstage-plugin-global-floating-action-button",
16+
"pluginPackages": [
17+
"red-hat-developer-hub-backstage-plugin-global-floating-action-button"
18+
]
19+
},
20+
"sideEffects": false,
21+
"scripts": {
22+
"tsc": "tsc",
23+
"build": "backstage-cli package build",
24+
"lint:check": "backstage-cli package lint",
25+
"test": "backstage-cli package test --passWithNoTests --coverage",
26+
"clean": "backstage-cli package clean",
27+
"export-dynamic": "janus-cli package export-dynamic-plugin --in-place",
28+
"export-dynamic:clean": "run export-dynamic --clean"
29+
},
30+
"dependencies": {
31+
"@mui/material": "5.16.13",
32+
"@red-hat-developer-hub/backstage-plugin-global-floating-action-button": "0.0.3"
33+
},
34+
"devDependencies": {
35+
"@backstage/cli": "0.28.2",
36+
"@janus-idp/cli": "1.18.5",
37+
"typescript": "5.6.3"
38+
},
39+
"scalprum": {
40+
"name": "red-hat-developer-hub.backstage-plugin-global-floating-action-button",
41+
"exposedModules": {
42+
"PluginRoot": "./src/index.ts"
43+
}
44+
},
45+
"files": [
46+
"dist",
47+
"dist-scalprum",
48+
"app-config.yaml"
49+
],
50+
"keywords": [
51+
"backstage",
52+
"plugin"
53+
],
54+
"repository": {
55+
"type": "git",
56+
"url": "https://github.com/redhat-developer/rhdh",
57+
"directory": "dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button"
58+
},
59+
"author": "Red Hat",
60+
"homepage": "https://red.ht/rhdh",
61+
"bugs": "https://issues.redhat.com/browse/RHIDP"
62+
}

‎dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/src/index.ts

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { unstable_ClassNameGenerator as ClassNameGenerator } from "@mui/material/className";
2+
3+
ClassNameGenerator.configure((componentName) => {
4+
return componentName.startsWith("v5-")
5+
? componentName
6+
: `v5-${componentName}`;
7+
});
8+
9+
export * from "@red-hat-developer-hub/backstage-plugin-global-floating-action-button";

‎dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/tsconfig.json

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"extends": "@backstage/cli/config/tsconfig.json",
3+
"include": ["src", "dev", "migrations"],
4+
"exclude": ["node_modules"],
5+
"compilerOptions": {
6+
"outDir": "../../../dist-types/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button",
7+
"rootDir": "."
8+
}
9+
}

‎dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/turbo.json

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"extends": ["//"],
3+
"tasks": {
4+
"tsc": {
5+
"outputs": [
6+
"../../../dist-types/dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button/**"
7+
]
8+
}
9+
}
10+
}

‎packages/app/src/components/DynamicRoot/DynamicRoot.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -220,7 +220,7 @@ export const DynamicRoot = ({
220220
>((acc, { module, importName, mountPoint, scope, config }) => {
221221
const Component = allPlugins[scope]?.[module]?.[importName];
222222
// Only add mount points that have a component
223-
if (Component) {
223+
if (Component || mountPoint === 'global.floatingactionbutton/component') { // Fix this
224224
const ifCondition = configIfToCallable(
225225
Object.fromEntries(
226226
Object.entries(config?.if || {}).map(([k, v]) => [

‎packages/app/src/components/Root/Root.tsx

+19-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React, { PropsWithChildren, useContext, useState } from 'react';
22

33
import {
4+
ErrorBoundary,
45
Sidebar,
56
SidebarDivider,
67
SidebarGroup,
@@ -30,6 +31,7 @@ import { policyEntityReadPermission } from '@janus-idp/backstage-plugin-rbac-com
3031

3132
import DynamicRootContext, {
3233
ResolvedMenuItem,
34+
ScalprumMountPoint,
3335
} from '../DynamicRoot/DynamicRootContext';
3436
import { MenuIcon } from './MenuIcon';
3537
import { SidebarLogo } from './SidebarLogo';
@@ -101,9 +103,24 @@ const getMenuItem = (menuItem: ResolvedMenuItem, isNestedMenuItem = false) => {
101103
);
102104
};
103105

106+
const GlobalFABProvider = ({ context }: { context: ScalprumMountPoint[] }) => {
107+
return context.map(({ Component }, index) => {
108+
return (
109+
<ErrorBoundary
110+
// eslint-disable-next-line react/no-array-index-key
111+
key={index}
112+
>
113+
<Component />
114+
</ErrorBoundary>
115+
);
116+
});
117+
};
118+
104119
export const Root = ({ children }: PropsWithChildren<{}>) => {
105-
const { dynamicRoutes, menuItems } = useContext(DynamicRootContext);
120+
const { dynamicRoutes, menuItems, mountPoints } =
121+
useContext(DynamicRootContext);
106122
const [openItems, setOpenItems] = useState<{ [key: string]: boolean }>({});
123+
const fabContext = mountPoints['application/context'] ?? [];
107124

108125
const { loading: loadingPermission, allowed: canDisplayRBACMenuItem } =
109126
usePermission({
@@ -249,6 +266,7 @@ export const Root = ({ children }: PropsWithChildren<{}>) => {
249266
};
250267
return (
251268
<SidebarPage>
269+
<GlobalFABProvider context={fabContext} />
252270
<Sidebar>
253271
<SidebarLogo />
254272
<SidebarGroup label="Search" icon={<SearchIcon />} to="/search">

‎plugins/dynamic-plugins-info/src/components/InternalPluginsMap.ts

+2
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,8 @@ export const InternalPluginsMap: Record<string, string> = {
6363
'./dynamic-plugins/dist/red-hat-developer-hub-backstage-plugin-bulk-import-backend-dynamic',
6464
'red-hat-developer-hub-backstage-plugin-bulk-import':
6565
'./dynamic-plugins/dist/red-hat-developer-hub-backstage-plugin-bulk-import',
66+
'red-hat-developer-hub-backstage-plugin-global-floating-action-button':
67+
'./dynamic-plugins/dist/red-hat-developer-hub-backstage-plugin-global-floating-action-button',
6668
'red-hat-developer-hub-backstage-plugin-dynamic-home-page':
6769
'./dynamic-plugins/dist/red-hat-developer-hub-backstage-plugin-dynamic-home-page',
6870
'backstage-plugin-techdocs-backend-dynamic':

‎yarn.lock

+78
Original file line numberDiff line numberDiff line change
@@ -12529,6 +12529,22 @@ __metadata:
1252912529
languageName: node
1253012530
linkType: hard
1253112531

12532+
"@mui/icons-material@npm:^5.15.17":
12533+
version: 5.16.14
12534+
resolution: "@mui/icons-material@npm:5.16.14"
12535+
dependencies:
12536+
"@babel/runtime": ^7.23.9
12537+
peerDependencies:
12538+
"@mui/material": ^5.0.0
12539+
"@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0
12540+
react: ^17.0.0 || ^18.0.0 || ^19.0.0
12541+
peerDependenciesMeta:
12542+
"@types/react":
12543+
optional: true
12544+
checksum: 14c01298e47972099ce71a8f142e2bb93dfc61a3ac0239030c55b3e5c6719f692e9c2fac131247c52f4922e74b08291ecb1f3398117222cc7baa82ec6f38e073
12545+
languageName: node
12546+
linkType: hard
12547+
1253212548
"@mui/icons-material@npm:^5.15.19, @mui/icons-material@npm:^5.16.4, @mui/icons-material@npm:^5.16.7":
1253312549
version: 5.16.9
1253412550
resolution: "@mui/icons-material@npm:5.16.9"
@@ -12782,6 +12798,37 @@ __metadata:
1278212798
languageName: node
1278312799
linkType: hard
1278412800

12801+
"@mui/styles@npm:5.16.13":
12802+
version: 5.16.13
12803+
resolution: "@mui/styles@npm:5.16.13"
12804+
dependencies:
12805+
"@babel/runtime": ^7.23.9
12806+
"@emotion/hash": ^0.9.1
12807+
"@mui/private-theming": ^5.16.13
12808+
"@mui/types": ^7.2.15
12809+
"@mui/utils": ^5.16.13
12810+
clsx: ^2.1.0
12811+
csstype: ^3.1.3
12812+
hoist-non-react-statics: ^3.3.2
12813+
jss: ^10.10.0
12814+
jss-plugin-camel-case: ^10.10.0
12815+
jss-plugin-default-unit: ^10.10.0
12816+
jss-plugin-global: ^10.10.0
12817+
jss-plugin-nested: ^10.10.0
12818+
jss-plugin-props-sort: ^10.10.0
12819+
jss-plugin-rule-value-function: ^10.10.0
12820+
jss-plugin-vendor-prefixer: ^10.10.0
12821+
prop-types: ^15.8.1
12822+
peerDependencies:
12823+
"@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0
12824+
react: ^17.0.0 || ^18.0.0 || ^19.0.0
12825+
peerDependenciesMeta:
12826+
"@types/react":
12827+
optional: true
12828+
checksum: 2464d3567264c152a7e8f030554a423c6ab509c85d33d193c298935b439cc62c7fa82b80cd99a477fbcdd463aa8de6e57b99b67445081d56137b5d5c094df192
12829+
languageName: node
12830+
linkType: hard
12831+
1278512832
"@mui/styles@npm:5.16.7, @mui/styles@npm:^5.16.7":
1278612833
version: 5.16.7
1278712834
resolution: "@mui/styles@npm:5.16.7"
@@ -16457,6 +16504,25 @@ __metadata:
1645716504
languageName: node
1645816505
linkType: hard
1645916506

16507+
"@red-hat-developer-hub/backstage-plugin-global-floating-action-button@npm:0.0.3":
16508+
version: 0.0.3
16509+
resolution: "@red-hat-developer-hub/backstage-plugin-global-floating-action-button@npm:0.0.3"
16510+
dependencies:
16511+
"@backstage/core-components": ^0.15.1
16512+
"@backstage/core-plugin-api": ^1.10.0
16513+
"@backstage/theme": ^0.6.0
16514+
"@mui/icons-material": ^5.15.17
16515+
"@mui/material": ^5.15.17
16516+
"@mui/styles": 5.16.13
16517+
classnames: ^2.5.1
16518+
react-use: ^17.2.4
16519+
peerDependencies:
16520+
react: 16.13.1 || ^17.0.0 || ^18.0.0
16521+
react-router-dom: ^6.0.0
16522+
checksum: 7aedbac38030c09ee432b97e9c5cb3f358e31e802751392c183a7d6492b688a2c2c1cb90224226d64fe3ab4da1abf8e8df400bda174b359a96ccb60880493453
16523+
languageName: node
16524+
linkType: hard
16525+
1646016526
"@redhat-developer/red-hat-developer-hub-theme@npm:0.4.0":
1646116527
version: 0.4.0
1646216528
resolution: "@redhat-developer/red-hat-developer-hub-theme@npm:0.4.0"
@@ -40231,6 +40297,18 @@ __metadata:
4023140297
languageName: unknown
4023240298
linkType: soft
4023340299

40300+
"red-hat-developer-hub-backstage-plugin-global-floating-action-button@workspace:dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button":
40301+
version: 0.0.0-use.local
40302+
resolution: "red-hat-developer-hub-backstage-plugin-global-floating-action-button@workspace:dynamic-plugins/wrappers/red-hat-developer-hub-backstage-plugin-global-floating-action-button"
40303+
dependencies:
40304+
"@backstage/cli": 0.28.2
40305+
"@janus-idp/cli": 1.18.5
40306+
"@mui/material": 5.16.13
40307+
"@red-hat-developer-hub/backstage-plugin-global-floating-action-button": 0.0.3
40308+
typescript: 5.6.3
40309+
languageName: unknown
40310+
linkType: soft
40311+
4023440312
"redent@npm:^3.0.0":
4023540313
version: 3.0.0
4023640314
resolution: "redent@npm:3.0.0"

0 commit comments

Comments
 (0)