From 7525feaa87890716dc64c5c0274846bff9e68593 Mon Sep 17 00:00:00 2001 From: "yp.wu" Date: Tue, 16 Apr 2024 15:20:41 +0800 Subject: [PATCH] AMD-902 [frontend] feat: not show step alert when step value is empty string --- .../PipelineMetricSelection/index.tsx | 4 +- .../SingleSelection/index.tsx | 4 +- frontend/src/context/Metrics/metricsSlice.ts | 46 +++++++++++++------ 3 files changed, 35 insertions(+), 19 deletions(-) diff --git a/frontend/src/containers/MetricsStep/DeploymentFrequencySettings/PipelineMetricSelection/index.tsx b/frontend/src/containers/MetricsStep/DeploymentFrequencySettings/PipelineMetricSelection/index.tsx index 9f288684aa..97e8fdfd68 100644 --- a/frontend/src/containers/MetricsStep/DeploymentFrequencySettings/PipelineMetricSelection/index.tsx +++ b/frontend/src/containers/MetricsStep/DeploymentFrequencySettings/PipelineMetricSelection/index.tsx @@ -99,7 +99,7 @@ export const PipelineMetricSelection = ({ isLoadingRef.current = isLoading; }, [isLoading, setLoadingCompletedNumber, totalPipelineNumber, shouldGetPipelineConfig]); - const handleGetPipelineData = (_pipelineName: string, flag = false) => { + const handleGetPipelineData = (_pipelineName: string) => { const { params, buildId, organizationId, pipelineType, token } = selectStepsParams( store.getState(), organization, @@ -121,7 +121,7 @@ export const PipelineMetricSelection = ({ pipelineCrews, }), ); - res?.haveStep && dispatch(updatePipelineStep({ steps, id, type, branches, pipelineCrews, flag })); + res?.haveStep && dispatch(updatePipelineStep({ steps, id, type, branches, pipelineCrews })); dispatch(updateShouldGetPipelineConfig(false)); } res && setIsShowNoStepWarning(!res.haveStep); diff --git a/frontend/src/containers/MetricsStep/DeploymentFrequencySettings/SingleSelection/index.tsx b/frontend/src/containers/MetricsStep/DeploymentFrequencySettings/SingleSelection/index.tsx index eed4d38834..70082169d3 100644 --- a/frontend/src/containers/MetricsStep/DeploymentFrequencySettings/SingleSelection/index.tsx +++ b/frontend/src/containers/MetricsStep/DeploymentFrequencySettings/SingleSelection/index.tsx @@ -17,7 +17,7 @@ interface Props { id: number; isError?: boolean; errorText?: string; - onGetSteps?: (pipelineName: string, flag: boolean) => void; + onGetSteps?: (pipelineName: string) => void; onUpDatePipeline: (id: number, label: string, value: string | []) => void; } @@ -40,7 +40,7 @@ export const SingleSelection = ({ if (onGetSteps) { onUpDatePipeline(id, 'Step', ''); onUpDatePipeline(id, 'Branches', []); - onGetSteps(value, true); + onGetSteps(value); dispatch(initSinglePipelineListBranches(id)); } onUpDatePipeline(id, label, value); diff --git a/frontend/src/context/Metrics/metricsSlice.ts b/frontend/src/context/Metrics/metricsSlice.ts index 4fb8f7a3e4..2d21df31a1 100644 --- a/frontend/src/context/Metrics/metricsSlice.ts +++ b/frontend/src/context/Metrics/metricsSlice.ts @@ -18,6 +18,7 @@ export interface IPipelineConfig { pipelineName: string; step: string; branches: string[]; + isStepSelected?: boolean; } export interface IReworkConfig { @@ -30,6 +31,7 @@ export interface IPipelineWarningMessageConfig { organization: string | null; pipelineName: string | null; step: string | null; + isStepSelected?: boolean; } export interface ICycleTimeSetting { @@ -483,7 +485,7 @@ export const metricsSlice = createSlice({ const uniqueResponse = (res: IPipelineConfig[]) => { const itemsOmitId = uniqWith( - res.map((value) => omit(value, ['id'])), + res.map((value) => omit(value, ['id', 'isStepSelected'])), isEqual, ); let removeEmpty = itemsOmitId; @@ -506,7 +508,7 @@ export const metricsSlice = createSlice({ const hasPipeline = pipelines.filter(({ id }) => id !== undefined).length; const res = pipelines.length && hasPipeline - ? pipelines.map(({ id, organization, pipelineName, step, branches }) => { + ? pipelines.map(({ id, organization, pipelineName, step, branches, isStepSelected }) => { const matchedOrganization = orgNames.find((i) => (i as string).toLowerCase() === organization.toLowerCase()) || ''; const matchedPipelineName = filteredPipelineNames(organization).includes(pipelineName) @@ -514,13 +516,14 @@ export const metricsSlice = createSlice({ : ''; return { id, + isStepSelected: isStepSelected ? isStepSelected : false, organization: matchedOrganization, pipelineName: matchedPipelineName, step: matchedPipelineName ? step : '', branches: matchedPipelineName ? branches : [], }; }) - : [{ id: 0, organization: '', pipelineName: '', step: '', branches: [] }]; + : [{ id: 0, organization: '', pipelineName: '', step: '', branches: [], isStepSelected: false }]; return uniqueResponse(res); }; const createPipelineWarning = ({ id, organization, pipelineName }: IPipelineConfig) => { @@ -555,21 +558,27 @@ export const metricsSlice = createSlice({ state.deploymentWarningMessage = getPipelinesWarningMessage(deploymentSettings); }, updatePipelineStep: (state, action) => { - const { steps, id, branches, pipelineCrews, flag } = action.payload; + const { steps, id, branches, pipelineCrews } = action.payload; const selectedPipelineStep = state.deploymentFrequencySettings.find((pipeline) => pipeline.id === id)?.step ?? ''; state.pipelineCrews = intersection(pipelineCrews, state.pipelineCrews); - const stepWarningMessage = (selectedStep: string) => - steps.includes(selectedStep) || flag || selectedStep === '' ? null : MESSAGE.STEP_WARNING; + const stepWarningMessage = (selectedStep: string, isStepSelected = false) => + steps.includes(selectedStep) || isStepSelected ? null : MESSAGE.STEP_WARNING; - const validStep = (selectedStep: string): string => (steps.includes(selectedStep) ? selectedStep : ''); + const validStep = (pipeline: IPipelineConfig): string => { + const selectedStep = pipeline.step; + if (!selectedStep) { + pipeline.isStepSelected = true; + } + return steps.includes(selectedStep) ? selectedStep : ''; + }; const validBranches = (selectedBranches: string[]): string[] => _.filter(branches, (branch) => selectedBranches.includes(branch)); const getPipelineSettings = (pipelines: IPipelineConfig[]) => { return pipelines.map((pipeline) => { - const filterValidStep = validStep(pipeline.step); + const filterValidStep = validStep(pipeline); return pipeline.id === id ? { ...pipeline, @@ -580,19 +589,26 @@ export const metricsSlice = createSlice({ }); }; - const getStepWarningMessage = (pipelines: IPipelineWarningMessageConfig[]) => { - return pipelines.map((pipeline) => - pipeline?.id === id + const getStepWarningMessage = ( + pipelinesWarning: IPipelineWarningMessageConfig[], + pipelinesValue: IPipelineConfig[], + ) => { + return pipelinesWarning.map((pipeline) => { + const matchedPipeline = pipelinesValue.filter((pipeline) => pipeline.id === id)[0]; + return pipeline?.id === id ? { ...pipeline, - step: stepWarningMessage(selectedPipelineStep), + step: stepWarningMessage(selectedPipelineStep, matchedPipeline.isStepSelected), } - : pipeline, - ); + : pipeline; + }); }; + state.deploymentWarningMessage = getStepWarningMessage( + state.deploymentWarningMessage, + state.deploymentFrequencySettings, + ); state.deploymentFrequencySettings = getPipelineSettings(state.deploymentFrequencySettings); - state.deploymentWarningMessage = getStepWarningMessage(state.deploymentWarningMessage); }, deleteADeploymentFrequencySetting: (state, action) => {