Reverted: unwanted spinner on the pages since we have added skeleton …

…text (#720)

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());

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]]

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(

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 () {

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(