From 7503fbf3ca63ea912949ff38d3cabdd52c0c87d5 Mon Sep 17 00:00:00 2001 From: Daniel Haselhan Date: Fri, 17 Jan 2025 10:16:38 -0800 Subject: [PATCH] fix: Change Transaction history to full timestamp * Use custom fn as dayjs has no way to display timezones * Try and remove moment --- frontend/package-lock.json | 3 +- frontend/package.json | 1 - .../views/FinalSupplyEquipments/_schema.jsx | 32 +++++++++++-------- .../Transfers/components/TransferHistory.jsx | 19 +++++++++-- 4 files changed, 38 insertions(+), 17 deletions(-) diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 4f991b8a2..e53c51333 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -38,7 +38,6 @@ "keycloak-js": "^23.0.3", "lodash": "^4.17.21", "material-ui-popup-state": "^5.0.10", - "moment": "^2.30.1", "mui-daterange-picker-plus": "^1.0.4", "notistack": "^3.0.1", "papaparse": "^5.4.1", @@ -16109,6 +16108,8 @@ "version": "2.30.1", "resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz", "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==", + "optional": true, + "peer": true, "engines": { "node": "*" } diff --git a/frontend/package.json b/frontend/package.json index f88c9c874..a7134ea1d 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -60,7 +60,6 @@ "keycloak-js": "^23.0.3", "lodash": "^4.17.21", "material-ui-popup-state": "^5.0.10", - "moment": "^2.30.1", "mui-daterange-picker-plus": "^1.0.4", "notistack": "^3.0.1", "papaparse": "^5.4.1", diff --git a/frontend/src/views/FinalSupplyEquipments/_schema.jsx b/frontend/src/views/FinalSupplyEquipments/_schema.jsx index c65ff5764..e693f3ae7 100644 --- a/frontend/src/views/FinalSupplyEquipments/_schema.jsx +++ b/frontend/src/views/FinalSupplyEquipments/_schema.jsx @@ -10,9 +10,12 @@ import { } from '@/components/BCDataGrid/components' import i18n from '@/i18n' import { actions, validation } from '@/components/BCDataGrid/columns' -import moment from 'moment' +import dayjs from 'dayjs' import { CommonArrayRenderer } from '@/utils/grid/cellRenderers' -import { StandardCellWarningAndErrors, StandardCellErrors } from '@/utils/grid/errorRenderers' +import { + StandardCellWarningAndErrors, + StandardCellErrors +} from '@/utils/grid/errorRenderers' import { apiRoutes } from '@/constants/routes' import { numberFormatter } from '@/utils/formatters.js' @@ -56,26 +59,29 @@ export const finalSupplyEquipmentColDefs = ( multiple: false, disableCloseOnSelect: false, freeSolo: true, - openOnFocus: true, + openOnFocus: true }, - cellStyle: (params) => - StandardCellWarningAndErrors(params, errors), + cellStyle: (params) => StandardCellWarningAndErrors(params, errors), suppressKeyboardEvent, minWidth: 260, editable: true, valueGetter: (params) => { - return params.data?.organizationName || ''; + return params.data?.organizationName || '' }, valueSetter: (params) => { if (params.newValue) { - const isValidOrganizationName = optionsData?.organizationNames.includes(params.newValue); + const isValidOrganizationName = optionsData?.organizationNames.includes( + params.newValue + ) - params.data.organizationName = isValidOrganizationName ? params.newValue : params.newValue; - return true; + params.data.organizationName = isValidOrganizationName + ? params.newValue + : params.newValue + return true } - return false; + return false }, - tooltipValueGetter: (params) => "Select the organization name from the list" + tooltipValueGetter: (params) => 'Select the organization name from the list' }, { field: 'supplyFrom', @@ -95,8 +101,8 @@ export const finalSupplyEquipmentColDefs = ( cellStyle: (params) => StandardCellErrors(params, errors), cellEditor: DateRangeCellEditor, cellEditorParams: { - minDate: moment(`${compliancePeriod}-01-01`, 'YYYY-MM-DD').toDate(), - maxDate: moment(`${compliancePeriod}-12-31`, 'YYYY-MM-DD').toDate() + minDate: dayjs(`${compliancePeriod}-01-01`, 'YYYY-MM-DD').toDate(), + maxDate: dayjs(`${compliancePeriod}-12-31`, 'YYYY-MM-DD').toDate() }, cellEditorPopup: true, valueGetter: (params) => { diff --git a/frontend/src/views/Transfers/components/TransferHistory.jsx b/frontend/src/views/Transfers/components/TransferHistory.jsx index b4f50bf17..bf35513aa 100644 --- a/frontend/src/views/Transfers/components/TransferHistory.jsx +++ b/frontend/src/views/Transfers/components/TransferHistory.jsx @@ -53,6 +53,21 @@ function TransferHistory({ transferHistory }) { const diffMonths = diff?.months() || 0 const diffDays = diff?.days() || 0 + const formatWithTimezoneAbbr = (dateInput) => { + const time = dayjs(dateInput) + const formattedDate = time.format('LLL') + + const formatter = new Intl.DateTimeFormat('en-US', { + timeZoneName: 'short' + }) + const parts = formatter.formatToParts(time.toDate()) + const timeZoneName = parts.find( + (part) => part.type === 'timeZoneName' + ).value + + return `${formattedDate} ${timeZoneName}` + } + let category = 'A' if ( (diffYears === 0 && diffMonths >= 6 && diffDays > 0) || @@ -74,7 +89,7 @@ function TransferHistory({ transferHistory }) { TRANSFER_STATUSES.SENT, TRANSFER_STATUSES.SUBMITTED, TRANSFER_STATUSES.RECOMMENDED, - TRANSFER_STATUSES.RECORDED, + TRANSFER_STATUSES.RECORDED ].includes(currentStatus) && agreementDate && (
  • @@ -109,7 +124,7 @@ function TransferHistory({ transferHistory }) { {getTransferStatusLabel(item.transferStatus?.status)}{' '} on - {dayjs(item.createDate).format('LL')} + {formatWithTimezoneAbbr(item.createDate)} by {' '}