Merge branch 'main' into #298

package.json

@@ -1,6 +1,6 @@
 {
   "name": "receiving",
-  "version": "2.22.0",
+  "version": "2.24.0",
   "private": true,
   "description": "HotWax Commerce Receiving App",
   "scripts": {
@@ -16,7 +16,7 @@
     "@casl/ability": "^6.0.0",
     "@hotwax/app-version-info": "^1.0.0",
     "@hotwax/apps-theme": "^1.2.6",
-    "@hotwax/dxp-components": "^1.11.0",
+    "@hotwax/dxp-components": "^1.12.1",
     "@hotwax/oms-api": "^1.10.0",
     "@ionic/core": "^7.6.0",
     "@ionic/vue": "^7.6.0",

src/App.vue

@@ -61,6 +61,16 @@ export default defineComponent({
       if (this.loader) {
         this.loader.dismiss();
         this.loader = null as any;
+      } else {
+        // Added this else case as there are some scenarios in which the loader is not created and before that the dismissLoader gets called, resulting in the loader not getting dismissed
+        // So checking that when the loader is not found then try dismissing the loader again after 3 secs.
+        // The above case appears when directly hitting the shipment detail page and then the receive shipment api throws error
+        // TODO: need to find a more better approach to dismiss the loader in such case
+        setTimeout(() => {
+          if (this.loader) {
+            this.dismissLoader();
+          }
+        }, 3000)
       }
     },
     async unauthorized() {

src/adapter/index.ts

@@ -1,10 +1,11 @@
-import { api, client, getConfig, getUserFacilities, initialise, logout, resetConfig, updateInstanceUrl, updateToken } from '@hotwax/oms-api'
+import { api, client, getConfig, getUserFacilities, hasError, initialise, logout, resetConfig, updateInstanceUrl, updateToken } from '@hotwax/oms-api'
 
 export {
   api,
   client,
   getConfig,
   getUserFacilities,
+  hasError,
   initialise,
   logout,
   resetConfig,

src/components/ClosePurchaseOrderModal.vue

@@ -20,7 +20,7 @@
     <ion-list>
       <ion-item :button="isPOItemStatusPending(item)" v-for="(item, index) in getPOItems()" :key="index" @click="item.isChecked = !item.isChecked">
         <ion-thumbnail slot="start">
-          <ShopifyImg size="small" :src="getProduct(item.productId).mainImageUrl" />
+          <DxpShopifyImg size="small" :src="getProduct(item.productId).mainImageUrl" />
         </ion-thumbnail>
         <ion-label>
           <h2>{{ productHelpers.getProductIdentificationValue(productIdentificationPref.primaryId, getProduct(item.productId)) }}</h2>
@@ -66,7 +66,7 @@ import { defineComponent } from 'vue';
 import { mapGetters, useStore } from 'vuex'
 import { OrderService } from "@/services/OrderService";
 import { productHelpers } from '@/utils';
-import { ShopifyImg, translate } from '@hotwax/dxp-components';
+import { DxpShopifyImg, translate } from '@hotwax/dxp-components';
 import { useRouter } from 'vue-router';
 
 export default defineComponent({
@@ -87,7 +87,7 @@ export default defineComponent({
     IonTitle,
     IonThumbnail,
     IonToolbar,
-    ShopifyImg
+    DxpShopifyImg
   },
   computed: {
     ...mapGetters({

src/components/ImageModal.vue

@@ -11,7 +11,7 @@
   </ion-header>
 
   <ion-content class="ion-text-center">
-    <ShopifyImg :src="imageUrl" />
+    <DxpShopifyImg :src="imageUrl" />
 
   </ion-content>
 </template>
@@ -29,7 +29,7 @@ import {
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
 import { closeOutline } from 'ionicons/icons';
-import { ShopifyImg } from '@hotwax/dxp-components';
+import { DxpShopifyImg } from '@hotwax/dxp-components';
 
 export default defineComponent({
   name: 'ImageModal',
@@ -41,7 +41,7 @@ export default defineComponent({
     IonIcon,
     IonTitle,
     IonToolbar,
-    ShopifyImg
+    DxpShopifyImg
   },
   props: ["imageUrl", "productName"],
   methods: {

src/components/ShipmentListItem.vue

@@ -1,20 +1,22 @@
 <template>
   <ion-item button @click="viewShipment()">
     <ion-label>
-      <p class="overline" v-show="shipment.externalOrderId">{{ shipment.externalOrderId }}</p>
+      <p class="overline" v-show="shipment.externalOrderId || shipment.externalOrderName">{{ shipment.externalOrderName ? shipment.externalOrderName : shipment.externalOrderId }}</p>
       <h2>{{ shipment.externalId ? shipment.externalId : shipment.shipmentId }}</h2>
       <p v-if="shipment.shipmentItemCount">{{ shipment.shipmentItemCount }} {{ (shipment.shipmentItemCount > 1 ? 'Items' : 'Item') }}</p>
     </ion-label>
-    <ion-note slot="end">{{ shipment.estimatedArrivalDate ? ($filters.formatDate(shipment.estimatedArrivalDate)) : shipment.statusDesc }}</ion-note>
+    <ion-label class="ion-text-end" slot="end">
+      <p>{{ shipment.estimatedArrivalDate ? ($filters.formatDate(shipment.estimatedArrivalDate)) : shipment.statusDesc }}</p>
+      <p class="overline"> {{ shipment.trackingIdNumber }}</p>
+    </ion-label>
   </ion-item>
 </template>
 
 <script lang="ts">
 import { defineComponent } from 'vue'
 import {
   IonItem,
-  IonLabel,
-  IonNote
+  IonLabel
 } from '@ionic/vue'
 import { useRouter } from 'vue-router'
 import { useStore } from 'vuex';
@@ -24,7 +26,7 @@ export default defineComponent({
   components: {
     IonItem,
     IonLabel,
-    IonNote,
+
   },
   props: ["shipment"],
   methods: {