diff --git a/packages/dashboard-frontend/src/components/WorkspaceProgress/index.tsx b/packages/dashboard-frontend/src/components/WorkspaceProgress/index.tsx index b12bdb216..40f9c6439 100644 --- a/packages/dashboard-frontend/src/components/WorkspaceProgress/index.tsx +++ b/packages/dashboard-frontend/src/components/WorkspaceProgress/index.tsx @@ -21,6 +21,7 @@ import { import { findTargetWorkspace } from '../../services/helpers/factoryFlow/findTargetWorkspace'; import { getLoaderMode, LoaderMode } from '../../services/helpers/factoryFlow/getLoaderMode'; import { AlertItem, DevWorkspaceStatus, LoaderTab } from '../../services/helpers/types'; +import { Workspace } from '../../services/workspace-adapter'; import { AppState } from '../../store'; import * as WorkspaceStore from '../../store/Workspaces'; import { selectAllWorkspaces } from '../../store/Workspaces/selectors'; @@ -69,7 +70,7 @@ export enum Step { type ConditionStepId = `condition-${string}`; export type StepId = Step | ConditionStepId; -class Progress extends React.PureComponent { +class Progress extends React.Component { private readonly wizardRef: React.RefObject; constructor(props: Props) { @@ -107,6 +108,14 @@ class Progress extends React.PureComponent { return true; } + const workspace = this.findTargetWorkspace(this.props); + const conditions = workspace?.ref.status?.conditions || []; + const nextWorkspace = this.findTargetWorkspace(nextProps); + const nextConditions = nextWorkspace?.ref.status?.conditions || []; + if (isEqual(conditions, nextConditions) === false) { + return true; + } + return false; } @@ -119,25 +128,31 @@ class Progress extends React.PureComponent { } private init(): void { - const { allWorkspaces, history } = this.props; + const workspace = this.findTargetWorkspace(this.props); + if (workspace && workspace.status === DevWorkspaceStatus.STARTING) { + const conditions = (workspace.ref.status?.conditions || []).filter( + condition => condition.message, + ) as ConditionType[]; + + const lastScore = this.scoreConditions(this.state.conditions); + const score = this.scoreConditions(conditions); + if (score > lastScore) { + this.setState({ + conditions, + }); + } + } + } + + private findTargetWorkspace(props: Props): Workspace | undefined { + const { allWorkspaces, history } = props; const loaderMode = getLoaderMode(history.location); - if (loaderMode.mode === 'workspace') { - const workspace = findTargetWorkspace(allWorkspaces, loaderMode.workspaceParams); - if (workspace && workspace.status === DevWorkspaceStatus.STARTING) { - const conditions = (workspace.ref.status?.conditions || []).filter( - condition => condition.message, - ) as ConditionType[]; - - const lastScore = this.scoreConditions(this.state.conditions); - const score = this.scoreConditions(conditions); - if (score > lastScore) { - this.setState({ - conditions, - }); - } - } + if (loaderMode.mode !== 'workspace') { + return; } + + return findTargetWorkspace(allWorkspaces, loaderMode.workspaceParams); } private scoreConditions(conditions: ConditionType[]): number {