ADM-831:[frontend]feat: add pipeline is future time check (#1112)

* ADM-831:[frontend]test: update time mock

* ADM-831:[frontend]test: rename test

frontend/__tests__/containers/MetricsStep/MetricsStep.test.tsx

@@ -304,12 +304,14 @@ describe('MetricsStep', () => {
       ).toBeInTheDocument();
     });
 
-    it('should render no pipeline container when get pipeline when selected future time ', async () => {
+    it('should render no pipeline container given now is 2024-01-01 when get pipeline when selected future time ', async () => {
       const MOCK_FUTURE_DATE_RANGE = {
-        startDate: '2034-04-04T00:00:00+08:00',
-        endDate: '2034-04-18T00:00:00+08:00',
+        startDate: '2024-02-04T00:00:00+08:00',
+        endDate: '2024-02-18T00:00:00+08:00',
       };
 
+      jest.useFakeTimers().setSystemTime(new Date('2024-01-01'));
+
       store.dispatch(updateDateRange(MOCK_FUTURE_DATE_RANGE));
 
       setup();
@@ -322,21 +324,27 @@ describe('MetricsStep', () => {
           'Please go back to the previous page and change your collection date, or check your pipeline info!',
         ),
       ).toBeInTheDocument();
+
+      jest.useRealTimers();
     });
 
-    it('should render pipeline container when get pipeline when selected past time ', async () => {
+    it('should render pipeline container given now is 2024-01-01 when get pipeline when selected past time ', async () => {
       const MOCK_PAST_DATE_RANGE = {
         startDate: '2014-04-04T00:00:00+08:00',
         endDate: '2014-04-18T00:00:00+08:00',
       };
 
+      jest.useFakeTimers().setSystemTime(new Date('2024-01-01'));
+
       store.dispatch(updateDateRange(MOCK_PAST_DATE_RANGE));
 
       setup();
 
       await waitFor(() => {
         expect(screen.getByText('Pipeline settings')).toBeInTheDocument();
       });
+
+      jest.useRealTimers();
     });
 
     it('should be render form container when got board card success', async () => {