Merge remote-tracking branch 'upstream/main' into #272-Update-oms-api

package.json

@@ -17,7 +17,7 @@
     "@capacitor/ios": "^2.5.0",
     "@hotwax/app-version-info": "^1.0.0",
     "@hotwax/apps-theme": "^1.2.6",
-    "@hotwax/dxp-components": "^1.12.0",
+    "@hotwax/dxp-components": "^1.12.1",
     "@hotwax/oms-api": "^1.13.0",
     "@ionic/core": "~7.6.0",
     "@ionic/vue": "~7.6.0",

src/components/Picklist-detail-item.vue

@@ -1,5 +1,5 @@
 <template>
-  <ion-item :id="picklistItem.id" :class="picklistItem.id === lastScannedId ? 'scanned-item' : '' " :key="picklistItem.id" v-for="picklistItem in picklistItems"  @click="picklistItem.isChecked = !picklistItem.isChecked" lines="none" >
+  <ion-item :id="picklistItem.id" :class="picklistItem.id === lastScannedId ? 'scanned-item' : '' " :key="picklistItem.id" v-for="picklistItem in picklistItems"  @click="picklistItem.isChecked = !picklistItem.isChecked; clearLastScannedId()" lines="none" >
     <ion-thumbnail slot="start">
       <DxpShopifyImg :src="getProduct(picklistItem.productId).mainImageUrl" size="small" />
     </ion-thumbnail>  
@@ -30,12 +30,18 @@ export default defineComponent({
     IonThumbnail,
     DxpShopifyImg
   },
-  props: ['picklistItems', 'lastScannedId'],
+  props: ['picklistItems'],
   computed: {
     ...mapGetters({
-      getProduct: 'product/getProduct'
+      getProduct: 'product/getProduct',
+      lastScannedId: 'picklist/getLastScannedId',
     }),
   },
+  methods: {
+    clearLastScannedId() {
+      this.store.dispatch("picklist/updateLastScannedId", "")
+    }
+  },
   setup() {
     const store = useStore(); 
     const productIdentificationStore = useProductIdentificationStore();

src/components/Picklist-item.vue

@@ -25,6 +25,7 @@ export default defineComponent({
   props: ['picklists'],
   methods: {
     async viewPicklist (picklist: any) {
+      this.store.dispatch("picklist/updateLastScannedId", "")
       // if current is not set promise.reject returns which will not allow further code execution
       // and hence, router.push will not execute stopping the code from breaking
       await this.store.dispatch('picklist/setCurrentPicklist', { id: picklist.picklistId })

src/locales/en.json

@@ -4,6 +4,7 @@
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to {timeZoneId}?",
   "Back to Launchpad": "Back to Launchpad",
   "Bin ID": "Bin ID",
+  "Built: ": "Built: {builtDateTime}",
   "Camera permission denied.": "Camera permission denied.",
   "Cancel": "Cancel",
   "Change": "Change",
@@ -74,5 +75,6 @@
   "Update time zone": "Update time zone",
   "User is not associated with any facilities.": "User is not associated with any facilities.",
   "User is not associated with any product stores.": "User is not associated with any product stores.",
-  "Username": "Username"
+  "Username": "Username",
+  "Version: ": "Version: {appVersion}"
 }

src/locales/index.ts

@@ -0,0 +1,5 @@
+import en from "./en.json"
+
+export default {
+  "en-US": en
+};

src/main.ts

@@ -30,6 +30,7 @@ import store from './store'
 import { dxpComponents } from '@hotwax/dxp-components'
 import { login, logout, loader } from './user-utils';
 import { getConfig, getProductIdentificationPref, initialise, setProductIdentificationPref } from '@/adapter'
+import localeMessages from './locales';
 
 const app = createApp(App)
   .use(IonicVue, {
@@ -47,7 +48,8 @@ const app = createApp(App)
     getConfig,
     getProductIdentificationPref,
     initialise,
-    setProductIdentificationPref
+    setProductIdentificationPref,
+    localeMessages
   });
 
 // Filters are removed in Vue 3 and global filter introduced https://v3.vuejs.org/guide/migration/filters.html#global-filters

src/store/modules/picklist/PicklistState.ts

@@ -9,4 +9,5 @@ export default interface PicklistState {
     total: any
   };
   filters: any;
+  lastScannedId: string;
 }

src/store/modules/picklist/actions.ts

@@ -170,6 +170,10 @@ const actions: ActionTree<PicklistState, RootState> = {
   clearPicklist ({ commit }) {
     commit(types.PICKLISTS_UPDATED, { list: [], total: 0 })
     commit(types.PICKLISTS_COMPLETED_UPDATED, { list: [], total: 0 })
+  },
+
+  updateLastScannedId ({ commit }, id) {
+    commit(types.PICKLIST_LAST_SCANNED_ID_UPDATED, id)
   }
 }
 export default actions;

src/store/modules/picklist/getters.ts

@@ -20,6 +20,9 @@ const getters: GetterTree <PicklistState, RootState> = {
   },
   showMyPicklists(state) {
     return state.filters.showMyPicklists;
+  },
+  getLastScannedId(state) {
+    return state.lastScannedId;
   }
 }
 export default getters;

src/store/modules/picklist/index.ts

@@ -21,7 +21,8 @@ const picklistModule: Module<PicklistState, RootState> = {
       // enabling picklist filters by default
       hideCompletedPicklists: true,
       showMyPicklists: true
-    }
+    },
+    lastScannedId: ''
   },
   getters,
   mutations,

src/store/modules/picklist/mutation-types.ts

@@ -3,3 +3,4 @@ export const PICKLISTS_UPDATED = SN_PICKLIST + '/UPDATED'
 export const PICKLISTS_COMPLETED_UPDATED = SN_PICKLIST + '/COMPLETED'
 export const PICKLIST_CURRENT_UPDATED = SN_PICKLIST + '/CURRENT_UPDATED'
 export const PICKLIST_FILTERS_UPDATED = SN_PICKLIST + '/FILTERS_UPDATED'
+export const PICKLIST_LAST_SCANNED_ID_UPDATED = SN_PICKLIST + '/LAST_SCANNED_ID_UPDATED'

src/store/modules/picklist/mutations.ts

@@ -16,6 +16,9 @@ const mutations: MutationTree <PicklistState> = {
   },
   [types.PICKLIST_FILTERS_UPDATED] (state, payload) {
     state.filters = { ...state.filters, ...payload };
+  },
+  [types.PICKLIST_LAST_SCANNED_ID_UPDATED] (state, payload) {
+    state.lastScannedId = payload
   }
 }
 export default mutations;

src/store/modules/user/UserState.ts

@@ -4,5 +4,6 @@ export default interface UserState {
     currentFacility: object;
     instanceUrl: string;
     picklistItemSortBy: string;
+    pwaState: any;
     currentEComStore: any;
 }

src/store/modules/user/actions.ts

@@ -58,7 +58,7 @@ const actions: ActionTree<UserState, RootState> = {
     } catch (err: any) {
       showToast(translate('Something went wrong'));
       console.error("error", err);
-      return Promise.reject(new Error(err))
+      return Promise.reject(err instanceof Object ? err : new Error(err));
     }
   },
 
@@ -173,6 +173,10 @@ const actions: ActionTree<UserState, RootState> = {
 
   updateSortBy({ commit }, payload) {
     commit(types.USER_SORTBY_UPDATED, payload)
+  },
+
+  updatePwaState({ commit }, payload) {
+    commit(types.USER_PWA_STATE_UPDATED, payload);
   }
 }
 export default actions;

src/store/modules/user/getters.ts

@@ -28,6 +28,9 @@ const getters: GetterTree <UserState, RootState> = {
     getPicklistItemSortBy (state) {
         return state.picklistItemSortBy;
     },
+    getPwaState(state) {
+        return state.pwaState;
+    },
     getBaseUrl(state) {
         let baseURL = process.env.VUE_APP_BASE_URL;
         if (!baseURL) baseURL = state.instanceUrl;

src/store/modules/user/index.ts

@@ -13,7 +13,11 @@ const userModule: Module<UserState, RootState> = {
       currentEComStore: {},
       currentFacility: {},
       instanceUrl: '',
-      picklistItemSortBy: 'productName'
+      picklistItemSortBy: 'productName',
+      pwaState: {
+        updateExists: false,
+        registration: null,
+      }
     },
     getters,
     actions,

src/store/modules/user/mutation-types.ts

@@ -5,4 +5,5 @@ export const USER_INFO_UPDATED = SN_USER + '/INFO_UPDATED'
 export const USER_CURRENT_FACILITY_UPDATED = SN_USER + '/CURRENT_FACILITY_UPDATED'
 export const USER_INSTANCE_URL_UPDATED = SN_USER + '/INSTANCE_URL_UPDATED' 
 export const USER_SORTBY_UPDATED = SN_USER + '/SORTBY_UPDATED'
-export const USER_CURRENT_ECOM_STORE_UPDATED = SN_USER + '/CURRENT_ECOM_STORE_UPDATED'
+export const USER_PWA_STATE_UPDATED = SN_USER + '/PWA_STATE_UPDATED'
+export const USER_CURRENT_ECOM_STORE_UPDATED = SN_USER + '/CURRENT_ECOM_STORE_UPDATED'

src/store/modules/user/mutations.ts

@@ -23,6 +23,10 @@ const mutations: MutationTree <UserState> = {
     [types.USER_SORTBY_UPDATED] (state, payload) {
         state.picklistItemSortBy = payload
     },
+    [types.USER_PWA_STATE_UPDATED](state, payload) {
+        state.pwaState.registration = payload.registration;
+        state.pwaState.updateExists = payload.updateExists;
+    },
     [types.USER_CURRENT_ECOM_STORE_UPDATED] (state, payload) {
         state.currentEComStore = payload
     }

src/views/Picklist-Detail.vue

@@ -39,7 +39,7 @@
           <ion-item-divider>
             <ion-label> {{ picklist.sortBy }}</ion-label>
           </ion-item-divider>
-          <PicklistDetailItem :lastScannedId="lastScannedId" :picklistItems="picklist.record"/>
+          <PicklistDetailItem :picklistItems="picklist.record"/>
         </ion-item-group>
       </ion-list>
      </ion-content>
@@ -128,7 +128,6 @@ export default defineComponent({
   data() {
     return {
       picklistGroup: [],
-      lastScannedId: '',
       sortOptions: JSON.parse(process.env.VUE_APP_PICKLISTS_SORT_OPTIONS)
     }
   },
@@ -185,12 +184,17 @@ export default defineComponent({
       const item = this.picklist.pickingItemList.find((product) => product.productId === productId && !product.isChecked)
       if (item) {
         item.isChecked = true;
-        this.lastScannedId = item.id;
+        this.store.dispatch("picklist/updateLastScannedId", item.id)
         // Highlight specific element
         const scannedElement = document.getElementById(item.id);
         scannedElement && (scannedElement.scrollIntoView());
+
+        // Scanned product should get un-highlighted after 3s for better experience hence adding setTimeOut
+        setTimeout(() => {
+          this.store.dispatch("picklist/updateLastScannedId", "")
+        }, 3000)
       } else {
-        this.lastScannedId = "";
+        this.store.dispatch("picklist/updateLastScannedId", "")
         showToast(translate("Product not found in remaining items"))
       }
     },

src/views/Settings.vue

@@ -52,13 +52,9 @@
         </ion-card>
       </section>
       <hr />
-      <div class="section-header">
-        <h1>
-          {{ $t('App') }}
-          <p class="overline" >{{ "Version: " + appVersion }}</p>
-        </h1>
-        <p class="overline">{{ "Built: " + getDateTime(appInfo.builtTime) }}</p>
-      </div>
+
+      <DxpAppVersionInfo />
+
       <section>
         <DxpProductIdentifier />
 
@@ -103,7 +99,6 @@ import { businessOutline, personCircleOutline, codeWorkingOutline, openOutline,
 import { mapGetters, useStore } from 'vuex';
 import { useRouter } from 'vue-router';
 import Image from '@/components/Image.vue';
-import { DateTime } from 'luxon';
 import TimeZoneModal from '@/views/TimezoneModal.vue';
 
 export default defineComponent({
@@ -131,8 +126,6 @@ export default defineComponent({
   data() {
     return {
       baseURL: process.env.VUE_APP_BASE_URL,
-      appInfo: (process.env.VUE_APP_VERSION_INFO ? JSON.parse(process.env.VUE_APP_VERSION_INFO) : {}) as any,
-      appVersion: "",
       sortOptions: JSON.parse(process.env.VUE_APP_PICKLISTS_SORT_OPTIONS)
     };
   },
@@ -144,9 +137,6 @@ export default defineComponent({
       picklistItemSortBy: 'user/getPicklistItemSortBy'
     })
   },
-  mounted() {
-    this.appVersion = this.appInfo.branch ? (this.appInfo.branch + "-" + this.appInfo.revision) : this.appInfo.tag;
-  },
   methods: {
     async changeTimeZone() {
       const timeZoneModal = await modalController.create({
@@ -157,6 +147,7 @@ export default defineComponent({
     logout () {
       this.store.dispatch('user/logout', { isUserUnauthorised: false }).then((redirectionUrl) => {
         this.store.dispatch('picklist/clearPicklist')
+        this.store.dispatch("picklist/updateLastScannedId", "")
 
         // if not having redirection url then redirect the user to launchpad
         if(!redirectionUrl) {
@@ -177,9 +168,6 @@ export default defineComponent({
     goToLaunchpad() {
       window.location.href = `${process.env.VUE_APP_LOGIN_URL}`
     },
-    getDateTime(time: any) {
-      return DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED);
-    },
     updateSortBy(event: any) {
       this.store.dispatch('user/updateSortBy', event.detail.value)
     }

tsconfig.json

@@ -6,6 +6,7 @@
     "jsx": "preserve",
     "importHelpers": true,
     "moduleResolution": "node",
+    "resolveJsonModule": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,