From 349c2cae3563db6f6099f6f24c9f10c3be4b5514 Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Thu, 14 Sep 2023 10:58:07 +0530 Subject: [PATCH 01/11] Implemented: centralized facility switcher to be used in all app (#138) --- src/components/FacilitySwitcher.vue | 49 +++++++++++++++++++++++++++++ src/components/Login.ts | 2 +- src/components/index.ts | 1 + src/index.ts | 13 +++++--- 4 files changed, 59 insertions(+), 6 deletions(-) create mode 100644 src/components/FacilitySwitcher.vue diff --git a/src/components/FacilitySwitcher.vue b/src/components/FacilitySwitcher.vue new file mode 100644 index 00000000..27ec5e28 --- /dev/null +++ b/src/components/FacilitySwitcher.vue @@ -0,0 +1,49 @@ + + + \ No newline at end of file diff --git a/src/components/Login.ts b/src/components/Login.ts index 1e82536e..6d3cf0ac 100644 --- a/src/components/Login.ts +++ b/src/components/Login.ts @@ -27,7 +27,7 @@ export default defineComponent({ window.location.href = context.appLoginUrl return } - + const { token, oms, expirationTime } = this.route.query this.handleUserFlow(token, oms, expirationTime) }, diff --git a/src/components/index.ts b/src/components/index.ts index 0879373c..ebf485ba 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -14,3 +14,4 @@ import '@ionic/vue/css/text-transformation.css'; import '@ionic/vue/css/flex-utils.css'; import '@ionic/vue/css/display.css'; +export { default as FacilitySwitcher } from './FacilitySwitcher.vue'; \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index d6177c7a..0a02af65 100644 --- a/src/index.ts +++ b/src/index.ts @@ -2,6 +2,7 @@ import { createPinia } from "pinia"; import { useProductIdentificationStore } from "./store/productIdentification"; import { useAuthStore } from "./store/auth"; import Login from "./components/Login"; +import { FacilitySwitcher } from "./components"; import ShopifyImg from "./components/ShopifyImg"; import { goToOms } from "./utils"; import piniaPluginPersistedstate from 'pinia-plugin-persistedstate' @@ -25,6 +26,7 @@ export let dxpComponents = { app.use(pinia); app.component('Login', Login) + app.component('FacilitySwitcher', FacilitySwitcher) app.component('ShopifyImg', ShopifyImg) loginContext.login = options.login @@ -39,13 +41,14 @@ export let dxpComponents = { } export { - useProductIdentificationStore, - useAuthStore, + appContext, + FacilitySwitcher, + goToOms, Login, loginContext, + productIdentificationContext, shopifyImgContext, ShopifyImg, - goToOms, - appContext, - productIdentificationContext + useProductIdentificationStore, + useAuthStore, } From b9e5f52d1f9b2aa04868832d05649e06eb0744e0 Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Mon, 18 Sep 2023 11:34:33 +0530 Subject: [PATCH 02/11] Improved: updated to dxp version 1.6.0 (#138) --- src/components/FacilitySwitcher.vue | 43 +++++++++++++++-------------- src/components/Login.ts | 2 +- 2 files changed, 24 insertions(+), 21 deletions(-) diff --git a/src/components/FacilitySwitcher.vue b/src/components/FacilitySwitcher.vue index 27ec5e28..29ac0e0a 100644 --- a/src/components/FacilitySwitcher.vue +++ b/src/components/FacilitySwitcher.vue @@ -18,32 +18,35 @@ \ No newline at end of file diff --git a/src/components/Login.ts b/src/components/Login.ts index 98817101..66356363 100644 --- a/src/components/Login.ts +++ b/src/components/Login.ts @@ -28,7 +28,7 @@ export default defineComponent({ window.location.href = context.appLoginUrl return } - + const { token, oms, expirationTime } = this.route.query this.handleUserFlow(token, oms, expirationTime) }, From 10595c710b1000d5810adf4beacc84a5decc607f Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Mon, 25 Sep 2023 12:13:59 +0530 Subject: [PATCH 03/11] Improved: code to use deep-clone for the computed properties, method name's (#138) --- package-lock.json | 100 +--------------------------- src/components/FacilitySwitcher.vue | 45 ++++++++----- src/components/LanguageSwitcher.vue | 11 ++- 3 files changed, 41 insertions(+), 115 deletions(-) diff --git a/package-lock.json b/package-lock.json index 29c88ef1..484e2dc7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@hotwax/dxp-components", - "version": "1.7.0", + "version": "1.6.0", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@hotwax/dxp-components", - "version": "1.7.0", + "version": "1.6.0", "license": "Apache-2.0", "dependencies": { "@hotwax/oms-api": "^1.8.1", @@ -16,8 +16,7 @@ "luxon": "^3.3.0", "pinia": "2.0.36", "pinia-plugin-persistedstate": "^3.1.0", - "vue": "^3.3.4", - "vue-i18n": "^9.2.2" + "vue": "^3.3.4" }, "devDependencies": { "@babel/types": "^7.22.11", @@ -1080,47 +1079,6 @@ "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "dev": true }, - "node_modules/@intlify/core-base": { - "version": "9.4.1", - "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.4.1.tgz", - "integrity": "sha512-WIwx+elsZbxSMxRG5+LC+utRohFvmZMoDevfKOfnYMLbpCjCSavqTfHJAtfsY6ruowzqXeKkeLhRHbYbjoJx5g==", - "dependencies": { - "@intlify/message-compiler": "9.4.1", - "@intlify/shared": "9.4.1" - }, - "engines": { - "node": ">= 16" - }, - "funding": { - "url": "https://github.com/sponsors/kazupon" - } - }, - "node_modules/@intlify/message-compiler": { - "version": "9.4.1", - "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.4.1.tgz", - "integrity": "sha512-aN2N+dUx320108QhH51Ycd2LEpZ+NKbzyQ2kjjhqMcxhHdxtOnkgdx+MDBhOy/CObwBmhC3Nygzc6hNlfKvPNw==", - "dependencies": { - "@intlify/shared": "9.4.1", - "source-map-js": "^1.0.2" - }, - "engines": { - "node": ">= 16" - }, - "funding": { - "url": "https://github.com/sponsors/kazupon" - } - }, - "node_modules/@intlify/shared": { - "version": "9.4.1", - "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.4.1.tgz", - "integrity": "sha512-A51elBmZWf1FS80inf/32diO9DeXoqg9GR9aUDHFcfHoNDuT46Q+fpPOdj8jiJnSHSBh8E1E+6qWRhAZXdK3Ng==", - "engines": { - "node": ">= 16" - }, - "funding": { - "url": "https://github.com/sponsors/kazupon" - } - }, "node_modules/@ionic/core": { "version": "6.7.5", "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.7.5.tgz", @@ -4670,25 +4628,6 @@ "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==", "dev": true }, - "node_modules/vue-i18n": { - "version": "9.4.1", - "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.4.1.tgz", - "integrity": "sha512-vnQyYE9LBuNOqPpETIcCaGnAyLEqfeIvDcyZ9T+WBCWFTqWw1J8FuF1jfeDwpHBi5JKgAwgXyq1mt8jp/x/GPA==", - "dependencies": { - "@intlify/core-base": "9.4.1", - "@intlify/shared": "9.4.1", - "@vue/devtools-api": "^6.5.0" - }, - "engines": { - "node": ">= 16" - }, - "funding": { - "url": "https://github.com/sponsors/kazupon" - }, - "peerDependencies": { - "vue": "^3.0.0" - } - }, "node_modules/vue-template-compiler": { "version": "2.7.14", "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.14.tgz", @@ -5619,29 +5558,6 @@ "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "dev": true }, - "@intlify/core-base": { - "version": "9.4.1", - "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.4.1.tgz", - "integrity": "sha512-WIwx+elsZbxSMxRG5+LC+utRohFvmZMoDevfKOfnYMLbpCjCSavqTfHJAtfsY6ruowzqXeKkeLhRHbYbjoJx5g==", - "requires": { - "@intlify/message-compiler": "9.4.1", - "@intlify/shared": "9.4.1" - } - }, - "@intlify/message-compiler": { - "version": "9.4.1", - "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.4.1.tgz", - "integrity": "sha512-aN2N+dUx320108QhH51Ycd2LEpZ+NKbzyQ2kjjhqMcxhHdxtOnkgdx+MDBhOy/CObwBmhC3Nygzc6hNlfKvPNw==", - "requires": { - "@intlify/shared": "9.4.1", - "source-map-js": "^1.0.2" - } - }, - "@intlify/shared": { - "version": "9.4.1", - "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.4.1.tgz", - "integrity": "sha512-A51elBmZWf1FS80inf/32diO9DeXoqg9GR9aUDHFcfHoNDuT46Q+fpPOdj8jiJnSHSBh8E1E+6qWRhAZXdK3Ng==" - }, "@ionic/core": { "version": "6.7.5", "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.7.5.tgz", @@ -8135,16 +8051,6 @@ } } }, - "vue-i18n": { - "version": "9.4.1", - "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.4.1.tgz", - "integrity": "sha512-vnQyYE9LBuNOqPpETIcCaGnAyLEqfeIvDcyZ9T+WBCWFTqWw1J8FuF1jfeDwpHBi5JKgAwgXyq1mt8jp/x/GPA==", - "requires": { - "@intlify/core-base": "9.4.1", - "@intlify/shared": "9.4.1", - "@vue/devtools-api": "^6.5.0" - } - }, "vue-template-compiler": { "version": "2.7.14", "resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.7.14.tgz", diff --git a/src/components/FacilitySwitcher.vue b/src/components/FacilitySwitcher.vue index 29ac0e0a..be7fec71 100644 --- a/src/components/FacilitySwitcher.vue +++ b/src/components/FacilitySwitcher.vue @@ -2,50 +2,61 @@ - {{ "Facility" }} + {{ $t('Facility') }} - {{ 'Specify which facility you want to operate from. Order, inventory and other configuration data will be specific to the facility you select.' }} + {{ $t('Specify which facility you want to operate from. Order, inventory and other configuration data will be specific to the facility you select.') }} - {{ "Select facility" }} - - {{ facility.name }} + {{ $t('Select facility') }} + + {{ facility.facilityName ? facility.facilityName : facility.name }} \ No newline at end of file From 1c9bdcf9e5e4b86ce069a987e434188dab39cd81 Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Fri, 6 Oct 2023 14:28:41 +0530 Subject: [PATCH 08/11] Improved: emitting function without catching them (#138) --- src/components/FacilitySwitcher.vue | 10 +++------- 1 file changed, 3 insertions(+), 7 deletions(-) diff --git a/src/components/FacilitySwitcher.vue b/src/components/FacilitySwitcher.vue index 8a1bcb52..374776e2 100644 --- a/src/components/FacilitySwitcher.vue +++ b/src/components/FacilitySwitcher.vue @@ -47,17 +47,13 @@ const setFacility = async (event: any) => { const selectedFacility = event['detail'].value if(currentUserAppState.currentFacility.facilityId && currentUserAppState.currentFacility.facilityId != selectedFacility && currentUserAppState.userProfile?.facilities) { - try { - // check-facility is emitted before setFacility action. - emit('check-facility', selectedFacility) - } catch(err) { - console.error(err); - return; - } + // check-facility is emitted before setFacility action. + emit('check-facility', selectedFacility) await appState.dispatch('user/setFacility', { 'facility': currentUserAppState.userProfile.facilities.find((facility: any) => facility.facilityId == selectedFacility) }); + // update-facility is emitted after setFacility action. emit('update-facility', selectedFacility) } From 1614a9053486adc4d3117dac18aaaa24356a5b14 Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Mon, 9 Oct 2023 18:02:49 +0530 Subject: [PATCH 09/11] Improved: added Dxp prefix in component name (dxp/138) --- .../{FacilitySwitcher.vue => DxpFacilitySwitcher.vue} | 0 src/components/index.ts | 2 +- src/index.ts | 6 +++--- 3 files changed, 4 insertions(+), 4 deletions(-) rename src/components/{FacilitySwitcher.vue => DxpFacilitySwitcher.vue} (100%) diff --git a/src/components/FacilitySwitcher.vue b/src/components/DxpFacilitySwitcher.vue similarity index 100% rename from src/components/FacilitySwitcher.vue rename to src/components/DxpFacilitySwitcher.vue diff --git a/src/components/index.ts b/src/components/index.ts index e67320ab..1a5a6f79 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -15,7 +15,7 @@ import '@ionic/vue/css/flex-utils.css'; import '@ionic/vue/css/display.css'; export { default as AppVersionInfo } from './AppVersionInfo.vue'; -export { default as FacilitySwitcher } from './FacilitySwitcher.vue'; +export { default as DxpFacilitySwitcher } from './DxpFacilitySwitcher.vue'; export { default as LanguageSwitcher } from './LanguageSwitcher.vue'; export { default as OmsInstanceNavigator } from './OmsInstanceNavigator.vue' export { default as ProductIdentifier } from "./ProductIdentifier.vue"; diff --git a/src/index.ts b/src/index.ts index f590b447..d2241672 100644 --- a/src/index.ts +++ b/src/index.ts @@ -3,7 +3,7 @@ declare var process: any; import { createPinia } from "pinia"; import { useProductIdentificationStore } from "./store/productIdentification"; import { useAuthStore } from "./store/auth"; -import { AppVersionInfo, FacilitySwitcher, LanguageSwitcher, OmsInstanceNavigator, ProductIdentifier, Scanner, ShopifyImg } from "./components"; +import { AppVersionInfo, DxpFacilitySwitcher, LanguageSwitcher, OmsInstanceNavigator, ProductIdentifier, Scanner, ShopifyImg } from "./components"; import Login from "./components/Login"; import { goToOms, getProductIdentificationValue } from "./utils"; import { initialiseFirebaseApp } from "./utils/firebase" @@ -42,7 +42,7 @@ export let dxpComponents = { app.use(i18n); app.component('AppVersionInfo', AppVersionInfo) - app.component('FacilitySwitcher', FacilitySwitcher) + app.component('DxpFacilitySwitcher', DxpFacilitySwitcher) app.component('LanguageSwitcher', LanguageSwitcher) app.component('Login', Login) app.component('OmsInstanceNavigator', OmsInstanceNavigator) @@ -76,7 +76,7 @@ export let dxpComponents = { export { appContext, - FacilitySwitcher, + DxpFacilitySwitcher, getProductIdentificationValue, goToOms, i18n, From 40558c45f1636835d03689cc11c616b236e17958 Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Tue, 10 Oct 2023 15:27:13 +0530 Subject: [PATCH 10/11] Improved: emits name and if condition code (#138) --- src/components/DxpFacilitySwitcher.vue | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/components/DxpFacilitySwitcher.vue b/src/components/DxpFacilitySwitcher.vue index 374776e2..46581b09 100644 --- a/src/components/DxpFacilitySwitcher.vue +++ b/src/components/DxpFacilitySwitcher.vue @@ -31,7 +31,7 @@ import { import { appContext } from '../index'; import { computed } from 'vue'; -const emit = defineEmits(['check-facility', 'update-facility']) +const emit = defineEmits(['before-set-facility', 'after-set-facility']); const appState = appContext.config.globalProperties.$store; const userAppState = computed(() => { @@ -42,20 +42,20 @@ const userAppState = computed(() => { } }); -const setFacility = async (event: any) => { +const setFacility = async (event: CustomEvent) => { const currentUserAppState = JSON.parse(JSON.stringify(userAppState.value)) - const selectedFacility = event['detail'].value + const selectedFacility = event.detail.value - if(currentUserAppState.currentFacility.facilityId && currentUserAppState.currentFacility.facilityId != selectedFacility && currentUserAppState.userProfile?.facilities) { - // check-facility is emitted before setFacility action. - emit('check-facility', selectedFacility) + if(currentUserAppState.currentFacility.facilityId !== selectedFacility && currentUserAppState.userProfile?.facilities) { + // before-set-facility is emitted before setFacility action. + emit('before-set-facility', selectedFacility) await appState.dispatch('user/setFacility', { - 'facility': currentUserAppState.userProfile.facilities.find((facility: any) => facility.facilityId == selectedFacility) + 'facility': currentUserAppState.userProfile.facilities.find((facility: any) => facility.facilityId === selectedFacility) }); - // update-facility is emitted after setFacility action. - emit('update-facility', selectedFacility) + // after-set-facility is emitted after setFacility action. + emit('after-set-facility', selectedFacility) } } \ No newline at end of file From 30c28d4398b0cf38a4c4fbbcda7e796be384795d Mon Sep 17 00:00:00 2001 From: amansinghbais Date: Thu, 12 Oct 2023 16:01:18 +0530 Subject: [PATCH 11/11] Improved: variable name and used arrow function in computed(#138) --- src/components/DxpFacilitySwitcher.vue | 21 +++++++++------------ 1 file changed, 9 insertions(+), 12 deletions(-) diff --git a/src/components/DxpFacilitySwitcher.vue b/src/components/DxpFacilitySwitcher.vue index 46581b09..c858264e 100644 --- a/src/components/DxpFacilitySwitcher.vue +++ b/src/components/DxpFacilitySwitcher.vue @@ -34,28 +34,25 @@ import { computed } from 'vue'; const emit = defineEmits(['before-set-facility', 'after-set-facility']); const appState = appContext.config.globalProperties.$store; -const userAppState = computed(() => { - return { - currentFacility: appState.getters['user/getCurrentFacility'], - userProfile: appState.getters['user/getUserProfile'], - uploadProducts: appState.getters['product/getUploadProducts'] - } -}); +const userAppState = computed(() => ({ + currentFacility: appState.getters['user/getCurrentFacility'], + userProfile: appState.getters['user/getUserProfile'] +})); const setFacility = async (event: CustomEvent) => { const currentUserAppState = JSON.parse(JSON.stringify(userAppState.value)) - const selectedFacility = event.detail.value + const facilityId = event.detail.value - if(currentUserAppState.currentFacility.facilityId !== selectedFacility && currentUserAppState.userProfile?.facilities) { + if(currentUserAppState.currentFacility.facilityId !== facilityId && currentUserAppState.userProfile?.facilities) { // before-set-facility is emitted before setFacility action. - emit('before-set-facility', selectedFacility) + emit('before-set-facility', facilityId) await appState.dispatch('user/setFacility', { - 'facility': currentUserAppState.userProfile.facilities.find((facility: any) => facility.facilityId === selectedFacility) + 'facility': currentUserAppState.userProfile.facilities.find((facility: any) => facility.facilityId === facilityId) }); // after-set-facility is emitted after setFacility action. - emit('after-set-facility', selectedFacility) + emit('after-set-facility', facilityId) } } \ No newline at end of file