From d7ff48817b1d1ac3713ab8cbfae32ec7289ca00c Mon Sep 17 00:00:00 2001 From: blam Date: Mon, 27 Feb 2023 12:45:56 +0100 Subject: [PATCH] chore: moving things around a little Signed-off-by: blam --- .../src/components/TaskSteps/TaskSteps.tsx | 79 ---------------- .../src/components/TaskSteps/index.ts | 16 ---- .../scaffolder-react/src/components/index.ts | 18 ---- .../TaskLogStream/TaskLogStream.test.tsx | 0 .../TaskLogStream/TaskLogStream.tsx | 2 +- .../components/TaskLogStream/index.ts | 0 .../components/TaskSteps/StepIcon.tsx | 0 .../components/TaskSteps/StepTime.test.tsx | 0 .../components/TaskSteps/StepTime.tsx | 0 .../components/TaskSteps}/TaskBorder.test.tsx | 0 .../components/TaskSteps}/TaskBorder.tsx | 2 - .../components/TaskSteps/TaskSteps.test.tsx | 0 .../next/components/TaskSteps/TaskSteps.tsx | 93 +++++++++++++++++++ .../components/TaskSteps}/index.ts | 2 +- .../src/next/components/index.ts | 2 + .../src/next/OngoingTask/OngoingTask.tsx | 24 +++-- 16 files changed, 108 insertions(+), 130 deletions(-) delete mode 100644 plugins/scaffolder-react/src/components/TaskSteps/TaskSteps.tsx delete mode 100644 plugins/scaffolder-react/src/components/TaskSteps/index.ts delete mode 100644 plugins/scaffolder-react/src/components/index.ts rename plugins/scaffolder-react/src/{ => next}/components/TaskLogStream/TaskLogStream.test.tsx (100%) rename plugins/scaffolder-react/src/{ => next}/components/TaskLogStream/TaskLogStream.tsx (99%) rename plugins/scaffolder-react/src/{ => next}/components/TaskLogStream/index.ts (100%) rename plugins/scaffolder-react/src/{ => next}/components/TaskSteps/StepIcon.tsx (100%) rename plugins/scaffolder-react/src/{ => next}/components/TaskSteps/StepTime.test.tsx (100%) rename plugins/scaffolder-react/src/{ => next}/components/TaskSteps/StepTime.tsx (100%) rename plugins/scaffolder-react/src/{components/TaskBorder => next/components/TaskSteps}/TaskBorder.test.tsx (100%) rename plugins/scaffolder-react/src/{components/TaskBorder => next/components/TaskSteps}/TaskBorder.tsx (98%) rename plugins/scaffolder-react/src/{ => next}/components/TaskSteps/TaskSteps.test.tsx (100%) create mode 100644 plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.tsx rename plugins/scaffolder-react/src/{components/TaskBorder => next/components/TaskSteps}/index.ts (90%) diff --git a/plugins/scaffolder-react/src/components/TaskSteps/TaskSteps.tsx b/plugins/scaffolder-react/src/components/TaskSteps/TaskSteps.tsx deleted file mode 100644 index 8b43d5e17b..0000000000 --- a/plugins/scaffolder-react/src/components/TaskSteps/TaskSteps.tsx +++ /dev/null @@ -1,79 +0,0 @@ -/* - * Copyright 2022 The Backstage Authors - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -import React from 'react'; -import { - Stepper as MuiStepper, - Step as MuiStep, - StepButton as MuiStepButton, - StepLabel as MuiStepLabel, - StepIconProps, - Box, -} from '@material-ui/core'; -import { TaskStep } from '@backstage/plugin-scaffolder-common'; -import { type Step } from '@backstage/plugin-scaffolder-react'; -import { StepIcon } from './StepIcon'; -import { StepTime } from './StepTime'; - -/** - * - * @public - */ -export interface StepperProps { - steps: (TaskStep & Step)[]; - activeStep?: number; -} - -/** - * The visual stepper of the task event stream - * - * @public - */ -export const TaskSteps = (props: StepperProps) => { - return ( - - {props.steps.map((step, index) => { - const isCompleted = step.status === 'completed'; - const isFailed = step.status === 'failed'; - const isActive = step.status === 'processing'; - const isSkipped = step.status === 'skipped'; - const stepIconProps: Partial = { - completed: isCompleted, - error: isFailed, - active: isActive, - skipped: isSkipped, - }; - - return ( - - - - {step.name} - - - - - ); - })} - - ); -}; diff --git a/plugins/scaffolder-react/src/components/TaskSteps/index.ts b/plugins/scaffolder-react/src/components/TaskSteps/index.ts deleted file mode 100644 index 91f5537bd3..0000000000 --- a/plugins/scaffolder-react/src/components/TaskSteps/index.ts +++ /dev/null @@ -1,16 +0,0 @@ -/* - * Copyright 2023 The Backstage Authors - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -export { TaskSteps, type StepperProps } from './TaskSteps'; diff --git a/plugins/scaffolder-react/src/components/index.ts b/plugins/scaffolder-react/src/components/index.ts deleted file mode 100644 index b724ed32b5..0000000000 --- a/plugins/scaffolder-react/src/components/index.ts +++ /dev/null @@ -1,18 +0,0 @@ -/* - * Copyright 2023 The Backstage Authors - * - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - */ -export { TaskSteps, type StepperProps } from './TaskSteps'; -export { TaskBorder } from './TaskBorder'; -export { TaskLogStream } from './TaskLogStream'; diff --git a/plugins/scaffolder-react/src/components/TaskLogStream/TaskLogStream.test.tsx b/plugins/scaffolder-react/src/next/components/TaskLogStream/TaskLogStream.test.tsx similarity index 100% rename from plugins/scaffolder-react/src/components/TaskLogStream/TaskLogStream.test.tsx rename to plugins/scaffolder-react/src/next/components/TaskLogStream/TaskLogStream.test.tsx diff --git a/plugins/scaffolder-react/src/components/TaskLogStream/TaskLogStream.tsx b/plugins/scaffolder-react/src/next/components/TaskLogStream/TaskLogStream.tsx similarity index 99% rename from plugins/scaffolder-react/src/components/TaskLogStream/TaskLogStream.tsx rename to plugins/scaffolder-react/src/next/components/TaskLogStream/TaskLogStream.tsx index 973627aa02..4ce1df7a29 100644 --- a/plugins/scaffolder-react/src/components/TaskLogStream/TaskLogStream.tsx +++ b/plugins/scaffolder-react/src/next/components/TaskLogStream/TaskLogStream.tsx @@ -28,7 +28,7 @@ const useStyles = makeStyles({ /** * The text of the event stream * - * @public + * @alpha */ export const TaskLogStream = (props: { logs: { [k: string]: string[] } }) => { const styles = useStyles(); diff --git a/plugins/scaffolder-react/src/components/TaskLogStream/index.ts b/plugins/scaffolder-react/src/next/components/TaskLogStream/index.ts similarity index 100% rename from plugins/scaffolder-react/src/components/TaskLogStream/index.ts rename to plugins/scaffolder-react/src/next/components/TaskLogStream/index.ts diff --git a/plugins/scaffolder-react/src/components/TaskSteps/StepIcon.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/StepIcon.tsx similarity index 100% rename from plugins/scaffolder-react/src/components/TaskSteps/StepIcon.tsx rename to plugins/scaffolder-react/src/next/components/TaskSteps/StepIcon.tsx diff --git a/plugins/scaffolder-react/src/components/TaskSteps/StepTime.test.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/StepTime.test.tsx similarity index 100% rename from plugins/scaffolder-react/src/components/TaskSteps/StepTime.test.tsx rename to plugins/scaffolder-react/src/next/components/TaskSteps/StepTime.test.tsx diff --git a/plugins/scaffolder-react/src/components/TaskSteps/StepTime.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/StepTime.tsx similarity index 100% rename from plugins/scaffolder-react/src/components/TaskSteps/StepTime.tsx rename to plugins/scaffolder-react/src/next/components/TaskSteps/StepTime.tsx diff --git a/plugins/scaffolder-react/src/components/TaskBorder/TaskBorder.test.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/TaskBorder.test.tsx similarity index 100% rename from plugins/scaffolder-react/src/components/TaskBorder/TaskBorder.test.tsx rename to plugins/scaffolder-react/src/next/components/TaskSteps/TaskBorder.test.tsx diff --git a/plugins/scaffolder-react/src/components/TaskBorder/TaskBorder.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/TaskBorder.tsx similarity index 98% rename from plugins/scaffolder-react/src/components/TaskBorder/TaskBorder.tsx rename to plugins/scaffolder-react/src/next/components/TaskSteps/TaskBorder.tsx index 17eea3997a..2d8e99bfe7 100644 --- a/plugins/scaffolder-react/src/components/TaskBorder/TaskBorder.tsx +++ b/plugins/scaffolder-react/src/next/components/TaskSteps/TaskBorder.tsx @@ -28,8 +28,6 @@ const useStyles = makeStyles((theme: BackstageTheme) => ({ /** * The visual progress of the task event stream - * - * @public */ export const TaskBorder = (props: { isComplete: boolean; diff --git a/plugins/scaffolder-react/src/components/TaskSteps/TaskSteps.test.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.test.tsx similarity index 100% rename from plugins/scaffolder-react/src/components/TaskSteps/TaskSteps.test.tsx rename to plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.test.tsx diff --git a/plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.tsx b/plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.tsx new file mode 100644 index 0000000000..cecf3dc76c --- /dev/null +++ b/plugins/scaffolder-react/src/next/components/TaskSteps/TaskSteps.tsx @@ -0,0 +1,93 @@ +/* + * Copyright 2022 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import React from 'react'; +import { + Stepper as MuiStepper, + Step as MuiStep, + StepButton as MuiStepButton, + StepLabel as MuiStepLabel, + StepIconProps, + Box, + Paper, +} from '@material-ui/core'; +import { TaskStep } from '@backstage/plugin-scaffolder-common'; +import { type Step } from '@backstage/plugin-scaffolder-react'; +import { StepIcon } from './StepIcon'; +import { StepTime } from './StepTime'; +import { TaskBorder } from './TaskBorder'; + +/** + * Props for the TaskSteps component + * + * @alpha + */ +export interface TaskStepsProps { + steps: (TaskStep & Step)[]; + activeStep?: number; + isComplete?: boolean; + isError?: boolean; +} + +/** + * The visual stepper of the task event stream + * + * @alpha + */ +export const TaskSteps = (props: TaskStepsProps) => { + return ( + + + + + {props.steps.map((step, index) => { + const isCompleted = step.status === 'completed'; + const isFailed = step.status === 'failed'; + const isActive = step.status === 'processing'; + const isSkipped = step.status === 'skipped'; + const stepIconProps: Partial = + { + completed: isCompleted, + error: isFailed, + active: isActive, + skipped: isSkipped, + }; + + return ( + + + + {step.name} + + + + + ); + })} + + + + ); +}; diff --git a/plugins/scaffolder-react/src/components/TaskBorder/index.ts b/plugins/scaffolder-react/src/next/components/TaskSteps/index.ts similarity index 90% rename from plugins/scaffolder-react/src/components/TaskBorder/index.ts rename to plugins/scaffolder-react/src/next/components/TaskSteps/index.ts index e1559957d1..45ff9ccf7c 100644 --- a/plugins/scaffolder-react/src/components/TaskBorder/index.ts +++ b/plugins/scaffolder-react/src/next/components/TaskSteps/index.ts @@ -13,4 +13,4 @@ * See the License for the specific language governing permissions and * limitations under the License. */ -export { TaskBorder } from './TaskBorder'; +export { TaskSteps, type TaskStepsProps } from './TaskSteps'; diff --git a/plugins/scaffolder-react/src/next/components/index.ts b/plugins/scaffolder-react/src/next/components/index.ts index 60a8fd9a51..083d88927e 100644 --- a/plugins/scaffolder-react/src/next/components/index.ts +++ b/plugins/scaffolder-react/src/next/components/index.ts @@ -20,3 +20,5 @@ export * from './TemplateGroup'; export * from './Workflow'; export * from './TemplateOutputs'; export * from './Form'; +export * from './TaskSteps'; +export * from './TaskLogStream'; diff --git a/plugins/scaffolder/src/next/OngoingTask/OngoingTask.tsx b/plugins/scaffolder/src/next/OngoingTask/OngoingTask.tsx index 84730429dd..fc1c1a7413 100644 --- a/plugins/scaffolder/src/next/OngoingTask/OngoingTask.tsx +++ b/plugins/scaffolder/src/next/OngoingTask/OngoingTask.tsx @@ -18,9 +18,6 @@ import { Page, Header, Content, ErrorPanel } from '@backstage/core-components'; import { useNavigate, useParams } from 'react-router-dom'; import { Box, makeStyles, Paper } from '@material-ui/core'; import { - TaskSteps, - TaskBorder, - TaskLogStream, ScaffolderTaskOutput, useTaskEventStream, } from '@backstage/plugin-scaffolder-react'; @@ -28,7 +25,11 @@ import { nextSelectedTemplateRouteRef } from '../routes'; import { useRouteRef } from '@backstage/core-plugin-api'; import qs from 'qs'; import { ContextMenu } from './ContextMenu'; -import { DefaultTemplateOutputs } from '@backstage/plugin-scaffolder-react/alpha'; +import { + DefaultTemplateOutputs, + TaskLogStream, + TaskSteps, +} from '@backstage/plugin-scaffolder-react/alpha'; const useStyles = makeStyles({ contentWrapper: { @@ -132,15 +133,12 @@ export const OngoingTask = (props: { ) : null} - - - - - - +