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}
-
-
-
-
-
-
+