From 6bd02a7fd5793a0e9f4ead117e0aca123c90260a Mon Sep 17 00:00:00 2001 From: blam Date: Tue, 21 Mar 2023 13:37:20 +0100 Subject: [PATCH 1/4] chore: use the FeatureFlagged component to switch Signed-off-by: blam --- packages/app/src/App.tsx | 98 ++++++++++++++++++++++------------------ 1 file changed, 54 insertions(+), 44 deletions(-) diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index 4dacbbc007..81e8769951 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -27,7 +27,7 @@ import { RELATION_PROVIDES_API, } from '@backstage/catalog-model'; import { createApp } from '@backstage/app-defaults'; -import { AppRouter, FlatRoutes } from '@backstage/core-app-api'; +import { AppRouter, FeatureFlagged, FlatRoutes } from '@backstage/core-app-api'; import { AlertDisplay, OAuthRequestDialog, @@ -208,49 +208,59 @@ const routes = ( - - entity?.metadata?.tags?.includes('recommended') ?? false, - }, - ]} - /> - } - > - - - - - - - - - entity?.metadata?.tags?.includes('recommended') ?? false, - }, - ]} - /> - } - > - - - - - - - + + + + + entity?.metadata?.tags?.includes('recommended') ?? false, + }, + ]} + /> + + } + > + + + + + + + + + + + + + entity?.metadata?.tags?.includes('recommended') ?? false, + }, + ]} + /> + + } + > + + + + + + + + + } /> Date: Tue, 21 Mar 2023 13:48:55 +0100 Subject: [PATCH 2/4] chore: tidy up and add some docs about this Signed-off-by: blam --- .../testing-scaffolder-alpha.md | 71 ++++++++++++------- packages/app/src/App.tsx | 43 +++++------ 2 files changed, 64 insertions(+), 50 deletions(-) diff --git a/docs/features/software-templates/testing-scaffolder-alpha.md b/docs/features/software-templates/testing-scaffolder-alpha.md index c0b97e897c..579b3ab873 100644 --- a/docs/features/software-templates/testing-scaffolder-alpha.md +++ b/docs/features/software-templates/testing-scaffolder-alpha.md @@ -52,33 +52,54 @@ And this API should be the exact same as the previous Router, so you should be a ```tsx - entity?.metadata?.tags?.includes('recommended') ?? false, - }, - ]} - /> - } - > - - - {/* ... other extensions */} - - - - {/* ... other layouts */} - - + path="/create" + element={ + {/* highlight-remove-next-line */} + + entity?.metadata?.tags?.includes('recommended') ?? false, + }, + ]} + /> + } +> + + + {/* ... other extensions */} + + + + {/* ... other layouts */} + + ``` +Optionally, you can chose to run the two side by side by using `FeatureFlags` in your `App.tsx` if you wish, but, we would also recommend duplicating any `CustomFieldExtensions` too as the new `CustomFieldExtensions` might not be compatible with the old form. + +```tsx + + }> + + + + + + + }> + + + + + +``` + +You should then be able to enable the `scaffolder-next-preview` feature flag under `/settings/feature-flags` in Backstage. + ### Make the required changes to your `CustomFieldExtensions` There's differently named function for creating field extensions part of the `/alpha` exports as these are the ones that can contain breaking changes because of the breaking changes that have been applied in `react-jsonschema-form`. diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index 81e8769951..0c7187c93f 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -208,22 +208,19 @@ const routes = ( - - - entity?.metadata?.tags?.includes('recommended') ?? false, - }, - ]} - /> - + + entity?.metadata?.tags?.includes('recommended') ?? false, + }, + ]} + /> } > @@ -234,22 +231,19 @@ const routes = ( - - - entity?.metadata?.tags?.includes('recommended') ?? false, - }, - ]} - /> - + + entity?.metadata?.tags?.includes('recommended') ?? false, + }, + ]} + /> } > @@ -260,7 +254,6 @@ const routes = ( - } /> Date: Tue, 21 Mar 2023 13:56:58 +0100 Subject: [PATCH 3/4] chore: tidu up the templat Signed-off-by: blam --- packages/app/src/App.tsx | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index 0c7187c93f..1ee6978a87 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -117,10 +117,13 @@ const app = createApp({ // Custom icon example alert: AlarmIcon, }, - // Example of application level feature flag - // featureFlags: [ - // { name: 'tech-radar', description: 'Enables the tech radar plugin' }, - // ], + featureFlags: [ + { + name: 'scaffolder-next-preview', + description: 'Preview the new Scaffolder Next', + pluginId: '', + }, + ], components: { SignInPage: props => { return ( @@ -208,7 +211,7 @@ const routes = ( - + - + - + From d2a46ab08a52fd4e7ef2dd30c43185ad7733334f Mon Sep 17 00:00:00 2001 From: Ben Lambert Date: Tue, 21 Mar 2023 14:56:40 +0100 Subject: [PATCH 4/4] Update docs/features/software-templates/testing-scaffolder-alpha.md Co-authored-by: Patrik Oldsberg Signed-off-by: Ben Lambert --- docs/features/software-templates/testing-scaffolder-alpha.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/features/software-templates/testing-scaffolder-alpha.md b/docs/features/software-templates/testing-scaffolder-alpha.md index 579b3ab873..138f4621d8 100644 --- a/docs/features/software-templates/testing-scaffolder-alpha.md +++ b/docs/features/software-templates/testing-scaffolder-alpha.md @@ -79,7 +79,7 @@ And this API should be the exact same as the previous Router, so you should be a ``` -Optionally, you can chose to run the two side by side by using `FeatureFlags` in your `App.tsx` if you wish, but, we would also recommend duplicating any `CustomFieldExtensions` too as the new `CustomFieldExtensions` might not be compatible with the old form. +Optionally, you can choose to run the two side by side by using `FeatureFlags` in your `App.tsx` if you wish, but, we would also recommend duplicating any `CustomFieldExtensions` too as the new `CustomFieldExtensions` might not be compatible with the old form. ```tsx