ORV2-2991 - Fix application form/review incorrect datetime display (#…

…1659)
bcgov · Nov 8, 2024 · c57aedc · c57aedc
1 parent c2c644b
commit c57aedc
Show file tree

Hide file tree

Showing 11 changed files with 42 additions and 27 deletions.
diff --git a/frontend/src/common/helpers/formatDate.ts b/frontend/src/common/helpers/formatDate.ts
@@ -35,22 +35,22 @@ export const now = () => dayjs();
 export const nowUtc = () => dayjs.utc();
 
 /**
- * Get local datetime string in a specified format for a given DayJS object.
- * @param dayjsObj DayJS object that could be in any timezone
+ * Get local datetime string in a specified format for a given local DayJS object.
+ * @param localDayjs Local DayJS object
  * @param formatStr datetime format to display the datetime in (default ISO-8601)
  * @returns datetime string representing local datetime in the format specified
  */
-export const dayjsToLocalStr = (dayjsObj: Dayjs, formatStr?: string) =>
-  dayjs(dayjsObj).local().format(formatStr);
+export const dayjsToLocalStr = (localDayjs: Dayjs, formatStr?: string) =>
+  dayjs(localDayjs).format(formatStr);
 
 /**
- * Get UTC datetime string in a specified format for a given DayJS object.
- * @param dayjsObj DayJS object that could be in any timezone
+ * Get UTC datetime string in a specified format for a given local DayJS object.
+ * @param localDayjs Local DayJS object
  * @param formatStr datetime format to display the datetime in (default ISO-8601)
  * @returns datetime string representing UTC datetime in the format specified
  */
-export const dayjsToUtcStr = (dayjsObj: Dayjs, formatStr?: string) =>
-  dayjs(dayjsObj).utc().format(formatStr);
+export const dayjsToUtcStr = (localDayjs: Dayjs, formatStr?: string) =>
+  dayjs(localDayjs).utc().format(formatStr);
 
 /**
  * Get UTC datetime string in a specified format for a given datetime string
@@ -65,10 +65,16 @@ export const toUtc = (dateTimeStr: string, formatStr?: string) =>
  * Get local datetime string in a specified format for a given datetime string
  * @param dateTimeStr datetime string that could be in any timezone
  * @param formatStr datetime format to display in (default ISO-8601)
+ * @param isDateTimeStrLocal Whether or not the provided datetime string is already local
  * @returns datetime string representing local datetime in the format specified
  */
-export const toLocal = (dateTimeStr: string, formatStr?: string) =>
-  dayjs(dateTimeStr).local().format(formatStr);
+export const toLocal = (
+  dateTimeStr: string,
+  formatStr?: string,
+  isDateTimeStrLocal?: boolean,
+) => isDateTimeStrLocal
+  ? dayjs(dateTimeStr).format(formatStr)
+  : dayjs(dateTimeStr).local().format(formatStr);
 
 /**
  * Get local DayJS object for a given UTC datetime string
@@ -106,7 +112,7 @@ export const toTimeZone = (
 ) =>
   ianaId
     ? dayjs(datetimeStr).tz(ianaId).format(formatStr)
-    : toLocal(datetimeStr, formatStr);
+    : toLocal(datetimeStr, formatStr, true);
 
 /**
  * Gets the number of days between two datetimes (should both be in the same timezone).

diff --git a/frontend/src/common/helpers/tableHelper.ts b/frontend/src/common/helpers/tableHelper.ts
@@ -7,13 +7,17 @@ import { PermitListItem } from "../../features/permits/types/permit";
 import { Nullable } from "../types/common";
 
 /**
- * Format a given datetime string to a format that we can display
- * @param rawDateTime
+ * Format a datetime string in a table cell to a given display format.
+ * @param rawDateTime Provided datetime string, if any
+ * @param isDateTimeLocal Whether or not the provided datetime is local
  * @returns datetime string for display or "NA" if invalid date given
  */
-export const formatCellValuetoDatetime = (rawDateTime: Nullable<string>) => {
+export const formatCellValuetoDatetime = (
+  rawDateTime: Nullable<string>,
+  isDateTimeLocal?: boolean,
+) => {
   return applyWhenNotNullable(
-    (dt) => toLocal(dt, DATE_FORMATS.DATEONLY_ABBR_MONTH),
+    (dt) => toLocal(dt, DATE_FORMATS.DATEONLY_ABBR_MONTH, isDateTimeLocal),
     rawDateTime,
     "NA",
   );

diff --git a/frontend/src/features/idir/search/table/PermitSearchResultColumnDef.tsx b/frontend/src/features/idir/search/table/PermitSearchResultColumnDef.tsx
@@ -105,7 +105,7 @@ export const PermitSearchResultColumnDef = (
     enableSorting: true,
     sortingFn: dateTimeStringSortingFn,
     Cell: (props: { cell: any }) => {
-      const formattedDate = formatCellValuetoDatetime(props.cell.getValue());
+      const formattedDate = formatCellValuetoDatetime(props.cell.getValue(), true);
       return formattedDate;
     },
   },
@@ -115,7 +115,7 @@ export const PermitSearchResultColumnDef = (
     enableSorting: true,
     sortingFn: dateTimeStringSortingFn,
     Cell: (props: { cell: any }) => {
-      const formattedDate = formatCellValuetoDatetime(props.cell.getValue());
+      const formattedDate = formatCellValuetoDatetime(props.cell.getValue(), true);
       return formattedDate;
     },
   },

diff --git a/frontend/src/features/permits/apiManager/permitsAPI.ts b/frontend/src/features/permits/apiManager/permitsAPI.ts
@@ -196,6 +196,7 @@ export const getApplications = async (
             startDate: toLocal(
               application?.startDate,
               DATE_FORMATS.DATEONLY_SHORT_NAME,
+              true,
             ),
           } as ApplicationListItem;
         });
@@ -494,10 +495,12 @@ export const getPermits = async (
             startDate: toLocal(
               permit.startDate,
               DATE_FORMATS.DATEONLY_SHORT_NAME,
+              true,
             ),
             expiryDate: toLocal(
               permit.expiryDate,
               DATE_FORMATS.DATEONLY_SHORT_NAME,
+              true,
             ),
           } as PermitListItem;
         },

diff --git a/frontend/src/features/permits/components/permit-list/Columns.tsx b/frontend/src/features/permits/components/permit-list/Columns.tsx
@@ -71,7 +71,7 @@ export const PermitsColumnDefinition = (
     header: "Permit Start Date",
     enableSorting: true,
     Cell: (props: { cell: any }) => {
-      const formattedDate = formatCellValuetoDatetime(props.cell.getValue());
+      const formattedDate = formatCellValuetoDatetime(props.cell.getValue(), true);
       return formattedDate;
     },
   },
@@ -81,7 +81,7 @@ export const PermitsColumnDefinition = (
     id: "expiryDate",
     enableSorting: true,
     Cell: (props: { cell: any }) => {
-      const formattedDate = formatCellValuetoDatetime(props.cell.getValue());
+      const formattedDate = formatCellValuetoDatetime(props.cell.getValue(), true);
       return formattedDate;
     },
   },

diff --git a/frontend/src/features/permits/helpers/equality.ts b/frontend/src/features/permits/helpers/equality.ts
@@ -6,11 +6,11 @@ import { PermitVehicleDetails } from "../types/PermitVehicleDetails";
 import { PermitData } from "../types/PermitData";
 import { PermitCondition } from "../types/PermitCondition";
 import { arePermitLOADetailsEqual, PermitLOA } from "../types/PermitLOA";
+import { doUniqueArraysHaveSameObjects } from "../../../common/helpers/equality";
 import {
   DATE_FORMATS,
   dayjsToLocalStr,
 } from "../../../common/helpers/formatDate";
-import { doUniqueArraysHaveSameObjects } from "../../../common/helpers/equality";
 
 /**
  * Compare whether or not two mailing addresses are equal.

diff --git a/frontend/src/features/permits/pages/Amend/components/AmendPermitForm.tsx b/frontend/src/features/permits/pages/Amend/components/AmendPermitForm.tsx
@@ -24,7 +24,7 @@ import { useFetchSpecialAuthorizations } from "../../../../settings/hooks/specia
 import { filterLOAsForPermitType, filterNonExpiredLOAs } from "../../../helpers/permitLOA";
 import {
   dayjsToUtcStr,
-  nowUtc,
+  now,
 } from "../../../../../common/helpers/formatDate";
 
 import {
@@ -213,7 +213,7 @@ export const AmendPermitForm = () => {
       comment: getDefaultRequiredVal("", history.comment),
       name: history.commentUsername,
       revisionDateTime: getDefaultRequiredVal(
-        dayjsToUtcStr(nowUtc()),
+        dayjsToUtcStr(now()),
         history.transactionSubmitDate,
       ),
     }));

diff --git a/frontend/src/features/permits/pages/Application/components/form/LOATable.tsx b/frontend/src/features/permits/pages/Application/components/form/LOATable.tsx
@@ -85,7 +85,7 @@ export const LOATable = ({
                 scope="row"
               >
                 {applyWhenNotNullable(
-                  expiryDate => toLocal(expiryDate, DATE_FORMATS.DATEONLY_SLASH),
+                  expiryDate => toLocal(expiryDate, DATE_FORMATS.DATEONLY_SLASH, true),
                   selectableLOA.loa.expiryDate,
                   "Never expires",
                 )}

diff --git a/frontend/src/features/permits/pages/ShoppingCart/components/ShoppingCartItem.tsx b/frontend/src/features/permits/pages/ShoppingCart/components/ShoppingCartItem.tsx
@@ -83,7 +83,7 @@ export const ShoppingCartItem = ({
               <span
                 className="shopping-cart-item__info shopping-cart-item__info--start-date"
               >
-                {toLocal(cartItemData.startDate, DATE_FORMATS.DATEONLY_ABBR_MONTH)}
+                {toLocal(cartItemData.startDate, DATE_FORMATS.DATEONLY_ABBR_MONTH, true)}
               </span>
             </div>
           </div>
@@ -113,7 +113,7 @@ export const ShoppingCartItem = ({
               <span
                 className="shopping-cart-item__info shopping-cart-item__info--end-date"
               >
-                {toLocal(cartItemData.expiryDate, DATE_FORMATS.DATEONLY_ABBR_MONTH)}
+                {toLocal(cartItemData.expiryDate, DATE_FORMATS.DATEONLY_ABBR_MONTH, true)}
               </span>
             </div>
           </div>

diff --git a/frontend/src/features/permits/pages/Void/components/VoidPermitHeader.tsx b/frontend/src/features/permits/pages/Void/components/VoidPermitHeader.tsx
@@ -47,6 +47,7 @@ export const VoidPermitHeader = ({ permit }: { permit: Nullable<Permit> }) => {
             {toLocal(
               permit.permitData.startDate,
               DATE_FORMATS.DATEONLY_ABBR_MONTH,
+              true,
             )}
           </Box>
         </Box>
@@ -62,6 +63,7 @@ export const VoidPermitHeader = ({ permit }: { permit: Nullable<Permit> }) => {
             {toLocal(
               permit.permitData.expiryDate,
               DATE_FORMATS.DATEONLY_ABBR_MONTH,
+              true,
             )}
           </Box>
         </Box>

diff --git a/...tend/src/features/settings/components/SpecialAuthorizations/LOA/list/LOAListColumnDef.tsx b/...tend/src/features/settings/components/SpecialAuthorizations/LOA/list/LOAListColumnDef.tsx
@@ -36,7 +36,7 @@ export const LOAListColumnDef = (
   },
   {
     accessorFn: (originalRow) => {
-      return toLocal(originalRow.startDate, DATE_FORMATS.DATEONLY_SLASH);
+      return toLocal(originalRow.startDate, DATE_FORMATS.DATEONLY_SLASH, true);
     },
     id: "startDate",
     header: "Start Date",
@@ -54,7 +54,7 @@ export const LOAListColumnDef = (
   {
     accessorFn: (originalRow) =>
       applyWhenNotNullable(
-        (expiryDate) => toLocal(expiryDate, DATE_FORMATS.DATEONLY_SLASH),
+        (expiryDate) => toLocal(expiryDate, DATE_FORMATS.DATEONLY_SLASH, true),
         originalRow.expiryDate,
         "Never expires",
       ) as string,