diff --git a/src/components/CampaignPortal/CampaignPortal.css b/src/components/CampaignPortal/CampaignPortal.css index 7ed6c25..0453488 100644 --- a/src/components/CampaignPortal/CampaignPortal.css +++ b/src/components/CampaignPortal/CampaignPortal.css @@ -2,6 +2,10 @@ width: 30%; } +.DatesLeftHeader{ + width: 30%; +} + /* Column sizes */ #CampaignPortal .ColInterviewerName{ diff --git a/src/components/CampaignPortal/CampaignPortal.jsx b/src/components/CampaignPortal/CampaignPortal.jsx index dc56942..b83cf43 100644 --- a/src/components/CampaignPortal/CampaignPortal.jsx +++ b/src/components/CampaignPortal/CampaignPortal.jsx @@ -7,6 +7,7 @@ import Row from 'react-bootstrap/Row'; import Col from 'react-bootstrap/Col'; import Utils from '../../utils/Utils'; import TimeLine from './TimeLine'; +import { DatesTable } from './Dates' import Contacts from './Contacts'; import SurveyUnits from './SurveyUnits'; import SurveySelector from '../SurveySelector/SurveySelector'; @@ -106,6 +107,12 @@ function CampaignPortal({ + { + return ( + + {D.dates} + + + + + + + + + + + + + + + + + + + +
{D.identificationPhaseStartDate}{identificationPhaseStartDate && Utils.convertToDateString(identificationPhaseStartDate)}
{D.collectionStartDate}{collectionstartDate && Utils.convertToDateString(collectionstartDate)}
{D.collectionEndDate}{collectionEndDate && Utils.convertToDateString(collectionEndDate)}
{D.endDate}{endDate && Utils.convertToDateString(endDate)}
+ + + ) +} \ No newline at end of file diff --git a/src/components/CampaignPortal/Dates.test.jsx b/src/components/CampaignPortal/Dates.test.jsx new file mode 100644 index 0000000..e829f4e --- /dev/null +++ b/src/components/CampaignPortal/Dates.test.jsx @@ -0,0 +1,42 @@ +import React from 'react'; +import { DatesTable } from "./Dates"; +import { render, screen } from '@testing-library/react'; +import Utils from '../../utils/Utils'; + +describe("dates component", () => { + it("should display all labels", () => { + render( + + + ); + + expect(screen.getByText("Dates")).toBeInTheDocument(); + expect(screen.getByText("Start of identification phase")).toBeInTheDocument(); + expect(screen.getByText("Collection start date")).toBeInTheDocument(); + expect(screen.getByText("Collection end date")).toBeInTheDocument(); + expect(screen.getByText("Processing end date")).toBeInTheDocument(); + + }) + + it("should display all formated dates", () => { + render( + + + ); + + expect(screen.getByText(Utils.convertToDateString(1578907245000))).toBeInTheDocument(); + expect(screen.getByText(Utils.convertToDateString(1609492845000))).toBeInTheDocument(); + expect(screen.getByText(Utils.convertToDateString(1698706800000))).toBeInTheDocument(); + expect(screen.getByText(Utils.convertToDateString(1706655600000))).toBeInTheDocument(); + }) +}) \ No newline at end of file diff --git a/src/components/CampaignPortal/__snapshots__/CampaignPortal.test.jsx.snap b/src/components/CampaignPortal/__snapshots__/CampaignPortal.test.jsx.snap index cce4aba..6ae1639 100644 --- a/src/components/CampaignPortal/__snapshots__/CampaignPortal.test.jsx.snap +++ b/src/components/CampaignPortal/__snapshots__/CampaignPortal.test.jsx.snap @@ -241,6 +241,67 @@ Object { +
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
- -
- - Interviewers - - + Dates
-
- - - Display - -
-
+ + -
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 7/7/2020 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 1/13/2022 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 1/13/2022 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 5/26/2021 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + +
+ Start of identification phase + +
+ Collection start date + +
+ Collection end date + + 5/26/2021 +
+ Processing end date + +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + + + +
+ Start of identification phase + + 12/25/2019 +
+ Collection start date + +
+ Collection end date + + 1/1/2022 +
+ Processing end date + + 1/7/2022 +
+
+
+
+
+ Dates +
+
+ + + + + + + + + + + + + + + + + + +
+ Start of identification phase + + 12/25/2019 +
+ Collection start date + +
+ Collection end date + + 1/1/2022 +
+ Processing end date + + 1/7/2022 +
+
+