ADM-1009 [frontend]: fix the 4xx error (#1609)

* ADM-1009 [frontend]: fix the 4xx error

* ADM-1009 [frontend]: fix test

* ADM-1009 [frontend]: fix trivy

* ADM-1009 [frontend]: fix the code because the code may be string type

* ADM-1009 [frontend]: fix comments

* ADM-1009 [frontend]: fix comments

.trivyignore

@@ -27,3 +27,6 @@ CVE-2023-50868
 CVE-2024-34750
 CVE-2024-5171
 CVE-2024-38816
+CVE-2024-45490
+CVE-2024-45491
+CVE-2024-45492

frontend/__tests__/hooks/useGetMetricsStepsEffect.test.tsx

@@ -87,6 +87,25 @@ describe('use get steps effect', () => {
     expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailed4xx);
   });
 
+  it('should get the steps failed status when partial 4xx response from steps res and code type is string', async () => {
+    metricsClient.getSteps = jest
+      .fn()
+      .mockReturnValueOnce({
+        response: ['a', 'b', 'c'],
+        haveStep: true,
+        branches: ['branchA', 'branchB'],
+        pipelineCrews: ['crewA', 'crewB'],
+      })
+      .mockRejectedValue({
+        code: '404',
+      });
+    const { result } = renderHook(() => useGetMetricsStepsEffect());
+    await act(async () => {
+      await result.current.getSteps(params, buildId, organizationId, pipelineType, token);
+    });
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailed4xx);
+  });
+
   it('should get the steps failed status when partial timeout response from steps res', async () => {
     metricsClient.getSteps = jest
       .fn()
@@ -106,6 +125,44 @@ describe('use get steps effect', () => {
     expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailedTimeout);
   });
 
+  it('should get the steps failed status when partial timeout response from steps res and code is null', async () => {
+    metricsClient.getSteps = jest
+      .fn()
+      .mockReturnValueOnce({
+        response: ['a', 'b', 'c'],
+        haveStep: true,
+        branches: ['branchA', 'branchB'],
+        pipelineCrews: ['crewA', 'crewB'],
+      })
+      .mockRejectedValue({
+        code: null,
+      });
+    const { result } = renderHook(() => useGetMetricsStepsEffect());
+    await act(async () => {
+      await result.current.getSteps(params, buildId, organizationId, pipelineType, token);
+    });
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailedTimeout);
+  });
+
+  it('should get the steps failed status when partial timeout response from steps res and code is undefined', async () => {
+    metricsClient.getSteps = jest
+      .fn()
+      .mockReturnValueOnce({
+        response: ['a', 'b', 'c'],
+        haveStep: true,
+        branches: ['branchA', 'branchB'],
+        pipelineCrews: ['crewA', 'crewB'],
+      })
+      .mockRejectedValue({
+        code: undefined,
+      });
+    const { result } = renderHook(() => useGetMetricsStepsEffect());
+    await act(async () => {
+      await result.current.getSteps(params, buildId, organizationId, pipelineType, token);
+    });
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailedTimeout);
+  });
+
   it('should set error message when get steps throw error', async () => {
     jest.useFakeTimers();
     metricsClient.getSteps = jest.fn().mockImplementation(() => {

frontend/__tests__/hooks/useGetSourceControlConfigurationBranchEffect.test.tsx

@@ -78,7 +78,7 @@ describe('use get source control configuration branch info side effect', () => {
     expect(sourceControlClient.getBranch).toBeCalled();
   });
 
-  it('should set error step failed status to PartialFailed4xx when getting branch response is failed and client return 400', async () => {
+  it('should set error step failed status to AllFailed4xx when getting branch response is failed and client return 4xx', async () => {
     const { result } = renderHook(() => useGetSourceControlConfigurationBranchEffect(), { wrapper: Wrapper });
     const mockOrganization = 'mockOrg';
     const mockRepo = 'mockRepo';
@@ -95,13 +95,64 @@ describe('use get source control configuration branch info side effect', () => {
     expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailed4xx);
   });
 
-  it('should set error step failed status to PartialFailedTimeout when getting branch response is failed and client dont return 400', async () => {
+  it('should set error step failed status to AllFailed4xx when getting branch response is failed and client return 4xx and type is string', async () => {
     const { result } = renderHook(() => useGetSourceControlConfigurationBranchEffect(), { wrapper: Wrapper });
     const mockOrganization = 'mockOrg';
     const mockRepo = 'mockRepo';
     sourceControlClient.getBranch = jest.fn().mockImplementation(() => {
       return Promise.resolve({
-        code: 404,
+        code: '404',
+      });
+    });
+    await act(async () => {
+      result.current.getSourceControlBranchInfo(mockOrganization, mockRepo, 1);
+    });
+
+    expect(sourceControlClient.getBranch).toBeCalled();
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailed4xx);
+  });
+
+  it('should set error step failed status to AllFailedTimeout when getting branch response is failed and client dont return 4xx', async () => {
+    const { result } = renderHook(() => useGetSourceControlConfigurationBranchEffect(), { wrapper: Wrapper });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    sourceControlClient.getBranch = jest.fn().mockImplementation(() => {
+      return Promise.resolve({
+        code: 500,
+      });
+    });
+    await act(async () => {
+      result.current.getSourceControlBranchInfo(mockOrganization, mockRepo, 1);
+    });
+
+    expect(sourceControlClient.getBranch).toBeCalled();
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailedTimeout);
+  });
+
+  it('should set error step failed status to AllFailedTimeout when getting branch response is failed and code is null', async () => {
+    const { result } = renderHook(() => useGetSourceControlConfigurationBranchEffect(), { wrapper: Wrapper });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    sourceControlClient.getBranch = jest.fn().mockImplementation(() => {
+      return Promise.resolve({
+        code: null,
+      });
+    });
+    await act(async () => {
+      result.current.getSourceControlBranchInfo(mockOrganization, mockRepo, 1);
+    });
+
+    expect(sourceControlClient.getBranch).toBeCalled();
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailedTimeout);
+  });
+
+  it('should set error step failed status to AllFailedTimeout when getting branch response is failed and code is undefined', async () => {
+    const { result } = renderHook(() => useGetSourceControlConfigurationBranchEffect(), { wrapper: Wrapper });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    sourceControlClient.getBranch = jest.fn().mockImplementation(() => {
+      return Promise.resolve({
+        code: undefined,
       });
     });
     await act(async () => {

frontend/__tests__/hooks/useGetSourceControlConfigurationCrewEffect.test.tsx

@@ -70,7 +70,7 @@ describe('use get source control configuration crew info side effect', () => {
     expect(clientSpy).toHaveBeenCalledTimes(2);
   });
 
-  it('should set error step failed status to PartialFailed4xx when one of getting repo response is failed and code is 400', async () => {
+  it('should set error step failed status to PartialFailed4xx when one of getting repo response is failed and code is 4xx', async () => {
     sourceControlClient.getCrew = jest
       .fn()
       .mockImplementationOnce(() => {
@@ -105,7 +105,42 @@ describe('use get source control configuration crew info side effect', () => {
     expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailed4xx);
   });
 
-  it('should set error step failed status to PartialFailedTimeout when one of getting repo responses is failed and code is not 400', async () => {
+  it('should set error step failed status to PartialFailed4xx when one of getting repo response is failed and code is 4xx and type is string', async () => {
+    sourceControlClient.getCrew = jest
+      .fn()
+      .mockImplementationOnce(() => {
+        return Promise.reject({
+          code: '404',
+        });
+      })
+      .mockImplementationOnce(() => {
+        return Promise.resolve({
+          crews: ['crew1'],
+        });
+      });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    const mockBranch = 'mockBranch';
+    const dateRanges: DateRange[] = [
+      {
+        startDate: '2024-07-31T00:00:00.000+08:00',
+        endDate: '2024-08-02T23:59:59.999+08:00',
+      },
+      {
+        startDate: '2024-07-15T00:00:00.000+08:00',
+        endDate: '2024-07-28T23:59:59.999+08:00',
+      },
+    ];
+    const { result } = renderHook(() => useGetSourceControlConfigurationCrewEffect(), { wrapper: Wrapper });
+
+    await act(async () => {
+      result.current.getSourceControlCrewInfo(mockOrganization, mockRepo, mockBranch, dateRanges);
+    });
+
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailed4xx);
+  });
+
+  it('should set error step failed status to PartialFailedTimeout when one of getting repo responses is failed and code is not 4xx', async () => {
     sourceControlClient.getCrew = jest
       .fn()
       .mockImplementationOnce(() => {
@@ -140,7 +175,77 @@ describe('use get source control configuration crew info side effect', () => {
     expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailedTimeout);
   });
 
-  it('should set error step failed status to AllFailed4xx when all getting repo responses are failed and code is 400', async () => {
+  it('should set error step failed status to PartialFailedTimeout when one of getting repo responses is failed and code is null', async () => {
+    sourceControlClient.getCrew = jest
+      .fn()
+      .mockImplementationOnce(() => {
+        return Promise.reject({
+          code: null,
+        });
+      })
+      .mockImplementationOnce(() => {
+        return Promise.resolve({
+          crews: ['crew1'],
+        });
+      });
+    const { result } = renderHook(() => useGetSourceControlConfigurationCrewEffect(), { wrapper: Wrapper });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    const mockBranch = 'mockBranch';
+    const dateRanges: DateRange[] = [
+      {
+        startDate: '2024-07-31T00:00:00.000+08:00',
+        endDate: '2024-08-02T23:59:59.999+08:00',
+      },
+      {
+        startDate: '2024-07-15T00:00:00.000+08:00',
+        endDate: '2024-07-28T23:59:59.999+08:00',
+      },
+    ];
+
+    await act(async () => {
+      result.current.getSourceControlCrewInfo(mockOrganization, mockRepo, mockBranch, dateRanges);
+    });
+
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailedTimeout);
+  });
+
+  it('should set error step failed status to PartialFailedTimeout when one of getting repo responses is failed and code is undefined', async () => {
+    sourceControlClient.getCrew = jest
+      .fn()
+      .mockImplementationOnce(() => {
+        return Promise.reject({
+          code: undefined,
+        });
+      })
+      .mockImplementationOnce(() => {
+        return Promise.resolve({
+          crews: ['crew1'],
+        });
+      });
+    const { result } = renderHook(() => useGetSourceControlConfigurationCrewEffect(), { wrapper: Wrapper });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    const mockBranch = 'mockBranch';
+    const dateRanges: DateRange[] = [
+      {
+        startDate: '2024-07-31T00:00:00.000+08:00',
+        endDate: '2024-08-02T23:59:59.999+08:00',
+      },
+      {
+        startDate: '2024-07-15T00:00:00.000+08:00',
+        endDate: '2024-07-28T23:59:59.999+08:00',
+      },
+    ];
+
+    await act(async () => {
+      result.current.getSourceControlCrewInfo(mockOrganization, mockRepo, mockBranch, dateRanges);
+    });
+
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.PartialFailedTimeout);
+  });
+
+  it('should set error step failed status to AllFailed4xx when all getting repo responses are failed and code is 4xx', async () => {
     sourceControlClient.getCrew = jest.fn().mockImplementation(() => {
       return Promise.reject({
         code: 400,
@@ -168,7 +273,35 @@ describe('use get source control configuration crew info side effect', () => {
     expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailed4xx);
   });
 
-  it('should set error step failed status to AllFailedTimeout when all getting repo responses are failed and code is not 400', async () => {
+  it('should set error step failed status to AllFailed4xx when all getting repo responses are failed and code is type is string', async () => {
+    sourceControlClient.getCrew = jest.fn().mockImplementation(() => {
+      return Promise.reject({
+        code: '404',
+      });
+    });
+    const { result } = renderHook(() => useGetSourceControlConfigurationCrewEffect(), { wrapper: Wrapper });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    const mockBranch = 'mockBranch';
+    const dateRanges: DateRange[] = [
+      {
+        startDate: '2024-07-31T00:00:00.000+08:00',
+        endDate: '2024-08-02T23:59:59.999+08:00',
+      },
+      {
+        startDate: '2024-07-15T00:00:00.000+08:00',
+        endDate: '2024-07-28T23:59:59.999+08:00',
+      },
+    ];
+
+    await act(async () => {
+      result.current.getSourceControlCrewInfo(mockOrganization, mockRepo, mockBranch, dateRanges);
+    });
+
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailed4xx);
+  });
+
+  it('should set error step failed status to AllFailedTimeout when all getting repo responses are failed and code is not 4xx', async () => {
     sourceControlClient.getCrew = jest.fn().mockImplementation(() => {
       return Promise.reject({
         code: 500,
@@ -195,4 +328,60 @@ describe('use get source control configuration crew info side effect', () => {
 
     expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailedTimeout);
   });
+
+  it('should set error step failed status to AllFailedTimeout when all getting repo responses are failed and code is null', async () => {
+    sourceControlClient.getCrew = jest.fn().mockImplementation(() => {
+      return Promise.reject({
+        code: null,
+      });
+    });
+    const { result } = renderHook(() => useGetSourceControlConfigurationCrewEffect(), { wrapper: Wrapper });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    const mockBranch = 'mockBranch';
+    const dateRanges: DateRange[] = [
+      {
+        startDate: '2024-07-31T00:00:00.000+08:00',
+        endDate: '2024-08-02T23:59:59.999+08:00',
+      },
+      {
+        startDate: '2024-07-15T00:00:00.000+08:00',
+        endDate: '2024-07-28T23:59:59.999+08:00',
+      },
+    ];
+
+    await act(async () => {
+      result.current.getSourceControlCrewInfo(mockOrganization, mockRepo, mockBranch, dateRanges);
+    });
+
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailedTimeout);
+  });
+
+  it('should set error step failed status to AllFailedTimeout when all getting repo responses are failed and code is undefined', async () => {
+    sourceControlClient.getCrew = jest.fn().mockImplementation(() => {
+      return Promise.reject({
+        code: undefined,
+      });
+    });
+    const { result } = renderHook(() => useGetSourceControlConfigurationCrewEffect(), { wrapper: Wrapper });
+    const mockOrganization = 'mockOrg';
+    const mockRepo = 'mockRepo';
+    const mockBranch = 'mockBranch';
+    const dateRanges: DateRange[] = [
+      {
+        startDate: '2024-07-31T00:00:00.000+08:00',
+        endDate: '2024-08-02T23:59:59.999+08:00',
+      },
+      {
+        startDate: '2024-07-15T00:00:00.000+08:00',
+        endDate: '2024-07-28T23:59:59.999+08:00',
+      },
+    ];
+
+    await act(async () => {
+      result.current.getSourceControlCrewInfo(mockOrganization, mockRepo, mockBranch, dateRanges);
+    });
+
+    expect(result.current.stepFailedStatus).toEqual(MetricsDataFailStatus.AllFailedTimeout);
+  });
 });