From 6a7fcfe26444867b11c8ad0318d772d8f2752478 Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Thu, 28 Nov 2024 14:41:43 +0530 Subject: [PATCH] Improved: migrated from moment to luxon for timezones (#92) --- package-lock.json | 37 +++++++++++++------------------ package.json | 4 ++-- src/App.vue | 14 ++++++++++++ src/main.ts | 15 +++++++------ src/store/modules/user/actions.ts | 5 ++--- src/views/Order.vue | 6 +---- 6 files changed, 43 insertions(+), 38 deletions(-) diff --git a/package-lock.json b/package-lock.json index e7c13ac8..087f3bde 100644 --- a/package-lock.json +++ b/package-lock.json @@ -18,9 +18,8 @@ "@ionic/vue-router": "^7.6.0", "boon-js": "^2.0.3", "core-js": "^3.6.5", + "luxon": "^3.2.0", "mitt": "^2.1.0", - "moment": "^2.29.1", - "moment-timezone": "^0.5.33", "vue": "^3.2.26", "vue-i18n": "~9.1.6", "vue-router": "^4.0.12", @@ -30,6 +29,7 @@ "devDependencies": { "@capacitor/cli": "^2.4.7", "@intlify/vue-i18n-loader": "^2.1.0", + "@types/luxon": "^3.2.0", "@typescript-eslint/eslint-plugin": "~5.26.0", "@typescript-eslint/parser": "~5.26.0", "@vue/cli-plugin-babel": "~5.0.8", @@ -2811,6 +2811,12 @@ "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==", "dev": true }, + "node_modules/@types/luxon": { + "version": "3.4.2", + "resolved": "https://registry.npmjs.org/@types/luxon/-/luxon-3.4.2.tgz", + "integrity": "sha512-TifLZlFudklWlMBfhubvgqTXRzLDI5pCbGa4P8a3wPyUQSW+1xQ5eDsreP9DWHX3tjq1ke96uYG/nwundroWcA==", + "dev": true + }, "node_modules/@types/mime": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.5.tgz", @@ -10248,6 +10254,14 @@ "yallist": "^3.0.2" } }, + "node_modules/luxon": { + "version": "3.5.0", + "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.5.0.tgz", + "integrity": "sha512-rh+Zjr6DNfUYR3bPwJEnuwDdqMbxZW7LOQfUN4B54+Cl+0o5zaU9RJ6bcidfDtC1cWCZXQ+nvX8bf6bAji37QQ==", + "engines": { + "node": ">=12" + } + }, "node_modules/magic-string": { "version": "0.30.10", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.10.tgz", @@ -10561,25 +10575,6 @@ "integrity": "sha512-23g5BFj4zdQL/b6tor7Ji+QY4pEfNH784BMslY9Qb0UnJWRAt+lQGLYmRaM0KDBwIG23ffEBELhZDP2rhi9f/Q==", "dev": true }, - "node_modules/moment": { - "version": "2.30.1", - "resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz", - "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==", - "engines": { - "node": "*" - } - }, - "node_modules/moment-timezone": { - "version": "0.5.45", - "resolved": "https://registry.npmjs.org/moment-timezone/-/moment-timezone-0.5.45.tgz", - "integrity": "sha512-HIWmqA86KcmCAhnMAN0wuDOARV/525R2+lOLotuGFzn4HO+FH+/645z2wx0Dt3iDv6/p61SIvKnDstISainhLQ==", - "dependencies": { - "moment": "^2.29.4" - }, - "engines": { - "node": "*" - } - }, "node_modules/mrmime": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz", diff --git a/package.json b/package.json index 1af8fe5d..2213beac 100644 --- a/package.json +++ b/package.json @@ -22,9 +22,8 @@ "@ionic/vue-router": "^7.6.0", "boon-js": "^2.0.3", "core-js": "^3.6.5", + "luxon": "^3.2.0", "mitt": "^2.1.0", - "moment": "^2.29.1", - "moment-timezone": "^0.5.33", "vue": "^3.2.26", "vue-i18n": "~9.1.6", "vue-router": "^4.0.12", @@ -33,6 +32,7 @@ }, "devDependencies": { "@capacitor/cli": "^2.4.7", + "@types/luxon": "^3.2.0", "@intlify/vue-i18n-loader": "^2.1.0", "@typescript-eslint/eslint-plugin": "~5.26.0", "@typescript-eslint/parser": "~5.26.0", diff --git a/src/App.vue b/src/App.vue index 00ef259a..57d3356f 100644 --- a/src/App.vue +++ b/src/App.vue @@ -7,6 +7,8 @@ \ No newline at end of file diff --git a/src/main.ts b/src/main.ts index f78422ec..cf526acc 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,8 +1,7 @@ import { createApp } from 'vue' import App from './App.vue' import router from './router'; -import moment from 'moment' -import "moment-timezone"; +import { DateTime } from 'luxon'; import { IonicVue } from '@ionic/vue'; @@ -47,17 +46,19 @@ const app = createApp(App) // Filters are removed in Vue 3 and global filter introduced https://v3.vuejs.org/guide/migration/filters.html#global-filters app.config.globalProperties.$filters = { - formatDate(value: any, inFormat?: string, outFormat?: string) { - // TODO Use Loxon instead + formatDate(value: any, inFormat?: string, outFormat = "MM-dd-yyyy") { // TODO Make default format configurable and from environment variables - return moment(value, inFormat).format(outFormat ? outFormat : 'MM-DD-YYYY'); + if(inFormat){ + return DateTime.fromFormat(value, inFormat).toFormat(outFormat); + } + return DateTime.fromISO(value).toFormat(outFormat); }, - formatUtcDate(value: any, inFormat?: string, outFormat?: string) { + formatUtcDate(value: any, inFormat?: any, outFormat = "MM-dd-yyyy") { // TODO Use Loxon instead // TODO Make default format configurable and from environment variables const userProfile = store.getters['user/getUserProfile']; // TODO Fix this setDefault should set the default timezone instead of getting it everytiem and setting the tz - return moment.utc(value, inFormat).tz(userProfile.userTimeZone).format(outFormat ? outFormat : 'MM-DD-YYYY'); + return DateTime.utc(value, inFormat).setZone(userProfile.userTimeZone).toFormat(outFormat) }, getFeature(featureHierarchy: any, featureKey: string) { let featureValue = '' diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts index 25047115..0af2ad64 100644 --- a/src/store/modules/user/actions.ts +++ b/src/store/modules/user/actions.ts @@ -5,9 +5,8 @@ import UserState from './UserState' import * as types from './mutation-types' import { hasError, showToast } from '@/utils' import { translate } from '@/i18n' -import moment from 'moment'; +import { DateTime } from 'luxon' import emitter from '@/event-bus' -import "moment-timezone"; import { updateInstanceUrl, updateToken, resetConfig } from '@/adapter' import { prepareAppPermissions, setPermissions } from '@/authorization' import { OrderService } from '@/services/OrderService' @@ -88,7 +87,7 @@ const actions: ActionTree = { async getProfile ( { commit }) { const resp = await UserService.getProfile() if (resp.status === 200) { - const localTimeZone = moment.tz.guess(); + const localTimeZone = DateTime.now().zoneName; if (resp.data.userTimeZone !== localTimeZone) { emitter.emit('timeZoneDifferent', { profileTimeZone: resp.data.userTimeZone, localTimeZone}); } diff --git a/src/views/Order.vue b/src/views/Order.vue index 04168dac..d7b6a400 100644 --- a/src/views/Order.vue +++ b/src/views/Order.vue @@ -12,7 +12,7 @@ {{ order.customerName }}

{{ order.id }}

- {{ $filters.formatDate(order.orderDate) }} + {{ $filters.formatDate(order.orderDate, "yyyy-MM-dd HH:mm:ss") }} @@ -609,10 +609,6 @@ export default defineComponent({ const itemsForCancellation = shipGroup.items.filter((item: any) => item.isItemCancelled); const itemsWithFacility = shipGroup.items.filter((item: any) => item.selectedFacilityId) const itemsForShipping = shipGroup.items.filter((item: any) => !(item.isItemCancelled || item.selectedFacilityId)) - console.log(itemsForCancellation); - console.log(itemsWithFacility); - console.log(itemsForShipping); - if(itemsForCancellation.length) { isUpdated = await this.cancelShipGroup(shipGroup, itemsForCancellation)