From e00dafc5bb53585b872b9a033adaf6a9b9a37c4a Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Mon, 22 Jul 2024 11:32:15 +0530
Subject: [PATCH 01/11] Implemented: product identifier component receiving app
  from dxp-components(#267-v1)

---
 package-lock.json                          |   4 +-
 src/App.vue                                |   5 +-
 src/adapter/index.ts                       |   4 +-
 src/components/ClosePurchaseOrderModal.vue |  13 ++-
 src/main.ts                                |   4 +-
 src/store/modules/user/actions.ts          | 122 ++-------------------
 src/views/AddProductModal.vue              |  14 ++-
 src/views/AddProductToPOModal.vue          |  11 +-
 src/views/PurchaseOrderDetail.vue          |   9 +-
 src/views/ReturnDetails.vue                |   9 +-
 src/views/Settings.vue                     |  33 +-----
 src/views/ShipmentDetails.vue              |   9 +-
 12 files changed, 63 insertions(+), 174 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 901c6a04..33327060 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,8 +13,8 @@
         "@casl/ability": "^6.0.0",
         "@hotwax/app-version-info": "^1.0.0",
         "@hotwax/apps-theme": "^1.2.6",
-        "@hotwax/dxp-components": "1.13.0",
-        "@hotwax/oms-api": "1.14.0",
+        "@hotwax/dxp-components": "^1.13.0",
+        "@hotwax/oms-api": "^1.14.0",
         "@ionic/core": "^7.6.0",
         "@ionic/vue": "^7.6.0",
         "@ionic/vue-router": "^7.6.0",
diff --git a/src/App.vue b/src/App.vue
index c69c1636..9a16e2a4 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -17,7 +17,7 @@ import { mapGetters, useStore } from "vuex";
 import { Settings } from 'luxon';
 import { initialise, resetConfig } from '@/adapter'
 import { useRouter } from 'vue-router';
-import { translate } from "@hotwax/dxp-components"
+import { translate , useProductIdentificationStore } from "@hotwax/dxp-components"
 
 export default defineComponent({
   name: 'App',
@@ -114,6 +114,9 @@ export default defineComponent({
     if (this.userProfile && this.userProfile.userTimeZone) {
       Settings.defaultZone = this.userProfile.userTimeZone;
     }
+
+    await useProductIdentificationStore().getIdentificationPref(this.currentEComStore?.productStoreId)
+      .catch((error) => console.log(error))
   },
   unmounted() {
     emitter.off('presentLoader', this.presentLoader);
diff --git a/src/adapter/index.ts b/src/adapter/index.ts
index 368ee94d..8482fae0 100644
--- a/src/adapter/index.ts
+++ b/src/adapter/index.ts
@@ -1,11 +1,12 @@
 import { api, client, getConfig, getUserFacilities, hasError, initialise, logout, resetConfig, updateInstanceUrl, updateToken, setUserTimeZone,
-  getAvailableTimeZones } from '@hotwax/oms-api'
+  getAvailableTimeZones, getProductIdentificationPref, setProductIdentificationPref} from '@hotwax/oms-api'
 
 export {
   api,
   client,
   getConfig,
   getUserFacilities,
+  getProductIdentificationPref,
   hasError,
   initialise,
   logout,
@@ -13,5 +14,6 @@ export {
   updateInstanceUrl,
   updateToken,
   setUserTimeZone,
+  setProductIdentificationPref,
   getAvailableTimeZones
 }
\ No newline at end of file
diff --git a/src/components/ClosePurchaseOrderModal.vue b/src/components/ClosePurchaseOrderModal.vue
index 5f47cd1e..685a6b61 100644
--- a/src/components/ClosePurchaseOrderModal.vue
+++ b/src/components/ClosePurchaseOrderModal.vue
@@ -23,8 +23,8 @@
           <DxpShopifyImg size="small" :src="getProduct(item.productId).mainImageUrl" />
         </ion-thumbnail>
         <ion-label>
-          <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
-          <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
+          <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productName) }}</h2>
+          <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, item) }}</p>
         </ion-label>
         <ion-buttons>
           <ion-checkbox aria-label="itemStatus" slot="end" :modelValue="isPOItemStatusPending(item) ? item.isChecked : true" :disabled="isPOItemStatusPending(item) ? false : true" />
@@ -62,10 +62,10 @@ import {
 } from '@ionic/vue';
 import { Actions, hasPermission } from '@/authorization'
 import { closeOutline, checkmarkCircle, arrowBackOutline, saveOutline } from 'ionicons/icons';
-import { defineComponent } from 'vue';
+import { defineComponent, computed } from 'vue';
 import { mapGetters, useStore } from 'vuex'
 import { OrderService } from "@/services/OrderService";
-import { DxpShopifyImg, translate, getProductIdentificationValue } from '@hotwax/dxp-components';
+import { DxpShopifyImg, translate, getProductIdentificationValue, useProductIdentificationStore } from '@hotwax/dxp-components';
 import { useRouter } from 'vue-router';
 
 export default defineComponent({
@@ -206,6 +206,8 @@ export default defineComponent({
   setup() {
     const router = useRouter()
     const store = useStore()
+    const productIdentificationStore = useProductIdentificationStore();
+    let productIdentificationPref = computed(() => productIdentificationStore.getProductIdentificationPref)
 
     return {
       arrowBackOutline,
@@ -218,7 +220,8 @@ export default defineComponent({
       saveOutline,
       store,
       translate,
-      getProductIdentificationValue
+      getProductIdentificationValue,
+      productIdentificationPref
     };
   }
 });
diff --git a/src/main.ts b/src/main.ts
index 36cd1c36..b26f9a42 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -32,7 +32,7 @@ import permissionRules from '@/authorization/Rules';
 import permissionActions from '@/authorization/Actions';
 import { dxpComponents } from '@hotwax/dxp-components'
 import { login, logout, loader } from './user-utils';
-import { getConfig, initialise, setUserTimeZone, getAvailableTimeZones } from '@/adapter'
+import { getConfig, initialise, setUserTimeZone, getAvailableTimeZones, getProductIdentificationPref, setProductIdentificationPref } from '@/adapter'
 import localeMessages from './locales';
 
 const app = createApp(App)
@@ -53,9 +53,11 @@ const app = createApp(App)
     loader,
     appLoginUrl: process.env.VUE_APP_LOGIN_URL as string,
     getConfig,
+    getProductIdentificationPref,
     initialise,
     localeMessages,
     setUserTimeZone,
+    setProductIdentificationPref,
     getAvailableTimeZones
   });
 
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 3f6f5ea5..98f87235 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -12,7 +12,7 @@ import {
   resetPermissions,
   setPermissions
 } from '@/authorization'
-import { translate, useAuthStore } from '@hotwax/dxp-components'
+import { translate, useAuthStore, useProductIdentificationStore } from '@hotwax/dxp-components'
 import emitter from '@/event-bus'
 import store from '@/store'
 
@@ -74,6 +74,11 @@ const actions: ActionTree<UserState, RootState> = {
       const currentFacility = userProfile.facilities[0];
       const currentEComStore = await UserService.getEComStores(token, currentFacility.facilityId);
 
+      const productStoreId = currentEComStore?.productStoreId;
+
+      await useProductIdentificationStore().getIdentificationPref(productStoreId)
+        .catch((error) => console.error(error));
+
       setPermissions(appPermissions);
       if (userProfile.userTimeZone) {
         Settings.defaultZone = userProfile.userTimeZone;
@@ -163,7 +168,7 @@ const actions: ActionTree<UserState, RootState> = {
       'userPrefTypeId': 'SELECTED_BRAND',
       'userPrefValue': payload.eComStore.productStoreId
     });
-    await dispatch('getProductIdentificationPref', payload.eComStore.productStoreId);
+    await useProductIdentificationStore().getIdentificationPref(payload.eComStore.productStoreId);
     this.dispatch('util/getForceScanSetting', payload.ecomStore.productStoreId)
     this.dispatch('util/getBarcodeIdentificationPref', payload.ecomStore.productStoreId)
   },
@@ -235,119 +240,6 @@ const actions: ActionTree<UserState, RootState> = {
       return [];
     }
   },
-     
-  async setProductIdentificationPref({ commit, state }, payload) {
-    let prefValue = JSON.parse(JSON.stringify(state.productIdentificationPref))
-    const eComStoreId = (state.currentEComStore as any).productStoreId
-
-    let fromDate;
-
-    try {
-      const resp = await UserService.getProductIdentificationPref({
-        "inputFields": {
-          "productStoreId": eComStoreId,
-          "settingTypeEnumId": "PRDT_IDEN_PREF"
-        },
-        "filterByDate": 'Y',
-        "entityName": "ProductStoreSetting",
-        "fieldList": ["fromDate"],
-        "viewSize": 1
-      }) as any
-      if(resp.status == 200 && resp.data.count > 0) {
-        fromDate = resp.data.docs[0].fromDate
-      }
-    } catch(err) {
-      console.error(err)
-    }
-
-    // when selecting none as ecom store, not updating the pref as it's not possible to save pref with empty productStoreId
-    if(!(state.currentEComStore as any).productStoreId || !fromDate) {
-      showToast(translate('Unable to update product identifier preference'))
-      commit(types.USER_PREF_PRODUCT_IDENT_CHANGED, prefValue)
-      return;
-    }
-
-    prefValue[payload.id] = payload.value
-
-    const params = {
-      "fromDate": fromDate,
-      "productStoreId": eComStoreId,
-      "settingTypeEnumId": "PRDT_IDEN_PREF",
-      "settingValue": JSON.stringify(prefValue)
-    }
-
-    try {
-      const resp = await UserService.updateProductIdentificationPref(params) as any
-
-      if(resp.status == 200) {
-        showToast(translate('Product identifier preference updated'))
-      } else {
-        showToast(translate('Failed to update product identifier preference'))
-        prefValue = JSON.parse(JSON.stringify(state.productIdentificationPref))
-      }
-    } catch(err) {
-      showToast(translate('Failed to update product identifier preference'))
-      prefValue = JSON.parse(JSON.stringify(state.productIdentificationPref))
-      console.error(err)
-    }
-    commit(types.USER_PREF_PRODUCT_IDENT_CHANGED, prefValue)
-  },
-
-  async createProductIdentificationPref({ commit, state }) {
-    const prefValue = {
-      primaryId: 'productId',
-      secondaryId: ''
-    }
-
-    const params = {
-      "fromDate": Date.now(),
-      "productStoreId": (state.currentEComStore as any).productStoreId,
-      "settingTypeEnumId": "PRDT_IDEN_PREF",
-      "settingValue": JSON.stringify(prefValue)
-    }
-
-    try {
-      await UserService.createProductIdentificationPref(params) as any
-    } catch(err) {
-      console.error(err)
-    }
-
-    // not checking for resp success and fail case as every time we need to update the state with the
-    // default value when creating a pref
-    commit(types.USER_PREF_PRODUCT_IDENT_CHANGED, prefValue)
-  },
-
-  async getProductIdentificationPref({ commit, dispatch }, eComStoreId) {
-
-    // when selecting none as ecom store, not fetching the pref as it returns all the entries with the pref id
-    if(!eComStoreId) {
-      commit(types.USER_PREF_PRODUCT_IDENT_CHANGED, {'primaryId': 'productId', 'secondaryId': ''})
-      return;
-    }
-
-    const payload = {
-      "inputFields": {
-        "productStoreId": eComStoreId,
-        "settingTypeEnumId": "PRDT_IDEN_PREF"
-      },
-      "filterByDate": 'Y',
-      "entityName": "ProductStoreSetting",
-      "fieldList": ["settingValue", "fromDate"],
-      "viewSize": 1
-    }
-
-    try {
-      const resp = await UserService.getProductIdentificationPref(payload) as any
-      if(resp.status == 200 && resp.data.count > 0) {
-        const respValue = JSON.parse(resp.data.docs[0].settingValue)
-        commit(types.USER_PREF_PRODUCT_IDENT_CHANGED, {'primaryId': respValue['primaryId'], 'secondaryId': respValue['secondaryId']})
-      } else if(resp.status == 200 && resp.data.error) {
-        dispatch('createProductIdentificationPref')
-      }
-    } catch(err) {
-      console.error(err)
-    }
-  },
 
   updatePwaState({ commit }, payload) {
     commit(types.USER_PWA_STATE_UPDATED, payload);
diff --git a/src/views/AddProductModal.vue b/src/views/AddProductModal.vue
index 08abfaa0..d778bfc6 100644
--- a/src/views/AddProductModal.vue
+++ b/src/views/AddProductModal.vue
@@ -20,8 +20,8 @@
           </ion-thumbnail>
           <ion-label>
             <!-- Honouring the identifications set by the user on the settings page -->
-            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) : getProduct(product.productId).productName }}</h2>
-            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId)) }}</p>
+            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, product) ? getProductIdentificationValue(productIdentificationPref.primaryId, product) : product.productName }}</h2>
+            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, product) }}</p>
           </ion-label>
           <ion-icon v-if="isProductAvailableInShipment(product.productId)" color="success" :icon="checkmarkCircle" />
           <ion-button v-else fill="outline" @click="addtoShipment(product)">{{ translate("Add to Shipment") }}</ion-button>
@@ -65,11 +65,11 @@ import {
   IonToolbar,
   modalController,
 } from '@ionic/vue';
-import { defineComponent } from 'vue';
+import { defineComponent, computed } from 'vue';
 import { closeOutline, checkmarkCircle } from 'ionicons/icons';
 import { mapGetters } from 'vuex'
 import { useStore } from "@/store";
-import { DxpShopifyImg, translate, getProductIdentificationValue } from '@hotwax/dxp-components';
+import { DxpShopifyImg, translate, getProductIdentificationValue, useProductIdentificationStore } from '@hotwax/dxp-components';
 import { showToast } from '@/utils'
 
 export default defineComponent({
@@ -169,12 +169,16 @@ export default defineComponent({
   },
   setup() {
     const store = useStore();
+    const productIdentificationStore = useProductIdentificationStore();
+    let productIdentificationPref = computed(() => productIdentificationStore.getProductIdentificationPref)
+
     return {
       closeOutline,
       checkmarkCircle,
       store,
       translate,
-      getProductIdentificationValue
+      getProductIdentificationValue,
+      productIdentificationPref
     };
   },
 });
diff --git a/src/views/AddProductToPOModal.vue b/src/views/AddProductToPOModal.vue
index 9a3f1911..7bc24e73 100644
--- a/src/views/AddProductToPOModal.vue
+++ b/src/views/AddProductToPOModal.vue
@@ -19,8 +19,8 @@
           </ion-thumbnail>
           <ion-label>
             <!-- Honouring the identifications set by the user on the settings page -->
-            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) : getProduct(product.productId).productName }}</h2>
-            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId)) }}</p>
+            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, product) ? getProductIdentificationValue(productIdentificationPref.primaryId, product) : product.productNames }}</h2>
+            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, product) }}</p>
           </ion-label>
           <ion-icon v-if="isProductAvailableInOrder(product.productId)" color="success" :icon="checkmarkCircle" />
           <ion-button v-else fill="outline" @click="addtoOrder(product)">{{ translate("Add to Purchase Order") }}</ion-button>
@@ -56,11 +56,11 @@ import {
   IonToolbar,
   modalController,
 } from '@ionic/vue';
-import { defineComponent } from 'vue';
+import { defineComponent, computed } from 'vue';
 import { closeOutline, checkmarkCircle } from 'ionicons/icons';
 import { mapGetters } from 'vuex'
 import { useStore } from "@/store";
-import { DxpShopifyImg, translate, getProductIdentificationValue } from '@hotwax/dxp-components';
+import { DxpShopifyImg, translate, getProductIdentificationValue, useProductIdentificationStore } from '@hotwax/dxp-components';
 import { showToast } from '@/utils'
 
 export default defineComponent({
@@ -160,12 +160,15 @@ export default defineComponent({
   },
   setup() {
     const store = useStore();
+    const productIdentificationStore = useProductIdentificationStore();
+    let productIdentificationPref = computed(() => productIdentificationStore.getProductIdentificationPref);
     return {
       closeOutline,
       checkmarkCircle,
       store,
       translate,
       getProductIdentificationValue,
+      productIdentificationPref
     };
   },
 });
diff --git a/src/views/PurchaseOrderDetail.vue b/src/views/PurchaseOrderDetail.vue
index ab183b3a..8c7ccadc 100644
--- a/src/views/PurchaseOrderDetail.vue
+++ b/src/views/PurchaseOrderDetail.vue
@@ -177,10 +177,10 @@ import {
   alertController,
   modalController
 } from '@ionic/vue';
-import { defineComponent } from 'vue';
+import { defineComponent, computed } from 'vue';
 import { addOutline, cameraOutline, checkmarkDone, copyOutline, eyeOffOutline, eyeOutline, locationOutline, saveOutline, timeOutline } from 'ionicons/icons';
 import ReceivingHistoryModal from '@/views/ReceivingHistoryModal.vue'
-import { DxpShopifyImg, translate, getProductIdentificationValue } from '@hotwax/dxp-components';
+import { DxpShopifyImg, translate, getProductIdentificationValue, useProductIdentificationStore } from '@hotwax/dxp-components';
 import { useStore, mapGetters } from 'vuex';
 import { useRouter } from 'vue-router';
 import Scanner from "@/components/Scanner.vue"
@@ -389,6 +389,8 @@ export default defineComponent({
   setup() {
     const store = useStore();
     const router = useRouter();
+    const productIdentificationStore = useProductIdentificationStore();
+    let productIdentificationPref = computed(() => productIdentificationStore.getProductIdentificationPref);
 
     return {
       Actions,
@@ -406,7 +408,8 @@ export default defineComponent({
       store,
       timeOutline,
       translate,
-      getProductIdentificationValue
+      getProductIdentificationValue,
+      productIdentificationPref,
     };
   },
 });
diff --git a/src/views/ReturnDetails.vue b/src/views/ReturnDetails.vue
index 3b73015d..d028199e 100644
--- a/src/views/ReturnDetails.vue
+++ b/src/views/ReturnDetails.vue
@@ -106,11 +106,11 @@ import {
   modalController,
   alertController,
 } from '@ionic/vue';
-import { defineComponent } from 'vue';
+import { defineComponent, computed } from 'vue';
 import { checkmarkDone, barcodeOutline, locationOutline } from 'ionicons/icons';
 import { mapGetters, useStore } from "vuex";
 import AddProductModal from '@/views/AddProductModal.vue'
-import { DxpShopifyImg, translate, getProductIdentificationValue } from '@hotwax/dxp-components';
+import { DxpShopifyImg, translate, getProductIdentificationValue, useProductIdentificationStore } from '@hotwax/dxp-components';
 import { useRouter } from 'vue-router';
 import Scanner from "@/components/Scanner.vue";
 import ImageModal from '@/components/ImageModal.vue';
@@ -285,6 +285,8 @@ export default defineComponent({
   setup() {
     const store = useStore(); 
     const router = useRouter();
+    const productIdentificationStore = useProductIdentificationStore();
+    let productIdentificationPref = computed(() => productIdentificationStore.getProductIdentificationPref)
 
     return {
       Actions,
@@ -295,7 +297,8 @@ export default defineComponent({
       store,
       router,
       translate,
-      getProductIdentificationValue
+      getProductIdentificationValue,
+      productIdentificationPref
     };
   },
 });
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index e4ed01f6..f098456f 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -59,29 +59,7 @@
       <DxpAppVersionInfo />
 
       <section>
-        <ion-card>
-          <ion-card-header>
-            <ion-card-title>
-              {{ translate('Product Identifier') }}
-            </ion-card-title>
-          </ion-card-header>
-
-          <ion-card-content>
-            {{ translate('Choosing a product identifier allows you to view products with your preferred identifiers.') }}
-          </ion-card-content>
-
-          <ion-item>
-            <ion-select :label="translate('Primary Product Identifier')" :disabled="!hasPermission(Actions.APP_PRODUCT_IDENTIFIER_UPDATE) || !currentEComStore?.productStoreId" interface="popover" :placeholder="translate('primary identifier')" :value="productIdentificationPref.primaryId" @ionChange="setProductIdentificationPref($event.detail.value, 'primaryId')">
-              <ion-select-option v-for="identification in productIdentifications" :key="identification" :value="identification" >{{ identification }}</ion-select-option>
-            </ion-select>
-          </ion-item>
-          <ion-item>
-            <ion-select :label="translate('Secondary Product Identifier')" :disabled="!hasPermission(Actions.APP_PRODUCT_IDENTIFIER_UPDATE) || !currentEComStore?.productStoreId" interface="popover" :placeholder="translate('secondary identifier')" :value="productIdentificationPref.secondaryId" @ionChange="setProductIdentificationPref($event.detail.value, 'secondaryId')">
-              <ion-select-option v-for="identification in productIdentifications" :key="identification" :value="identification" >{{ identification }}</ion-select-option>
-              <ion-select-option value="">{{ translate("None") }}</ion-select-option>
-            </ion-select>
-          </ion-item>
-        </ion-card>
+        <DxpProductIdentifier />
         <DxpTimeZoneSwitcher @timeZoneUpdated="timeZoneUpdated" />
 
         <ion-card>
@@ -115,7 +93,7 @@ import { useRouter } from 'vue-router';
 import Image from '@/components/Image.vue'
 import { DateTime } from 'luxon';
 import { Actions, hasPermission } from '@/authorization';
-import { translate } from "@hotwax/dxp-components"
+import { DxpProductIdentifier, translate } from "@hotwax/dxp-components"
 
 export default defineComponent({
   name: 'Settings',
@@ -218,13 +196,6 @@ export default defineComponent({
     goToLaunchpad() {
       window.location.href = `${process.env.VUE_APP_LOGIN_URL}`
     },
-    setProductIdentificationPref(value: string, id: string) {
-      // Not dispatching an action if the value for id is same as saved in state
-      if(this.productIdentificationPref[id] == value) {
-        return;
-      }
-      this.store.dispatch('user/setProductIdentificationPref', { id, value })
-    },
     setBarcodeIdentificationPref(value: string) {
       this.store.dispatch('util/setBarcodeIdentificationPref', value)
     },
diff --git a/src/views/ShipmentDetails.vue b/src/views/ShipmentDetails.vue
index 4087256d..6a583fb2 100644
--- a/src/views/ShipmentDetails.vue
+++ b/src/views/ShipmentDetails.vue
@@ -112,11 +112,11 @@ import {
   modalController,
   alertController,
 } from '@ionic/vue';
-import { defineComponent } from 'vue';
+import { defineComponent, computed } from 'vue';
 import { add, checkmarkDone, cameraOutline, locationOutline } from 'ionicons/icons';
 import { mapGetters, useStore } from "vuex";
 import AddProductModal from '@/views/AddProductModal.vue'
-import { DxpShopifyImg, translate, getProductIdentificationValue } from '@hotwax/dxp-components';
+import { DxpShopifyImg, translate, getProductIdentificationValue, useProductIdentificationStore } from '@hotwax/dxp-components';
 import { useRouter } from 'vue-router';
 import Scanner from "@/components/Scanner.vue";
 import LocationPopover from '@/components/LocationPopover.vue'
@@ -303,6 +303,8 @@ export default defineComponent({
   setup() {
     const store = useStore(); 
     const router = useRouter();
+    const productIdentificationStore = useProductIdentificationStore();
+    let productIdentificationPref = computed(() => productIdentificationStore.getProductIdentificationPref)
 
     return {
       Actions,
@@ -314,7 +316,8 @@ export default defineComponent({
       store,
       router,
       translate,
-      getProductIdentificationValue
+      getProductIdentificationValue,
+      productIdentificationPref
     };
   },
 });

From 0753cf8bf00330a864bc9d353706ecd89561cac0 Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Tue, 23 Jul 2024 11:50:35 +0530
Subject: [PATCH 02/11] Fixed: fixed code syntax for primary and secondary
 identifier

---
 package-lock.json                          | 6 +++---
 src/components/ClosePurchaseOrderModal.vue | 4 ++--
 src/views/AddProductModal.vue              | 4 ++--
 src/views/AddProductToPOModal.vue          | 4 ++--
 src/views/PurchaseOrderDetail.vue          | 4 ++--
 src/views/ReturnDetails.vue                | 4 ++--
 src/views/ShipmentDetails.vue              | 4 ++--
 7 files changed, 15 insertions(+), 15 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 33327060..2e26e718 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,8 +13,8 @@
         "@casl/ability": "^6.0.0",
         "@hotwax/app-version-info": "^1.0.0",
         "@hotwax/apps-theme": "^1.2.6",
-        "@hotwax/dxp-components": "^1.13.0",
-        "@hotwax/oms-api": "^1.14.0",
+        "@hotwax/dxp-components": "1.13.0",
+        "@hotwax/oms-api": "1.14.0",
         "@ionic/core": "^7.6.0",
         "@ionic/vue": "^7.6.0",
         "@ionic/vue-router": "^7.6.0",
@@ -17613,4 +17613,4 @@
       "dev": true
     }
   }
-}
+}
\ No newline at end of file
diff --git a/src/components/ClosePurchaseOrderModal.vue b/src/components/ClosePurchaseOrderModal.vue
index 685a6b61..82a5a98d 100644
--- a/src/components/ClosePurchaseOrderModal.vue
+++ b/src/components/ClosePurchaseOrderModal.vue
@@ -23,8 +23,8 @@
           <DxpShopifyImg size="small" :src="getProduct(item.productId).mainImageUrl" />
         </ion-thumbnail>
         <ion-label>
-          <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productName) }}</h2>
-          <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, item) }}</p>
+          <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) || getProduct(item.productId).productName }}</h2>
+          <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId))}}</p>
         </ion-label>
         <ion-buttons>
           <ion-checkbox aria-label="itemStatus" slot="end" :modelValue="isPOItemStatusPending(item) ? item.isChecked : true" :disabled="isPOItemStatusPending(item) ? false : true" />
diff --git a/src/views/AddProductModal.vue b/src/views/AddProductModal.vue
index d778bfc6..531c04f2 100644
--- a/src/views/AddProductModal.vue
+++ b/src/views/AddProductModal.vue
@@ -20,8 +20,8 @@
           </ion-thumbnail>
           <ion-label>
             <!-- Honouring the identifications set by the user on the settings page -->
-            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, product) ? getProductIdentificationValue(productIdentificationPref.primaryId, product) : product.productName }}</h2>
-            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, product) }}</p>
+            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) || getProduct(product.productId).productName }}</h2>
+            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId))}}</p>
           </ion-label>
           <ion-icon v-if="isProductAvailableInShipment(product.productId)" color="success" :icon="checkmarkCircle" />
           <ion-button v-else fill="outline" @click="addtoShipment(product)">{{ translate("Add to Shipment") }}</ion-button>
diff --git a/src/views/AddProductToPOModal.vue b/src/views/AddProductToPOModal.vue
index 7bc24e73..c1c09ac9 100644
--- a/src/views/AddProductToPOModal.vue
+++ b/src/views/AddProductToPOModal.vue
@@ -19,8 +19,8 @@
           </ion-thumbnail>
           <ion-label>
             <!-- Honouring the identifications set by the user on the settings page -->
-            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, product) ? getProductIdentificationValue(productIdentificationPref.primaryId, product) : product.productNames }}</h2>
-            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, product) }}</p>
+            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) || getProduct(product.productId).productName }}</h2>
+            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId))}}</p>
           </ion-label>
           <ion-icon v-if="isProductAvailableInOrder(product.productId)" color="success" :icon="checkmarkCircle" />
           <ion-button v-else fill="outline" @click="addtoOrder(product)">{{ translate("Add to Purchase Order") }}</ion-button>
diff --git a/src/views/PurchaseOrderDetail.vue b/src/views/PurchaseOrderDetail.vue
index 8c7ccadc..1720f7dc 100644
--- a/src/views/PurchaseOrderDetail.vue
+++ b/src/views/PurchaseOrderDetail.vue
@@ -56,8 +56,8 @@
                   <DxpShopifyImg size="small" :src="getProduct(item.productId).mainImageUrl" />
                 </ion-thumbnail>
                 <ion-label class="ion-text-wrap">
-                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
-                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
+                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) || getProduct(item.productId).productName }}</h2>
+                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId))}}</p>
                 </ion-label>
               </ion-item>
             </div>
diff --git a/src/views/ReturnDetails.vue b/src/views/ReturnDetails.vue
index d028199e..9c73e7ed 100644
--- a/src/views/ReturnDetails.vue
+++ b/src/views/ReturnDetails.vue
@@ -41,8 +41,8 @@
                   <DxpShopifyImg :src="getProduct(item.productId).mainImageUrl" />
                 </ion-thumbnail>
                 <ion-label class="ion-text-wrap">
-                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
-                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
+                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) || getProduct(item.productId).productName }}</h2>
+                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId))}}</p>
                 </ion-label>
               </ion-item>
             </div>
diff --git a/src/views/ShipmentDetails.vue b/src/views/ShipmentDetails.vue
index 6a583fb2..3c0d17d1 100644
--- a/src/views/ShipmentDetails.vue
+++ b/src/views/ShipmentDetails.vue
@@ -39,8 +39,8 @@
                   <DxpShopifyImg :src="getProduct(item.productId).mainImageUrl" />
                 </ion-thumbnail>
                 <ion-label class="ion-text-wrap">
-                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
-                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
+                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) || getProduct(item.productId).productName }}</h2>
+                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId))}}</p>
                 </ion-label>
               </ion-item>
             </div>

From 71c48f1efeb91c77c210ab502ecb5306c0090fd3 Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Tue, 23 Jul 2024 15:57:58 +0530
Subject: [PATCH 03/11] Removed: removed getter , mutation for
 productIdentificationPref as now using it from DXP

---
 src/store/modules/user/UserState.ts      | 1 -
 src/store/modules/user/getters.ts        | 3 ---
 src/store/modules/user/index.ts          | 4 ----
 src/store/modules/user/mutation-types.ts | 1 -
 src/store/modules/user/mutations.ts      | 3 ---
 src/views/AddProductModal.vue            | 4 ++--
 src/views/AddProductToPOModal.vue        | 4 ++--
 src/views/PurchaseOrderDetail.vue        | 4 ++--
 src/views/ReturnDetails.vue              | 4 ++--
 src/views/ShipmentDetails.vue            | 4 ++--
 10 files changed, 10 insertions(+), 22 deletions(-)

diff --git a/src/store/modules/user/UserState.ts b/src/store/modules/user/UserState.ts
index 05dae63f..cb10271c 100644
--- a/src/store/modules/user/UserState.ts
+++ b/src/store/modules/user/UserState.ts
@@ -5,7 +5,6 @@ export default interface UserState {
     currentEComStore: object;
     instanceUrl: string;
     facilityLocationsByFacilityId: any;
-    productIdentificationPref: any;
     permissions: any;
     pwaState: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/user/getters.ts b/src/store/modules/user/getters.ts
index 79aa853b..7a584b2b 100644
--- a/src/store/modules/user/getters.ts
+++ b/src/store/modules/user/getters.ts
@@ -36,9 +36,6 @@ const getters: GetterTree <UserState, RootState> = {
     getFacilityLocationsByFacilityId: (state) => (facilityId: string) => {
         return state.facilityLocationsByFacilityId[facilityId];
     },
-    getProductIdentificationPref: (state) => {
-        return state.productIdentificationPref;
-    },
     getPwaState(state) {
         return state.pwaState;
     }
diff --git a/src/store/modules/user/index.ts b/src/store/modules/user/index.ts
index b2ac1a25..c66cd8e1 100644
--- a/src/store/modules/user/index.ts
+++ b/src/store/modules/user/index.ts
@@ -15,10 +15,6 @@ const userModule: Module<UserState, RootState> = {
       permissions: [],
       instanceUrl: '',
       facilityLocationsByFacilityId: {},
-      productIdentificationPref: {
-        primaryId: 'productId',
-        secondaryId: ''
-      },
       pwaState: {
         updateExists: false,
         registration: null,
diff --git a/src/store/modules/user/mutation-types.ts b/src/store/modules/user/mutation-types.ts
index 34385352..f8fe7be5 100644
--- a/src/store/modules/user/mutation-types.ts
+++ b/src/store/modules/user/mutation-types.ts
@@ -6,6 +6,5 @@ export const USER_CURRENT_FACILITY_UPDATED = SN_USER + '/CURRENT_FACILITY_UPDATE
 export const USER_INSTANCE_URL_UPDATED = SN_USER + '/INSTANCE_URL_UPDATED'
 export const USER_CURRENT_ECOM_STORE_UPDATED = SN_USER + '/CURRENT_ECOM_STORE_UPDATED'
 export const USER_FACILITY_LOCATIONS_BY_FACILITY_ID = SN_USER + '/FACILITY_LOCATIONS_BY_FACILITY_ID'
-export const USER_PREF_PRODUCT_IDENT_CHANGED = SN_USER + '/PREF_PRODUCT_IDENT_CHANGED'
 export const USER_PERMISSIONS_UPDATED = SN_USER + '/PERMISSIONS_UPDATED'
 export const USER_PWA_STATE_UPDATED = SN_USER + '/PWA_STATE_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/user/mutations.ts b/src/store/modules/user/mutations.ts
index 206a09ef..df65bfb1 100644
--- a/src/store/modules/user/mutations.ts
+++ b/src/store/modules/user/mutations.ts
@@ -28,9 +28,6 @@ const mutations: MutationTree <UserState> = {
     [types.USER_FACILITY_LOCATIONS_BY_FACILITY_ID] (state, payload) {
         state.facilityLocationsByFacilityId[payload.facilityId] = payload.facilityLocations;
     },
-    [types.USER_PREF_PRODUCT_IDENT_CHANGED](state, payload) {
-        state.productIdentificationPref = payload
-    },
     [types.USER_PERMISSIONS_UPDATED] (state, payload) {
         state.permissions = payload
     },
diff --git a/src/views/AddProductModal.vue b/src/views/AddProductModal.vue
index 531c04f2..6a8a217c 100644
--- a/src/views/AddProductModal.vue
+++ b/src/views/AddProductModal.vue
@@ -20,8 +20,8 @@
           </ion-thumbnail>
           <ion-label>
             <!-- Honouring the identifications set by the user on the settings page -->
-            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) || getProduct(product.productId).productName }}</h2>
-            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId))}}</p>
+            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) : getProduct(product.productId).productName }}</h2>
+            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId)) }}</p>
           </ion-label>
           <ion-icon v-if="isProductAvailableInShipment(product.productId)" color="success" :icon="checkmarkCircle" />
           <ion-button v-else fill="outline" @click="addtoShipment(product)">{{ translate("Add to Shipment") }}</ion-button>
diff --git a/src/views/AddProductToPOModal.vue b/src/views/AddProductToPOModal.vue
index c1c09ac9..7b91a3b7 100644
--- a/src/views/AddProductToPOModal.vue
+++ b/src/views/AddProductToPOModal.vue
@@ -19,8 +19,8 @@
           </ion-thumbnail>
           <ion-label>
             <!-- Honouring the identifications set by the user on the settings page -->
-            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) || getProduct(product.productId).productName }}</h2>
-            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId))}}</p>
+            <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) : getProduct(product.productId).productName }}</h2>
+            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId)) }}</p>          
           </ion-label>
           <ion-icon v-if="isProductAvailableInOrder(product.productId)" color="success" :icon="checkmarkCircle" />
           <ion-button v-else fill="outline" @click="addtoOrder(product)">{{ translate("Add to Purchase Order") }}</ion-button>
diff --git a/src/views/PurchaseOrderDetail.vue b/src/views/PurchaseOrderDetail.vue
index 1720f7dc..8c7ccadc 100644
--- a/src/views/PurchaseOrderDetail.vue
+++ b/src/views/PurchaseOrderDetail.vue
@@ -56,8 +56,8 @@
                   <DxpShopifyImg size="small" :src="getProduct(item.productId).mainImageUrl" />
                 </ion-thumbnail>
                 <ion-label class="ion-text-wrap">
-                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) || getProduct(item.productId).productName }}</h2>
-                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId))}}</p>
+                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
+                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
                 </ion-label>
               </ion-item>
             </div>
diff --git a/src/views/ReturnDetails.vue b/src/views/ReturnDetails.vue
index 9c73e7ed..d028199e 100644
--- a/src/views/ReturnDetails.vue
+++ b/src/views/ReturnDetails.vue
@@ -41,8 +41,8 @@
                   <DxpShopifyImg :src="getProduct(item.productId).mainImageUrl" />
                 </ion-thumbnail>
                 <ion-label class="ion-text-wrap">
-                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) || getProduct(item.productId).productName }}</h2>
-                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId))}}</p>
+                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
+                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
                 </ion-label>
               </ion-item>
             </div>
diff --git a/src/views/ShipmentDetails.vue b/src/views/ShipmentDetails.vue
index 3c0d17d1..f66cc1b0 100644
--- a/src/views/ShipmentDetails.vue
+++ b/src/views/ShipmentDetails.vue
@@ -39,8 +39,8 @@
                   <DxpShopifyImg :src="getProduct(item.productId).mainImageUrl" />
                 </ion-thumbnail>
                 <ion-label class="ion-text-wrap">
-                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) || getProduct(item.productId).productName }}</h2>
-                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId))}}</p>
+                  <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
+                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>                
                 </ion-label>
               </ion-item>
             </div>

From d378b59dc7e7a3376dc36dfcfa5902b2af163c3e Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Tue, 23 Jul 2024 17:09:15 +0530
Subject: [PATCH 04/11] Removed: removed productIdentifiers getter , mutation

---
 src/App.vue                                | 19 -------------------
 src/components/ClosePurchaseOrderModal.vue |  4 ++--
 src/store/modules/util/UtilState.ts        |  1 -
 src/store/modules/util/actions.ts          |  3 ---
 src/store/modules/util/getters.ts          |  3 ---
 src/store/modules/util/index.ts            |  1 -
 src/store/modules/util/mutations.ts        |  3 ---
 src/views/AddProductToPOModal.vue          |  2 +-
 src/views/Settings.vue                     |  1 -
 src/views/ShipmentDetails.vue              |  2 +-
 10 files changed, 4 insertions(+), 35 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 9a16e2a4..e960eb00 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -36,7 +36,6 @@ export default defineComponent({
   computed: {
     ...mapGetters({
       currentEComStore: 'user/getCurrentEComStore',
-      productIdentifications: 'util/getProductIdentifications',
       userProfile: 'user/getUserProfile',
       userToken: 'user/getUserToken',
       instanceUrl: 'user/getInstanceUrl'
@@ -100,24 +99,6 @@ export default defineComponent({
     emitter.on('presentLoader', this.presentLoader);
     emitter.on('dismissLoader', this.dismissLoader);
   },
-  async mounted() {
-    if(this.productIdentifications.length <= 0) {
-      // TODO: fetch product identifications from enumeration instead of storing it in env
-      this.store.dispatch('util/setProductIdentifications', process.env.VUE_APP_PRDT_IDENT ? JSON.parse(process.env.VUE_APP_PRDT_IDENT) : [])
-    }
-
-    if(this.userProfile) {
-      this.store.dispatch('user/getProductIdentificationPref', this.currentEComStore.productStoreId);
-    }
-    // Handles case when user resumes or reloads the app
-    // Luxon timezzone should be set with the user's selected timezone
-    if (this.userProfile && this.userProfile.userTimeZone) {
-      Settings.defaultZone = this.userProfile.userTimeZone;
-    }
-
-    await useProductIdentificationStore().getIdentificationPref(this.currentEComStore?.productStoreId)
-      .catch((error) => console.log(error))
-  },
   unmounted() {
     emitter.off('presentLoader', this.presentLoader);
     emitter.off('dismissLoader', this.dismissLoader);
diff --git a/src/components/ClosePurchaseOrderModal.vue b/src/components/ClosePurchaseOrderModal.vue
index 82a5a98d..1a0f68db 100644
--- a/src/components/ClosePurchaseOrderModal.vue
+++ b/src/components/ClosePurchaseOrderModal.vue
@@ -23,8 +23,8 @@
           <DxpShopifyImg size="small" :src="getProduct(item.productId).mainImageUrl" />
         </ion-thumbnail>
         <ion-label>
-          <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) || getProduct(item.productId).productName }}</h2>
-          <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId))}}</p>
+          <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
+          <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
         </ion-label>
         <ion-buttons>
           <ion-checkbox aria-label="itemStatus" slot="end" :modelValue="isPOItemStatusPending(item) ? item.isChecked : true" :disabled="isPOItemStatusPending(item) ? false : true" />
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index 3966daf5..23cb54c5 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -1,6 +1,5 @@
 export default interface UtilState {
     status: any;
-    productIdentifications: Array<string>;
     isForceScanEnabled: boolean;
     barcodeIdentificationPref: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 4ab98e13..1f5ed247 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -47,9 +47,6 @@ const actions: ActionTree<UtilState, RootState> = {
     }
     return cachedStatus;
   },
-  async setProductIdentifications({ commit }, payload) {
-    commit(types.UTIL_PRODUCT_IDENT_UPDATED, payload)
-  },
 
   async getForceScanSetting({ commit, dispatch }, eComStoreId) {
     const payload = {
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 2c308a40..2dc66395 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -6,9 +6,6 @@ const getters: GetterTree <UtilState, RootState> = {
   getStatusDesc: (state) => (statusId: string) => {
     return state.status[statusId]
   },
-  getProductIdentifications: (state) => {
-    return state.productIdentifications
-  },
   isForceScanEnabled(state) {
     return state.isForceScanEnabled
   },
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 3afbf758..680e6368 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -9,7 +9,6 @@ const utilModule: Module<UtilState, RootState> = {
     namespaced: true,
     state: {
       status: {},
-      productIdentifications: [],
       isForceScanEnabled: false,
       barcodeIdentificationPref: ""
     },
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index f1971c1e..46e4f55a 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -6,9 +6,6 @@ const mutations: MutationTree <UtilState> = {
   [types.UTIL_STATUS_UPDATED](state, payload) {
     state.status = payload
   },
-  [types.UTIL_PRODUCT_IDENT_UPDATED](state, payload) {
-    state.productIdentifications = payload
-  },
   [types.UTIL_FORCE_SCAN_STATUS_UPDATED](state, payload) {
     state.isForceScanEnabled = payload
   },
diff --git a/src/views/AddProductToPOModal.vue b/src/views/AddProductToPOModal.vue
index 7b91a3b7..9af7c17e 100644
--- a/src/views/AddProductToPOModal.vue
+++ b/src/views/AddProductToPOModal.vue
@@ -20,7 +20,7 @@
           <ion-label>
             <!-- Honouring the identifications set by the user on the settings page -->
             <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(product.productId)) : getProduct(product.productId).productName }}</h2>
-            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId)) }}</p>          
+            <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(product.productId)) }}</p>
           </ion-label>
           <ion-icon v-if="isProductAvailableInOrder(product.productId)" color="success" :icon="checkmarkCircle" />
           <ion-button v-else fill="outline" @click="addtoOrder(product)">{{ translate("Add to Purchase Order") }}</ion-button>
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index f098456f..8d528684 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -132,7 +132,6 @@ export default defineComponent({
       userProfile: 'user/getUserProfile',
       currentFacility: 'user/getCurrentFacility',
       currentEComStore: 'user/getCurrentEComStore',
-      productIdentifications: 'util/getProductIdentifications',
       productIdentificationPref: 'user/getProductIdentificationPref',
       isForceScanEnabled: 'util/isForceScanEnabled',
       barcodeIdentificationPref: 'util/getBarcodeIdentificationPref'
diff --git a/src/views/ShipmentDetails.vue b/src/views/ShipmentDetails.vue
index f66cc1b0..6a583fb2 100644
--- a/src/views/ShipmentDetails.vue
+++ b/src/views/ShipmentDetails.vue
@@ -40,7 +40,7 @@
                 </ion-thumbnail>
                 <ion-label class="ion-text-wrap">
                   <h2>{{ getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) ? getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) : getProduct(item.productId).productName }}</h2>
-                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>                
+                  <p>{{ getProductIdentificationValue(productIdentificationPref.secondaryId, getProduct(item.productId)) }}</p>
                 </ion-label>
               </ion-item>
             </div>

From 3fd41bd4bc11730c9cc407cce6804c3af690b20e Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Wed, 24 Jul 2024 11:07:20 +0530
Subject: [PATCH 05/11] Removed: removed productIdentifiers action calls ,
 implememnted code to fetch the product identification options from dxp

---
 src/App.vue                                | 13 +++++++++++++
 src/components/ClosePurchaseOrderModal.vue |  1 -
 src/store/modules/user/actions.ts          |  1 -
 src/views/AddProductModal.vue              |  1 -
 src/views/AddProductToPOModal.vue          |  1 -
 src/views/PurchaseOrderDetail.vue          |  1 -
 src/views/ReturnDetails.vue                |  1 -
 src/views/Settings.vue                     |  1 -
 src/views/ShipmentDetails.vue              |  1 -
 9 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index e960eb00..63400353 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -99,6 +99,19 @@ export default defineComponent({
     emitter.on('presentLoader', this.presentLoader);
     emitter.on('dismissLoader', this.dismissLoader);
   },
+  async mounted(){
+    if(this.userToken) {
+      // Get product identification from api using dxp-component
+      await useProductIdentificationStore().getIdentificationPref(this.currentEComStore?.productStoreId)
+        .catch((error) => console.error(error));
+    }
+
+    // Handles case when user resumes or reloads the app
+    // Luxon timezzone should be set with the user's selected timezone
+    if (this.userProfile && this.userProfile.userTimeZone) {
+      Settings.defaultZone = this.userProfile.userTimeZone;
+    }
+  },
   unmounted() {
     emitter.off('presentLoader', this.presentLoader);
     emitter.off('dismissLoader', this.dismissLoader);
diff --git a/src/components/ClosePurchaseOrderModal.vue b/src/components/ClosePurchaseOrderModal.vue
index 1a0f68db..5424a71a 100644
--- a/src/components/ClosePurchaseOrderModal.vue
+++ b/src/components/ClosePurchaseOrderModal.vue
@@ -93,7 +93,6 @@ export default defineComponent({
       getProduct: 'product/getProduct',
       getPOItemAccepted: 'order/getPOItemAccepted',
       order: 'order/getCurrent',
-      productIdentificationPref: 'user/getProductIdentificationPref',
       purchaseOrders: 'order/getPurchaseOrders'
     })
   },
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 98f87235..2553d825 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -95,7 +95,6 @@ const actions: ActionTree<UserState, RootState> = {
       dispatch('getFacilityLocations', currentFacility.facilityId);
       // TODO: fetch product identifications from enumeration instead of storing it in env
       this.dispatch('util/setProductIdentifications', process.env.VUE_APP_PRDT_IDENT ? JSON.parse(process.env.VUE_APP_PRDT_IDENT) : [])
-      dispatch('getProductIdentificationPref', currentEComStore?.productStoreId);
       this.dispatch('util/getForceScanSetting', currentEComStore?.productStoreId);
       this.dispatch('util/getBarcodeIdentificationPref', currentEComStore?.productStoreId);
     } catch (err: any) {
diff --git a/src/views/AddProductModal.vue b/src/views/AddProductModal.vue
index 6a8a217c..ffff1eff 100644
--- a/src/views/AddProductModal.vue
+++ b/src/views/AddProductModal.vue
@@ -104,7 +104,6 @@ export default defineComponent({
       getProduct: 'product/getProduct',
       isScrollable: 'product/isScrollable',
       isProductAvailableInShipment: 'product/isProductAvailableInShipment',
-      productIdentificationPref: 'user/getProductIdentificationPref',
       currentFacility: 'user/getCurrentFacility',
       facilityLocationsByFacilityId: 'user/getFacilityLocationsByFacilityId'
     })
diff --git a/src/views/AddProductToPOModal.vue b/src/views/AddProductToPOModal.vue
index 9af7c17e..a45a0065 100644
--- a/src/views/AddProductToPOModal.vue
+++ b/src/views/AddProductToPOModal.vue
@@ -95,7 +95,6 @@ export default defineComponent({
       getProduct: 'product/getProduct',
       isScrollable: 'product/isScrollable',
       isProductAvailableInOrder: 'order/isProductAvailableInOrder',
-      productIdentificationPref: 'user/getProductIdentificationPref',
       currentFacility: 'user/getCurrentFacility',
       facilityLocationsByFacilityId: 'user/getFacilityLocationsByFacilityId'
     })
diff --git a/src/views/PurchaseOrderDetail.vue b/src/views/PurchaseOrderDetail.vue
index 8c7ccadc..c55fc3cf 100644
--- a/src/views/PurchaseOrderDetail.vue
+++ b/src/views/PurchaseOrderDetail.vue
@@ -230,7 +230,6 @@ export default defineComponent({
       getPOItemAccepted: 'order/getPOItemAccepted',
       facilityLocationsByFacilityId: 'user/getFacilityLocationsByFacilityId',
       currentFacility: 'user/getCurrentFacility',
-      productIdentificationPref: 'user/getProductIdentificationPref',
       isForceScanEnabled: 'util/isForceScanEnabled',
     })
   },
diff --git a/src/views/ReturnDetails.vue b/src/views/ReturnDetails.vue
index d028199e..52508f0e 100644
--- a/src/views/ReturnDetails.vue
+++ b/src/views/ReturnDetails.vue
@@ -171,7 +171,6 @@ export default defineComponent({
       returns: 'return/getReturns',
       validStatusChange: 'return/isReturnReceivable',
       isReturnReceivable: 'return/isReturnReceivable',
-      productIdentificationPref: 'user/getProductIdentificationPref',
       isForceScanEnabled: 'util/isForceScanEnabled',
     }),
   },
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index 8d528684..87dbb0c5 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -132,7 +132,6 @@ export default defineComponent({
       userProfile: 'user/getUserProfile',
       currentFacility: 'user/getCurrentFacility',
       currentEComStore: 'user/getCurrentEComStore',
-      productIdentificationPref: 'user/getProductIdentificationPref',
       isForceScanEnabled: 'util/isForceScanEnabled',
       barcodeIdentificationPref: 'util/getBarcodeIdentificationPref'
     })
diff --git a/src/views/ShipmentDetails.vue b/src/views/ShipmentDetails.vue
index 6a583fb2..2497d3ba 100644
--- a/src/views/ShipmentDetails.vue
+++ b/src/views/ShipmentDetails.vue
@@ -166,7 +166,6 @@ export default defineComponent({
       getProduct: 'product/getProduct',
       facilityLocationsByFacilityId: 'user/getFacilityLocationsByFacilityId',
       currentFacility: 'user/getCurrentFacility',
-      productIdentificationPref: 'user/getProductIdentificationPref',
       isForceScanEnabled: 'util/isForceScanEnabled',
     }),
   },

From c7785417c77bedb5c666dcbe3e166416c74241d8 Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Wed, 24 Jul 2024 11:08:48 +0530
Subject: [PATCH 06/11] Removed: removed productIdentifiers action calls ,
 implememnted code to fetch the product identification options from dxp

---
 .env.example | 1 -
 1 file changed, 1 deletion(-)

diff --git a/.env.example b/.env.example
index bce60a96..02c8612c 100644
--- a/.env.example
+++ b/.env.example
@@ -5,6 +5,5 @@ VUE_APP_BASE_URL=
 VUE_APP_VIEW_SIZE=10
 VUE_APP_PERMISSION_ID="RECEIVING_APP_VIEW"
 VUE_APP_ALIAS={}
-VUE_APP_PRDT_IDENT=["productId", "groupId", "groupName", "internalName", "parentProductName", "sku", "title", "SHOPIFY_PROD_SKU", "ERP_ID", "UPCA"]
 VUE_APP_DEFAULT_LOG_LEVEL="error"
 VUE_APP_LOGIN_URL="http://launchpad.hotwax.io/login"
\ No newline at end of file

From 20b954b8d6e17a6f5971278fbd5ea4d02be3971b Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Wed, 24 Jul 2024 11:48:38 +0530
Subject: [PATCH 07/11] Removed: removed PRDT IDENTIFIER env call

---
 src/store/modules/user/actions.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 2553d825..60aa7f98 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -94,7 +94,6 @@ const actions: ActionTree<UserState, RootState> = {
       // Get facility location of selected facility
       dispatch('getFacilityLocations', currentFacility.facilityId);
       // TODO: fetch product identifications from enumeration instead of storing it in env
-      this.dispatch('util/setProductIdentifications', process.env.VUE_APP_PRDT_IDENT ? JSON.parse(process.env.VUE_APP_PRDT_IDENT) : [])
       this.dispatch('util/getForceScanSetting', currentEComStore?.productStoreId);
       this.dispatch('util/getBarcodeIdentificationPref', currentEComStore?.productStoreId);
     } catch (err: any) {

From b8ee1f69cee32fa17a45a016838b25b301a41b68 Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Wed, 24 Jul 2024 12:32:39 +0530
Subject: [PATCH 08/11] Removed: removed unused action calls for setting
 Product identifier , changed code logic for getBarcodeIdentificationValue
 mutation (#267)

---
 src/services/UserService.ts              | 10 ----------
 src/store/modules/user/actions.ts        |  1 -
 src/store/modules/util/getters.ts        |  9 ++++++++-
 src/store/modules/util/mutation-types.ts |  1 -
 4 files changed, 8 insertions(+), 13 deletions(-)

diff --git a/src/services/UserService.ts b/src/services/UserService.ts
index ef103910..86caf29a 100644
--- a/src/services/UserService.ts
+++ b/src/services/UserService.ts
@@ -112,15 +112,6 @@ const createProductIdentificationPref = async (payload: any): Promise<any> => {
   });
 }
 
-const getProductIdentificationPref = async (payload: any): Promise<any> => {
-  return api({
-    url: "performFind",
-    //TODO Due to security reasons service model OMS 1.0 does not support sending parameters in get request that's why we use post here
-    method: "post",
-    data: payload,
-    cache: true
-  });
-}
 
 const getUserPermissions = async (payload: any, token: any): Promise<any> => {
   const baseURL = store.getters['user/getBaseUrl'];
@@ -217,7 +208,6 @@ export const UserService = {
     getUserPermissions,
     getFacilityLocations,
     getEComStores,
-    getProductIdentificationPref,
     createProductIdentificationPref,
     updateProductIdentificationPref,
     setUserPreference,
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 60aa7f98..1faa9f19 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -138,7 +138,6 @@ const actions: ActionTree<UserState, RootState> = {
 
     // TODO add any other tasks if need
     commit(types.USER_END_SESSION)
-    this.dispatch('util/setProductIdentifications', [])
     this.dispatch('order/clearPurchaseOrders');
     this.dispatch('util/updateForceScanStatus', false)
     this.dispatch('util/updateBarcodeIdentificationPref', "")
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 2dc66395..39723a4e 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -1,6 +1,11 @@
 import { GetterTree } from 'vuex'
 import RootState from '@/store/RootState'
 import UtilState from './UtilState';
+import { computed } from 'vue';
+import { useProductIdentificationStore } from '@hotwax/dxp-components';
+
+
+
 
 const getters: GetterTree <UtilState, RootState> = {
   getStatusDesc: (state) => (statusId: string) => {
@@ -13,7 +18,9 @@ const getters: GetterTree <UtilState, RootState> = {
     return state.barcodeIdentificationPref
   },
   getBarcodeIdentificationValue(state, getters, rootState, rootGetters) {
-    return rootGetters['user/getProductIdentificationPref'][state.barcodeIdentificationPref]
+    const productIdentificationStore = useProductIdentificationStore();
+    const productIdentificationPref = computed(() => productIdentificationStore.getProductIdentificationPref) as any;
+    return productIdentificationPref.value[state.barcodeIdentificationPref]
   }
 }
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index f85b5304..9c7c02ec 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -1,5 +1,4 @@
 export const SN_UTIL = 'util'
 export const UTIL_STATUS_UPDATED = SN_UTIL + '/STATUS_UPDATED'
-export const UTIL_PRODUCT_IDENT_UPDATED = SN_UTIL + '/PRODUCT_IDENT_UPDATED'
 export const UTIL_FORCE_SCAN_STATUS_UPDATED = SN_UTIL + '/FORCE_SCAN_STATUS_UPDATED'
 export const UTIL_BARCODE_IDENTIFICATION_PREF_UPDATED = SN_UTIL + '/BARCODE_IDENTIFICATION_PREF_UPDATED'

From b206b93f0ed04bd5223e2d02de05e4eecd7a5ada Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Wed, 24 Jul 2024 12:41:38 +0530
Subject: [PATCH 09/11] Removed: removed service call for updating product
 identification pref (#267)

---
 src/services/UserService.ts | 18 ------------------
 1 file changed, 18 deletions(-)

diff --git a/src/services/UserService.ts b/src/services/UserService.ts
index 86caf29a..e67a1504 100644
--- a/src/services/UserService.ts
+++ b/src/services/UserService.ts
@@ -96,22 +96,6 @@ const setUserPreference = async (payload: any): Promise<any> => {
   });
 }
 
-const updateProductIdentificationPref = async (payload: any): Promise<any> => {
-  return api({
-    url: "service/updateProductStoreSetting",
-    method: "post",
-    data: payload
-  });
-}
-
-const createProductIdentificationPref = async (payload: any): Promise<any> => {
-  return api({
-    url: "service/createProductStoreSetting",
-    method: "post",
-    data: payload
-  });
-}
-
 
 const getUserPermissions = async (payload: any, token: any): Promise<any> => {
   const baseURL = store.getters['user/getBaseUrl'];
@@ -208,8 +192,6 @@ export const UserService = {
     getUserPermissions,
     getFacilityLocations,
     getEComStores,
-    createProductIdentificationPref,
-    updateProductIdentificationPref,
     setUserPreference,
     checkPermission
 }
\ No newline at end of file

From 25735c022ddfa8c9d3f1bca7bc71a930f6c3a7bc Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Wed, 24 Jul 2024 12:56:58 +0530
Subject: [PATCH 10/11] Improved: added entries for locales

---
 src/locales/en.json | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 0133169a..d2756367 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -14,7 +14,6 @@
   "Built: ": "Built: {builtDateTime}",
   "Cancel": "Cancel",
   "Change": "Change",
-  "Choosing a product identifier allows you to view products with your preferred identifiers.": "Choosing a product identifier allows you to view products with your preferred identifiers.",
   "Click the backdrop to dismiss.": "Click the backdrop to dismiss.",
   "Complete": "Complete",
   "Completed": "Completed",
@@ -32,7 +31,6 @@
   "Failed to receive shipment": "Failed to receive shipment",
   "Failed to receive some of the items": "Failed to receive some of the items",
   "Failed to update force scan preference.": "Failed to update force scan preference.",
-  "Failed to update product identifier preference": "Failed to update product identifier preference",
   "facility location": "facility location",
   "Facility locations were not found corresponding to destination facility of return shipment. Please add facility locations to avoid receive return shipment failure.": "Facility locations were not found corresponding to destination facility of return shipment. Please add facility locations to avoid receive return shipment failure.",
   "Failed to update barcode identification preference.": "Failed to update barcode identification preference.",
@@ -73,9 +71,9 @@
   "primary identifier": "primary identifier",
   "Primary identifier": "Primary identifier",
   "Primary Product Identifier": "Primary Product Identifier",
+  "Primary": "Primary",
   "Proceed": "Proceed",
   "Product Identifier": "Product Identifier",
-  "Product identifier preference updated": "Product identifier preference updated",
   "Product is already received:": "Product is already received: {itemName}",
   "Purchase Order": "Purchase Order",
   "Purchase Order Details": "Purchase Order Details",
@@ -111,6 +109,7 @@
   "Search returns": "Search returns",
   "Search time zones": "Search time zones",
   "Search SKU or product name": "Search SKU or product name",
+  "Secondary": "Secondary",
   "Secondary Product Identifier": "Secondary Product Identifier",
   "Select": "Select",
   "Select all": "Select all",

From bf15eda07a72f03ef0fd109ca97aca0b11298336 Mon Sep 17 00:00:00 2001
From: Ridwa <ridwanahamed47@gmail.com>
Date: Wed, 24 Jul 2024 13:02:37 +0530
Subject: [PATCH 11/11] Improved: added entries for locales

---
 src/locales/en.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/locales/en.json b/src/locales/en.json
index d2756367..8d36c657 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -14,6 +14,7 @@
   "Built: ": "Built: {builtDateTime}",
   "Cancel": "Cancel",
   "Change": "Change",
+  "Choosing a product identifier allows you to view products with your preferred identifiers.": "Choosing a product identifier allows you to view products with your preferred identifiers.",
   "Click the backdrop to dismiss.": "Click the backdrop to dismiss.",
   "Complete": "Complete",
   "Completed": "Completed",