diff --git a/.changeset/smart-boxes-double.md b/.changeset/smart-boxes-double.md new file mode 100644 index 0000000000..81d708297e --- /dev/null +++ b/.changeset/smart-boxes-double.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-scaffolder': patch +--- + +The ScaffolderPage can be passed an optional `TaskPageComponent` with a `loadingText` string. It will replace the Loading text in the scaffolder task page. diff --git a/plugins/scaffolder/api-report.md b/plugins/scaffolder/api-report.md index 80b5faf201..f8ae64cd82 100644 --- a/plugins/scaffolder/api-report.md +++ b/plugins/scaffolder/api-report.md @@ -255,6 +255,7 @@ export const ScaffolderFieldExtensions: React_2.ComponentType; // @public (undocumented) export const ScaffolderPage: ({ TemplateCardComponent, + TaskPageComponent, groups, }: { TemplateCardComponent?: @@ -262,6 +263,7 @@ export const ScaffolderPage: ({ template: TemplateEntityV1beta2; }> | undefined; + TaskPageComponent?: ComponentType<{}> | undefined; groups?: | { title?: string | undefined; @@ -285,6 +287,14 @@ const scaffolderPlugin: BackstagePlugin< export { scaffolderPlugin as plugin }; export { scaffolderPlugin }; +// @public +export const TaskPage: ({ loadingText }: TaskPageProps) => JSX.Element; + +// @public +export type TaskPageProps = { + loadingText?: string; +}; + // Warning: (ae-missing-release-tag) "TemplateList" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) diff --git a/plugins/scaffolder/src/components/Router.tsx b/plugins/scaffolder/src/components/Router.tsx index ab79f9dec3..601844780d 100644 --- a/plugins/scaffolder/src/components/Router.tsx +++ b/plugins/scaffolder/src/components/Router.tsx @@ -35,6 +35,7 @@ type RouterProps = { TemplateCardComponent?: | ComponentType<{ template: TemplateEntityV1beta2 }> | undefined; + TaskPageComponent?: ComponentType<{}>; groups?: Array<{ title?: string; titleComponent?: React.ReactNode; @@ -42,8 +43,13 @@ type RouterProps = { }>; }; -export const Router = ({ TemplateCardComponent, groups }: RouterProps) => { +export const Router = ({ + TemplateCardComponent, + TaskPageComponent, + groups, +}: RouterProps) => { const outlet = useOutlet(); + const TaskPageElement = TaskPageComponent || TaskPage; const customFieldExtensions = useElementFilter(outlet, elements => elements @@ -84,7 +90,7 @@ export const Router = ({ TemplateCardComponent, groups }: RouterProps) => { } /> - } /> + } /> } /> ); diff --git a/plugins/scaffolder/src/components/TaskPage/TaskPage.tsx b/plugins/scaffolder/src/components/TaskPage/TaskPage.tsx index 9f5dad2adc..d6933cd26b 100644 --- a/plugins/scaffolder/src/components/TaskPage/TaskPage.tsx +++ b/plugins/scaffolder/src/components/TaskPage/TaskPage.tsx @@ -218,7 +218,23 @@ export const TaskStatusStepper = memo( const hasLinks = ({ entityRef, remoteUrl, links = [] }: TaskOutput): boolean => !!(entityRef || remoteUrl || links.length > 0); -export const TaskPage = () => { +/** + * TaskPageProps for constructing a TaskPage + * @param loadingText - Optional loading text shown before a task begins executing. + * + * @public + */ +export type TaskPageProps = { + loadingText?: string; +}; + +/** + * TaskPage for showing the status of the taskId provided as a param + * @param loadingText - Optional loading text shown before a task begins executing. + * + * @public + */ +export const TaskPage = ({ loadingText }: TaskPageProps) => { const classes = useStyles(); const navigate = useNavigate(); const rootLink = useRouteRef(rootRouteRef); @@ -256,7 +272,7 @@ export const TaskPage = () => { const logAsString = useMemo(() => { if (!currentStepId) { - return 'Loading...'; + return loadingText ? loadingText : 'Loading...'; } const log = taskStream.stepLogs[currentStepId]; @@ -264,7 +280,7 @@ export const TaskPage = () => { return 'Waiting for logs...'; } return log.join('\n'); - }, [taskStream.stepLogs, currentStepId]); + }, [taskStream.stepLogs, currentStepId, loadingText]); const taskNotFound = taskStream.completed === true && diff --git a/plugins/scaffolder/src/components/TaskPage/index.ts b/plugins/scaffolder/src/components/TaskPage/index.ts index 809b45101b..f7876888f9 100644 --- a/plugins/scaffolder/src/components/TaskPage/index.ts +++ b/plugins/scaffolder/src/components/TaskPage/index.ts @@ -14,3 +14,4 @@ * limitations under the License. */ export { TaskPage } from './TaskPage'; +export type { TaskPageProps } from './TaskPage'; diff --git a/plugins/scaffolder/src/index.ts b/plugins/scaffolder/src/index.ts index 133234e20b..adb2aab035 100644 --- a/plugins/scaffolder/src/index.ts +++ b/plugins/scaffolder/src/index.ts @@ -57,3 +57,5 @@ export { TemplateList } from './components/TemplateList'; export type { TemplateListProps } from './components/TemplateList'; export { TemplateTypePicker } from './components/TemplateTypePicker'; export * from './components/secrets'; +export { TaskPage } from './components/TaskPage'; +export type { TaskPageProps } from './components/TaskPage';