Move date related functions to @shared/dates (#1191)

Addresses follow up comment in #1177 (review)

client/components/CandidateReview/CandidateTestPlanRun/index.jsx

@@ -17,12 +17,11 @@ import Col from 'react-bootstrap/Col';
 import Button from 'react-bootstrap/Button';
 import { useParams, useNavigate, Navigate } from 'react-router-dom';
 import { Helmet } from 'react-helmet';
-import { getMetrics } from 'shared';
+import { getMetrics, dates } from 'shared';
 import './CandidateTestPlanRun.css';
 import '../../TestRun/TestRun.css';
 import '../../App/App.css';
 import { useMediaQuery } from 'react-responsive';
-import { convertDateToString } from '../../../utils/formatter';
 import TestPlanResultsTable from '../../common/TestPlanResultsTable';
 import ProvideFeedbackModal from '../CandidateModals/ProvideFeedbackModal';
 import ThankYouModal from '../CandidateModals/ThankYouModal';
@@ -282,7 +281,7 @@ const CandidateTestPlanRun = () => {
 
   const reviewStatusText = vendorReviewStatusMap[reviewStatus];
 
-  const targetCompletionDate = convertDateToString(
+  const targetCompletionDate = dates.convertDateToString(
     new Date(recommendedPhaseTargetDate),
     'MMMM D, YYYY'
   );

client/components/CandidateReview/TestPlans/index.jsx

@@ -18,7 +18,7 @@ import {
   getTestPlanVersionTitle
 } from '@components/Reports/getTitles';
 import ClippedProgressBar from '@components/common/ClippedProgressBar';
-import { convertDateToString } from '@client/utils/formatter';
+import { dates } from 'shared';
 import './TestPlans.css';
 import { calculations } from 'shared';
 
@@ -519,15 +519,15 @@ const TestPlans = ({ testPlanVersions }) => {
                         </th>
                         <CenteredTd>
                           <i>
-                            {convertDateToString(
+                            {dates.convertDateToString(
                               candidatePhaseReachedAt,
                               'MMM D, YYYY'
                             )}
                           </i>
                         </CenteredTd>
                         <CenteredTd>
                           <i>
-                            {convertDateToString(
+                            {dates.convertDateToString(
                               recommendedPhaseTargetDate,
                               'MMM D, YYYY'
                             )}

client/components/DataManagement/DataManagementRow/index.jsx

@@ -8,11 +8,7 @@ import {
   UPDATE_TEST_PLAN_VERSION_RECOMMENDED_TARGET_DATE
 } from '../queries';
 import { LoadingStatus, useTriggerLoad } from '../../common/LoadingStatus';
-import {
-  checkDaysBetweenDates,
-  convertDateToString,
-  convertStringFormatToAnotherFormat
-} from '../../../utils/formatter';
+import { dates } from 'shared';
 import { derivePhaseName } from '@client/utils/aria';
 import { THEMES, useThemedModal } from '@client/hooks/useThemedModal';
 import BasicModal from '@components/common/BasicModal';
@@ -301,7 +297,7 @@ const DataManagementRow = ({
           variables: {
             testPlanVersionId: updateTargetModalData.testPlanVersionId,
             recommendedPhaseTargetDate:
-              convertStringFormatToAnotherFormat(updatedDateText)
+              dates.convertStringFormatToAnotherFormat(updatedDateText)
           }
         });
         const updatedTestPlanVersion =
@@ -373,7 +369,7 @@ const DataManagementRow = ({
           break;
       }
 
-      const dateString = convertDateToString(versionDate, 'MMM D, YYYY');
+      const dateString = dates.convertDateToString(versionDate, 'MMM D, YYYY');
 
       return (
         <>
@@ -647,7 +643,9 @@ const DataManagementRow = ({
               </VersionString>
               <span role="listitem" className="review-complete">
                 Review Completed&nbsp;
-                <b>{convertDateToString(completionDate, 'MMM D, YYYY')}</b>
+                <b>
+                  {dates.convertDateToString(completionDate, 'MMM D, YYYY')}
+                </b>
               </span>
             </PhaseCell>
           );
@@ -776,7 +774,9 @@ const DataManagementRow = ({
               </VersionString>
               <span role="listitem" className="review-complete">
                 Review Completed&nbsp;
-                <b>{convertDateToString(completionDate, 'MMM D, YYYY')}</b>
+                <b>
+                  {dates.convertDateToString(completionDate, 'MMM D, YYYY')}
+                </b>
               </span>
             </PhaseCell>
           );
@@ -837,7 +837,7 @@ const DataManagementRow = ({
           const candidatePhaseReachedDate = new Date(
             latestVersion.candidatePhaseReachedAt
           );
-          const daysInReview = checkDaysBetweenDates(
+          const daysInReview = dates.checkDaysBetweenDates(
             currentDate,
             candidatePhaseReachedDate
           );
@@ -846,13 +846,13 @@ const DataManagementRow = ({
           let timeToTargetDate = 0;
           if (currentDate > recommendedPhaseTargetDate) {
             // Indicates that this is in the past
-            timeToTargetDate = checkDaysBetweenDates(
+            timeToTargetDate = dates.checkDaysBetweenDates(
               currentDate,
               recommendedPhaseTargetDate
             );
             timeToTargetDate = -timeToTargetDate;
           } else
-            timeToTargetDate = checkDaysBetweenDates(
+            timeToTargetDate = dates.checkDaysBetweenDates(
               recommendedPhaseTargetDate,
               currentDate
             );
@@ -984,7 +984,7 @@ const DataManagementRow = ({
             </span>
             <span role="listitem" className="review-complete">
               Approved&nbsp;
-              <b>{convertDateToString(completionDate, 'MMM D, YYYY')}</b>
+              <b>{dates.convertDateToString(completionDate, 'MMM D, YYYY')}</b>
             </span>
           </PhaseCell>
         );

client/components/ManageTestQueue/AddTestPlans.jsx

@@ -3,7 +3,7 @@ import { Form } from 'react-bootstrap';
 import RadioBox from '@components/common/RadioBox';
 import AddTestToQueueWithConfirmation from '@components/AddTestToQueueWithConfirmation';
 import { DisclosureContainer } from '@components/ManageTestQueue/index';
-import { gitUpdatedDateToString } from '@client/utils/gitUtils';
+import { dates } from 'shared';
 import PropTypes from 'prop-types';
 
 const AddTestPlans = ({
@@ -162,8 +162,8 @@ const AddTestPlans = ({
             {matchingTestPlanVersions.length ? (
               matchingTestPlanVersions.map(item => (
                 <option key={`${item.gitSha}-${item.id}`} value={item.id}>
-                  {gitUpdatedDateToString(item.updatedAt)} {item.gitMessage} (
-                  {item.gitSha.substring(0, 7)})
+                  {dates.gitUpdatedDateToString(item.updatedAt)}{' '}
+                  {item.gitMessage} ({item.gitSha.substring(0, 7)})
                 </option>
               ))
             ) : (

client/components/ManageTestQueue/ManageAtVersions.jsx

@@ -5,7 +5,7 @@ import { faEdit, faTrashAlt } from '@fortawesome/free-solid-svg-icons';
 import { DisclosureContainer } from '@components/ManageTestQueue/index';
 import BasicModal from '@components/common/BasicModal';
 import UpdateVersionModal from '@components/common/UpdateVersionModal';
-import { convertStringToDate } from '@client/utils/formatter';
+import { dates } from 'shared';
 import { useMutation } from '@apollo/client';
 import {
   ADD_AT_VERSION_MUTATION,
@@ -204,7 +204,7 @@ const ManageAtVersions = ({ ats = [], triggerUpdate = () => {} }) => {
           variables: {
             atId: selectedAtId,
             name: updatedVersionText,
-            releasedAt: convertStringToDate(updatedDateAvailabilityText)
+            releasedAt: dates.convertStringToDate(updatedDateAvailabilityText)
           }
         });
         setSelectedAtVersionId(
@@ -232,7 +232,7 @@ const ManageAtVersions = ({ ats = [], triggerUpdate = () => {} }) => {
           variables: {
             atVersionId: selectedAtVersionId,
             name: updatedVersionText,
-            releasedAt: convertStringToDate(updatedDateAvailabilityText)
+            releasedAt: dates.convertStringToDate(updatedDateAvailabilityText)
           }
         });
         await triggerUpdate();

client/components/Reports/SummarizeTestPlanReport.jsx

@@ -11,9 +11,8 @@ import {
   faHome
 } from '@fortawesome/free-solid-svg-icons';
 import styled from '@emotion/styled';
-import { getMetrics } from 'shared';
+import { getMetrics, dates } from 'shared';
 import { none } from './None';
-import { convertDateToString } from '../../utils/formatter';
 import DisclaimerInfo from '../DisclaimerInfo';
 import TestPlanResultsTable from '../common/TestPlanResultsTable';
 import DisclosureComponent from '../common/DisclosureComponent';
@@ -59,7 +58,8 @@ const getTestersRunHistory = (
               {tester.username}
             </a>
           </b>{' '}
-          on {convertDateToString(testResult.completedAt, 'MMMM DD, YYYY')}.
+          on{' '}
+          {dates.convertDateToString(testResult.completedAt, 'MMMM DD, YYYY')}.
         </li>
       );
     }
@@ -267,7 +267,7 @@ const SummarizeTestPlanReport = ({ testPlanVersion, testPlanReports }) => {
         </li>
         <li>
           Report completed on{' '}
-          {convertDateToString(
+          {dates.convertDateToString(
             new Date(testPlanReport.markedFinalAt),
             'MMMM D, YYYY'
           )}

client/components/Reports/SummarizeTestPlanVersion.jsx

@@ -2,7 +2,7 @@ import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { Helmet } from 'react-helmet';
 import { none } from './None';
-import { getMetrics } from 'shared';
+import { getMetrics, dates } from 'shared';
 import { getTestPlanTargetTitle, getTestPlanVersionTitle } from './getTitles';
 import { Breadcrumb, Button, Container, Table } from 'react-bootstrap';
 import { LinkContainer } from 'react-router-bootstrap';
@@ -11,7 +11,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faHome } from '@fortawesome/free-solid-svg-icons';
 import styled from '@emotion/styled';
 import DisclaimerInfo from '../DisclaimerInfo';
-import { convertDateToString } from '../../utils/formatter';
 
 const FullHeightContainer = styled(Container)`
   min-height: calc(100vh - 64px);
@@ -111,7 +110,7 @@ const SummarizeTestPlanVersion = ({ testPlanVersion, testPlanReports }) => {
             <h2>{getTestPlanTargetTitle(testPlanTarget)}</h2>
             <p>
               Report completed on{' '}
-              {convertDateToString(
+              {dates.convertDateToString(
                 new Date(testPlanReport.markedFinalAt),
                 'MMMM D, YYYY'
               )}

client/components/TestPlanVersionsPage/index.jsx

@@ -12,7 +12,7 @@ import {
 } from '../common/ThemeTable';
 import VersionString from '../common/VersionString';
 import PhasePill from '../common/PhasePill';
-import { convertDateToString } from '../../utils/formatter';
+import { dates } from 'shared';
 import { derivePhaseName } from '../../utils/aria';
 import styled from '@emotion/styled';
 import {
@@ -131,7 +131,7 @@ const TestPlanVersionsPage = () => {
       default:
         throw new Error('Unexpected case');
     }
-    return convertDateToString(date, 'MMM D, YYYY');
+    return dates.convertDateToString(date, 'MMM D, YYYY');
   };
 
   const getIconColor = testPlanVersion => {
@@ -142,7 +142,7 @@ const TestPlanVersionsPage = () => {
   };
 
   const getEventDate = testPlanVersion => {
-    return convertDateToString(
+    return dates.convertDateToString(
       (() => {
         if (testPlanVersion.deprecatedAt) {
           return testPlanVersion.deprecatedAt;
@@ -427,12 +427,14 @@ const TestPlanVersionsPage = () => {
                   </td>
                   <td>{issue.isOpen ? 'Open' : 'Closed'}</td>
                   <td>{issue.at?.name ?? 'AT not specified'}</td>
-                  <td>{convertDateToString(issue.createdAt, 'MMM D, YYYY')}</td>
+                  <td>
+                    {dates.convertDateToString(issue.createdAt, 'MMM D, YYYY')}
+                  </td>
                   <td>
                     {!issue.closedAt ? (
                       <NoneText>N/A</NoneText>
                     ) : (
-                      convertDateToString(issue.closedAt, 'MMM D, YYYY')
+                      dates.convertDateToString(issue.closedAt, 'MMM D, YYYY')
                     )}
                   </td>
                 </tr>
@@ -602,7 +604,9 @@ const TestPlanVersionsPage = () => {
 
                       return events.map(([phase, date]) => (
                         <tr key={phase}>
-                          <th>{convertDateToString(date, 'MMM D, YYYY')}</th>
+                          <th>
+                            {dates.convertDateToString(date, 'MMM D, YYYY')}
+                          </th>
                           <td>{getEventBody(phase)}</td>
                         </tr>
                       ));

client/components/TestReview/index.jsx

@@ -9,7 +9,7 @@ import InstructionsRenderer from '../CandidateReview/CandidateTestPlanRun/Instru
 import FilterButtons from '../common/FilterButtons';
 import styled from '@emotion/styled';
 import { derivePhaseName } from '../../utils/aria';
-import { convertDateToString } from '../../utils/formatter';
+import { dates } from 'shared';
 import supportJson from '../../resources/support.json';
 
 const Ul = styled.ul`
@@ -139,15 +139,15 @@ const TestReview = () => {
           <strong>Version History:&nbsp;</strong>
           <Ul>
             <li>
-              {`R&D completed on ${convertDateToString(
+              {`R&D completed on ${dates.convertDateToString(
                 testPlanVersion.updatedAt,
                 'MMM D, YYYY'
               )}.`}
             </li>
             {!testPlanVersion.draftPhaseReachedAt ? null : (
               <li>
                 {`ARIA-AT draft review process started on ` +
-                  `${convertDateToString(
+                  `${dates.convertDateToString(
                     testPlanVersion.draftPhaseReachedAt,
                     'MMM D, YYYY'
                   )} ` +
@@ -157,7 +157,7 @@ const TestReview = () => {
             {!testPlanVersion.candidatePhaseReachedAt ? null : (
               <li>
                 {`ARIA-AT candidate review process started on ` +
-                  `${convertDateToString(
+                  `${dates.convertDateToString(
                     testPlanVersion.candidatePhaseReachedAt,
                     'MMM D, YYYY'
                   )} ` +
@@ -167,7 +167,7 @@ const TestReview = () => {
             {!testPlanVersion.recommendedPhaseReachedAt ? null : (
               <li>
                 {`Version reached ARIA-AT recommended status on ` +
-                  `${convertDateToString(
+                  `${dates.convertDateToString(
                     testPlanVersion.recommendedPhaseReachedAt,
                     'MMM D, YYYY'
                   )}.`}
@@ -176,7 +176,7 @@ const TestReview = () => {
             {!testPlanVersion.deprecatedAt ? null : (
               <li>
                 {`Version deprecated on ` +
-                  `${convertDateToString(
+                  `${dates.convertDateToString(
                     testPlanVersion.deprecatedAt,
                     'MMM D, YYYY'
                   )}.`}

client/components/TestRun/index.jsx

@@ -39,7 +39,7 @@ import { evaluateAuth } from '../../utils/evaluateAuth';
 import './TestRun.css';
 import ReviewConflicts from '../ReviewConflicts';
 import createIssueLink from '../../utils/createIssueLink';
-import { convertDateToString } from '../../utils/formatter';
+import { dates } from 'shared';
 import { Provider as CollectionJobContextProvider } from './CollectionJobContext';
 
 const TestRun = () => {
@@ -354,7 +354,7 @@ const TestRun = () => {
     issueLink = createIssueLink({
       testPlanTitle: testPlanVersion.title,
       testPlanDirectory: testPlanVersion.testPlan.directory,
-      versionString: `V${convertDateToString(
+      versionString: `V${dates.convertDateToString(
         testPlanVersion.updatedAt,
         'YY.MM.DD'
       )}`,

client/components/common/ReportStatusSummary/index.jsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import styled from '@emotion/styled';
-import { convertDateToString } from '../../../utils/formatter';
+import { dates } from 'shared';
 import { calculatePercentComplete } from '../../../utils/calculatePercentComplete';
 
 const IncompleteStatusReport = styled.span`
@@ -15,7 +15,7 @@ const ReportStatusSummary = ({
   fromTestQueue = false
 }) => {
   const renderCompleteReportStatus = testPlanReport => {
-    const formattedDate = convertDateToString(
+    const formattedDate = dates.convertDateToString(
       testPlanReport.markedFinalAt,
       'MMM D, YYYY'
     );