From 5cf3afcfa0d09643d049c5811616d71be259e2cc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 21 Dec 2023 15:31:33 +0530
Subject: [PATCH 01/32] Implemented: skeleton text in detail items to displayed
 till job fetched (#524)

---
 src/views/Fulfillment.vue | 12 +++++++++---
 src/views/Inventory.vue   |  5 ++++-
 src/views/Orders.vue      | 33 +++++++++++++++++++++++----------
 src/views/Product.vue     | 14 +++++++++-----
 4 files changed, 45 insertions(+), 19 deletions(-)

diff --git a/src/views/Fulfillment.vue b/src/views/Fulfillment.vue
index 5bbf32a0..a9cb0234 100644
--- a/src/views/Fulfillment.vue
+++ b/src/views/Fulfillment.vue
@@ -16,7 +16,8 @@
             </ion-card-header>
             <ion-item button @click="viewJobConfiguration({ id: 'SHIP_PKD_ODRS', status: getJobStatus(jobEnums['SHIP_PKD_ODRS']) })" detail>
               <ion-label class="ion-text-wrap">{{ $t("Ship packed orders") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('SHIP_PKD_ODRS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('SHIP_PKD_ODRS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item lines="none">
               <ion-label class="ion-text-wrap">
@@ -31,7 +32,8 @@
             </ion-card-header>
             <ion-item button @click="viewJobConfiguration({ id: 'ODR_FLMNT_HST', status: getJobStatus(jobEnums['ODR_FLMNT_HST']) })" detail>
               <ion-label class="ion-text-wrap">{{ $t("Order fulfillment") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('ODR_FLMNT_HST') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('ODR_FLMNT_HST') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item lines="none">
               <ion-label class="ion-text-wrap">
@@ -85,6 +87,7 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
+  IonSkeletonText,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -117,6 +120,7 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
+    IonSkeletonText,
     IonTitle,
     IonToggle,
     IonToolbar,
@@ -134,7 +138,8 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       autoCancelDays: '',
       enumTypeId: 'FULFILLMENT_SYS_JOB',
-      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any
+      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
+      isLoading: true
     }
   },
   computed: {
@@ -216,6 +221,7 @@ export default defineComponent({
       if (this.currentEComStore.productStoreId) {
         this.getAutoCancelDays();
       }
+      this.isLoading = false
     },
     async getAutoCancelDays(){
       const payload = {
diff --git a/src/views/Inventory.vue b/src/views/Inventory.vue
index 16c76f30..58b57e03 100644
--- a/src/views/Inventory.vue
+++ b/src/views/Inventory.vue
@@ -25,7 +25,8 @@
             </ion-item>
             <ion-item button @click="viewJobConfiguration({ id: 'HARD_SYNC', status: getJobStatus(jobEnums['HARD_SYNC'])})" detail>
               <ion-label class="ion-text-wrap">{{ $t("Hard sync") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('HARD_SYNC') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('HARD_SYNC') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item lines="none">
               <ion-label class="ion-text-wrap">
@@ -108,6 +109,7 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'INVENTORY_SYS_JOB',
       webhookEnums: JSON.parse(process.env?.VUE_APP_WEBHOOK_ENUMS as string) as any,
+      isLoading: true
     }
   },
   computed: {
@@ -218,6 +220,7 @@ export default defineComponent({
           "enumTypeId": "INVENTORY_SYS_JOB"
         }
       });
+      this.isLoading = false
     },
     fetchData() {
       this.store.dispatch('webhook/fetchWebhooks')
diff --git a/src/views/Orders.vue b/src/views/Orders.vue
index f5435858..1a362d1e 100644
--- a/src/views/Orders.vue
+++ b/src/views/Orders.vue
@@ -16,27 +16,33 @@
             </ion-card-header>
             <ion-item @click="viewJobConfiguration({ id: 'IMP_NEW_ORDERS', status: getJobStatus(jobEnums['IMP_NEW_ORDERS'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("New orders") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('IMP_NEW_ORDERS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('IMP_NEW_ORDERS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item @click="viewJobConfiguration({ id: 'APR_ORD', status: getJobStatus(jobEnums['APR_ORD'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("Approve orders") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('APR_ORD') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('APR_ORD') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item @click="viewJobConfiguration({ id: 'UPDT_ORDS', status: getJobStatus(jobEnums['UPDT_ORDS'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("Update orders") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('UPDT_ORDS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('UPDT_ORDS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item @click="viewJobConfiguration({ id: 'IMP_CANCELLED_ORDERS', status: getJobStatus(jobEnums['IMP_CANCELLED_ORDERS'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("Cancelled orders") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('IMP_CANCELLED_ORDERS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('IMP_CANCELLED_ORDERS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item @click="viewJobConfiguration({ id: 'IMP_CANCELLED_ITEMS', status: getJobStatus(jobEnums['IMP_CANCELLED_ITEMS'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("Cancelled items") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('IMP_CANCELLED_ITEMS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('IMP_CANCELLED_ITEMS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item @click="viewJobConfiguration({ id: 'IMP_RETURNS', status: getJobStatus(jobEnums['IMP_RETURNS'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("Returns") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('IMP_RETURNS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('IMP_RETURNS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
           </ion-card>
 
@@ -68,15 +74,18 @@
             </ion-card-header>
             <ion-item @click="viewJobConfiguration({ id: 'UPLD_CMPLT_ORDRS', status: getJobStatus(jobEnums['UPLD_CMPLT_ORDRS'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("Completed orders") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('UPLD_CMPLT_ORDRS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('UPLD_CMPLT_ORDRS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item @click="viewJobConfiguration({ id: 'UPLD_CNCLD_ORDRS', status: getJobStatus(jobEnums['UPLD_CNCLD_ORDRS'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("Cancelled orders") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('UPLD_CNCLD_ORDRS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('UPLD_CNCLD_ORDRS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item @click="viewJobConfiguration({ id: 'UPLD_REFUNDS', status: getJobStatus(jobEnums['UPLD_REFUNDS'])})" detail button>
               <ion-label class="ion-text-wrap">{{ $t("Refunds") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('UPLD_REFUNDS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('UPLD_REFUNDS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
           </ion-card>
           <MoreJobs v-if="getMoreJobs({...jobEnums, ...initialLoadJobEnums}, enumTypeId).length" :jobs="getMoreJobs({...jobEnums, ...initialLoadJobEnums}, enumTypeId)" />
@@ -101,6 +110,7 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
+  IonSkeletonText,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -129,6 +139,7 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
+    IonSkeletonText,
     IonTitle,
     IonToggle,
     IonToolbar,
@@ -146,7 +157,8 @@ export default defineComponent({
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'ORDER_SYS_JOB',
-      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any
+      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
+      isLoading: true
     }
   },
   computed: {
@@ -270,6 +282,7 @@ export default defineComponent({
           "enumTypeId": "ORDER_SYS_JOB"
         }
       });
+      this.isLoading = false
     }
   },
   mounted () {
diff --git a/src/views/Product.vue b/src/views/Product.vue
index 01358e12..d040f7d2 100644
--- a/src/views/Product.vue
+++ b/src/views/Product.vue
@@ -16,11 +16,13 @@
             </ion-card-header>
             <ion-item button @click="viewJobConfiguration({ id: 'IMP_PRDTS', status: getJobStatus(jobEnums['IMP_PRDTS'])})" detail>
               <ion-label class="ion-text-wrap">{{ $t("Import products") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('IMP_PRDTS') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('IMP_PRDTS') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item button @click="viewJobConfiguration({ id: 'SYNC_PRDTS', status: getJobStatus(jobEnums['SYNC_PRDTS'])})" detail>
               <ion-label class="ion-text-wrap">{{ $t("Sync products") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('SYNC_PRDTS') }} </ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('SYNC_PRDTS') }} </ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item lines="none">
               <ion-label class="ion-text-wrap"><p>{{ $t("Sync products and category structures from Shopify into HotWax Commerce and keep them up to date.") }}</p></ion-label>
@@ -124,7 +126,8 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       webhookEnums: JSON.parse(process.env?.VUE_APP_WEBHOOK_ENUMS as string) as any,
       enumTypeId: 'PRODUCT_SYS_JOB',
-      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any
+      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
+      isLoading: true
     }
   },
   mounted () {
@@ -185,13 +188,14 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         this.$t('Disabled')
     },
-    fetchJobs(){
-      this.store.dispatch("job/fetchJobs", {
+    async fetchJobs(){
+      await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "enumTypeId": "PRODUCT_SYS_JOB"
         }
       });
       this.store.dispatch('webhook/fetchWebhooks')
+      this.isLoading = false
     }
   },
   setup() {

From 3d5f71e747e1e7a4916e8cdf0edcc91b054f718f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 21 Dec 2023 15:49:14 +0530
Subject: [PATCH 02/32] Improved: code to fetch job using async await (#524)

---
 src/views/Inventory.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/Inventory.vue b/src/views/Inventory.vue
index 58b57e03..af1bda7a 100644
--- a/src/views/Inventory.vue
+++ b/src/views/Inventory.vue
@@ -214,8 +214,8 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         this.$t('Disabled')
     },
-    fetchJobs(){
-      this.store.dispatch("job/fetchJobs", {
+    async fetchJobs(){
+      await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "enumTypeId": "INVENTORY_SYS_JOB"
         }

From 68d636beb530716f25fd1740efc34ca2137dafbf Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 9 Aug 2024 12:27:03 +0530
Subject: [PATCH 03/32] Improved: logic to show spinner and close configuration
 card in case of product store change (#720)

---
 src/views/Brokering.vue     | 22 +++++++++++++++++++---
 src/views/Fulfillment.vue   | 20 ++++++++++++++++++--
 src/views/InitialLoad.vue   | 24 ++++++++++++++++++++----
 src/views/Inventory.vue     | 26 +++++++++++++++++++++-----
 src/views/Miscellaneous.vue | 15 ++++++++++++++-
 src/views/Orders.vue        | 20 ++++++++++++++++++--
 src/views/Pipeline.vue      | 30 +++++++++++++++++++++++-------
 src/views/PreOrder.vue      | 30 +++++++++++++++++++++++-------
 src/views/Product.vue       | 24 ++++++++++++++++++++----
 src/views/Reports.vue       | 15 ++++++++++++++-
 10 files changed, 190 insertions(+), 36 deletions(-)

diff --git a/src/views/Brokering.vue b/src/views/Brokering.vue
index 828fdb3d..186c253f 100644
--- a/src/views/Brokering.vue
+++ b/src/views/Brokering.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <ion-button expand="block" :disabled="!hasPermission(Actions.APP_JOB_UPDATE)" @click="addBatch()">{{ translate('Create new brokering job') }}</ion-button>
 
@@ -58,7 +64,7 @@
           <MoreJobs v-if="getMoreJobs({...jobEnums, ...initialLoadJobEnums}, enumTypeId).length" :jobs="getMoreJobs({...jobEnums, ...initialLoadJobEnums}, enumTypeId)" />
         </section>
 
-        <aside class="desktop-only" v-if="isDesktop" v-show="currentJob">
+        <aside class="desktop-only" v-if="isDesktop" v-show="currentJob && Object.keys(currentJob).length">
           <JobConfiguration :status="currentJobStatus" :type="freqType" :key="currentJob" :isBrokerJob="orderBatchJobs.includes(currentJob) ? true : false"/>
         </aside>
       </main>
@@ -83,6 +89,7 @@ import {
   IonMenuButton,
   IonPage,
   IonRow,
+  IonSpinner,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -121,6 +128,7 @@ export default defineComponent({
     IonMenuButton,
     IonPage,
     IonRow,
+    IonSpinner,
     IonTitle,
     IonToggle,
     IonToolbar,
@@ -138,7 +146,8 @@ export default defineComponent({
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'BROKER_SYS_JOB',
-      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any
+      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
+      jobsLoading: false
     }
   },
   computed: {
@@ -209,6 +218,12 @@ export default defineComponent({
         translate('Disabled')
     },
     async fetchJobs() {
+      this.jobsLoading = true;
+      this.currentJob = "";
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.currentJobStatus = "";
+      this.freqType = "";
+      this.isJobDetailAnimationCompleted = false;
       await this.store.dispatch("job/fetchJobs", {
         "inputFields": {
           // If we fetch broker sys job by not passing systemJobEnumId filter then this api
@@ -225,6 +240,7 @@ export default defineComponent({
           "systemJobEnumId_op": "in"
         }
       });
+      this.jobsLoading = false;
     },
     timeFromNow(time: any) {
       const timeDiff = DateTime.fromMillis(time).diff(DateTime.local());
diff --git a/src/views/Fulfillment.vue b/src/views/Fulfillment.vue
index e1becc8e..ae112ad4 100644
--- a/src/views/Fulfillment.vue
+++ b/src/views/Fulfillment.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <ion-card>
             <ion-card-header>
@@ -110,6 +116,7 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
+  IonSpinner,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -142,6 +149,7 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
+    IonSpinner,
     IonTitle,
     IonToggle,
     IonToolbar,
@@ -159,7 +167,8 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       autoCancelDays: '',
       enumTypeId: 'FULFILLMENT_SYS_JOB',
-      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any
+      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
+      jobsLoading: false
     }
   },
   computed: {
@@ -233,6 +242,12 @@ export default defineComponent({
       }
     },
     async fetchJobs(){
+      this.jobsLoading = true;
+      this.currentJob = "";
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.currentJobStatus = "";
+      this.freqType = "";
+      this.isJobDetailAnimationCompleted = false;
       await this.store.dispatch("job/fetchJobs", {
         "inputFields": {
           "enumTypeId": "FULFILLMENT_SYS_JOB"
@@ -241,6 +256,7 @@ export default defineComponent({
       if (this.currentEComStore.productStoreId) {
         this.getAutoCancelDays();
       }
+      this.jobsLoading = false;
     },
     async getAutoCancelDays(){
       const payload = {
diff --git a/src/views/InitialLoad.vue b/src/views/InitialLoad.vue
index e1ec23dc..c7e62a8b 100644
--- a/src/views/InitialLoad.vue
+++ b/src/views/InitialLoad.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <ion-card>
             <ion-card-header>
@@ -74,6 +80,7 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
+  IonSpinner,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -103,6 +110,7 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
+    IonSpinner,
     IonTitle,
     IonToggle,
     IonToolbar
@@ -115,7 +123,8 @@ export default defineComponent({
       job: {} as any,
       lastShopifyOrderId: '',
       isJobDetailAnimationCompleted: false,
-      isDesktop: isPlatform('desktop')
+      isDesktop: isPlatform('desktop'),
+      jobsLoading: false
     }
   },
   mounted() {
@@ -207,14 +216,21 @@ export default defineComponent({
         this.isJobDetailAnimationCompleted = true;
       }
     },
-    fetchJobs(){
-      this.store.dispatch("job/fetchJobs", {
+    async fetchJobs(){
+      this.jobsLoading = true;
+      this.currentSelectedJobModal = "";
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.job = {};
+      this.lastShopifyOrderId = "";
+      this.isJobDetailAnimationCompleted = false;
+      await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "systemJobEnumId": Object.values(this.jobEnums),
           "systemJobEnumId_op": "in"
         }
       })
       this.store.dispatch('webhook/fetchWebhooks')
+      this.jobsLoading = false;
     },
     async updateWebhook(checked: boolean, enumId: string) {
       const webhook = this.getCachedWebhook[this.webhookEnums[enumId]]
diff --git a/src/views/Inventory.vue b/src/views/Inventory.vue
index 877f055c..77384625 100644
--- a/src/views/Inventory.vue
+++ b/src/views/Inventory.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <ion-card>
             <ion-card-header>
@@ -56,6 +62,7 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
+  IonSpinner,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -83,6 +90,7 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
+    IonSpinner,
     IonTitle,
     IonToggle,
     IonToolbar,
@@ -100,6 +108,7 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'INVENTORY_SYS_JOB',
       webhookEnums: JSON.parse(process.env?.VUE_APP_WEBHOOK_ENUMS as string) as any,
+      jobsLoading: false
     }
   },
   computed: {
@@ -165,16 +174,23 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    fetchJobs(){
-      this.store.dispatch("job/fetchJobs", {
+    async fetchJobs(){
+      await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "enumTypeId": "INVENTORY_SYS_JOB"
         }
       });
     },
-    fetchData() {
+    async fetchData() {
+      this.jobsLoading = true;
+      this.currentJob = "";
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.currentJobStatus = "";
+      this.freqType = "";
+      this.isJobDetailAnimationCompleted = false;
       this.store.dispatch('webhook/fetchWebhooks')
-      this.fetchJobs()
+      await this.fetchJobs()
+      this.jobsLoading = false;
     }
   },
   mounted () {
diff --git a/src/views/Miscellaneous.vue b/src/views/Miscellaneous.vue
index eaba4aad..b29bd5d2 100644
--- a/src/views/Miscellaneous.vue
+++ b/src/views/Miscellaneous.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <!-- Empty state -->
           <div v-if="miscellaneousJobs?.length === 0">
@@ -108,6 +114,7 @@ export default defineComponent({
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
       isRetrying: false,
+      jobsLoading: false
     }
   },
   computed: {
@@ -150,7 +157,13 @@ export default defineComponent({
       }
     },
     async getMiscellaneousJobs(viewSize = 100, viewIndex = 0) {
+      this.jobsLoading = true;
+      this.currentJob = "";
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.currentJobStatus = "";
+      this.isJobDetailAnimationCompleted = false;
       await this.store.dispatch('job/fetchMiscellaneousJobs', {eComStoreId: this.getCurrentEComStore.productStoreId, viewSize, viewIndex});
+      this.jobsLoading = false;
     },
     async loadMoreMiscellaneousJobs (event: any) {
       this.getMiscellaneousJobs(
diff --git a/src/views/Orders.vue b/src/views/Orders.vue
index 91adf507..f8dc427f 100644
--- a/src/views/Orders.vue
+++ b/src/views/Orders.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <ion-card>
             <ion-card-header>
@@ -105,6 +111,7 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
+  IonSpinner,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -133,6 +140,7 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
+    IonSpinner,
     IonTitle,
     IonToggle,
     IonToolbar,
@@ -150,7 +158,8 @@ export default defineComponent({
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'ORDER_SYS_JOB',
-      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any
+      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
+      jobsLoading: false
     }
   },
   computed: {
@@ -268,12 +277,19 @@ export default defineComponent({
         translate('Disabled')
     },
     async fetchJobs(){
+      this.jobsLoading = true;
+      this.currentJob = ""
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.currentJobStatus = ""
+      this.freqType = ""
+      this.isJobDetailAnimationCompleted = false
       this.store.dispatch('webhook/fetchWebhooks')
       await this.store.dispatch("job/fetchJobs", {
         "inputFields": {
           "enumTypeId": "ORDER_SYS_JOB"
         }
       });
+      this.jobsLoading = false;
     }
   },
   mounted () {
diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 2e8164fd..968c2159 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -31,7 +31,13 @@
     </ion-header>
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()" id="filter-content">
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section v-if="segmentSelected === 'pending'">
           <!-- Empty state -->
           <div v-if="pendingJobs?.length === 0">
@@ -360,7 +366,8 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       isRetrying: false,
       queryString: '' as any,
-      isScrollingEnabled: false
+      isScrollingEnabled: false,
+      jobsLoading: false
     }
   },
   computed: {
@@ -501,17 +508,17 @@ export default defineComponent({
     async refreshJobs(event: any, isRetrying = false ) {
       this.isRetrying = isRetrying;
       if(this.segmentSelected === 'pending') {
-        this.getPendingJobs().then(() => {
+        await this.getPendingJobs().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
       } else if(this.segmentSelected === 'running') {
-        this.getRunningJobs().then(() => {
+        await this.getRunningJobs().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
       } else {
-        this.getJobHistory().then(() => {
+        await this.getJobHistory().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
@@ -635,6 +642,15 @@ export default defineComponent({
         this.getPendingJobs();
       }
     },
+    async updateProductStoreConfig() {
+      this.jobsLoading = true;
+      await this.store.dispatch('job/updateCurrentJob', { job: {} });
+      this.currentJobStatus = ""
+      this.freqType = ""
+      this.isJobDetailAnimationCompleted = false
+      await this.refreshJobs(undefined, false);
+      this.jobsLoading = false;
+    }
   },
   async created() {
     this.getPendingJobs();
@@ -646,11 +662,11 @@ export default defineComponent({
     await this.store.dispatch('job/updateCurrentJob', { job: {} });
   },
   mounted(){
-    emitter.on("productStoreOrConfigChanged", this.refreshJobs);
+    emitter.on("productStoreOrConfigChanged", this.updateProductStoreConfig);
     emitter.on("pinnedJobsUpdated", (this as any).updateSelectedPinnedJob);
   },
   unmounted(){
-    emitter.off("productStoreOrConfigChanged", this.refreshJobs);
+    emitter.off("productStoreOrConfigChanged", this.updateProductStoreConfig);
     emitter.off('jobUpdated', this.updateJobs);
     emitter.off("pinnedJobsUpdated", (this as any).updateSelectedPinnedJob);
   },
diff --git a/src/views/PreOrder.vue b/src/views/PreOrder.vue
index ec1d0cbb..78823eb9 100644
--- a/src/views/PreOrder.vue
+++ b/src/views/PreOrder.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <ion-card>
             <ion-card-header>
@@ -185,6 +191,7 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
+  IonSpinner,
   IonTitle,
   IonToolbar,
   isPlatform
@@ -218,6 +225,7 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
+    IonSpinner,
     IonTitle,
     IonToolbar,
     JobConfiguration,
@@ -244,7 +252,8 @@ export default defineComponent({
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'PRE_ORD_SYS_JOB',
-      preOrderBackorderCategory: {} as any
+      preOrderBackorderCategory: {} as any,
+      jobsLoading: false
     }
   },
   methods: {
@@ -356,16 +365,23 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    fetchJobs(){
-      this.store.dispatch("job/fetchJobs", {
+    async fetchJobs(){
+      await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "enumTypeId": "PRE_ORD_SYS_JOB"
         }
       });
     },
-    fetchInitialData() {
-      this.fetchJobs();
-      this.getPreOrderBackorderCategory();
+    async fetchInitialData() {
+      this.jobsLoading = true;
+      this.currentJob = "";
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.currentJobStatus = ""
+      this.freqType = '';
+      this.isJobDetailAnimationCompleted = false;
+      await this.fetchJobs();
+      await this.getPreOrderBackorderCategory();
+      this.jobsLoading = false;
     }
   },
   mounted () {
diff --git a/src/views/Product.vue b/src/views/Product.vue
index 07515198..a502098f 100644
--- a/src/views/Product.vue
+++ b/src/views/Product.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <ion-card>
             <ion-card-header>
@@ -64,6 +70,7 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
+  IonSpinner,
   IonTitle,
   IonToolbar,
   IonToggle,
@@ -91,6 +98,7 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
+    IonSpinner,
     IonTitle,
     IonToolbar,
     IonToggle,
@@ -126,7 +134,8 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       webhookEnums: JSON.parse(process.env?.VUE_APP_WEBHOOK_ENUMS as string) as any,
       enumTypeId: 'PRODUCT_SYS_JOB',
-      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any
+      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
+      jobsLoading: false
     }
   },
   mounted () {
@@ -187,13 +196,20 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    fetchJobs(){
-      this.store.dispatch("job/fetchJobs", {
+    async fetchJobs(){
+      this.jobsLoading = true;
+      this.currentJob = ""
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.currentJobStatus = ""
+      this.freqType = ""
+      this.isJobDetailAnimationCompleted = false
+      await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "enumTypeId": "PRODUCT_SYS_JOB"
         }
       });
       this.store.dispatch('webhook/fetchWebhooks')
+      this.jobsLoading = false;
     }
   },
   setup() {
diff --git a/src/views/Reports.vue b/src/views/Reports.vue
index e83e0204..80fb169f 100644
--- a/src/views/Reports.vue
+++ b/src/views/Reports.vue
@@ -8,7 +8,13 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <div class="empty-state" v-if="jobsLoading">
+        <ion-item lines="none">
+          <ion-spinner name="crescent" slot="start" />
+          {{ translate("Fetching jobs") }}
+        </ion-item>
+      </div>
+      <main v-else>
         <section>
           <div v-if="!reportsJobs?.length">
             <p class="ion-text-center">{{ translate("There are no reports jobs right now") }}</p>
@@ -98,6 +104,7 @@ export default defineComponent({
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
       isRetrying: false,
+      jobsLoading: false
     }
   },
   computed: {
@@ -138,7 +145,13 @@ export default defineComponent({
       }
     },
     async getReportsJobs(viewSize = 200, viewIndex = 0) {
+      this.jobsLoading = true;
+      this.currentJob = "";
+      await this.store.dispatch('job/updateCurrentJob', { });
+      this.currentJobStatus = "";
+      this.isJobDetailAnimationCompleted = false;
       await this.store.dispatch('job/fetchReportsJobs', { eComStoreId: this.getCurrentEComStore.productStoreId, viewSize, viewIndex });
+      this.jobsLoading = false;
     },
     async loadMoreReportsJobs(event: any) {
       this.getReportsJobs(

From b682ade02795819d4b818cd8107743ed387c9d2f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 9 Aug 2024 12:28:22 +0530
Subject: [PATCH 04/32] Improved: added missing locale entry for the spinner
 static text (#720)

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

diff --git a/src/locales/en.json b/src/locales/en.json
index a0250ee1..d4648be1 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -90,6 +90,7 @@
   "Failed": "Failed",
   "Failed job reason": "Failed job reason",
   "Failed to schedule service(s)": "Failed to schedule {count} service(s)",
+  "Fetching jobs": "Fetching jobs",
   "Fetching TimeZones": "Fetching TimeZones",
   "File upload status": "File upload status",
   "Filters": "Filters",

From a159f5831b359730eb1dfdf7f50b73e506024964 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Tue, 8 Oct 2024 16:09:05 +0530
Subject: [PATCH 05/32] Implemented: 'Learn More' functionality that generates
 job info from GitBook Lens APIs (#726)

---
 src/adapter/index.ts                |   4 +-
 src/components/JobConfiguration.vue |  21 +++-
 src/components/LeareMoreModal.vue   | 168 ++++++++++++++++++++++++++++
 src/locales/en.json                 |   3 +
 src/views/Pipeline.vue              |  17 ++-
 5 files changed, 209 insertions(+), 4 deletions(-)
 create mode 100644 src/components/LeareMoreModal.vue

diff --git a/src/adapter/index.ts b/src/adapter/index.ts
index a31b0067..60edcc82 100644
--- a/src/adapter/index.ts
+++ b/src/adapter/index.ts
@@ -1,7 +1,8 @@
-import { api, client, getConfig, initialise, logout, resetConfig, updateInstanceUrl, updateToken, setUserTimeZone, getAvailableTimeZones} from '@hotwax/oms-api'
+import { api, askQuery, client, getConfig, initialise, logout, resetConfig, searchQuery, updateInstanceUrl, updateToken, setUserTimeZone, getAvailableTimeZones} from '@hotwax/oms-api'
 
 export {
   api,
+  askQuery,
   client,
   getConfig,
   initialise,
@@ -9,6 +10,7 @@ export {
   resetConfig,
   updateInstanceUrl,
   updateToken,
+  searchQuery,
   setUserTimeZone,
   getAvailableTimeZones
 }
\ No newline at end of file
diff --git a/src/components/JobConfiguration.vue b/src/components/JobConfiguration.vue
index 77926a83..edb3e0c1 100644
--- a/src/components/JobConfiguration.vue
+++ b/src/components/JobConfiguration.vue
@@ -13,7 +13,9 @@
 
       <ion-item v-if="currentJob.description" lines="none">
         <ion-label class="ion-text-wrap">
-          <p>{{ currentJob.description }}</p>
+          <p>{{ currentJob.description }}
+            <ion-text class="learn-more-text" color="primary" @click="openLearnMoreModal()">Learn more</ion-text>
+          </p>
         </ion-label>
       </ion-item>
 
@@ -132,6 +134,7 @@ import {
   IonRow,
   IonSelect,
   IonSelectOption,
+  IonText,
   alertController,
   modalController,
 } from "@ionic/vue";
@@ -159,6 +162,7 @@ import emitter from '@/event-bus';
 import { Actions, hasPermission } from '@/authorization'
 import CustomFrequencyModal from '@/components/CustomFrequencyModal.vue';
 import JobParameterModal from '@/components/JobParameterModal.vue'
+import LeareMoreModal from "./LeareMoreModal.vue";
 
 export default defineComponent({
   name: "JobConfiguration",
@@ -176,7 +180,8 @@ export default defineComponent({
     IonRow,
     IonSelect,
     IonSelectOption,
-    IonCheckbox
+    IonCheckbox,
+    IonText
   },
   data() {
     return {
@@ -225,6 +230,13 @@ export default defineComponent({
     }
   },
   methods: {
+    async openLearnMoreModal() {
+      const openLearnMoreModal = await modalController.create({
+        component: LeareMoreModal,
+        componentProps: {currentJob: this.currentJob}
+      })
+      return openLearnMoreModal.present()
+    },
     getDateTime(time: any) {
       return DateTime.fromMillis(time).toISO()
     },
@@ -547,6 +559,11 @@ export default defineComponent({
 </script>
 
 <style scoped>
+.learn-more-text {
+  font-size: 14px;
+  cursor: pointer;
+}
+
 ion-list {
   margin: 0 0 var(--spacer-base);
 }
diff --git a/src/components/LeareMoreModal.vue b/src/components/LeareMoreModal.vue
new file mode 100644
index 00000000..0ed33c66
--- /dev/null
+++ b/src/components/LeareMoreModal.vue
@@ -0,0 +1,168 @@
+<template>
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button @click="closeModal()">
+          <ion-icon slot="icon-only" :icon="closeOutline" />
+        </ion-button>
+      </ion-buttons>
+      <ion-title>{{ translate('Learn more.') }}</ion-title>
+      <ion-button slot="end" fill="clear" @click="redirectToJobsDoc()">
+        <ion-icon  color="dark" :icon="openOutline" />
+      </ion-button>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <div class="empty-state" v-if="isGenratingAnswer">
+      <ion-item lines="none">
+        <ion-spinner name="crescent" slot="start" />
+        {{ translate("Genrating answer...") }}
+      </ion-item>
+    </div>
+
+    <div class="empty-state" v-else-if="!askResponse">
+      <ion-item lines="none">
+        <p>{{ translate("The job details is not generating, please try again later.") }}</p>
+      </ion-item>
+    </div>
+    
+    <div v-else>
+      <ion-item class="ion-margin-top">
+        <ion-label>
+          {{ queryString }}
+          <p>{{  currentJob?.systemJobEnumId }}</p>  
+        </ion-label>
+      </ion-item>
+
+      <ion-list>
+        <ion-item lines="none">
+          <ion-label>Sources</ion-label>
+        </ion-item>
+        <ion-item v-for="section in jobSection" :key="section.id" lines="none">
+          <ion-chip @click="redirectToDoc(section)">
+            <ion-label>{{ section.title }}</ion-label>
+            <ion-icon :icon="openOutline" />
+          </ion-chip>
+        </ion-item>
+      </ion-list>
+  
+      <ion-item>
+        <ion-label>
+          <p class="overline">Summary</p>
+          {{ askResponse?.text }}
+        </ion-label>
+      </ion-item>
+    </div>
+  </ion-content>
+</template>
+
+<script lang="ts">
+import { IonButton, IonButtons, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSpinner, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { closeOutline, openOutline } from 'ionicons/icons'
+import { translate } from '@hotwax/dxp-components';
+import { defineComponent } from "vue";
+import { hasError } from '@/utils'
+import { askQuery, searchQuery } from "@/adapter";
+
+export default defineComponent({
+  name: "LearnMoreModal",
+  components: {
+    IonButton,
+    IonButtons,
+    IonChip,
+    IonContent,
+    IonHeader,
+    IonIcon,
+    IonItem,
+    IonLabel,
+    IonSpinner,
+    IonList,
+    IonTitle,
+    IonToolbar
+  },
+  data() {
+    return {
+      queryString: '',
+      askResponse: {} as any,
+      jobSection: {} as any,
+      isGenratingAnswer: true
+    }
+  },
+  props: ['currentJob'],
+  mounted() {
+    this.askQuery();
+  },
+  methods: {
+    async searchQuery(pageIds: any) {
+      let items = [] as any;
+      this.jobSection = [];
+      try {
+        const resp = await searchQuery({
+          queryString: this.currentJob?.enumName,
+          spaceId: process.env.VUE_APP_SPACE_ID,
+          baseURL: process.env.VUE_APP_GITBOOK_BASE_URL,
+          token: process.env.VUE_APP_GITBOOK_API_KEY
+        });
+        if(!hasError(resp)) {
+          items = resp.data.items;
+          pageIds.forEach((pageId: any) => {
+            const filteredPage = items.find((item: any) => item.id === pageId);
+            if (filteredPage) {
+              this.jobSection.push(...filteredPage.sections);
+            }
+          });
+          this.isGenratingAnswer = false;
+        } else {
+          throw resp.data;
+        }
+      } catch(error: any) {
+        console.error(error);
+        this.isGenratingAnswer = false;
+      }
+    },
+    async askQuery() {
+      this.queryString = `What does ${this.currentJob?.enumName} job do?`;
+      try {
+        const resp = await askQuery({ 
+          queryString: this.queryString,
+          spaceId: process.env.VUE_APP_SPACE_ID,
+          baseURL: process.env.VUE_APP_GITBOOK_BASE_URL,
+          token: process.env.VUE_APP_GITBOOK_API_KEY
+        });
+        if(!hasError(resp)) {
+          this.askResponse = resp.data.answer;
+          if(this.askResponse) {
+            const pageIds = this.askResponse?.sources.map((source: any) => source.page);
+            this.searchQuery(pageIds);
+          } else {
+            this.isGenratingAnswer = false;
+          }
+        } else {
+          throw resp.data;
+        }
+      } catch(error: any) {
+        console.error(error);
+        this.isGenratingAnswer = false;
+      }
+    },
+    async redirectToDoc(section: any) {
+      window.open(`https://docs.hotwax.co/documents/retail-operations/${section.path}`, "_blank")
+    },
+    async redirectToJobsDoc() {
+      window.open(`${process.env.VUE_APP_GITBOOK_JOBS_DOCS_URL}`, "_blank")
+    },
+    async closeModal() {
+      modalController.dismiss({ dismissed: true });
+    }
+  },
+  setup() {
+
+    return {
+      closeOutline, 
+      openOutline,
+      translate
+    };
+  }
+})
+</script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index a0250ee1..e6a5240d 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -98,6 +98,7 @@
   "Fulfilled": "Fulfilled",
   "Fulfillment": "Fulfillment",
   "Fulfillment status": "Fulfillment status",
+  "Genrating answer...": "Genrating answer...",
   "Get Paid Transactions": "Get Paid Transactions",
   "Go to OMS": "Go to OMS",
   "Go to Launchpad": "Go to Launchpad",
@@ -127,6 +128,7 @@
   "Landed inventory cost": "Landed inventory cost",
   "Last run": "Last run",
   "Last Shopify Order ID": "Last Shopify Order ID",
+  "Learn more.": "Learn more.",
   "Loading": "Loading",
   "Login": "Login",
   "Logging in": "Logging in",
@@ -286,6 +288,7 @@
   "This job may take several minutes to run. Wait till the job has moved to the pipeline history before checking results.": "This job may take several minutes to run.{ space } Wait till the job has moved to the pipeline history before checking results.",
   "This job schedule cannot be skipped": "This job schedule cannot be skipped",
   "This job does not have any custom parameters.": "This job does not have any custom parameters.",
+  "The job details is not generating, please try again later.": "The job details is not generating, please try again later.",
   "Time zone updated successfully": "Time zone updated successfully",
   "Timezone": "Timezone",
   "Tomorrow": "Tomorrow",
diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 2e8164fd..556a2dbd 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -71,6 +71,12 @@
                 <ion-label class="ion-text-wrap">{{ job.currentRetryCount }}</ion-label>
               </ion-item>
 
+              <ion-item lines="full">
+                <ion-icon slot="start" :icon="codeWorkingOutline" />
+                <ion-label class="ion-text-wrap">{{ job.systemJobEnumId }}</ion-label>
+                <ion-icon :icon="helpCircleOutline" @click.stop.prevent="openLearnMoreModal(job)"/>
+              </ion-item>
+
               <div class="actions">
                 <div>
                   <ion-button :disabled="!hasPermission(Actions.APP_JOB_UPDATE)" fill="clear" @click.stop="skipJob(job)">{{ translate("Skip") }}</ion-button>
@@ -300,7 +306,7 @@ import {
   IonButtons
 } from "@ionic/vue";
 import JobConfiguration from '@/components/JobConfiguration.vue'
-import { closeCircleOutline, codeWorkingOutline, copyOutline, ellipsisVerticalOutline, filterOutline, pinOutline, refreshOutline, timeOutline, timerOutline } from "ionicons/icons";
+import { closeCircleOutline, codeWorkingOutline, copyOutline, ellipsisVerticalOutline, filterOutline, helpCircleOutline, pinOutline, refreshOutline, timeOutline, timerOutline } from "ionicons/icons";
 import emitter from '@/event-bus';
 import JobHistoryModal from '@/components/JobHistoryModal.vue';
 import { Plugins } from '@capacitor/core';
@@ -310,6 +316,7 @@ import { Actions, hasPermission } from '@/authorization'
 import Filters from '@/components/Filters.vue';
 import FailedJobReasonModal from '@/views/FailedJobReasonModal.vue'
 import { translate } from '@hotwax/dxp-components';
+import LeareMoreModal from '@/components/LeareMoreModal.vue';
 
 export default defineComponent({
   name: "Pipeline",
@@ -390,6 +397,13 @@ export default defineComponent({
     this.isScrollingEnabled = false;
   },
   methods : {
+    async openLearnMoreModal(job: any) {
+      const openLearnMoreModal = await modalController.create({
+        component: LeareMoreModal,
+        componentProps: {currentJob: job}
+      })
+      return openLearnMoreModal.present()
+    },
     isPinnedJobSelected(jobEnumId: any) {
       return (this as any).pipelineFilters.enum.some((jobId: any) =>  jobId === jobEnumId );
     },
@@ -667,6 +681,7 @@ export default defineComponent({
       store,
       codeWorkingOutline,
       ellipsisVerticalOutline,
+      helpCircleOutline,
       pinOutline,
       refreshOutline,
       timeOutline,

From d777bc53ed7e57be11cf134a9c5a465203a3c585 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Tue, 8 Oct 2024 16:11:56 +0530
Subject: [PATCH 06/32] Improved: added outline attribute in the ion-chip(#726)

---
 src/components/LeareMoreModal.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/LeareMoreModal.vue b/src/components/LeareMoreModal.vue
index 0ed33c66..ec651fb3 100644
--- a/src/components/LeareMoreModal.vue
+++ b/src/components/LeareMoreModal.vue
@@ -40,7 +40,7 @@
           <ion-label>Sources</ion-label>
         </ion-item>
         <ion-item v-for="section in jobSection" :key="section.id" lines="none">
-          <ion-chip @click="redirectToDoc(section)">
+          <ion-chip outline @click="redirectToDoc(section)">
             <ion-label>{{ section.title }}</ion-label>
             <ion-icon :icon="openOutline" />
           </ion-chip>

From ee62280351b6e795f8059105b9440767c4065ca8 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Tue, 8 Oct 2024 16:15:36 +0530
Subject: [PATCH 07/32] Improved: change the ion-item property in the card on
 pipeline page(#726)

---
 src/views/Pipeline.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 556a2dbd..ea245b8e 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -66,7 +66,7 @@
                 <ion-label class="ion-text-wrap">{{ job.tempExprId ? temporalExpr(job.tempExprId)?.description : "🙃"  }}</ion-label>
               </ion-item>
 
-              <ion-item lines="full">
+              <ion-item>
                 <ion-icon slot="start" :icon="refreshOutline" />
                 <ion-label class="ion-text-wrap">{{ job.currentRetryCount }}</ion-label>
               </ion-item>

From 8966a97b71435295735baeed7d76b86c27ed8e0f Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Tue, 8 Oct 2024 16:43:52 +0530
Subject: [PATCH 08/32] Improved: updated the .env.example with gitbook urls &
 key(#726)

---
 .env.example | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/.env.example b/.env.example
index a80f5485..5b69ab95 100644
--- a/.env.example
+++ b/.env.example
@@ -18,3 +18,7 @@ VUE_APP_ALIAS=
 VUE_APP_DEFAULT_LOG_LEVEL="error"
 VUE_APP_LOGIN_URL="http://launchpad.hotwax.io/login"
 VUE_APP_BROKER_JOB_ENUMS = {"REJ_ORDR":"JOB_BKR_REJ_ORD"}
+VUE_APP_GITBOOK_API_KEY="gb_api_hL97xDJyiI6FBhnWKdm8CP6N6Wjl5nZSjhK3Nyd7"
+VUE_APP_SPACE_ID="GNcmGkoNRfptyho21A56"
+VUE_APP_GITBOOK_BASE_URL="https://api.gitbook.com/v1"
+VUE_APP_GITBOOK_JOBS_DOCS_URL="https://docs.hotwax.co/documents/retail-operations/workflow/job-workflows"

From 7a4c0ab70b3fac28ef5c4eab73740d51f888d69a Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Tue, 8 Oct 2024 16:52:05 +0530
Subject: [PATCH 09/32] Improved: upgraded the `oms-api` version for gitbook
 apis(#726)

---
 package-lock.json | 652 +---------------------------------------------
 package.json      |   2 +-
 2 files changed, 7 insertions(+), 647 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index a0e6ed85..7f5a4c67 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,7 @@
         "@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/oms-api": "^1.15.0",
         "@ionic/core": "^7.6.0",
         "@ionic/vue": "^7.6.0",
         "@ionic/vue-router": "^7.6.0",
@@ -2678,7 +2678,9 @@
       }
     },
     "node_modules/@hotwax/oms-api": {
-      "version": "1.14.0",
+      "version": "1.15.1",
+      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.15.1.tgz",
+      "integrity": "sha512-Zc/GcoPoBX/bbY1n2EtNpPaR7PAMGTfEt8lDQZEnX55h85RY00H4uLDslD2OGWbGBjJO0MZrRmGv7PObuFxfWQ==",
       "license": "Apache-2.0",
       "dependencies": {
         "@types/node-json-transform": "^1.0.0",
@@ -2708,37 +2710,6 @@
       "dev": true,
       "license": "BSD-3-Clause"
     },
-    "node_modules/@intlify/bundle-utils": {
-      "version": "0.1.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/core": "^9.1.6",
-        "@intlify/message-compiler": "^9.1.6",
-        "@intlify/shared": "^9.1.6",
-        "jsonc-eslint-parser": "^1.0.1",
-        "source-map": "^0.6.1",
-        "yaml-eslint-parser": "^0.3.2"
-      },
-      "engines": {
-        "node": ">= 12"
-      }
-    },
-    "node_modules/@intlify/core": {
-      "version": "9.8.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/core-base": "9.8.0",
-        "@intlify/shared": "9.8.0"
-      },
-      "engines": {
-        "node": ">= 16"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/kazupon"
-      }
-    },
     "node_modules/@intlify/core-base": {
       "version": "9.8.0",
       "license": "MIT",
@@ -2753,23 +2724,6 @@
         "url": "https://github.com/sponsors/kazupon"
       }
     },
-    "node_modules/@intlify/devtools-if": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/shared": "9.1.10"
-      },
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@intlify/devtools-if/node_modules/@intlify/shared": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 10"
-      }
-    },
     "node_modules/@intlify/message-compiler": {
       "version": "9.8.0",
       "license": "MIT",
@@ -2784,44 +2738,6 @@
         "url": "https://github.com/sponsors/kazupon"
       }
     },
-    "node_modules/@intlify/message-resolver": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@intlify/runtime": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/message-compiler": "9.1.10",
-        "@intlify/message-resolver": "9.1.10",
-        "@intlify/shared": "9.1.10"
-      },
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@intlify/runtime/node_modules/@intlify/message-compiler": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/message-resolver": "9.1.10",
-        "@intlify/shared": "9.1.10",
-        "source-map": "0.6.1"
-      },
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@intlify/runtime/node_modules/@intlify/shared": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 10"
-      }
-    },
     "node_modules/@intlify/shared": {
       "version": "9.8.0",
       "license": "MIT",
@@ -2832,41 +2748,6 @@
         "url": "https://github.com/sponsors/kazupon"
       }
     },
-    "node_modules/@intlify/vue-devtools": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/message-resolver": "9.1.10",
-        "@intlify/runtime": "9.1.10",
-        "@intlify/shared": "9.1.10"
-      },
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@intlify/vue-devtools/node_modules/@intlify/shared": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/@intlify/vue-i18n-loader": {
-      "version": "2.1.2",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/bundle-utils": "^0.1.0",
-        "@intlify/shared": "^9.1.6",
-        "loader-utils": "^2.0.0"
-      },
-      "engines": {
-        "node": ">= 12"
-      },
-      "peerDependencies": {
-        "vue": "^3.0.0"
-      }
-    },
     "node_modules/@ionic/core": {
       "version": "7.8.2",
       "license": "MIT",
@@ -6075,15 +5956,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/colors": {
-      "version": "1.4.0",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "engines": {
-        "node": ">=0.1.90"
-      }
-    },
     "node_modules/combined-stream": {
       "version": "1.0.8",
       "dev": true,
@@ -6929,14 +6801,6 @@
         }
       }
     },
-    "node_modules/decamelize": {
-      "version": "1.2.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/deep-is": {
       "version": "0.1.4",
       "dev": true,
@@ -7211,22 +7075,6 @@
       "dev": true,
       "license": "0BSD"
     },
-    "node_modules/dot-object": {
-      "version": "1.9.0",
-      "dev": true,
-      "dependencies": {
-        "commander": "^2.20.0",
-        "glob": "^7.1.4"
-      },
-      "bin": {
-        "dot-object": "bin/dot-object"
-      }
-    },
-    "node_modules/dot-object/node_modules/commander": {
-      "version": "2.20.3",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/dotenv": {
       "version": "10.0.0",
       "dev": true,
@@ -8041,14 +7889,6 @@
       "dev": true,
       "license": "ISC"
     },
-    "node_modules/esm": {
-      "version": "3.2.25",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/espree": {
       "version": "7.3.1",
       "dev": true,
@@ -10136,14 +9976,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/is-valid-glob": {
-      "version": "1.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
     "node_modules/is-weakref": {
       "version": "1.0.2",
       "dev": true,
@@ -10496,75 +10328,6 @@
         "node": ">=6"
       }
     },
-    "node_modules/jsonc-eslint-parser": {
-      "version": "1.4.1",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "acorn": "^7.4.1",
-        "eslint-utils": "^2.1.0",
-        "eslint-visitor-keys": "^1.3.0",
-        "espree": "^6.0.0",
-        "semver": "^6.3.0"
-      },
-      "engines": {
-        "node": ">=8.10.0"
-      }
-    },
-    "node_modules/jsonc-eslint-parser/node_modules/acorn": {
-      "version": "7.4.1",
-      "dev": true,
-      "license": "MIT",
-      "bin": {
-        "acorn": "bin/acorn"
-      },
-      "engines": {
-        "node": ">=0.4.0"
-      }
-    },
-    "node_modules/jsonc-eslint-parser/node_modules/eslint-utils": {
-      "version": "2.1.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "eslint-visitor-keys": "^1.1.0"
-      },
-      "engines": {
-        "node": ">=6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/mysticatea"
-      }
-    },
-    "node_modules/jsonc-eslint-parser/node_modules/eslint-visitor-keys": {
-      "version": "1.3.0",
-      "dev": true,
-      "license": "Apache-2.0",
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/jsonc-eslint-parser/node_modules/espree": {
-      "version": "6.2.1",
-      "dev": true,
-      "license": "BSD-2-Clause",
-      "dependencies": {
-        "acorn": "^7.1.1",
-        "acorn-jsx": "^5.2.0",
-        "eslint-visitor-keys": "^1.1.0"
-      },
-      "engines": {
-        "node": ">=6.0.0"
-      }
-    },
-    "node_modules/jsonc-eslint-parser/node_modules/semver": {
-      "version": "6.3.1",
-      "dev": true,
-      "license": "ISC",
-      "bin": {
-        "semver": "bin/semver.js"
-      }
-    },
     "node_modules/jsonfile": {
       "version": "4.0.0",
       "dev": true,
@@ -13119,11 +12882,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/require-main-filename": {
-      "version": "2.0.0",
-      "dev": true,
-      "license": "ISC"
-    },
     "node_modules/requires-port": {
       "version": "1.0.0",
       "dev": true,
@@ -13543,11 +13301,6 @@
         "node": ">= 0.8.0"
       }
     },
-    "node_modules/set-blocking": {
-      "version": "2.0.0",
-      "dev": true,
-      "license": "ISC"
-    },
     "node_modules/set-function-length": {
       "version": "1.1.1",
       "license": "MIT",
@@ -13719,6 +13472,7 @@
     },
     "node_modules/source-map": {
       "version": "0.6.1",
+      "dev": true,
       "license": "BSD-3-Clause",
       "engines": {
         "node": ">=0.10.0"
@@ -14970,52 +14724,6 @@
         }
       }
     },
-    "node_modules/vue-cli-plugin-i18n": {
-      "version": "1.0.1",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "debug": "^4.1.0",
-        "deepmerge": "^4.2.0",
-        "dotenv": "^8.2.0",
-        "flat": "^5.0.0",
-        "rimraf": "^3.0.0",
-        "vue": "^2.6.11",
-        "vue-i18n": "^8.17.0",
-        "vue-i18n-extract": "1.0.2"
-      }
-    },
-    "node_modules/vue-cli-plugin-i18n/node_modules/@vue/compiler-sfc": {
-      "version": "2.7.15",
-      "dev": true,
-      "dependencies": {
-        "@babel/parser": "^7.18.4",
-        "postcss": "^8.4.14",
-        "source-map": "^0.6.1"
-      }
-    },
-    "node_modules/vue-cli-plugin-i18n/node_modules/dotenv": {
-      "version": "8.6.0",
-      "dev": true,
-      "license": "BSD-2-Clause",
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/vue-cli-plugin-i18n/node_modules/vue": {
-      "version": "2.7.15",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@vue/compiler-sfc": "2.7.15",
-        "csstype": "^3.1.0"
-      }
-    },
-    "node_modules/vue-cli-plugin-i18n/node_modules/vue-i18n": {
-      "version": "8.28.2",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/vue-component-type-helpers": {
       "version": "1.8.25",
       "dev": true,
@@ -15118,331 +14826,6 @@
       "dev": true,
       "license": "MIT"
     },
-    "node_modules/vue-i18n": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/core-base": "9.1.10",
-        "@intlify/shared": "9.1.10",
-        "@intlify/vue-devtools": "9.1.10",
-        "@vue/devtools-api": "^6.0.0-beta.7"
-      },
-      "engines": {
-        "node": ">= 10"
-      },
-      "peerDependencies": {
-        "vue": "^3.0.0"
-      }
-    },
-    "node_modules/vue-i18n-extract": {
-      "version": "1.0.2",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "cli-table3": "^0.5.1",
-        "dot-object": "^1.7.1",
-        "esm": "^3.2.13",
-        "glob": "^7.1.3",
-        "is-valid-glob": "^1.0.0",
-        "yargs": "^13.2.2"
-      },
-      "bin": {
-        "vue-i18n-extract": "dist-node/index.bin.js"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/ansi-regex": {
-      "version": "3.0.1",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/camelcase": {
-      "version": "5.3.1",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/cli-table3": {
-      "version": "0.5.1",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "object-assign": "^4.1.0",
-        "string-width": "^2.1.1"
-      },
-      "engines": {
-        "node": ">=6"
-      },
-      "optionalDependencies": {
-        "colors": "^1.1.2"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/cliui": {
-      "version": "5.0.0",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "string-width": "^3.1.0",
-        "strip-ansi": "^5.2.0",
-        "wrap-ansi": "^5.1.0"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/ansi-regex": {
-      "version": "4.1.1",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/string-width": {
-      "version": "3.1.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "emoji-regex": "^7.0.1",
-        "is-fullwidth-code-point": "^2.0.0",
-        "strip-ansi": "^5.1.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/strip-ansi": {
-      "version": "5.2.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-regex": "^4.1.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/emoji-regex": {
-      "version": "7.0.3",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/vue-i18n-extract/node_modules/find-up": {
-      "version": "3.0.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "locate-path": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/is-fullwidth-code-point": {
-      "version": "2.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/locate-path": {
-      "version": "3.0.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "p-locate": "^3.0.0",
-        "path-exists": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/p-locate": {
-      "version": "3.0.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "p-limit": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/path-exists": {
-      "version": "3.0.0",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/string-width": {
-      "version": "2.1.1",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "is-fullwidth-code-point": "^2.0.0",
-        "strip-ansi": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/strip-ansi": {
-      "version": "4.0.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-regex": "^3.0.0"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi": {
-      "version": "5.1.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-styles": "^3.2.0",
-        "string-width": "^3.0.0",
-        "strip-ansi": "^5.0.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/ansi-regex": {
-      "version": "4.1.1",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/string-width": {
-      "version": "3.1.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "emoji-regex": "^7.0.1",
-        "is-fullwidth-code-point": "^2.0.0",
-        "strip-ansi": "^5.1.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/strip-ansi": {
-      "version": "5.2.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-regex": "^4.1.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/y18n": {
-      "version": "4.0.3",
-      "dev": true,
-      "license": "ISC"
-    },
-    "node_modules/vue-i18n-extract/node_modules/yargs": {
-      "version": "13.3.2",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "cliui": "^5.0.0",
-        "find-up": "^3.0.0",
-        "get-caller-file": "^2.0.1",
-        "require-directory": "^2.1.1",
-        "require-main-filename": "^2.0.0",
-        "set-blocking": "^2.0.0",
-        "string-width": "^3.0.0",
-        "which-module": "^2.0.0",
-        "y18n": "^4.0.0",
-        "yargs-parser": "^13.1.2"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/yargs-parser": {
-      "version": "13.1.2",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "camelcase": "^5.0.0",
-        "decamelize": "^1.2.0"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/ansi-regex": {
-      "version": "4.1.1",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/string-width": {
-      "version": "3.1.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "emoji-regex": "^7.0.1",
-        "is-fullwidth-code-point": "^2.0.0",
-        "strip-ansi": "^5.1.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/strip-ansi": {
-      "version": "5.2.0",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "ansi-regex": "^4.1.0"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/vue-i18n/node_modules/@intlify/core-base": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/devtools-if": "9.1.10",
-        "@intlify/message-compiler": "9.1.10",
-        "@intlify/message-resolver": "9.1.10",
-        "@intlify/runtime": "9.1.10",
-        "@intlify/shared": "9.1.10",
-        "@intlify/vue-devtools": "9.1.10"
-      },
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/vue-i18n/node_modules/@intlify/message-compiler": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "dependencies": {
-        "@intlify/message-resolver": "9.1.10",
-        "@intlify/shared": "9.1.10",
-        "source-map": "0.6.1"
-      },
-      "engines": {
-        "node": ">= 10"
-      }
-    },
-    "node_modules/vue-i18n/node_modules/@intlify/shared": {
-      "version": "9.1.10",
-      "license": "MIT",
-      "engines": {
-        "node": ">= 10"
-      }
-    },
     "node_modules/vue-loader": {
       "version": "17.3.1",
       "dev": true,
@@ -16077,11 +15460,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/which-module": {
-      "version": "2.0.1",
-      "dev": true,
-      "license": "ISC"
-    },
     "node_modules/which-typed-array": {
       "version": "1.1.13",
       "dev": true,
@@ -16572,24 +15950,6 @@
         "node": ">= 6"
       }
     },
-    "node_modules/yaml-eslint-parser": {
-      "version": "0.3.2",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "eslint-visitor-keys": "^1.3.0",
-        "lodash": "^4.17.20",
-        "yaml": "^1.10.0"
-      }
-    },
-    "node_modules/yaml-eslint-parser/node_modules/eslint-visitor-keys": {
-      "version": "1.3.0",
-      "dev": true,
-      "license": "Apache-2.0",
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/yargs": {
       "version": "16.2.0",
       "dev": true,
@@ -16732,4 +16092,4 @@
       "license": "ISC"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/package.json b/package.json
index 8fa20b73..3a98d99f 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
     "@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/oms-api": "^1.15.0",
     "@ionic/core": "^7.6.0",
     "@ionic/vue": "^7.6.0",
     "@ionic/vue-router": "^7.6.0",

From d60b76885f23c166f42bf08b59da16a3ed659c5f Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Mon, 28 Oct 2024 10:44:12 +0530
Subject: [PATCH 10/32] Reverted: updated the env file with new changes(#726)

---
 .env.example | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.env.example b/.env.example
index 5b69ab95..a111ff8a 100644
--- a/.env.example
+++ b/.env.example
@@ -18,7 +18,7 @@ VUE_APP_ALIAS=
 VUE_APP_DEFAULT_LOG_LEVEL="error"
 VUE_APP_LOGIN_URL="http://launchpad.hotwax.io/login"
 VUE_APP_BROKER_JOB_ENUMS = {"REJ_ORDR":"JOB_BKR_REJ_ORD"}
-VUE_APP_GITBOOK_API_KEY="gb_api_hL97xDJyiI6FBhnWKdm8CP6N6Wjl5nZSjhK3Nyd7"
-VUE_APP_SPACE_ID="GNcmGkoNRfptyho21A56"
+VUE_APP_GITBOOK_API_KEY=""
+VUE_APP_SPACE_ID=""
 VUE_APP_GITBOOK_BASE_URL="https://api.gitbook.com/v1"
 VUE_APP_GITBOOK_JOBS_DOCS_URL="https://docs.hotwax.co/documents/retail-operations/workflow/job-workflows"

From 30acf641142b6d4548488b0d465963944f120d68 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Thu, 14 Nov 2024 16:54:19 +0530
Subject: [PATCH 11/32] Improved: Added a function to set the ion-badge color
 based on log status and updated the 'Failed Records' icon properties (#680)

---
 src/views/DataManagerLogDetails.vue | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/views/DataManagerLogDetails.vue b/src/views/DataManagerLogDetails.vue
index 5d80031d..802062da 100644
--- a/src/views/DataManagerLogDetails.vue
+++ b/src/views/DataManagerLogDetails.vue
@@ -92,10 +92,10 @@
             <p>{{ translate('Finished') }}</p>
           </ion-label>
 
-          <ion-badge v-if="log.statusId" :color="log.statusId === 'SERVICE_FAILED' ? 'danger' : 'success'">{{ translate(getStatusDesc(log.statusId)) }}</ion-badge>
+          <ion-badge v-if="log.statusId" :color="getLogStatusColor(log.statusId)">{{ translate(getStatusDesc(log.statusId)) }}</ion-badge>
           
           <div class="ion-text-center" lines="none" v-if="log.errorRecordContentId" button @click="downloadErrorRecordFile(log)">
-            <ion-icon slot="start" :icon="cloudDownloadOutline" />
+            <ion-icon slot="icon-only" color="medium" :icon="cloudDownloadOutline" />
             <ion-label>
               <p>{{ translate('Failed records') }}</p>
             </ion-label>
@@ -257,6 +257,19 @@ export default defineComponent ({
       } catch (error) {
         logger.error(error);
       }
+    },
+    getLogStatusColor(statusId) {
+      if (statusId === 'SERVICE_FINISHED') {
+        return 'success';
+      } else if (statusId === 'SERVICE_RUNNING') {
+        return 'dark';
+      } else if (statusId === 'SERVICE_FAILED') {
+        return 'danger';
+      } else if (statusId === 'SERVICE_PENDING') {
+        return 'medium';
+      } else {
+        return 'medium';
+      }
     }
   },
   setup() {

From 0eed41fa9b1ef31c4a6e58806ca4aa9660d543de Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 25 Nov 2024 10:40:14 +0530
Subject: [PATCH 12/32] Reverted: unnecessary arguments being passed, and
 unwanted await keyword (#720)

---
 src/views/Pipeline.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 968c2159..86e8ac1d 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -508,17 +508,17 @@ export default defineComponent({
     async refreshJobs(event: any, isRetrying = false ) {
       this.isRetrying = isRetrying;
       if(this.segmentSelected === 'pending') {
-        await this.getPendingJobs().then(() => {
+        this.getPendingJobs().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
       } else if(this.segmentSelected === 'running') {
-        await this.getRunningJobs().then(() => {
+        this.getRunningJobs().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
       } else {
-        await this.getJobHistory().then(() => {
+        this.getJobHistory().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
@@ -547,7 +547,7 @@ export default defineComponent({
               text: translate('Skip'),
               handler: async () => {
                 if(this.isRuntimePassed(job)) {
-                  await this.refreshJobs(undefined, true)
+                  await this.refreshJobs(undefined)
                   showToast(translate("Job runtime has passed. The job data has refreshed. Please try again."))
                   await this.store.dispatch('job/updateCurrentJob', { job: {} });
                   return;
@@ -593,7 +593,7 @@ export default defineComponent({
               text: translate("CANCEL"),
               handler: async () => {
                 if(this.isRuntimePassed(job)) {
-                  await this.refreshJobs(undefined, true)
+                  await this.refreshJobs(undefined)
                   showToast(translate("Job runtime has passed. The job data has refreshed. Please try again."))
                   await this.store.dispatch('job/updateCurrentJob', { job: {} });
                   return;
@@ -648,7 +648,7 @@ export default defineComponent({
       this.currentJobStatus = ""
       this.freqType = ""
       this.isJobDetailAnimationCompleted = false
-      await this.refreshJobs(undefined, false);
+      await this.refreshJobs(undefined);
       this.jobsLoading = false;
     }
   },

From 7e556a989d83665e93813bec69cbe9b63cb9d092 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 25 Nov 2024 11:49:33 +0530
Subject: [PATCH 13/32] Improved: code to only dismiss the configuration card
 in case of product store change (#720)

---
 src/components/Menu.vue     |  4 ++--
 src/views/Brokering.vue     | 16 +++++++++-------
 src/views/Fulfillment.vue   | 16 +++++++++-------
 src/views/InitialLoad.vue   | 16 +++++++++-------
 src/views/Inventory.vue     | 16 +++++++++-------
 src/views/Miscellaneous.vue | 19 ++++++++++++-------
 src/views/Orders.vue        | 16 +++++++++-------
 src/views/Pipeline.vue      | 21 ++++++++++++---------
 src/views/PreOrder.vue      | 16 +++++++++-------
 src/views/Product.vue       | 16 +++++++++-------
 src/views/Reports.vue       | 19 ++++++++++++-------
 11 files changed, 101 insertions(+), 74 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index f5388823..b31672c2 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -83,12 +83,12 @@ export default defineComponent({
     async setEComStore(event: CustomEvent) {
       if(this.userProfile && this.eComStore?.productStoreId !== event.detail.value) {
         await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
-        emitter.emit("productStoreOrConfigChanged")
+        emitter.emit("productStoreOrConfigChanged", true)
       }
     },
     async setShopifyConfig(event: CustomEvent){
       await this.store.dispatch('user/setCurrentShopifyConfig', { 'shopifyConfigId': event.detail.value });
-      emitter.emit("productStoreOrConfigChanged")
+      emitter.emit("productStoreOrConfigChanged", true)
     }
   },
   setup() {
diff --git a/src/views/Brokering.vue b/src/views/Brokering.vue
index 186c253f..9e3c293a 100644
--- a/src/views/Brokering.vue
+++ b/src/views/Brokering.vue
@@ -217,13 +217,15 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    async fetchJobs() {
-      this.jobsLoading = true;
-      this.currentJob = "";
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.currentJobStatus = "";
-      this.freqType = "";
-      this.isJobDetailAnimationCompleted = false;
+    async fetchJobs(JobDetailDismissRequired = false) {
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentJob = "";
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.currentJobStatus = "";
+        this.freqType = "";
+        this.isJobDetailAnimationCompleted = false;
+      }
       await this.store.dispatch("job/fetchJobs", {
         "inputFields": {
           // If we fetch broker sys job by not passing systemJobEnumId filter then this api
diff --git a/src/views/Fulfillment.vue b/src/views/Fulfillment.vue
index ae112ad4..9303dd88 100644
--- a/src/views/Fulfillment.vue
+++ b/src/views/Fulfillment.vue
@@ -241,13 +241,15 @@ export default defineComponent({
         this.store.dispatch('job/updateJob', job)
       }
     },
-    async fetchJobs(){
-      this.jobsLoading = true;
-      this.currentJob = "";
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.currentJobStatus = "";
-      this.freqType = "";
-      this.isJobDetailAnimationCompleted = false;
+    async fetchJobs(JobDetailDismissRequired = false){
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentJob = "";
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.currentJobStatus = "";
+        this.freqType = "";
+        this.isJobDetailAnimationCompleted = false;
+      }
       await this.store.dispatch("job/fetchJobs", {
         "inputFields": {
           "enumTypeId": "FULFILLMENT_SYS_JOB"
diff --git a/src/views/InitialLoad.vue b/src/views/InitialLoad.vue
index c7e62a8b..84d3de1e 100644
--- a/src/views/InitialLoad.vue
+++ b/src/views/InitialLoad.vue
@@ -216,13 +216,15 @@ export default defineComponent({
         this.isJobDetailAnimationCompleted = true;
       }
     },
-    async fetchJobs(){
-      this.jobsLoading = true;
-      this.currentSelectedJobModal = "";
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.job = {};
-      this.lastShopifyOrderId = "";
-      this.isJobDetailAnimationCompleted = false;
+    async fetchJobs(JobDetailDismissRequired = false){
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentSelectedJobModal = "";
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.job = {};
+        this.lastShopifyOrderId = "";
+        this.isJobDetailAnimationCompleted = false;
+      }
       await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "systemJobEnumId": Object.values(this.jobEnums),
diff --git a/src/views/Inventory.vue b/src/views/Inventory.vue
index 77384625..c7816ae3 100644
--- a/src/views/Inventory.vue
+++ b/src/views/Inventory.vue
@@ -181,13 +181,15 @@ export default defineComponent({
         }
       });
     },
-    async fetchData() {
-      this.jobsLoading = true;
-      this.currentJob = "";
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.currentJobStatus = "";
-      this.freqType = "";
-      this.isJobDetailAnimationCompleted = false;
+    async fetchData(JobDetailDismissRequired = false) {
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentJob = "";
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.currentJobStatus = "";
+        this.freqType = "";
+        this.isJobDetailAnimationCompleted = false;
+      }
       this.store.dispatch('webhook/fetchWebhooks')
       await this.fetchJobs()
       this.jobsLoading = false;
diff --git a/src/views/Miscellaneous.vue b/src/views/Miscellaneous.vue
index b29bd5d2..02f44eda 100644
--- a/src/views/Miscellaneous.vue
+++ b/src/views/Miscellaneous.vue
@@ -101,10 +101,10 @@ export default defineComponent({
   mounted() {
     emitter.on('jobUpdated', this.getMiscellaneousJobs);
     this.getMiscellaneousJobs();
-    emitter.on("productStoreOrConfigChanged", this.getMiscellaneousJobs);
+    emitter.on("productStoreOrConfigChanged", this.updateProductStoreConfig);
   },
   unmounted() {
-    emitter.off("productStoreOrConfigChanged", this.getMiscellaneousJobs);
+    emitter.off("productStoreOrConfigChanged", this.updateProductStoreConfig);
     emitter.off('jobUpdated', this.getMiscellaneousJobs);
   },
   data() {
@@ -157,12 +157,17 @@ export default defineComponent({
       }
     },
     async getMiscellaneousJobs(viewSize = 100, viewIndex = 0) {
-      this.jobsLoading = true;
-      this.currentJob = "";
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.currentJobStatus = "";
-      this.isJobDetailAnimationCompleted = false;
       await this.store.dispatch('job/fetchMiscellaneousJobs', {eComStoreId: this.getCurrentEComStore.productStoreId, viewSize, viewIndex});
+    },
+    async updateProductStoreConfig(JobDetailDismissRequired = false) {
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentJob = "";
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.currentJobStatus = "";
+        this.isJobDetailAnimationCompleted = false;
+      }
+      this.getMiscellaneousJobs();
       this.jobsLoading = false;
     },
     async loadMoreMiscellaneousJobs (event: any) {
diff --git a/src/views/Orders.vue b/src/views/Orders.vue
index f8dc427f..643f3843 100644
--- a/src/views/Orders.vue
+++ b/src/views/Orders.vue
@@ -276,13 +276,15 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    async fetchJobs(){
-      this.jobsLoading = true;
-      this.currentJob = ""
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.currentJobStatus = ""
-      this.freqType = ""
-      this.isJobDetailAnimationCompleted = false
+    async fetchJobs(JobDetailDismissRequired = false){
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentJob = ""
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.currentJobStatus = ""
+        this.freqType = ""
+        this.isJobDetailAnimationCompleted = false
+      }
       this.store.dispatch('webhook/fetchWebhooks')
       await this.store.dispatch("job/fetchJobs", {
         "inputFields": {
diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index f0874d7f..ce407222 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -508,17 +508,17 @@ export default defineComponent({
     async refreshJobs(event: any, isRetrying = false ) {
       this.isRetrying = isRetrying;
       if(this.segmentSelected === 'pending') {
-        this.getPendingJobs().then(() => {
+        await this.getPendingJobs().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
       } else if(this.segmentSelected === 'running') {
-        this.getRunningJobs().then(() => {
+        await this.getRunningJobs().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
       } else {
-        this.getJobHistory().then(() => {
+        await this.getJobHistory().then(() => {
           if(event) event.target.complete();
           this.isRetrying = false;
         });
@@ -645,12 +645,15 @@ export default defineComponent({
         this.getPendingJobs();
       }
     },
-    async updateProductStoreConfig() {
-      this.jobsLoading = true;
-      await this.store.dispatch('job/updateCurrentJob', { job: {} });
-      this.currentJobStatus = ""
-      this.freqType = ""
-      this.isJobDetailAnimationCompleted = false
+    async updateProductStoreConfig(JobDetailDismissRequired = false) {
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        console.log('if')
+        await this.store.dispatch('job/updateCurrentJob', { job: {} });
+        this.currentJobStatus = ""
+        this.freqType = ""
+        this.isJobDetailAnimationCompleted = false
+      }
       await this.refreshJobs(undefined);
       this.jobsLoading = false;
     }
diff --git a/src/views/PreOrder.vue b/src/views/PreOrder.vue
index 78823eb9..b1adcf3a 100644
--- a/src/views/PreOrder.vue
+++ b/src/views/PreOrder.vue
@@ -372,13 +372,15 @@ export default defineComponent({
         }
       });
     },
-    async fetchInitialData() {
-      this.jobsLoading = true;
-      this.currentJob = "";
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.currentJobStatus = ""
-      this.freqType = '';
-      this.isJobDetailAnimationCompleted = false;
+    async fetchInitialData(JobDetailDismissRequired = false) {
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentJob = "";
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.currentJobStatus = ""
+        this.freqType = '';
+        this.isJobDetailAnimationCompleted = false;
+      }
       await this.fetchJobs();
       await this.getPreOrderBackorderCategory();
       this.jobsLoading = false;
diff --git a/src/views/Product.vue b/src/views/Product.vue
index a502098f..1f63b10e 100644
--- a/src/views/Product.vue
+++ b/src/views/Product.vue
@@ -196,13 +196,15 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    async fetchJobs(){
-      this.jobsLoading = true;
-      this.currentJob = ""
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.currentJobStatus = ""
-      this.freqType = ""
-      this.isJobDetailAnimationCompleted = false
+    async fetchJobs(JobDetailDismissRequired = false){
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentJob = ""
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.currentJobStatus = ""
+        this.freqType = ""
+        this.isJobDetailAnimationCompleted = false
+      }
       await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "enumTypeId": "PRODUCT_SYS_JOB"
diff --git a/src/views/Reports.vue b/src/views/Reports.vue
index 80fb169f..ac6dc03b 100644
--- a/src/views/Reports.vue
+++ b/src/views/Reports.vue
@@ -117,11 +117,11 @@ export default defineComponent({
   mounted() {
     emitter.on('jobUpdated', this.getReportsJobs);
     this.getReportsJobs();
-    emitter.on("productStoreOrConfigChanged", this.getReportsJobs);
+    emitter.on("productStoreOrConfigChanged", this.updateProductStoreConfig);
   },
   unmounted() {
     emitter.on('jobUpdated', this.getReportsJobs);
-    emitter.off("productStoreOrConfigChanged", this.getReportsJobs);
+    emitter.off("productStoreOrConfigChanged", this.updateProductStoreConfig);
   },
   methods: {
     async viewJobConfiguration(job: any) {
@@ -145,12 +145,17 @@ export default defineComponent({
       }
     },
     async getReportsJobs(viewSize = 200, viewIndex = 0) {
-      this.jobsLoading = true;
-      this.currentJob = "";
-      await this.store.dispatch('job/updateCurrentJob', { });
-      this.currentJobStatus = "";
-      this.isJobDetailAnimationCompleted = false;
       await this.store.dispatch('job/fetchReportsJobs', { eComStoreId: this.getCurrentEComStore.productStoreId, viewSize, viewIndex });
+    },
+    async updateProductStoreConfig(JobDetailDismissRequired = false) {
+      if(JobDetailDismissRequired) {
+        this.jobsLoading = true;
+        this.currentJob = "";
+        await this.store.dispatch('job/updateCurrentJob', { });
+        this.currentJobStatus = "";
+        this.isJobDetailAnimationCompleted = false;
+      }
+      await this.getReportsJobs()
       this.jobsLoading = false;
     },
     async loadMoreReportsJobs(event: any) {

From ebf49f20ff163a092c12008fb144dc091fa5f0a8 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 25 Nov 2024 11:53:51 +0530
Subject: [PATCH 14/32] Reverted: unwanted console statement from the code
 (#720)

---
 src/views/Pipeline.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index ce407222..3b4635c1 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -648,7 +648,6 @@ export default defineComponent({
     async updateProductStoreConfig(JobDetailDismissRequired = false) {
       if(JobDetailDismissRequired) {
         this.jobsLoading = true;
-        console.log('if')
         await this.store.dispatch('job/updateCurrentJob', { job: {} });
         this.currentJobStatus = ""
         this.freqType = ""

From 0ebf7eb6ee896619127ee0e5e5db9e7fdb3abe7d Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Mon, 25 Nov 2024 12:27:18 +0530
Subject: [PATCH 15/32] Improved: Added CSS to highlight the selected job
 card(#742)

---
 src/views/Pipeline.vue | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 8aff535f..3ad9b138 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -45,7 +45,7 @@
           </div>
 
           <div v-else>
-            <ion-card v-for="job in pendingJobs" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop">
+            <ion-card v-for="job in pendingJobs" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop" :class="{ 'job-card-elevated': elevatedJobCard === job.jobId }">
               <ion-card-header>
                 <ion-card-title>{{ job.enumName }}</ion-card-title>
                 <ion-badge v-if="job.runTime" color="dark">{{ timeFromNow(job.runTime)}}</ion-badge>
@@ -180,7 +180,7 @@
           </div>
 
           <div v-else>
-          <ion-card v-for="job in jobHistory" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop">
+          <ion-card v-for="job in jobHistory" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop" :class="{ 'job-card-elevated': elevateJobCard === job.jobId }">
             <ion-card-header>
               <div>
                 <ion-card-subtitle class="overline">{{ job.parentJobId }}</ion-card-subtitle>
@@ -360,7 +360,8 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       isRetrying: false,
       queryString: '' as any,
-      isScrollingEnabled: false
+      isScrollingEnabled: false,
+      elevateJobCard: '' as any
     }
   },
   computed: {
@@ -602,6 +603,7 @@ export default defineComponent({
        return alert.present();
     },
     async viewJobConfiguration(job: any) {
+      this.elevateJobCard = job.jobId
       this.currentJobStatus = job.tempExprId
       const id = Object.entries(this.jobEnums).find((enums) => enums[1] == job.systemJobEnumId) as any
       const appFreqType =  id && (Object.entries(this.jobFrequencyType).find((freq) => freq[0] == id[0]) as any)
@@ -685,6 +687,11 @@ export default defineComponent({
 </script>
 
 <style scoped>
+.job-card-elevated {
+  box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, 0.14), 0px 3px 14px 0px rgba(0, 0, 0, 0.12), 0px 4px 5px 0px rgba(0, 0, 0, 0.20);
+  scale: 1.03
+}
+
 ion-card-header {
   display: flex;
   flex-direction: row;

From 1b25cfea4d5ca3ef7af700bbb02493fca86d860b Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Mon, 25 Nov 2024 12:32:25 +0530
Subject: [PATCH 16/32] Improved: added the same class variable for pending
 jobs(#742)

---
 src/views/Pipeline.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 3ad9b138..21b4f6d9 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -45,7 +45,7 @@
           </div>
 
           <div v-else>
-            <ion-card v-for="job in pendingJobs" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop" :class="{ 'job-card-elevated': elevatedJobCard === job.jobId }">
+            <ion-card v-for="job in pendingJobs" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop" :class="{ 'job-card-elevated': elevateJobCard === job.jobId }">
               <ion-card-header>
                 <ion-card-title>{{ job.enumName }}</ion-card-title>
                 <ion-badge v-if="job.runTime" color="dark">{{ timeFromNow(job.runTime)}}</ion-badge>

From b7835b743256a1c95a6033a606e3fa11a9eaae3c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 25 Nov 2024 16:54:06 +0530
Subject: [PATCH 17/32] Improved: added skeleton text to the new detail items
 (#524)

---
 src/views/Fulfillment.vue | 12 ++++++++----
 src/views/Inventory.vue   |  3 ++-
 src/views/Orders.vue      |  3 ++-
 src/views/Product.vue     |  3 ++-
 4 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/src/views/Fulfillment.vue b/src/views/Fulfillment.vue
index 234c7e93..313372ef 100644
--- a/src/views/Fulfillment.vue
+++ b/src/views/Fulfillment.vue
@@ -48,15 +48,18 @@
             </ion-card-header>
             <ion-item button @click="viewJobConfiguration({ id: 'OPN_BOPIS_ORD_NT', status: getJobStatus(jobEnums['OPN_BOPIS_ORD_NT']) })" detail>
               <ion-label class="ion-text-wrap">{{ translate("Open BOPIS order notification") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('OPN_BOPIS_ORD_NT') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('OPN_BOPIS_ORD_NT') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item button @click="viewJobConfiguration({ id: 'READYPICK_BOPIS_ORD_NT', status: getJobStatus(jobEnums['READYPICK_BOPIS_ORD_NT']) })" detail>
               <ion-label class="ion-text-wrap">{{ translate("Ready to pick BOPIS order notification") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('READYPICK_BOPIS_ORD_NT') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('READYPICK_BOPIS_ORD_NT') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item button @click="viewJobConfiguration({ id: 'OPEN_SHIPPING_ORD_NT', status: getJobStatus(jobEnums['OPEN_SHIPPING_ORD_NT']) })" detail>
               <ion-label class="ion-text-wrap">{{ translate("Open shipping order notification") }}</ion-label>
-              <ion-label slot="end">{{ getTemporalExpression('OPEN_SHIPPING_ORD_NT') }}</ion-label>
+              <ion-label v-if="!isLoading" slot="end">{{ getTemporalExpression('OPEN_SHIPPING_ORD_NT') }}</ion-label>
+              <ion-skeleton-text v-else style="width: 30%;" animated />
             </ion-item>
             <ion-item lines="none">
               <ion-label class="ion-text-wrap">
@@ -164,7 +167,7 @@ export default defineComponent({
       autoCancelDays: '',
       enumTypeId: 'FULFILLMENT_SYS_JOB',
       initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
-      isLoading: true
+      isLoading: false
     }
   },
   computed: {
@@ -238,6 +241,7 @@ export default defineComponent({
       }
     },
     async fetchJobs(){
+      this.isLoading = true
       await this.store.dispatch("job/fetchJobs", {
         "inputFields": {
           "enumTypeId": "FULFILLMENT_SYS_JOB"
diff --git a/src/views/Inventory.vue b/src/views/Inventory.vue
index cb483991..9185b398 100644
--- a/src/views/Inventory.vue
+++ b/src/views/Inventory.vue
@@ -103,7 +103,7 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'INVENTORY_SYS_JOB',
       webhookEnums: JSON.parse(process.env?.VUE_APP_WEBHOOK_ENUMS as string) as any,
-      isLoading: true
+      isLoading: false
     }
   },
   computed: {
@@ -170,6 +170,7 @@ export default defineComponent({
         translate('Disabled')
     },
     async fetchJobs(){
+      this.isLoading = true
       await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "enumTypeId": "INVENTORY_SYS_JOB"
diff --git a/src/views/Orders.vue b/src/views/Orders.vue
index df06a1aa..bfb01211 100644
--- a/src/views/Orders.vue
+++ b/src/views/Orders.vue
@@ -162,7 +162,7 @@ export default defineComponent({
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'ORDER_SYS_JOB',
       initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
-      isLoading: true
+      isLoading: false
     }
   },
   computed: {
@@ -280,6 +280,7 @@ export default defineComponent({
         translate('Disabled')
     },
     async fetchJobs(){
+      this.isLoading = true;
       this.store.dispatch('webhook/fetchWebhooks')
       await this.store.dispatch("job/fetchJobs", {
         "inputFields": {
diff --git a/src/views/Product.vue b/src/views/Product.vue
index 2e83558a..539eca43 100644
--- a/src/views/Product.vue
+++ b/src/views/Product.vue
@@ -131,7 +131,7 @@ export default defineComponent({
       webhookEnums: JSON.parse(process.env?.VUE_APP_WEBHOOK_ENUMS as string) as any,
       enumTypeId: 'PRODUCT_SYS_JOB',
       initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
-      isLoading: true
+      isLoading: false
     }
   },
   mounted () {
@@ -193,6 +193,7 @@ export default defineComponent({
         translate('Disabled')
     },
     async fetchJobs(){
+      this.isLoading = true
       await this.store.dispatch("job/fetchJobs", {
         "inputFields":{
           "enumTypeId": "PRODUCT_SYS_JOB"

From 700be80ae4134a5cff6e2543834ca39eacb7a0c1 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Mon, 25 Nov 2024 18:04:11 +0530
Subject: [PATCH 18/32] Improved: Replaced the class name and the variable
 tracking the selectedJob (#742)

---
 src/views/Pipeline.vue | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 21b4f6d9..26e563de 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -45,7 +45,7 @@
           </div>
 
           <div v-else>
-            <ion-card v-for="job in pendingJobs" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop" :class="{ 'job-card-elevated': elevateJobCard === job.jobId }">
+            <ion-card v-for="job in pendingJobs" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop" :class="{ 'selected-job': selectedJobId === job.jobId }">
               <ion-card-header>
                 <ion-card-title>{{ job.enumName }}</ion-card-title>
                 <ion-badge v-if="job.runTime" color="dark">{{ timeFromNow(job.runTime)}}</ion-badge>
@@ -180,7 +180,7 @@
           </div>
 
           <div v-else>
-          <ion-card v-for="job in jobHistory" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop" :class="{ 'job-card-elevated': elevateJobCard === job.jobId }">
+          <ion-card v-for="job in jobHistory" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop" :class="{ 'selected-job': selectedJobId === job.jobId }">
             <ion-card-header>
               <div>
                 <ion-card-subtitle class="overline">{{ job.parentJobId }}</ion-card-subtitle>
@@ -361,7 +361,7 @@ export default defineComponent({
       isRetrying: false,
       queryString: '' as any,
       isScrollingEnabled: false,
-      elevateJobCard: '' as any
+      selectedJobId: '' as any
     }
   },
   computed: {
@@ -603,7 +603,7 @@ export default defineComponent({
        return alert.present();
     },
     async viewJobConfiguration(job: any) {
-      this.elevateJobCard = job.jobId
+      this.selectedJobId = job.jobId
       this.currentJobStatus = job.tempExprId
       const id = Object.entries(this.jobEnums).find((enums) => enums[1] == job.systemJobEnumId) as any
       const appFreqType =  id && (Object.entries(this.jobFrequencyType).find((freq) => freq[0] == id[0]) as any)
@@ -687,7 +687,7 @@ export default defineComponent({
 </script>
 
 <style scoped>
-.job-card-elevated {
+.selected-job {
   box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, 0.14), 0px 3px 14px 0px rgba(0, 0, 0, 0.12), 0px 4px 5px 0px rgba(0, 0, 0, 0.20);
   scale: 1.03
 }

From 111eaa5c3aa9acbf9a99c4ce37b306c7abe83d4c Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Tue, 26 Nov 2024 10:28:25 +0530
Subject: [PATCH 19/32] Improved: added margin block on selected job card &
 transition on ion-card(#742)

---
 src/views/Pipeline.vue | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 26e563de..442a43ea 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -689,7 +689,12 @@ export default defineComponent({
 <style scoped>
 .selected-job {
   box-shadow: 0px 8px 10px 0px rgba(0, 0, 0, 0.14), 0px 3px 14px 0px rgba(0, 0, 0, 0.12), 0px 4px 5px 0px rgba(0, 0, 0, 0.20);
-  scale: 1.03
+  scale: 1.03;
+  margin-block: var(--spacer-sm);
+}
+
+ion-card {
+  transition: .5s all ease;
 }
 
 ion-card-header {

From ec1759cf40f229a191dced758c493556458137fd Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Tue, 26 Nov 2024 12:48:14 +0530
Subject: [PATCH 20/32] Improved: updated the failed record icon properties &
 removed unnecessary case in getLogStatusColor function(#680)

---
 src/views/DataManagerLogDetails.vue | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/views/DataManagerLogDetails.vue b/src/views/DataManagerLogDetails.vue
index 802062da..de7fc3b7 100644
--- a/src/views/DataManagerLogDetails.vue
+++ b/src/views/DataManagerLogDetails.vue
@@ -94,8 +94,8 @@
 
           <ion-badge v-if="log.statusId" :color="getLogStatusColor(log.statusId)">{{ translate(getStatusDesc(log.statusId)) }}</ion-badge>
           
-          <div class="ion-text-center" lines="none" v-if="log.errorRecordContentId" button @click="downloadErrorRecordFile(log)">
-            <ion-icon slot="icon-only" color="medium" :icon="cloudDownloadOutline" />
+          <div class="ion-text-center" lines="none" v-if="log.errorRecordContentId">
+            <ion-icon color="medium" :icon="cloudDownloadOutline" @click="downloadErrorRecordFile(log)" />
             <ion-label>
               <p>{{ translate('Failed records') }}</p>
             </ion-label>
@@ -265,8 +265,6 @@ export default defineComponent ({
         return 'dark';
       } else if (statusId === 'SERVICE_FAILED') {
         return 'danger';
-      } else if (statusId === 'SERVICE_PENDING') {
-        return 'medium';
       } else {
         return 'medium';
       }

From 8f1a97ee22813965a5314200050ea50c07552aec Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Tue, 26 Nov 2024 12:58:55 +0530
Subject: [PATCH 21/32] Improved: updated the failed records icon properties &
 wrapped it in ion-button(#680)

---
 src/views/DataManagerLogDetails.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/views/DataManagerLogDetails.vue b/src/views/DataManagerLogDetails.vue
index de7fc3b7..3be5ca21 100644
--- a/src/views/DataManagerLogDetails.vue
+++ b/src/views/DataManagerLogDetails.vue
@@ -95,7 +95,9 @@
           <ion-badge v-if="log.statusId" :color="getLogStatusColor(log.statusId)">{{ translate(getStatusDesc(log.statusId)) }}</ion-badge>
           
           <div class="ion-text-center" lines="none" v-if="log.errorRecordContentId">
-            <ion-icon color="medium" :icon="cloudDownloadOutline" @click="downloadErrorRecordFile(log)" />
+            <ion-button fill="clear" color="medium" @click="downloadErrorRecordFile(log)">
+              <ion-icon slot="icon-only" :icon="cloudDownloadOutline" />
+            </ion-button>
             <ion-label>
               <p>{{ translate('Failed records') }}</p>
             </ion-label>

From b35df664ea71127dad6bd0475cd3e28b4d0a6632 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 26 Nov 2024 15:02:26 +0530
Subject: [PATCH 22/32] Reverted: unwanted spinner on the pages since we have
 added skeleton text (#720)

---
 src/views/Brokering.vue     | 15 ++-------------
 src/views/InitialLoad.vue   | 15 ++-------------
 src/views/Miscellaneous.vue | 15 ++-------------
 src/views/PreOrder.vue      | 15 ++-------------
 src/views/Reports.vue       | 15 ++-------------
 5 files changed, 10 insertions(+), 65 deletions(-)

diff --git a/src/views/Brokering.vue b/src/views/Brokering.vue
index 9e3c293a..3380bda7 100644
--- a/src/views/Brokering.vue
+++ b/src/views/Brokering.vue
@@ -8,13 +8,7 @@
     </ion-header>
 
     <ion-content>
-      <div class="empty-state" v-if="jobsLoading">
-        <ion-item lines="none">
-          <ion-spinner name="crescent" slot="start" />
-          {{ translate("Fetching jobs") }}
-        </ion-item>
-      </div>
-      <main v-else>
+      <main>
         <section>
           <ion-button expand="block" :disabled="!hasPermission(Actions.APP_JOB_UPDATE)" @click="addBatch()">{{ translate('Create new brokering job') }}</ion-button>
 
@@ -89,7 +83,6 @@ import {
   IonMenuButton,
   IonPage,
   IonRow,
-  IonSpinner,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -128,7 +121,6 @@ export default defineComponent({
     IonMenuButton,
     IonPage,
     IonRow,
-    IonSpinner,
     IonTitle,
     IonToggle,
     IonToolbar,
@@ -146,8 +138,7 @@ export default defineComponent({
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'BROKER_SYS_JOB',
-      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any,
-      jobsLoading: false
+      initialLoadJobEnums: JSON.parse(process.env?.VUE_APP_INITIAL_JOB_ENUMS as string) as any
     }
   },
   computed: {
@@ -219,7 +210,6 @@ export default defineComponent({
     },
     async fetchJobs(JobDetailDismissRequired = false) {
       if(JobDetailDismissRequired) {
-        this.jobsLoading = true;
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = "";
@@ -242,7 +232,6 @@ export default defineComponent({
           "systemJobEnumId_op": "in"
         }
       });
-      this.jobsLoading = false;
     },
     timeFromNow(time: any) {
       const timeDiff = DateTime.fromMillis(time).diff(DateTime.local());
diff --git a/src/views/InitialLoad.vue b/src/views/InitialLoad.vue
index 84d3de1e..6d4c39a4 100644
--- a/src/views/InitialLoad.vue
+++ b/src/views/InitialLoad.vue
@@ -8,13 +8,7 @@
     </ion-header>
 
     <ion-content>
-      <div class="empty-state" v-if="jobsLoading">
-        <ion-item lines="none">
-          <ion-spinner name="crescent" slot="start" />
-          {{ translate("Fetching jobs") }}
-        </ion-item>
-      </div>
-      <main v-else>
+      <main>
         <section>
           <ion-card>
             <ion-card-header>
@@ -80,7 +74,6 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
-  IonSpinner,
   IonTitle,
   IonToggle,
   IonToolbar,
@@ -110,7 +103,6 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
-    IonSpinner,
     IonTitle,
     IonToggle,
     IonToolbar
@@ -123,8 +115,7 @@ export default defineComponent({
       job: {} as any,
       lastShopifyOrderId: '',
       isJobDetailAnimationCompleted: false,
-      isDesktop: isPlatform('desktop'),
-      jobsLoading: false
+      isDesktop: isPlatform('desktop')
     }
   },
   mounted() {
@@ -218,7 +209,6 @@ export default defineComponent({
     },
     async fetchJobs(JobDetailDismissRequired = false){
       if(JobDetailDismissRequired) {
-        this.jobsLoading = true;
         this.currentSelectedJobModal = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.job = {};
@@ -232,7 +222,6 @@ export default defineComponent({
         }
       })
       this.store.dispatch('webhook/fetchWebhooks')
-      this.jobsLoading = false;
     },
     async updateWebhook(checked: boolean, enumId: string) {
       const webhook = this.getCachedWebhook[this.webhookEnums[enumId]]
diff --git a/src/views/Miscellaneous.vue b/src/views/Miscellaneous.vue
index 02f44eda..abc0d0f9 100644
--- a/src/views/Miscellaneous.vue
+++ b/src/views/Miscellaneous.vue
@@ -8,13 +8,7 @@
     </ion-header>
 
     <ion-content>
-      <div class="empty-state" v-if="jobsLoading">
-        <ion-item lines="none">
-          <ion-spinner name="crescent" slot="start" />
-          {{ translate("Fetching jobs") }}
-        </ion-item>
-      </div>
-      <main v-else>
+      <main>
         <section>
           <!-- Empty state -->
           <div v-if="miscellaneousJobs?.length === 0">
@@ -65,7 +59,6 @@ import {
   IonMenuButton,
   IonNote,
   IonPage,
-  IonSpinner,
   IonTitle,
   IonToolbar,
   isPlatform,
@@ -93,7 +86,6 @@ export default defineComponent({
     IonMenuButton,
     IonNote,
     IonPage,
-    IonSpinner,
     IonTitle,
     IonToolbar,
     JobConfiguration
@@ -113,8 +105,7 @@ export default defineComponent({
       currentJobStatus: '',
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
-      isRetrying: false,
-      jobsLoading: false
+      isRetrying: false
     }
   },
   computed: {
@@ -161,14 +152,12 @@ export default defineComponent({
     },
     async updateProductStoreConfig(JobDetailDismissRequired = false) {
       if(JobDetailDismissRequired) {
-        this.jobsLoading = true;
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = "";
         this.isJobDetailAnimationCompleted = false;
       }
       this.getMiscellaneousJobs();
-      this.jobsLoading = false;
     },
     async loadMoreMiscellaneousJobs (event: any) {
       this.getMiscellaneousJobs(
diff --git a/src/views/PreOrder.vue b/src/views/PreOrder.vue
index b1adcf3a..cf392728 100644
--- a/src/views/PreOrder.vue
+++ b/src/views/PreOrder.vue
@@ -8,13 +8,7 @@
     </ion-header>
 
     <ion-content>
-      <div class="empty-state" v-if="jobsLoading">
-        <ion-item lines="none">
-          <ion-spinner name="crescent" slot="start" />
-          {{ translate("Fetching jobs") }}
-        </ion-item>
-      </div>
-      <main v-else>
+      <main>
         <section>
           <ion-card>
             <ion-card-header>
@@ -191,7 +185,6 @@ import {
   IonLabel,
   IonMenuButton,
   IonPage,
-  IonSpinner,
   IonTitle,
   IonToolbar,
   isPlatform
@@ -225,7 +218,6 @@ export default defineComponent({
     IonLabel,
     IonMenuButton,
     IonPage,
-    IonSpinner,
     IonTitle,
     IonToolbar,
     JobConfiguration,
@@ -252,8 +244,7 @@ export default defineComponent({
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
       enumTypeId: 'PRE_ORD_SYS_JOB',
-      preOrderBackorderCategory: {} as any,
-      jobsLoading: false
+      preOrderBackorderCategory: {} as any
     }
   },
   methods: {
@@ -374,7 +365,6 @@ export default defineComponent({
     },
     async fetchInitialData(JobDetailDismissRequired = false) {
       if(JobDetailDismissRequired) {
-        this.jobsLoading = true;
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = ""
@@ -383,7 +373,6 @@ export default defineComponent({
       }
       await this.fetchJobs();
       await this.getPreOrderBackorderCategory();
-      this.jobsLoading = false;
     }
   },
   mounted () {
diff --git a/src/views/Reports.vue b/src/views/Reports.vue
index ac6dc03b..33c54381 100644
--- a/src/views/Reports.vue
+++ b/src/views/Reports.vue
@@ -8,13 +8,7 @@
     </ion-header>
 
     <ion-content>
-      <div class="empty-state" v-if="jobsLoading">
-        <ion-item lines="none">
-          <ion-spinner name="crescent" slot="start" />
-          {{ translate("Fetching jobs") }}
-        </ion-item>
-      </div>
-      <main v-else>
+      <main>
         <section>
           <div v-if="!reportsJobs?.length">
             <p class="ion-text-center">{{ translate("There are no reports jobs right now") }}</p>
@@ -63,7 +57,6 @@ import {
   IonMenuButton,
   IonNote,
   IonPage,
-  IonSpinner,
   IonTitle,
   IonToolbar,
   isPlatform,
@@ -91,7 +84,6 @@ export default defineComponent({
     IonMenuButton,
     IonNote,
     IonPage,
-    IonSpinner,
     IonTitle,
     IonToolbar,
     JobConfiguration
@@ -103,8 +95,7 @@ export default defineComponent({
       currentJobStatus: '',
       isJobDetailAnimationCompleted: false,
       isDesktop: isPlatform('desktop'),
-      isRetrying: false,
-      jobsLoading: false
+      isRetrying: false
     }
   },
   computed: {
@@ -149,14 +140,12 @@ export default defineComponent({
     },
     async updateProductStoreConfig(JobDetailDismissRequired = false) {
       if(JobDetailDismissRequired) {
-        this.jobsLoading = true;
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = "";
         this.isJobDetailAnimationCompleted = false;
       }
       await this.getReportsJobs()
-      this.jobsLoading = false;
     },
     async loadMoreReportsJobs(event: any) {
       this.getReportsJobs(

From 3d5326e58bda0c0a29ecdb2f794a8cfdf7755281 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Wed, 27 Nov 2024 14:26:09 +0530
Subject: [PATCH 23/32] Improved: added locale text & changed the component
 name(#726)

---
 package-lock.json                             |  7 +++--
 package.json                                  |  2 +-
 src/components/JobConfiguration.vue           |  8 ++---
 ...{LeareMoreModal.vue => LearnMoreModal.vue} | 30 +++++++++----------
 src/locales/en.json                           |  6 ++--
 src/views/Pipeline.vue                        |  8 ++---
 6 files changed, 32 insertions(+), 29 deletions(-)
 rename src/components/{LeareMoreModal.vue => LearnMoreModal.vue} (86%)

diff --git a/package-lock.json b/package-lock.json
index e6849f12..24a35177 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,7 @@
         "@hotwax/app-version-info": "^1.0.0",
         "@hotwax/apps-theme": "^1.2.6",
         "@hotwax/dxp-components": "1.15.4",
-        "@hotwax/oms-api": "1.14.0",
+        "@hotwax/oms-api": "^1.14.0",
         "@ionic/core": "^7.6.0",
         "@ionic/vue": "^7.6.0",
         "@ionic/vue-router": "^7.6.0",
@@ -2680,8 +2680,9 @@
       }
     },
     "node_modules/@hotwax/oms-api": {
-      "version": "1.14.0",
-      "license": "Apache-2.0",
+      "version": "1.16.0",
+      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.16.0.tgz",
+      "integrity": "sha512-WZ3v0TxcHz5UZEBDX+GvZd/cqD08Kws42kGcseN2tfNf5kKWbfaDgWm6KEaBxLFuVBPBdRelRZhGj/nRIxBgGw==",
       "dependencies": {
         "@types/node-json-transform": "^1.0.0",
         "axios": "^0.21.1",
diff --git a/package.json b/package.json
index 3a814d2c..f0a276d0 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
     "@hotwax/app-version-info": "^1.0.0",
     "@hotwax/apps-theme": "^1.2.6",
     "@hotwax/dxp-components": "1.15.4",
-    "@hotwax/oms-api": "^1.15.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/components/JobConfiguration.vue b/src/components/JobConfiguration.vue
index e7b4186c..1a34c497 100644
--- a/src/components/JobConfiguration.vue
+++ b/src/components/JobConfiguration.vue
@@ -203,7 +203,7 @@ import emitter from '@/event-bus';
 import { Actions, hasPermission } from '@/authorization'
 import CustomFrequencyModal from '@/components/CustomFrequencyModal.vue';
 import JobParameterModal from '@/components/JobParameterModal.vue'
-import LeareMoreModal from "./LeareMoreModal.vue";
+import LearnMoreModal from "./LearnMoreModal.vue";
 
 export default defineComponent({
   name: "JobConfiguration",
@@ -285,11 +285,11 @@ export default defineComponent({
       this.router.push({ name: 'DataManagerLogDetails', params: { jobId } })
     },
     async openLearnMoreModal() {
-      const openLearnMoreModal = await modalController.create({
-        component: LeareMoreModal,
+      const learnMoreModal = await modalController.create({
+        component: LearnMoreModal,
         componentProps: {currentJob: this.currentJob}
       })
-      return openLearnMoreModal.present()
+      return learnMoreModal.present()
     },
     getDateTime(time: any) {
       return DateTime.fromMillis(time).toISO()
diff --git a/src/components/LeareMoreModal.vue b/src/components/LearnMoreModal.vue
similarity index 86%
rename from src/components/LeareMoreModal.vue
rename to src/components/LearnMoreModal.vue
index ec651fb3..7c4ca729 100644
--- a/src/components/LeareMoreModal.vue
+++ b/src/components/LearnMoreModal.vue
@@ -6,18 +6,18 @@
           <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
-      <ion-title>{{ translate('Learn more.') }}</ion-title>
+      <ion-title>{{ translate("Learn more") }}</ion-title>
       <ion-button slot="end" fill="clear" @click="redirectToJobsDoc()">
-        <ion-icon  color="dark" :icon="openOutline" />
+        <ion-icon color="medium" :icon="openOutline" />
       </ion-button>
     </ion-toolbar>
   </ion-header>
 
   <ion-content>
-    <div class="empty-state" v-if="isGenratingAnswer">
+    <div class="empty-state" v-if="isGeneratingAnswer">
       <ion-item lines="none">
         <ion-spinner name="crescent" slot="start" />
-        {{ translate("Genrating answer...") }}
+        {{ translate("Generating answer...") }}
       </ion-item>
     </div>
 
@@ -37,7 +37,7 @@
 
       <ion-list>
         <ion-item lines="none">
-          <ion-label>Sources</ion-label>
+          <ion-label>{{ translate("Sources") }}</ion-label>
         </ion-item>
         <ion-item v-for="section in jobSection" :key="section.id" lines="none">
           <ion-chip outline @click="redirectToDoc(section)">
@@ -49,7 +49,7 @@
   
       <ion-item>
         <ion-label>
-          <p class="overline">Summary</p>
+          <p class="overline">{{ translate("Summary") }}</p>
           {{ askResponse?.text }}
         </ion-label>
       </ion-item>
@@ -64,6 +64,7 @@ import { translate } from '@hotwax/dxp-components';
 import { defineComponent } from "vue";
 import { hasError } from '@/utils'
 import { askQuery, searchQuery } from "@/adapter";
+import logger from "@/logger";
 
 export default defineComponent({
   name: "LearnMoreModal",
@@ -86,10 +87,10 @@ export default defineComponent({
       queryString: '',
       askResponse: {} as any,
       jobSection: {} as any,
-      isGenratingAnswer: true
+      isGeneratingAnswer: true
     }
   },
-  props: ['currentJob'],
+  props: ["currentJob"],
   mounted() {
     this.askQuery();
   },
@@ -112,13 +113,13 @@ export default defineComponent({
               this.jobSection.push(...filteredPage.sections);
             }
           });
-          this.isGenratingAnswer = false;
+          this.isGeneratingAnswer = false;
         } else {
           throw resp.data;
         }
       } catch(error: any) {
-        console.error(error);
-        this.isGenratingAnswer = false;
+        logger.error(error);
+        this.isGeneratingAnswer = false;
       }
     },
     async askQuery() {
@@ -136,14 +137,14 @@ export default defineComponent({
             const pageIds = this.askResponse?.sources.map((source: any) => source.page);
             this.searchQuery(pageIds);
           } else {
-            this.isGenratingAnswer = false;
+            this.isGeneratingAnswer = false;
           }
         } else {
           throw resp.data;
         }
       } catch(error: any) {
-        console.error(error);
-        this.isGenratingAnswer = false;
+        logger.error(error);
+        this.isGeneratingAnswer = false;
       }
     },
     async redirectToDoc(section: any) {
@@ -157,7 +158,6 @@ export default defineComponent({
     }
   },
   setup() {
-
     return {
       closeOutline, 
       openOutline,
diff --git a/src/locales/en.json b/src/locales/en.json
index 5ac5adcb..77ac189d 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -104,7 +104,7 @@
   "Fulfilled": "Fulfilled",
   "Fulfillment": "Fulfillment",
   "Fulfillment status": "Fulfillment status",
-  "Genrating answer...": "Genrating answer...",
+  "Generating answer...": "Generating answer...",
   "Get Paid Transactions": "Get Paid Transactions",
   "Go to OMS": "Go to OMS",
   "Go to Launchpad": "Go to Launchpad",
@@ -136,7 +136,7 @@
   "Landed inventory cost": "Landed inventory cost",
   "Last run": "Last run",
   "Last Shopify Order ID": "Last Shopify Order ID",
-  "Learn more.": "Learn more.",
+  "Learn more": "Learn more",
   "Loading": "Loading",
   "Login": "Login",
   "Log Id": "Log Id",
@@ -270,6 +270,7 @@
   "Skip job": "Skip job",
   "Skip once": "Skip once",
   "Skipping will run this job at the next occurrence based on the temporal expression.": "Skipping will run this job at the next occurrence based on the temporal expression.",
+  "Sources": "Sources",
   "Some jobs have slow frequency type, hence, feasible frequency will be set automatically": "Some jobs have slow frequency type, hence, feasible frequency will be set automatically",
   "Something went wrong": "Something went wrong",
   "Something went wrong while getting complete user permissions.": "Something went wrong while getting complete user permissions.",
@@ -283,6 +284,7 @@
   "store name": "store name",
   "Stores": "Stores",
   "stores selected": "stores selected",
+  "Summary": "Summary",
   "Sync": "Sync",
   "Sync pre-selling related information to Shopify as tags and meta fields.": "Sync pre-selling related information to Shopify as tags and meta fields.",
   "Sync products": "Sync products",
diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index ae49334f..d71414af 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -316,7 +316,7 @@ import { Actions, hasPermission } from '@/authorization'
 import Filters from '@/components/Filters.vue';
 import FailedJobReasonModal from '@/views/FailedJobReasonModal.vue'
 import { translate } from '@hotwax/dxp-components';
-import LeareMoreModal from '@/components/LeareMoreModal.vue';
+import LearnMoreModal from '@/components/LearnMoreModal.vue';
 
 export default defineComponent({
   name: "Pipeline",
@@ -399,11 +399,11 @@ export default defineComponent({
   },
   methods : {
     async openLearnMoreModal(job: any) {
-      const openLearnMoreModal = await modalController.create({
-        component: LeareMoreModal,
+      const learnMoreModal = await modalController.create({
+        component: LearnMoreModal,
         componentProps: {currentJob: job}
       })
-      return openLearnMoreModal.present()
+      return learnMoreModal.present()
     },
     isPinnedJobSelected(jobEnumId: any) {
       return (this as any).pipelineFilters.enum.some((jobId: any) =>  jobId === jobEnumId );

From 4887cfb1127204a0bb66bcb193352477addfaa2b Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Wed, 27 Nov 2024 14:53:30 +0530
Subject: [PATCH 24/32] Improved: update empty-state check, arrange ionic
 component imports & wrapped ion-button into ion-buttons(#726)

---
 src/components/JobConfiguration.vue |  2 +-
 src/components/LearnMoreModal.vue   | 14 ++++++++------
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/components/JobConfiguration.vue b/src/components/JobConfiguration.vue
index 1a34c497..f3bb54ce 100644
--- a/src/components/JobConfiguration.vue
+++ b/src/components/JobConfiguration.vue
@@ -203,7 +203,7 @@ import emitter from '@/event-bus';
 import { Actions, hasPermission } from '@/authorization'
 import CustomFrequencyModal from '@/components/CustomFrequencyModal.vue';
 import JobParameterModal from '@/components/JobParameterModal.vue'
-import LearnMoreModal from "./LearnMoreModal.vue";
+import LearnMoreModal from "@/components/LearnMoreModal.vue";
 
 export default defineComponent({
   name: "JobConfiguration",
diff --git a/src/components/LearnMoreModal.vue b/src/components/LearnMoreModal.vue
index 7c4ca729..87eb1f63 100644
--- a/src/components/LearnMoreModal.vue
+++ b/src/components/LearnMoreModal.vue
@@ -7,9 +7,11 @@
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Learn more") }}</ion-title>
-      <ion-button slot="end" fill="clear" @click="redirectToJobsDoc()">
-        <ion-icon color="medium" :icon="openOutline" />
-      </ion-button>
+      <ion-buttons slot="end">
+        <ion-button fill="clear" @click="redirectToJobsDoc()">
+          <ion-icon color="medium" :icon="openOutline" />
+        </ion-button>
+      </ion-buttons>
     </ion-toolbar>
   </ion-header>
 
@@ -21,14 +23,14 @@
       </ion-item>
     </div>
 
-    <div class="empty-state" v-else-if="!askResponse">
+    <div class="empty-state" v-else-if="!Object.keys(askResponse).length">
       <ion-item lines="none">
         <p>{{ translate("The job details is not generating, please try again later.") }}</p>
       </ion-item>
     </div>
     
     <div v-else>
-      <ion-item class="ion-margin-top">
+      <ion-item lines="full" class="ion-margin-top">
         <ion-label>
           {{ queryString }}
           <p>{{  currentJob?.systemJobEnumId }}</p>  
@@ -77,8 +79,8 @@ export default defineComponent({
     IonIcon,
     IonItem,
     IonLabel,
-    IonSpinner,
     IonList,
+    IonSpinner,
     IonTitle,
     IonToolbar
   },

From 2872cc475b1fc9c57ccee9a01ef2683e2e5bc5b6 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Wed, 27 Nov 2024 15:05:45 +0530
Subject: [PATCH 25/32] Improved: added locale text, added slot property on
 ion-icon & color to ion-button(#726)

---
 src/components/JobConfiguration.vue | 2 +-
 src/components/LearnMoreModal.vue   | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/JobConfiguration.vue b/src/components/JobConfiguration.vue
index f3bb54ce..177e57f1 100644
--- a/src/components/JobConfiguration.vue
+++ b/src/components/JobConfiguration.vue
@@ -15,7 +15,7 @@
       <ion-item v-if="currentJob.description" lines="none">
         <ion-label class="ion-text-wrap">
           <p>{{ currentJob.description }}
-            <ion-text class="learn-more-text" color="primary" @click="openLearnMoreModal()">Learn more</ion-text>
+            <ion-text class="learn-more-text" color="primary" @click="openLearnMoreModal()">{{ translate("Learn more") }}</ion-text>
           </p>
         </ion-label>
       </ion-item>
diff --git a/src/components/LearnMoreModal.vue b/src/components/LearnMoreModal.vue
index 87eb1f63..fbb23789 100644
--- a/src/components/LearnMoreModal.vue
+++ b/src/components/LearnMoreModal.vue
@@ -8,8 +8,8 @@
       </ion-buttons>
       <ion-title>{{ translate("Learn more") }}</ion-title>
       <ion-buttons slot="end">
-        <ion-button fill="clear" @click="redirectToJobsDoc()">
-          <ion-icon color="medium" :icon="openOutline" />
+        <ion-button fill="clear" color="medium" @click="redirectToJobsDoc()">
+          <ion-icon slot="icon-only" :icon="openOutline" />
         </ion-button>
       </ion-buttons>
     </ion-toolbar>
@@ -33,7 +33,7 @@
       <ion-item lines="full" class="ion-margin-top">
         <ion-label>
           {{ queryString }}
-          <p>{{  currentJob?.systemJobEnumId }}</p>  
+          <p>{{ currentJob?.systemJobEnumId }}</p>  
         </ion-label>
       </ion-item>
 

From 1fc69f080ce423e8faafc40e884d84cc7c8245a9 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Wed, 27 Nov 2024 15:54:55 +0530
Subject: [PATCH 26/32] Improved: passed the  "noopener, noreferrer" in
 windows.open function(#726)

---
 src/components/LearnMoreModal.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/LearnMoreModal.vue b/src/components/LearnMoreModal.vue
index fbb23789..52ae7d7f 100644
--- a/src/components/LearnMoreModal.vue
+++ b/src/components/LearnMoreModal.vue
@@ -150,10 +150,10 @@ export default defineComponent({
       }
     },
     async redirectToDoc(section: any) {
-      window.open(`https://docs.hotwax.co/documents/retail-operations/${section.path}`, "_blank")
+      window.open(`https://docs.hotwax.co/documents/retail-operations/${section.path}`, "_blank", "noopener, noreferrer")
     },
     async redirectToJobsDoc() {
-      window.open(`${process.env.VUE_APP_GITBOOK_JOBS_DOCS_URL}`, "_blank")
+      window.open(`${process.env.VUE_APP_GITBOOK_JOBS_DOCS_URL}`, "_blank", "noopener, noreferrer")
     },
     async closeModal() {
       modalController.dismiss({ dismissed: true });

From f5e624f9fe8e761f288a528b7260fe63784b6d03 Mon Sep 17 00:00:00 2001
From: Aditya Patel <aditya.patel@hotwax.co>
Date: Thu, 28 Nov 2024 11:39:09 +0530
Subject: [PATCH 27/32] Use ion-row instead of ion item for chips

@R-Sourabh  let me know if this breaks anything
---
 src/components/LearnMoreModal.vue | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/LearnMoreModal.vue b/src/components/LearnMoreModal.vue
index 52ae7d7f..4f02448f 100644
--- a/src/components/LearnMoreModal.vue
+++ b/src/components/LearnMoreModal.vue
@@ -41,12 +41,12 @@
         <ion-item lines="none">
           <ion-label>{{ translate("Sources") }}</ion-label>
         </ion-item>
-        <ion-item v-for="section in jobSection" :key="section.id" lines="none">
+        <ion-row class="ion-padding" v-for="section in jobSection" :key="section.id" lines="none">
           <ion-chip outline @click="redirectToDoc(section)">
             <ion-label>{{ section.title }}</ion-label>
             <ion-icon :icon="openOutline" />
           </ion-chip>
-        </ion-item>
+        </ion-row>
       </ion-list>
   
       <ion-item>
@@ -60,7 +60,7 @@
 </template>
 
 <script lang="ts">
-import { IonButton, IonButtons, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSpinner, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { IonButton, IonButtons, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList,, IonRow, IonSpinner, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, openOutline } from 'ionicons/icons'
 import { translate } from '@hotwax/dxp-components';
 import { defineComponent } from "vue";
@@ -80,6 +80,7 @@ export default defineComponent({
     IonItem,
     IonLabel,
     IonList,
+    IonRow,
     IonSpinner,
     IonTitle,
     IonToolbar
@@ -167,4 +168,4 @@ export default defineComponent({
     };
   }
 })
-</script>
\ No newline at end of file
+</script>

From 339d73c0e4d7792b79cb108008977cb6aee9f5c4 Mon Sep 17 00:00:00 2001
From: Aditya Patel <aditya.patel@hotwax.co>
Date: Thu, 28 Nov 2024 11:43:58 +0530
Subject: [PATCH 28/32] Remove extra comma

---
 src/components/LearnMoreModal.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/LearnMoreModal.vue b/src/components/LearnMoreModal.vue
index 4f02448f..ccab5271 100644
--- a/src/components/LearnMoreModal.vue
+++ b/src/components/LearnMoreModal.vue
@@ -60,7 +60,7 @@
 </template>
 
 <script lang="ts">
-import { IonButton, IonButtons, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList,, IonRow, IonSpinner, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { IonButton, IonButtons, IonChip, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonRow, IonSpinner, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, openOutline } from 'ionicons/icons'
 import { translate } from '@hotwax/dxp-components';
 import { defineComponent } from "vue";

From 3390190c9442a58f0cdb69dd8556417aa3745c33 Mon Sep 17 00:00:00 2001
From: Aditya Patel <aditya.patel@hotwax.co>
Date: Thu, 28 Nov 2024 14:34:04 +0530
Subject: [PATCH 29/32] Remove extra lines property from row

---
 src/components/LearnMoreModal.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/LearnMoreModal.vue b/src/components/LearnMoreModal.vue
index ccab5271..877389e5 100644
--- a/src/components/LearnMoreModal.vue
+++ b/src/components/LearnMoreModal.vue
@@ -41,7 +41,7 @@
         <ion-item lines="none">
           <ion-label>{{ translate("Sources") }}</ion-label>
         </ion-item>
-        <ion-row class="ion-padding" v-for="section in jobSection" :key="section.id" lines="none">
+        <ion-row class="ion-padding" v-for="section in jobSection" :key="section.id">
           <ion-chip outline @click="redirectToDoc(section)">
             <ion-label>{{ section.title }}</ion-label>
             <ion-icon :icon="openOutline" />

From 5f0a9388b2314d13ea8a2eadd42a54e92744cccd Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Thu, 28 Nov 2024 15:43:05 +0530
Subject: [PATCH 30/32] Reverted: removed the caret sign from oms-api in
 package.json file(#726)

---
 package-lock.json | 8 ++++----
 package.json      | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 24a35177..b89ba5f1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,7 @@
         "@hotwax/app-version-info": "^1.0.0",
         "@hotwax/apps-theme": "^1.2.6",
         "@hotwax/dxp-components": "1.15.4",
-        "@hotwax/oms-api": "^1.14.0",
+        "@hotwax/oms-api": "1.14.0",
         "@ionic/core": "^7.6.0",
         "@ionic/vue": "^7.6.0",
         "@ionic/vue-router": "^7.6.0",
@@ -2680,9 +2680,9 @@
       }
     },
     "node_modules/@hotwax/oms-api": {
-      "version": "1.16.0",
-      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.16.0.tgz",
-      "integrity": "sha512-WZ3v0TxcHz5UZEBDX+GvZd/cqD08Kws42kGcseN2tfNf5kKWbfaDgWm6KEaBxLFuVBPBdRelRZhGj/nRIxBgGw==",
+      "version": "1.14.0",
+      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.14.0.tgz",
+      "integrity": "sha512-dYkrFEi0oJHKiJ/VctKmyIY4WTVV2lmljm1EflgQ/LM7BTJ9jVEeT1zgYJ5vO906kW7SWM4pl7mZI3dDCt1YCQ==",
       "dependencies": {
         "@types/node-json-transform": "^1.0.0",
         "axios": "^0.21.1",
diff --git a/package.json b/package.json
index f0a276d0..4b58abf3 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
     "@hotwax/app-version-info": "^1.0.0",
     "@hotwax/apps-theme": "^1.2.6",
     "@hotwax/dxp-components": "1.15.4",
-    "@hotwax/oms-api": "^1.14.0",
+    "@hotwax/oms-api": "1.14.0",
     "@ionic/core": "^7.6.0",
     "@ionic/vue": "^7.6.0",
     "@ionic/vue-router": "^7.6.0",

From 8e660abc908b210520254284572eb2cb8b33ba68 Mon Sep 17 00:00:00 2001
From: R-Sourabh <rsourabh002@gmail.com>
Date: Thu, 28 Nov 2024 16:21:16 +0530
Subject: [PATCH 31/32] Improved: updated the oms-api version & passed token in
 getShopifyConfig service using client method(#726)

---
 package-lock.json                 | 8 ++++----
 package.json                      | 2 +-
 src/store/modules/user/actions.ts | 4 ++--
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index b89ba5f1..af464c11 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,7 +15,7 @@
         "@hotwax/app-version-info": "^1.0.0",
         "@hotwax/apps-theme": "^1.2.6",
         "@hotwax/dxp-components": "1.15.4",
-        "@hotwax/oms-api": "1.14.0",
+        "@hotwax/oms-api": "1.15.0",
         "@ionic/core": "^7.6.0",
         "@ionic/vue": "^7.6.0",
         "@ionic/vue-router": "^7.6.0",
@@ -2680,9 +2680,9 @@
       }
     },
     "node_modules/@hotwax/oms-api": {
-      "version": "1.14.0",
-      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.14.0.tgz",
-      "integrity": "sha512-dYkrFEi0oJHKiJ/VctKmyIY4WTVV2lmljm1EflgQ/LM7BTJ9jVEeT1zgYJ5vO906kW7SWM4pl7mZI3dDCt1YCQ==",
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.15.0.tgz",
+      "integrity": "sha512-6WXJ5z5JaAxgKith6dblLchP471xUYcFaeggN5onWZBkgGx5NqkLT0rgLWTW/UcVQMokxKtzSc+mcJ4eI1mGww==",
       "dependencies": {
         "@types/node-json-transform": "^1.0.0",
         "axios": "^0.21.1",
diff --git a/package.json b/package.json
index 4b58abf3..6df3d9f4 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
     "@hotwax/app-version-info": "^1.0.0",
     "@hotwax/apps-theme": "^1.2.6",
     "@hotwax/dxp-components": "1.15.4",
-    "@hotwax/oms-api": "1.14.0",
+    "@hotwax/oms-api": "1.15.0",
     "@ionic/core": "^7.6.0",
     "@ionic/vue": "^7.6.0",
     "@ionic/vue-router": "^7.6.0",
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 60051585..3fa8beb7 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -184,7 +184,7 @@ const actions: ActionTree<UserState, RootState> = {
     commit(types.USER_PWA_STATE_UPDATED, payload);
   },
 
-  async getShopifyConfig({ commit }, productStoreId) {
+  async getShopifyConfig({ commit, state }, productStoreId) {
     if (!productStoreId) {
       commit(types.USER_SHOPIFY_CONFIGS_UPDATED, []);
       commit(types.USER_CURRENT_SHOPIFY_CONFIG_UPDATED, {});
@@ -192,7 +192,7 @@ const actions: ActionTree<UserState, RootState> = {
     }
 
     try {      
-      const shopifyConfigs =  await UserService.getShopifyConfig(productStoreId);
+      const shopifyConfigs =  await UserService.getShopifyConfig(productStoreId, state?.token);
         // TODO store and get preferred config
       let currentShopifyConfig =  {};
       shopifyConfigs.length > 0 && (currentShopifyConfig = shopifyConfigs[0])

From 1ebfa471d7c71d3b34ed4145707779e3ffe3e4a0 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 29 Nov 2024 11:04:06 +0530
Subject: [PATCH 32/32] Improved: updated the variable name for clearing
 current job for better understanding (#720)

---
 src/views/Brokering.vue     | 4 ++--
 src/views/Fulfillment.vue   | 4 ++--
 src/views/InitialLoad.vue   | 4 ++--
 src/views/Inventory.vue     | 4 ++--
 src/views/Miscellaneous.vue | 4 ++--
 src/views/Orders.vue        | 4 ++--
 src/views/Pipeline.vue      | 4 ++--
 src/views/PreOrder.vue      | 4 ++--
 src/views/Product.vue       | 4 ++--
 src/views/Reports.vue       | 4 ++--
 10 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/src/views/Brokering.vue b/src/views/Brokering.vue
index 3380bda7..2b92075d 100644
--- a/src/views/Brokering.vue
+++ b/src/views/Brokering.vue
@@ -208,8 +208,8 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    async fetchJobs(JobDetailDismissRequired = false) {
-      if(JobDetailDismissRequired) {
+    async fetchJobs(isCurrentJobUpdateRequired = false) {
+      if(isCurrentJobUpdateRequired) {
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = "";
diff --git a/src/views/Fulfillment.vue b/src/views/Fulfillment.vue
index 03fdfe99..2e8a3c11 100644
--- a/src/views/Fulfillment.vue
+++ b/src/views/Fulfillment.vue
@@ -240,9 +240,9 @@ export default defineComponent({
         this.store.dispatch('job/updateJob', job)
       }
     },
-    async fetchJobs(JobDetailDismissRequired = false){
+    async fetchJobs(isCurrentJobUpdateRequired = false){
       this.isLoading = true;
-      if(JobDetailDismissRequired) {
+      if(isCurrentJobUpdateRequired) {
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = "";
diff --git a/src/views/InitialLoad.vue b/src/views/InitialLoad.vue
index 6d4c39a4..54bd72cc 100644
--- a/src/views/InitialLoad.vue
+++ b/src/views/InitialLoad.vue
@@ -207,8 +207,8 @@ export default defineComponent({
         this.isJobDetailAnimationCompleted = true;
       }
     },
-    async fetchJobs(JobDetailDismissRequired = false){
-      if(JobDetailDismissRequired) {
+    async fetchJobs(isCurrentJobUpdateRequired = false){
+      if(isCurrentJobUpdateRequired) {
         this.currentSelectedJobModal = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.job = {};
diff --git a/src/views/Inventory.vue b/src/views/Inventory.vue
index 7b2900fe..d7672409 100644
--- a/src/views/Inventory.vue
+++ b/src/views/Inventory.vue
@@ -178,8 +178,8 @@ export default defineComponent({
       });
       this.isLoading = false
     },
-    async fetchData(JobDetailDismissRequired = false) {
-      if(JobDetailDismissRequired) {
+    async fetchData(isCurrentJobUpdateRequired = false) {
+      if(isCurrentJobUpdateRequired) {
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = "";
diff --git a/src/views/Miscellaneous.vue b/src/views/Miscellaneous.vue
index abc0d0f9..447ff4c1 100644
--- a/src/views/Miscellaneous.vue
+++ b/src/views/Miscellaneous.vue
@@ -150,8 +150,8 @@ export default defineComponent({
     async getMiscellaneousJobs(viewSize = 100, viewIndex = 0) {
       await this.store.dispatch('job/fetchMiscellaneousJobs', {eComStoreId: this.getCurrentEComStore.productStoreId, viewSize, viewIndex});
     },
-    async updateProductStoreConfig(JobDetailDismissRequired = false) {
-      if(JobDetailDismissRequired) {
+    async updateProductStoreConfig(isCurrentJobUpdateRequired = false) {
+      if(isCurrentJobUpdateRequired) {
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = "";
diff --git a/src/views/Orders.vue b/src/views/Orders.vue
index ea47df05..38bbfca1 100644
--- a/src/views/Orders.vue
+++ b/src/views/Orders.vue
@@ -279,9 +279,9 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    async fetchJobs(JobDetailDismissRequired = false){
+    async fetchJobs(isCurrentJobUpdateRequired = false){
       this.isLoading = true;
-      if(JobDetailDismissRequired) {
+      if(isCurrentJobUpdateRequired) {
         this.currentJob = ""
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = ""
diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index 3f70b9c4..b1fdfe5c 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -647,8 +647,8 @@ export default defineComponent({
         this.getPendingJobs();
       }
     },
-    async updateProductStoreConfig(JobDetailDismissRequired = false) {
-      if(JobDetailDismissRequired) {
+    async updateProductStoreConfig(isCurrentJobUpdateRequired = false) {
+      if(isCurrentJobUpdateRequired) {
         this.jobsLoading = true;
         await this.store.dispatch('job/updateCurrentJob', { job: {} });
         this.currentJobStatus = ""
diff --git a/src/views/PreOrder.vue b/src/views/PreOrder.vue
index cf392728..7a13c4e6 100644
--- a/src/views/PreOrder.vue
+++ b/src/views/PreOrder.vue
@@ -363,8 +363,8 @@ export default defineComponent({
         }
       });
     },
-    async fetchInitialData(JobDetailDismissRequired = false) {
-      if(JobDetailDismissRequired) {
+    async fetchInitialData(isCurrentJobUpdateRequired = false) {
+      if(isCurrentJobUpdateRequired) {
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = ""
diff --git a/src/views/Product.vue b/src/views/Product.vue
index e8b356c6..b4082df4 100644
--- a/src/views/Product.vue
+++ b/src/views/Product.vue
@@ -192,9 +192,9 @@ export default defineComponent({
         this.getTemporalExpr(this.getJobStatus(this.jobEnums[enumId]))?.description :
         translate('Disabled')
     },
-    async fetchJobs(JobDetailDismissRequired = false){
+    async fetchJobs(isCurrentJobUpdateRequired = false){
       this.isLoading = true;
-      if(JobDetailDismissRequired) {
+      if(isCurrentJobUpdateRequired) {
         this.currentJob = ""
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = ""
diff --git a/src/views/Reports.vue b/src/views/Reports.vue
index 33c54381..71a6d243 100644
--- a/src/views/Reports.vue
+++ b/src/views/Reports.vue
@@ -138,8 +138,8 @@ export default defineComponent({
     async getReportsJobs(viewSize = 200, viewIndex = 0) {
       await this.store.dispatch('job/fetchReportsJobs', { eComStoreId: this.getCurrentEComStore.productStoreId, viewSize, viewIndex });
     },
-    async updateProductStoreConfig(JobDetailDismissRequired = false) {
-      if(JobDetailDismissRequired) {
+    async updateProductStoreConfig(isCurrentJobUpdateRequired = false) {
+      if(isCurrentJobUpdateRequired) {
         this.currentJob = "";
         await this.store.dispatch('job/updateCurrentJob', { });
         this.currentJobStatus = "";