From d6ace15757ad2192862c1b7857baeafc9f46d00e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 5 Mar 2024 18:30:30 +0530
Subject: [PATCH 001/250] Implemented: side menu navigation, added new pages,
 rule item card (#238)

---
 src/App.vue                     |  16 +++--
 src/components/Menu.vue         |  55 +++++++++++++-
 src/components/RuleItem.vue     | 123 ++++++++++++++++++++++++++++++++
 src/router/index.ts             |  50 +++++++++++++
 src/views/InventoryChannels.vue |  59 +++++++++++++++
 src/views/SafetyStock.vue       |  59 +++++++++++++++
 src/views/SelectProduct.vue     |  26 +++++--
 src/views/Shipping.vue          |  59 +++++++++++++++
 src/views/StorePickup.vue       |  59 +++++++++++++++
 src/views/Threshold.vue         | 109 ++++++++++++++++++++++++++++
 10 files changed, 603 insertions(+), 12 deletions(-)
 create mode 100644 src/components/RuleItem.vue
 create mode 100644 src/views/InventoryChannels.vue
 create mode 100644 src/views/SafetyStock.vue
 create mode 100644 src/views/Shipping.vue
 create mode 100644 src/views/StorePickup.vue
 create mode 100644 src/views/Threshold.vue

diff --git a/src/App.vue b/src/App.vue
index a7e43f2f..02439fd8 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,12 +1,14 @@
 <template>
   <ion-app>
-    <Menu />
-    <ion-router-outlet id="main" />
+    <IonSplitPane content-id="main" when="lg">
+      <Menu />
+      <ion-router-outlet id="main"></ion-router-outlet>
+    </IonSplitPane>
   </ion-app>
 </template>
 
 <script lang="ts">
-import { IonApp, IonRouterOutlet } from '@ionic/vue';
+import { IonApp, IonRouterOutlet, IonSplitPane } from '@ionic/vue';
 import { defineComponent } from 'vue';
 import { loadingController } from '@ionic/vue';
 import { options, settings, pulseOutline } from 'ionicons/icons';
@@ -22,7 +24,8 @@ export default defineComponent({
   components: {
     Menu,
     IonApp,
-    IonRouterOutlet
+    IonRouterOutlet,
+    IonSplitPane
   },
   data() {
     return {
@@ -124,3 +127,8 @@ export default defineComponent({
   }
 });
 </script>
+<style>
+  ion-split-pane {
+    --side-width: 304px;
+  }
+</style>
diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 7390808d..17dd7fab 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -1,8 +1,8 @@
 <template>
-  <ion-menu side="start" menu-id="first" content-id="main" type="overlay" :disabled="!isUserAuthenticated">
+  <ion-menu content-id="main" type="overlay" :disabled="!isUserAuthenticated">
     <ion-header>
       <ion-toolbar>
-        <ion-title>{{ $t("Menu") }}</ion-title>
+        <ion-title>{{ $t("Available to Promise") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     <ion-content>
@@ -65,7 +65,7 @@
   import { useStore } from "@/store";
   import { hasPermission } from "@/authorization";
   import { useRouter } from "vue-router";
-  import { optionsOutline, settingsOutline, pulseOutline } from 'ionicons/icons';
+  import { cloudUploadOutline, globeOutline, optionsOutline, settingsOutline, sendOutline, storefrontOutline, pulseOutline } from 'ionicons/icons';
   import emitter from "@/event-bus";
   
   export default defineComponent({
@@ -128,6 +128,51 @@
             permissionId: "APP_THRESHOLD_UPDATES_VIEW"
           }
         },
+        {
+          title: "Threshold",
+          url: "/threshold",
+          iosIcon: globeOutline,
+          mdIcon: globeOutline,
+          meta: {
+            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
+          }
+        },
+        {
+          title: "Safety stock",
+          url: "/safety-stock",
+          iosIcon: pulseOutline,
+          mdIcon: pulseOutline,
+          meta: {
+            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
+          }
+        },
+        {
+          title: "Store pickup",
+          url: "/store pickup",
+          iosIcon: storefrontOutline,
+          mdIcon: storefrontOutline,
+          meta: {
+            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
+          }
+        },
+        {
+          title: "Shipping",
+          url: "/shipping",
+          iosIcon: sendOutline,
+          mdIcon: sendOutline,
+          meta: {
+            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
+          }
+        },
+        {
+          title: "Inventory channels",
+          url: "/inventory-channels",
+          iosIcon: cloudUploadOutline,
+          mdIcon: cloudUploadOutline,
+          meta: {
+            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
+          }
+        },
         {
           title: "Settings",
           url: "/settings",
@@ -143,12 +188,16 @@
 
       return {
         appPages,
+        cloudUploadOutline,
         hasPermission,
         router,
+        globeOutline,
         pulseOutline,
         optionsOutline,
         settingsOutline,
         selectedIndex,
+        sendOutline,
+        storefrontOutline,
         store,
       };
     },
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
new file mode 100644
index 00000000..113e8ee1
--- /dev/null
+++ b/src/components/RuleItem.vue
@@ -0,0 +1,123 @@
+<template>
+  <ion-card>
+    <ion-card-header>
+      <div>
+        <ion-card-subtitle class="overline">{{ "Rule ID" }}</ion-card-subtitle>
+        <ion-card-title>{{ "Rule name" }}</ion-card-title>
+        <ion-card-subtitle>{{ "1/4" }}</ion-card-subtitle>
+      </div>
+      <div>
+        <ion-button fill="clear" color="medium">
+          <ion-icon :icon="chevronUpOutline" slot="icon-only" />
+        </ion-button>
+        <ion-button fill="clear" color="medium">
+          <ion-icon :icon="chevronDownOutline" slot="icon-only" />
+        </ion-button>
+      </div>
+    </ion-card-header>
+    <ion-item lines="full">
+      <ion-icon slot="start" :icon="globeOutline"/>
+      <ion-label class="ion-text-wrap">{{ "Threshold" }}</ion-label>
+      <ion-chip slot="end" outline>5</ion-chip>
+    </ion-item>
+    <ion-list>
+      <ion-item-divider color="light">
+        <ion-label>
+          {{ "Facility groups" }}
+        </ion-label>
+      </ion-item-divider>
+      <ion-item>
+        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+      </ion-item>
+      <ion-item lines="none">
+        <ion-icon slot="start" :icon="closeCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+      </ion-item>
+      <ion-item-divider color="light">
+        <ion-label>
+          {{ "Product tags" }}
+        </ion-label>
+      </ion-item-divider>
+      <ion-item>
+        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+      </ion-item>
+      <ion-item lines="none">
+        <ion-icon slot="start" :icon="closeCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+      </ion-item>
+      <ion-item-divider color="light">
+        <ion-label>
+          {{ "Product features" }}
+        </ion-label>
+      </ion-item-divider>
+      <ion-item>
+        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+      </ion-item>
+      <ion-item lines="full">
+        <ion-icon slot="start" :icon="closeCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+        </ion-item>
+        <ion-item lines="none">
+          <ion-button fill="clear">{{ "Run now" }}</ion-button>
+          <ion-button fill="clear" slot="end">
+          <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
+        </ion-button>
+      </ion-item>
+    </ion-list>
+  </ion-card>
+</template>
+
+<script lang="ts">
+import {
+  IonContent,
+  IonHeader,
+  IonPage,
+  IonSegment,
+  IonSegmentButton,
+  IonTitle,
+  IonToolbar
+} from '@ionic/vue';
+import { defineComponent } from 'vue';
+import { checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, ellipsisVerticalOutline, globeOutline } from 'ionicons/icons';
+import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+import { Actions, hasPermission } from '@/authorization'
+
+export default defineComponent({
+  name: 'RuleItem',
+  components: {
+  },
+  setup() {
+    const router = useRouter();
+    const store = useStore();
+
+    return {
+      Actions,
+      checkmarkDoneCircleOutline,
+      chevronDownOutline,
+      chevronUpOutline,
+      closeCircleOutline,
+      ellipsisVerticalOutline,
+      globeOutline,
+      hasPermission,
+      router,
+      store,
+    };
+  },
+});
+</script>
+
+<style scoped>
+ion-card {
+  min-width: 375px;
+}
+ion-card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-bottom: 0px;
+}
+</style>
\ No newline at end of file
diff --git a/src/router/index.ts b/src/router/index.ts
index 6b8910cc..ea017a04 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -8,6 +8,11 @@ import ThresholdUpdates from '@/views/ThresholdUpdates.vue'
 import Settings from "@/views/Settings.vue"
 import store from '@/store'
 import ScheduleThreshold from '@/views/ScheduleThreshold.vue'
+import Threshold from '@/views/Threshold.vue'
+import SafetyStock from '@/views/SafetyStock.vue'
+import StorePickup from '@/views/StorePickup.vue'
+import Shipping from '@/views/Shipping.vue'
+import InventoryChannels from '@/views/InventoryChannels.vue'
 
 import { hasPermission } from '@/authorization';
 import { showToast } from '@/utils'
@@ -58,6 +63,51 @@ const routes: Array<RouteRecordRaw> = [
       permissionId: "APP_SELECT_PRODUCT_VIEW"
     }
   },    
+  {
+    path: '/threshold',
+    name: 'Threshold',
+    component: Threshold,
+    beforeEnter: authGuard,
+    meta: {
+      permissionId: "APP_SELECT_PRODUCT_VIEW"
+    }
+  },    
+  {
+    path: '/safety-stock',
+    name: 'Safety stock',
+    component: SafetyStock,
+    beforeEnter: authGuard,
+    meta: {
+      permissionId: "APP_SELECT_PRODUCT_VIEW"
+    }
+  },  
+  {
+    path: '/store-pickup',
+    name: 'Store pickup',
+    component: StorePickup,
+    beforeEnter: authGuard,
+    meta: {
+      permissionId: "APP_SELECT_PRODUCT_VIEW"
+    }
+  },  
+  {
+    path: '/shipping',
+    name: 'Shipping',
+    component: Shipping,
+    beforeEnter: authGuard,
+    meta: {
+      permissionId: "APP_SELECT_PRODUCT_VIEW"
+    }
+  },  
+  {
+    path: '/inventory-channels',
+    name: 'Inventory channels',
+    component: InventoryChannels,
+    beforeEnter: authGuard,
+    meta: {
+      permissionId: "APP_SELECT_PRODUCT_VIEW"
+    }
+  },  
   {
     path: '/select-product-csv-upload',
     name: 'SelectProductCSVUpload',
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
new file mode 100644
index 00000000..fc5e07bc
--- /dev/null
+++ b/src/views/InventoryChannels.vue
@@ -0,0 +1,59 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-title>{{ $t("Inventory channels") }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
+
+    <ion-content>
+      <h1>This is inventory channels</h1>
+    </ion-content>
+  </ion-page>
+</template>
+
+<script lang="ts">
+import {
+  IonContent,
+  IonHeader,
+  IonPage,
+  IonTitle,
+  IonToolbar,
+} from '@ionic/vue';
+import { defineComponent } from 'vue';
+import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
+import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+import { Actions, hasPermission } from '@/authorization'
+
+export default defineComponent({
+  name: 'Inventory channels',
+  components: {
+    IonContent,
+    IonHeader,
+    IonPage,
+    IonTitle,
+    IonToolbar,
+  },
+  setup() {
+    const router = useRouter();
+    const store = useStore();
+
+    return {
+      Actions,
+      arrowForwardOutline,
+      downloadOutline,
+      filterOutline,
+      hasPermission,
+      router,
+      saveOutline,
+      store,
+      pricetagOutline,
+      closeCircle,
+      addCircleOutline,
+      albumsOutline,
+      warningOutline
+    };
+  },
+});
+</script>
\ No newline at end of file
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
new file mode 100644
index 00000000..6972d797
--- /dev/null
+++ b/src/views/SafetyStock.vue
@@ -0,0 +1,59 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-title>{{ $t("Safety stock") }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
+
+    <ion-content>
+      <h1>This is Safety Stock</h1>
+    </ion-content>
+  </ion-page>
+</template>
+
+<script lang="ts">
+import {
+  IonContent,
+  IonHeader,
+  IonPage,
+  IonTitle,
+  IonToolbar,
+} from '@ionic/vue';
+import { defineComponent } from 'vue';
+import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
+import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+import { Actions, hasPermission } from '@/authorization'
+
+export default defineComponent({
+  name: 'SafetyStock',
+  components: {
+    IonContent,
+    IonHeader,
+    IonPage,
+    IonTitle,
+    IonToolbar,
+  },
+  setup() {
+    const router = useRouter();
+    const store = useStore();
+
+    return {
+      Actions,
+      arrowForwardOutline,
+      downloadOutline,
+      filterOutline,
+      hasPermission,
+      router,
+      saveOutline,
+      store,
+      pricetagOutline,
+      closeCircle,
+      addCircleOutline,
+      albumsOutline,
+      warningOutline
+    };
+  },
+});
+</script>
\ No newline at end of file
diff --git a/src/views/SelectProduct.vue b/src/views/SelectProduct.vue
index a9f92793..adb21535 100644
--- a/src/views/SelectProduct.vue
+++ b/src/views/SelectProduct.vue
@@ -139,7 +139,7 @@
         </main>
       </div>
 
-      <div class="action desktop-only">
+      <!-- <div class="action desktop-only">
         <ion-button v-if="jobId" :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE) || isJobEditable() || isServiceScheduling" @click="updateThreshold()">
           <ion-icon slot="start" :icon="saveOutline" />
           {{ $t("Update threshold rule") }}
@@ -148,17 +148,33 @@
           <ion-icon slot="start" :icon="saveOutline" />
           {{ $t("Save threshold rule") }}
         </ion-button>
-      </div>
+      </div> -->
 
-      <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="mobile-only">
+      <!-- <ion-fab vertical="bottom" horizontal="end" slot="fixed" >
         <ion-fab-button v-if="jobId" :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE) || isServiceScheduling || isJobEditable()" @click="updateThreshold()">
           <ion-icon :icon="arrowForwardOutline" />
         </ion-fab-button>
         <ion-fab-button :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE)" v-else @click="saveThreshold()">
           <ion-icon :icon="arrowForwardOutline" />
         </ion-fab-button>
+      </ion-fab> -->
+
+      <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+        <ion-button >
+          <ion-label>
+            Buttons
+          </ion-label>
+          <ion-icon slot="end" :icon="arrowForwardOutline" />
+        </ion-button>
+        <ion-button >
+          <ion-label>
+            Buttons
+          </ion-label>
+          <ion-icon slot="end" :icon="arrowForwardOutline" />
+        </ion-button>
       </ion-fab>
     </ion-content>
+
   </ion-page>
 </template>
 
@@ -216,8 +232,8 @@ export default defineComponent({
     IonCardContent,
     IonChip,
     IonContent,
-    IonFab,
-    IonFabButton,
+    // IonFab,
+    // IonFabButton,
     IonHeader,
     IonIcon,
     IonInfiniteScroll,
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
new file mode 100644
index 00000000..ed50e780
--- /dev/null
+++ b/src/views/Shipping.vue
@@ -0,0 +1,59 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-title>{{ $t("Shipping") }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
+
+    <ion-content>
+      <h1>This is Shipping</h1>
+    </ion-content>
+  </ion-page>
+</template>
+
+<script lang="ts">
+import {
+  IonContent,
+  IonHeader,
+  IonPage,
+  IonTitle,
+  IonToolbar,
+} from '@ionic/vue';
+import { defineComponent } from 'vue';
+import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
+import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+import { Actions, hasPermission } from '@/authorization'
+
+export default defineComponent({
+  name: 'Shipping',
+  components: {
+    IonContent,
+    IonHeader,
+    IonPage,
+    IonTitle,
+    IonToolbar,
+  },
+  setup() {
+    const router = useRouter();
+    const store = useStore();
+
+    return {
+      Actions,
+      arrowForwardOutline,
+      downloadOutline,
+      filterOutline,
+      hasPermission,
+      router,
+      saveOutline,
+      store,
+      pricetagOutline,
+      closeCircle,
+      addCircleOutline,
+      albumsOutline,
+      warningOutline
+    };
+  },
+});
+</script>
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
new file mode 100644
index 00000000..aef3c7da
--- /dev/null
+++ b/src/views/StorePickup.vue
@@ -0,0 +1,59 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-title>{{ $t("Store pickup") }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
+
+    <ion-content>
+      <h1>This is store pickup</h1>
+    </ion-content>
+  </ion-page>
+</template>
+
+<script lang="ts">
+import {
+  IonContent,
+  IonHeader,
+  IonPage,
+  IonTitle,
+  IonToolbar,
+} from '@ionic/vue';
+import { defineComponent } from 'vue';
+import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
+import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+import { Actions, hasPermission } from '@/authorization'
+
+export default defineComponent({
+  name: 'StorePickup',
+  components: {
+    IonContent,
+    IonHeader,
+    IonPage,
+    IonTitle,
+    IonToolbar,
+  },
+  setup() {
+    const router = useRouter();
+    const store = useStore();
+
+    return {
+      Actions,
+      arrowForwardOutline,
+      downloadOutline,
+      filterOutline,
+      hasPermission,
+      router,
+      saveOutline,
+      store,
+      pricetagOutline,
+      closeCircle,
+      addCircleOutline,
+      albumsOutline,
+      warningOutline
+    };
+  },
+});
+</script>
\ No newline at end of file
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
new file mode 100644
index 00000000..65aed3aa
--- /dev/null
+++ b/src/views/Threshold.vue
@@ -0,0 +1,109 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-title>{{ $t("Threshold") }}</ion-title>
+      </ion-toolbar>
+
+      <ion-toolbar>
+        <ion-segment>
+          <ion-segment-button value="productAndFacility">
+            <ion-label>{{ $t("Product and facility") }}</ion-label>
+          </ion-segment-button>
+          <ion-segment-button value="productAndChannel">
+            <ion-label>{{ $t("Product and channel") }}</ion-label>
+          </ion-segment-button>
+        </ion-segment>
+      </ion-toolbar>
+    </ion-header>
+
+    <ion-content>
+      <main>
+        <section>
+          <RuleItem />
+          <RuleItem />
+        </section>
+      </main>
+    </ion-content>
+  </ion-page>
+</template>
+
+<script lang="ts">
+import {
+  IonContent,
+  IonHeader,
+  IonPage,
+  IonSegment,
+  IonSegmentButton,
+  IonTitle,
+  IonToolbar
+} from '@ionic/vue';
+import { defineComponent } from 'vue';
+import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
+import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+import { Actions, hasPermission } from '@/authorization'
+import RuleItem from '@/components/RuleItem.vue'
+
+export default defineComponent({
+  name: 'SelectProduct',
+  components: {
+    IonContent,
+    IonHeader,
+    IonPage,
+    IonSegment,
+    IonSegmentButton,
+    IonTitle,
+    IonToolbar,
+    RuleItem
+  },
+  setup() {
+    const router = useRouter();
+    const store = useStore();
+
+    return {
+      Actions,
+      arrowForwardOutline,
+      downloadOutline,
+      filterOutline,
+      hasPermission,
+      router,
+      saveOutline,
+      store,
+      pricetagOutline,
+      closeCircle,
+      addCircleOutline,
+      albumsOutline,
+      warningOutline
+    };
+  },
+});
+</script>
+
+
+<style scoped>
+
+@media (min-width: 991px) {
+  ion-header{
+    display: flex;
+  }
+
+  main {
+    display: flex;
+    justify-content: center;
+    align-items: start;
+    gap: var(--spacer-2xl);
+    max-width: 990px;
+    margin: var(--spacer-base) auto 0;
+  } 
+
+  main > section {
+    max-width: 50ch;
+  } 
+
+  aside {
+    width: 0px;
+    opacity: 0;
+  }
+}
+</style>

From 9ce3d1dfdf2f25ea9977093e9bb80bb34cd4520f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 6 Mar 2024 12:57:07 +0530
Subject: [PATCH 002/250] Implemented: alerts and popovers for the new UI,
 imporved code and syntax (#238)

---
 src/components/Menu.vue               |   2 +-
 src/components/RuleActionsPopover.vue |  39 ++++++
 src/components/RuleItem.vue           | 169 +++++++++++++++++++++-----
 src/theme/variables.css               |  17 +++
 src/views/InventoryChannels.vue       | 134 ++++++++++++++++----
 src/views/SafetyStock.vue             |  51 ++++----
 src/views/Shipping.vue                |  62 ++++++----
 src/views/StorePickup.vue             |  62 ++++++----
 src/views/Threshold.vue               |  75 +++---------
 9 files changed, 430 insertions(+), 181 deletions(-)
 create mode 100644 src/components/RuleActionsPopover.vue

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 17dd7fab..e2bc81d6 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -148,7 +148,7 @@
         },
         {
           title: "Store pickup",
-          url: "/store pickup",
+          url: "/store-pickup",
           iosIcon: storefrontOutline,
           mdIcon: storefrontOutline,
           meta: {
diff --git a/src/components/RuleActionsPopover.vue b/src/components/RuleActionsPopover.vue
new file mode 100644
index 00000000..cd7f99b6
--- /dev/null
+++ b/src/components/RuleActionsPopover.vue
@@ -0,0 +1,39 @@
+<template>
+  <ion-content>
+    <ion-list>
+      <ion-list-header>{{ "rule name" }}</ion-list-header>
+      <ion-item button>
+        {{ translate("Edit rule") }}
+      </ion-item>
+      <ion-item button lines="none">
+        {{ translate("Delete") }}
+      </ion-item> 
+    </ion-list>
+  </ion-content>
+</template>
+
+<script lang="ts">
+import { defineComponent } from "vue";
+import { translate } from "@hotwax/dxp-components";
+import {
+  IonContent,
+  IonItem,
+  IonList,
+  IonListHeader
+} from "@ionic/vue";
+
+export default defineComponent({
+  name: "RuleActionsPopover",
+  components: { 
+    IonContent,
+    IonItem,
+    IonList,
+    IonListHeader,
+  },
+  setup() {
+    return {
+      translate
+    }
+  }
+});
+</script> 
\ No newline at end of file
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 113e8ee1..bbb637fc 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -7,25 +7,44 @@
         <ion-card-subtitle>{{ "1/4" }}</ion-card-subtitle>
       </div>
       <div>
-        <ion-button fill="clear" color="medium">
+        <ion-button fill="clear" color="medium" class="ion-no-padding">
           <ion-icon :icon="chevronUpOutline" slot="icon-only" />
         </ion-button>
-        <ion-button fill="clear" color="medium">
+        <ion-button fill="clear" color="medium" class="ion-no-padding">
           <ion-icon :icon="chevronDownOutline" slot="icon-only" />
         </ion-button>
       </div>
     </ion-card-header>
-    <ion-item lines="full">
+
+    <ion-item lines="full" v-if="selectedPage.path === '/threshold'">
       <ion-icon slot="start" :icon="globeOutline"/>
-      <ion-label class="ion-text-wrap">{{ "Threshold" }}</ion-label>
-      <ion-chip slot="end" outline>5</ion-chip>
+      <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
+      <ion-chip slot="end" outline @click="editThreshold()">5</ion-chip>
+    </ion-item>
+    <ion-item lines="full" v-else-if="selectedPage.path === '/safety-stock'">
+      <ion-icon slot="start" :icon="pulseOutline"/>
+      <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
+      <ion-chip slot="end" outline @click="editSafetyStock()">5</ion-chip>
+    </ion-item>
+    <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">
+      <ion-icon slot="start" :icon="storefrontOutline"/>
+      <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
+      <ion-toggle slot="end" />
     </ion-item>
+    <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
+      <ion-icon slot="start" :icon="sendOutline"/>
+      <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
+      <ion-toggle slot="end" />
+    </ion-item>
+
     <ion-list>
       <ion-item-divider color="light">
-        <ion-label>
-          {{ "Facility groups" }}
-        </ion-label>
+        <ion-label>{{ translate("Facility groups") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium">
+          <ion-icon :icon="optionsOutline" slot="icon-only" />
+        </ion-button>
       </ion-item-divider>
+
       <ion-item>
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
         <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
@@ -34,11 +53,14 @@
         <ion-icon slot="start" :icon="closeCircleOutline"/>
         <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
       </ion-item>
+
       <ion-item-divider color="light">
-        <ion-label>
-          {{ "Product tags" }}
-        </ion-label>
+        <ion-label>{{ translate("Product tags") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium">
+          <ion-icon :icon="optionsOutline" slot="icon-only" />
+        </ion-button>
       </ion-item-divider>
+
       <ion-item>
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
         <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
@@ -47,11 +69,14 @@
         <ion-icon slot="start" :icon="closeCircleOutline"/>
         <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
       </ion-item>
+
       <ion-item-divider color="light">
-        <ion-label>
-          {{ "Product features" }}
-        </ion-label>
+        <ion-label>{{ translate("Product features") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium">
+          <ion-icon :icon="optionsOutline" slot="icon-only" />
+        </ion-button>
       </ion-item-divider>
+
       <ion-item>
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
         <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
@@ -60,11 +85,12 @@
         <ion-icon slot="start" :icon="closeCircleOutline"/>
         <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
         </ion-item>
+
         <ion-item lines="none">
           <ion-button fill="clear">{{ "Run now" }}</ion-button>
-          <ion-button fill="clear" slot="end">
-          <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
-        </ion-button>
+          <ion-button color="medium" fill="clear" slot="end" @click="openRuleActionsPopover($event)">
+            <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
+          </ion-button>
       </ion-item>
     </ion-list>
   </ion-card>
@@ -72,39 +98,120 @@
 
 <script lang="ts">
 import {
-  IonContent,
-  IonHeader,
-  IonPage,
-  IonSegment,
-  IonSegmentButton,
-  IonTitle,
-  IonToolbar
+  IonButton,
+  IonCard,
+  IonCardHeader,
+  IonCardSubtitle,
+  IonCardTitle,
+  IonChip,
+  IonIcon,
+  IonItem,
+  IonItemDivider,
+  IonLabel,
+  IonList,
+  alertController,
+  popoverController
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, ellipsisVerticalOutline, globeOutline } from 'ionicons/icons';
+import { checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
-import { Actions, hasPermission } from '@/authorization'
+import { translate } from '@hotwax/dxp-components';
+import RuleActionsPopover from "@/components/RuleActionsPopover.vue";
 
 export default defineComponent({
   name: 'RuleItem',
   components: {
+    IonButton,
+    IonCard,
+    IonCardHeader,
+    IonCardSubtitle,
+    IonCardTitle,
+    IonChip,
+    IonIcon,
+    IonItem,
+    IonItemDivider,
+    IonLabel,
+    IonList
+  },
+  data() {
+    return {
+      selectedPage: {
+        path: '',
+        name: ''
+      } as any
+    }
+  },
+  mounted() {
+    this.selectedPage.path = this.router.currentRoute.value.path
+    this.selectedPage.name = this.router.currentRoute.value.name
+  },
+  methods: {
+    async openRuleActionsPopover(event: Event) {
+      const popover = await popoverController.create({
+        component: RuleActionsPopover,
+        showBackdrop: false,
+        event
+      });
+
+      return popover.present();
+    },
+    async editThreshold() {
+      const alert = await alertController.create({
+        header: translate("Edit threshold"),
+        inputs: [{
+          name: "threshold",
+          placeholder: translate("threshold"),
+          type: "number",
+          min: 0
+        }],
+        buttons: [{
+          text: translate('Cancel'),
+          role: "cancel"
+        },
+        {
+          text: translate('Update'),
+        }]
+      })
+
+      await alert.present()
+    },
+    async editSafetyStock() {
+      const alert = await alertController.create({
+        header: translate("Edit safety stock"),
+        inputs: [{
+          name: "safety-stock",
+          placeholder: translate("safety stock"),
+          type: "number",
+          min: 0
+        }],
+        buttons: [{
+          text: translate('Cancel'),
+          role: "cancel"
+        },
+        {
+          text: translate('Update'),
+        }]
+      })
+
+      await alert.present()
+    }
   },
   setup() {
     const router = useRouter();
-    const store = useStore();
 
     return {
-      Actions,
       checkmarkDoneCircleOutline,
       chevronDownOutline,
       chevronUpOutline,
       closeCircleOutline,
       ellipsisVerticalOutline,
       globeOutline,
-      hasPermission,
+      optionsOutline,
+      pulseOutline,
       router,
-      store,
+      sendOutline,
+      storefrontOutline,
+      translate
     };
   },
 });
diff --git a/src/theme/variables.css b/src/theme/variables.css
index 16d875af..79c04f29 100644
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@@ -360,4 +360,21 @@ hr {
   .sort > div > :first-child{
     border-bottom: unset;
   }
+
+  ion-header {
+    display: flex;
+  }
+
+  main {
+    display: flex;
+    justify-content: center;
+    align-items: start;
+    gap: var(--spacer-2xl);
+    max-width: 990px;
+    margin: var(--spacer-base) auto 0;
+  }
+
+  main>section {
+    max-width: 50ch;
+  }
 }
\ No newline at end of file
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index fc5e07bc..5f3f7b9b 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -4,56 +4,142 @@
       <ion-toolbar>
         <ion-title>{{ $t("Inventory channels") }}</ion-title>
       </ion-toolbar>
+
+      <ion-toolbar>
+        <ion-segment>
+          <ion-segment-button value="channels">
+            <ion-label>{{ $t("Channels") }}</ion-label>
+          </ion-segment-button>
+          <ion-segment-button value="publish">
+            <ion-label>{{ $t("Publish") }}</ion-label>
+          </ion-segment-button>
+        </ion-segment>
+      </ion-toolbar>
     </ion-header>
 
     <ion-content>
-      <h1>This is inventory channels</h1>
+      <main>
+        <section>
+          <ion-card>
+            <ion-card-header>
+              <div>
+                <ion-card-subtitle class="overline">{{ "Group ID" }}</ion-card-subtitle>
+                <ion-card-title>{{ "Group name" }}</ion-card-title>
+              </div>
+              <ion-button fill="clear" color="medium">
+                <ion-icon :icon="copyOutline" slot="icon-only" />
+              </ion-button>
+            </ion-card-header>
+            <ion-list>
+              <ion-item lines="full">
+                <ion-icon slot="start" :icon="globeOutline"/>
+                <ion-label>
+                  {{ "<threshold facility name>" }}
+                  <p>{{ "<facilityId>" }}</p>
+                </ion-label>
+                <ion-chip slot="end" outline>4</ion-chip>
+              </ion-item>
+              <ion-item lines="full">
+                <ion-icon slot="start" :icon="storefrontOutline"/>
+                <ion-label>
+                  {{ "<retail type facilityid count>" }}
+                </ion-label>
+                <ion-chip slot="end" outline>15</ion-chip>
+              </ion-item>
+              <ion-item lines="full">
+                <ion-icon slot="start" :icon="businessOutline"/>
+                <ion-label>
+                  {{ "<warehouse type facilityId count>" }}
+                </ion-label>
+                <ion-chip slot="end" outline>1</ion-chip>
+              </ion-item>
+  
+              <ion-item lines="none">
+                <ion-button fill="clear">{{ translate("View details") }}</ion-button>
+                  <ion-button color="medium" fill="clear" slot="end">
+                  <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
+                </ion-button>
+              </ion-item>
+            </ion-list>
+          </ion-card>
+        </section>
+      </main>
     </ion-content>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="addOutline" />
+      </ion-fab-button>
+    </ion-fab>
   </ion-page>
 </template>
 
 <script lang="ts">
 import {
+  IonButton,
+  IonCard,
+  IonCardHeader,
+  IonCardSubtitle,
+  IonCardTitle,
+  IonChip,
   IonContent,
+  IonFab,
+  IonFabButton,
   IonHeader,
+  IonIcon,
+  IonItem,
+  IonLabel,
   IonPage,
+  IonSegment,
+  IonSegmentButton,
   IonTitle,
-  IonToolbar,
+  IonToolbar
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
-import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
-import { Actions, hasPermission } from '@/authorization'
+import { addOutline, businessOutline, copyOutline, ellipsisVerticalOutline, globeOutline, storefrontOutline } from 'ionicons/icons';
+import { translate } from '@hotwax/dxp-components';
 
 export default defineComponent({
   name: 'Inventory channels',
   components: {
+    IonButton,
+    IonCard,
+    IonCardHeader,
+    IonCardSubtitle,
+    IonCardTitle,
+    IonChip,
     IonContent,
+    IonFab,
+    IonFabButton,
     IonHeader,
+    IonIcon,
+    IonItem,
+    IonLabel,
     IonPage,
+    IonSegment,
+    IonSegmentButton,
     IonTitle,
-    IonToolbar,
+    IonToolbar
   },
   setup() {
-    const router = useRouter();
-    const store = useStore();
-
     return {
-      Actions,
-      arrowForwardOutline,
-      downloadOutline,
-      filterOutline,
-      hasPermission,
-      router,
-      saveOutline,
-      store,
-      pricetagOutline,
-      closeCircle,
-      addCircleOutline,
-      albumsOutline,
-      warningOutline
+      addOutline,
+      businessOutline,
+      copyOutline,
+      ellipsisVerticalOutline,
+      globeOutline,
+      storefrontOutline,
+      translate
     };
   },
 });
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+ion-card-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding-bottom: 0px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 6972d797..72600016 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -7,52 +7,59 @@
     </ion-header>
 
     <ion-content>
-      <h1>This is Safety Stock</h1>
+      <main>
+        <section>
+          <RuleItem />
+          <RuleItem />
+        </section>
+      </main>
     </ion-content>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="addOutline" />
+      </ion-fab-button>
+    </ion-fab>
   </ion-page>
 </template>
 
 <script lang="ts">
 import {
   IonContent,
+  IonFab,
+  IonFabButton,
   IonHeader,
+  IonIcon,
+  IonLabel,
   IonPage,
+  IonSegment,
+  IonSegmentButton,
   IonTitle,
-  IonToolbar,
+  IonToolbar
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
-import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
-import { Actions, hasPermission } from '@/authorization'
+import { addOutline } from 'ionicons/icons';
+import RuleItem from '@/components/RuleItem.vue';
 
 export default defineComponent({
   name: 'SafetyStock',
   components: {
     IonContent,
+    IonFab,
+    IonFabButton,
     IonHeader,
+    IonIcon,
+    IonLabel,
     IonPage,
+    IonSegment,
+    IonSegmentButton,
     IonTitle,
     IonToolbar,
+    RuleItem
   },
   setup() {
-    const router = useRouter();
-    const store = useStore();
-
     return {
-      Actions,
-      arrowForwardOutline,
-      downloadOutline,
-      filterOutline,
-      hasPermission,
-      router,
-      saveOutline,
-      store,
-      pricetagOutline,
-      closeCircle,
-      addCircleOutline,
-      albumsOutline,
-      warningOutline
+      addOutline
     };
   },
 });
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index ed50e780..a014c81f 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -4,55 +4,73 @@
       <ion-toolbar>
         <ion-title>{{ $t("Shipping") }}</ion-title>
       </ion-toolbar>
+
+      <ion-toolbar>
+        <ion-segment>
+          <ion-segment-button value="productAndFacility">
+            <ion-label>{{ $t("Product and facility") }}</ion-label>
+          </ion-segment-button>
+          <ion-segment-button value="productAndChannel">
+            <ion-label>{{ $t("Product and channel") }}</ion-label>
+          </ion-segment-button>
+        </ion-segment>
+      </ion-toolbar>
     </ion-header>
 
     <ion-content>
-      <h1>This is Shipping</h1>
+      <main>
+        <section>
+          <RuleItem />
+          <RuleItem />
+        </section>
+      </main>
     </ion-content>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="addOutline" />
+      </ion-fab-button>
+    </ion-fab>
   </ion-page>
 </template>
 
 <script lang="ts">
 import {
   IonContent,
+  IonFab,
+  IonFabButton,
   IonHeader,
+  IonIcon,
+  IonLabel,
   IonPage,
+  IonSegment,
+  IonSegmentButton,
   IonTitle,
-  IonToolbar,
+  IonToolbar
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
-import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
-import { Actions, hasPermission } from '@/authorization'
+import { addOutline } from 'ionicons/icons';
+import RuleItem from '@/components/RuleItem.vue'
 
 export default defineComponent({
   name: 'Shipping',
   components: {
     IonContent,
+    IonFab,
+    IonFabButton,
     IonHeader,
+    IonIcon,
+    IonLabel,
     IonPage,
+    IonSegment,
+    IonSegmentButton,
     IonTitle,
     IonToolbar,
+    RuleItem
   },
   setup() {
-    const router = useRouter();
-    const store = useStore();
-
     return {
-      Actions,
-      arrowForwardOutline,
-      downloadOutline,
-      filterOutline,
-      hasPermission,
-      router,
-      saveOutline,
-      store,
-      pricetagOutline,
-      closeCircle,
-      addCircleOutline,
-      albumsOutline,
-      warningOutline
+      addOutline,
     };
   },
 });
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index aef3c7da..6432712f 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -4,10 +4,32 @@
       <ion-toolbar>
         <ion-title>{{ $t("Store pickup") }}</ion-title>
       </ion-toolbar>
+
+      <ion-toolbar>
+        <ion-segment>
+          <ion-segment-button value="productAndFacility">
+            <ion-label>{{ $t("Product and facility") }}</ion-label>
+          </ion-segment-button>
+          <ion-segment-button value="productAndChannel">
+            <ion-label>{{ $t("Product and channel") }}</ion-label>
+          </ion-segment-button>
+        </ion-segment>
+      </ion-toolbar>
     </ion-header>
 
     <ion-content>
-      <h1>This is store pickup</h1>
+      <main>
+        <section>
+          <RuleItem />
+          <RuleItem />
+        </section>
+      </main>
+
+      <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+        <ion-fab-button>
+          <ion-icon :icon="addOutline" />
+        </ion-fab-button>
+      </ion-fab>
     </ion-content>
   </ion-page>
 </template>
@@ -15,44 +37,40 @@
 <script lang="ts">
 import {
   IonContent,
+  IonFab,
+  IonFabButton,
   IonHeader,
+  IonIcon,
+  IonLabel,
   IonPage,
+  IonSegment,
+  IonSegmentButton,
   IonTitle,
-  IonToolbar,
+  IonToolbar
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
-import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
-import { Actions, hasPermission } from '@/authorization'
+import { addOutline } from 'ionicons/icons';
+import RuleItem from '@/components/RuleItem.vue'
 
 export default defineComponent({
   name: 'StorePickup',
   components: {
     IonContent,
+    IonFab,
+    IonFabButton,
     IonHeader,
+    IonIcon,
+    IonLabel,
     IonPage,
+    IonSegment,
+    IonSegmentButton,
     IonTitle,
     IonToolbar,
+    RuleItem
   },
   setup() {
-    const router = useRouter();
-    const store = useStore();
-
     return {
-      Actions,
-      arrowForwardOutline,
-      downloadOutline,
-      filterOutline,
-      hasPermission,
-      router,
-      saveOutline,
-      store,
-      pricetagOutline,
-      closeCircle,
-      addCircleOutline,
-      albumsOutline,
-      warningOutline
+      addOutline
     };
   },
 });
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 65aed3aa..b269b594 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -4,17 +4,6 @@
       <ion-toolbar>
         <ion-title>{{ $t("Threshold") }}</ion-title>
       </ion-toolbar>
-
-      <ion-toolbar>
-        <ion-segment>
-          <ion-segment-button value="productAndFacility">
-            <ion-label>{{ $t("Product and facility") }}</ion-label>
-          </ion-segment-button>
-          <ion-segment-button value="productAndChannel">
-            <ion-label>{{ $t("Product and channel") }}</ion-label>
-          </ion-segment-button>
-        </ion-segment>
-      </ion-toolbar>
     </ion-header>
 
     <ion-content>
@@ -24,6 +13,12 @@
           <RuleItem />
         </section>
       </main>
+
+      <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+        <ion-fab-button>
+          <ion-icon :icon="addOutline" />
+        </ion-fab-button>
+      </ion-fab>
     </ion-content>
   </ion-page>
 </template>
@@ -31,7 +26,11 @@
 <script lang="ts">
 import {
   IonContent,
+  IonFab,
+  IonFabButton,
   IonHeader,
+  IonIcon,
+  IonLabel,
   IonPage,
   IonSegment,
   IonSegmentButton,
@@ -39,17 +38,18 @@ import {
   IonToolbar
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
-import { useRouter } from 'vue-router';
-import { useStore } from 'vuex';
-import { Actions, hasPermission } from '@/authorization'
+import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 
 export default defineComponent({
   name: 'SelectProduct',
   components: {
     IonContent,
+    IonFab,
+    IonFabButton,
     IonHeader,
+    IonIcon,
+    IonLabel,
     IonPage,
     IonSegment,
     IonSegmentButton,
@@ -58,52 +58,9 @@ export default defineComponent({
     RuleItem
   },
   setup() {
-    const router = useRouter();
-    const store = useStore();
-
     return {
-      Actions,
-      arrowForwardOutline,
-      downloadOutline,
-      filterOutline,
-      hasPermission,
-      router,
-      saveOutline,
-      store,
-      pricetagOutline,
-      closeCircle,
-      addCircleOutline,
-      albumsOutline,
-      warningOutline
+      addOutline
     };
   },
 });
 </script>
-
-
-<style scoped>
-
-@media (min-width: 991px) {
-  ion-header{
-    display: flex;
-  }
-
-  main {
-    display: flex;
-    justify-content: center;
-    align-items: start;
-    gap: var(--spacer-2xl);
-    max-width: 990px;
-    margin: var(--spacer-base) auto 0;
-  } 
-
-  main > section {
-    max-width: 50ch;
-  } 
-
-  aside {
-    width: 0px;
-    opacity: 0;
-  }
-}
-</style>

From a115c30b4b113fe353e1efbf2b668442dcf8b040 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 6 Mar 2024 14:27:32 +0530
Subject: [PATCH 003/250] Improved: missing import of ion items (#238)

---
 src/views/SafetyStock.vue   |  3 ---
 src/views/SelectProduct.vue | 26 +++++---------------------
 src/views/Threshold.vue     |  6 ------
 3 files changed, 5 insertions(+), 30 deletions(-)

diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 72600016..01f78c09 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -49,10 +49,7 @@ export default defineComponent({
     IonFabButton,
     IonHeader,
     IonIcon,
-    IonLabel,
     IonPage,
-    IonSegment,
-    IonSegmentButton,
     IonTitle,
     IonToolbar,
     RuleItem
diff --git a/src/views/SelectProduct.vue b/src/views/SelectProduct.vue
index adb21535..2004028f 100644
--- a/src/views/SelectProduct.vue
+++ b/src/views/SelectProduct.vue
@@ -139,7 +139,7 @@
         </main>
       </div>
 
-      <!-- <div class="action desktop-only">
+      <div class="action desktop-only">
         <ion-button v-if="jobId" :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE) || isJobEditable() || isServiceScheduling" @click="updateThreshold()">
           <ion-icon slot="start" :icon="saveOutline" />
           {{ $t("Update threshold rule") }}
@@ -148,33 +148,17 @@
           <ion-icon slot="start" :icon="saveOutline" />
           {{ $t("Save threshold rule") }}
         </ion-button>
-      </div> -->
+      </div>
 
-      <!-- <ion-fab vertical="bottom" horizontal="end" slot="fixed" >
+      <ion-fab vertical="bottom" horizontal="end" slot="fixed" >
         <ion-fab-button v-if="jobId" :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE) || isServiceScheduling || isJobEditable()" @click="updateThreshold()">
           <ion-icon :icon="arrowForwardOutline" />
         </ion-fab-button>
         <ion-fab-button :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE)" v-else @click="saveThreshold()">
           <ion-icon :icon="arrowForwardOutline" />
         </ion-fab-button>
-      </ion-fab> -->
-
-      <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-        <ion-button >
-          <ion-label>
-            Buttons
-          </ion-label>
-          <ion-icon slot="end" :icon="arrowForwardOutline" />
-        </ion-button>
-        <ion-button >
-          <ion-label>
-            Buttons
-          </ion-label>
-          <ion-icon slot="end" :icon="arrowForwardOutline" />
-        </ion-button>
       </ion-fab>
     </ion-content>
-
   </ion-page>
 </template>
 
@@ -232,8 +216,8 @@ export default defineComponent({
     IonCardContent,
     IonChip,
     IonContent,
-    // IonFab,
-    // IonFabButton,
+    IonFab,
+    IonFabButton,
     IonHeader,
     IonIcon,
     IonInfiniteScroll,
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index b269b594..3819560f 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -30,10 +30,7 @@ import {
   IonFabButton,
   IonHeader,
   IonIcon,
-  IonLabel,
   IonPage,
-  IonSegment,
-  IonSegmentButton,
   IonTitle,
   IonToolbar
 } from '@ionic/vue';
@@ -49,10 +46,7 @@ export default defineComponent({
     IonFabButton,
     IonHeader,
     IonIcon,
-    IonLabel,
     IonPage,
-    IonSegment,
-    IonSegmentButton,
     IonTitle,
     IonToolbar,
     RuleItem

From 6b7c7e5c9de479c931bee9cdcbe25823f3e3efd9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 6 Mar 2024 15:40:49 +0530
Subject: [PATCH 004/250] Improved: added translation entries in en.json for
 all the static texts (#238)

---
 src/components/RuleItem.vue     | 10 ++++++----
 src/locales/en.json             | 26 ++++++++++++++++++++++----
 src/locales/index.ts            |  5 +++++
 src/main.ts                     |  3 ++-
 src/views/InventoryChannels.vue |  8 +++++---
 src/views/Shipping.vue          | 11 ++++++++---
 src/views/StorePickup.vue       | 15 ++++++++++-----
 tsconfig.json                   |  1 +
 8 files changed, 59 insertions(+), 20 deletions(-)
 create mode 100644 src/locales/index.ts

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index bbb637fc..0992a3b1 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -87,7 +87,7 @@
         </ion-item>
 
         <ion-item lines="none">
-          <ion-button fill="clear">{{ "Run now" }}</ion-button>
+          <ion-button fill="clear">{{ translate("Run now") }}</ion-button>
           <ion-button color="medium" fill="clear" slot="end" @click="openRuleActionsPopover($event)">
             <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
           </ion-button>
@@ -109,6 +109,7 @@ import {
   IonItemDivider,
   IonLabel,
   IonList,
+  IonToggle,
   alertController,
   popoverController
 } from '@ionic/vue';
@@ -131,7 +132,8 @@ export default defineComponent({
     IonItem,
     IonItemDivider,
     IonLabel,
-    IonList
+    IonList,
+    IonToggle
   },
   data() {
     return {
@@ -160,7 +162,7 @@ export default defineComponent({
         header: translate("Edit threshold"),
         inputs: [{
           name: "threshold",
-          placeholder: translate("threshold"),
+          placeholder: translate("Threshold"),
           type: "number",
           min: 0
         }],
@@ -180,7 +182,7 @@ export default defineComponent({
         header: translate("Edit safety stock"),
         inputs: [{
           name: "safety-stock",
-          placeholder: translate("safety stock"),
+          placeholder: translate("Safety stock"),
           type: "number",
           min: 0
         }],
diff --git a/src/locales/en.json b/src/locales/en.json
index c9315ea0..9b730419 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -4,6 +4,7 @@
   "App": "App",
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
   "Authenticating": "Authenticating",
+  "Available to Promise": "Available to Promise",
   "Blank": "Blank",
   "Cancel": "Cancel",
   "CANCEL": "CANCEL",
@@ -17,6 +18,9 @@
   "Color": "Color",
   "Configuration missing": "Configuration missing",
   "Confirm": "Confirm",
+  "Create rule": "Create rule",
+  "Create Rule": "Create Rule",
+  "Delete": "Delete",
   "Disable": "Disable",
   "Disabled": "Disabled",
   "Discard": "Discard",
@@ -24,8 +28,11 @@
   "Don't skip": "Don't skip",
   "Download": "Download",
   "Download data in csv": "Download data in csv",
-  "Enter threshold value": "Enter threshold value",
+  "Edit rule": "Edit rule",
+  "Edit safety stock": "Edit safety stock",
+  "Edit threshold": "Edit threshold",
   "Edit threshold rule": "Edit threshold rule",
+  "Enter threshold value": "Enter threshold value",
   "Every 5 minutes": "Every 5 minutes",
   "Every 15 minutes": "Every 15 minutes",
   "Every 30 minutes": "Every 30 minutes",
@@ -35,6 +42,7 @@
   "Exclude tags": "Exclude tags",
   "Export product thresholds": "Export product thresholds",
   "Export product threshold jobs": "Export product threshold jobs",
+  "Facility": "Facility",
   "Failed": "Failed",
   "Failed to update some jobs": "Failed to update some jobs",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
@@ -43,8 +51,10 @@
   "History": "History",
   "Hourly": "Hourly",
   "Exclude": "Exclude",
+  "Facility groups": "Facility groups",
   "Filter stores": "Filter stores",
   "Import product thresholds": "Import product thresholds",
+  "Inventory channels": "Inventory channels",
   "global threshold": "global threshold",
   "included": "included",
   "Include": "Include",
@@ -74,12 +84,17 @@
   "Password": "Password",
   "Pending": "Pending",
   "Please enter a threshold value to set for these products before proceeding.": "Please enter a threshold value to set for these products before proceeding.",
+  "Product and facility": "Product and facility",
+  "Product and channel": "Product and channel",
   "Product list": "Product list",
+  "Product features": "Product features",
   "Product SKU column": "Product SKU column",
   "Product Store": "Product Store",
+  "Product tags": "Product tags",
   "Products not found": "Products not found",
   "products selected": "products selected",
   "Provide a future date and time": "Provide a future date and time",
+  "Publish": "Publish",
   "Ok": "Ok",
   "OMS": "OMS",
   "Ready to create an app?": "Ready to create an app?",
@@ -87,6 +102,7 @@
   "reset": "reset",
   "retry": "retry",
   "rule name": "rule name",
+  "Run now": "Run now",
   "running": "running",
   "Running": "Running",
   "Run time": "Run time",
@@ -117,6 +133,7 @@
   "Settings": "Settings",
   "eCom Store": "eCom Store",
   "Shopify Config": "Shopify Config",
+  "Shipping": "Shipping",
   "SKUs": "SKUs",
   "Size": "Size",
   "Skip": "Skip",
@@ -132,6 +149,7 @@
   "Store list": "Store list",
   "Store": "Store",
   "store name": "store name",
+  "Store pickup": "Store pickup",
   "Stores": "Stores",
   "stores selected": "stores selected",
   "Success": "Success",
@@ -144,8 +162,6 @@
   "This job schedule cannot be skipped": "This job schedule cannot be skipped",
   "threshold": "threshold",
   "Threshold": "Threshold",
-  "Create rule": "Create rule",
-  "Create Rule": "Create Rule",
   "Threshold pipeline": "Threshold pipeline",
   "Rule pipeline": "Rule pipeline",
   "Rule Pipeline": "Rule Pipeline",
@@ -155,11 +171,13 @@
   "UI Components": "UI Components",
   "Unable to schedule service.": "Unable to schedule service.",
   "Unable to update threshold rule.": "Unable to update threshold rule.",
+  "Update": "Update",
   "Update time zone": "Update time zone",
+  "Update threshold rule": "Update threshold rule",
   "Upload": "Upload",
   "Upload CSV": "Upload CSV",
-  "Update threshold rule": "Update threshold rule",
   "Username": "Username",
+  "View details": "View details",
   "virtual, ": "virtual, ",
   "variants": "variants",
   "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems": "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems",
diff --git a/src/locales/index.ts b/src/locales/index.ts
new file mode 100644
index 00000000..0102fa05
--- /dev/null
+++ b/src/locales/index.ts
@@ -0,0 +1,5 @@
+import en from './en.json';
+
+export default {
+  'en-US': en
+};
\ No newline at end of file
diff --git a/src/main.ts b/src/main.ts
index 3115cfc7..ca755e6f 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -35,7 +35,7 @@ import permissionActions from '@/authorization/Actions';
 import { dxpComponents } from '@hotwax/dxp-components'
 import { login, logout, loader } from './user-utils';
 import { getConfig, initialise } from '@/adapter'
-
+import localeMessages from '@/locales';
 
 const app = createApp(App)
   .use(IonicVue, {
@@ -55,6 +55,7 @@ const app = createApp(App)
     defaultImgUrl: require("@/assets/images/defaultImage.png"),
     login,
     logout,
+    localeMessages,
     loader,
     appLoginUrl: process.env.VUE_APP_LOGIN_URL as string,
     getConfig,
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 5f3f7b9b..81fe7959 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -2,16 +2,16 @@
   <ion-page>
     <ion-header :translucent="true">
       <ion-toolbar>
-        <ion-title>{{ $t("Inventory channels") }}</ion-title>
+        <ion-title>{{ translate("Inventory channels") }}</ion-title>
       </ion-toolbar>
 
       <ion-toolbar>
         <ion-segment>
           <ion-segment-button value="channels">
-            <ion-label>{{ $t("Channels") }}</ion-label>
+            <ion-label>{{ translate("Channels") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="publish">
-            <ion-label>{{ $t("Publish") }}</ion-label>
+            <ion-label>{{ translate("Publish") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
       </ion-toolbar>
@@ -89,6 +89,7 @@ import {
   IonIcon,
   IonItem,
   IonLabel,
+  IonList,
   IonPage,
   IonSegment,
   IonSegmentButton,
@@ -115,6 +116,7 @@ export default defineComponent({
     IonIcon,
     IonItem,
     IonLabel,
+    IonList,
     IonPage,
     IonSegment,
     IonSegmentButton,
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index a014c81f..ec6f9505 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -2,16 +2,19 @@
   <ion-page>
     <ion-header :translucent="true">
       <ion-toolbar>
-        <ion-title>{{ $t("Shipping") }}</ion-title>
+        <ion-title>{{ translate("Shipping") }}</ion-title>
       </ion-toolbar>
 
       <ion-toolbar>
         <ion-segment>
           <ion-segment-button value="productAndFacility">
-            <ion-label>{{ $t("Product and facility") }}</ion-label>
+            <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="productAndChannel">
-            <ion-label>{{ $t("Product and channel") }}</ion-label>
+            <ion-label>{{ translate("Product and channel") }}</ion-label>
+          </ion-segment-button>
+          <ion-segment-button value="productAndChannel">
+            <ion-label>{{ translate("Facility") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
       </ion-toolbar>
@@ -51,6 +54,7 @@ import {
 import { defineComponent } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
+import { translate } from '@hotwax/dxp-components';
 
 export default defineComponent({
   name: 'Shipping',
@@ -71,6 +75,7 @@ export default defineComponent({
   setup() {
     return {
       addOutline,
+      translate
     };
   },
 });
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 6432712f..345d15d4 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -2,16 +2,19 @@
   <ion-page>
     <ion-header :translucent="true">
       <ion-toolbar>
-        <ion-title>{{ $t("Store pickup") }}</ion-title>
+        <ion-title>{{ translate("Store pickup") }}</ion-title>
       </ion-toolbar>
 
       <ion-toolbar>
-        <ion-segment>
+        <ion-segment value="productAndFacility">
           <ion-segment-button value="productAndFacility">
-            <ion-label>{{ $t("Product and facility") }}</ion-label>
+            <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="productAndChannel">
-            <ion-label>{{ $t("Product and channel") }}</ion-label>
+            <ion-label>{{ translate("Product and channel") }}</ion-label>
+          </ion-segment-button>
+          <ion-segment-button value="productAndChannel">
+            <ion-label>{{ translate("Facility") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
       </ion-toolbar>
@@ -51,6 +54,7 @@ import {
 import { defineComponent } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
+import { translate } from '@hotwax/dxp-components';
 
 export default defineComponent({
   name: 'StorePickup',
@@ -70,7 +74,8 @@ export default defineComponent({
   },
   setup() {
     return {
-      addOutline
+      addOutline,
+      translate
     };
   },
 });
diff --git a/tsconfig.json b/tsconfig.json
index e621cbc3..f14d2aa9 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,6 +6,7 @@
     "jsx": "preserve",
     "importHelpers": true,
     "moduleResolution": "node",
+    "resolveJsonModule": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,

From 70546c13f0b5596d995981a10bae0e5cc794349f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 6 Mar 2024 16:13:52 +0530
Subject: [PATCH 005/250] Updated: app to upgrade ionic to v7.6.0 (#238)

---
 package-lock.json               | 2463 ++++++++++++++++---------------
 package.json                    |   10 +-
 src/components/RuleItem.vue     |    8 +-
 src/views/InventoryChannels.vue |    5 +-
 src/views/SelectProduct.vue     |    6 +-
 5 files changed, 1275 insertions(+), 1217 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 2ca99776..b42b6b0e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,12 +14,12 @@
         "@casl/ability": "^6.0.0",
         "@casl/vue": "^2.2.0",
         "@hotwax/app-version-info": "^1.0.0",
-        "@hotwax/apps-theme": "^1.1.0",
-        "@hotwax/dxp-components": "1.11.0",
+        "@hotwax/apps-theme": "^1.2.6",
+        "@hotwax/dxp-components": "1.12.1",
         "@hotwax/oms-api": "^1.10.0",
-        "@ionic/core": "6.7.5",
-        "@ionic/vue": "6.7.5",
-        "@ionic/vue-router": "6.7.5",
+        "@ionic/core": "7.6.0",
+        "@ionic/vue": "7.6.0",
+        "@ionic/vue-router": "7.6.0",
         "boolean-parser": "0.0.2",
         "boon-js": "^2.0.3",
         "core-js": "^3.6.5",
@@ -81,13 +81,13 @@
       }
     },
     "node_modules/@ampproject/remapping": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.1.tgz",
-      "integrity": "sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
+      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
       "dev": true,
       "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.0",
-        "@jridgewell/trace-mapping": "^0.3.9"
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
       },
       "engines": {
         "node": ">=6.0.0"
@@ -116,21 +116,21 @@
       }
     },
     "node_modules/@babel/core": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.23.5.tgz",
-      "integrity": "sha512-Cwc2XjUrG4ilcfOw4wBAK+enbdgwAcAJCfGUItPBKR7Mjw4aEfAFYrLxeRp4jWgtNIKn3n2AlBOfwwafl+42/g==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.24.0.tgz",
+      "integrity": "sha512-fQfkg0Gjkza3nf0c7/w6Xf34BW4YvzNfACRLmmb7XRLa6XHdR+K9AlJlxneFfWYf6uhOzuzZVTjF/8KfndZANw==",
       "dev": true,
       "dependencies": {
         "@ampproject/remapping": "^2.2.0",
         "@babel/code-frame": "^7.23.5",
-        "@babel/generator": "^7.23.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
+        "@babel/generator": "^7.23.6",
+        "@babel/helper-compilation-targets": "^7.23.6",
         "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helpers": "^7.23.5",
-        "@babel/parser": "^7.23.5",
-        "@babel/template": "^7.22.15",
-        "@babel/traverse": "^7.23.5",
-        "@babel/types": "^7.23.5",
+        "@babel/helpers": "^7.24.0",
+        "@babel/parser": "^7.24.0",
+        "@babel/template": "^7.24.0",
+        "@babel/traverse": "^7.24.0",
+        "@babel/types": "^7.24.0",
         "convert-source-map": "^2.0.0",
         "debug": "^4.1.0",
         "gensync": "^1.0.0-beta.2",
@@ -155,12 +155,12 @@
       }
     },
     "node_modules/@babel/generator": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.5.tgz",
-      "integrity": "sha512-BPssCHrBD+0YrxviOa3QzpqwhNIXKEtOa2jQrm4FlmkC2apYgRnQcmPWiGZDlGxiNtltnUFolMe8497Esry+jA==",
+      "version": "7.23.6",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.6.tgz",
+      "integrity": "sha512-qrSfCYxYQB5owCmGLbl8XRpX1ytXlpueOb0N0UmQwA073KZxejgQTzAmJezxvpwQD9uGtK2shHdi55QT+MbjIw==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.23.5",
+        "@babel/types": "^7.23.6",
         "@jridgewell/gen-mapping": "^0.3.2",
         "@jridgewell/trace-mapping": "^0.3.17",
         "jsesc": "^2.5.1"
@@ -194,14 +194,14 @@
       }
     },
     "node_modules/@babel/helper-compilation-targets": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.15.tgz",
-      "integrity": "sha512-y6EEzULok0Qvz8yyLkCvVX+02ic+By2UdOhylwUOvOn9dvYc9mKICJuuU1n1XBI02YWsNsnrY1kc6DVbjcXbtw==",
+      "version": "7.23.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.23.6.tgz",
+      "integrity": "sha512-9JB548GZoQVmzrFgp8o7KxdgkTGm6xs9DW0o/Pim72UDjzr5ObUQ6ZzYPqA+g9OTS2bBQoctLJrky0RDCAWRgQ==",
       "dev": true,
       "dependencies": {
-        "@babel/compat-data": "^7.22.9",
-        "@babel/helper-validator-option": "^7.22.15",
-        "browserslist": "^4.21.9",
+        "@babel/compat-data": "^7.23.5",
+        "@babel/helper-validator-option": "^7.23.5",
+        "browserslist": "^4.22.2",
         "lru-cache": "^5.1.1",
         "semver": "^6.3.1"
       },
@@ -219,9 +219,9 @@
       }
     },
     "node_modules/@babel/helper-create-class-features-plugin": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.23.5.tgz",
-      "integrity": "sha512-QELlRWxSpgdwdJzSJn4WAhKC+hvw/AtHbbrIoncKHkhKKR/luAlKkgBDcri1EzWAo8f8VvYVryEHN4tax/V67A==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.24.0.tgz",
+      "integrity": "sha512-QAH+vfvts51BCsNZ2PhY6HAggnlS6omLLFTsIpeqZk/MmJ6cW7tgz5yRv0fMJThcr6FmbMrENh1RgrWPTYA76g==",
       "dev": true,
       "dependencies": {
         "@babel/helper-annotate-as-pure": "^7.22.5",
@@ -277,9 +277,9 @@
       }
     },
     "node_modules/@babel/helper-define-polyfill-provider": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.4.3.tgz",
-      "integrity": "sha512-WBrLmuPP47n7PNwsZ57pqam6G/RGo1vw/87b0Blc53tZNGZ4x7YvZ6HgQe2vo1W/FR20OgjeZuGXzudPiXHFug==",
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.5.0.tgz",
+      "integrity": "sha512-NovQquuQLAQ5HuyjCz7WQP9MjRj7dx++yspwiyUiGl9ZyadHRSql1HZh5ogRd8W8w6YM6EQ/NTB8rgjLt5W65Q==",
       "dev": true,
       "dependencies": {
         "@babel/helper-compilation-targets": "^7.22.6",
@@ -382,9 +382,9 @@
       }
     },
     "node_modules/@babel/helper-plugin-utils": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz",
-      "integrity": "sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.24.0.tgz",
+      "integrity": "sha512-9cUznXMG0+FxRuJfvL82QlTqIzhVW9sL0KjMPHhAOOvpQGL8QtdxnBKILjBqxlHyliz0yCa1G903ZXI/FuHy2w==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
@@ -502,14 +502,14 @@
       }
     },
     "node_modules/@babel/helpers": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.23.5.tgz",
-      "integrity": "sha512-oO7us8FzTEsG3U6ag9MfdF1iA/7Z6dz+MtFhifZk8C8o453rGJFFWUP1t+ULM9TUIAzC9uxXEiXjOiVMyd7QPg==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.24.0.tgz",
+      "integrity": "sha512-ulDZdc0Aj5uLc5nETsa7EPx2L7rM0YJM8r7ck7U73AXi7qOV44IHHRAYZHY6iU1rr3C5N4NtTmMRUJP6kwCWeA==",
       "dev": true,
       "dependencies": {
-        "@babel/template": "^7.22.15",
-        "@babel/traverse": "^7.23.5",
-        "@babel/types": "^7.23.5"
+        "@babel/template": "^7.24.0",
+        "@babel/traverse": "^7.24.0",
+        "@babel/types": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -530,9 +530,9 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.5.tgz",
-      "integrity": "sha512-hOOqoiNXrmGdFbhgCzu6GiURxUgM27Xwd/aPuu8RfHEZPBzL1Z54okAHAQjXfcQNwvrlkAmAp4SlRTZ45vlthQ==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.0.tgz",
+      "integrity": "sha512-QuP/FxEAzMSjXygs8v4N9dvdXzEHN4W1oF3PxuWAtPo08UdM17u89RDMgjLn/mlc56iM0HlLmVkO/wgR+rDgHg==",
       "bin": {
         "parser": "bin/babel-parser.js"
       },
@@ -573,9 +573,9 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.23.3.tgz",
-      "integrity": "sha512-XaJak1qcityzrX0/IU5nKHb34VaibwP3saKqG6a/tppelgllOH13LUann4ZCIBcVOeE6H18K4Vx9QKkVww3z/w==",
+      "version": "7.23.7",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.23.7.tgz",
+      "integrity": "sha512-LlRT7HgaifEpQA1ZgLVOIJZZFVPWN5iReq/7/JixwBtwcoeVGDBD53ZV28rrsLYOZs1Y/EHhA8N/Z6aazHR8cw==",
       "dev": true,
       "dependencies": {
         "@babel/helper-environment-visitor": "^7.22.20",
@@ -606,16 +606,14 @@
       }
     },
     "node_modules/@babel/plugin-proposal-decorators": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.23.5.tgz",
-      "integrity": "sha512-6IsY8jOeWibsengGlWIezp7cuZEFzNlAghFpzh9wiZwhQ42/hRcPnY/QV9HJoKTlujupinSlnQPiEy/u2C1ZfQ==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.24.0.tgz",
+      "integrity": "sha512-LiT1RqZWeij7X+wGxCoYh3/3b8nVOX6/7BZ9wiQgAIyjoeQWdROaodJCgT+dwtbjHaz0r7bEbHJzjSbVfcOyjQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.23.5",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/plugin-syntax-decorators": "^7.23.3"
+        "@babel/helper-create-class-features-plugin": "^7.24.0",
+        "@babel/helper-plugin-utils": "^7.24.0",
+        "@babel/plugin-syntax-decorators": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -676,12 +674,12 @@
       }
     },
     "node_modules/@babel/plugin-syntax-decorators": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.23.3.tgz",
-      "integrity": "sha512-cf7Niq4/+/juY67E0PbgH0TDhLQ5J7zS8C/Q5FFx+DWyrRa9sUQdTXkjqKu8zGvuqr7vw1muKiukseihU+PJDA==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.24.0.tgz",
+      "integrity": "sha512-MXW3pQCu9gUiVGzqkGqsgiINDVYXoAnrY8FYF/rmb+OfufNF0zHMpHPN4ulRrinxYT8Vk/aZJxYqOKsDECjKAw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -917,9 +915,9 @@
       }
     },
     "node_modules/@babel/plugin-transform-async-generator-functions": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.23.4.tgz",
-      "integrity": "sha512-efdkfPhHYTtn0G6n2ddrESE91fgXxjlqLsnUtPWnJs4a4mZIbUaK7ffqKIIUKXSHwcDvaCVX6GXkaJJFqtX7jw==",
+      "version": "7.23.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.23.9.tgz",
+      "integrity": "sha512-8Q3veQEDGe14dTYuwagbRtwxQDnytyg1JFu4/HwEMETeofocrB0U0ejBJIXoeG/t2oXZ8kzCyI0ZZfbT80VFNQ==",
       "dev": true,
       "dependencies": {
         "@babel/helper-environment-visitor": "^7.22.20",
@@ -1015,16 +1013,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-classes": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.23.5.tgz",
-      "integrity": "sha512-jvOTR4nicqYC9yzOHIhXG5emiFEOpappSJAl73SDSEDcybD+Puuze8Tnpb9p9qEyYup24tq891gkaygIFvWDqg==",
+      "version": "7.23.8",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.23.8.tgz",
+      "integrity": "sha512-yAYslGsY1bX6Knmg46RjiCiNSwJKv2IUC8qOdYKqMMr0491SXFhcHqOdRDeCRohOOIzwN/90C6mQ9qAKgrP7dg==",
       "dev": true,
       "dependencies": {
         "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
+        "@babel/helper-compilation-targets": "^7.23.6",
         "@babel/helper-environment-visitor": "^7.22.20",
         "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-optimise-call-expression": "^7.22.5",
         "@babel/helper-plugin-utils": "^7.22.5",
         "@babel/helper-replace-supers": "^7.22.20",
         "@babel/helper-split-export-declaration": "^7.22.6",
@@ -1148,12 +1145,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-for-of": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.23.3.tgz",
-      "integrity": "sha512-X8jSm8X1CMwxmK878qsUGJRmbysKNbdpTv/O1/v0LuY/ZkZrng5WYiekYSdg9m09OTmDDUWeEDsTE+17WYbAZw==",
+      "version": "7.23.6",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.23.6.tgz",
+      "integrity": "sha512-aYH4ytZ0qSuBbpfhuofbg/e96oQ7U2w1Aw/UQmKT+1l39uEhUPoFS3fHevDc1G0OvewyDudfMKY1OulczHzWIw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1275,9 +1273,9 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-systemjs": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.23.3.tgz",
-      "integrity": "sha512-ZxyKGTkF9xT9YJuKQRo19ewf3pXpopuYQd8cDXqNzc3mUNbOME0RKMoZxviQk74hwzfQsEe66dE92MaZbdHKNQ==",
+      "version": "7.23.9",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.23.9.tgz",
+      "integrity": "sha512-KDlPRM6sLo4o1FkiSlXoAa8edLXFsKKIda779fbLrvmeuc3itnjCtaO6RrtoaANsIJANj+Vk1zqbZIMhkCAHVw==",
       "dev": true,
       "dependencies": {
         "@babel/helper-hoist-variables": "^7.22.5",
@@ -1372,14 +1370,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-object-rest-spread": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.23.4.tgz",
-      "integrity": "sha512-9x9K1YyeQVw0iOXJlIzwm8ltobIIv7j2iLyP2jIhEbqPRQ7ScNgwQufU2I0Gq11VjyG4gI4yMXt2VFags+1N3g==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.24.0.tgz",
+      "integrity": "sha512-y/yKMm7buHpFFXfxVFS4Vk1ToRJDilIa6fKRioB9Vjichv58TDGXTvqV0dN7plobAmTW5eSEGXDngE+Mm+uO+w==",
       "dev": true,
       "dependencies": {
-        "@babel/compat-data": "^7.23.3",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/compat-data": "^7.23.5",
+        "@babel/helper-compilation-targets": "^7.23.6",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
         "@babel/plugin-transform-parameters": "^7.23.3"
       },
@@ -1535,16 +1533,16 @@
       }
     },
     "node_modules/@babel/plugin-transform-runtime": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.23.4.tgz",
-      "integrity": "sha512-ITwqpb6V4btwUG0YJR82o2QvmWrLgDnx/p2A3CTPYGaRgULkDiC0DRA2C4jlRB9uXGUEfaSS/IGHfVW+ohzYDw==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.24.0.tgz",
+      "integrity": "sha512-zc0GA5IitLKJrSfXlXmp8KDqLrnGECK7YRfQBmEKg1NmBOQ7e+KuclBEKJgzifQeUYLdNiAw4B4bjyvzWVLiSA==",
       "dev": true,
       "dependencies": {
         "@babel/helper-module-imports": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "babel-plugin-polyfill-corejs2": "^0.4.6",
-        "babel-plugin-polyfill-corejs3": "^0.8.5",
-        "babel-plugin-polyfill-regenerator": "^0.5.3",
+        "@babel/helper-plugin-utils": "^7.24.0",
+        "babel-plugin-polyfill-corejs2": "^0.4.8",
+        "babel-plugin-polyfill-corejs3": "^0.9.0",
+        "babel-plugin-polyfill-regenerator": "^0.5.5",
         "semver": "^6.3.1"
       },
       "engines": {
@@ -1703,18 +1701,18 @@
       }
     },
     "node_modules/@babel/preset-env": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.23.5.tgz",
-      "integrity": "sha512-0d/uxVD6tFGWXGDSfyMD1p2otoaKmu6+GD+NfAx0tMaH+dxORnp7T9TaVQ6mKyya7iBtCIVxHjWT7MuzzM9z+A==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.24.0.tgz",
+      "integrity": "sha512-ZxPEzV9IgvGn73iK0E6VB9/95Nd7aMFpbE0l8KQFDG70cOV9IxRP7Y2FUPmlK0v6ImlLqYX50iuZ3ZTVhOF2lA==",
       "dev": true,
       "dependencies": {
         "@babel/compat-data": "^7.23.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-compilation-targets": "^7.23.6",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-validator-option": "^7.23.5",
         "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.23.3",
         "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.23.3",
-        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.23.3",
+        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.23.7",
         "@babel/plugin-proposal-private-property-in-object": "7.21.0-placeholder-for-preset-env.2",
         "@babel/plugin-syntax-async-generators": "^7.8.4",
         "@babel/plugin-syntax-class-properties": "^7.12.13",
@@ -1735,13 +1733,13 @@
         "@babel/plugin-syntax-top-level-await": "^7.14.5",
         "@babel/plugin-syntax-unicode-sets-regex": "^7.18.6",
         "@babel/plugin-transform-arrow-functions": "^7.23.3",
-        "@babel/plugin-transform-async-generator-functions": "^7.23.4",
+        "@babel/plugin-transform-async-generator-functions": "^7.23.9",
         "@babel/plugin-transform-async-to-generator": "^7.23.3",
         "@babel/plugin-transform-block-scoped-functions": "^7.23.3",
         "@babel/plugin-transform-block-scoping": "^7.23.4",
         "@babel/plugin-transform-class-properties": "^7.23.3",
         "@babel/plugin-transform-class-static-block": "^7.23.4",
-        "@babel/plugin-transform-classes": "^7.23.5",
+        "@babel/plugin-transform-classes": "^7.23.8",
         "@babel/plugin-transform-computed-properties": "^7.23.3",
         "@babel/plugin-transform-destructuring": "^7.23.3",
         "@babel/plugin-transform-dotall-regex": "^7.23.3",
@@ -1749,7 +1747,7 @@
         "@babel/plugin-transform-dynamic-import": "^7.23.4",
         "@babel/plugin-transform-exponentiation-operator": "^7.23.3",
         "@babel/plugin-transform-export-namespace-from": "^7.23.4",
-        "@babel/plugin-transform-for-of": "^7.23.3",
+        "@babel/plugin-transform-for-of": "^7.23.6",
         "@babel/plugin-transform-function-name": "^7.23.3",
         "@babel/plugin-transform-json-strings": "^7.23.4",
         "@babel/plugin-transform-literals": "^7.23.3",
@@ -1757,13 +1755,13 @@
         "@babel/plugin-transform-member-expression-literals": "^7.23.3",
         "@babel/plugin-transform-modules-amd": "^7.23.3",
         "@babel/plugin-transform-modules-commonjs": "^7.23.3",
-        "@babel/plugin-transform-modules-systemjs": "^7.23.3",
+        "@babel/plugin-transform-modules-systemjs": "^7.23.9",
         "@babel/plugin-transform-modules-umd": "^7.23.3",
         "@babel/plugin-transform-named-capturing-groups-regex": "^7.22.5",
         "@babel/plugin-transform-new-target": "^7.23.3",
         "@babel/plugin-transform-nullish-coalescing-operator": "^7.23.4",
         "@babel/plugin-transform-numeric-separator": "^7.23.4",
-        "@babel/plugin-transform-object-rest-spread": "^7.23.4",
+        "@babel/plugin-transform-object-rest-spread": "^7.24.0",
         "@babel/plugin-transform-object-super": "^7.23.3",
         "@babel/plugin-transform-optional-catch-binding": "^7.23.4",
         "@babel/plugin-transform-optional-chaining": "^7.23.4",
@@ -1783,9 +1781,9 @@
         "@babel/plugin-transform-unicode-regex": "^7.23.3",
         "@babel/plugin-transform-unicode-sets-regex": "^7.23.3",
         "@babel/preset-modules": "0.1.6-no-external-plugins",
-        "babel-plugin-polyfill-corejs2": "^0.4.6",
-        "babel-plugin-polyfill-corejs3": "^0.8.5",
-        "babel-plugin-polyfill-regenerator": "^0.5.3",
+        "babel-plugin-polyfill-corejs2": "^0.4.8",
+        "babel-plugin-polyfill-corejs3": "^0.9.0",
+        "babel-plugin-polyfill-regenerator": "^0.5.5",
         "core-js-compat": "^3.31.0",
         "semver": "^6.3.1"
       },
@@ -1826,9 +1824,9 @@
       "dev": true
     },
     "node_modules/@babel/runtime": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.5.tgz",
-      "integrity": "sha512-NdUTHcPe4C99WxPub+K9l9tK5/lV4UXIoaHSYgzco9BCyjKAAwzdBI+wWtYqHt7LJdbo74ZjRPJgzVweq1sz0w==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.0.tgz",
+      "integrity": "sha512-Chk32uHMg6TnQdvw2e9IlqPpFX/6NLuK0Ys2PqLb7/gL5uFn9mXvK715FGLlOLQrcO4qIkNHkvPGktzzXexsFw==",
       "dev": true,
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
@@ -1838,34 +1836,34 @@
       }
     },
     "node_modules/@babel/template": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz",
-      "integrity": "sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.24.0.tgz",
+      "integrity": "sha512-Bkf2q8lMB0AFpX0NFEqSbx1OkTHf0f+0j82mkw+ZpzBnkk7e9Ql0891vlfgi+kHwOk8tQjiQHpqh4LaSa0fKEA==",
       "dev": true,
       "dependencies": {
-        "@babel/code-frame": "^7.22.13",
-        "@babel/parser": "^7.22.15",
-        "@babel/types": "^7.22.15"
+        "@babel/code-frame": "^7.23.5",
+        "@babel/parser": "^7.24.0",
+        "@babel/types": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/traverse": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.5.tgz",
-      "integrity": "sha512-czx7Xy5a6sapWWRx61m1Ke1Ra4vczu1mCTtJam5zRTBOonfdJ+S/B6HYmGYu3fJtr8GGET3si6IhgWVBhJ/m8w==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.24.0.tgz",
+      "integrity": "sha512-HfuJlI8qq3dEDmNU5ChzzpZRWq+oxCZQyMzIMEqLho+AQnhMnKQUzH6ydo3RBl/YjPCuk68Y6s0Gx0AeyULiWw==",
       "dev": true,
       "dependencies": {
         "@babel/code-frame": "^7.23.5",
-        "@babel/generator": "^7.23.5",
+        "@babel/generator": "^7.23.6",
         "@babel/helper-environment-visitor": "^7.22.20",
         "@babel/helper-function-name": "^7.23.0",
         "@babel/helper-hoist-variables": "^7.22.5",
         "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/parser": "^7.23.5",
-        "@babel/types": "^7.23.5",
-        "debug": "^4.1.0",
+        "@babel/parser": "^7.24.0",
+        "@babel/types": "^7.24.0",
+        "debug": "^4.3.1",
         "globals": "^11.1.0"
       },
       "engines": {
@@ -1873,9 +1871,9 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.5.tgz",
-      "integrity": "sha512-ON5kSOJwVO6xXVRTvOI0eOnWe7VdUcIpsovGo9U/Br4Ie4UVFQTboO2cYnDhAGU6Fp+UxSiT+pMft0SMHfuq6w==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.24.0.tgz",
+      "integrity": "sha512-+j7a5c253RfKh8iABBhywc8NSfP5LURe7Uh4qpsh6jc+aLJguvmIUBdjSdEMQv2bENrCR5MfRdjGo7vzS/ob7w==",
       "dev": true,
       "dependencies": {
         "@babel/helper-string-parser": "^7.23.4",
@@ -1937,9 +1935,9 @@
       }
     },
     "node_modules/@casl/ability": {
-      "version": "6.5.0",
-      "resolved": "https://registry.npmjs.org/@casl/ability/-/ability-6.5.0.tgz",
-      "integrity": "sha512-3guc94ugr5ylZQIpJTLz0CDfwNi0mxKVECj1vJUPAvs+Lwunh/dcuUjwzc4MHM9D8JOYX0XUZMEPedpB3vIbOw==",
+      "version": "6.7.0",
+      "resolved": "https://registry.npmjs.org/@casl/ability/-/ability-6.7.0.tgz",
+      "integrity": "sha512-NC51ha1nnfCMy88Gdk7cTBipv6n3QNo1yZA68EklsUIzWVDhTs9jJ5y70c3LpT6sN1GcUnGBP/cF7M2I4TkQ3w==",
       "dependencies": {
         "@ucast/mongo2js": "^1.3.0"
       },
@@ -1948,9 +1946,9 @@
       }
     },
     "node_modules/@casl/vue": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@casl/vue/-/vue-2.2.1.tgz",
-      "integrity": "sha512-1OeGhT4A7VBkEACacF2ZlHkPiFJvyFy9h2PhBnMoetFDojMHbrn3ZjKgL5zQ4wSIrTQo9KbbzG3f0uAei2GKCQ==",
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@casl/vue/-/vue-2.2.2.tgz",
+      "integrity": "sha512-xWy4i5+3+WuBgENVesPalRTKpSJZ2cEMXtbqjWjqj7FDvoeso7jT1pBVk9ujKlIRhgfVWGdCRb7XzeISi2VLcA==",
       "peerDependencies": {
         "@casl/ability": "^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.1.0 || ^6.0.0",
         "vue": "^3.0.0"
@@ -2059,9 +2057,9 @@
       }
     },
     "node_modules/@eslint/eslintrc/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
         "type-fest": "^0.20.2"
@@ -2095,22 +2093,22 @@
       }
     },
     "node_modules/@fastify/busboy": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@fastify/busboy/-/busboy-2.1.0.tgz",
-      "integrity": "sha512-+KpH+QxZU7O4675t3mnkQKcZZg56u+K/Ct2K+N2AZYNVK8kyeo/bI18tI8aPm3tvNNRyTWfj6s5tnGNlcbQRsA==",
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/@fastify/busboy/-/busboy-2.1.1.tgz",
+      "integrity": "sha512-vBZP4NlzfOlerQTnba4aqZoMhE/a9HY7HRqoOPaETQcSQuWEIyZMHGfVu6w9wGtGK5fED5qRs2DteVCjOH60sA==",
       "engines": {
         "node": ">=14"
       }
     },
     "node_modules/@firebase/analytics": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/@firebase/analytics/-/analytics-0.10.0.tgz",
-      "integrity": "sha512-Locv8gAqx0e+GX/0SI3dzmBY5e9kjVDtD+3zCFLJ0tH2hJwuCAiL+5WkHuxKj92rqQj/rvkBUCfA1ewlX2hehg==",
+      "version": "0.10.1",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics/-/analytics-0.10.1.tgz",
+      "integrity": "sha512-5mnH1aQa99J5lZMJwTNzIoRc4yGXHf+fOn+EoEWhCDA3XGPweGHcylCbqq+G1wVJmfILL57fohDMa8ftMZ+44g==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
+        "@firebase/component": "0.6.5",
+        "@firebase/installations": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2118,14 +2116,14 @@
       }
     },
     "node_modules/@firebase/analytics-compat": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/@firebase/analytics-compat/-/analytics-compat-0.2.6.tgz",
-      "integrity": "sha512-4MqpVLFkGK7NJf/5wPEEP7ePBJatwYpyjgJ+wQHQGHfzaCDgntOnl9rL2vbVGGKCnRqWtZDIWhctB86UWXaX2Q==",
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics-compat/-/analytics-compat-0.2.7.tgz",
+      "integrity": "sha512-17VCly4P0VFBDqaaal7m1nhyYQwsygtaTpSsnc51sFPRrr9XIYtnD8ficon9fneEGEoJQ2g7OtASvhwX9EbK8g==",
       "dependencies": {
-        "@firebase/analytics": "0.10.0",
+        "@firebase/analytics": "0.10.1",
         "@firebase/analytics-types": "0.8.0",
-        "@firebase/component": "0.6.4",
-        "@firebase/util": "1.9.3",
+        "@firebase/component": "0.6.5",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2148,25 +2146,25 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/app": {
-      "version": "0.9.25",
-      "resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.9.25.tgz",
-      "integrity": "sha512-fX22gL5USXhOK21Hlh3oTeOzQZ6th6S2JrjXNEpBARmwzuUkqmVGVdsOCIFYIsLpK0dQE3o8xZnLrRg5wnzZ/g==",
+      "version": "0.9.28",
+      "resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.9.28.tgz",
+      "integrity": "sha512-MS0+EtNixrwJbVDs5Bt/lhUhzeWGUtUoP6X+zYZck5GAZwI5g4F91noVA9oIXlFlpn6Q1xIbiaHA2GwGk7/7Ag==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "idb": "7.1.1",
         "tslib": "^2.1.0"
       }
     },
     "node_modules/@firebase/app-check": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/@firebase/app-check/-/app-check-0.8.1.tgz",
-      "integrity": "sha512-zi3vbM5tb/eGRWyiqf+1DXbxFu9Q07dnm46rweodgUpH9B8svxYkHfNwYWx7F5mjHU70SQDuaojH1We5ws9OKA==",
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check/-/app-check-0.8.2.tgz",
+      "integrity": "sha512-A2B5+ldOguYAeqW1quFN5qNdruSNRrg4W59ag1Eq6QzxuHNIkrE+TrapfrW/z5NYFjCxAYqr/unVCgmk80Dwcg==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2174,15 +2172,15 @@
       }
     },
     "node_modules/@firebase/app-check-compat": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/@firebase/app-check-compat/-/app-check-compat-0.3.8.tgz",
-      "integrity": "sha512-EaETtChR4UgMokJFw+r6jfcIyCTUZSe0a6ivF37D9MxlG9G3wzK1COyXgxoX96GzXmDPc2aubX4PxCrdVHhrnA==",
+      "version": "0.3.9",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-compat/-/app-check-compat-0.3.9.tgz",
+      "integrity": "sha512-7LxyupQ8XeEHRh72mO+tqm69kHT6KbWi2KtFMGedJ6tNbwzFzojcXESMKN8RpADXbYoQgY3loWMJjMx4r2Zt7w==",
       "dependencies": {
-        "@firebase/app-check": "0.8.1",
+        "@firebase/app-check": "0.8.2",
         "@firebase/app-check-types": "0.5.0",
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2210,14 +2208,14 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/app-compat": {
-      "version": "0.2.25",
-      "resolved": "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.2.25.tgz",
-      "integrity": "sha512-B/JtCp1FsTuzlh1tIGQpYM2AXps21/zlzpFsk5LRsROOTRhBcR2N45AyaONPFD06C0yS0Tw19foxADzHyOSC3A==",
+      "version": "0.2.28",
+      "resolved": "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.2.28.tgz",
+      "integrity": "sha512-Mr2NbeM1Oaayuw5unUAMzt+7/MN+e2uklT1l87D+ZLJl2UvhZAZmMt74GjEI9N3sDYKMeszSbszBqtJ1fGVafQ==",
       "dependencies": {
-        "@firebase/app": "0.9.25",
-        "@firebase/component": "0.6.4",
+        "@firebase/app": "0.9.28",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       }
     },
@@ -2237,15 +2235,15 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/auth": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/@firebase/auth/-/auth-1.5.1.tgz",
-      "integrity": "sha512-sVi7rq2YneLGJFqHa5S6nDfCHix9yuVV3RLhj/pWPlB4a36ofXal4E6PJwpeMc8uLjWEr1aovYN1jkXWNB6Avw==",
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/@firebase/auth/-/auth-1.6.1.tgz",
+      "integrity": "sha512-oOuQVOxtxKr+kTTqEkkI2qXIeGbkNLpA8FzO030LF4KXmMcETqsPaIqw7Aw1Y4Zl82l1qpZtpc4vN4Da2qZdfQ==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0",
-        "undici": "5.26.5"
+        "undici": "5.28.3"
       },
       "peerDependencies": {
         "@firebase/app": "0.x",
@@ -2258,16 +2256,16 @@
       }
     },
     "node_modules/@firebase/auth-compat": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/@firebase/auth-compat/-/auth-compat-0.5.1.tgz",
-      "integrity": "sha512-rgDZnrDoekRvtzXVji8Z61wxxkof6pTkjYEkybILrjM8tGP9tx4xa9qGpF4ax3AzF+rKr7mIa9NnoXEK4UNqmQ==",
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-compat/-/auth-compat-0.5.3.tgz",
+      "integrity": "sha512-2pVtVEvu8P7SF6jSPfLPKWUClQFj+StqAZ0fD/uQ6mv8DyWn7AuuANFEu7Pv96JPcaL6Gy9jC5dFqjpptjqSRA==",
       "dependencies": {
-        "@firebase/auth": "1.5.1",
+        "@firebase/auth": "1.6.1",
         "@firebase/auth-types": "0.12.0",
-        "@firebase/component": "0.6.4",
-        "@firebase/util": "1.9.3",
+        "@firebase/component": "0.6.5",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0",
-        "undici": "5.26.5"
+        "undici": "5.28.3"
       },
       "peerDependencies": {
         "@firebase/app-compat": "0.x"
@@ -2298,11 +2296,11 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/component": {
-      "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/@firebase/component/-/component-0.6.4.tgz",
-      "integrity": "sha512-rLMyrXuO9jcAUCaQXCMjCMUsWrba5fzHlNK24xz5j2W6A/SRmK8mZJ/hn7V0fViLbxC0lPMtrK1eYzk6Fg03jA==",
+      "version": "0.6.5",
+      "resolved": "https://registry.npmjs.org/@firebase/component/-/component-0.6.5.tgz",
+      "integrity": "sha512-2tVDk1ixi12sbDmmfITK8lxSjmcb73BMF6Qwc3U44hN/J1Fi1QY/Hnnb6klFlbB9/G16a3J3d4nXykye2EADTw==",
       "dependencies": {
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       }
     },
@@ -2312,29 +2310,29 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/database": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@firebase/database/-/database-1.0.2.tgz",
-      "integrity": "sha512-8X6NBJgUQzDz0xQVaCISoOLINKat594N2eBbMR3Mu/MH/ei4WM+aAMlsNzngF22eljXu1SILP5G3evkyvsG3Ng==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@firebase/database/-/database-1.0.3.tgz",
+      "integrity": "sha512-9fjqLt9JzL46gw9+NRqsgQEMjgRwfd8XtzcKqG+UYyhVeFCdVRQ0Wp6Dw/dvYHnbH5vNEKzNv36dcB4p+PIAAA==",
       "dependencies": {
         "@firebase/app-check-interop-types": "0.3.0",
         "@firebase/auth-interop-types": "0.2.1",
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "faye-websocket": "0.11.4",
         "tslib": "^2.1.0"
       }
     },
     "node_modules/@firebase/database-compat": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@firebase/database-compat/-/database-compat-1.0.2.tgz",
-      "integrity": "sha512-09ryJnXDvuycsxn8aXBzLhBTuCos3HEnCOBWY6hosxfYlNCGnLvG8YMlbSAt5eNhf7/00B095AEfDsdrrLjxqA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@firebase/database-compat/-/database-compat-1.0.3.tgz",
+      "integrity": "sha512-7tHEOcMbK5jJzHWyphPux4osogH/adWwncxdMxdBpB9g1DNIyY4dcz1oJdlkXGM/i/AjUBesZsd5CuwTRTBNTw==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/database": "1.0.2",
-        "@firebase/database-types": "1.0.0",
+        "@firebase/component": "0.6.5",
+        "@firebase/database": "1.0.3",
+        "@firebase/database-types": "1.0.1",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       }
     },
@@ -2344,12 +2342,12 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/database-types": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@firebase/database-types/-/database-types-1.0.0.tgz",
-      "integrity": "sha512-SjnXStoE0Q56HcFgNQ+9SsmJc0c8TqGARdI/T44KXy+Ets3r6x/ivhQozT66bMnCEjJRywYoxNurRTMlZF8VNg==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@firebase/database-types/-/database-types-1.0.1.tgz",
+      "integrity": "sha512-Tmcmx5XgiI7UVF/4oGg2P3AOTfq3WKEPsm2yf+uXtN7uG/a4WTWhVMrXGYRY2ZUL1xPxv9V33wQRJ+CcrUhVXw==",
       "dependencies": {
         "@firebase/app-types": "0.9.0",
-        "@firebase/util": "1.9.3"
+        "@firebase/util": "1.9.4"
       }
     },
     "node_modules/@firebase/database/node_modules/tslib": {
@@ -2358,18 +2356,18 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/firestore": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-4.4.0.tgz",
-      "integrity": "sha512-VeDXD9PUjvcWY1tInBOMTIu2pijR3YYy+QAe5cxCo1Q1vW+aA/mpQHhebPM1J6b4Zd1MuUh8xpBRvH9ujKR56A==",
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-4.4.3.tgz",
+      "integrity": "sha512-Ix61zbeuTsHf0WFbk6+67n89Vzd9M8MMTdnz7c7z+BRE3BS5Vuc3gX5ZcHFjqPkQJ7rpLB1egHsYe4Przp5C2g==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "@firebase/webchannel-wrapper": "0.10.5",
         "@grpc/grpc-js": "~1.9.0",
         "@grpc/proto-loader": "^0.7.8",
         "tslib": "^2.1.0",
-        "undici": "5.26.5"
+        "undici": "5.28.3"
       },
       "engines": {
         "node": ">=10.10.0"
@@ -2379,14 +2377,14 @@
       }
     },
     "node_modules/@firebase/firestore-compat": {
-      "version": "0.3.23",
-      "resolved": "https://registry.npmjs.org/@firebase/firestore-compat/-/firestore-compat-0.3.23.tgz",
-      "integrity": "sha512-uUTBiP0GLVBETaOCfB11d33OWB8x1r2G1Xrl0sRK3Va0N5LJ/GRvKVSGfM7VScj+ypeHe8RpdwKoCqLpN1e+uA==",
+      "version": "0.3.26",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore-compat/-/firestore-compat-0.3.26.tgz",
+      "integrity": "sha512-dNrKiH5Cn6ItANV9nJI2Y0msKBj/skO7skDlRo/BUSQE1DKbNzumxpJEz+PK/PV1nTegnRgVvs47gpQeVWXtYQ==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/firestore": "4.4.0",
+        "@firebase/component": "0.6.5",
+        "@firebase/firestore": "4.4.3",
         "@firebase/firestore-types": "3.0.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2413,31 +2411,31 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/functions": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@firebase/functions/-/functions-0.11.0.tgz",
-      "integrity": "sha512-n1PZxKnJ++k73Q8khTPwihlbeKo6emnGzE0hX6QVQJsMq82y/XKmNpw2t/q30VJgwaia3ZXU1fd1C5wHncL+Zg==",
+      "version": "0.11.2",
+      "resolved": "https://registry.npmjs.org/@firebase/functions/-/functions-0.11.2.tgz",
+      "integrity": "sha512-2NULTYOZbu0rXczwfYdqQH0w1FmmYrKjTy1YPQSHLCAkMBdfewoKmVm4Lyo2vRn0H9ZndciLY7NszKDFt9MKCQ==",
       "dependencies": {
         "@firebase/app-check-interop-types": "0.3.0",
         "@firebase/auth-interop-types": "0.2.1",
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/messaging-interop-types": "0.2.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0",
-        "undici": "5.26.5"
+        "undici": "5.28.3"
       },
       "peerDependencies": {
         "@firebase/app": "0.x"
       }
     },
     "node_modules/@firebase/functions-compat": {
-      "version": "0.3.6",
-      "resolved": "https://registry.npmjs.org/@firebase/functions-compat/-/functions-compat-0.3.6.tgz",
-      "integrity": "sha512-RQpO3yuHtnkqLqExuAT2d0u3zh8SDbeBYK5EwSCBKI9mjrFeJRXBnd3pEG+x5SxGJLy56/5pQf73mwt0OuH5yg==",
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/@firebase/functions-compat/-/functions-compat-0.3.8.tgz",
+      "integrity": "sha512-VDHSw6UOu8RxfgAY/q8e+Jn+9Fh60Fc28yck0yfMsi2e0BiWgonIMWkFspFGGLgOJebTHl+hc+9v91rhzU6xlg==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/functions": "0.11.0",
+        "@firebase/component": "0.6.5",
+        "@firebase/functions": "0.11.2",
         "@firebase/functions-types": "0.6.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2460,13 +2458,13 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/installations": {
-      "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/@firebase/installations/-/installations-0.6.4.tgz",
-      "integrity": "sha512-u5y88rtsp7NYkCHC3ElbFBrPtieUybZluXyzl7+4BsIz4sqb4vSAuwHEUgCgCeaQhvsnxDEU6icly8U9zsJigA==",
+      "version": "0.6.5",
+      "resolved": "https://registry.npmjs.org/@firebase/installations/-/installations-0.6.5.tgz",
+      "integrity": "sha512-0xxnQWw8rSRzu0ZOCkZaO+MJ0LkDAfwwTB2Z1SxRK6FAz5xkxD1ZUwM0WbCRni49PKubCrZYOJ6yg7tSjU7AKA==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/util": "1.9.3",
-        "idb": "7.0.1",
+        "@firebase/component": "0.6.5",
+        "@firebase/util": "1.9.4",
+        "idb": "7.1.1",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2474,14 +2472,14 @@
       }
     },
     "node_modules/@firebase/installations-compat": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@firebase/installations-compat/-/installations-compat-0.2.4.tgz",
-      "integrity": "sha512-LI9dYjp0aT9Njkn9U4JRrDqQ6KXeAmFbRC0E7jI7+hxl5YmRWysq5qgQl22hcWpTk+cm3es66d/apoDU/A9n6Q==",
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/@firebase/installations-compat/-/installations-compat-0.2.5.tgz",
+      "integrity": "sha512-usvoIaog5CHEw082HXLrKAZ1qd4hIC3N/LDe2NqBgI3pkGE/7auLVM4Gn5gvyryp0x8z/IP1+d9fkGUj2OaGLQ==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
+        "@firebase/component": "0.6.5",
+        "@firebase/installations": "0.6.5",
         "@firebase/installations-types": "0.5.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2501,11 +2499,6 @@
         "@firebase/app-types": "0.x"
       }
     },
-    "node_modules/@firebase/installations/node_modules/idb": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/idb/-/idb-7.0.1.tgz",
-      "integrity": "sha512-UUxlE7vGWK5RfB/fDwEGgRf84DY/ieqNha6msMV99UsEMQhJ1RwbCd8AYBj3QMgnE3VZnfQvm4oKVCJTYlqIgg=="
-    },
     "node_modules/@firebase/installations/node_modules/tslib": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
@@ -2525,14 +2518,14 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/messaging": {
-      "version": "0.12.5",
-      "resolved": "https://registry.npmjs.org/@firebase/messaging/-/messaging-0.12.5.tgz",
-      "integrity": "sha512-i/rrEI2k9ueFhdIr8KQsptWGskrsnkC5TkohCTrJKz9P0C/PbNv14IAMkwhMJTqIur5VwuOnrUkc9Kdz7awekw==",
+      "version": "0.12.6",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging/-/messaging-0.12.6.tgz",
+      "integrity": "sha512-IORsPp9IPWq4j4yEhTOZ6GAGi3gQwGc+4yexmTAlya+qeBRSdRnJg2iIU/aj+tcKDQYr9RQuQPgHHOdFIx//vA==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
+        "@firebase/component": "0.6.5",
+        "@firebase/installations": "0.6.5",
         "@firebase/messaging-interop-types": "0.2.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "idb": "7.1.1",
         "tslib": "^2.1.0"
       },
@@ -2541,13 +2534,13 @@
       }
     },
     "node_modules/@firebase/messaging-compat": {
-      "version": "0.2.5",
-      "resolved": "https://registry.npmjs.org/@firebase/messaging-compat/-/messaging-compat-0.2.5.tgz",
-      "integrity": "sha512-qHQZxm4hEG8/HFU/ls5/bU+rpnlPDoZoqi3ATMeb6s4hovYV9+PfV5I7ZrKV5eFFv47Hx1PWLe5uPnS4e7gMwQ==",
+      "version": "0.2.6",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging-compat/-/messaging-compat-0.2.6.tgz",
+      "integrity": "sha512-Q2xC1s4L7Vpss7P7Gy6GuIS+xmJrf/vm9+gX76IK1Bo1TjoKwleCLHt1LHkPz5Rvqg5pTgzzI8qqPhBpZosFCg==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/messaging": "0.12.5",
-        "@firebase/util": "1.9.3",
+        "@firebase/component": "0.6.5",
+        "@firebase/messaging": "0.12.6",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2570,14 +2563,14 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/performance": {
-      "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/@firebase/performance/-/performance-0.6.4.tgz",
-      "integrity": "sha512-HfTn/bd8mfy/61vEqaBelNiNnvAbUtME2S25A67Nb34zVuCSCRIX4SseXY6zBnOFj3oLisaEqhVcJmVPAej67g==",
+      "version": "0.6.5",
+      "resolved": "https://registry.npmjs.org/@firebase/performance/-/performance-0.6.5.tgz",
+      "integrity": "sha512-OzAGcWhOqEFH9GdwUuY0oC5FSlnMejcnmSAhR+EjpI7exdDvixyLyCR4txjSHYNTbumrFBG+EP8GO11CNXRaJA==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
+        "@firebase/component": "0.6.5",
+        "@firebase/installations": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2585,15 +2578,15 @@
       }
     },
     "node_modules/@firebase/performance-compat": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@firebase/performance-compat/-/performance-compat-0.2.4.tgz",
-      "integrity": "sha512-nnHUb8uP9G8islzcld/k6Bg5RhX62VpbAb/Anj7IXs/hp32Eb2LqFPZK4sy3pKkBUO5wcrlRWQa6wKOxqlUqsg==",
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/@firebase/performance-compat/-/performance-compat-0.2.5.tgz",
+      "integrity": "sha512-jJwJkVyDcIMBaVGrZ6CRGs4m5FCZsWB5QCWYI3FdsHyIa9/TfteNDilxj9wGciF2naFIHDW7TgE69U5dAH9Ktg==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/performance": "0.6.4",
+        "@firebase/performance": "0.6.5",
         "@firebase/performance-types": "0.2.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2616,14 +2609,14 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/remote-config": {
-      "version": "0.4.4",
-      "resolved": "https://registry.npmjs.org/@firebase/remote-config/-/remote-config-0.4.4.tgz",
-      "integrity": "sha512-x1ioTHGX8ZwDSTOVp8PBLv2/wfwKzb4pxi0gFezS5GCJwbLlloUH4YYZHHS83IPxnua8b6l0IXUaWd0RgbWwzQ==",
+      "version": "0.4.5",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config/-/remote-config-0.4.5.tgz",
+      "integrity": "sha512-rGLqc/4OmxrS39RA9kgwa6JmgWytQuMo+B8pFhmGp3d++x2Hf9j+MLQfhOLyyUo64fNw20J19mLXhrXvKHsjZQ==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
+        "@firebase/component": "0.6.5",
+        "@firebase/installations": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2631,15 +2624,15 @@
       }
     },
     "node_modules/@firebase/remote-config-compat": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@firebase/remote-config-compat/-/remote-config-compat-0.2.4.tgz",
-      "integrity": "sha512-FKiki53jZirrDFkBHglB3C07j5wBpitAaj8kLME6g8Mx+aq7u9P7qfmuSRytiOItADhWUj7O1JIv7n9q87SuwA==",
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config-compat/-/remote-config-compat-0.2.5.tgz",
+      "integrity": "sha512-ImkNnLuGrD/bylBHDJigSY6LMwRrwt37wQbsGZhWG4QQ6KLzHzSf0nnFRRFvkOZodEUE57Ib8l74d6Yn/6TDUQ==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
+        "@firebase/component": "0.6.5",
         "@firebase/logger": "0.4.0",
-        "@firebase/remote-config": "0.4.4",
+        "@firebase/remote-config": "0.4.5",
         "@firebase/remote-config-types": "0.3.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2662,28 +2655,28 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/storage": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/@firebase/storage/-/storage-0.12.0.tgz",
-      "integrity": "sha512-SGs02Y/mmWBRsqZiYLpv4Sf7uZYZzMWVNN+aKiDqPsFBCzD6hLvGkXz+u98KAl8FqcjgB8BtSu01wm4pm76KHA==",
+      "version": "0.12.2",
+      "resolved": "https://registry.npmjs.org/@firebase/storage/-/storage-0.12.2.tgz",
+      "integrity": "sha512-MzanOBcxDx9oOwDaDPMuiYxd6CxcN1xZm+os5uNE3C1itbRKLhM9rzpODDKWzcbnHHFtXk3Q3lsK/d3Xa1WYYw==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/util": "1.9.3",
+        "@firebase/component": "0.6.5",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0",
-        "undici": "5.26.5"
+        "undici": "5.28.3"
       },
       "peerDependencies": {
         "@firebase/app": "0.x"
       }
     },
     "node_modules/@firebase/storage-compat": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/@firebase/storage-compat/-/storage-compat-0.3.3.tgz",
-      "integrity": "sha512-WNtjYPhpOA1nKcRu5lIodX0wZtP8pI0VxDJnk6lr+av7QZNS1s6zvr+ERDTve+Qu4Hq/ZnNaf3kBEQR2ccXn6A==",
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/@firebase/storage-compat/-/storage-compat-0.3.5.tgz",
+      "integrity": "sha512-5dJXfY5NxCF5NAk4dLvJqC+m6cgcf0Fr29nrMHwhwI34pBheQq2PdRZqALsqZCES9dnHTuFNlqGQDpLr+Ph4rw==",
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/storage": "0.12.0",
+        "@firebase/component": "0.6.5",
+        "@firebase/storage": "0.12.2",
         "@firebase/storage-types": "0.8.0",
-        "@firebase/util": "1.9.3",
+        "@firebase/util": "1.9.4",
         "tslib": "^2.1.0"
       },
       "peerDependencies": {
@@ -2710,9 +2703,9 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@firebase/util": {
-      "version": "1.9.3",
-      "resolved": "https://registry.npmjs.org/@firebase/util/-/util-1.9.3.tgz",
-      "integrity": "sha512-DY02CRhOZwpzO36fHpuVysz6JZrscPiBXD0fXp6qSrL9oNOx5KWICKdR95C0lSITzxp0TZosVyHqzatE8JbcjA==",
+      "version": "1.9.4",
+      "resolved": "https://registry.npmjs.org/@firebase/util/-/util-1.9.4.tgz",
+      "integrity": "sha512-WLonYmS1FGHT97TsUmRN3qnTh5TeeoJp1Gg5fithzuAgdZOUtsYECfy7/noQ3llaguios8r5BuXSEiK82+UrxQ==",
       "dependencies": {
         "tslib": "^2.1.0"
       }
@@ -2728,9 +2721,9 @@
       "integrity": "sha512-eSkJsnhBWv5kCTSU1tSUVl9mpFu+5NXXunZc83le8GMjMlsWwQArSc7cJJ4yl+aDFY0NGLi0AjZWMn1axOrkRg=="
     },
     "node_modules/@grpc/grpc-js": {
-      "version": "1.9.12",
-      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.12.tgz",
-      "integrity": "sha512-Um5MBuge32TS3lAKX02PGCnFM4xPT996yLgZNb5H03pn6NyJ4Iwn5YcPq6Jj9yxGRk7WOgaZFtVRH5iTdYBeUg==",
+      "version": "1.9.14",
+      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.14.tgz",
+      "integrity": "sha512-nOpuzZ2G3IuMFN+UPPpKrC6NsLmWsTqSsm66IRfnBt1D4pwTqE27lmbpcPM+l2Ua4gE7PfjRHI6uedAy7hoXUw==",
       "dependencies": {
         "@grpc/proto-loader": "^0.7.8",
         "@types/node": ">=12.12.47"
@@ -2815,26 +2808,24 @@
       "integrity": "sha512-PnJTqTbFvvl9N23yi1DjL4aNmTkpYFrayyoJyfH1qDJXADFbQ9kB7gJmKcfiPpyYMGR86Yf3Is5ct0+wReUJGQ=="
     },
     "node_modules/@hotwax/apps-theme": {
-      "version": "1.2.5",
-      "resolved": "https://registry.npmjs.org/@hotwax/apps-theme/-/apps-theme-1.2.5.tgz",
-      "integrity": "sha512-3Vec4pGWJVs6vDbL/pO5hYqoF1zn2w8liXuleqDJ7waI2R5JuF2eaJmYcUQETnk/DZIg47bDdyOSxihQltB2Ow=="
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/@hotwax/apps-theme/-/apps-theme-1.2.6.tgz",
+      "integrity": "sha512-zpUjGoY7LBlKeiP0V7tonrmoey8HQ5THQmyixQ+IDtrjmEJNBjynW/Ef3gC0FUNNPuVqxWPZdT5CVgaETLGTwg=="
     },
     "node_modules/@hotwax/dxp-components": {
-      "version": "1.11.0",
-      "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.11.0.tgz",
-      "integrity": "sha512-z9UNzi1veT8Aj8Y1WWAGBGOR+I0s6A58qrsFj+L3LkpxTkq6zGN/JS80tTv29obEeeOfONm6XyLHvNOM6TFKyA==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.12.1.tgz",
+      "integrity": "sha512-5soKaVBFd7klZnHBCi68j4CZwTlrBCzvPsyd+wHMbenezU+lOwMK0ftdWXrQcQPedeGdVtQXvvgSPWnLL310bg==",
       "dependencies": {
         "@hotwax/oms-api": "^1.8.1",
-        "@ionic/core": "^6.7.5",
-        "@ionic/vue": "^6.7.5",
-        "@types/vue-barcode-reader": "^0.0.0",
+        "@ionic/core": "^7.6.0",
+        "@ionic/vue": "^7.6.0",
         "firebase": "^10.3.1",
         "luxon": "^3.3.0",
         "pinia": "2.0.36",
         "pinia-plugin-persistedstate": "^3.1.0",
         "register-service-worker": "^1.7.2",
         "vue": "^3.3.4",
-        "vue-barcode-reader": "^1.0.3",
         "vue-i18n": "^9.2.2"
       }
     },
@@ -2847,12 +2838,12 @@
       }
     },
     "node_modules/@hotwax/dxp-components/node_modules/vue-i18n": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.8.0.tgz",
-      "integrity": "sha512-Izho+6PYjejsTq2mzjcRdBZ5VLRQoSuuexvR8029h5CpN03FYqiqBrShMyf2I1DKkN6kw/xmujcbvC+4QybpsQ==",
+      "version": "9.10.1",
+      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.10.1.tgz",
+      "integrity": "sha512-37HVJQZ/pZaRXGzFmmMomM1u1k7kndv3xCBPYHKEVfv5W3UVK67U/TpBug71ILYLNmjHLHdvTUPRF81pFT5fFg==",
       "dependencies": {
-        "@intlify/core-base": "9.8.0",
-        "@intlify/shared": "9.8.0",
+        "@intlify/core-base": "9.10.1",
+        "@intlify/shared": "9.10.1",
         "@vue/devtools-api": "^6.5.0"
       },
       "engines": {
@@ -2866,9 +2857,9 @@
       }
     },
     "node_modules/@hotwax/oms-api": {
-      "version": "1.11.0",
-      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.11.0.tgz",
-      "integrity": "sha512-HQCXuADMVkQXAS9ClWFrTYNjSFP8wQuGMILEkLDh9R2YR1gNnJ4GezeZuxXQOjhxBg7zXxbdL3v5/q03P32O5g==",
+      "version": "1.12.0",
+      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.12.0.tgz",
+      "integrity": "sha512-c+dHeTbPV7QVcFBmaMth8lK0/vrNScq7hq8nc9tBKtp6S5SbhE4c6e/hFL4uYOnHJ3ME1DqXc5/3fodA0zs41Q==",
       "dependencies": {
         "@types/node-json-transform": "^1.0.0",
         "axios": "^0.21.1",
@@ -2917,13 +2908,13 @@
       }
     },
     "node_modules/@intlify/core": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/@intlify/core/-/core-9.8.0.tgz",
-      "integrity": "sha512-xd+3cxvMuasZh3b+cxsB98ZAC2SPfbSTuK8q0nJg2NfOuAcj62FKBkFG72lsvGz5MzppTlOQuLkacrCvltA8sA==",
+      "version": "9.10.1",
+      "resolved": "https://registry.npmjs.org/@intlify/core/-/core-9.10.1.tgz",
+      "integrity": "sha512-BlvvtwyLkuVATbavQntR/aJPQx6qtUdFVd+eiL9FOcRJnb1CFzGfBH6S8AQz/EULZVFB3LgoHZLvuUfVm6FRYw==",
       "dev": true,
       "dependencies": {
-        "@intlify/core-base": "9.8.0",
-        "@intlify/shared": "9.8.0"
+        "@intlify/core-base": "9.10.1",
+        "@intlify/shared": "9.10.1"
       },
       "engines": {
         "node": ">= 16"
@@ -2933,12 +2924,12 @@
       }
     },
     "node_modules/@intlify/core-base": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.8.0.tgz",
-      "integrity": "sha512-UxaSZVZ1DwqC/CltUZrWZNaWNhfmKtfyV4BJSt/Zt4Or/fZs1iFj0B+OekYk1+MRHfIOe3+x00uXGQI4PbO/9g==",
+      "version": "9.10.1",
+      "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.10.1.tgz",
+      "integrity": "sha512-0+Wtjj04GIyglh5KKiNjRwgjpHrhqqGZhaKY/QVjjogWKZq5WHROrTi84pNVsRN18QynyPmjtsVUWqFKPQ45xQ==",
       "dependencies": {
-        "@intlify/message-compiler": "9.8.0",
-        "@intlify/shared": "9.8.0"
+        "@intlify/message-compiler": "9.10.1",
+        "@intlify/shared": "9.10.1"
       },
       "engines": {
         "node": ">= 16"
@@ -2967,11 +2958,11 @@
       }
     },
     "node_modules/@intlify/message-compiler": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.8.0.tgz",
-      "integrity": "sha512-McnYWhcoYmDJvssVu6QGR0shqlkJuL1HHdi5lK7fNqvQqRYaQ4lSLjYmZxwc8tRNMdIe9/KUKfyPxU9M6yCtNQ==",
+      "version": "9.10.1",
+      "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.10.1.tgz",
+      "integrity": "sha512-b68UTmRhgZfswJZI7VAgW6BXZK5JOpoi5swMLGr4j6ss2XbFY13kiw+Hu+xYAfulMPSapcHzdWHnq21VGnMCnA==",
       "dependencies": {
-        "@intlify/shared": "9.8.0",
+        "@intlify/shared": "9.10.1",
         "source-map-js": "^1.0.2"
       },
       "engines": {
@@ -3024,9 +3015,9 @@
       }
     },
     "node_modules/@intlify/shared": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.8.0.tgz",
-      "integrity": "sha512-TmgR0RCLjzrSo+W3wT0ALf9851iFMlVI9EYNGeWvZFUQTAJx0bvfsMlPdgVtV1tDNRiAfhkFsMKu6jtUY1ZLKQ==",
+      "version": "9.10.1",
+      "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.10.1.tgz",
+      "integrity": "sha512-liyH3UMoglHBUn70iCYcy9CQlInx/lp50W2aeSxqqrvmG+LDj/Jj7tBJhBoQL4fECkldGhbmW0g2ommHfL6Wmw==",
       "engines": {
         "node": ">= 16"
       },
@@ -3073,12 +3064,12 @@
       }
     },
     "node_modules/@ionic/core": {
-      "version": "6.7.5",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-6.7.5.tgz",
-      "integrity": "sha512-zRkRn+h/Vs3xt/EVgBdShMKDyeGOM4RU31NPF2icfu3CUTH+VrMV569MUnNjYvd1Lu2xK90pYy4TaicSWmC1Pw==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.6.0.tgz",
+      "integrity": "sha512-pDX8G915puz8OcLhxfb9MwuvpYZsUOCngJdd+61ibJ6UF+NA2mGatsMqHKzcgelTXtwcHDpi9ZLUD/HNmupqaQ==",
       "dependencies": {
-        "@stencil/core": "^2.18.0",
-        "ionicons": "^6.1.3",
+        "@stencil/core": "^4.8.1",
+        "ionicons": "^7.2.1",
         "tslib": "^2.1.0"
       }
     },
@@ -3088,20 +3079,20 @@
       "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
     },
     "node_modules/@ionic/vue": {
-      "version": "6.7.5",
-      "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-6.7.5.tgz",
-      "integrity": "sha512-6JBEaHCT2vVUzYqyfBiEUN8Wo7FezxY5Y3n+HGqI61J4qVay+8IxZRTYeX+O72QglbYOkzvfjE6SgS25oS+S9A==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-7.6.0.tgz",
+      "integrity": "sha512-2CWLcVNS8kLQ6BK4UmRdc7a0HSsS6MqyTQh7+0qT88z+Ih05dCcZ3CiJ27F3F2a7jsOi48ggXt97zOpBbZENlg==",
       "dependencies": {
-        "@ionic/core": "6.7.5",
-        "ionicons": "^6.1.3"
+        "@ionic/core": "7.6.0",
+        "ionicons": "^7.0.0"
       }
     },
     "node_modules/@ionic/vue-router": {
-      "version": "6.7.5",
-      "resolved": "https://registry.npmjs.org/@ionic/vue-router/-/vue-router-6.7.5.tgz",
-      "integrity": "sha512-nupLaWFARdy5vOCNg2xw6YpecaR/hPEew+tWjUJE1INlwvB88o7Uct/R480vqFj3fB436W4O4ViJd4/g0ZBZ8A==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/@ionic/vue-router/-/vue-router-7.6.0.tgz",
+      "integrity": "sha512-grzMyURlZX3EqkQFBXeKuhxN2psbNKAI8CVwPi56xRPwCvSp32KFYtGxj20k1QBl+Kzg7/RbxTERArxZRtPWJw==",
       "dependencies": {
-        "@ionic/vue": "6.7.5"
+        "@ionic/vue": "7.6.0"
       }
     },
     "node_modules/@isaacs/cliui": {
@@ -3201,32 +3192,32 @@
       }
     },
     "node_modules/@jridgewell/gen-mapping": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
-      "integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==",
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
+      "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==",
       "dev": true,
       "dependencies": {
-        "@jridgewell/set-array": "^1.0.1",
+        "@jridgewell/set-array": "^1.2.1",
         "@jridgewell/sourcemap-codec": "^1.4.10",
-        "@jridgewell/trace-mapping": "^0.3.9"
+        "@jridgewell/trace-mapping": "^0.3.24"
       },
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/resolve-uri": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz",
-      "integrity": "sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
       "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/set-array": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz",
-      "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
+      "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
       "dev": true,
       "engines": {
         "node": ">=6.0.0"
@@ -3248,9 +3239,9 @@
       "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
     },
     "node_modules/@jridgewell/trace-mapping": {
-      "version": "0.3.20",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.20.tgz",
-      "integrity": "sha512-R8LcPeWZol2zR8mmH3JeKQ6QRCFb7XgUhV9ZlGhHLGyg4wpPiPZNQOOWhFZhxKw8u//yTbNGI42Bx/3paXEQ+Q==",
+      "version": "0.3.25",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
+      "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
       "dev": true,
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
@@ -3481,9 +3472,9 @@
       "dev": true
     },
     "node_modules/@sideway/address": {
-      "version": "4.1.4",
-      "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.4.tgz",
-      "integrity": "sha512-7vwq+rOHVWjyXxVlR76Agnvhy8I9rpzjosTESvmhNeXOXdZZB15Fl+TI9x1SiHZH5Jv2wTGduSxFDIaq0m3DUw==",
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.5.tgz",
+      "integrity": "sha512-IqO/DUQHUkPeixNQ8n0JA6102hT9CmaljNTPmQ1u8MEhBo/R4Q8eKLN/vGZxuebwOroDB4cbpjheD4+/sKFK4Q==",
       "dev": true,
       "dependencies": {
         "@hapi/hoek": "^9.0.0"
@@ -3593,15 +3584,15 @@
       "dev": true
     },
     "node_modules/@stencil/core": {
-      "version": "2.22.3",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-2.22.3.tgz",
-      "integrity": "sha512-kmVA0M/HojwsfkeHsifvHVIYe4l5tin7J5+DLgtl8h6WWfiMClND5K3ifCXXI2ETDNKiEk21p6jql3Fx9o2rng==",
+      "version": "4.12.5",
+      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.5.tgz",
+      "integrity": "sha512-vSyFjY7XSEx0ufa9SebOd437CvnneaTXlCpuGDhjUDxAjGBlu6ie5qHyubobVGBth//aErc6wZPHc6W75Vp3iQ==",
       "bin": {
         "stencil": "bin/stencil"
       },
       "engines": {
-        "node": ">=12.10.0",
-        "npm": ">=6.0.0"
+        "node": ">=16.0.0",
+        "npm": ">=7.10.0"
       }
     },
     "node_modules/@surma/rollup-plugin-off-main-thread": {
@@ -3673,9 +3664,9 @@
       }
     },
     "node_modules/@types/eslint": {
-      "version": "8.44.8",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.44.8.tgz",
-      "integrity": "sha512-4K8GavROwhrYl2QXDXm0Rv9epkA8GBFu0EI+XrrnnuCl7u8CWBRusX7fXJfanhZTDWSAL24gDI/UqXyUM0Injw==",
+      "version": "8.56.5",
+      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.5.tgz",
+      "integrity": "sha512-u5/YPJHo1tvkSF2CE0USEkxon82Z5DBy2xR+qfyYNszpX9qcs4sT6uq2kBbj4BXY1+DBGDPnrhMZV3pKWGNukw==",
       "dev": true,
       "dependencies": {
         "@types/estree": "*",
@@ -3711,9 +3702,9 @@
       }
     },
     "node_modules/@types/express-serve-static-core": {
-      "version": "4.17.41",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.41.tgz",
-      "integrity": "sha512-OaJ7XLaelTgrvlZD8/aa0vvvxZdUmlCn6MtWeB7TkiKW70BQLc9XEPpDLPdbo52ZhXUCrznlWdCHWxJWtdyajA==",
+      "version": "4.17.43",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.43.tgz",
+      "integrity": "sha512-oaYtiBirUOPQGSWNGPWnzyAFJ0BP3cwvN4oWZQY+zUBwpVIGsKUkpBpSztp74drYcjavs7SKFZ4DX1V2QeN8rg==",
       "dev": true,
       "dependencies": {
         "@types/node": "*",
@@ -3773,9 +3764,9 @@
       "integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ=="
     },
     "node_modules/@types/node-forge": {
-      "version": "1.3.10",
-      "resolved": "https://registry.npmjs.org/@types/node-forge/-/node-forge-1.3.10.tgz",
-      "integrity": "sha512-y6PJDYN4xYBxwd22l+OVH35N+1fCYWiuC3aiP2SlXVE6Lo7SS+rSx9r89hLxrP4pn6n1lBGhHJ12pj3F3Mpttw==",
+      "version": "1.3.11",
+      "resolved": "https://registry.npmjs.org/@types/node-forge/-/node-forge-1.3.11.tgz",
+      "integrity": "sha512-FQx220y22OKNTqaByeBGqHWYz4cl94tpcxeFdvBo3wjG6XPBuZ0BNgNZRV5J5TFmmcsJ4IzsLkmGRiQbnYsBEQ==",
       "dev": true,
       "dependencies": {
         "@types/node": "*"
@@ -3799,9 +3790,9 @@
       "dev": true
     },
     "node_modules/@types/qs": {
-      "version": "6.9.10",
-      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.10.tgz",
-      "integrity": "sha512-3Gnx08Ns1sEoCrWssEgTSJs/rsT2vhGP+Ja9cnnk9k4ALxinORlQneLXFeFKOTJMOeZUFD1s7w+w2AphTpvzZw==",
+      "version": "6.9.12",
+      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.12.tgz",
+      "integrity": "sha512-bZcOkJ6uWrL0Qb2NAWKa7TBU+mJHPzhx9jjLL1KHF+XpzEcR7EXHvjbHlGtR/IsP1vyPrehuS6XqkmaePy//mg==",
       "dev": true
     },
     "node_modules/@types/range-parser": {
@@ -3882,33 +3873,6 @@
       "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
       "dev": true
     },
-    "node_modules/@types/vue-barcode-reader": {
-      "version": "0.0.0",
-      "resolved": "https://registry.npmjs.org/@types/vue-barcode-reader/-/vue-barcode-reader-0.0.0.tgz",
-      "integrity": "sha512-yngQhd35qGjCxMXWIqsAtF7qmxe0qUYRVd9qW5I/CcRPWDdBpqVkHnQSh6ro5BIBl3NQ3ppky7kMKS4pr+XwCQ==",
-      "dependencies": {
-        "vue": "^2.0.0"
-      }
-    },
-    "node_modules/@types/vue-barcode-reader/node_modules/@vue/compiler-sfc": {
-      "version": "2.7.15",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.15.tgz",
-      "integrity": "sha512-FCvIEevPmgCgqFBH7wD+3B97y7u7oj/Wr69zADBf403Tui377bThTjBvekaZvlRr4IwUAu3M6hYZeULZFJbdYg==",
-      "dependencies": {
-        "@babel/parser": "^7.18.4",
-        "postcss": "^8.4.14",
-        "source-map": "^0.6.1"
-      }
-    },
-    "node_modules/@types/vue-barcode-reader/node_modules/vue": {
-      "version": "2.7.15",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-2.7.15.tgz",
-      "integrity": "sha512-a29fsXd2G0KMRqIFTpRgpSbWaNBK3lpCTOLuGLEDnlHWdjB8fwl6zyYZ8xCrqkJdatwZb4mGHiEfJjnw0Q6AwQ==",
-      "dependencies": {
-        "@vue/compiler-sfc": "2.7.15",
-        "csstype": "^3.1.0"
-      }
-    },
     "node_modules/@types/webpack-env": {
       "version": "1.18.4",
       "resolved": "https://registry.npmjs.org/@types/webpack-env/-/webpack-env-1.18.4.tgz",
@@ -3980,9 +3944,9 @@
       }
     },
     "node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -4123,9 +4087,9 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -4190,9 +4154,9 @@
       "integrity": "sha512-ons5CwXZ/51wrUPfoduC+cO7AS1/wRb0ybpQJ9RrssossDxVy4t49QxWoWgfBDvVKsz9VXzBk9z0wqTdZ+Cq8g=="
     },
     "node_modules/@ucast/js": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/@ucast/js/-/js-3.0.3.tgz",
-      "integrity": "sha512-jBBqt57T5WagkAjqfCIIE5UYVdaXYgGkOFYv2+kjq2AVpZ2RIbwCo/TujJpDlwTVluUI+WpnRpoGU2tSGlEvFQ==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@ucast/js/-/js-3.0.4.tgz",
+      "integrity": "sha512-TgG1aIaCMdcaEyckOZKQozn1hazE0w90SVdlpIJ/er8xVumE11gYAtSbw/LBeUnA4fFnFWTcw3t6reqseeH/4Q==",
       "dependencies": {
         "@ucast/core": "^1.0.0"
       }
@@ -4222,27 +4186,50 @@
       "dev": true
     },
     "node_modules/@vue/babel-helper-vue-transform-on": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.1.5.tgz",
-      "integrity": "sha512-SgUymFpMoAyWeYWLAY+MkCK3QEROsiUnfaw5zxOVD/M64KQs8D/4oK6Q5omVA2hnvEOE0SCkH2TZxs/jnnUj7w==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.2.1.tgz",
+      "integrity": "sha512-jtEXim+pfyHWwvheYwUwSXm43KwQo8nhOBDyjrUITV6X2tB7lJm6n/+4sqR8137UVZZul5hBzWHdZ2uStYpyRQ==",
       "dev": true
     },
     "node_modules/@vue/babel-plugin-jsx": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/@vue/babel-plugin-jsx/-/babel-plugin-jsx-1.1.5.tgz",
-      "integrity": "sha512-nKs1/Bg9U1n3qSWnsHhCVQtAzI6aQXqua8j/bZrau8ywT1ilXQbK4FwEJGmU8fV7tcpuFvWmmN7TMmV1OBma1g==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@vue/babel-plugin-jsx/-/babel-plugin-jsx-1.2.1.tgz",
+      "integrity": "sha512-Yy9qGktktXhB39QE99So/BO2Uwm/ZG+gpL9vMg51ijRRbINvgbuhyJEi4WYmGRMx/MSTfK0xjgZ3/MyY+iLCEg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-imports": "^7.22.5",
-        "@babel/plugin-syntax-jsx": "^7.22.5",
-        "@babel/template": "^7.22.5",
-        "@babel/traverse": "^7.22.5",
-        "@babel/types": "^7.22.5",
-        "@vue/babel-helper-vue-transform-on": "^1.1.5",
+        "@babel/helper-module-imports": "^7.22.15",
+        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/plugin-syntax-jsx": "^7.23.3",
+        "@babel/template": "^7.22.15",
+        "@babel/traverse": "^7.23.7",
+        "@babel/types": "^7.23.6",
+        "@vue/babel-helper-vue-transform-on": "1.2.1",
+        "@vue/babel-plugin-resolve-type": "1.2.1",
         "camelcase": "^6.3.0",
         "html-tags": "^3.3.1",
         "svg-tags": "^1.0.0"
       },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      },
+      "peerDependenciesMeta": {
+        "@babel/core": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vue/babel-plugin-resolve-type": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@vue/babel-plugin-resolve-type/-/babel-plugin-resolve-type-1.2.1.tgz",
+      "integrity": "sha512-IOtnI7pHunUzHS/y+EG/yPABIAp0VN8QhQ0UCS09jeMVxgAnI9qdOzO85RXdQGxq+aWCdv8/+k3W0aYO6j/8fQ==",
+      "dev": true,
+      "dependencies": {
+        "@babel/code-frame": "^7.23.5",
+        "@babel/helper-module-imports": "^7.22.15",
+        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/parser": "^7.23.6",
+        "@vue/compiler-sfc": "^3.4.15"
+      },
       "peerDependencies": {
         "@babel/core": "^7.0.0-0"
       }
@@ -4323,9 +4310,9 @@
       }
     },
     "node_modules/@vue/babel-preset-app/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -4874,9 +4861,9 @@
       }
     },
     "node_modules/@vue/cli-shared-utils/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -4907,49 +4894,49 @@
       "dev": true
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.3.11.tgz",
-      "integrity": "sha512-h97/TGWBilnLuRaj58sxNrsUU66fwdRKLOLQ9N/5iNDfp+DZhYH9Obhe0bXxhedl8fjAgpRANpiZfbgWyruQ0w==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.21.tgz",
+      "integrity": "sha512-MjXawxZf2SbZszLPYxaFCjxfibYrzr3eYbKxwpLR9EQN+oaziSu3qKVbwBERj1IFIB8OLUewxB5m/BFzi613og==",
       "dependencies": {
-        "@babel/parser": "^7.23.5",
-        "@vue/shared": "3.3.11",
+        "@babel/parser": "^7.23.9",
+        "@vue/shared": "3.4.21",
+        "entities": "^4.5.0",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.0.2"
       }
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.11.tgz",
-      "integrity": "sha512-zoAiUIqSKqAJ81WhfPXYmFGwDRuO+loqLxvXmfUdR5fOitPoUiIeFI9cTTyv9MU5O1+ZZglJVTusWzy+wfk5hw==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.21.tgz",
+      "integrity": "sha512-IZC6FKowtT1sl0CR5DpXSiEB5ayw75oT2bma1BEhV7RRR1+cfwLrxc2Z8Zq/RGFzJ8w5r9QtCOvTjQgdn0IKmA==",
       "dependencies": {
-        "@vue/compiler-core": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/compiler-core": "3.4.21",
+        "@vue/shared": "3.4.21"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.3.11.tgz",
-      "integrity": "sha512-U4iqPlHO0KQeK1mrsxCN0vZzw43/lL8POxgpzcJweopmqtoYy9nljJzWDIQS3EfjiYhfdtdk9Gtgz7MRXnz3GA==",
-      "dependencies": {
-        "@babel/parser": "^7.23.5",
-        "@vue/compiler-core": "3.3.11",
-        "@vue/compiler-dom": "3.3.11",
-        "@vue/compiler-ssr": "3.3.11",
-        "@vue/reactivity-transform": "3.3.11",
-        "@vue/shared": "3.3.11",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.21.tgz",
+      "integrity": "sha512-me7epoTxYlY+2CUM7hy9PCDdpMPfIwrOvAXud2Upk10g4YLv9UBW7kL798TvMeDhPthkZ0CONNrK2GoeI1ODiQ==",
+      "dependencies": {
+        "@babel/parser": "^7.23.9",
+        "@vue/compiler-core": "3.4.21",
+        "@vue/compiler-dom": "3.4.21",
+        "@vue/compiler-ssr": "3.4.21",
+        "@vue/shared": "3.4.21",
         "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5",
-        "postcss": "^8.4.32",
+        "magic-string": "^0.30.7",
+        "postcss": "^8.4.35",
         "source-map-js": "^1.0.2"
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.3.11.tgz",
-      "integrity": "sha512-Zd66ZwMvndxRTgVPdo+muV4Rv9n9DwQ4SSgWWKWkPFebHQfVYRrVjeygmmDmPewsHyznCNvJ2P2d6iOOhdv8Qg==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.21.tgz",
+      "integrity": "sha512-M5+9nI2lPpAsgXOGQobnIueVqc9sisBFexh5yMIMRAPYLa7+5wEJs8iqOZc1WAa9WQbx9GR2twgznU8LTIiZ4Q==",
       "dependencies": {
-        "@vue/compiler-dom": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/compiler-dom": "3.4.21",
+        "@vue/shared": "3.4.21"
       }
     },
     "node_modules/@vue/component-compiler-utils": {
@@ -5017,9 +5004,9 @@
       "dev": true
     },
     "node_modules/@vue/devtools-api": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.1.tgz",
-      "integrity": "sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA=="
+      "version": "6.6.1",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.1.tgz",
+      "integrity": "sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA=="
     },
     "node_modules/@vue/eslint-config-typescript": {
       "version": "9.1.0",
@@ -5040,65 +5027,53 @@
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.3.11.tgz",
-      "integrity": "sha512-D5tcw091f0nuu+hXq5XANofD0OXnBmaRqMYl5B3fCR+mX+cXJIGNw/VNawBqkjLNWETrFW0i+xH9NvDbTPVh7g==",
-      "dependencies": {
-        "@vue/shared": "3.3.11"
-      }
-    },
-    "node_modules/@vue/reactivity-transform": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.3.11.tgz",
-      "integrity": "sha512-fPGjH0wqJo68A0wQ1k158utDq/cRyZNlFoxGwNScE28aUFOKFEnCBsvyD8jHn+0kd0UKVpuGuaZEQ6r9FJRqCg==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.21.tgz",
+      "integrity": "sha512-UhenImdc0L0/4ahGCyEzc/pZNwVgcglGy9HVzJ1Bq2Mm9qXOpP8RyNTjookw/gOCUlXSEtuZ2fUg5nrHcoqJcw==",
       "dependencies": {
-        "@babel/parser": "^7.23.5",
-        "@vue/compiler-core": "3.3.11",
-        "@vue/shared": "3.3.11",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5"
+        "@vue/shared": "3.4.21"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.3.11.tgz",
-      "integrity": "sha512-g9ztHGwEbS5RyWaOpXuyIVFTschclnwhqEbdy5AwGhYOgc7m/q3NFwr50MirZwTTzX55JY8pSkeib9BX04NIpw==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.21.tgz",
+      "integrity": "sha512-pQthsuYzE1XcGZznTKn73G0s14eCJcjaLvp3/DKeYWoFacD9glJoqlNBxt3W2c5S40t6CCcpPf+jG01N3ULyrA==",
       "dependencies": {
-        "@vue/reactivity": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/reactivity": "3.4.21",
+        "@vue/shared": "3.4.21"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.3.11.tgz",
-      "integrity": "sha512-OlhtV1PVpbgk+I2zl+Y5rQtDNcCDs12rsRg71XwaA2/Rbllw6mBLMi57VOn8G0AjOJ4Mdb4k56V37+g8ukShpQ==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.21.tgz",
+      "integrity": "sha512-gvf+C9cFpevsQxbkRBS1NpU8CqxKw0ebqMvLwcGQrNpx6gqRDodqKqA+A2VZZpQ9RpK2f9yfg8VbW/EpdFUOJw==",
       "dependencies": {
-        "@vue/runtime-core": "3.3.11",
-        "@vue/shared": "3.3.11",
-        "csstype": "^3.1.2"
+        "@vue/runtime-core": "3.4.21",
+        "@vue/shared": "3.4.21",
+        "csstype": "^3.1.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.3.11.tgz",
-      "integrity": "sha512-AIWk0VwwxCAm4wqtJyxBylRTXSy1wCLOKbWxHaHiu14wjsNYtiRCSgVuqEPVuDpErOlRdNnuRgipQfXRLjLN5A==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.21.tgz",
+      "integrity": "sha512-aV1gXyKSN6Rz+6kZ6kr5+Ll14YzmIbeuWe7ryJl5muJ4uwSwY/aStXTixx76TwkZFJLm1aAlA/HSWEJ4EyiMkg==",
       "dependencies": {
-        "@vue/compiler-ssr": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/compiler-ssr": "3.4.21",
+        "@vue/shared": "3.4.21"
       },
       "peerDependencies": {
-        "vue": "3.3.11"
+        "vue": "3.4.21"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.3.11.tgz",
-      "integrity": "sha512-u2G8ZQ9IhMWTMXaWqZycnK4UthG1fA238CD+DP4Dm4WJi5hdUKKLg0RMRaRpDPNMdkTwIDkp7WtD0Rd9BH9fLw=="
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.21.tgz",
+      "integrity": "sha512-PuJe7vDIi6VYSinuEbUIQgMIRZGgM8e4R+G+/dQTk0X1NEdvgvvgv7m+rfmDH1gZzyA1OjjoWskvHlfRNfQf3g=="
     },
     "node_modules/@vue/test-utils": {
-      "version": "2.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.3.tgz",
-      "integrity": "sha512-F4K7mF+ad++VlTrxMJVRnenKSJmO6fkQt2wpRDiKDesQMkfpniGWsqEi/JevxGBo2qEkwwjvTUAoiGJLNx++CA==",
+      "version": "2.4.4",
+      "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.4.tgz",
+      "integrity": "sha512-8jkRxz8pNhClAf4Co4ZrpAoFISdvT3nuSkUlY6Ys6rmTpw3DMWG/X3mw3gQ7QJzgCZO9f+zuE2kW57fi09MW7Q==",
       "dev": true,
       "dependencies": {
         "js-beautify": "^1.14.9",
@@ -5348,26 +5323,6 @@
       "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==",
       "dev": true
     },
-    "node_modules/@zxing/library": {
-      "version": "0.19.3",
-      "resolved": "https://registry.npmjs.org/@zxing/library/-/library-0.19.3.tgz",
-      "integrity": "sha512-RUv5svewpDoD0ymXleOP8yVTO5BLkR0zn5coGC/Vs1671u0OBJ4xdtR8WVWf08OcvrieEMHdSfQY3ZKtqII/hg==",
-      "dependencies": {
-        "ts-custom-error": "^3.2.1"
-      },
-      "engines": {
-        "node": ">= 10.4.0"
-      },
-      "optionalDependencies": {
-        "@zxing/text-encoding": "~0.9.0"
-      }
-    },
-    "node_modules/@zxing/text-encoding": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/@zxing/text-encoding/-/text-encoding-0.9.0.tgz",
-      "integrity": "sha512-U/4aVJ2mxI0aDNI8Uq0wEhMgY+u4CNtEb0om3+y3+niDAsoTCOB33UF0sxpzqzdqXLqmvc+vZyAt4O8pPdfkwA==",
-      "optional": true
-    },
     "node_modules/abbrev": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-2.0.0.tgz",
@@ -5391,9 +5346,9 @@
       }
     },
     "node_modules/acorn": {
-      "version": "8.11.2",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.2.tgz",
-      "integrity": "sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==",
+      "version": "8.11.3",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
+      "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==",
       "dev": true,
       "bin": {
         "acorn": "bin/acorn"
@@ -5421,9 +5376,9 @@
       }
     },
     "node_modules/acorn-walk": {
-      "version": "8.3.1",
-      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.1.tgz",
-      "integrity": "sha512-TgUZgYvqZprrl7YldZNoa9OciCAyZR+Ejm9eXzKCmjsF5IKp/wgQ7Z/ZpjpGTIUPwrHQIcYeI8qDh4PsEwxMbw==",
+      "version": "8.3.2",
+      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.2.tgz",
+      "integrity": "sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==",
       "dev": true,
       "engines": {
         "node": ">=0.4.0"
@@ -5614,22 +5569,25 @@
       }
     },
     "node_modules/array-buffer-byte-length": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.0.tgz",
-      "integrity": "sha512-LPuwb2P+NrQw3XhxGc36+XSvuBPopovXYTR9Ew++Du9Yb/bx5AzBfrIsBoj0EZUifjQU+sHL21sseZ3jerWO/A==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz",
+      "integrity": "sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "is-array-buffer": "^3.0.1"
+        "call-bind": "^1.0.5",
+        "is-array-buffer": "^3.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/array-flatten": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-2.1.2.tgz",
-      "integrity": "sha512-hNfzcOV8W4NdualtqBFPyVO+54DSJuZGY9qT4pRroB6S9e3iiido2ISIC5h9R2sPJ8H3FHCIiEnsv1lPXO3KtQ==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==",
       "dev": true
     },
     "node_modules/array-union": {
@@ -5642,17 +5600,18 @@
       }
     },
     "node_modules/arraybuffer.prototype.slice": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.2.tgz",
-      "integrity": "sha512-yMBKppFur/fbHu9/6USUe03bZ4knMYiwFBcyiaXB8Go0qNehwX6inYPzK9U0NeQvGxKthcmHcaR8P5MStSRBAw==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz",
+      "integrity": "sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==",
       "dev": true,
       "dependencies": {
-        "array-buffer-byte-length": "^1.0.0",
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1",
-        "is-array-buffer": "^3.0.2",
+        "array-buffer-byte-length": "^1.0.1",
+        "call-bind": "^1.0.5",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.22.3",
+        "es-errors": "^1.2.1",
+        "get-intrinsic": "^1.2.3",
+        "is-array-buffer": "^3.0.4",
         "is-shared-array-buffer": "^1.0.2"
       },
       "engines": {
@@ -5711,9 +5670,9 @@
       }
     },
     "node_modules/autoprefixer": {
-      "version": "10.4.16",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",
-      "integrity": "sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==",
+      "version": "10.4.18",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.18.tgz",
+      "integrity": "sha512-1DKbDfsr6KUElM6wg+0zRNkB/Q7WcKYAaK+pzXn+Xqmszm/5Xa9coeNdtP88Vi+dPzZnMjhge8GIV49ZQkDa+g==",
       "dev": true,
       "funding": [
         {
@@ -5730,9 +5689,9 @@
         }
       ],
       "dependencies": {
-        "browserslist": "^4.21.10",
-        "caniuse-lite": "^1.0.30001538",
-        "fraction.js": "^4.3.6",
+        "browserslist": "^4.23.0",
+        "caniuse-lite": "^1.0.30001591",
+        "fraction.js": "^4.3.7",
         "normalize-range": "^0.1.2",
         "picocolors": "^1.0.0",
         "postcss-value-parser": "^4.2.0"
@@ -5748,10 +5707,13 @@
       }
     },
     "node_modules/available-typed-arrays": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz",
-      "integrity": "sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
+      "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==",
       "dev": true,
+      "dependencies": {
+        "possible-typed-array-names": "^1.0.0"
+      },
       "engines": {
         "node": ">= 0.4"
       },
@@ -5823,13 +5785,13 @@
       }
     },
     "node_modules/babel-plugin-polyfill-corejs2": {
-      "version": "0.4.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.6.tgz",
-      "integrity": "sha512-jhHiWVZIlnPbEUKSSNb9YoWcQGdlTLq7z1GHL4AjFxaoOUMuuEVJ+Y4pAaQUGOGk93YsVCKPbqbfw3m0SM6H8Q==",
+      "version": "0.4.8",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.8.tgz",
+      "integrity": "sha512-OtIuQfafSzpo/LhnJaykc0R/MMnuLSSVjVYy9mHArIZ9qTCSZ6TpWCuEKZYVoN//t8HqBNScHrOtCrIK5IaGLg==",
       "dev": true,
       "dependencies": {
         "@babel/compat-data": "^7.22.6",
-        "@babel/helper-define-polyfill-provider": "^0.4.3",
+        "@babel/helper-define-polyfill-provider": "^0.5.0",
         "semver": "^6.3.1"
       },
       "peerDependencies": {
@@ -5846,25 +5808,25 @@
       }
     },
     "node_modules/babel-plugin-polyfill-corejs3": {
-      "version": "0.8.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.8.6.tgz",
-      "integrity": "sha512-leDIc4l4tUgU7str5BWLS2h8q2N4Nf6lGZP6UrNDxdtfF2g69eJ5L0H7S8A5Ln/arfFAfHor5InAdZuIOwZdgQ==",
+      "version": "0.9.0",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.9.0.tgz",
+      "integrity": "sha512-7nZPG1uzK2Ymhy/NbaOWTg3uibM2BmGASS4vHS4szRZAIR8R6GwA/xAujpdrXU5iyklrimWnLWU+BLF9suPTqg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.4.3",
-        "core-js-compat": "^3.33.1"
+        "@babel/helper-define-polyfill-provider": "^0.5.0",
+        "core-js-compat": "^3.34.0"
       },
       "peerDependencies": {
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
       }
     },
     "node_modules/babel-plugin-polyfill-regenerator": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.5.3.tgz",
-      "integrity": "sha512-8sHeDOmXC8csczMrYEOf0UTNa4yE2SxV5JGeT/LP1n0OYVDUUFPxG9vdk2AlDlIit4t+Kf0xCtpgXPBwnn/9pw==",
+      "version": "0.5.5",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.5.5.tgz",
+      "integrity": "sha512-OJGYZlhLqBh2DDHeqAxWB1XIvr49CxiJ2gIt61/PU55CQK4Z58OzMqjDe1zwQdQk+rBYsRc+1rJmdajM3gimHg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.4.3"
+        "@babel/helper-define-polyfill-provider": "^0.5.0"
       },
       "peerDependencies": {
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
@@ -5953,13 +5915,13 @@
       "dev": true
     },
     "node_modules/body-parser": {
-      "version": "1.20.1",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.1.tgz",
-      "integrity": "sha512-jWi7abTbYwajOytWCQc37VulmWiRae5RyTpaCyDcS5/lMdtwSz5lOpDE67srw/HYe35f1z3fDQw+3txg7gNtWw==",
+      "version": "1.20.2",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.2.tgz",
+      "integrity": "sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA==",
       "dev": true,
       "dependencies": {
         "bytes": "3.1.2",
-        "content-type": "~1.0.4",
+        "content-type": "~1.0.5",
         "debug": "2.6.9",
         "depd": "2.0.0",
         "destroy": "1.2.0",
@@ -5967,7 +5929,7 @@
         "iconv-lite": "0.4.24",
         "on-finished": "2.4.1",
         "qs": "6.11.0",
-        "raw-body": "2.5.1",
+        "raw-body": "2.5.2",
         "type-is": "~1.6.18",
         "unpipe": "1.0.0"
       },
@@ -6016,13 +5978,11 @@
       }
     },
     "node_modules/bonjour-service": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.1.1.tgz",
-      "integrity": "sha512-Z/5lQRMOG9k7W+FkeGTNjh7htqn/2LMnfOvBZ8pynNZCM9MwkQkI3zeI4oz09uWdcgmgHugVvBqxGg4VQJ5PCg==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.2.1.tgz",
+      "integrity": "sha512-oSzCS2zV14bh2kji6vNe7vrpJYCHGvcZnlffFQ1MEoX/WOeQ/teD8SYWKR942OI3INjq8OMNJlbPK5LLLUxFDw==",
       "dev": true,
       "dependencies": {
-        "array-flatten": "^2.1.2",
-        "dns-equal": "^1.0.0",
         "fast-deep-equal": "^3.1.3",
         "multicast-dns": "^7.2.5"
       }
@@ -6066,9 +6026,9 @@
       }
     },
     "node_modules/browserslist": {
-      "version": "4.22.2",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.2.tgz",
-      "integrity": "sha512-0UgcrvQmBDvZHFGdYUehrCNIazki7/lUP3kkoi/r3YB2amZbFM9J43ZRkJTXBUZK4gmx56+Sqk9+Vs9mwZx9+A==",
+      "version": "4.23.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.0.tgz",
+      "integrity": "sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==",
       "dev": true,
       "funding": [
         {
@@ -6085,8 +6045,8 @@
         }
       ],
       "dependencies": {
-        "caniuse-lite": "^1.0.30001565",
-        "electron-to-chromium": "^1.4.601",
+        "caniuse-lite": "^1.0.30001587",
+        "electron-to-chromium": "^1.4.668",
         "node-releases": "^2.0.14",
         "update-browserslist-db": "^1.0.13"
       },
@@ -6172,13 +6132,18 @@
       }
     },
     "node_modules/call-bind": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.5.tgz",
-      "integrity": "sha512-C3nQxfFZxFRVoJoGKKI8y3MOEo129NQ+FgQ08iye+Mk4zNZZGdjfs06bVTr+DBSlA66Q2VEcMki/cUCP4SercQ==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz",
+      "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==",
       "dependencies": {
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
         "function-bind": "^1.1.2",
-        "get-intrinsic": "^1.2.1",
-        "set-function-length": "^1.1.1"
+        "get-intrinsic": "^1.2.4",
+        "set-function-length": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -6234,9 +6199,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001566",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001566.tgz",
-      "integrity": "sha512-ggIhCsTxmITBAMmK8yZjEhCO5/47jKXPu6Dha/wuCS4JePVL+3uiDEBuhu2aIoT+bqTOR8L76Ip1ARL9xYsEJA==",
+      "version": "1.0.30001594",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001594.tgz",
+      "integrity": "sha512-VblSX6nYqyJVs8DKFMldE2IVCJjZ225LW00ydtUWwh5hk9IfkTOffO6r8gJNsH0qqqeAF8KrbMYA2VEwTlGW5g==",
       "dev": true,
       "funding": [
         {
@@ -6306,16 +6271,10 @@
       }
     },
     "node_modules/chokidar": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
-      "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
+      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
       "dev": true,
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://paulmillr.com/funding/"
-        }
-      ],
       "dependencies": {
         "anymatch": "~3.1.2",
         "braces": "~3.0.2",
@@ -6328,6 +6287,9 @@
       "engines": {
         "node": ">= 8.10.0"
       },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      },
       "optionalDependencies": {
         "fsevents": "~2.3.2"
       }
@@ -6857,9 +6819,9 @@
       }
     },
     "node_modules/core-js": {
-      "version": "3.34.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.34.0.tgz",
-      "integrity": "sha512-aDdvlDder8QmY91H88GzNi9EtQi2TjvQhpCX6B1v/dAZHU1AuLgHvRh54RiOerpEhEW46Tkf+vgAViB/CWC0ag==",
+      "version": "3.36.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.36.0.tgz",
+      "integrity": "sha512-mt7+TUBbTFg5+GngsAxeKBTl5/VS0guFeJacYge9OmHb+m058UwwIm41SE9T4Den7ClatV57B6TYTuJ0CX1MAw==",
       "hasInstallScript": true,
       "funding": {
         "type": "opencollective",
@@ -6867,12 +6829,12 @@
       }
     },
     "node_modules/core-js-compat": {
-      "version": "3.34.0",
-      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.34.0.tgz",
-      "integrity": "sha512-4ZIyeNbW/Cn1wkMMDy+mvrRUxrwFNjKwbhCfQpDd+eLgYipDqp8oGFGtLmhh18EDPKA0g3VUBYOxQGGwvWLVpA==",
+      "version": "3.36.0",
+      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.36.0.tgz",
+      "integrity": "sha512-iV9Pd/PsgjNWBXeq8XRtWVSgz2tKAfhfvBs7qxYty+RlRd+OCksaWmOnc4JKrTc1cToXL1N0s3l/vwlxPtdElw==",
       "dev": true,
       "dependencies": {
-        "browserslist": "^4.22.2"
+        "browserslist": "^4.22.3"
       },
       "funding": {
         "type": "opencollective",
@@ -6960,19 +6922,19 @@
       }
     },
     "node_modules/css-loader": {
-      "version": "6.8.1",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.8.1.tgz",
-      "integrity": "sha512-xDAXtEVGlD0gJ07iclwWVkLoZOpEvAWaSyf6W18S2pOC//K8+qUDIx8IIT3D+HjnmkJPQeesOPv5aiUaJsCM2g==",
+      "version": "6.10.0",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.10.0.tgz",
+      "integrity": "sha512-LTSA/jWbwdMlk+rhmElbDR2vbtQoTBPr7fkJE+mxrHj+7ru0hUmHafDRzWIjIHTwpitWVaqY2/UWGRca3yUgRw==",
       "dev": true,
       "dependencies": {
         "icss-utils": "^5.1.0",
-        "postcss": "^8.4.21",
+        "postcss": "^8.4.33",
         "postcss-modules-extract-imports": "^3.0.0",
-        "postcss-modules-local-by-default": "^4.0.3",
-        "postcss-modules-scope": "^3.0.0",
+        "postcss-modules-local-by-default": "^4.0.4",
+        "postcss-modules-scope": "^3.1.1",
         "postcss-modules-values": "^4.0.0",
         "postcss-value-parser": "^4.2.0",
-        "semver": "^7.3.8"
+        "semver": "^7.5.4"
       },
       "engines": {
         "node": ">= 12.13.0"
@@ -6982,7 +6944,16 @@
         "url": "https://opencollective.com/webpack"
       },
       "peerDependencies": {
+        "@rspack/core": "0.x || 1.x",
         "webpack": "^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@rspack/core": {
+          "optional": true
+        },
+        "webpack": {
+          "optional": true
+        }
       }
     },
     "node_modules/css-loader/node_modules/lru-cache": {
@@ -6998,9 +6969,9 @@
       }
     },
     "node_modules/css-loader/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -7661,16 +7632,19 @@
       }
     },
     "node_modules/define-data-property": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.1.tgz",
-      "integrity": "sha512-E7uGkTzkk1d0ByLeSc6ZsFS79Axg+m1P/VsgYsxHgiuc3tFSj+MjMIwe90FC4lOAZzNBdY7kkO2P2wKdsQ1vgQ==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
+      "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
       "dependencies": {
-        "get-intrinsic": "^1.2.1",
-        "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0"
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.0.1"
       },
       "engines": {
         "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/define-lazy-prop": {
@@ -7745,12 +7719,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/dns-equal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
-      "integrity": "sha512-z+paD6YUQsk+AbGCEM4PrOXSss5gd66QfcVBFTKR/HpFL9jCqikS94HYwKww6fQyO7IxrIIyUu+g0Ka9tUS2Cg==",
-      "dev": true
-    },
     "node_modules/dns-packet": {
       "version": "5.6.1",
       "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz",
@@ -7798,6 +7766,15 @@
         "url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
       }
     },
+    "node_modules/dom-serializer/node_modules/entities": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
+      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
+      "dev": true,
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/domelementtype": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
@@ -7984,9 +7961,9 @@
       }
     },
     "node_modules/editorconfig/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -8026,9 +8003,9 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.608",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.608.tgz",
-      "integrity": "sha512-J2f/3iIIm3Mo0npneITZ2UPe4B1bg8fTNrFjD8715F/k1BvbviRuqYGkET1PgprrczXYTHFvotbBOmUp6KE0uA==",
+      "version": "1.4.693",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.693.tgz",
+      "integrity": "sha512-/if4Ueg0GUQlhCrW2ZlXwDAm40ipuKo+OgeHInlL8sbjt+hzISxZK949fZeJaVsheamrzANXvw1zQTvbxTvSHw==",
       "dev": true
     },
     "node_modules/emoji-regex": {
@@ -8064,9 +8041,9 @@
       }
     },
     "node_modules/enhanced-resolve": {
-      "version": "5.15.0",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.15.0.tgz",
-      "integrity": "sha512-LXYT42KJ7lpIKECr2mAXIaMldcNCh/7E0KBKOu4KSfkHmP+mZmSs+8V5gBAqisWBy0OO4W5Oyys0GO1Y8KtdKg==",
+      "version": "5.15.1",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.15.1.tgz",
+      "integrity": "sha512-3d3JRbwsCLJsYgvb6NuWEG44jjPSOMuS73L/6+7BZuoKm3W+qXnSoIYVHi8dG7Qcg4inAY4jbzkZ7MnskePeDg==",
       "dev": true,
       "dependencies": {
         "graceful-fs": "^4.2.4",
@@ -8099,10 +8076,12 @@
       }
     },
     "node_modules/entities": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
-      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
-      "dev": true,
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+      "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+      "engines": {
+        "node": ">=0.12"
+      },
       "funding": {
         "url": "https://github.com/fb55/entities?sponsor=1"
       }
@@ -8126,50 +8105,52 @@
       }
     },
     "node_modules/es-abstract": {
-      "version": "1.22.3",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.22.3.tgz",
-      "integrity": "sha512-eiiY8HQeYfYH2Con2berK+To6GrK2RxbPawDkGq4UiCQQfZHb6wX9qQqkbpPqaxQFcl8d9QzZqo0tGE0VcrdwA==",
-      "dev": true,
-      "dependencies": {
-        "array-buffer-byte-length": "^1.0.0",
-        "arraybuffer.prototype.slice": "^1.0.2",
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.5",
-        "es-set-tostringtag": "^2.0.1",
+      "version": "1.22.5",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.22.5.tgz",
+      "integrity": "sha512-oW69R+4q2wG+Hc3KZePPZxOiisRIqfKBVo/HLx94QcJeWGU/8sZhCvc829rd1kS366vlJbzBfXf9yWwf0+Ko7w==",
+      "dev": true,
+      "dependencies": {
+        "array-buffer-byte-length": "^1.0.1",
+        "arraybuffer.prototype.slice": "^1.0.3",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.7",
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "es-set-tostringtag": "^2.0.3",
         "es-to-primitive": "^1.2.1",
         "function.prototype.name": "^1.1.6",
-        "get-intrinsic": "^1.2.2",
-        "get-symbol-description": "^1.0.0",
+        "get-intrinsic": "^1.2.4",
+        "get-symbol-description": "^1.0.2",
         "globalthis": "^1.0.3",
         "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0",
-        "has-proto": "^1.0.1",
+        "has-property-descriptors": "^1.0.2",
+        "has-proto": "^1.0.3",
         "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0",
-        "internal-slot": "^1.0.5",
-        "is-array-buffer": "^3.0.2",
+        "hasown": "^2.0.1",
+        "internal-slot": "^1.0.7",
+        "is-array-buffer": "^3.0.4",
         "is-callable": "^1.2.7",
-        "is-negative-zero": "^2.0.2",
+        "is-negative-zero": "^2.0.3",
         "is-regex": "^1.1.4",
-        "is-shared-array-buffer": "^1.0.2",
+        "is-shared-array-buffer": "^1.0.3",
         "is-string": "^1.0.7",
-        "is-typed-array": "^1.1.12",
+        "is-typed-array": "^1.1.13",
         "is-weakref": "^1.0.2",
         "object-inspect": "^1.13.1",
         "object-keys": "^1.1.1",
-        "object.assign": "^4.1.4",
-        "regexp.prototype.flags": "^1.5.1",
-        "safe-array-concat": "^1.0.1",
-        "safe-regex-test": "^1.0.0",
+        "object.assign": "^4.1.5",
+        "regexp.prototype.flags": "^1.5.2",
+        "safe-array-concat": "^1.1.0",
+        "safe-regex-test": "^1.0.3",
         "string.prototype.trim": "^1.2.8",
         "string.prototype.trimend": "^1.0.7",
         "string.prototype.trimstart": "^1.0.7",
-        "typed-array-buffer": "^1.0.0",
-        "typed-array-byte-length": "^1.0.0",
-        "typed-array-byte-offset": "^1.0.0",
-        "typed-array-length": "^1.0.4",
+        "typed-array-buffer": "^1.0.2",
+        "typed-array-byte-length": "^1.0.1",
+        "typed-array-byte-offset": "^1.0.2",
+        "typed-array-length": "^1.0.5",
         "unbox-primitive": "^1.0.2",
-        "which-typed-array": "^1.1.13"
+        "which-typed-array": "^1.1.14"
       },
       "engines": {
         "node": ">= 0.4"
@@ -8178,6 +8159,25 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/es-define-property": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
+      "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
+      "dependencies": {
+        "get-intrinsic": "^1.2.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/es-module-lexer": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.4.1.tgz",
@@ -8185,14 +8185,14 @@
       "dev": true
     },
     "node_modules/es-set-tostringtag": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.2.tgz",
-      "integrity": "sha512-BuDyupZt65P9D2D2vA/zqcI3G5xRsklm5N3xCwuiy+/vKy8i0ifdsQP1sLgO4tZDSCaQUSnmC48khknGMV3D2Q==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz",
+      "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==",
       "dev": true,
       "dependencies": {
-        "get-intrinsic": "^1.2.2",
-        "has-tostringtag": "^1.0.0",
-        "hasown": "^2.0.0"
+        "get-intrinsic": "^1.2.4",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -8216,9 +8216,9 @@
       }
     },
     "node_modules/escalade": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
-      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
+      "integrity": "sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==",
       "engines": {
         "node": ">=6"
       }
@@ -8308,9 +8308,9 @@
       }
     },
     "node_modules/eslint-plugin-cypress/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
         "type-fest": "^0.20.2"
@@ -8367,9 +8367,9 @@
       }
     },
     "node_modules/eslint-plugin-vue/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -8670,9 +8670,9 @@
       }
     },
     "node_modules/eslint/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
         "type-fest": "^0.20.2"
@@ -8715,9 +8715,9 @@
       }
     },
     "node_modules/eslint/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -8759,15 +8759,6 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "dev": true
     },
-    "node_modules/esm": {
-      "version": "3.2.25",
-      "resolved": "https://registry.npmjs.org/esm/-/esm-3.2.25.tgz",
-      "integrity": "sha512-U1suiZ2oDVWv4zPO56S0NcR5QriEahGtdN2OR6FiOG4WJvcjBVFB0qI4+eKoWFH483PKGuLuu6V8Z4T5g63UVA==",
-      "dev": true,
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/espree": {
       "version": "7.3.1",
       "resolved": "https://registry.npmjs.org/espree/-/espree-7.3.1.tgz",
@@ -8997,14 +8988,14 @@
       }
     },
     "node_modules/express": {
-      "version": "4.18.2",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.18.2.tgz",
-      "integrity": "sha512-5/PsL6iGPdfQ/lKM1UuielYgv3BUoJfz1aUwU9vHZ+J7gyvwdQXFEBIEIaxeGf0GIcreATNyBExtalisDbuMqQ==",
+      "version": "4.18.3",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.18.3.tgz",
+      "integrity": "sha512-6VyCijWQ+9O7WuVMTRBTl+cjNNIzD5cY5mQ1WM8r/LEkI2u8EYpOotESNwzNlyCn3g+dmjKYI6BmNneSr/FSRw==",
       "dev": true,
       "dependencies": {
         "accepts": "~1.3.8",
         "array-flatten": "1.1.1",
-        "body-parser": "1.20.1",
+        "body-parser": "1.20.2",
         "content-disposition": "0.5.4",
         "content-type": "~1.0.4",
         "cookie": "0.5.0",
@@ -9038,12 +9029,6 @@
         "node": ">= 0.10.0"
       }
     },
-    "node_modules/express/node_modules/array-flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==",
-      "dev": true
-    },
     "node_modules/express/node_modules/debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -9197,9 +9182,9 @@
       "dev": true
     },
     "node_modules/fastq": {
-      "version": "1.15.0",
-      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.15.0.tgz",
-      "integrity": "sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==",
+      "version": "1.17.1",
+      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
+      "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
       "dev": true,
       "dependencies": {
         "reusify": "^1.0.4"
@@ -9358,36 +9343,36 @@
       }
     },
     "node_modules/firebase": {
-      "version": "10.7.1",
-      "resolved": "https://registry.npmjs.org/firebase/-/firebase-10.7.1.tgz",
-      "integrity": "sha512-Mlt7y7zQ43FtKp4SCyYie3tnrOL3UMF2XXiV4ZXMrC0d0wtcOYmABuybhkJpJCKILpdekxr39wjnaai0DZlWFg==",
-      "dependencies": {
-        "@firebase/analytics": "0.10.0",
-        "@firebase/analytics-compat": "0.2.6",
-        "@firebase/app": "0.9.25",
-        "@firebase/app-check": "0.8.1",
-        "@firebase/app-check-compat": "0.3.8",
-        "@firebase/app-compat": "0.2.25",
+      "version": "10.8.1",
+      "resolved": "https://registry.npmjs.org/firebase/-/firebase-10.8.1.tgz",
+      "integrity": "sha512-4B2jzhU/aumfKL446MG41/T5+t+9d9urf5XGrjC0HRQUm4Ya/amV48HBchnje69ExaJP5f2WxO9OX3wh9ee4wA==",
+      "dependencies": {
+        "@firebase/analytics": "0.10.1",
+        "@firebase/analytics-compat": "0.2.7",
+        "@firebase/app": "0.9.28",
+        "@firebase/app-check": "0.8.2",
+        "@firebase/app-check-compat": "0.3.9",
+        "@firebase/app-compat": "0.2.28",
         "@firebase/app-types": "0.9.0",
-        "@firebase/auth": "1.5.1",
-        "@firebase/auth-compat": "0.5.1",
-        "@firebase/database": "1.0.2",
-        "@firebase/database-compat": "1.0.2",
-        "@firebase/firestore": "4.4.0",
-        "@firebase/firestore-compat": "0.3.23",
-        "@firebase/functions": "0.11.0",
-        "@firebase/functions-compat": "0.3.6",
-        "@firebase/installations": "0.6.4",
-        "@firebase/installations-compat": "0.2.4",
-        "@firebase/messaging": "0.12.5",
-        "@firebase/messaging-compat": "0.2.5",
-        "@firebase/performance": "0.6.4",
-        "@firebase/performance-compat": "0.2.4",
-        "@firebase/remote-config": "0.4.4",
-        "@firebase/remote-config-compat": "0.2.4",
-        "@firebase/storage": "0.12.0",
-        "@firebase/storage-compat": "0.3.3",
-        "@firebase/util": "1.9.3"
+        "@firebase/auth": "1.6.1",
+        "@firebase/auth-compat": "0.5.3",
+        "@firebase/database": "1.0.3",
+        "@firebase/database-compat": "1.0.3",
+        "@firebase/firestore": "4.4.3",
+        "@firebase/firestore-compat": "0.3.26",
+        "@firebase/functions": "0.11.2",
+        "@firebase/functions-compat": "0.3.8",
+        "@firebase/installations": "0.6.5",
+        "@firebase/installations-compat": "0.2.5",
+        "@firebase/messaging": "0.12.6",
+        "@firebase/messaging-compat": "0.2.6",
+        "@firebase/performance": "0.6.5",
+        "@firebase/performance-compat": "0.2.5",
+        "@firebase/remote-config": "0.4.5",
+        "@firebase/remote-config-compat": "0.2.5",
+        "@firebase/storage": "0.12.2",
+        "@firebase/storage-compat": "0.3.5",
+        "@firebase/util": "1.9.4"
       }
     },
     "node_modules/flat": {
@@ -9414,15 +9399,15 @@
       }
     },
     "node_modules/flatted": {
-      "version": "3.2.9",
-      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.2.9.tgz",
-      "integrity": "sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==",
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.1.tgz",
+      "integrity": "sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==",
       "dev": true
     },
     "node_modules/follow-redirects": {
-      "version": "1.15.3",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.3.tgz",
-      "integrity": "sha512-1VzOtuEM8pC9SFU1E+8KfTjZyMztRsgEfwQl44z8A25uy13jSzTj6dyK2Df52iV0vgHCfBwLhDWevLn95w5v6Q==",
+      "version": "1.15.5",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.5.tgz",
+      "integrity": "sha512-vSFWUON1B+yAw1VN4xMfxgn5fTUiaOzAJCKBwIIgT/+7CuGy9+r+5gITvP62j3RmaD5Ph65UaERdOSRGUzZtgw==",
       "funding": [
         {
           "type": "individual",
@@ -9639,9 +9624,9 @@
       }
     },
     "node_modules/fork-ts-checker-webpack-plugin/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -9821,15 +9806,19 @@
       }
     },
     "node_modules/get-intrinsic": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.2.tgz",
-      "integrity": "sha512-0gSo4ml/0j98Y3lngkFEot/zhiCeWsbYIlZ+uZOVgzLyLaUw7wxUL+nCTP0XJvJg1AXulJRI3UJi8GsbDuxdGA==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
+      "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
       "dependencies": {
+        "es-errors": "^1.3.0",
         "function-bind": "^1.1.2",
         "has-proto": "^1.0.1",
         "has-symbols": "^1.0.3",
         "hasown": "^2.0.0"
       },
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -9853,13 +9842,14 @@
       }
     },
     "node_modules/get-symbol-description": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.0.tgz",
-      "integrity": "sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz",
+      "integrity": "sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.1"
+        "call-bind": "^1.0.5",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.4"
       },
       "engines": {
         "node": ">= 0.4"
@@ -10040,20 +10030,20 @@
       }
     },
     "node_modules/has-property-descriptors": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.1.tgz",
-      "integrity": "sha512-VsX8eaIewvas0xnvinAe9bw4WfIeODpGYikiWYLH+dma0Jw6KHYqWiWfhQlgOVK8D6PvjubK5Uc4P0iIhIcNVg==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
+      "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
       "dependencies": {
-        "get-intrinsic": "^1.2.2"
+        "es-define-property": "^1.0.0"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/has-proto": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.1.tgz",
-      "integrity": "sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz",
+      "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==",
       "engines": {
         "node": ">= 0.4"
       },
@@ -10073,12 +10063,12 @@
       }
     },
     "node_modules/has-tostringtag": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.0.tgz",
-      "integrity": "sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
+      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
       "dev": true,
       "dependencies": {
-        "has-symbols": "^1.0.2"
+        "has-symbols": "^1.0.3"
       },
       "engines": {
         "node": ">= 0.4"
@@ -10094,9 +10084,9 @@
       "dev": true
     },
     "node_modules/hasown": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.0.tgz",
-      "integrity": "sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==",
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.1.tgz",
+      "integrity": "sha512-1/th4MHjnwncwXsIW6QMzlvYL9kG5e/CpVvLRZe4XPa8TOUNbCELqmvhDmnkNsAjwaG4+I8gJJL0JBvTTLO9qA==",
       "dependencies": {
         "function-bind": "^1.1.2"
       },
@@ -10177,9 +10167,9 @@
       }
     },
     "node_modules/html-entities": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.4.0.tgz",
-      "integrity": "sha512-igBTJcNNNhvZFRtm8uA6xMY6xYleeDwn3PeBCkDz7tHttv4F2hsDI2aPgNERWzvRcNYHNT3ymRaQzllmXj4YsQ==",
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.5.2.tgz",
+      "integrity": "sha512-K//PSRMQk4FZ78Kyau+mZurHn3FH0Vwr+H36eE0rPbeYkRRi9YxceYPhuN60UwWorxyKHhqoAJl2OFKa4BVtaA==",
       "dev": true,
       "funding": [
         {
@@ -10241,9 +10231,9 @@
       }
     },
     "node_modules/html-webpack-plugin": {
-      "version": "5.5.4",
-      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-5.5.4.tgz",
-      "integrity": "sha512-3wNSaVVxdxcu0jd4FpQFoICdqgxs4zIQQvj+2yQKFfBOnLETQ6X5CDWdeasuGlSsooFlMkEioWDTqBv1wvw5Iw==",
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-5.6.0.tgz",
+      "integrity": "sha512-iwaY4wzbe48AfKLZ/Cc8k0L+FKG6oSNRaZ8x5A/T/IVDGyXcbHncM9TdDa93wn0FsSm82FhTKW7f3vS61thXAw==",
       "dev": true,
       "dependencies": {
         "@types/html-minifier-terser": "^6.0.0",
@@ -10260,7 +10250,16 @@
         "url": "https://opencollective.com/html-webpack-plugin"
       },
       "peerDependencies": {
+        "@rspack/core": "0.x || 1.x",
         "webpack": "^5.20.0"
+      },
+      "peerDependenciesMeta": {
+        "@rspack/core": {
+          "optional": true
+        },
+        "webpack": {
+          "optional": true
+        }
       }
     },
     "node_modules/html-webpack-plugin/node_modules/tapable": {
@@ -10291,6 +10290,15 @@
         "entities": "^2.0.0"
       }
     },
+    "node_modules/htmlparser2/node_modules/entities": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
+      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
+      "dev": true,
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/http-deceiver": {
       "version": "1.2.7",
       "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
@@ -10434,9 +10442,9 @@
       ]
     },
     "node_modules/ignore": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.0.tgz",
-      "integrity": "sha512-g7dmpshy+gD7mh88OC9NwSGTKoc3kyLAZQRU1mt53Aw/vnvfXnbC+F/7F7QoYVKbV+KNvJx8wArewKy1vXMtlg==",
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.1.tgz",
+      "integrity": "sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw==",
       "dev": true,
       "engines": {
         "node": ">= 4"
@@ -10648,12 +10656,12 @@
       }
     },
     "node_modules/internal-slot": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.6.tgz",
-      "integrity": "sha512-Xj6dv+PsbtwyPpEflsejS+oIZxmMlV44zAhG479uYu89MsjcYOhCFnNyKrkJrihbsiasQyY0afoCl/9BLR65bg==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz",
+      "integrity": "sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==",
       "dev": true,
       "dependencies": {
-        "get-intrinsic": "^1.2.2",
+        "es-errors": "^1.3.0",
         "hasown": "^2.0.0",
         "side-channel": "^1.0.4"
       },
@@ -10662,11 +10670,11 @@
       }
     },
     "node_modules/ionicons": {
-      "version": "6.1.3",
-      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-6.1.3.tgz",
-      "integrity": "sha512-ptzz38dd/Yq+PgjhXegh7yhb/SLIk1bvL9vQDtLv1aoSc7alO6mX2DIMgcKYzt9vrNWkRu1f9Jr78zIFFyOXqw==",
+      "version": "7.2.2",
+      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-7.2.2.tgz",
+      "integrity": "sha512-I3iYIfc9Q9FRifWyFSwTAvbEABWlWY32i0sAVDDPGYnaIZVugkLCZFbEcrphW6ixVPg8tt1oLwalo/JJwbEqnA==",
       "dependencies": {
-        "@stencil/core": "^2.18.0"
+        "@stencil/core": "^4.0.3"
       }
     },
     "node_modules/ipaddr.js": {
@@ -10679,14 +10687,16 @@
       }
     },
     "node_modules/is-array-buffer": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.2.tgz",
-      "integrity": "sha512-y+FyyR/w8vfIRq4eQcM1EYgSTnmHXPqaF+IgzgraytCFq5Xh8lllDVmAZolPJiZttZLeFSINPYMaEJ7/vWUa1w==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
+      "integrity": "sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==",
       "dev": true,
       "dependencies": {
         "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.0",
-        "is-typed-array": "^1.1.10"
+        "get-intrinsic": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -10879,9 +10889,9 @@
       "dev": true
     },
     "node_modules/is-negative-zero": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.2.tgz",
-      "integrity": "sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz",
+      "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==",
       "dev": true,
       "engines": {
         "node": ">= 0.4"
@@ -10979,12 +10989,15 @@
       }
     },
     "node_modules/is-shared-array-buffer": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz",
-      "integrity": "sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz",
+      "integrity": "sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2"
+        "call-bind": "^1.0.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -11030,12 +11043,12 @@
       }
     },
     "node_modules/is-typed-array": {
-      "version": "1.1.12",
-      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.12.tgz",
-      "integrity": "sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==",
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz",
+      "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==",
       "dev": true,
       "dependencies": {
-        "which-typed-array": "^1.1.11"
+        "which-typed-array": "^1.1.14"
       },
       "engines": {
         "node": ">= 0.4"
@@ -11273,27 +11286,28 @@
       }
     },
     "node_modules/joi": {
-      "version": "17.11.0",
-      "resolved": "https://registry.npmjs.org/joi/-/joi-17.11.0.tgz",
-      "integrity": "sha512-NgB+lZLNoqISVy1rZocE9PZI36bL/77ie924Ri43yEvi9GUUMPeyVIr8KdFTMUlby1p0PBYMk9spIxEUQYqrJQ==",
+      "version": "17.12.2",
+      "resolved": "https://registry.npmjs.org/joi/-/joi-17.12.2.tgz",
+      "integrity": "sha512-RonXAIzCiHLc8ss3Ibuz45u28GOsWE1UpfDXLbN/9NKbL4tCJf8TWYVKsoYuuh+sAUt7fsSNpA+r2+TBA6Wjmw==",
       "dev": true,
       "dependencies": {
-        "@hapi/hoek": "^9.0.0",
-        "@hapi/topo": "^5.0.0",
-        "@sideway/address": "^4.1.3",
+        "@hapi/hoek": "^9.3.0",
+        "@hapi/topo": "^5.1.0",
+        "@sideway/address": "^4.1.5",
         "@sideway/formula": "^3.0.1",
         "@sideway/pinpoint": "^2.0.0"
       }
     },
     "node_modules/js-beautify": {
-      "version": "1.14.11",
-      "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.14.11.tgz",
-      "integrity": "sha512-rPogWqAfoYh1Ryqqh2agUpVfbxAhbjuN1SmU86dskQUKouRiggUTCO4+2ym9UPXllc2WAp0J+T5qxn7Um3lCdw==",
+      "version": "1.15.1",
+      "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.15.1.tgz",
+      "integrity": "sha512-ESjNzSlt/sWE8sciZH8kBF8BPlwXPwhR6pWKAw8bw4Bwj+iZcnKW6ONWUutJ7eObuBZQpiIb8S7OYspWrKt7rA==",
       "dev": true,
       "dependencies": {
         "config-chain": "^1.1.13",
-        "editorconfig": "^1.0.3",
+        "editorconfig": "^1.0.4",
         "glob": "^10.3.3",
+        "js-cookie": "^3.0.5",
         "nopt": "^7.2.0"
       },
       "bin": {
@@ -11360,6 +11374,15 @@
         "node": ">=16 || 14 >=14.17"
       }
     },
+    "node_modules/js-cookie": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.5.tgz",
+      "integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==",
+      "dev": true,
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/js-message": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
@@ -12040,9 +12063,9 @@
       }
     },
     "node_modules/magic-string": {
-      "version": "0.30.5",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.5.tgz",
-      "integrity": "sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==",
+      "version": "0.30.8",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.8.tgz",
+      "integrity": "sha512-ISQTe55T2ao7XtlAStud6qwYPZjE4GK1S/BeVPus4jrq6JuOnQ00YKQC581RWhR122W7msZV263KzVeLoqidyQ==",
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.4.15"
       },
@@ -12206,12 +12229,13 @@
       }
     },
     "node_modules/mini-css-extract-plugin": {
-      "version": "2.7.6",
-      "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.6.tgz",
-      "integrity": "sha512-Qk7HcgaPkGG6eD77mLvZS1nmxlao3j+9PkrT9Uc7HAE1id3F41+DdBRYRYkbyfNRGzm8/YWtzhw7nVPmwhqTQw==",
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.8.1.tgz",
+      "integrity": "sha512-/1HDlyFRxWIZPI1ZpgqlZ8jMw/1Dp/dl3P0L1jtZ+zVcHqwPhGwaJwKL00WVgfnBy6PWCde9W65or7IIETImuA==",
       "dev": true,
       "dependencies": {
-        "schema-utils": "^4.0.0"
+        "schema-utils": "^4.0.0",
+        "tapable": "^2.2.1"
       },
       "engines": {
         "node": ">= 12.13.0"
@@ -12277,6 +12301,15 @@
         "url": "https://opencollective.com/webpack"
       }
     },
+    "node_modules/mini-css-extract-plugin/node_modules/tapable": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz",
+      "integrity": "sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/minimalistic-assert": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
@@ -12346,9 +12379,9 @@
       "dev": true
     },
     "node_modules/mrmime": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz",
-      "integrity": "sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz",
+      "integrity": "sha512-eu38+hdgojoyq63s+yTpN4XMBdt5l8HhMhc4VKLO9KM5caLIBvUm4thi7fFaxyTmCKeNnXZ5pAlBwCUnhA09uw==",
       "dev": true,
       "engines": {
         "node": ">=10"
@@ -13028,9 +13061,9 @@
       }
     },
     "node_modules/path-scurry/node_modules/lru-cache": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.1.0.tgz",
-      "integrity": "sha512-/1clY/ui8CzjKFyjdvwPWJUYKiFVXG2I2cY0ssG7h4+hwk+XOIX7ZSG9Q7TW8TW3Kp3BUSqgFWBLgL4PJ+Blag==",
+      "version": "10.2.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.2.0.tgz",
+      "integrity": "sha512-2bIM8x+VAf6JT4bKAljS1qUWgMsqZRPGJS6FSahIMPVvctcNhyVp7AJu7quxOW9jwkryBReKZY5tY5JYv2n/7Q==",
       "dev": true,
       "engines": {
         "node": "14 || >=16.14"
@@ -13124,17 +13157,17 @@
       }
     },
     "node_modules/pinia-plugin-persistedstate": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.0.tgz",
-      "integrity": "sha512-tZbNGf2vjAQcIm7alK40sE51Qu/m9oWr+rEgNm/2AWr1huFxj72CjvpQcIQzMknDBJEkQznCLAGtJTIcLKrKdw==",
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.1.tgz",
+      "integrity": "sha512-MK++8LRUsGF7r45PjBFES82ISnPzyO6IZx3CH5vyPseFLZCk1g2kgx6l/nW8pEBKxxd4do0P6bJw+mUSZIEZUQ==",
       "peerDependencies": {
         "pinia": "^2.0.0"
       }
     },
     "node_modules/pinia/node_modules/vue-demi": {
-      "version": "0.14.6",
-      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.6.tgz",
-      "integrity": "sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==",
+      "version": "0.14.7",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
+      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
       "hasInstallScript": true,
       "bin": {
         "vue-demi-fix": "bin/vue-demi-fix.js",
@@ -13214,10 +13247,19 @@
         "ms": "^2.1.1"
       }
     },
+    "node_modules/possible-typed-array-names": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz",
+      "integrity": "sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==",
+      "dev": true,
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/postcss": {
-      "version": "8.4.32",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.32.tgz",
-      "integrity": "sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==",
+      "version": "8.4.35",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.35.tgz",
+      "integrity": "sha512-u5U8qYpBCpN13BsiEB0CbR1Hhh4Gc0zLFuedrHJKMctHCHAGrMdG0PRM/KErzAL3CU6/eckEtmHNB3x6e3c0vA==",
       "funding": [
         {
           "type": "opencollective",
@@ -13387,9 +13429,9 @@
       }
     },
     "node_modules/postcss-loader/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -13518,9 +13560,9 @@
       }
     },
     "node_modules/postcss-modules-local-by-default": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.3.tgz",
-      "integrity": "sha512-2/u2zraspoACtrbFRnTijMiQtb4GW4BvatjaG/bCjYQo8kLTdevCUlwuBHx2sCnSyrI3x3qj4ZK1j5LQBgzmwA==",
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.4.tgz",
+      "integrity": "sha512-L4QzMnOdVwRm1Qb8m4x8jsZzKAaPAgrUF1r/hjDR2Xj7R+8Zsf97jAlSQzWtKx5YNiNGN8QxmPFIc/sh+RQl+Q==",
       "dev": true,
       "dependencies": {
         "icss-utils": "^5.0.0",
@@ -13535,9 +13577,9 @@
       }
     },
     "node_modules/postcss-modules-scope": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.0.0.tgz",
-      "integrity": "sha512-hncihwFA2yPath8oZ15PZqvWGkWf+XUfQgUGamS4LqoP1anQLOsOJw0vr7J7IwLpoY9fatA2qiGUGmuZL0Iqlg==",
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.1.1.tgz",
+      "integrity": "sha512-uZgqzdTleelWjzJY+Fhti6F3C9iF1JR/dODLs/JDefozYcKTBCdD8BIl6nNPbTbcLnGrk56hzwZC2DaGNvYjzA==",
       "dev": true,
       "dependencies": {
         "postcss-selector-parser": "^6.0.4"
@@ -13746,9 +13788,9 @@
       }
     },
     "node_modules/postcss-selector-parser": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
+      "version": "6.0.15",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.15.tgz",
+      "integrity": "sha512-rEYkQOMUCEMhsKbK66tbEU9QVIxbhN18YiniAwA7XQYTVBqrBy+P2p5JcdqsHgKM2zWylp8d7J6eszocfds5Sw==",
       "dev": true,
       "dependencies": {
         "cssesc": "^3.0.0",
@@ -14009,9 +14051,9 @@
       "dev": true
     },
     "node_modules/protobufjs": {
-      "version": "7.2.5",
-      "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.2.5.tgz",
-      "integrity": "sha512-gGXRSXvxQ7UiPgfw8gevrfRWcTlSbOFg+p/N+JVJEK5VhueL2miT6qTymqAmjr1Q5WbOCyJbyrk6JfWKwlFn6A==",
+      "version": "7.2.6",
+      "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.2.6.tgz",
+      "integrity": "sha512-dgJaEDDL6x8ASUZ1YqWciTRrdOuYNzoOf27oHNfdyvKqHr5i0FV7FSLU+aIeFjyFgVxrpTOtQUi0BLLBymZaBw==",
       "hasInstallScript": true,
       "dependencies": {
         "@protobufjs/aspromise": "^1.1.2",
@@ -14155,9 +14197,9 @@
       }
     },
     "node_modules/raw-body": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.1.tgz",
-      "integrity": "sha512-qqJBtEyVgS0ZmPGdCFPWJ3FreoqvG4MVQln/kCgF7Olq95IbOp0/BWyMwbdtn4VTvkM8Y7khCQ2Xgk/tcrCXig==",
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.2.tgz",
+      "integrity": "sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA==",
       "dev": true,
       "dependencies": {
         "bytes": "3.1.2",
@@ -14264,9 +14306,9 @@
       }
     },
     "node_modules/regenerator-runtime": {
-      "version": "0.14.0",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz",
-      "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==",
+      "version": "0.14.1",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
+      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==",
       "dev": true
     },
     "node_modules/regenerator-transform": {
@@ -14279,14 +14321,15 @@
       }
     },
     "node_modules/regexp.prototype.flags": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz",
-      "integrity": "sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==",
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.2.tgz",
+      "integrity": "sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "set-function-name": "^2.0.0"
+        "call-bind": "^1.0.6",
+        "define-properties": "^1.2.1",
+        "es-errors": "^1.3.0",
+        "set-function-name": "^2.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -14469,9 +14512,9 @@
       }
     },
     "node_modules/rfdc": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.3.0.tgz",
-      "integrity": "sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.3.1.tgz",
+      "integrity": "sha512-r5a3l5HzYlIC68TpmYKlxWjmOP6wiPJ1vWv2HeLhNsRZMrCkxeqxiHlQ21oXmQ4F3SiryXBHhAD7JZqvOJjFmg==",
       "dev": true
     },
     "node_modules/rimraf": {
@@ -14609,13 +14652,13 @@
       }
     },
     "node_modules/safe-array-concat": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.1.tgz",
-      "integrity": "sha512-6XbUAseYE2KtOuGueyeobCySj9L4+66Tn6KQMOPQJrAJEowYKW/YR/MGJZl7FdydUdaFu4LYyDZjxf4/Nmo23Q==",
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.0.tgz",
+      "integrity": "sha512-ZdQ0Jeb9Ofti4hbt5lX3T2JcAamT9hfzYU1MNB+z/jaEbB6wfFfPIR/zEORmZqobkCCJhSjodobH6WHNmJ97dg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1",
+        "call-bind": "^1.0.5",
+        "get-intrinsic": "^1.2.2",
         "has-symbols": "^1.0.3",
         "isarray": "^2.0.5"
       },
@@ -14646,15 +14689,18 @@
       ]
     },
     "node_modules/safe-regex-test": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.0.tgz",
-      "integrity": "sha512-JBUUzyOgEwXQY1NuPtvcj/qcBDbDmEvWufhlnXZIm75DEHp+afM1r1ujJpJsV/gSM4t59tpDyPi1sd6ZaPFfsA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz",
+      "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.3",
+        "call-bind": "^1.0.6",
+        "es-errors": "^1.3.0",
         "is-regex": "^1.1.4"
       },
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -14763,9 +14809,9 @@
       "dev": true
     },
     "node_modules/serialize-javascript": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.1.tgz",
-      "integrity": "sha512-owoXEFjWRllis8/M1Q+Cw5k8ZH40e3zhp/ovX+Xr/vi1qj6QesbyXXViFbpNvWvPNAD62SutwEXavefrLJWj7w==",
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz",
+      "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==",
       "dev": true,
       "dependencies": {
         "randombytes": "^2.1.0"
@@ -14871,28 +14917,31 @@
       "dev": true
     },
     "node_modules/set-function-length": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.1.1.tgz",
-      "integrity": "sha512-VoaqjbBJKiWtg4yRcKBQ7g7wnGnLV3M8oLvVWwOk2PdYY6PEFegR1vezXR0tw6fZGF9csVakIRjrJiy2veSBFQ==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.1.tgz",
+      "integrity": "sha512-j4t6ccc+VsKwYHso+kElc5neZpjtq9EnRICFZtWyBsLojhmeF/ZBd/elqm22WJh/BziDe/SBiOeAt0m2mfLD0g==",
       "dependencies": {
-        "define-data-property": "^1.1.1",
-        "get-intrinsic": "^1.2.1",
+        "define-data-property": "^1.1.2",
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.2.3",
         "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0"
+        "has-property-descriptors": "^1.0.1"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/set-function-name": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz",
-      "integrity": "sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz",
+      "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==",
       "dev": true,
       "dependencies": {
-        "define-data-property": "^1.0.1",
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
         "functions-have-names": "^1.2.3",
-        "has-property-descriptors": "^1.0.0"
+        "has-property-descriptors": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -14953,13 +15002,17 @@
       "deprecated": "older versions vulnerable to prototype pollution"
     },
     "node_modules/side-channel": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
-      "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz",
+      "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==",
       "dependencies": {
-        "call-bind": "^1.0.0",
-        "get-intrinsic": "^1.0.2",
-        "object-inspect": "^1.9.0"
+        "call-bind": "^1.0.7",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.4",
+        "object-inspect": "^1.13.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -14972,13 +15025,13 @@
       "dev": true
     },
     "node_modules/sirv": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.3.tgz",
-      "integrity": "sha512-O9jm9BsID1P+0HOi81VpXPoDxYP374pkOLzACAoyUQ/3OUVndNpsz6wMnY2z+yOxzbllCKZrM+9QrWsv4THnyA==",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.4.tgz",
+      "integrity": "sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==",
       "dev": true,
       "dependencies": {
-        "@polka/url": "^1.0.0-next.20",
-        "mrmime": "^1.0.0",
+        "@polka/url": "^1.0.0-next.24",
+        "mrmime": "^2.0.0",
         "totalist": "^3.0.0"
       },
       "engines": {
@@ -15102,9 +15155,9 @@
       }
     },
     "node_modules/spdx-exceptions": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz",
-      "integrity": "sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A==",
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.5.0.tgz",
+      "integrity": "sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==",
       "dev": true
     },
     "node_modules/spdx-expression-parse": {
@@ -15118,9 +15171,9 @@
       }
     },
     "node_modules/spdx-license-ids": {
-      "version": "3.0.16",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.16.tgz",
-      "integrity": "sha512-eWN+LnM3GR6gPu35WxNgbGl8rmY1AEmoMDvL/QD6zYmPWgywxWqJWNdLGT+ke8dKNWrcYgYjPpG5gbTfghP8rw==",
+      "version": "3.0.17",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.17.tgz",
+      "integrity": "sha512-sh8PWc/ftMqAAdFiBu6Fy6JUOYjqDJBJvIhpfDMyHrr0Rbp5liZqd4TjtQ/RgfLjKFZb+LMx5hpml5qOWy0qvg==",
       "dev": true
     },
     "node_modules/spdy": {
@@ -15631,9 +15684,9 @@
       }
     },
     "node_modules/terser": {
-      "version": "5.26.0",
-      "resolved": "https://registry.npmjs.org/terser/-/terser-5.26.0.tgz",
-      "integrity": "sha512-dytTGoE2oHgbNV9nTzgBEPaqAWvcJNl66VZ0BkJqlvp71IjO8CxdBx/ykCNb47cLnCmCvRZ6ZR0tLkqvZCdVBQ==",
+      "version": "5.28.1",
+      "resolved": "https://registry.npmjs.org/terser/-/terser-5.28.1.tgz",
+      "integrity": "sha512-wM+bZp54v/E9eRRGXb5ZFDvinrJIOaTapx3WUokyVGZu5ucVCK55zEgGd5Dl2fSr3jUo5sDiERErUWLY6QPFyA==",
       "dev": true,
       "dependencies": {
         "@jridgewell/source-map": "^0.3.3",
@@ -15649,16 +15702,16 @@
       }
     },
     "node_modules/terser-webpack-plugin": {
-      "version": "5.3.9",
-      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.9.tgz",
-      "integrity": "sha512-ZuXsqE07EcggTWQjXUj+Aot/OMcD0bMKGgF63f7UxYcu5/AJF53aIpK1YoP5xR9l6s/Hy2b+t1AM0bLNPRuhwA==",
+      "version": "5.3.10",
+      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.10.tgz",
+      "integrity": "sha512-BKFPWlPDndPs+NGGCr1U59t0XScL5317Y0UReNrHaw9/FwhPENlq6bfgs+4yPfyP51vqC1bQ4rp1EfXW5ZSH9w==",
       "dev": true,
       "dependencies": {
-        "@jridgewell/trace-mapping": "^0.3.17",
+        "@jridgewell/trace-mapping": "^0.3.20",
         "jest-worker": "^27.4.5",
         "schema-utils": "^3.1.1",
         "serialize-javascript": "^6.0.1",
-        "terser": "^5.16.8"
+        "terser": "^5.26.0"
       },
       "engines": {
         "node": ">= 10.13.0"
@@ -15796,15 +15849,12 @@
       "dev": true
     },
     "node_modules/tmp": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.1.tgz",
-      "integrity": "sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==",
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.3.tgz",
+      "integrity": "sha512-nZD7m9iCPC5g0pYmcaxogYKggSfLsdxl8of3Q/oIbqCqLLIO9IAF0GWjX1z9NZRHPiXv8Wex4yDCaZsgEw0Y8w==",
       "dev": true,
-      "dependencies": {
-        "rimraf": "^3.0.0"
-      },
       "engines": {
-        "node": ">=8.17.0"
+        "node": ">=14.14"
       }
     },
     "node_modules/to-fast-properties": {
@@ -15876,14 +15926,6 @@
       "integrity": "sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw==",
       "dev": true
     },
-    "node_modules/ts-custom-error": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/ts-custom-error/-/ts-custom-error-3.3.1.tgz",
-      "integrity": "sha512-5OX1tzOjxWEgsr/YEUWSuPrQ00deKLh6D7OTWcvNHm12/7QPyRh8SYpyWvA4IZv8H/+GQWQEh/kwo95Q9OVW1A==",
-      "engines": {
-        "node": ">=14.0.0"
-      }
-    },
     "node_modules/ts-loader": {
       "version": "9.5.1",
       "resolved": "https://registry.npmjs.org/ts-loader/-/ts-loader-9.5.1.tgz",
@@ -15975,9 +16017,9 @@
       }
     },
     "node_modules/ts-loader/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -16089,29 +16131,30 @@
       }
     },
     "node_modules/typed-array-buffer": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.0.tgz",
-      "integrity": "sha512-Y8KTSIglk9OZEr8zywiIHG/kmQ7KWyjseXs1CbSo8vC42w7hg2HgYTxSWwP0+is7bWDc1H+Fo026CpHFwm8tkw==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz",
+      "integrity": "sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1",
-        "is-typed-array": "^1.1.10"
+        "call-bind": "^1.0.7",
+        "es-errors": "^1.3.0",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/typed-array-byte-length": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.0.tgz",
-      "integrity": "sha512-Or/+kvLxNpeQ9DtSydonMxCx+9ZXOswtwJn17SNLvhptaXYDJvkFFP5zbfU/uLmvnBJlI4yrnXRxpdWH/M5tNA==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz",
+      "integrity": "sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "has-proto": "^1.0.1",
-        "is-typed-array": "^1.1.10"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
@@ -16121,16 +16164,17 @@
       }
     },
     "node_modules/typed-array-byte-offset": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.0.tgz",
-      "integrity": "sha512-RD97prjEt9EL8YgAgpOkf3O4IF9lhJFr9g0htQkm0rchFp/Vx7LW5Q8fSXXub7BXAODyUQohRMyOc3faCPd0hg==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz",
+      "integrity": "sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==",
       "dev": true,
       "dependencies": {
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.2",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "has-proto": "^1.0.1",
-        "is-typed-array": "^1.1.10"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
@@ -16140,14 +16184,20 @@
       }
     },
     "node_modules/typed-array-length": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.4.tgz",
-      "integrity": "sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==",
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.5.tgz",
+      "integrity": "sha512-yMi0PlwuznKHxKmcpoOdeLwxBoVPkqZxd7q2FgMkmD3bNwvF5VW0+UlUQ1k1vmktTu4Yu13Q0RIxEP8+B+wloA==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "is-typed-array": "^1.1.9"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13",
+        "possible-typed-array-names": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -16182,9 +16232,9 @@
       }
     },
     "node_modules/undici": {
-      "version": "5.26.5",
-      "resolved": "https://registry.npmjs.org/undici/-/undici-5.26.5.tgz",
-      "integrity": "sha512-cSb4bPFd5qgR7qr2jYAi0hlX9n5YKK2ONKkLFkxl+v/9BvC0sOpZjBHDBSXc5lWAf5ty9oZdRXytBIHzgUcerw==",
+      "version": "5.28.3",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-5.28.3.tgz",
+      "integrity": "sha512-3ItfzbrhDlINjaP0duwnNsKpDQk3acHI3gVJ1z4fmwMK31k5G9OVIAMLSIaP6w4FaGkaAkN6zaQO9LUvZ1t7VA==",
       "dependencies": {
         "@fastify/busboy": "^2.0.0"
       },
@@ -16416,15 +16466,15 @@
       }
     },
     "node_modules/vue": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.3.11.tgz",
-      "integrity": "sha512-d4oBctG92CRO1cQfVBZp6WJAs0n8AK4Xf5fNjQCBeKCvMI1efGQ5E3Alt1slFJS9fZuPcFoiAiqFvQlv1X7t/w==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.21.tgz",
+      "integrity": "sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==",
       "dependencies": {
-        "@vue/compiler-dom": "3.3.11",
-        "@vue/compiler-sfc": "3.3.11",
-        "@vue/runtime-dom": "3.3.11",
-        "@vue/server-renderer": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/compiler-dom": "3.4.21",
+        "@vue/compiler-sfc": "3.4.21",
+        "@vue/runtime-dom": "3.4.21",
+        "@vue/server-renderer": "3.4.21",
+        "@vue/shared": "3.4.21"
       },
       "peerDependencies": {
         "typescript": "*"
@@ -16435,14 +16485,6 @@
         }
       }
     },
-    "node_modules/vue-barcode-reader": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/vue-barcode-reader/-/vue-barcode-reader-1.0.3.tgz",
-      "integrity": "sha512-z4mv7+ai/8vECppBTb00tHnyFMMx6W1rAaQe+v214ihoaWK9iGrn8ZZsmgSxf3lwnrtGaibLdkonTtMrGsO+dA==",
-      "dependencies": {
-        "@zxing/library": "^0.19.1"
-      }
-    },
     "node_modules/vue-cli-plugin-i18n": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/vue-cli-plugin-i18n/-/vue-cli-plugin-i18n-1.0.1.tgz",
@@ -16460,187 +16502,20 @@
       }
     },
     "node_modules/vue-cli-plugin-i18n/node_modules/@vue/compiler-sfc": {
-      "version": "2.7.15",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.15.tgz",
-      "integrity": "sha512-FCvIEevPmgCgqFBH7wD+3B97y7u7oj/Wr69zADBf403Tui377bThTjBvekaZvlRr4IwUAu3M6hYZeULZFJbdYg==",
+      "version": "2.7.16",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.16.tgz",
+      "integrity": "sha512-KWhJ9k5nXuNtygPU7+t1rX6baZeqOYLEforUPjgNDBnLicfHCoi48H87Q8XyLZOrNNsmhuwKqtpDQWjEFe6Ekg==",
       "dev": true,
       "dependencies": {
-        "@babel/parser": "^7.18.4",
+        "@babel/parser": "^7.23.5",
         "postcss": "^8.4.14",
         "source-map": "^0.6.1"
-      }
-    },
-    "node_modules/vue-cli-plugin-i18n/node_modules/dotenv": {
-      "version": "8.6.0",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.6.0.tgz",
-      "integrity": "sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/vue-cli-plugin-i18n/node_modules/vue": {
-      "version": "2.7.15",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-2.7.15.tgz",
-      "integrity": "sha512-a29fsXd2G0KMRqIFTpRgpSbWaNBK3lpCTOLuGLEDnlHWdjB8fwl6zyYZ8xCrqkJdatwZb4mGHiEfJjnw0Q6AwQ==",
-      "dev": true,
-      "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",
-      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.28.2.tgz",
-      "integrity": "sha512-C5GZjs1tYlAqjwymaaCPDjCyGo10ajUphiwA922jKt9n7KPpqR7oM1PCwYzhB/E7+nT3wfdG3oRre5raIT1rKA==",
-      "dev": true
-    },
-    "node_modules/vue-component-type-helpers": {
-      "version": "1.8.25",
-      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-1.8.25.tgz",
-      "integrity": "sha512-NCA6sekiJIMnMs4DdORxATXD+/NRkQpS32UC+I1KQJUasx+Z7MZUb3Y+MsKsFmX+PgyTYSteb73JW77AibaCCw==",
-      "dev": true
-    },
-    "node_modules/vue-eslint-parser": {
-      "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz",
-      "integrity": "sha512-dzHGG3+sYwSf6zFBa0Gi9ZDshD7+ad14DGOdTLjruRVgZXe2J+DcZ9iUhyR48z5g1PqRa20yt3Njna/veLJL/g==",
-      "dev": true,
-      "dependencies": {
-        "debug": "^4.3.2",
-        "eslint-scope": "^7.0.0",
-        "eslint-visitor-keys": "^3.1.0",
-        "espree": "^9.0.0",
-        "esquery": "^1.4.0",
-        "lodash": "^4.17.21",
-        "semver": "^7.3.5"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       },
-      "funding": {
-        "url": "https://github.com/sponsors/mysticatea"
-      },
-      "peerDependencies": {
-        "eslint": ">=6.0.0"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/eslint-scope": {
-      "version": "7.2.2",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
-      "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
-      "dev": true,
-      "dependencies": {
-        "esrecurse": "^4.3.0",
-        "estraverse": "^5.2.0"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/eslint"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/espree": {
-      "version": "9.6.1",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
-      "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==",
-      "dev": true,
-      "dependencies": {
-        "acorn": "^8.9.0",
-        "acorn-jsx": "^5.3.2",
-        "eslint-visitor-keys": "^3.4.1"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/eslint"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/estraverse": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
-      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
-      "dev": true,
-      "engines": {
-        "node": ">=4.0"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-      "dev": true,
-      "dependencies": {
-        "lru-cache": "^6.0.0"
-      },
-      "bin": {
-        "semver": "bin/semver.js"
-      },
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
-    "node_modules/vue-hot-reload-api": {
-      "version": "2.3.4",
-      "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
-      "integrity": "sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==",
-      "dev": true
-    },
-    "node_modules/vue-i18n": {
-      "version": "9.1.10",
-      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.1.10.tgz",
-      "integrity": "sha512-jpr7gV5KPk4n+sSPdpZT8Qx3XzTcNDWffRlHV/cT2NUyEf+sEgTTmLvnBAibjOFJ0zsUyZlVTAWH5DDnYep+1g==",
-      "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",
-      "resolved": "https://registry.npmjs.org/vue-i18n-extract/-/vue-i18n-extract-1.0.2.tgz",
-      "integrity": "sha512-+zwDKvle4KcfloXZnj5hF01ViKDiFr5RMx5507D7oyDXpSleRpekF5YHgZa/+Ra6Go68//z0Nya58J9tKFsCjw==",
-      "dev": true,
-      "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"
+      "optionalDependencies": {
+        "prettier": "^1.18.2 || ^2.0.0"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/ansi-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/ansi-regex": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.1.tgz",
       "integrity": "sha512-+O9Jct8wf++lXxxFc4hc8LsjaSq0HFzzL7cVsw8pRDIPdjKD2mT4ytDZlLuSBZ4cLKZFXIrMGO7DbQCtMJJMKw==",
@@ -16649,7 +16524,7 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/camelcase": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/camelcase": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
       "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
@@ -16658,7 +16533,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cli-table3": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cli-table3": {
       "version": "0.5.1",
       "resolved": "https://registry.npmjs.org/cli-table3/-/cli-table3-0.5.1.tgz",
       "integrity": "sha512-7Qg2Jrep1S/+Q3EceiZtQcDPWxhAvBw+ERf1162v4sikJrvojMHFqXt8QIVha8UlH9rgU0BeWPytZ9/TzYqlUw==",
@@ -16674,7 +16549,7 @@
         "colors": "^1.1.2"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cliui": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cliui": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
       "integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
@@ -16685,7 +16560,7 @@
         "wrap-ansi": "^5.1.0"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/ansi-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cliui/node_modules/ansi-regex": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
       "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
@@ -16694,7 +16569,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/string-width": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cliui/node_modules/string-width": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
       "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
@@ -16708,7 +16583,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/strip-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cliui/node_modules/strip-ansi": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
       "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
@@ -16720,13 +16595,31 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/emoji-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/dotenv": {
+      "version": "8.6.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.6.0.tgz",
+      "integrity": "sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/vue-cli-plugin-i18n/node_modules/emoji-regex": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-7.0.3.tgz",
       "integrity": "sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA==",
       "dev": true
     },
-    "node_modules/vue-i18n-extract/node_modules/find-up": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/esm": {
+      "version": "3.2.25",
+      "resolved": "https://registry.npmjs.org/esm/-/esm-3.2.25.tgz",
+      "integrity": "sha512-U1suiZ2oDVWv4zPO56S0NcR5QriEahGtdN2OR6FiOG4WJvcjBVFB0qI4+eKoWFH483PKGuLuu6V8Z4T5g63UVA==",
+      "dev": true,
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/vue-cli-plugin-i18n/node_modules/find-up": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
       "integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
@@ -16738,7 +16631,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/is-fullwidth-code-point": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/is-fullwidth-code-point": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
       "integrity": "sha512-VHskAKYM8RfSFXwee5t5cbN5PZeq1Wrh6qd5bkyiXIf6UQcN6w/A0eXM9r6t8d+GYOh+o6ZhiEnb88LN/Y8m2w==",
@@ -16747,7 +16640,7 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/locate-path": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/locate-path": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
       "integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
@@ -16760,7 +16653,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/p-locate": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/p-locate": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-3.0.0.tgz",
       "integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
@@ -16772,7 +16665,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/path-exists": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/path-exists": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
       "integrity": "sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ==",
@@ -16781,7 +16674,7 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/string-width": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/string-width": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
       "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
@@ -16794,7 +16687,7 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/strip-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/strip-ansi": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
       "integrity": "sha512-4XaJ2zQdCzROZDivEVIDPkcQn8LMFSa8kj8Gxb/Lnwzv9A8VctNZ+lfivC/sV3ivW8ElJTERXZoPBRrZKkNKow==",
@@ -16806,7 +16699,41 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/vue": {
+      "version": "2.7.16",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-2.7.16.tgz",
+      "integrity": "sha512-4gCtFXaAA3zYZdTp5s4Hl2sozuySsgz4jy1EnpBHNfpMa9dK1ZCG7viqBPCwXtmgc8nHqUsAu3G4gtmXkkY3Sw==",
+      "deprecated": "Vue 2 has reached EOL and is no longer actively maintained. See https://v2.vuejs.org/eol/ for more details.",
+      "dev": true,
+      "dependencies": {
+        "@vue/compiler-sfc": "2.7.16",
+        "csstype": "^3.1.0"
+      }
+    },
+    "node_modules/vue-cli-plugin-i18n/node_modules/vue-i18n": {
+      "version": "8.28.2",
+      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.28.2.tgz",
+      "integrity": "sha512-C5GZjs1tYlAqjwymaaCPDjCyGo10ajUphiwA922jKt9n7KPpqR7oM1PCwYzhB/E7+nT3wfdG3oRre5raIT1rKA==",
+      "dev": true
+    },
+    "node_modules/vue-cli-plugin-i18n/node_modules/vue-i18n-extract": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/vue-i18n-extract/-/vue-i18n-extract-1.0.2.tgz",
+      "integrity": "sha512-+zwDKvle4KcfloXZnj5hF01ViKDiFr5RMx5507D7oyDXpSleRpekF5YHgZa/+Ra6Go68//z0Nya58J9tKFsCjw==",
+      "dev": true,
+      "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-cli-plugin-i18n/node_modules/wrap-ansi": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-5.1.0.tgz",
       "integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
@@ -16820,7 +16747,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/ansi-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/wrap-ansi/node_modules/ansi-regex": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
       "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
@@ -16829,7 +16756,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/string-width": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/wrap-ansi/node_modules/string-width": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
       "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
@@ -16843,7 +16770,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/strip-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/wrap-ansi/node_modules/strip-ansi": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
       "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
@@ -16855,13 +16782,13 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/y18n": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/y18n": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
       "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==",
       "dev": true
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs": {
       "version": "13.3.2",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",
       "integrity": "sha512-AX3Zw5iPruN5ie6xGRIDgqkT+ZhnRlZMLMHAs8tg7nRruy2Nb+i5o9bwghAogtM08q1dpr2LVoS8KSTMYpWXUw==",
@@ -16879,7 +16806,7 @@
         "yargs-parser": "^13.1.2"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs-parser": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs-parser": {
       "version": "13.1.2",
       "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.2.tgz",
       "integrity": "sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==",
@@ -16889,7 +16816,7 @@
         "decamelize": "^1.2.0"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/ansi-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs/node_modules/ansi-regex": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
       "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
@@ -16898,7 +16825,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/string-width": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs/node_modules/string-width": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
       "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
@@ -16912,7 +16839,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/strip-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs/node_modules/strip-ansi": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
       "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
@@ -16924,6 +16851,134 @@
         "node": ">=6"
       }
     },
+    "node_modules/vue-component-type-helpers": {
+      "version": "1.8.27",
+      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-1.8.27.tgz",
+      "integrity": "sha512-0vOfAtI67UjeO1G6UiX5Kd76CqaQ67wrRZiOe7UAb9Jm6GzlUr/fC7CV90XfwapJRjpCMaZFhv1V0ajWRmE9Dg==",
+      "dev": true
+    },
+    "node_modules/vue-eslint-parser": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz",
+      "integrity": "sha512-dzHGG3+sYwSf6zFBa0Gi9ZDshD7+ad14DGOdTLjruRVgZXe2J+DcZ9iUhyR48z5g1PqRa20yt3Njna/veLJL/g==",
+      "dev": true,
+      "dependencies": {
+        "debug": "^4.3.2",
+        "eslint-scope": "^7.0.0",
+        "eslint-visitor-keys": "^3.1.0",
+        "espree": "^9.0.0",
+        "esquery": "^1.4.0",
+        "lodash": "^4.17.21",
+        "semver": "^7.3.5"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mysticatea"
+      },
+      "peerDependencies": {
+        "eslint": ">=6.0.0"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/eslint-scope": {
+      "version": "7.2.2",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
+      "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
+      "dev": true,
+      "dependencies": {
+        "esrecurse": "^4.3.0",
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/espree": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
+      "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==",
+      "dev": true,
+      "dependencies": {
+        "acorn": "^8.9.0",
+        "acorn-jsx": "^5.3.2",
+        "eslint-visitor-keys": "^3.4.1"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/estraverse": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
+      "dev": true,
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dev": true,
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/semver": {
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "dev": true,
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true
+    },
+    "node_modules/vue-hot-reload-api": {
+      "version": "2.3.4",
+      "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
+      "integrity": "sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==",
+      "dev": true
+    },
+    "node_modules/vue-i18n": {
+      "version": "9.1.10",
+      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.1.10.tgz",
+      "integrity": "sha512-jpr7gV5KPk4n+sSPdpZT8Qx3XzTcNDWffRlHV/cT2NUyEf+sEgTTmLvnBAibjOFJ0zsUyZlVTAWH5DDnYep+1g==",
+      "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/node_modules/@intlify/core-base": {
       "version": "9.1.10",
       "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.1.10.tgz",
@@ -16962,9 +17017,9 @@
       }
     },
     "node_modules/vue-loader": {
-      "version": "17.3.1",
-      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-17.3.1.tgz",
-      "integrity": "sha512-nmVu7KU8geOyzsStyyaxID/uBGDMS8BkPXb6Lu2SNkMawriIbb+hYrNtgftHMKxOSkjjjTF5OSSwPo3KP59egg==",
+      "version": "17.4.2",
+      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-17.4.2.tgz",
+      "integrity": "sha512-yTKOA4R/VN4jqjw4y5HrynFL8AK0Z3/Jt7eOJXEitsm0GMRHDBjCfCiuTiLP7OESvsZYo2pATCWhDqxC5ZrM6w==",
       "dev": true,
       "dependencies": {
         "chalk": "^4.1.0",
@@ -17059,11 +17114,11 @@
       "integrity": "sha512-PGGwFarWpReyJc8XONuNBb86mpfLqYO6+MWjkFnCDWcagjM2BLY7rskLTgn3eT3skq0qu+2K2roiIAgiXJDXSQ=="
     },
     "node_modules/vue-router": {
-      "version": "4.2.5",
-      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.2.5.tgz",
-      "integrity": "sha512-DIUpKcyg4+PTQKfFPX88UWhlagBEBEfJ5A8XDXRJLUnZOvcpMF8o/dnL90vpVkGaPbjvXazV/rC1qBKrZlFugw==",
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.3.0.tgz",
+      "integrity": "sha512-dqUcs8tUeG+ssgWhcPbjHvazML16Oga5w34uCUmsk7i0BcnskoLGwjpa15fqMr2Fa5JgVBrdL2MEgqz6XZ/6IQ==",
       "dependencies": {
-        "@vue/devtools-api": "^6.5.0"
+        "@vue/devtools-api": "^6.5.1"
       },
       "funding": {
         "url": "https://github.com/sponsors/posva"
@@ -17182,19 +17237,19 @@
       "dev": true
     },
     "node_modules/webpack": {
-      "version": "5.89.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.89.0.tgz",
-      "integrity": "sha512-qyfIC10pOr70V+jkmud8tMfajraGCZMBWJtrmuBymQKCrLTRejBI8STDp1MCyZu/QTdZSeacCQYpYNQVOzX5kw==",
+      "version": "5.90.3",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.90.3.tgz",
+      "integrity": "sha512-h6uDYlWCctQRuXBs1oYpVe6sFcWedl0dpcVaTf/YF67J9bKvwJajFulMVSYKHrksMB3I/pIagRzDxwxkebuzKA==",
       "dev": true,
       "dependencies": {
         "@types/eslint-scope": "^3.7.3",
-        "@types/estree": "^1.0.0",
+        "@types/estree": "^1.0.5",
         "@webassemblyjs/ast": "^1.11.5",
         "@webassemblyjs/wasm-edit": "^1.11.5",
         "@webassemblyjs/wasm-parser": "^1.11.5",
         "acorn": "^8.7.1",
         "acorn-import-assertions": "^1.9.0",
-        "browserslist": "^4.14.5",
+        "browserslist": "^4.21.10",
         "chrome-trace-event": "^1.0.2",
         "enhanced-resolve": "^5.15.0",
         "es-module-lexer": "^1.2.1",
@@ -17208,7 +17263,7 @@
         "neo-async": "^2.6.2",
         "schema-utils": "^3.2.0",
         "tapable": "^2.1.1",
-        "terser-webpack-plugin": "^5.3.7",
+        "terser-webpack-plugin": "^5.3.10",
         "watchpack": "^2.4.0",
         "webpack-sources": "^3.2.3"
       },
@@ -17280,6 +17335,7 @@
       "version": "6.5.1",
       "resolved": "https://registry.npmjs.org/webpack-chain/-/webpack-chain-6.5.1.tgz",
       "integrity": "sha512-7doO/SRtLu8q5WM0s7vPKPWX580qhi0/yBHkOxNkv50f6qB76Zy9o2wRTrrPULqYTvQlVHuvbA8v+G5ayuUDsA==",
+      "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.",
       "dev": true,
       "dependencies": {
         "deepmerge": "^1.5.2",
@@ -17504,9 +17560,9 @@
       }
     },
     "node_modules/webpack-dev-server/node_modules/ws": {
-      "version": "8.14.2",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.14.2.tgz",
-      "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==",
+      "version": "8.16.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz",
+      "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==",
       "dev": true,
       "engines": {
         "node": ">=10.0.0"
@@ -17602,9 +17658,9 @@
       }
     },
     "node_modules/whatwg-fetch": {
-      "version": "3.6.19",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.6.19.tgz",
-      "integrity": "sha512-d67JP4dHSbm2TrpFj8AbO8DnL1JXL5J9u0Kq2xW6d0TFDbCA3Muhdt8orXC22utleTVj7Prqt82baN6RBvnEgw==",
+      "version": "3.6.20",
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.6.20.tgz",
+      "integrity": "sha512-EqhiFU6daOA8kpjOWTL0olhVOF3i7OrFzSYiGsEMB8GcXS+RrzauAERX65xMeNWVqxA6HXH2m69Z9LaKKdisfg==",
       "dev": true
     },
     "node_modules/whatwg-url": {
@@ -17652,16 +17708,16 @@
       "dev": true
     },
     "node_modules/which-typed-array": {
-      "version": "1.1.13",
-      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.13.tgz",
-      "integrity": "sha512-P5Nra0qjSncduVPEAr7xhoF5guty49ArDTwzJ/yNuPIbZppyRxFQsRCWrocxIY+CnMVG+qfbU2FmDKyvSGClow==",
+      "version": "1.1.14",
+      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.14.tgz",
+      "integrity": "sha512-VnXFiIW8yNn9kIHN88xvZ4yOWchftKDsRJ8fEPacX/wl1lOvBrhsJ/OeJCXq7B0AaijRuqgzSKalJoPk+D8MPg==",
       "dev": true,
       "dependencies": {
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.4",
+        "available-typed-arrays": "^1.0.6",
+        "call-bind": "^1.0.5",
         "for-each": "^0.3.3",
         "gopd": "^1.0.1",
-        "has-tostringtag": "^1.0.0"
+        "has-tostringtag": "^1.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -17886,6 +17942,7 @@
       "version": "6.6.0",
       "resolved": "https://registry.npmjs.org/workbox-google-analytics/-/workbox-google-analytics-6.6.0.tgz",
       "integrity": "sha512-p4DJa6OldXWd6M9zRl0H6vB9lkrmqYFkRQ2xEiNdBFp9U0LhsGO7hsBscVEyH9H2/3eZZt8c97NB2FD9U2NJ+Q==",
+      "deprecated": "It is not compatible with newer versions of GA starting with v4, as long as you are using GAv3 it should be ok, but the package is not longer being maintained",
       "dev": true,
       "dependencies": {
         "workbox-background-sync": "6.6.0",
diff --git a/package.json b/package.json
index 716c9117..e3c464a6 100644
--- a/package.json
+++ b/package.json
@@ -18,12 +18,12 @@
     "@casl/ability": "^6.0.0",
     "@casl/vue": "^2.2.0",
     "@hotwax/app-version-info": "^1.0.0",
-    "@hotwax/apps-theme": "^1.1.0",
-    "@hotwax/dxp-components": "1.11.0",
+    "@hotwax/apps-theme": "^1.2.6",
+    "@hotwax/dxp-components": "1.12.1",
     "@hotwax/oms-api": "^1.10.0",
-    "@ionic/core": "6.7.5",
-    "@ionic/vue": "6.7.5",
-    "@ionic/vue-router": "6.7.5",
+    "@ionic/core": "7.6.0",
+    "@ionic/vue": "7.6.0",
+    "@ionic/vue-router": "7.6.0",
     "boolean-parser": "0.0.2",
     "boon-js": "^2.0.3",
     "core-js": "^3.6.5",
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 0992a3b1..92bf21f6 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -28,13 +28,11 @@
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">
       <ion-icon slot="start" :icon="storefrontOutline"/>
-      <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
-      <ion-toggle slot="end" />
+      <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
       <ion-icon slot="start" :icon="sendOutline"/>
-      <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
-      <ion-toggle slot="end" />
+      <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
     </ion-item>
 
     <ion-list>
@@ -225,8 +223,8 @@ ion-card {
 }
 ion-card-header {
   display: flex;
+  flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  padding-bottom: 0px;
 }
 </style>
\ No newline at end of file
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 81fe7959..1fafa20c 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -138,10 +138,13 @@ export default defineComponent({
 </script>
 
 <style scoped>
+ion-card {
+  min-width: 375px;
+}
 ion-card-header {
   display: flex;
+  flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  padding-bottom: 0px;
 }
 </style>
\ No newline at end of file
diff --git a/src/views/SelectProduct.vue b/src/views/SelectProduct.vue
index 2004028f..10cf9375 100644
--- a/src/views/SelectProduct.vue
+++ b/src/views/SelectProduct.vue
@@ -120,7 +120,7 @@
             <section class="section-grid">
               <div v-for="variant in product.variants" :key="variant">
                 <ion-card>
-                  <ShopifyImg :src="variant.mainImageUrl" />
+                  <DxpShopifyImg :src="variant.mainImageUrl" />
                   <ion-item lines="none">
                     <ion-label class="ion-text-wrap">
                       {{ variant.productName }}
@@ -163,7 +163,7 @@
 </template>
 
 <script lang="ts">
-import { ShopifyImg } from '@hotwax/dxp-components'; 
+import { DxpShopifyImg } from '@hotwax/dxp-components'; 
 import {
   alertController,
   IonBackButton,
@@ -234,7 +234,7 @@ export default defineComponent({
     IonSelectOption,
     IonTitle,
     IonToolbar,
-    ShopifyImg
+    DxpShopifyImg
   },
   computed: {
     ...mapGetters({

From 041f9e43696cbc5821b85fb0914b6c0d4e8a3ecb Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 6 Mar 2024 16:22:22 +0530
Subject: [PATCH 006/250] Improved: code according to changes in ionic 7 (#238)

---
 src/views/Settings.vue | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index 74ee1a8f..ad875b8c 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -35,7 +35,7 @@
         <h1>{{ $t('OMS') }}</h1>
       </div>
       <section>
-        <OmsInstanceNavigator />
+        <DxpOmsInstanceNavigator />
 
         <ion-card>
           <ion-card-header>
@@ -50,8 +50,7 @@
             {{ $t('A store repesents a company or a unique catalog of products. If your OMS is connected to multiple eCommerce stores sellling different collections of products, you may have multiple Product Stores set up in HotWax Commerce.') }}
           </ion-card-content>
           <ion-item lines="none">
-            <ion-label>{{ $t("Select store") }}</ion-label>
-            <ion-select interface="popover" :value="currentEComStore.productStoreId" @ionChange="setEComStore($event)">
+            <ion-select :label="$t('Select store')" interface="popover" :value="currentEComStore.productStoreId" @ionChange="setEComStore($event)">
               <ion-select-option v-for="store in (userProfile ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName }}</ion-select-option>
             </ion-select>
           </ion-item>

From f7ec26c305d5e0b3f5040b6a4c81a99cd812d437 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 6 Mar 2024 18:03:02 +0530
Subject: [PATCH 007/250] Improved: code syntax, removed app permissions for
 now, improved logic (#238)

---
 src/components/Menu.vue         | 35 +++++++++++----------------------
 src/components/RuleItem.vue     |  8 ++++----
 src/main.ts                     |  1 +
 src/router/index.ts             | 33 +++++++++----------------------
 src/views/InventoryChannels.vue |  4 ++++
 src/views/SelectProduct.vue     |  2 +-
 6 files changed, 30 insertions(+), 53 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index e2bc81d6..89ac41a8 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -2,7 +2,7 @@
   <ion-menu content-id="main" type="overlay" :disabled="!isUserAuthenticated">
     <ion-header>
       <ion-toolbar>
-        <ion-title>{{ $t("Available to Promise") }}</ion-title>
+        <ion-title>{{ translate("Available to Promise") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     <ion-content>
@@ -67,6 +67,7 @@
   import { useRouter } from "vue-router";
   import { cloudUploadOutline, globeOutline, optionsOutline, settingsOutline, sendOutline, storefrontOutline, pulseOutline } from 'ionicons/icons';
   import emitter from "@/event-bus";
+  import { translate } from "@hotwax/dxp-components";
   
   export default defineComponent({
     name: "Menu",
@@ -132,46 +133,31 @@
           title: "Threshold",
           url: "/threshold",
           iosIcon: globeOutline,
-          mdIcon: globeOutline,
-          meta: {
-            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-          }
+          mdIcon: globeOutline
         },
         {
           title: "Safety stock",
           url: "/safety-stock",
           iosIcon: pulseOutline,
-          mdIcon: pulseOutline,
-          meta: {
-            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-          }
+          mdIcon: pulseOutline
         },
         {
           title: "Store pickup",
           url: "/store-pickup",
           iosIcon: storefrontOutline,
-          mdIcon: storefrontOutline,
-          meta: {
-            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-          }
+          mdIcon: storefrontOutline
         },
         {
           title: "Shipping",
           url: "/shipping",
           iosIcon: sendOutline,
-          mdIcon: sendOutline,
-          meta: {
-            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-          }
+          mdIcon: sendOutline
         },
         {
           title: "Inventory channels",
           url: "/inventory-channels",
           iosIcon: cloudUploadOutline,
-          mdIcon: cloudUploadOutline,
-          meta: {
-            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-          }
+          mdIcon: cloudUploadOutline
         },
         {
           title: "Settings",
@@ -189,16 +175,17 @@
       return {
         appPages,
         cloudUploadOutline,
-        hasPermission,
-        router,
         globeOutline,
-        pulseOutline,
+        hasPermission,
         optionsOutline,
+        pulseOutline,
+        router,
         settingsOutline,
         selectedIndex,
         sendOutline,
         storefrontOutline,
         store,
+        translate
       };
     },
   });
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 92bf21f6..c8f8917a 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -61,11 +61,11 @@
 
       <ion-item>
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
       </ion-item>
       <ion-item lines="none">
         <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
       </ion-item>
 
       <ion-item-divider color="light">
@@ -77,11 +77,11 @@
 
       <ion-item>
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ "<Product Features, Product Features>" }}</ion-label>
       </ion-item>
       <ion-item lines="full">
         <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ "<Product Features, Product Features>" }}</ion-label>
         </ion-item>
 
         <ion-item lines="none">
diff --git a/src/main.ts b/src/main.ts
index ca755e6f..cc82cf8e 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -37,6 +37,7 @@ import { login, logout, loader } from './user-utils';
 import { getConfig, initialise } from '@/adapter'
 import localeMessages from '@/locales';
 
+
 const app = createApp(App)
   .use(IonicVue, {
     mode: 'md'
diff --git a/src/router/index.ts b/src/router/index.ts
index ea017a04..39a9c3b9 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -67,46 +67,31 @@ const routes: Array<RouteRecordRaw> = [
     path: '/threshold',
     name: 'Threshold',
     component: Threshold,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_SELECT_PRODUCT_VIEW"
-    }
-  },    
+    beforeEnter: authGuard
+  },
   {
     path: '/safety-stock',
     name: 'Safety stock',
     component: SafetyStock,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_SELECT_PRODUCT_VIEW"
-    }
-  },  
+    beforeEnter: authGuard
+  },
   {
     path: '/store-pickup',
     name: 'Store pickup',
     component: StorePickup,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_SELECT_PRODUCT_VIEW"
-    }
-  },  
+    beforeEnter: authGuard
+  },
   {
     path: '/shipping',
     name: 'Shipping',
     component: Shipping,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_SELECT_PRODUCT_VIEW"
-    }
-  },  
+    beforeEnter: authGuard
+  },
   {
     path: '/inventory-channels',
     name: 'Inventory channels',
     component: InventoryChannels,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_SELECT_PRODUCT_VIEW"
-    }
+    beforeEnter: authGuard
   },  
   {
     path: '/select-product-csv-upload',
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 1fafa20c..01623ee4 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -26,10 +26,12 @@
                 <ion-card-subtitle class="overline">{{ "Group ID" }}</ion-card-subtitle>
                 <ion-card-title>{{ "Group name" }}</ion-card-title>
               </div>
+
               <ion-button fill="clear" color="medium">
                 <ion-icon :icon="copyOutline" slot="icon-only" />
               </ion-button>
             </ion-card-header>
+
             <ion-list>
               <ion-item lines="full">
                 <ion-icon slot="start" :icon="globeOutline"/>
@@ -39,6 +41,7 @@
                 </ion-label>
                 <ion-chip slot="end" outline>4</ion-chip>
               </ion-item>
+
               <ion-item lines="full">
                 <ion-icon slot="start" :icon="storefrontOutline"/>
                 <ion-label>
@@ -46,6 +49,7 @@
                 </ion-label>
                 <ion-chip slot="end" outline>15</ion-chip>
               </ion-item>
+
               <ion-item lines="full">
                 <ion-icon slot="start" :icon="businessOutline"/>
                 <ion-label>
diff --git a/src/views/SelectProduct.vue b/src/views/SelectProduct.vue
index 10cf9375..9089a218 100644
--- a/src/views/SelectProduct.vue
+++ b/src/views/SelectProduct.vue
@@ -150,7 +150,7 @@
         </ion-button>
       </div>
 
-      <ion-fab vertical="bottom" horizontal="end" slot="fixed" >
+      <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="mobile-only">
         <ion-fab-button v-if="jobId" :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE) || isServiceScheduling || isJobEditable()" @click="updateThreshold()">
           <ion-icon :icon="arrowForwardOutline" />
         </ion-fab-button>

From 18dc570740d4b90d688c0966f87499af409d4477 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 7 Mar 2024 12:01:17 +0530
Subject: [PATCH 008/250] Implemented: UI for create safety stock rule page
 (#238)

---
 src/components/Menu.vue   |   3 +-
 src/locales/en.json       |   7 ++
 src/router/index.ts       |   9 +-
 src/views/CreateRule.vue  | 241 ++++++++++++++++++++++++++++++++++++++
 src/views/SafetyStock.vue |  16 ++-
 5 files changed, 269 insertions(+), 7 deletions(-)
 create mode 100644 src/views/CreateRule.vue

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 89ac41a8..32a670a5 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -138,6 +138,7 @@
         {
           title: "Safety stock",
           url: "/safety-stock",
+          childRoutes: ["/create-rule"],
           iosIcon: pulseOutline,
           mdIcon: pulseOutline
         },
@@ -169,7 +170,7 @@
 
       const selectedIndex = computed(() => {
         const path = router.currentRoute.value.path;
-        return appPages.findIndex((screen) => screen.url === path);
+        return appPages.findIndex((screen) => screen.url === path || screen.childRoutes?.includes(path) || screen.childRoutes?.some((route: any)=> path.includes(route)));
       });
 
       return {
diff --git a/src/locales/en.json b/src/locales/en.json
index 9b730419..d5315bd7 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -1,6 +1,7 @@
 {
   "A store repesents a company or a unique catalog of products. If your OMS is connected to multiple eCommerce stores sellling different collections of products, you may have multiple Product Stores set up in HotWax Commerce.": "A store repesents a company or a unique catalog of products. If your OMS is connected to multiple eCommerce stores sellling different collections of products, you may have multiple Product Stores set up in HotWax Commerce.",
   "add": "add",
+  "Add": "Add",
   "App": "App",
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
   "Authenticating": "Authenticating",
@@ -39,9 +40,11 @@
   "Every 6 hours": "Every 6 hours",
   "Every day": "Every day",
   "excluded": "excluded",
+  "Excluded": "Excluded",
   "Exclude tags": "Exclude tags",
   "Export product thresholds": "Export product thresholds",
   "Export product threshold jobs": "Export product threshold jobs",
+  "Facilities": "Facilities",
   "Facility": "Facility",
   "Failed": "Failed",
   "Failed to update some jobs": "Failed to update some jobs",
@@ -54,6 +57,7 @@
   "Facility groups": "Facility groups",
   "Filter stores": "Filter stores",
   "Import product thresholds": "Import product thresholds",
+  "Included": "Included",
   "Inventory channels": "Inventory channels",
   "global threshold": "global threshold",
   "included": "included",
@@ -71,6 +75,7 @@
   "Make sure you have saved your changes. All unsaved changes to this rule will be lost.": "Make sure you have saved your changes. All unsaved changes to this rule will be lost.",
   "Menu": "Menu",
   "Name": "Name",
+  "New safety stock rule": "New safety stock rule",
   "No job found.": "No job found.",
   "No jobs have run yet": "No jobs have run yet",
   "No jobs to update": "No jobs to update",
@@ -91,6 +96,8 @@
   "Product SKU column": "Product SKU column",
   "Product Store": "Product Store",
   "Product tags": "Product tags",
+  "Products by tags": "Products by tags",
+  "Products by feature": "Products by feature",
   "Products not found": "Products not found",
   "products selected": "products selected",
   "Provide a future date and time": "Provide a future date and time",
diff --git a/src/router/index.ts b/src/router/index.ts
index 39a9c3b9..abd63c46 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -13,6 +13,7 @@ import SafetyStock from '@/views/SafetyStock.vue'
 import StorePickup from '@/views/StorePickup.vue'
 import Shipping from '@/views/Shipping.vue'
 import InventoryChannels from '@/views/InventoryChannels.vue'
+import CreateRule from '@/views/CreateRule.vue'
 
 import { hasPermission } from '@/authorization';
 import { showToast } from '@/utils'
@@ -92,7 +93,13 @@ const routes: Array<RouteRecordRaw> = [
     name: 'Inventory channels',
     component: InventoryChannels,
     beforeEnter: authGuard
-  },  
+  },
+  {
+    path: '/create-rule',
+    name: 'Create rule',
+    component: CreateRule,
+    beforeEnter: authGuard
+  },
   {
     path: '/select-product-csv-upload',
     name: 'SelectProductCSVUpload',
diff --git a/src/views/CreateRule.vue b/src/views/CreateRule.vue
new file mode 100644
index 00000000..70ced602
--- /dev/null
+++ b/src/views/CreateRule.vue
@@ -0,0 +1,241 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-back-button slot="start" default-href="/safety-stock" />
+        <ion-title>{{ translate("New safety stock rule") }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
+    
+    <ion-content>
+      <section>
+        <div class="rule-config">
+          <ion-card>
+            <ion-card-header>
+              <ion-card-title>{{ "Rule Configuration" }}</ion-card-title>
+            </ion-card-header>
+
+            <ion-card-content class="rule-inputs">
+              <ion-item>
+                <ion-input label="Name" label-placement="floating" />
+              </ion-item>
+              <ion-item>
+                <ion-input label="Safety stock" label-placement="floating" />
+              </ion-item>
+            </ion-card-content>
+          </ion-card>
+        </div>
+      </section>
+      <div class="section-header">
+        <h1>{{ translate("Facilities") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Facility group name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Facility group name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+
+      <div class="section-header">
+        <h1>{{ translate("Products by tags") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Tag name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Tag name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+
+      <div class="section-header">
+        <h1>{{ translate("Products by feature") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Feature name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Feature name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+    </ion-content>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="saveOutline" />
+      </ion-fab-button>
+    </ion-fab>
+  </ion-page>
+</template>
+
+<script lang="ts">
+import {
+  IonBackButton,
+  IonButton,
+  IonCard,
+  IonCardContent,
+  IonCardHeader,
+  IonCardTitle,
+  IonChip,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonInput,
+  IonItem,
+  IonLabel,
+  IonPage,
+  IonTitle,
+  IonToolbar
+} from '@ionic/vue';
+import { defineComponent } from 'vue';
+import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
+import { mapGetters, useStore } from 'vuex';
+import { useRouter } from 'vue-router';
+import TimeZoneModal from '@/views/TimezoneModal.vue';
+import Image from '@/components/Image.vue'
+import { DateTime } from 'luxon';
+import { translate } from "@hotwax/dxp-components";
+
+export default defineComponent({
+  name: 'Settings',
+  components: {
+    IonBackButton,
+    IonButton,
+    IonCard,
+    IonCardContent,
+    IonCardHeader,
+    IonCardTitle,
+    IonChip,
+    IonContent,
+    IonFab,
+    IonFabButton,
+    IonHeader,
+    IonIcon,
+    IonInput,
+    IonItem,
+    IonLabel,
+    IonPage,
+    IonTitle,
+    IonToolbar
+  },
+  setup(){
+    const store = useStore();
+    const router = useRouter();
+
+    return {
+      addCircleOutline,
+      closeCircle,
+      store,
+      router,
+      saveOutline,
+      translate,
+    }
+  }
+});
+</script>
+
+<style scoped>
+section {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+  align-items: start;
+}
+
+.section-header {
+  padding: var(--spacer-xs) 10px 0px;
+}
+
+.rule-config {
+  grid-column: span 2;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(700px, 1fr));
+}
+
+.rule-inputs {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+}
+</style>
\ No newline at end of file
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 01f78c09..2a27f344 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -16,7 +16,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="createRule()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -30,16 +30,14 @@ import {
   IonFabButton,
   IonHeader,
   IonIcon,
-  IonLabel,
   IonPage,
-  IonSegment,
-  IonSegmentButton,
   IonTitle,
   IonToolbar
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
+import { useRouter } from 'vue-router';
 
 export default defineComponent({
   name: 'SafetyStock',
@@ -54,9 +52,17 @@ export default defineComponent({
     IonToolbar,
     RuleItem
   },
+  methods: {
+    createRule() {
+      this.router.replace({ path: '/create-rule' })
+    }
+  },
   setup() {
+    const router = useRouter()
+
     return {
-      addOutline
+      addOutline,
+      router
     };
   },
 });

From 9acfdb582de348d9611ca232eb7c37777519547c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 7 Mar 2024 14:52:46 +0530
Subject: [PATCH 009/250] Improved: added facilityItem component for facility
 segment, added logic to toggle items based on segment (#238)

---
 src/components/FacilityItem.vue | 142 ++++++++++++++++++++++++++++++++
 src/components/RuleItem.vue     |  30 +++----
 src/views/Shipping.vue          |  21 ++++-
 src/views/StorePickup.vue       |  21 ++++-
 4 files changed, 194 insertions(+), 20 deletions(-)
 create mode 100644 src/components/FacilityItem.vue

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
new file mode 100644
index 00000000..b988036f
--- /dev/null
+++ b/src/components/FacilityItem.vue
@@ -0,0 +1,142 @@
+<template>
+  <ion-card>
+    <ion-card-header>
+      <div>
+        <ion-card-subtitle class="overline">{{ "Facility ID" }}</ion-card-subtitle>
+        <ion-card-title>{{ "Facility Name" }}</ion-card-title>
+      </div>
+    </ion-card-header>
+
+    <ion-item lines="full" v-if="selectedPage.path === '/store-pickup'">
+      <ion-icon slot="start" :icon="storefrontOutline"/>
+      <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
+    </ion-item>
+    <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
+      <ion-icon slot="start" :icon="sendOutline"/>
+      <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
+    </ion-item>
+
+    <ion-list>
+      <ion-item-divider color="light">
+        <ion-label>{{ translate("Facility groups") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium">
+          <ion-icon :icon="optionsOutline" slot="icon-only" />
+        </ion-button>
+      </ion-item-divider>
+
+      <ion-item lines="none">
+        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Config facility ID>, <configFacilityID>" }}</ion-label>
+      </ion-item>
+
+      <ion-item-divider color="light">
+        <ion-label>{{ translate("Product tags") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium">
+          <ion-icon :icon="optionsOutline" slot="icon-only" />
+        </ion-button>
+      </ion-item-divider>
+
+      <ion-item>
+        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
+      </ion-item>
+      <ion-item lines="none">
+        <ion-icon slot="start" :icon="closeCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
+      </ion-item>
+
+      <ion-item-divider color="light">
+        <ion-label>{{ translate("Product features") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium">
+          <ion-icon :icon="optionsOutline" slot="icon-only" />
+        </ion-button>
+      </ion-item-divider>
+
+        <ion-item lines="none">
+          <ion-button fill="clear">{{ translate("Run now") }}</ion-button>
+          <ion-button color="medium" fill="clear" slot="end">
+            <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
+          </ion-button>
+      </ion-item>
+    </ion-list>
+  </ion-card>
+</template>
+
+<script lang="ts">
+import {
+  IonButton,
+  IonCard,
+  IonCardHeader,
+  IonCardSubtitle,
+  IonCardTitle,
+  IonIcon,
+  IonItem,
+  IonItemDivider,
+  IonLabel,
+  IonList,
+  IonToggle
+} from '@ionic/vue';
+import { defineComponent } from 'vue';
+import { checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
+import { useRouter } from 'vue-router';
+import { translate } from '@hotwax/dxp-components';
+
+export default defineComponent({
+  name: 'FacilityItem',
+  components: {
+    IonButton,
+    IonCard,
+    IonCardHeader,
+    IonCardSubtitle,
+    IonCardTitle,
+    IonIcon,
+    IonItem,
+    IonItemDivider,
+    IonLabel,
+    IonList,
+    IonToggle
+  },
+  data() {
+    return {
+      selectedPage: {
+        path: '',
+        name: ''
+      } as any
+    }
+  },
+  mounted() {
+    this.selectedPage.path = this.router.currentRoute.value.path
+    this.selectedPage.name = this.router.currentRoute.value.name
+  },
+  setup() {
+    const router = useRouter();
+
+    return {
+      checkmarkDoneCircleOutline,
+      chevronDownOutline,
+      chevronUpOutline,
+      closeCircleOutline,
+      ellipsisVerticalOutline,
+      globeOutline,
+      optionsOutline,
+      pulseOutline,
+      router,
+      sendOutline,
+      storefrontOutline,
+      translate
+    };
+  },
+});
+</script>
+
+<style scoped>
+ion-card {
+  min-width: 375px;
+}
+ion-card-header {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index c8f8917a..27b36cad 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -68,21 +68,23 @@
         <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
       </ion-item>
 
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Product features") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
-      </ion-item-divider>
-
-      <ion-item>
-        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Product Features, Product Features>" }}</ion-label>
-      </ion-item>
-      <ion-item lines="full">
-        <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Product Features, Product Features>" }}</ion-label>
+      <template v-if="selectedPage.path === '/threshold' || selectedPage.path === '/safety-stock'">
+        <ion-item-divider color="light">
+          <ion-label>{{ translate("Product features") }}</ion-label>
+          <ion-button slot="end" fill="clear" color="medium">
+            <ion-icon :icon="optionsOutline" slot="icon-only" />
+          </ion-button>
+        </ion-item-divider>
+  
+        <ion-item>
+          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ "<Product Features, Product Features>" }}</ion-label>
+        </ion-item>
+        <ion-item lines="full">
+          <ion-icon slot="start" :icon="closeCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ "<Product Features, Product Features>" }}</ion-label>
         </ion-item>
+      </template>
 
         <ion-item lines="none">
           <ion-button fill="clear">{{ translate("Run now") }}</ion-button>
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index ec6f9505..c566d812 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -6,14 +6,14 @@
       </ion-toolbar>
 
       <ion-toolbar>
-        <ion-segment>
+        <ion-segment v-model="selectedSegment">
           <ion-segment-button value="productAndFacility">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="productAndChannel">
             <ion-label>{{ translate("Product and channel") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="productAndChannel">
+          <ion-segment-button value="facility">
             <ion-label>{{ translate("Facility") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
@@ -22,10 +22,18 @@
 
     <ion-content>
       <main>
-        <section>
+        <section v-if="selectedSegment === 'productAndFacility'">
+          <RuleItem />
+          <RuleItem />
+        </section>
+        <section v-else-if="selectedSegment === 'productAndChannel'">
           <RuleItem />
           <RuleItem />
         </section>
+        <section v-else>
+          <FacilityItem />
+          <FacilityItem />
+        </section>
       </main>
     </ion-content>
 
@@ -55,10 +63,12 @@ import { defineComponent } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@hotwax/dxp-components';
+import FacilityItem from '@/components/FacilityItem.vue';
 
 export default defineComponent({
   name: 'Shipping',
   components: {
+    FacilityItem,
     IonContent,
     IonFab,
     IonFabButton,
@@ -72,6 +82,11 @@ export default defineComponent({
     IonToolbar,
     RuleItem
   },
+  data() {
+    return {
+      selectedSegment: 'productAndFacility'
+    }
+  },
   setup() {
     return {
       addOutline,
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 345d15d4..8cf949cb 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -6,14 +6,14 @@
       </ion-toolbar>
 
       <ion-toolbar>
-        <ion-segment value="productAndFacility">
+        <ion-segment v-model="selectedSegment">
           <ion-segment-button value="productAndFacility">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="productAndChannel">
             <ion-label>{{ translate("Product and channel") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="productAndChannel">
+          <ion-segment-button value="facility">
             <ion-label>{{ translate("Facility") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
@@ -22,10 +22,18 @@
 
     <ion-content>
       <main>
-        <section>
+        <section v-if="selectedSegment === 'productAndFacility'">
+          <RuleItem />
+          <RuleItem />
+        </section>
+        <section v-else-if="selectedSegment === 'productAndChannel'">
           <RuleItem />
           <RuleItem />
         </section>
+        <section v-else>
+          <FacilityItem />
+          <FacilityItem />
+        </section>
       </main>
 
       <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -54,11 +62,13 @@ import {
 import { defineComponent } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
+import FacilityItem from '@/components/FacilityItem.vue'
 import { translate } from '@hotwax/dxp-components';
 
 export default defineComponent({
   name: 'StorePickup',
   components: {
+    FacilityItem,
     IonContent,
     IonFab,
     IonFabButton,
@@ -72,6 +82,11 @@ export default defineComponent({
     IonToolbar,
     RuleItem
   },
+  data() {
+    return {
+      selectedSegment: 'productAndFacility'
+    }
+  },
   setup() {
     return {
       addOutline,

From 7a203507663a6b7586c83afff77ff9c6c699e463 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 7 Mar 2024 15:54:10 +0530
Subject: [PATCH 010/250] Improved: css for the main for ion-card width (#238)

---
 src/components/FacilityItem.vue | 20 +++-----------------
 src/components/RuleItem.vue     |  3 ---
 src/theme/variables.css         | 16 +++++++---------
 src/views/CreateRule.vue        | 16 ++--------------
 src/views/InventoryChannels.vue |  3 ---
 5 files changed, 12 insertions(+), 46 deletions(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index b988036f..707d8253 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -1,10 +1,8 @@
 <template>
   <ion-card>
     <ion-card-header>
-      <div>
-        <ion-card-subtitle class="overline">{{ "Facility ID" }}</ion-card-subtitle>
-        <ion-card-title>{{ "Facility Name" }}</ion-card-title>
-      </div>
+      <ion-card-subtitle class="overline">{{ "Facility ID" }}</ion-card-subtitle>
+      <ion-card-title>{{ "Facility Name" }}</ion-card-title>
     </ion-card-header>
 
     <ion-item lines="full" v-if="selectedPage.path === '/store-pickup'">
@@ -127,16 +125,4 @@ export default defineComponent({
     };
   },
 });
-</script>
-
-<style scoped>
-ion-card {
-  min-width: 375px;
-}
-ion-card-header {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-  align-items: center;
-}
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 27b36cad..ebaf61eb 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -220,9 +220,6 @@ export default defineComponent({
 </script>
 
 <style scoped>
-ion-card {
-  min-width: 375px;
-}
 ion-card-header {
   display: flex;
   flex-direction: row;
diff --git a/src/theme/variables.css b/src/theme/variables.css
index 79c04f29..5f344f4f 100644
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@@ -312,6 +312,13 @@ hr {
   border-bottom: var(--border-medium);
 }
 
+@media (min-width: 700px) {
+  main {
+    max-width: 375px;
+    margin: auto;
+  }
+}
+
 @media (min-width: 991px) {
   .find {
     grid: "search  main" min-content
@@ -365,15 +372,6 @@ hr {
     display: flex;
   }
 
-  main {
-    display: flex;
-    justify-content: center;
-    align-items: start;
-    gap: var(--spacer-2xl);
-    max-width: 990px;
-    margin: var(--spacer-base) auto 0;
-  }
-
   main>section {
     max-width: 50ch;
   }
diff --git a/src/views/CreateRule.vue b/src/views/CreateRule.vue
index 70ced602..7d6214ad 100644
--- a/src/views/CreateRule.vue
+++ b/src/views/CreateRule.vue
@@ -15,14 +15,14 @@
               <ion-card-title>{{ "Rule Configuration" }}</ion-card-title>
             </ion-card-header>
 
-            <ion-card-content class="rule-inputs">
+            <div class="rule-inputs ion-padding">
               <ion-item>
                 <ion-input label="Name" label-placement="floating" />
               </ion-item>
               <ion-item>
                 <ion-input label="Safety stock" label-placement="floating" />
               </ion-item>
-            </ion-card-content>
+            </div>
           </ion-card>
         </div>
       </section>
@@ -172,11 +172,6 @@ import {
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
-import { mapGetters, useStore } from 'vuex';
-import { useRouter } from 'vue-router';
-import TimeZoneModal from '@/views/TimezoneModal.vue';
-import Image from '@/components/Image.vue'
-import { DateTime } from 'luxon';
 import { translate } from "@hotwax/dxp-components";
 
 export default defineComponent({
@@ -202,14 +197,9 @@ export default defineComponent({
     IonToolbar
   },
   setup(){
-    const store = useStore();
-    const router = useRouter();
-
     return {
       addCircleOutline,
       closeCircle,
-      store,
-      router,
       saveOutline,
       translate,
     }
@@ -230,8 +220,6 @@ section {
 
 .rule-config {
   grid-column: span 2;
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(700px, 1fr));
 }
 
 .rule-inputs {
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 01623ee4..92419452 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -142,9 +142,6 @@ export default defineComponent({
 </script>
 
 <style scoped>
-ion-card {
-  min-width: 375px;
-}
 ion-card-header {
   display: flex;
   flex-direction: row;

From fba78094948c52648341bce6fb57987fe4d10516 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 8 Mar 2024 14:46:18 +0530
Subject: [PATCH 011/250] Improved: code for the facilityItem for the shipping
 and store-pickup page (#238)

---
 src/components/FacilityItem.vue | 90 +++++++++------------------------
 src/locales/en.json             |  3 ++
 src/views/InventoryChannels.vue | 58 +++++++++++++++++++--
 3 files changed, 83 insertions(+), 68 deletions(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 707d8253..89ab6a38 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -1,97 +1,66 @@
 <template>
-  <ion-card>
+  <ion-card v-if="selectedPage.path === '/store-pickup'">
     <ion-card-header>
       <ion-card-subtitle class="overline">{{ "Facility ID" }}</ion-card-subtitle>
       <ion-card-title>{{ "Facility Name" }}</ion-card-title>
     </ion-card-header>
 
-    <ion-item lines="full" v-if="selectedPage.path === '/store-pickup'">
-      <ion-icon slot="start" :icon="storefrontOutline"/>
-      <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
+    <ion-item lines="none">
+      <ion-text slot="start">10</ion-text>
+      <ion-progress-bar />
+      <ion-chip slot="end" outline>20</ion-chip>
     </ion-item>
-    <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
-      <ion-icon slot="start" :icon="sendOutline"/>
-      <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
-    </ion-item>
-
-    <ion-list>
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Facility groups") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
-      </ion-item-divider>
-
-      <ion-item lines="none">
-        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Config facility ID>, <configFacilityID>" }}</ion-label>
-      </ion-item>
 
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Product tags") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
-      </ion-item-divider>
-
-      <ion-item>
-        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
-      </ion-item>
-      <ion-item lines="none">
-        <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
-      </ion-item>
+    <ion-item detail button lines="none">
+      <ion-label>{{ translate("View order count history") }}</ion-label>
+    </ion-item>
+  </ion-card>
 
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Product features") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
-      </ion-item-divider>
+  <ion-card v-else>
+    <ion-card-header>
+      <ion-card-subtitle class="overline">{{ "Facility ID" }}</ion-card-subtitle>
+      <ion-card-title>{{ "Facility Name" }}</ion-card-title>
+    </ion-card-header>
 
-        <ion-item lines="none">
-          <ion-button fill="clear">{{ translate("Run now") }}</ion-button>
-          <ion-button color="medium" fill="clear" slot="end">
-            <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
-          </ion-button>
-      </ion-item>
-    </ion-list>
+    <ion-item lines="none">
+      <ion-icon :icon="storefrontOutline" slot="start" />
+      <ion-toggle>{{ translate("Store pickup") }}</ion-toggle>
+    </ion-item>
   </ion-card>
 </template>
 
 <script lang="ts">
 import {
-  IonButton,
   IonCard,
   IonCardHeader,
   IonCardSubtitle,
   IonCardTitle,
+  IonChip,
   IonIcon,
   IonItem,
-  IonItemDivider,
   IonLabel,
-  IonList,
+  IonProgressBar,
+  IonText,
   IonToggle
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
+import { storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@hotwax/dxp-components';
 
 export default defineComponent({
   name: 'FacilityItem',
   components: {
-    IonButton,
     IonCard,
     IonCardHeader,
     IonCardSubtitle,
     IonCardTitle,
+    IonChip,
     IonIcon,
     IonItem,
-    IonItemDivider,
     IonLabel,
-    IonList,
+    IonProgressBar,
+    IonText,
     IonToggle
   },
   data() {
@@ -110,16 +79,7 @@ export default defineComponent({
     const router = useRouter();
 
     return {
-      checkmarkDoneCircleOutline,
-      chevronDownOutline,
-      chevronUpOutline,
-      closeCircleOutline,
-      ellipsisVerticalOutline,
-      globeOutline,
-      optionsOutline,
-      pulseOutline,
       router,
-      sendOutline,
       storefrontOutline,
       translate
     };
diff --git a/src/locales/en.json b/src/locales/en.json
index d5315bd7..425b4432 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -49,6 +49,7 @@
   "Failed": "Failed",
   "Failed to update some jobs": "Failed to update some jobs",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
+  "Frequency": "Frequency",
   "Go to Launchpad": "Go to Launchpad",
   "Go to OMS": "Go to OMS",
   "History": "History",
@@ -64,6 +65,7 @@
   "Include": "Include",
   "Include tags": "Include tags",
   "Info": "Info",
+  "Inventory group": "Inventory group",
   "Jobs sequence updated successfully": "Jobs sequence updated successfully",
   "Keep editing": "Keep editing",
   "Last run": "Last run",
@@ -185,6 +187,7 @@
   "Upload CSV": "Upload CSV",
   "Username": "Username",
   "View details": "View details",
+  "View order count history": "View order count history",
   "virtual, ": "virtual, ",
   "variants": "variants",
   "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems": "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems",
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 92419452..cac3a62d 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -6,7 +6,7 @@
       </ion-toolbar>
 
       <ion-toolbar>
-        <ion-segment>
+        <ion-segment v-model="selectedSegment">
           <ion-segment-button value="channels">
             <ion-label>{{ translate("Channels") }}</ion-label>
           </ion-segment-button>
@@ -19,7 +19,7 @@
 
     <ion-content>
       <main>
-        <section>
+        <section v-if="selectedSegment === 'channels'">
           <ion-card>
             <ion-card-header>
               <div>
@@ -58,6 +58,46 @@
                 <ion-chip slot="end" outline>1</ion-chip>
               </ion-item>
   
+              <ion-item lines="none">
+                <ion-button fill="clear">{{ translate("View details") }}</ion-button>
+                  <ion-button color="medium" fill="clear" slot="end">
+                  <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
+                </ion-button>
+              </ion-item>
+            </ion-list>
+          </ion-card>
+        </section>
+        <section v-else-if="selectedSegment === 'publish'">
+          <ion-card>
+            <ion-card-header>
+              <div>
+                <ion-card-subtitle class="overline">{{ "SHOP CONFIG ID" }}</ion-card-subtitle>
+                <ion-card-title>{{ "Shop name" }}</ion-card-title>
+              </div>
+            </ion-card-header>
+
+            <ion-list>
+              <ion-item lines="full">
+                <ion-icon slot="start" :icon="timeOutline"/>
+                <ion-select :label="translate('Run time')" :placeholder="translate('Select')" interface="popover">
+                  <ion-select-option value="">A</ion-select-option>
+                </ion-select>
+              </ion-item>
+
+              <ion-item lines="full">
+                <ion-icon slot="start" :icon="timerOutline"/>
+                <ion-select :label="translate('Frequency')" value="" :placeholder="translate('Select')" interface="popover">
+                  <ion-select-option value="">{{ "Every 5 minute" }}</ion-select-option>
+                </ion-select>
+              </ion-item>
+
+              <ion-item lines="full">
+                <ion-icon slot="start" :icon="albumsOutline"/>
+                <ion-select :label="translate('Inventory group')" value="" :placeholder="translate('Select')" interface="popover">
+                  <ion-select-option value="">{{ "Group name" }}</ion-select-option>
+                </ion-select>
+              </ion-item>
+  
               <ion-item lines="none">
                 <ion-button fill="clear">{{ translate("View details") }}</ion-button>
                   <ion-button color="medium" fill="clear" slot="end">
@@ -97,11 +137,13 @@ import {
   IonPage,
   IonSegment,
   IonSegmentButton,
+  IonSelect,
+  IonSelectOption,
   IonTitle,
   IonToolbar
 } from '@ionic/vue';
 import { defineComponent } from 'vue';
-import { addOutline, businessOutline, copyOutline, ellipsisVerticalOutline, globeOutline, storefrontOutline } from 'ionicons/icons';
+import { addOutline, albumsOutline, businessOutline, copyOutline, ellipsisVerticalOutline, globeOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@hotwax/dxp-components';
 
 export default defineComponent({
@@ -124,17 +166,27 @@ export default defineComponent({
     IonPage,
     IonSegment,
     IonSegmentButton,
+    IonSelect,
+    IonSelectOption,
     IonTitle,
     IonToolbar
   },
+  data() {
+    return {
+      selectedSegment: 'channels'
+    }
+  },
   setup() {
     return {
       addOutline,
+      albumsOutline,
       businessOutline,
       copyOutline,
       ellipsisVerticalOutline,
       globeOutline,
       storefrontOutline,
+      timeOutline,
+      timerOutline,
       translate
     };
   },

From 3ba3d15bf2231ffd69b6b78b3a1a2cd01f54dd7f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 18 Mar 2024 12:56:15 +0530
Subject: [PATCH 012/250] Improved: changed all the pages for atp UI to use
 composition api (#238)

---
 src/components/FacilityItem.vue           |  81 ++------
 src/components/Menu.vue                   |  36 ++--
 src/components/RuleActionsPopover.vue     |  39 ----
 src/components/RuleItem.vue               | 237 +++++++++-------------
 src/components/ScheduleActionsPopover.vue |  25 +++
 src/components/ScheduleRuleItem.vue       |  49 +++++
 src/components/ShopActionsPopover.vue     |  29 +++
 src/views/InventoryChannels.vue           | 135 ++++--------
 src/views/SafetyStock.vue                 |  49 +----
 src/views/Shipping.vue                    |  61 +-----
 src/views/StorePickup.vue                 |  61 +-----
 src/views/Threshold.vue                   |  37 +---
 12 files changed, 318 insertions(+), 521 deletions(-)
 delete mode 100644 src/components/RuleActionsPopover.vue
 create mode 100644 src/components/ScheduleActionsPopover.vue
 create mode 100644 src/components/ScheduleRuleItem.vue
 create mode 100644 src/components/ShopActionsPopover.vue

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 89ab6a38..67747c2b 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -6,13 +6,8 @@
     </ion-card-header>
 
     <ion-item lines="none">
-      <ion-text slot="start">10</ion-text>
-      <ion-progress-bar />
-      <ion-chip slot="end" outline>20</ion-chip>
-    </ion-item>
-
-    <ion-item detail button lines="none">
-      <ion-label>{{ translate("View order count history") }}</ion-label>
+      <ion-icon :icon="storefrontOutline" slot="start" />
+      <ion-toggle>{{ translate("Store pickup") }}</ion-toggle>
     </ion-item>
   </ion-card>
 
@@ -23,66 +18,32 @@
     </ion-card-header>
 
     <ion-item lines="none">
-      <ion-icon :icon="storefrontOutline" slot="start" />
-      <ion-toggle>{{ translate("Store pickup") }}</ion-toggle>
+      <ion-text slot="start">10</ion-text>
+      <ion-progress-bar />
+      <ion-chip slot="end" outline>20</ion-chip>
+    </ion-item>
+
+    <ion-item detail button lines="none">
+      <ion-label>{{ translate("View order count history") }}</ion-label>
     </ion-item>
   </ion-card>
 </template>
 
-<script lang="ts">
-import {
-  IonCard,
-  IonCardHeader,
-  IonCardSubtitle,
-  IonCardTitle,
-  IonChip,
-  IonIcon,
-  IonItem,
-  IonLabel,
-  IonProgressBar,
-  IonText,
-  IonToggle
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
+<script setup lang="ts">
+import { IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonLabel, IonProgressBar, IonText, IonToggle } from '@ionic/vue';
+import { onMounted, ref } from 'vue';
 import { storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@hotwax/dxp-components';
 
-export default defineComponent({
-  name: 'FacilityItem',
-  components: {
-    IonCard,
-    IonCardHeader,
-    IonCardSubtitle,
-    IonCardTitle,
-    IonChip,
-    IonIcon,
-    IonItem,
-    IonLabel,
-    IonProgressBar,
-    IonText,
-    IonToggle
-  },
-  data() {
-    return {
-      selectedPage: {
-        path: '',
-        name: ''
-      } as any
-    }
-  },
-  mounted() {
-    this.selectedPage.path = this.router.currentRoute.value.path
-    this.selectedPage.name = this.router.currentRoute.value.name
-  },
-  setup() {
-    const router = useRouter();
+const selectedPage = ref({
+  path: '',
+  name: ''
+}) as any
+const router = useRouter();
 
-    return {
-      router,
-      storefrontOutline,
-      translate
-    };
-  },
-});
+onMounted(() => {
+    selectedPage.value.path = router.currentRoute.value.path
+    selectedPage.value.name = router.currentRoute.value.name
+})
 </script>
\ No newline at end of file
diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 32a670a5..060221b3 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -110,25 +110,25 @@
       const store = useStore();
       const router = useRouter();
       const appPages = [
-        {
-          title: "Create Rule",
-          url: "/select-product",
-          iosIcon: optionsOutline,
-          mdIcon: optionsOutline,
-          meta: {
-            permissionId: "APP_SELECT_PRODUCT_VIEW"
+        // {
+        //   title: "Create Rule",
+        //   url: "/select-product",
+        //   iosIcon: optionsOutline,
+        //   mdIcon: optionsOutline,
+        //   meta: {
+        //     permissionId: "APP_SELECT_PRODUCT_VIEW"
 
-          }
-        },
-        {
-          title: "Rule Pipeline",
-          url: "/threshold-updates",
-          iosIcon: pulseOutline,
-          mdIcon: pulseOutline,
-          meta: {
-            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-          }
-        },
+        //   }
+        // },
+        // {
+        //   title: "Rule Pipeline",
+        //   url: "/threshold-updates",
+        //   iosIcon: pulseOutline,
+        //   mdIcon: pulseOutline,
+        //   meta: {
+        //     permissionId: "APP_THRESHOLD_UPDATES_VIEW"
+        //   }
+        // },
         {
           title: "Threshold",
           url: "/threshold",
diff --git a/src/components/RuleActionsPopover.vue b/src/components/RuleActionsPopover.vue
deleted file mode 100644
index cd7f99b6..00000000
--- a/src/components/RuleActionsPopover.vue
+++ /dev/null
@@ -1,39 +0,0 @@
-<template>
-  <ion-content>
-    <ion-list>
-      <ion-list-header>{{ "rule name" }}</ion-list-header>
-      <ion-item button>
-        {{ translate("Edit rule") }}
-      </ion-item>
-      <ion-item button lines="none">
-        {{ translate("Delete") }}
-      </ion-item> 
-    </ion-list>
-  </ion-content>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "vue";
-import { translate } from "@hotwax/dxp-components";
-import {
-  IonContent,
-  IonItem,
-  IonList,
-  IonListHeader
-} from "@ionic/vue";
-
-export default defineComponent({
-  name: "RuleActionsPopover",
-  components: { 
-    IonContent,
-    IonItem,
-    IonList,
-    IonListHeader,
-  },
-  setup() {
-    return {
-      translate
-    }
-  }
-});
-</script> 
\ No newline at end of file
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index ebaf61eb..dfcb8e72 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -36,21 +36,45 @@
     </ion-item>
 
     <ion-list>
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Facility groups") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
-      </ion-item-divider>
+      <template v-if="selectedSegment === 'productAndChannel'">
+        <ion-item-divider color="light">
+          <ion-label>{{ translate("Channels") }}</ion-label>
+          <ion-button slot="end" fill="clear" color="medium">
+            <ion-icon :icon="optionsOutline" slot="icon-only" />
+          </ion-button>
+        </ion-item-divider>
+        
+        <ion-item lines="none">
+          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ "<Config facility Id>, <Config facility Id>" }}</ion-label>
+        </ion-item>
+      </template>
 
-      <ion-item>
-        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
-      </ion-item>
-      <ion-item lines="none">
-        <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
-      </ion-item>
+      <template v-else>
+        <ion-item-divider color="light">
+          <ion-label>{{ translate("Facility groups") }}</ion-label>
+          <ion-button slot="end" fill="clear" color="medium">
+            <ion-icon :icon="optionsOutline" slot="icon-only" />
+          </ion-button>
+        </ion-item-divider>
+
+        <ion-item v-if="selectedPage.path === '/threshold'" lines="none">
+          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ "<Config facility Name, Config facility Name>" }}</ion-label>
+        </ion-item>
+  
+        <template v-else>
+          <ion-item>
+            <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+            <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+          </ion-item>
+    
+          <ion-item lines="none">
+            <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+            <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
+          </ion-item>
+        </template>
+      </template>
 
       <ion-item-divider color="light">
         <ion-label>{{ translate("Product tags") }}</ion-label>
@@ -86,137 +110,78 @@
         </ion-item>
       </template>
 
-        <ion-item lines="none">
-          <ion-button fill="clear">{{ translate("Run now") }}</ion-button>
-          <ion-button color="medium" fill="clear" slot="end" @click="openRuleActionsPopover($event)">
-            <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
-          </ion-button>
+      <ion-item lines="none">
+        <ion-button fill="clear">{{ translate("Edit name") }}</ion-button>
+        <ion-button color="medium" fill="clear" slot="end">
+          <ion-icon :icon="archiveOutline" slot="icon-only"/>
+        </ion-button>
       </ion-item>
     </ion-list>
   </ion-card>
 </template>
 
-<script lang="ts">
-import {
-  IonButton,
-  IonCard,
-  IonCardHeader,
-  IonCardSubtitle,
-  IonCardTitle,
-  IonChip,
-  IonIcon,
-  IonItem,
-  IonItemDivider,
-  IonLabel,
-  IonList,
-  IonToggle,
-  alertController,
-  popoverController
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
+<script setup lang="ts">
+import { IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController, popoverController } from '@ionic/vue';
+import { defineProps, onMounted, ref } from 'vue';
+import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@hotwax/dxp-components';
-import RuleActionsPopover from "@/components/RuleActionsPopover.vue";
-
-export default defineComponent({
-  name: 'RuleItem',
-  components: {
-    IonButton,
-    IonCard,
-    IonCardHeader,
-    IonCardSubtitle,
-    IonCardTitle,
-    IonChip,
-    IonIcon,
-    IonItem,
-    IonItemDivider,
-    IonLabel,
-    IonList,
-    IonToggle
-  },
-  data() {
-    return {
-      selectedPage: {
-        path: '',
-        name: ''
-      } as any
-    }
-  },
-  mounted() {
-    this.selectedPage.path = this.router.currentRoute.value.path
-    this.selectedPage.name = this.router.currentRoute.value.name
-  },
-  methods: {
-    async openRuleActionsPopover(event: Event) {
-      const popover = await popoverController.create({
-        component: RuleActionsPopover,
-        showBackdrop: false,
-        event
-      });
-
-      return popover.present();
+
+const router = useRouter();
+
+defineProps(["selectedSegment"])
+
+const selectedPage = ref({
+  path: '',
+  name: ''
+}) as any;
+
+onMounted(() => {
+  selectedPage.value.path = router.currentRoute.value.path
+  selectedPage.value.name = router.currentRoute.value.name
+})
+
+async function editThreshold() {
+  const alert = await alertController.create({
+    header: translate("Edit threshold"),
+    inputs: [{
+      name: "threshold",
+      placeholder: translate("Threshold"),
+      type: "number",
+      min: 0
+    }],
+    buttons: [{
+      text: translate('Cancel'),
+      role: "cancel"
     },
-    async editThreshold() {
-      const alert = await alertController.create({
-        header: translate("Edit threshold"),
-        inputs: [{
-          name: "threshold",
-          placeholder: translate("Threshold"),
-          type: "number",
-          min: 0
-        }],
-        buttons: [{
-          text: translate('Cancel'),
-          role: "cancel"
-        },
-        {
-          text: translate('Update'),
-        }]
-      })
-
-      await alert.present()
+    {
+      text: translate('Update'),
+    }]
+  })
+
+  await alert.present()
+}
+
+async function editSafetyStock() {
+  const alert = await alertController.create({
+    header: translate("Edit safety stock"),
+    inputs: [{
+      name: "safety-stock",
+      placeholder: translate("Safety stock"),
+      type: "number",
+      min: 0
+    }],
+    buttons: [{
+      text: translate('Cancel'),
+      role: "cancel"
     },
-    async editSafetyStock() {
-      const alert = await alertController.create({
-        header: translate("Edit safety stock"),
-        inputs: [{
-          name: "safety-stock",
-          placeholder: translate("Safety stock"),
-          type: "number",
-          min: 0
-        }],
-        buttons: [{
-          text: translate('Cancel'),
-          role: "cancel"
-        },
-        {
-          text: translate('Update'),
-        }]
-      })
-
-      await alert.present()
-    }
-  },
-  setup() {
-    const router = useRouter();
-
-    return {
-      checkmarkDoneCircleOutline,
-      chevronDownOutline,
-      chevronUpOutline,
-      closeCircleOutline,
-      ellipsisVerticalOutline,
-      globeOutline,
-      optionsOutline,
-      pulseOutline,
-      router,
-      sendOutline,
-      storefrontOutline,
-      translate
-    };
-  },
-});
+    {
+      text: translate('Update'),
+    }]
+  })
+
+  await alert.present()
+}
 </script>
 
 <style scoped>
diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
new file mode 100644
index 00000000..8785cefb
--- /dev/null
+++ b/src/components/ScheduleActionsPopover.vue
@@ -0,0 +1,25 @@
+<template>
+  <ion-content>
+    <ion-list>
+      <ion-list-header>{{ translate("More options") }}</ion-list-header>
+      <ion-item button>
+        <ion-icon slot="start" :icon="timeOutline" />
+        <ion-label>{{ translate("History") }}</ion-label>
+      </ion-item> 
+      <ion-item button>
+        <ion-icon slot="start" :icon="flashOutline" />
+        <ion-label>{{ translate("Run now") }}</ion-label>
+      </ion-item> 
+      <ion-item button lines="none">
+        <ion-icon slot="start" :icon="stopCircleOutline" color="danger" />
+        <ion-label color="danger">{{ translate("Disable") }}</ion-label>
+      </ion-item> 
+    </ion-list>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { IonContent, IonIcon, IonItem, IonLabel, IonList, IonListHeader } from "@ionic/vue";
+import { translate } from "@hotwax/dxp-components";
+import { flashOutline, stopCircleOutline, timeOutline } from 'ionicons/icons'
+</script> 
\ No newline at end of file
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
new file mode 100644
index 00000000..7eadfe46
--- /dev/null
+++ b/src/components/ScheduleRuleItem.vue
@@ -0,0 +1,49 @@
+
+<template>
+  <ion-card>
+    <ion-card-header>
+      <ion-card-title>{{ translate("Schedule") }}</ion-card-title>
+      <ion-badge color="warning">{{ translate("Paused") }}</ion-badge>
+    </ion-card-header>
+  
+    <ion-item>
+      <ion-icon slot="start" :icon="timeOutline" />
+      <ion-select :label="translate('Run time')" value="" interface="popover">
+        <ion-select-option value="">{{ "Select" }}</ion-select-option>
+      </ion-select>
+    </ion-item>
+  
+    <ion-item lines="none">
+      <ion-button fill="clear">{{ translate("Save changes") }}</ion-button>
+      <ion-button color="medium" fill="clear" slot="end" @click="OpenScheduleActionsPopover($event)">
+        <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
+      </ion-button>
+    </ion-item>
+  </ion-card>
+</template>
+
+<script setup lang="ts">
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardTitle, IonIcon, IonItem, IonSelect, IonSelectOption, popoverController } from '@ionic/vue';
+import { translate } from '@hotwax/dxp-components';
+import { ellipsisVerticalOutline, timeOutline } from 'ionicons/icons';
+import ScheduleActionsPopover from "@/components/ScheduleActionsPopover.vue";
+
+async function OpenScheduleActionsPopover(event: Event) {
+  const popover = await popoverController.create({
+    component: ScheduleActionsPopover,
+    showBackdrop: false,
+    event
+  });
+
+  return popover.present();
+}
+</script>
+
+<style scoped>
+ion-card-header {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/ShopActionsPopover.vue b/src/components/ShopActionsPopover.vue
new file mode 100644
index 00000000..aed9913b
--- /dev/null
+++ b/src/components/ShopActionsPopover.vue
@@ -0,0 +1,29 @@
+<template>
+  <ion-content>
+    <ion-list>
+      <ion-list-header>{{ translate("More options") }}</ion-list-header>
+      <ion-item button>
+        <ion-icon slot="start" :icon="timeOutline" />
+        <ion-label>{{ translate("History") }}</ion-label>
+      </ion-item> 
+      <ion-item button>
+        <ion-icon slot="start" :icon="copyOutline" />
+        <ion-label>{{ translate("Copy details") }}</ion-label>
+      </ion-item> 
+      <ion-item button>
+        <ion-icon slot="start" :icon="flashOutline" />
+        <ion-label>{{ translate("Run now") }}</ion-label>
+      </ion-item> 
+      <ion-item button lines="none">
+        <ion-icon slot="start" :icon="stopCircleOutline" color="danger" />
+        <ion-label color="danger">{{ translate("Disable") }}</ion-label>
+      </ion-item> 
+    </ion-list>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { IonContent, IonIcon, IonItem, IonLabel, IonList, IonListHeader } from "@ionic/vue";
+import { translate } from "@hotwax/dxp-components";
+import { copyOutline, flashOutline, stopCircleOutline, timeOutline } from 'ionicons/icons'
+</script> 
\ No newline at end of file
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index cac3a62d..18e0eefc 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -25,48 +25,47 @@
               <div>
                 <ion-card-subtitle class="overline">{{ "Group ID" }}</ion-card-subtitle>
                 <ion-card-title>{{ "Group name" }}</ion-card-title>
+                <ion-card-subtitle>{{ "Group desc" }}</ion-card-subtitle>
               </div>
-
-              <ion-button fill="clear" color="medium">
-                <ion-icon :icon="copyOutline" slot="icon-only" />
-              </ion-button>
             </ion-card-header>
 
+            <ion-item lines="full">
+              <ion-icon slot="start" :icon="globeOutline"/>
+              <ion-label>
+                {{ "<threshold facility name>" }}
+                <p>{{ "<facilityId>" }}</p>
+              </ion-label>
+              <ion-chip slot="end" outline>4</ion-chip>
+            </ion-item>
+
             <ion-list>
-              <ion-item lines="full">
-                <ion-icon slot="start" :icon="globeOutline"/>
-                <ion-label>
-                  {{ "<threshold facility name>" }}
-                  <p>{{ "<facilityId>" }}</p>
-                </ion-label>
-                <ion-chip slot="end" outline>4</ion-chip>
-              </ion-item>
+              <ion-item-divider color="light">
+                <ion-label>{{ translate("Facilities") }}</ion-label>
+                <ion-button slot="end" fill="clear" color="medium">
+                  <ion-icon :icon="optionsOutline" slot="icon-only" />
+                </ion-button>
+              </ion-item-divider>
 
-              <ion-item lines="full">
+              <ion-item>
                 <ion-icon slot="start" :icon="storefrontOutline"/>
-                <ion-label>
-                  {{ "<retail type facilityid count>" }}
-                </ion-label>
-                <ion-chip slot="end" outline>15</ion-chip>
+                <ion-label>{{ "15 retail facilities" }}</ion-label>
               </ion-item>
 
               <ion-item lines="full">
                 <ion-icon slot="start" :icon="businessOutline"/>
-                <ion-label>
-                  {{ "<warehouse type facilityId count>" }}
-                </ion-label>
-                <ion-chip slot="end" outline>1</ion-chip>
+                <ion-label>{{ "1 warehouse" }}</ion-label>
               </ion-item>
   
               <ion-item lines="none">
                 <ion-button fill="clear">{{ translate("View details") }}</ion-button>
-                  <ion-button color="medium" fill="clear" slot="end">
+                <ion-button color="medium" fill="clear" slot="end">
                   <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
                 </ion-button>
               </ion-item>
             </ion-list>
           </ion-card>
         </section>
+ 
         <section v-else-if="selectedSegment === 'publish'">
           <ion-card>
             <ion-card-header>
@@ -74,6 +73,7 @@
                 <ion-card-subtitle class="overline">{{ "SHOP CONFIG ID" }}</ion-card-subtitle>
                 <ion-card-title>{{ "Shop name" }}</ion-card-title>
               </div>
+              <ion-badge color="dark">{{ "in 2 minutes" }}</ion-badge>
             </ion-card-header>
 
             <ion-list>
@@ -99,8 +99,8 @@
               </ion-item>
   
               <ion-item lines="none">
-                <ion-button fill="clear">{{ translate("View details") }}</ion-button>
-                  <ion-button color="medium" fill="clear" slot="end">
+                <ion-button fill="clear">{{ translate("Save changes") }}</ion-button>
+                <ion-button color="medium" fill="clear" slot="end" @click="openShopActionsPopover($event)">
                   <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
                 </ion-button>
               </ion-item>
@@ -118,79 +118,24 @@
   </ion-page>
 </template>
 
-<script lang="ts">
-import {
-  IonButton,
-  IonCard,
-  IonCardHeader,
-  IonCardSubtitle,
-  IonCardTitle,
-  IonChip,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonPage,
-  IonSegment,
-  IonSegmentButton,
-  IonSelect,
-  IonSelectOption,
-  IonTitle,
-  IonToolbar
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { addOutline, albumsOutline, businessOutline, copyOutline, ellipsisVerticalOutline, globeOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
+<script setup lang="ts">
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, popoverController } from '@ionic/vue';
+import { ref } from 'vue';
+import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@hotwax/dxp-components';
+import ShopActionsPopover from '@/components/ShopActionsPopover.vue'
+
+const selectedSegment = ref("channels")
 
-export default defineComponent({
-  name: 'Inventory channels',
-  components: {
-    IonButton,
-    IonCard,
-    IonCardHeader,
-    IonCardSubtitle,
-    IonCardTitle,
-    IonChip,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonItem,
-    IonLabel,
-    IonList,
-    IonPage,
-    IonSegment,
-    IonSegmentButton,
-    IonSelect,
-    IonSelectOption,
-    IonTitle,
-    IonToolbar
-  },
-  data() {
-    return {
-      selectedSegment: 'channels'
-    }
-  },
-  setup() {
-    return {
-      addOutline,
-      albumsOutline,
-      businessOutline,
-      copyOutline,
-      ellipsisVerticalOutline,
-      globeOutline,
-      storefrontOutline,
-      timeOutline,
-      timerOutline,
-      translate
-    };
-  },
-});
+async function openShopActionsPopover(event: Event) {
+  const popover = await popoverController.create({
+    component: ShopActionsPopover,
+    showBackdrop: false,
+    event
+  });
+
+  return popover.present();
+}
 </script>
 
 <style scoped>
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 2a27f344..759db31e 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -8,6 +8,8 @@
 
     <ion-content>
       <main>
+        <ScheduleRuleItem />
+
         <section>
           <RuleItem />
           <RuleItem />
@@ -23,47 +25,16 @@
   </ion-page>
 </template>
 
-<script lang="ts">
-import {
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonPage,
-  IonTitle,
-  IonToolbar
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
+<script setup lang="ts">
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
-import { useRouter } from 'vue-router';
+import { useRouter } from "vue-router";
+import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 
-export default defineComponent({
-  name: 'SafetyStock',
-  components: {
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonPage,
-    IonTitle,
-    IonToolbar,
-    RuleItem
-  },
-  methods: {
-    createRule() {
-      this.router.replace({ path: '/create-rule' })
-    }
-  },
-  setup() {
-    const router = useRouter()
+const router = useRouter()
 
-    return {
-      addOutline,
-      router
-    };
-  },
-});
+function createRule() {
+  router.replace({ path: '/create-rule' })
+}
 </script>
\ No newline at end of file
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index c566d812..b8862166 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -22,13 +22,11 @@
 
     <ion-content>
       <main>
-        <section v-if="selectedSegment === 'productAndFacility'">
-          <RuleItem />
-          <RuleItem />
-        </section>
-        <section v-else-if="selectedSegment === 'productAndChannel'">
-          <RuleItem />
-          <RuleItem />
+        <ScheduleRuleItem v-if="selectedSegment !== 'facility'" />
+
+        <section v-if="selectedSegment === 'productAndFacility' || selectedSegment === 'productAndChannel'">
+          <RuleItem :selectedSegment="selectedSegment" />
+          <RuleItem :selectedSegment="selectedSegment" />
         </section>
         <section v-else>
           <FacilityItem />
@@ -45,53 +43,14 @@
   </ion-page>
 </template>
 
-<script lang="ts">
-import {
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonLabel,
-  IonPage,
-  IonSegment,
-  IonSegmentButton,
-  IonTitle,
-  IonToolbar
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
+<script setup lang="ts">
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar } from '@ionic/vue';
+import { ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@hotwax/dxp-components';
 import FacilityItem from '@/components/FacilityItem.vue';
+import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 
-export default defineComponent({
-  name: 'Shipping',
-  components: {
-    FacilityItem,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonLabel,
-    IonPage,
-    IonSegment,
-    IonSegmentButton,
-    IonTitle,
-    IonToolbar,
-    RuleItem
-  },
-  data() {
-    return {
-      selectedSegment: 'productAndFacility'
-    }
-  },
-  setup() {
-    return {
-      addOutline,
-      translate
-    };
-  },
-});
+const selectedSegment = ref("productAndFacility")
 </script>
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 8cf949cb..38c74a00 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -22,13 +22,11 @@
 
     <ion-content>
       <main>
-        <section v-if="selectedSegment === 'productAndFacility'">
-          <RuleItem />
-          <RuleItem />
-        </section>
-        <section v-else-if="selectedSegment === 'productAndChannel'">
-          <RuleItem />
-          <RuleItem />
+        <ScheduleRuleItem v-if="selectedSegment !== 'facility'" />
+
+        <section v-if="selectedSegment === 'productAndFacility' || selectedSegment === 'productAndChannel'">
+          <RuleItem :selectedSegment="selectedSegment" />
+          <RuleItem :selectedSegment="selectedSegment" />
         </section>
         <section v-else>
           <FacilityItem />
@@ -45,53 +43,14 @@
   </ion-page>
 </template>
 
-<script lang="ts">
-import {
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonLabel,
-  IonPage,
-  IonSegment,
-  IonSegmentButton,
-  IonTitle,
-  IonToolbar
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
+<script setup lang="ts">
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar } from '@ionic/vue';
+import { ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
 import { translate } from '@hotwax/dxp-components';
+import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 
-export default defineComponent({
-  name: 'StorePickup',
-  components: {
-    FacilityItem,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonLabel,
-    IonPage,
-    IonSegment,
-    IonSegmentButton,
-    IonTitle,
-    IonToolbar,
-    RuleItem
-  },
-  data() {
-    return {
-      selectedSegment: 'productAndFacility'
-    }
-  },
-  setup() {
-    return {
-      addOutline,
-      translate
-    };
-  },
-});
+const selectedSegment = ref("productAndFacility")
 </script>
\ No newline at end of file
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 3819560f..c1395294 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -8,6 +8,8 @@
 
     <ion-content>
       <main>
+        <ScheduleRuleItem />
+
         <section>
           <RuleItem />
           <RuleItem />
@@ -23,38 +25,9 @@
   </ion-page>
 </template>
 
-<script lang="ts">
-import {
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonPage,
-  IonTitle,
-  IonToolbar
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
+<script setup lang="ts">
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
-
-export default defineComponent({
-  name: 'SelectProduct',
-  components: {
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonPage,
-    IonTitle,
-    IonToolbar,
-    RuleItem
-  },
-  setup() {
-    return {
-      addOutline
-    };
-  },
-});
+import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 </script>

From 0d1c3156211eab12ad32b571f082d6e92b16f9a3 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 18 Mar 2024 15:10:52 +0530
Subject: [PATCH 013/250] Implemented: modals for linking facilities to group
 and creating group (#238)

---
 src/components/CreateGroupModal.vue           | 44 ++++++++++++++
 src/components/LinkFacilitiesModal.vue        | 57 +++++++++++++++++++
 .../LinkThresholdFacilitiesModal.vue          | 57 +++++++++++++++++++
 src/locales/en.json                           | 10 ++++
 src/views/InventoryChannels.vue               | 37 ++++++++++--
 5 files changed, 201 insertions(+), 4 deletions(-)
 create mode 100644 src/components/CreateGroupModal.vue
 create mode 100644 src/components/LinkFacilitiesModal.vue
 create mode 100644 src/components/LinkThresholdFacilitiesModal.vue

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
new file mode 100644
index 00000000..9942e775
--- /dev/null
+++ b/src/components/CreateGroupModal.vue
@@ -0,0 +1,44 @@
+<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("Create group") }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-list>
+      <ion-item>
+        <ion-input :label="translate('Name')" labelPlacement="floating" />
+      </ion-item>
+
+      <ion-item lines="none">
+        <ion-input :label="translate('ID')" labelPlacement="floating" :errorText="translate('Internal ID cannot be more than 20 characters.')" />
+      </ion-item>
+
+      <ion-item>
+        <ion-textarea :label="translate('Description')" labelPlacement="floating" />
+      </ion-item>
+    </ion-list>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="checkmarkDone" />
+      </ion-fab-button>
+    </ion-fab>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonList, IonNote, IonTextarea, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { closeOutline, checkmarkDone } from "ionicons/icons";
+import { translate } from '@hotwax/dxp-components'
+
+function closeModal() {
+  modalController.dismiss();
+}
+</script>
\ No newline at end of file
diff --git a/src/components/LinkFacilitiesModal.vue b/src/components/LinkFacilitiesModal.vue
new file mode 100644
index 00000000..e553ad3a
--- /dev/null
+++ b/src/components/LinkFacilitiesModal.vue
@@ -0,0 +1,57 @@
+<template>
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button>
+          <ion-icon slot="icon-only" :icon="close" />
+        </ion-button>
+      </ion-buttons>
+      <ion-title>{{ translate("Link facilities") }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-searchbar />
+
+    <ion-list>
+      <ion-item lines="none">
+        <ion-checkbox>
+          <ion-label>
+            {{ "facilityName" }}
+            <p>{{ "facilityId" }}</p>
+          </ion-label>
+        </ion-checkbox>
+      </ion-item>
+      <ion-item lines="none">
+        <ion-checkbox>
+          <ion-label>
+            {{ "facilityName" }}
+            <p>{{ "facilityId" }}</p>
+          </ion-label>
+        </ion-checkbox>
+      </ion-item>
+      <ion-item lines="none">
+        <ion-checkbox>
+          <ion-label>
+            {{ "facilityName" }}
+            <p>{{ "facilityId" }}</p>
+          </ion-label>
+        </ion-checkbox>
+      </ion-item> 
+    </ion-list>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="saveOutline" />
+      </ion-fab-button>
+    </ion-fab>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { IonButton, IonButtons, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
+import { close, saveOutline } from "ionicons/icons";
+import { translate } from '@hotwax/dxp-components'
+
+
+</script>
\ No newline at end of file
diff --git a/src/components/LinkThresholdFacilitiesModal.vue b/src/components/LinkThresholdFacilitiesModal.vue
new file mode 100644
index 00000000..68119ce7
--- /dev/null
+++ b/src/components/LinkThresholdFacilitiesModal.vue
@@ -0,0 +1,57 @@
+<template>
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button>
+          <ion-icon slot="icon-only" :icon="close" />
+        </ion-button>
+      </ion-buttons>
+      <ion-title>{{ translate("Link threshold") }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-searchbar />
+
+    <ion-radio-group>
+      <ion-item>
+        <ion-radio>
+          <ion-label>
+            {{ "Facility name" }}
+            <p>{{ "Facility ID" }}</p>
+          </ion-label>
+        </ion-radio>
+      </ion-item>
+      <ion-item>
+        <ion-radio>
+          <ion-label>
+            {{ "Facility name" }}
+            <p>{{ "Facility ID" }}</p>
+          </ion-label>
+        </ion-radio>
+      </ion-item>
+      <ion-item>
+        <ion-radio>
+          <ion-label>
+            {{ "Facility name" }}
+            <p>{{ "Facility ID" }}</p>
+          </ion-label>
+        </ion-radio>
+      </ion-item>
+    </ion-radio-group>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="saveOutline" />
+      </ion-fab-button>
+    </ion-fab>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonRadio, IonRadioGroup, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
+import { close, saveOutline } from "ionicons/icons";
+import { translate } from '@hotwax/dxp-components'
+
+
+</script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index 425b4432..e16f6f53 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -19,9 +19,12 @@
   "Color": "Color",
   "Configuration missing": "Configuration missing",
   "Confirm": "Confirm",
+  "Copy details": "Copy details",
+  "Create group": "Create group",
   "Create rule": "Create rule",
   "Create Rule": "Create Rule",
   "Delete": "Delete",
+  "Description": "Description",
   "Disable": "Disable",
   "Disabled": "Disabled",
   "Discard": "Discard",
@@ -29,6 +32,7 @@
   "Don't skip": "Don't skip",
   "Download": "Download",
   "Download data in csv": "Download data in csv",
+  "Edit name": "Edit name",
   "Edit rule": "Edit rule",
   "Edit safety stock": "Edit safety stock",
   "Edit threshold": "Edit threshold",
@@ -57,8 +61,10 @@
   "Exclude": "Exclude",
   "Facility groups": "Facility groups",
   "Filter stores": "Filter stores",
+  "ID": "ID",
   "Import product thresholds": "Import product thresholds",
   "Included": "Included",
+  "Internal ID cannot be more than 20 characters.": "Internal ID cannot be more than 20 characters.",
   "Inventory channels": "Inventory channels",
   "global threshold": "global threshold",
   "included": "included",
@@ -69,6 +75,8 @@
   "Jobs sequence updated successfully": "Jobs sequence updated successfully",
   "Keep editing": "Keep editing",
   "Last run": "Last run",
+  "Link facilities": "Link facilities",
+  "Link threshold": "Link threshold",
   "Loading": "Loading",
   "Login": "Login",
   "Logging in": "Logging in",
@@ -76,6 +84,7 @@
   "Logout": "Logout",
   "Make sure you have saved your changes. All unsaved changes to this rule will be lost.": "Make sure you have saved your changes. All unsaved changes to this rule will be lost.",
   "Menu": "Menu",
+  "More options": "More options",
   "Name": "Name",
   "New safety stock rule": "New safety stock rule",
   "No job found.": "No job found.",
@@ -89,6 +98,7 @@
   "Only show selected products": "Only show selected products",
   "Operator": "Operator",
   "Password": "Password",
+  "Paused": "Paused",
   "Pending": "Pending",
   "Please enter a threshold value to set for these products before proceeding.": "Please enter a threshold value to set for these products before proceeding.",
   "Product and facility": "Product and facility",
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 18e0eefc..0d1475d8 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -35,13 +35,15 @@
                 {{ "<threshold facility name>" }}
                 <p>{{ "<facilityId>" }}</p>
               </ion-label>
-              <ion-chip slot="end" outline>4</ion-chip>
+              <ion-button slot="end" fill="clear" color="medium" @click="openLinkThresholdFacilitesModal()">
+                <ion-icon :icon="optionsOutline" slot="icon-only" />
+              </ion-button>
             </ion-item>
 
             <ion-list>
               <ion-item-divider color="light">
                 <ion-label>{{ translate("Facilities") }}</ion-label>
-                <ion-button slot="end" fill="clear" color="medium">
+                <ion-button slot="end" fill="clear" color="medium" @click="openLinkFacilitiesModal()">
                   <ion-icon :icon="optionsOutline" slot="icon-only" />
                 </ion-button>
               </ion-item-divider>
@@ -111,7 +113,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="openCreateGroupModal()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -119,11 +121,14 @@
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, popoverController } from '@ionic/vue';
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, popoverController } from '@ionic/vue';
 import { ref } from 'vue';
 import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@hotwax/dxp-components';
 import ShopActionsPopover from '@/components/ShopActionsPopover.vue'
+import CreateGroupModal from '@/components/CreateGroupModal.vue'
+import LinkFacilitiesModal from '@/components/LinkFacilitiesModal.vue'
+import LinkThresholdFacilitiesModal from '@/components/LinkThresholdFacilitiesModal.vue'
 
 const selectedSegment = ref("channels")
 
@@ -136,6 +141,30 @@ async function openShopActionsPopover(event: Event) {
 
   return popover.present();
 }
+
+async function openCreateGroupModal() {
+  const popover = await modalController.create({
+    component: CreateGroupModal
+  });
+
+  return popover.present();
+}
+
+async function openLinkFacilitiesModal() {
+  const popover = await modalController.create({
+    component: LinkFacilitiesModal
+  });
+
+  return popover.present();
+}
+
+async function openLinkThresholdFacilitesModal() {
+  const popover = await modalController.create({
+    component: LinkThresholdFacilitiesModal
+  });
+
+  return popover.present();
+}
 </script>
 
 <style scoped>

From 879772178b5c079d613ab08a6ee1b53e35c8921e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 18 Mar 2024 18:20:55 +0530
Subject: [PATCH 014/250] Implemented: pages for creation of different ATP
 rules (#238)

---
 src/components/Menu.vue                       |  24 +--
 src/locales/en.json                           |   5 +
 src/router/index.ts                           | 107 ++++++----
 src/theme/variables.css                       |  19 ++
 .../{CreateRule.vue => CreateSafetyStock.vue} |  86 +-------
 src/views/CreateShipping.vue                  | 201 ++++++++++++++++++
 src/views/CreateStorePickup.vue               | 193 +++++++++++++++++
 src/views/CreateThreshold.vue                 | 147 +++++++++++++
 src/views/SafetyStock.vue                     |   2 +-
 src/views/Shipping.vue                        |   9 +-
 src/views/StorePickup.vue                     |   9 +-
 src/views/Threshold.vue                       |  10 +-
 12 files changed, 667 insertions(+), 145 deletions(-)
 rename src/views/{CreateRule.vue => CreateSafetyStock.vue} (76%)
 create mode 100644 src/views/CreateShipping.vue
 create mode 100644 src/views/CreateStorePickup.vue
 create mode 100644 src/views/CreateThreshold.vue

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 060221b3..c4f1d6a2 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -110,47 +110,31 @@
       const store = useStore();
       const router = useRouter();
       const appPages = [
-        // {
-        //   title: "Create Rule",
-        //   url: "/select-product",
-        //   iosIcon: optionsOutline,
-        //   mdIcon: optionsOutline,
-        //   meta: {
-        //     permissionId: "APP_SELECT_PRODUCT_VIEW"
-
-        //   }
-        // },
-        // {
-        //   title: "Rule Pipeline",
-        //   url: "/threshold-updates",
-        //   iosIcon: pulseOutline,
-        //   mdIcon: pulseOutline,
-        //   meta: {
-        //     permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-        //   }
-        // },
         {
           title: "Threshold",
           url: "/threshold",
+          childRoutes: ["/create-threshold"],
           iosIcon: globeOutline,
           mdIcon: globeOutline
         },
         {
           title: "Safety stock",
           url: "/safety-stock",
-          childRoutes: ["/create-rule"],
+          childRoutes: ["/create-safety-stock"],
           iosIcon: pulseOutline,
           mdIcon: pulseOutline
         },
         {
           title: "Store pickup",
           url: "/store-pickup",
+          childRoutes: ["/create-store-pickup"],
           iosIcon: storefrontOutline,
           mdIcon: storefrontOutline
         },
         {
           title: "Shipping",
           url: "/shipping",
+          childRoutes: ["/create-shipping"],
           iosIcon: sendOutline,
           mdIcon: sendOutline
         },
diff --git a/src/locales/en.json b/src/locales/en.json
index e16f6f53..b0781773 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -12,6 +12,7 @@
   "Canceling this job will cancel this occurrence and all following occurrences. This job will have to be re-enabled manually to run it again.": "Canceling this job will cancel this occurrence and all following occurrences. This job will have to be re-enabled manually to run it again.",
   "Cancel job": "Cancel job",
   "Change": "Change",
+  "Channel": "Channel",
   "Channels": "Channels",
   "Check products": "Check products",
   "Clear All": "Clear All",
@@ -86,6 +87,9 @@
   "Menu": "Menu",
   "More options": "More options",
   "Name": "Name",
+  "New shipping rule": "New shipping rule",
+  "New store pickup rule": "New store pickup rule",
+  "New threshold rule": "New threshold rule",
   "New safety stock rule": "New safety stock rule",
   "No job found.": "No job found.",
   "No jobs have run yet": "No jobs have run yet",
@@ -120,6 +124,7 @@
   "Reorder export jobs": "Reorder export jobs",
   "reset": "reset",
   "retry": "retry",
+  "Rule Configuration": "Rule Configuration",
   "rule name": "rule name",
   "Run now": "Run now",
   "running": "running",
diff --git a/src/router/index.ts b/src/router/index.ts
index abd63c46..8666bef1 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -13,7 +13,10 @@ import SafetyStock from '@/views/SafetyStock.vue'
 import StorePickup from '@/views/StorePickup.vue'
 import Shipping from '@/views/Shipping.vue'
 import InventoryChannels from '@/views/InventoryChannels.vue'
-import CreateRule from '@/views/CreateRule.vue'
+import CreateThreshold from '@/views/CreateThreshold.vue';
+import CreateSafetyStock from '@/views/CreateSafetyStock.vue'
+import CreateStorePickup from '@/views/CreateStorePickup.vue'
+import CreateShipping from '@/views/CreateShipping.vue'
 
 import { hasPermission } from '@/authorization';
 import { showToast } from '@/utils'
@@ -53,7 +56,7 @@ const loginGuard = (to: any, from: any, next: any) => {
 const routes: Array<RouteRecordRaw> = [
   {
     path: '/',
-    redirect: '/select-product'
+    redirect: '/threshold'
   },
   {
     path: '/select-product',
@@ -95,45 +98,65 @@ const routes: Array<RouteRecordRaw> = [
     beforeEnter: authGuard
   },
   {
-    path: '/create-rule',
-    name: 'Create rule',
-    component: CreateRule,
+    path: '/create-threshold',
+    name: 'Create threshold',
+    component: CreateThreshold,
     beforeEnter: authGuard
   },
   {
-    path: '/select-product-csv-upload',
-    name: 'SelectProductCSVUpload',
-    component: SelectProductCSVUpload,
-    meta: {
-      permissionId: ""
-    }
-  },
-  {
-    path: '/select-facility',
-    name: 'SelectFacility',
-    component: SelectFacility,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: ""
-    }
+    path: '/create-safety-stock',
+    name: 'Create safety stock',
+    component: CreateSafetyStock,
+    beforeEnter: authGuard
   },
   {
-    path: '/select-facility-csv-upload',
-    name: 'SelectFacilityCSVUpload',
-    component: SelectFacilityCSVUpload,
-    meta: {
-      permissionId: ""
-    }
+    path: '/create-store-pickup',
+    name: 'Create store pickup',
+    component: CreateStorePickup,
+    beforeEnter: authGuard
   },
   {
-    path: '/threshold-updates',
-    name: 'ThresholdUpdates',
-    component: ThresholdUpdates,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-    }
+    path: '/create-shipping',
+    name: 'Create shipping',
+    component: CreateShipping,
+    beforeEnter: authGuard
   },
+
+
+  // {
+  //   path: '/select-product-csv-upload',
+  //   name: 'SelectProductCSVUpload',
+  //   component: SelectProductCSVUpload,
+  //   meta: {
+  //     permissionId: ""
+  //   }
+  // },
+  // {
+  //   path: '/select-facility',
+  //   name: 'SelectFacility',
+  //   component: SelectFacility,
+  //   beforeEnter: authGuard,
+  //   meta: {
+  //     permissionId: ""
+  //   }
+  // },
+  // {
+  //   path: '/select-facility-csv-upload',
+  //   name: 'SelectFacilityCSVUpload',
+  //   component: SelectFacilityCSVUpload,
+  //   meta: {
+  //     permissionId: ""
+  //   }
+  // },
+  // {
+  //   path: '/threshold-updates',
+  //   name: 'ThresholdUpdates',
+  //   component: ThresholdUpdates,
+  //   beforeEnter: authGuard,
+  //   meta: {
+  //     permissionId: "APP_THRESHOLD_UPDATES_VIEW"
+  //   }
+  // },
   {
     path: '/login',
     name: 'DxpLogin',
@@ -146,15 +169,15 @@ const routes: Array<RouteRecordRaw> = [
     component: Settings,
     beforeEnter: authGuard
   },
-  {
-    path: '/schedule-threshold',
-    name: 'ScheduleThreshold',
-    component: ScheduleThreshold,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_SAVE_THRESHOLD_VIEW"
-    }
-  },
+  // {
+  //   path: '/schedule-threshold',
+  //   name: 'ScheduleThreshold',
+  //   component: ScheduleThreshold,
+  //   beforeEnter: authGuard,
+  //   meta: {
+  //     permissionId: "APP_SAVE_THRESHOLD_VIEW"
+  //   }
+  // },
 ]
 
 const router = createRouter({
diff --git a/src/theme/variables.css b/src/theme/variables.css
index 5f344f4f..9955f822 100644
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@@ -312,6 +312,25 @@ hr {
   border-bottom: var(--border-medium);
 }
 
+.rule-config {
+  grid-column: span 2;
+}
+
+.rule-inputs {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+}
+
+.section-header {
+  padding: var(--spacer-xs) 10px 0px;
+}
+
+ion-content>section {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+  align-items: start;
+}
+
 @media (min-width: 700px) {
   main {
     max-width: 375px;
diff --git a/src/views/CreateRule.vue b/src/views/CreateSafetyStock.vue
similarity index 76%
rename from src/views/CreateRule.vue
rename to src/views/CreateSafetyStock.vue
index 7d6214ad..d07969a8 100644
--- a/src/views/CreateRule.vue
+++ b/src/views/CreateSafetyStock.vue
@@ -12,20 +12,21 @@
         <div class="rule-config">
           <ion-card>
             <ion-card-header>
-              <ion-card-title>{{ "Rule Configuration" }}</ion-card-title>
+              <ion-card-title>{{ translate("Rule Configuration") }}</ion-card-title>
             </ion-card-header>
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input label="Name" label-placement="floating" />
+                <ion-input :label="translate('Name')" />
               </ion-item>
               <ion-item>
-                <ion-input label="Safety stock" label-placement="floating" />
+                <ion-input :label="translate('Safety stock')" />
               </ion-item>
             </div>
           </ion-card>
         </div>
       </section>
+
       <div class="section-header">
         <h1>{{ translate("Facilities") }}</h1>
       </div>
@@ -149,81 +150,8 @@
   </ion-page>
 </template>
 
-<script lang="ts">
-import {
-  IonBackButton,
-  IonButton,
-  IonCard,
-  IonCardContent,
-  IonCardHeader,
-  IonCardTitle,
-  IonChip,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonInput,
-  IonItem,
-  IonLabel,
-  IonPage,
-  IonTitle,
-  IonToolbar
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
+<script setup lang="ts">
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
-
-export default defineComponent({
-  name: 'Settings',
-  components: {
-    IonBackButton,
-    IonButton,
-    IonCard,
-    IonCardContent,
-    IonCardHeader,
-    IonCardTitle,
-    IonChip,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonInput,
-    IonItem,
-    IonLabel,
-    IonPage,
-    IonTitle,
-    IonToolbar
-  },
-  setup(){
-    return {
-      addCircleOutline,
-      closeCircle,
-      saveOutline,
-      translate,
-    }
-  }
-});
-</script>
-
-<style scoped>
-section {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
-  align-items: start;
-}
-
-.section-header {
-  padding: var(--spacer-xs) 10px 0px;
-}
-
-.rule-config {
-  grid-column: span 2;
-}
-
-.rule-inputs {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
-}
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file
diff --git a/src/views/CreateShipping.vue b/src/views/CreateShipping.vue
new file mode 100644
index 00000000..5cce9420
--- /dev/null
+++ b/src/views/CreateShipping.vue
@@ -0,0 +1,201 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-back-button slot="start" default-href="/shipping" />
+        <ion-title>{{ translate("New shipping rule") }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
+    
+    <ion-content>
+      <section>
+        <div class="rule-config">
+          <ion-card>
+            <ion-card-header>
+              <ion-card-title>{{ "Rule Configuration" }}</ion-card-title>
+            </ion-card-header>
+
+            <div class="rule-inputs ion-padding">
+              <ion-item>
+                <ion-input label="Name" />
+              </ion-item>
+              <ion-item>
+                <ion-icon slot="start" :icon="storefrontOutline"/>
+                <ion-toggle>{{ translate("Shipping") }}</ion-toggle>
+              </ion-item>
+            </div>
+          </ion-card>
+        </div>
+      </section>
+      
+      <div class="section-header">
+        <ion-segment v-model="selectedSegment">
+          <ion-segment-button value="facility">
+            <ion-label>{{ translate("Facility") }}</ion-label>
+          </ion-segment-button>
+          <ion-segment-button value="channel">
+            <ion-label>{{ translate("Channel") }}</ion-label>
+          </ion-segment-button>
+        </ion-segment>
+      </div>
+
+      <section v-if="selectedSegment === 'facility'">
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Facility group name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Facility group name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+
+      <section v-else>
+        <ion-card >
+          <ion-card-header>
+            <div>
+              <ion-card-title>{{ "Facility Name" }}</ion-card-title>
+              <ion-card-subtitle>{{ "Facility ID" }}</ion-card-subtitle>
+            </div>
+            <ion-checkbox />
+          </ion-card-header>
+        </ion-card>
+      </section>
+
+      <div class="section-header">
+        <h1>{{ translate("Products by tags") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Tag name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Tag name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+
+      <div class="section-header">
+        <h1>{{ translate("Products by feature") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Feature name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Feature name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+    </ion-content>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="saveOutline" />
+      </ion-fab-button>
+    </ion-fab>
+  </ion-page>
+</template>
+
+<script setup lang="ts">
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToggle, IonToolbar } from '@ionic/vue';
+import { ref } from 'vue';
+import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
+import { translate } from "@hotwax/dxp-components";
+
+const selectedSegment = ref("facility")
+</script>
+
+<style scoped>
+section {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+  align-items: start;
+}
+
+.section-header {
+  padding: var(--spacer-xs) 10px 0px;
+}
+
+.rule-config {
+  grid-column: span 2;
+}
+
+.rule-inputs {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+}
+</style>
\ No newline at end of file
diff --git a/src/views/CreateStorePickup.vue b/src/views/CreateStorePickup.vue
new file mode 100644
index 00000000..52c909f9
--- /dev/null
+++ b/src/views/CreateStorePickup.vue
@@ -0,0 +1,193 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-back-button slot="start" default-href="/store-pickup" />
+        <ion-title>{{ translate("New store pickup rule") }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
+    
+    <ion-content>
+      <section>
+        <div class="rule-config">
+          <ion-card>
+            <ion-card-header>
+              <ion-card-title>{{ translate("Rule Configuration") }}</ion-card-title>
+            </ion-card-header>
+
+            <div class="rule-inputs ion-padding">
+              <ion-item>
+                <ion-input :label="translate('Name')" />
+              </ion-item>
+              <ion-item>
+                <ion-icon slot="start" :icon="storefrontOutline"/>
+                <ion-toggle>{{ translate("Store pickup") }}</ion-toggle>
+              </ion-item>
+            </div>
+          </ion-card>
+        </div>
+      </section>
+
+      <div class="section-header">
+        <ion-segment v-model="selectedSegment">
+          <ion-segment-button value="facility">
+            <ion-label>{{ translate("Facility") }}</ion-label>
+          </ion-segment-button>
+          <ion-segment-button value="channel">
+            <ion-label>{{ translate("Channel") }}</ion-label>
+          </ion-segment-button>
+        </ion-segment>
+      </div>
+
+      <section v-if="selectedSegment === 'facility'">
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Facility group name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Facility group name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+
+      <section v-else>
+        <ion-card >
+          <ion-card-header>
+            <div>
+              <ion-card-title>{{ "Facility Name" }}</ion-card-title>
+              <ion-card-subtitle>{{ "Facility ID" }}</ion-card-subtitle>
+            </div>
+            <ion-checkbox />
+          </ion-card-header>
+        </ion-card>
+      </section>
+
+      <div class="section-header">
+        <h1>{{ translate("Products by tags") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Tag name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Tag name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+
+      <div class="section-header">
+        <h1>{{ translate("Products by feature") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Feature name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Feature name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+    </ion-content>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="saveOutline" />
+      </ion-fab-button>
+    </ion-fab>
+  </ion-page>
+</template>
+
+<script setup lang="ts">
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToggle, IonToolbar } from '@ionic/vue';
+import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
+import { translate } from "@hotwax/dxp-components";
+import { ref } from 'vue';
+
+const selectedSegment = ref("facility")
+</script>
+
+<style scoped>
+ion-card-header {
+  display: flex;
+  flex-direction: row ;
+  justify-content: space-between;
+  align-items: center;
+}
+
+ion-card-header > ion-checkbox {
+  flex-shrink: 0;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/CreateThreshold.vue b/src/views/CreateThreshold.vue
new file mode 100644
index 00000000..95bfbe66
--- /dev/null
+++ b/src/views/CreateThreshold.vue
@@ -0,0 +1,147 @@
+<template>
+  <ion-page>
+    <ion-header :translucent="true">
+      <ion-toolbar>
+        <ion-back-button slot="start" default-href="/threshold" />
+        <ion-title>{{ translate("New threshold rule") }}</ion-title>
+      </ion-toolbar>
+    </ion-header>
+    
+    <ion-content>
+      <section>
+        <div class="rule-config">
+          <ion-card>
+            <ion-card-header>
+              <ion-card-title>{{ translate("Rule Configuration") }}</ion-card-title>
+            </ion-card-header>
+
+            <div class="rule-inputs ion-padding">
+              <ion-item>
+                <ion-input :label="translate('Name')" />
+              </ion-item>
+              <ion-item>
+                <ion-input :label="translate('Threshold')" />
+              </ion-item>
+            </div>
+          </ion-card>
+        </div>
+      </section>
+      <div class="section-header">
+        <h1>{{ translate("Channels") }}</h1>
+      </div>
+
+      <section> 
+        <ion-card >
+          <ion-card-header>
+            <div>
+              <ion-card-title>{{ "Facitlity Name" }}</ion-card-title>
+              <ion-card-subtitle>{{ "Facility ID" }}</ion-card-subtitle>
+            </div>
+            <ion-checkbox />
+          </ion-card-header>
+        </ion-card>
+      </section>
+
+      <div class="section-header">
+        <h1>{{ translate("Products by tags") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Tag name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Tag name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+
+      <div class="section-header">
+        <h1>{{ translate("Products by feature") }}</h1>
+      </div>
+
+      <section>
+        <ion-card>
+          <ion-item lines="none">
+            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Feature name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+
+        <ion-card>
+          <ion-item lines="none"> 
+            <ion-label>{{ translate("Excluded") }}</ion-label>
+            <ion-button fill="clear">
+              {{ translate("Add") }}
+              <ion-icon :icon="addCircleOutline" slot="end" />
+            </ion-button>
+          </ion-item>
+          <ion-card-content>
+            <ion-chip outline>
+              {{ "Feature name" }}
+              <ion-icon :icon="closeCircle"/>
+            </ion-chip>
+          </ion-card-content>
+        </ion-card>
+      </section>
+    </ion-content>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="saveOutline" />
+      </ion-fab-button>
+    </ion-fab>
+  </ion-page>
+</template>
+
+<script setup lang="ts">
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
+import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
+import { translate } from "@hotwax/dxp-components";
+</script>
+
+<style scoped>
+ion-card-header {
+  display: flex;
+  flex-direction: row ;
+  justify-content: space-between;
+  align-items: center;
+}
+
+ion-card-header > ion-checkbox {
+  flex-shrink: 0;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 759db31e..1b306db2 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -35,6 +35,6 @@ import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 const router = useRouter()
 
 function createRule() {
-  router.replace({ path: '/create-rule' })
+  router.replace({ path: '/create-safety-stock' })
 }
 </script>
\ No newline at end of file
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index b8862166..93106ec6 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -36,7 +36,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="createShipping()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -51,6 +51,13 @@ import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@hotwax/dxp-components';
 import FacilityItem from '@/components/FacilityItem.vue';
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
+import { useRouter } from 'vue-router';
 
 const selectedSegment = ref("productAndFacility")
+
+const router = useRouter()
+
+function createShipping() {
+  router.replace({ path: '/create-shipping' })
+}
 </script>
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 38c74a00..b8e8864b 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -35,7 +35,7 @@
       </main>
 
       <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-        <ion-fab-button>
+        <ion-fab-button @click="createStorePickup()">
           <ion-icon :icon="addOutline" />
         </ion-fab-button>
       </ion-fab>
@@ -51,6 +51,13 @@ import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
 import { translate } from '@hotwax/dxp-components';
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
+import { useRouter } from 'vue-router';
 
 const selectedSegment = ref("productAndFacility")
+
+const router = useRouter()
+
+function createStorePickup() {
+  router.replace({ path: '/create-store-pickup' })
+}
 </script>
\ No newline at end of file
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index c1395294..348eac25 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -17,7 +17,7 @@
       </main>
 
       <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-        <ion-fab-button>
+        <ion-fab-button @click="CreateThreshold()">
           <ion-icon :icon="addOutline" />
         </ion-fab-button>
       </ion-fab>
@@ -30,4 +30,12 @@ import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonPage, IonTitle
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
+import { useRouter } from 'vue-router';
+
+const router = useRouter()
+
+function CreateThreshold() {
+  router.replace({ path: '/create-threshold' })
+}
+
 </script>

From e3f92c59d09a71274b4876ef7b897fbb647ed185 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 19 Mar 2024 10:51:19 +0530
Subject: [PATCH 015/250] Improved: create a child component for product by
 sections in create pages (#238)

---
 src/components/CreateGroupModal.vue           | 16 ++--
 src/components/FacilityItem.vue               |  3 +-
 ...dal.vue => LinkFacilitiesToGroupModal.vue} |  4 +-
 ...> LinkThresholdFacilitiesToGroupModal.vue} |  2 -
 src/components/ProductFilterByItem.vue        | 83 +++++++++++++++++++
 src/components/ScheduleRuleItem.vue           |  1 -
 src/router/index.ts                           | 47 +----------
 src/views/CreateSafetyStock.vue               | 77 +----------------
 src/views/CreateShipping.vue                  | 77 +----------------
 src/views/CreateStorePickup.vue               | 77 +----------------
 src/views/CreateThreshold.vue                 | 81 +-----------------
 src/views/InventoryChannels.vue               | 16 ++--
 12 files changed, 112 insertions(+), 372 deletions(-)
 rename src/components/{LinkFacilitiesModal.vue => LinkFacilitiesToGroupModal.vue} (87%)
 rename src/components/{LinkThresholdFacilitiesModal.vue => LinkThresholdFacilitiesToGroupModal.vue} (99%)
 create mode 100644 src/components/ProductFilterByItem.vue

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index 9942e775..c3ac6249 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -15,26 +15,24 @@
       <ion-item>
         <ion-input :label="translate('Name')" labelPlacement="floating" />
       </ion-item>
-
       <ion-item lines="none">
         <ion-input :label="translate('ID')" labelPlacement="floating" :errorText="translate('Internal ID cannot be more than 20 characters.')" />
       </ion-item>
-
       <ion-item>
         <ion-textarea :label="translate('Description')" labelPlacement="floating" />
       </ion-item>
     </ion-list>
-
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
-        <ion-icon :icon="checkmarkDone" />
-      </ion-fab-button>
-    </ion-fab>
   </ion-content>
+
+  <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab-button>
+      <ion-icon :icon="checkmarkDone" />
+    </ion-fab-button>
+  </ion-fab>
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonList, IonNote, IonTextarea, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonList, IonTextarea, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, checkmarkDone } from "ionicons/icons";
 import { translate } from '@hotwax/dxp-components'
 
diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 67747c2b..12459e28 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -36,11 +36,12 @@ import { storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@hotwax/dxp-components';
 
+const router = useRouter();
+
 const selectedPage = ref({
   path: '',
   name: ''
 }) as any
-const router = useRouter();
 
 onMounted(() => {
     selectedPage.value.path = router.currentRoute.value.path
diff --git a/src/components/LinkFacilitiesModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
similarity index 87%
rename from src/components/LinkFacilitiesModal.vue
rename to src/components/LinkFacilitiesToGroupModal.vue
index e553ad3a..0eda3f17 100644
--- a/src/components/LinkFacilitiesModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -49,9 +49,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonButtons, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
+import { IonButton, IonButtons, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
 import { close, saveOutline } from "ionicons/icons";
 import { translate } from '@hotwax/dxp-components'
-
-
 </script>
\ No newline at end of file
diff --git a/src/components/LinkThresholdFacilitiesModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
similarity index 99%
rename from src/components/LinkThresholdFacilitiesModal.vue
rename to src/components/LinkThresholdFacilitiesToGroupModal.vue
index 68119ce7..8973a1cd 100644
--- a/src/components/LinkThresholdFacilitiesModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -52,6 +52,4 @@
 import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonRadio, IonRadioGroup, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
 import { close, saveOutline } from "ionicons/icons";
 import { translate } from '@hotwax/dxp-components'
-
-
 </script>
\ No newline at end of file
diff --git a/src/components/ProductFilterByItem.vue b/src/components/ProductFilterByItem.vue
new file mode 100644
index 00000000..c241416b
--- /dev/null
+++ b/src/components/ProductFilterByItem.vue
@@ -0,0 +1,83 @@
+<template>
+  <div class="section-header">
+    <h1>{{ translate("Products by tags") }}</h1>
+  </div>
+
+  <section>
+    <ion-card>
+      <ion-item lines="none">
+        <ion-label>{{ translate("Included") }}</ion-label>
+        <ion-button fill="clear">
+          {{ translate("Add") }}
+          <ion-icon :icon="addCircleOutline" slot="end" />
+        </ion-button>
+      </ion-item>
+      <ion-card-content>
+        <ion-chip outline>
+          {{ "Tag name" }}
+          <ion-icon :icon="closeCircle"/>
+        </ion-chip>
+      </ion-card-content>
+    </ion-card>
+
+    <ion-card>
+      <ion-item lines="none"> 
+        <ion-label>{{ translate("Excluded") }}</ion-label>
+        <ion-button fill="clear">
+          {{ translate("Add") }}
+          <ion-icon :icon="addCircleOutline" slot="end" />
+        </ion-button>
+      </ion-item>
+      <ion-card-content>
+        <ion-chip outline>
+          {{ "Tag name" }}
+          <ion-icon :icon="closeCircle"/>
+        </ion-chip>
+      </ion-card-content>
+    </ion-card>
+  </section>
+
+  <div class="section-header">
+    <h1>{{ translate("Products by feature") }}</h1>
+  </div>
+
+  <section>
+    <ion-card>
+      <ion-item lines="none">
+        <ion-label>{{ translate("Included") }}</ion-label>
+        <ion-button fill="clear">
+          {{ translate("Add") }}
+          <ion-icon :icon="addCircleOutline" slot="end" />
+        </ion-button>
+      </ion-item>
+      <ion-card-content>
+        <ion-chip outline>
+          {{ "Feature name" }}
+          <ion-icon :icon="closeCircle"/>
+        </ion-chip>
+      </ion-card-content>
+    </ion-card>
+
+    <ion-card>
+      <ion-item lines="none"> 
+        <ion-label>{{ translate("Excluded") }}</ion-label>
+        <ion-button fill="clear">
+          {{ translate("Add") }}
+          <ion-icon :icon="addCircleOutline" slot="end" />
+        </ion-button>
+      </ion-item>
+      <ion-card-content>
+        <ion-chip outline>
+          {{ "Feature name" }}
+          <ion-icon :icon="closeCircle"/>
+        </ion-chip>
+      </ion-card-content>
+    </ion-card>
+  </section>
+</template>
+
+<script setup lang="ts">
+import { IonButton, IonCard, IonCardContent, IonChip, IonIcon, IonItem, IonLabel } from '@ionic/vue';
+import { addCircleOutline, closeCircle } from 'ionicons/icons'
+import { translate } from '@hotwax/dxp-components';
+</script>
\ No newline at end of file
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index 7eadfe46..19ea92b8 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -1,4 +1,3 @@
-
 <template>
   <ion-card>
     <ion-card-header>
diff --git a/src/router/index.ts b/src/router/index.ts
index 8666bef1..92059124 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -121,42 +121,6 @@ const routes: Array<RouteRecordRaw> = [
     component: CreateShipping,
     beforeEnter: authGuard
   },
-
-
-  // {
-  //   path: '/select-product-csv-upload',
-  //   name: 'SelectProductCSVUpload',
-  //   component: SelectProductCSVUpload,
-  //   meta: {
-  //     permissionId: ""
-  //   }
-  // },
-  // {
-  //   path: '/select-facility',
-  //   name: 'SelectFacility',
-  //   component: SelectFacility,
-  //   beforeEnter: authGuard,
-  //   meta: {
-  //     permissionId: ""
-  //   }
-  // },
-  // {
-  //   path: '/select-facility-csv-upload',
-  //   name: 'SelectFacilityCSVUpload',
-  //   component: SelectFacilityCSVUpload,
-  //   meta: {
-  //     permissionId: ""
-  //   }
-  // },
-  // {
-  //   path: '/threshold-updates',
-  //   name: 'ThresholdUpdates',
-  //   component: ThresholdUpdates,
-  //   beforeEnter: authGuard,
-  //   meta: {
-  //     permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-  //   }
-  // },
   {
     path: '/login',
     name: 'DxpLogin',
@@ -168,16 +132,7 @@ const routes: Array<RouteRecordRaw> = [
     name: "Settings",
     component: Settings,
     beforeEnter: authGuard
-  },
-  // {
-  //   path: '/schedule-threshold',
-  //   name: 'ScheduleThreshold',
-  //   component: ScheduleThreshold,
-  //   beforeEnter: authGuard,
-  //   meta: {
-  //     permissionId: "APP_SAVE_THRESHOLD_VIEW"
-  //   }
-  // },
+  }
 ]
 
 const router = createRouter({
diff --git a/src/views/CreateSafetyStock.vue b/src/views/CreateSafetyStock.vue
index d07969a8..8c279eb7 100644
--- a/src/views/CreateSafetyStock.vue
+++ b/src/views/CreateSafetyStock.vue
@@ -65,81 +65,7 @@
         </ion-card>
       </section>
 
-      <div class="section-header">
-        <h1>{{ translate("Products by tags") }}</h1>
-      </div>
-
-      <section>
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Tag name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Tag name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
-
-      <div class="section-header">
-        <h1>{{ translate("Products by feature") }}</h1>
-      </div>
-
-      <section>
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Feature name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Feature name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
+      <ProductFilterByItem />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -154,4 +80,5 @@
 import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
+import ProductFilterByItem from '@/components/ProductFilterByItem.vue';
 </script>
\ No newline at end of file
diff --git a/src/views/CreateShipping.vue b/src/views/CreateShipping.vue
index 5cce9420..cf6c200d 100644
--- a/src/views/CreateShipping.vue
+++ b/src/views/CreateShipping.vue
@@ -85,81 +85,7 @@
         </ion-card>
       </section>
 
-      <div class="section-header">
-        <h1>{{ translate("Products by tags") }}</h1>
-      </div>
-
-      <section>
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Tag name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Tag name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
-
-      <div class="section-header">
-        <h1>{{ translate("Products by feature") }}</h1>
-      </div>
-
-      <section>
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Feature name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Feature name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
+      <ProductFilterByItem />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -175,6 +101,7 @@ import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCa
 import { ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
+import ProductFilterByItem from '@/components/ProductFilterByItem.vue';
 
 const selectedSegment = ref("facility")
 </script>
diff --git a/src/views/CreateStorePickup.vue b/src/views/CreateStorePickup.vue
index 52c909f9..45020cd6 100644
--- a/src/views/CreateStorePickup.vue
+++ b/src/views/CreateStorePickup.vue
@@ -85,81 +85,7 @@
         </ion-card>
       </section>
 
-      <div class="section-header">
-        <h1>{{ translate("Products by tags") }}</h1>
-      </div>
-
-      <section>
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Tag name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Tag name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
-
-      <div class="section-header">
-        <h1>{{ translate("Products by feature") }}</h1>
-      </div>
-
-      <section>
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Feature name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Feature name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
+      <ProductFilterByItem />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -175,6 +101,7 @@ import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCa
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
 import { ref } from 'vue';
+import ProductFilterByItem from '@/components/ProductFilterByItem.vue';
 
 const selectedSegment = ref("facility")
 </script>
diff --git a/src/views/CreateThreshold.vue b/src/views/CreateThreshold.vue
index 95bfbe66..6088e6fb 100644
--- a/src/views/CreateThreshold.vue
+++ b/src/views/CreateThreshold.vue
@@ -42,81 +42,7 @@
         </ion-card>
       </section>
 
-      <div class="section-header">
-        <h1>{{ translate("Products by tags") }}</h1>
-      </div>
-
-      <section>
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Tag name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Tag name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
-
-      <div class="section-header">
-        <h1>{{ translate("Products by feature") }}</h1>
-      </div>
-
-      <section>
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Feature name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline>
-              {{ "Feature name" }}
-              <ion-icon :icon="closeCircle"/>
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
+      <ProductFilterByItem />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -128,9 +54,10 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
-import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
+import { IonBackButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
+import { saveOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
+import ProductFilterByItem from '@/components/ProductFilterByItem.vue';
 </script>
 
 <style scoped>
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 0d1475d8..0cd62184 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -35,7 +35,7 @@
                 {{ "<threshold facility name>" }}
                 <p>{{ "<facilityId>" }}</p>
               </ion-label>
-              <ion-button slot="end" fill="clear" color="medium" @click="openLinkThresholdFacilitesModal()">
+              <ion-button slot="end" fill="clear" color="medium" @click="openLinkThresholdFacilitiesToGroupModal()">
                 <ion-icon :icon="optionsOutline" slot="icon-only" />
               </ion-button>
             </ion-item>
@@ -43,7 +43,7 @@
             <ion-list>
               <ion-item-divider color="light">
                 <ion-label>{{ translate("Facilities") }}</ion-label>
-                <ion-button slot="end" fill="clear" color="medium" @click="openLinkFacilitiesModal()">
+                <ion-button slot="end" fill="clear" color="medium" @click="openLinkFacilitiesToGroupModal()">
                   <ion-icon :icon="optionsOutline" slot="icon-only" />
                 </ion-button>
               </ion-item-divider>
@@ -127,8 +127,8 @@ import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, gl
 import { translate } from '@hotwax/dxp-components';
 import ShopActionsPopover from '@/components/ShopActionsPopover.vue'
 import CreateGroupModal from '@/components/CreateGroupModal.vue'
-import LinkFacilitiesModal from '@/components/LinkFacilitiesModal.vue'
-import LinkThresholdFacilitiesModal from '@/components/LinkThresholdFacilitiesModal.vue'
+import LinkFacilitiesToGroupModal from '@/components/LinkFacilitiesToGroupModal.vue'
+import LinkThresholdFacilitiesToGroupModal from '@/components/LinkThresholdFacilitiesToGroupModal.vue'
 
 const selectedSegment = ref("channels")
 
@@ -150,17 +150,17 @@ async function openCreateGroupModal() {
   return popover.present();
 }
 
-async function openLinkFacilitiesModal() {
+async function openLinkFacilitiesToGroupModal() {
   const popover = await modalController.create({
-    component: LinkFacilitiesModal
+    component: LinkFacilitiesToGroupModal
   });
 
   return popover.present();
 }
 
-async function openLinkThresholdFacilitesModal() {
+async function openLinkThresholdFacilitiesToGroupModal() {
   const popover = await modalController.create({
-    component: LinkThresholdFacilitiesModal
+    component: LinkThresholdFacilitiesToGroupModal
   });
 
   return popover.present();

From 372f452e21b357b96673e0a64702f5bc84fa7133 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 19 Mar 2024 11:02:03 +0530
Subject: [PATCH 016/250] Improved: css for the create shipping page (#238)

---
 src/views/CreateShipping.vue | 22 +++++++---------------
 1 file changed, 7 insertions(+), 15 deletions(-)

diff --git a/src/views/CreateShipping.vue b/src/views/CreateShipping.vue
index cf6c200d..122a23f6 100644
--- a/src/views/CreateShipping.vue
+++ b/src/views/CreateShipping.vue
@@ -107,22 +107,14 @@ const selectedSegment = ref("facility")
 </script>
 
 <style scoped>
-section {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
-  align-items: start;
+ion-card-header {
+  display: flex;
+  flex-direction: row ;
+  justify-content: space-between;
+  align-items: center;
 }
 
-.section-header {
-  padding: var(--spacer-xs) 10px 0px;
-}
-
-.rule-config {
-  grid-column: span 2;
-}
-
-.rule-inputs {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+ion-card-header > ion-checkbox {
+  flex-shrink: 0;
 }
 </style>
\ No newline at end of file

From 87e5e795677ce295c8a3fc7a924b82cf489aa01e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 19 Mar 2024 11:14:32 +0530
Subject: [PATCH 017/250] Improved: removed unwanted code from the pages (#238)

---
 src/theme/variables.css | 4 ----
 src/views/Threshold.vue | 1 -
 2 files changed, 5 deletions(-)

diff --git a/src/theme/variables.css b/src/theme/variables.css
index 9955f822..eaeddcce 100644
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@@ -390,8 +390,4 @@ ion-content>section {
   ion-header {
     display: flex;
   }
-
-  main>section {
-    max-width: 50ch;
-  }
 }
\ No newline at end of file
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 348eac25..5ee1d30d 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -37,5 +37,4 @@ const router = useRouter()
 function CreateThreshold() {
   router.replace({ path: '/create-threshold' })
 }
-
 </script>

From bf7d9fa3a69672f2584cac766825a43eca5d5b79 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 5 Apr 2024 15:51:13 +0530
Subject: [PATCH 018/250] Implemented: login flow for the app and removed
 unused code (#246)

---
 package-lock.json                           | 4148 ++++++++-----------
 package.json                                |    5 +-
 src/App.vue                                 |   42 +-
 src/adapter/index.ts                        |   13 -
 src/api/index.ts                            |  113 +
 src/authorization/Actions.ts                |    4 -
 src/authorization/Rules.ts                  |    8 -
 src/authorization/index.ts                  |  124 -
 src/components/ErrorMessageModal.vue        |   20 -
 src/components/JobConfiguration.vue         |  378 --
 src/components/JobHistoryModal.vue          |  131 -
 src/components/JobReorderModal.vue          |  193 -
 src/components/Menu.vue                     |   60 +-
 src/components/ProductFilterModal.vue       |  200 -
 src/components/ProductListItem.vue          |   49 -
 src/components/SafetyStockModal.vue         |  104 -
 src/main.ts                                 |   23 +-
 src/router/index.ts                         |  102 +-
 src/services/JobService.ts                  |   94 -
 src/services/ProductService.ts              |   60 -
 src/services/UserService.ts                 |  272 +-
 src/services/UtilService.ts                 |   42 -
 src/store/index.ts                          |   13 +-
 src/store/modules/job/JobState.ts           |   17 -
 src/store/modules/job/actions.ts            |  331 --
 src/store/modules/job/getters.ts            |   56 -
 src/store/modules/job/index.ts              |   35 -
 src/store/modules/job/mutation-types.ts     |    8 -
 src/store/modules/job/mutations.ts          |   52 -
 src/store/modules/product/ProductState.ts   |   25 -
 src/store/modules/product/actions.ts        |  157 -
 src/store/modules/product/getters.ts        |   28 -
 src/store/modules/product/index.ts          |   51 -
 src/store/modules/product/mutation-types.ts |    7 -
 src/store/modules/product/mutations.ts      |   27 -
 src/store/modules/user/UserState.ts         |    2 -
 src/store/modules/user/actions.ts           |  179 +-
 src/store/modules/user/getters.ts           |    8 +-
 src/store/modules/user/index.ts             |    7 +-
 src/store/modules/user/mutation-types.ts    |    4 +-
 src/store/modules/user/mutations.ts         |   11 +-
 src/store/modules/util/UtilState.ts         |    6 -
 src/store/modules/util/actions.ts           |  120 -
 src/store/modules/util/getters.ts           |   19 -
 src/store/modules/util/index.ts             |   21 -
 src/store/modules/util/mutation-types.ts    |    5 -
 src/store/modules/util/mutations.ts         |   21 -
 src/utils/index.ts                          |   60 +-
 src/views/Login.vue                         |   79 +
 src/views/ScheduleThreshold.vue             |  721 ----
 src/views/SelectFacility.vue                |  225 -
 src/views/SelectFacilityCSVUpload.vue       |  100 -
 src/views/SelectProduct.vue                 |  604 ---
 src/views/SelectProductCSVUpload.vue        |   93 -
 src/views/Settings.vue                      |   69 +-
 src/views/ThresholdUpdates.vue              |  688 ---
 src/views/TimezoneModal.vue                 |  183 +-
 57 files changed, 2147 insertions(+), 8070 deletions(-)
 delete mode 100644 src/adapter/index.ts
 create mode 100644 src/api/index.ts
 delete mode 100644 src/authorization/Actions.ts
 delete mode 100644 src/authorization/Rules.ts
 delete mode 100644 src/authorization/index.ts
 delete mode 100644 src/components/ErrorMessageModal.vue
 delete mode 100644 src/components/JobConfiguration.vue
 delete mode 100644 src/components/JobHistoryModal.vue
 delete mode 100644 src/components/JobReorderModal.vue
 delete mode 100644 src/components/ProductFilterModal.vue
 delete mode 100644 src/components/ProductListItem.vue
 delete mode 100644 src/components/SafetyStockModal.vue
 delete mode 100644 src/services/JobService.ts
 delete mode 100644 src/services/ProductService.ts
 delete mode 100644 src/services/UtilService.ts
 delete mode 100644 src/store/modules/job/JobState.ts
 delete mode 100644 src/store/modules/job/actions.ts
 delete mode 100644 src/store/modules/job/getters.ts
 delete mode 100644 src/store/modules/job/index.ts
 delete mode 100644 src/store/modules/job/mutation-types.ts
 delete mode 100644 src/store/modules/job/mutations.ts
 delete mode 100644 src/store/modules/product/ProductState.ts
 delete mode 100644 src/store/modules/product/actions.ts
 delete mode 100644 src/store/modules/product/getters.ts
 delete mode 100644 src/store/modules/product/index.ts
 delete mode 100644 src/store/modules/product/mutation-types.ts
 delete mode 100644 src/store/modules/product/mutations.ts
 delete mode 100644 src/store/modules/util/UtilState.ts
 delete mode 100644 src/store/modules/util/actions.ts
 delete mode 100644 src/store/modules/util/getters.ts
 delete mode 100644 src/store/modules/util/index.ts
 delete mode 100644 src/store/modules/util/mutation-types.ts
 delete mode 100644 src/store/modules/util/mutations.ts
 create mode 100644 src/views/Login.vue
 delete mode 100644 src/views/ScheduleThreshold.vue
 delete mode 100644 src/views/SelectFacility.vue
 delete mode 100644 src/views/SelectFacilityCSVUpload.vue
 delete mode 100644 src/views/SelectProduct.vue
 delete mode 100644 src/views/SelectProductCSVUpload.vue
 delete mode 100644 src/views/ThresholdUpdates.vue

diff --git a/package-lock.json b/package-lock.json
index 989aab09..d0f0d7a1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,14 +15,15 @@
         "@casl/vue": "^2.2.0",
         "@hotwax/app-version-info": "^1.0.0",
         "@hotwax/apps-theme": "^1.2.6",
-        "@hotwax/dxp-components": "1.12.1",
-        "@hotwax/oms-api": "^1.10.0",
         "@ionic/core": "6.7.5",
         "@ionic/vue": "6.7.5",
         "@ionic/vue-router": "6.7.5",
+        "axios": "^0.21.1",
+        "axios-cache-adapter": "^2.7.3",
         "boolean-parser": "0.0.2",
         "boon-js": "^2.0.3",
         "core-js": "^3.6.5",
+        "http-status-codes": "^2.1.4",
         "luxon": "^2.3.2",
         "mitt": "^2.1.0",
         "qs": "^6.11.0",
@@ -81,56 +82,56 @@
       }
     },
     "node_modules/@ampproject/remapping": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.1.tgz",
-      "integrity": "sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
+      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
       "dev": true,
       "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.0",
-        "@jridgewell/trace-mapping": "^0.3.9"
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
       },
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@babel/code-frame": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.23.5.tgz",
-      "integrity": "sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==",
+      "version": "7.24.2",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.24.2.tgz",
+      "integrity": "sha512-y5+tLQyV8pg3fsiln67BVLD1P13Eg4lh5RW9mF0zUuvLrv9uIQ4MCL+CRT+FTsBlBjcIan6PGsLcBN0m3ClUyQ==",
       "dev": true,
       "dependencies": {
-        "@babel/highlight": "^7.23.4",
-        "chalk": "^2.4.2"
+        "@babel/highlight": "^7.24.2",
+        "picocolors": "^1.0.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/compat-data": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.23.5.tgz",
-      "integrity": "sha512-uU27kfDRlhfKl+w1U6vp16IuvSLtjAxdArVXPa9BvLkrr7CYIsxH5adpHObeAGY/41+syctUWOZ140a2Rvkgjw==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.24.4.tgz",
+      "integrity": "sha512-vg8Gih2MLK+kOkHJp4gBEIkyaIi00jgWot2D9QOmmfLC8jINSOzmCLta6Bvz/JSBCqnegV0L80jhxkol5GWNfQ==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/core": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.23.5.tgz",
-      "integrity": "sha512-Cwc2XjUrG4ilcfOw4wBAK+enbdgwAcAJCfGUItPBKR7Mjw4aEfAFYrLxeRp4jWgtNIKn3n2AlBOfwwafl+42/g==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.24.4.tgz",
+      "integrity": "sha512-MBVlMXP+kkl5394RBLSxxk/iLTeVGuXTV3cIDXavPpMMqnSnt6apKgan/U8O3USWZCWZT/TbgfEpKa4uMgN4Dg==",
       "dev": true,
       "dependencies": {
         "@ampproject/remapping": "^2.2.0",
-        "@babel/code-frame": "^7.23.5",
-        "@babel/generator": "^7.23.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
+        "@babel/code-frame": "^7.24.2",
+        "@babel/generator": "^7.24.4",
+        "@babel/helper-compilation-targets": "^7.23.6",
         "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helpers": "^7.23.5",
-        "@babel/parser": "^7.23.5",
-        "@babel/template": "^7.22.15",
-        "@babel/traverse": "^7.23.5",
-        "@babel/types": "^7.23.5",
+        "@babel/helpers": "^7.24.4",
+        "@babel/parser": "^7.24.4",
+        "@babel/template": "^7.24.0",
+        "@babel/traverse": "^7.24.1",
+        "@babel/types": "^7.24.0",
         "convert-source-map": "^2.0.0",
         "debug": "^4.1.0",
         "gensync": "^1.0.0-beta.2",
@@ -155,14 +156,14 @@
       }
     },
     "node_modules/@babel/generator": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.5.tgz",
-      "integrity": "sha512-BPssCHrBD+0YrxviOa3QzpqwhNIXKEtOa2jQrm4FlmkC2apYgRnQcmPWiGZDlGxiNtltnUFolMe8497Esry+jA==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.24.4.tgz",
+      "integrity": "sha512-Xd6+v6SnjWVx/nus+y0l1sxMOTOMBkyL4+BIdbALyatQnAe/SRVjANeDPSCYaX+i1iJmuGSKf3Z+E+V/va1Hvw==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.23.5",
-        "@jridgewell/gen-mapping": "^0.3.2",
-        "@jridgewell/trace-mapping": "^0.3.17",
+        "@babel/types": "^7.24.0",
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.25",
         "jsesc": "^2.5.1"
       },
       "engines": {
@@ -194,14 +195,14 @@
       }
     },
     "node_modules/@babel/helper-compilation-targets": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.22.15.tgz",
-      "integrity": "sha512-y6EEzULok0Qvz8yyLkCvVX+02ic+By2UdOhylwUOvOn9dvYc9mKICJuuU1n1XBI02YWsNsnrY1kc6DVbjcXbtw==",
+      "version": "7.23.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.23.6.tgz",
+      "integrity": "sha512-9JB548GZoQVmzrFgp8o7KxdgkTGm6xs9DW0o/Pim72UDjzr5ObUQ6ZzYPqA+g9OTS2bBQoctLJrky0RDCAWRgQ==",
       "dev": true,
       "dependencies": {
-        "@babel/compat-data": "^7.22.9",
-        "@babel/helper-validator-option": "^7.22.15",
-        "browserslist": "^4.21.9",
+        "@babel/compat-data": "^7.23.5",
+        "@babel/helper-validator-option": "^7.23.5",
+        "browserslist": "^4.22.2",
         "lru-cache": "^5.1.1",
         "semver": "^6.3.1"
       },
@@ -219,9 +220,9 @@
       }
     },
     "node_modules/@babel/helper-create-class-features-plugin": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.23.5.tgz",
-      "integrity": "sha512-QELlRWxSpgdwdJzSJn4WAhKC+hvw/AtHbbrIoncKHkhKKR/luAlKkgBDcri1EzWAo8f8VvYVryEHN4tax/V67A==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.24.4.tgz",
+      "integrity": "sha512-lG75yeuUSVu0pIcbhiYMXBXANHrpUPaOfu7ryAzskCgKUHuAxRQI5ssrtmF0X9UXldPlvT0XM/A4F44OXRt6iQ==",
       "dev": true,
       "dependencies": {
         "@babel/helper-annotate-as-pure": "^7.22.5",
@@ -229,7 +230,7 @@
         "@babel/helper-function-name": "^7.23.0",
         "@babel/helper-member-expression-to-functions": "^7.23.0",
         "@babel/helper-optimise-call-expression": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20",
+        "@babel/helper-replace-supers": "^7.24.1",
         "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
         "@babel/helper-split-export-declaration": "^7.22.6",
         "semver": "^6.3.1"
@@ -277,9 +278,9 @@
       }
     },
     "node_modules/@babel/helper-define-polyfill-provider": {
-      "version": "0.4.3",
-      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.4.3.tgz",
-      "integrity": "sha512-WBrLmuPP47n7PNwsZ57pqam6G/RGo1vw/87b0Blc53tZNGZ4x7YvZ6HgQe2vo1W/FR20OgjeZuGXzudPiXHFug==",
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-define-polyfill-provider/-/helper-define-polyfill-provider-0.6.1.tgz",
+      "integrity": "sha512-o7SDgTJuvx5vLKD6SFvkydkSMBvahDKGiNJzG22IZYXhiqoe9efY7zocICBgzHV4IRg5wdgl2nEL/tulKIEIbA==",
       "dev": true,
       "dependencies": {
         "@babel/helper-compilation-targets": "^7.22.6",
@@ -339,12 +340,12 @@
       }
     },
     "node_modules/@babel/helper-module-imports": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz",
-      "integrity": "sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==",
+      "version": "7.24.3",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.24.3.tgz",
+      "integrity": "sha512-viKb0F9f2s0BCS22QSF308z/+1YWKV/76mwt61NBzS5izMzDPwdq1pTrzf+Li3npBWX9KdQbkeCt1jSAM7lZqg==",
       "dev": true,
       "dependencies": {
-        "@babel/types": "^7.22.15"
+        "@babel/types": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -382,9 +383,9 @@
       }
     },
     "node_modules/@babel/helper-plugin-utils": {
-      "version": "7.22.5",
-      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz",
-      "integrity": "sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.24.0.tgz",
+      "integrity": "sha512-9cUznXMG0+FxRuJfvL82QlTqIzhVW9sL0KjMPHhAOOvpQGL8QtdxnBKILjBqxlHyliz0yCa1G903ZXI/FuHy2w==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
@@ -408,13 +409,13 @@
       }
     },
     "node_modules/@babel/helper-replace-supers": {
-      "version": "7.22.20",
-      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.22.20.tgz",
-      "integrity": "sha512-qsW0In3dbwQUbK8kejJ4R7IHVGwHJlV6lpG6UA7a9hSa2YEiAib+N1T2kr6PEeUT+Fl7najmSOS6SmAwCHK6Tw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-replace-supers/-/helper-replace-supers-7.24.1.tgz",
+      "integrity": "sha512-QCR1UqC9BzG5vZl8BMicmZ28RuUBnHhAMddD8yHFHDRH9lLTZ9uUPehX8ctVPT8l0TKblJidqcgUUKGVrePleQ==",
       "dev": true,
       "dependencies": {
         "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-member-expression-to-functions": "^7.22.15",
+        "@babel/helper-member-expression-to-functions": "^7.23.0",
         "@babel/helper-optimise-call-expression": "^7.22.5"
       },
       "engines": {
@@ -461,9 +462,9 @@
       }
     },
     "node_modules/@babel/helper-string-parser": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.23.4.tgz",
-      "integrity": "sha512-803gmbQdqwdf4olxrX4AJyFBV/RTr3rSmOj0rKwesmzlfhYNDEs+/iOcznzpNWlJlIlTJC2QfPFcHB6DlzdVLQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.24.1.tgz",
+      "integrity": "sha512-2ofRCjnnA9y+wk8b9IAREroeUP02KHp431N2mhKniy2yKIDKpbrHv9eXwm8cBeWQYcJmzv5qKCu65P47eCF7CQ==",
       "dev": true,
       "engines": {
         "node": ">=6.9.0"
@@ -502,37 +503,38 @@
       }
     },
     "node_modules/@babel/helpers": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.23.5.tgz",
-      "integrity": "sha512-oO7us8FzTEsG3U6ag9MfdF1iA/7Z6dz+MtFhifZk8C8o453rGJFFWUP1t+ULM9TUIAzC9uxXEiXjOiVMyd7QPg==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.24.4.tgz",
+      "integrity": "sha512-FewdlZbSiwaVGlgT1DPANDuCHaDMiOo+D/IDYRFYjHOuv66xMSJ7fQwwODwRNAPkADIO/z1EoF/l2BCWlWABDw==",
       "dev": true,
       "dependencies": {
-        "@babel/template": "^7.22.15",
-        "@babel/traverse": "^7.23.5",
-        "@babel/types": "^7.23.5"
+        "@babel/template": "^7.24.0",
+        "@babel/traverse": "^7.24.1",
+        "@babel/types": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/highlight": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.23.4.tgz",
-      "integrity": "sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==",
+      "version": "7.24.2",
+      "resolved": "https://registry.npmjs.org/@babel/highlight/-/highlight-7.24.2.tgz",
+      "integrity": "sha512-Yac1ao4flkTxTteCDZLEvdxg2fZfz1v8M4QpaGypq/WPDqg3ijHYbDfs+LG5hvzSoqaSZ9/Z9lKSP3CjZjv+pA==",
       "dev": true,
       "dependencies": {
         "@babel/helper-validator-identifier": "^7.22.20",
         "chalk": "^2.4.2",
-        "js-tokens": "^4.0.0"
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.0.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.5.tgz",
-      "integrity": "sha512-hOOqoiNXrmGdFbhgCzu6GiURxUgM27Xwd/aPuu8RfHEZPBzL1Z54okAHAQjXfcQNwvrlkAmAp4SlRTZ45vlthQ==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.24.4.tgz",
+      "integrity": "sha512-zTvEBcghmeBma9QIGunWevvBAp4/Qu9Bdq+2k0Ot4fVMD6v3dsC9WOcRSKk7tRRyBM/53yKMJko9xOatGQAwSg==",
       "bin": {
         "parser": "bin/babel-parser.js"
       },
@@ -540,13 +542,29 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@babel/plugin-bugfix-firefox-class-in-computed-class-key": {
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-firefox-class-in-computed-class-key/-/plugin-bugfix-firefox-class-in-computed-class-key-7.24.4.tgz",
+      "integrity": "sha512-qpl6vOOEEzTLLcsuqYYo8yDtrTocmu2xkGvgNebvPjT9DTtfFYGmgDqY+rBYXNlqL4s9qLDn6xkrJv4RxAPiTA==",
+      "dev": true,
+      "dependencies": {
+        "@babel/helper-environment-visitor": "^7.22.20",
+        "@babel/helper-plugin-utils": "^7.24.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
     "node_modules/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.23.3.tgz",
-      "integrity": "sha512-iRkKcCqb7iGnq9+3G6rZ+Ciz5VywC4XNRHe57lKM+jOeYAoR0lVqdeeDRfh0tQcTfw/+vBhHn926FmQhLtlFLQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression/-/plugin-bugfix-safari-id-destructuring-collision-in-function-expression-7.24.1.tgz",
+      "integrity": "sha512-y4HqEnkelJIOQGd+3g1bTeKsA5c6qM7eOn7VggGVbBc0y8MLSKHacwcIE2PplNlQSj0PqS9rrXL/nkPVK+kUNg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -556,14 +574,14 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.23.3.tgz",
-      "integrity": "sha512-WwlxbfMNdVEpQjZmK5mhm7oSwD3dS6eU+Iwsi4Knl9wAletWem7kaRsGOG+8UEbRyqxY4SS5zvtfXwX+jMxUwQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining/-/plugin-bugfix-v8-spread-parameters-in-optional-chaining-7.24.1.tgz",
+      "integrity": "sha512-Hj791Ii4ci8HqnaKHAlLNs+zaLXb0EzSDhiAWp5VNlyvCNymYfacs64pxTxbH1znW/NcArSmwpmG9IKE/TUVVQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
-        "@babel/plugin-transform-optional-chaining": "^7.23.3"
+        "@babel/plugin-transform-optional-chaining": "^7.24.1"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -573,13 +591,13 @@
       }
     },
     "node_modules/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.23.3.tgz",
-      "integrity": "sha512-XaJak1qcityzrX0/IU5nKHb34VaibwP3saKqG6a/tppelgllOH13LUann4ZCIBcVOeE6H18K4Vx9QKkVww3z/w==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly/-/plugin-bugfix-v8-static-class-fields-redefine-readonly-7.24.1.tgz",
+      "integrity": "sha512-m9m/fXsXLiHfwdgydIFnpk+7jlVbnvlK5B2EKiPdLUb6WX654ZaaEWJUjk8TftRbZpK0XibovlLWX4KIZhV6jw==",
       "dev": true,
       "dependencies": {
         "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -606,16 +624,14 @@
       }
     },
     "node_modules/@babel/plugin-proposal-decorators": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.23.5.tgz",
-      "integrity": "sha512-6IsY8jOeWibsengGlWIezp7cuZEFzNlAghFpzh9wiZwhQ42/hRcPnY/QV9HJoKTlujupinSlnQPiEy/u2C1ZfQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-proposal-decorators/-/plugin-proposal-decorators-7.24.1.tgz",
+      "integrity": "sha512-zPEvzFijn+hRvJuX2Vu3KbEBN39LN3f7tW3MQO2LsIs57B26KU+kUc82BdAktS1VCM6libzh45eKGI65lg0cpA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.23.5",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20",
-        "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/plugin-syntax-decorators": "^7.23.3"
+        "@babel/helper-create-class-features-plugin": "^7.24.1",
+        "@babel/helper-plugin-utils": "^7.24.0",
+        "@babel/plugin-syntax-decorators": "^7.24.1"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -676,12 +692,12 @@
       }
     },
     "node_modules/@babel/plugin-syntax-decorators": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.23.3.tgz",
-      "integrity": "sha512-cf7Niq4/+/juY67E0PbgH0TDhLQ5J7zS8C/Q5FFx+DWyrRa9sUQdTXkjqKu8zGvuqr7vw1muKiukseihU+PJDA==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-decorators/-/plugin-syntax-decorators-7.24.1.tgz",
+      "integrity": "sha512-05RJdO/cCrtVWuAaSn1tS3bH8jbsJa/Y1uD186u6J4C/1mnHFxseeuWpsqr9anvo7TUulev7tm7GDwRV+VuhDw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -715,12 +731,12 @@
       }
     },
     "node_modules/@babel/plugin-syntax-import-assertions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.23.3.tgz",
-      "integrity": "sha512-lPgDSU+SJLK3xmFDTV2ZRQAiM7UuUjGidwBywFavObCiZc1BeAAcMtHJKUya92hPHO+at63JJPLygilZard8jw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-assertions/-/plugin-syntax-import-assertions-7.24.1.tgz",
+      "integrity": "sha512-IuwnI5XnuF189t91XbxmXeCDz3qs6iDRO7GJ++wcfgeXNs/8FmIlKcpDSXNVyuLQxlwvskmI3Ct73wUODkJBlQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -730,12 +746,12 @@
       }
     },
     "node_modules/@babel/plugin-syntax-import-attributes": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.23.3.tgz",
-      "integrity": "sha512-pawnE0P9g10xgoP7yKr6CK63K2FMsTE+FZidZO/1PwRdzmAPVs+HS1mAURUsgaoxammTJvULUdIkEK0gOcU2tA==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-import-attributes/-/plugin-syntax-import-attributes-7.24.1.tgz",
+      "integrity": "sha512-zhQTMH0X2nVLnb04tz+s7AMuasX8U0FnpE+nHTOhSOINjWMnopoZTxtIKsd45n4GQ/HIZLyfIpoul8e2m0DnRA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -769,12 +785,12 @@
       }
     },
     "node_modules/@babel/plugin-syntax-jsx": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.23.3.tgz",
-      "integrity": "sha512-EB2MELswq55OHUoRZLGg/zC7QWUKfNLpE57m/S2yr1uEneIgsTgrSzXP3NXEsMkVn76OlaVVnzN+ugObuYGwhg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.24.1.tgz",
+      "integrity": "sha512-2eCtxZXf+kbkMIsXS4poTvT4Yu5rXiRa+9xGVT56raghjmBTKMpFNc9R4IDiB4emao9eO22Ox7CxuJG7BgExqA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -902,12 +918,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-arrow-functions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.23.3.tgz",
-      "integrity": "sha512-NzQcQrzaQPkaEwoTm4Mhyl8jI1huEL/WWIEvudjTCMJ9aBZNpsJbMASx7EQECtQQPS/DcnFpo0FIh3LvEO9cxQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-arrow-functions/-/plugin-transform-arrow-functions-7.24.1.tgz",
+      "integrity": "sha512-ngT/3NkRhsaep9ck9uj2Xhv9+xB1zShY3tM3g6om4xxCELwCDN4g4Aq5dRn48+0hasAql7s2hdBOysCfNpr4fw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -917,13 +933,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-async-generator-functions": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.23.4.tgz",
-      "integrity": "sha512-efdkfPhHYTtn0G6n2ddrESE91fgXxjlqLsnUtPWnJs4a4mZIbUaK7ffqKIIUKXSHwcDvaCVX6GXkaJJFqtX7jw==",
+      "version": "7.24.3",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-generator-functions/-/plugin-transform-async-generator-functions-7.24.3.tgz",
+      "integrity": "sha512-Qe26CMYVjpQxJ8zxM1340JFNjZaF+ISWpr1Kt/jGo+ZTUzKkfw/pphEWbRCb+lmSM6k/TOgfYLvmbHkUQ0asIg==",
       "dev": true,
       "dependencies": {
         "@babel/helper-environment-visitor": "^7.22.20",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-remap-async-to-generator": "^7.22.20",
         "@babel/plugin-syntax-async-generators": "^7.8.4"
       },
@@ -935,13 +951,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-async-to-generator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.23.3.tgz",
-      "integrity": "sha512-A7LFsKi4U4fomjqXJlZg/u0ft/n8/7n7lpffUP/ZULx/DtV9SGlNKZolHH6PE8Xl1ngCc0M11OaeZptXVkfKSw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-async-to-generator/-/plugin-transform-async-to-generator-7.24.1.tgz",
+      "integrity": "sha512-AawPptitRXp1y0n4ilKcGbRYWfbbzFWz2NqNu7dacYDtFtz0CMjG64b3LQsb3KIgnf4/obcUL78hfaOS7iCUfw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-imports": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-module-imports": "^7.24.1",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-remap-async-to-generator": "^7.22.20"
       },
       "engines": {
@@ -952,12 +968,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-block-scoped-functions": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.23.3.tgz",
-      "integrity": "sha512-vI+0sIaPIO6CNuM9Kk5VmXcMVRiOpDh7w2zZt9GXzmE/9KD70CUEVhvPR/etAeNK/FAEkhxQtXOzVF3EuRL41A==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.24.1.tgz",
+      "integrity": "sha512-TWWC18OShZutrv9C6mye1xwtam+uNi2bnTOCBUd5sZxyHOiWbU6ztSROofIMrK84uweEZC219POICK/sTYwfgg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -967,12 +983,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-block-scoping": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.23.4.tgz",
-      "integrity": "sha512-0QqbP6B6HOh7/8iNR4CQU2Th/bbRtBp4KS9vcaZd1fZ0wSh5Fyssg0UCIHwxh+ka+pNDREbVLQnHCMHKZfPwfw==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoping/-/plugin-transform-block-scoping-7.24.4.tgz",
+      "integrity": "sha512-nIFUZIpGKDf9O9ttyRXpHFpKC+X3Y5mtshZONuEUYBomAKoM4y029Jr+uB1bHGPhNmK8YXHevDtKDOLmtRrp6g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -982,13 +998,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-class-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.23.3.tgz",
-      "integrity": "sha512-uM+AN8yCIjDPccsKGlw271xjJtGii+xQIF/uMPS8H15L12jZTsLfF4o5vNO7d/oUguOyfdikHGc/yi9ge4SGIg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-properties/-/plugin-transform-class-properties-7.24.1.tgz",
+      "integrity": "sha512-OMLCXi0NqvJfORTaPQBwqLXHhb93wkBKZ4aNwMl6WtehO7ar+cmp+89iPEQPqxAnxsOKTaMcs3POz3rKayJ72g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-class-features-plugin": "^7.24.1",
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -998,13 +1014,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-class-static-block": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.23.4.tgz",
-      "integrity": "sha512-nsWu/1M+ggti1SOALj3hfx5FXzAY06fwPJsUZD4/A5e1bWi46VUIWtD+kOX6/IdhXGsXBWllLFDSnqSCdUNydQ==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-class-static-block/-/plugin-transform-class-static-block-7.24.4.tgz",
+      "integrity": "sha512-B8q7Pz870Hz/q9UgP8InNpY01CSLDSCyqX7zcRuv3FcPl87A2G17lASroHWaCtbdIcbYzOZ7kWmXFKbijMSmFg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-create-class-features-plugin": "^7.24.4",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-class-static-block": "^7.14.5"
       },
       "engines": {
@@ -1015,18 +1031,17 @@
       }
     },
     "node_modules/@babel/plugin-transform-classes": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.23.5.tgz",
-      "integrity": "sha512-jvOTR4nicqYC9yzOHIhXG5emiFEOpappSJAl73SDSEDcybD+Puuze8Tnpb9p9qEyYup24tq891gkaygIFvWDqg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-classes/-/plugin-transform-classes-7.24.1.tgz",
+      "integrity": "sha512-ZTIe3W7UejJd3/3R4p7ScyyOoafetUShSf4kCqV0O7F/RiHxVj/wRaRnQlrGwflvcehNA8M42HkAiEDYZu2F1Q==",
       "dev": true,
       "dependencies": {
         "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
+        "@babel/helper-compilation-targets": "^7.23.6",
         "@babel/helper-environment-visitor": "^7.22.20",
         "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-optimise-call-expression": "^7.22.5",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20",
+        "@babel/helper-plugin-utils": "^7.24.0",
+        "@babel/helper-replace-supers": "^7.24.1",
         "@babel/helper-split-export-declaration": "^7.22.6",
         "globals": "^11.1.0"
       },
@@ -1038,13 +1053,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-computed-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.23.3.tgz",
-      "integrity": "sha512-dTj83UVTLw/+nbiHqQSFdwO9CbTtwq1DsDqm3CUEtDrZNET5rT5E6bIdTlOftDTDLMYxvxHNEYO4B9SLl8SLZw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-computed-properties/-/plugin-transform-computed-properties-7.24.1.tgz",
+      "integrity": "sha512-5pJGVIUfJpOS+pAqBQd+QMaTD2vCL/HcePooON6pDpHgRp4gNRmzyHTPIkXntwKsq3ayUFVfJaIKPw2pOkOcTw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/template": "^7.22.15"
+        "@babel/helper-plugin-utils": "^7.24.0",
+        "@babel/template": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1054,12 +1069,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-destructuring": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.23.3.tgz",
-      "integrity": "sha512-n225npDqjDIr967cMScVKHXJs7rout1q+tt50inyBCPkyZ8KxeI6d+GIbSBTT/w/9WdlWDOej3V9HE5Lgk57gw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.24.1.tgz",
+      "integrity": "sha512-ow8jciWqNxR3RYbSNVuF4U2Jx130nwnBnhRw6N6h1bOejNkABmcI5X5oz29K4alWX7vf1C+o6gtKXikzRKkVdw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1069,13 +1084,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-dotall-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.23.3.tgz",
-      "integrity": "sha512-vgnFYDHAKzFaTVp+mneDsIEbnJ2Np/9ng9iviHw3P/KVcgONxpNULEW/51Z/BaFojG2GI2GwwXck5uV1+1NOYQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dotall-regex/-/plugin-transform-dotall-regex-7.24.1.tgz",
+      "integrity": "sha512-p7uUxgSoZwZ2lPNMzUkqCts3xlp8n+o05ikjy7gbtFJSt9gdU88jAmtfmOxHM14noQXBxfgzf2yRWECiNVhTCw==",
       "dev": true,
       "dependencies": {
         "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1085,12 +1100,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-duplicate-keys": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.23.3.tgz",
-      "integrity": "sha512-RrqQ+BQmU3Oyav3J+7/myfvRCq7Tbz+kKLLshUmMwNlDHExbGL7ARhajvoBJEvc+fCguPPu887N+3RRXBVKZUA==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-duplicate-keys/-/plugin-transform-duplicate-keys-7.24.1.tgz",
+      "integrity": "sha512-msyzuUnvsjsaSaocV6L7ErfNsa5nDWL1XKNnDePLgmz+WdU4w/J8+AxBMrWfi9m4IxfL5sZQKUPQKDQeeAT6lA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1100,12 +1115,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-dynamic-import": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.23.4.tgz",
-      "integrity": "sha512-V6jIbLhdJK86MaLh4Jpghi8ho5fGzt3imHOBu/x0jlBaPYqDoWz4RDXjmMOfnh+JWNaQleEAByZLV0QzBT4YQQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-dynamic-import/-/plugin-transform-dynamic-import-7.24.1.tgz",
+      "integrity": "sha512-av2gdSTyXcJVdI+8aFZsCAtR29xJt0S5tas+Ef8NvBNmD1a+N/3ecMLeMBgfcK+xzsjdLDT6oHt+DFPyeqUbDA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-dynamic-import": "^7.8.3"
       },
       "engines": {
@@ -1116,13 +1131,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-exponentiation-operator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.23.3.tgz",
-      "integrity": "sha512-5fhCsl1odX96u7ILKHBj4/Y8vipoqwsJMh4csSA8qFfxrZDEA4Ssku2DyNvMJSmZNOEBT750LfFPbtrnTP90BQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-exponentiation-operator/-/plugin-transform-exponentiation-operator-7.24.1.tgz",
+      "integrity": "sha512-U1yX13dVBSwS23DEAqU+Z/PkwE9/m7QQy8Y9/+Tdb8UWYaGNDYwTLi19wqIAiROr8sXVum9A/rtiH5H0boUcTw==",
       "dev": true,
       "dependencies": {
         "@babel/helper-builder-binary-assignment-operator-visitor": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1132,12 +1147,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-export-namespace-from": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.23.4.tgz",
-      "integrity": "sha512-GzuSBcKkx62dGzZI1WVgTWvkkz84FZO5TC5T8dl/Tht/rAla6Dg/Mz9Yhypg+ezVACf/rgDuQt3kbWEv7LdUDQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-export-namespace-from/-/plugin-transform-export-namespace-from-7.24.1.tgz",
+      "integrity": "sha512-Ft38m/KFOyzKw2UaJFkWG9QnHPG/Q/2SkOrRk4pNBPg5IPZ+dOxcmkK5IyuBcxiNPyyYowPGUReyBvrvZs7IlQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-export-namespace-from": "^7.8.3"
       },
       "engines": {
@@ -1148,12 +1163,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-for-of": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.23.3.tgz",
-      "integrity": "sha512-X8jSm8X1CMwxmK878qsUGJRmbysKNbdpTv/O1/v0LuY/ZkZrng5WYiekYSdg9m09OTmDDUWeEDsTE+17WYbAZw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-for-of/-/plugin-transform-for-of-7.24.1.tgz",
+      "integrity": "sha512-OxBdcnF04bpdQdR3i4giHZNZQn7cm8RQKcSwA17wAAqEELo1ZOwp5FFgeptWUQXFyT9kwHo10aqqauYkRZPCAg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0",
+        "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1163,14 +1179,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-function-name": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.23.3.tgz",
-      "integrity": "sha512-I1QXp1LxIvt8yLaib49dRW5Okt7Q4oaxao6tFVKS/anCdEOMtYwWVKoiOA1p34GOWIZjUK0E+zCp7+l1pfQyiw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-function-name/-/plugin-transform-function-name-7.24.1.tgz",
+      "integrity": "sha512-BXmDZpPlh7jwicKArQASrj8n22/w6iymRnvHYYd2zO30DbE277JO20/7yXJT3QxDPtiQiOxQBbZH4TpivNXIxA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-compilation-targets": "^7.22.15",
+        "@babel/helper-compilation-targets": "^7.23.6",
         "@babel/helper-function-name": "^7.23.0",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1180,12 +1196,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-json-strings": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.23.4.tgz",
-      "integrity": "sha512-81nTOqM1dMwZ/aRXQ59zVubN9wHGqk6UtqRK+/q+ciXmRy8fSolhGVvG09HHRGo4l6fr/c4ZhXUQH0uFW7PZbg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-json-strings/-/plugin-transform-json-strings-7.24.1.tgz",
+      "integrity": "sha512-U7RMFmRvoasscrIFy5xA4gIp8iWnWubnKkKuUGJjsuOH7GfbMkB+XZzeslx2kLdEGdOJDamEmCqOks6e8nv8DQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-json-strings": "^7.8.3"
       },
       "engines": {
@@ -1196,12 +1212,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.23.3.tgz",
-      "integrity": "sha512-wZ0PIXRxnwZvl9AYpqNUxpZ5BiTGrYt7kueGQ+N5FiQ7RCOD4cm8iShd6S6ggfVIWaJf2EMk8eRzAh52RfP4rQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-literals/-/plugin-transform-literals-7.24.1.tgz",
+      "integrity": "sha512-zn9pwz8U7nCqOYIiBaOxoQOtYmMODXTJnkxG4AtX8fPmnCRYWBOHD0qcpwS9e2VDSp1zNJYpdnFMIKb8jmwu6g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1211,12 +1227,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-logical-assignment-operators": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.23.4.tgz",
-      "integrity": "sha512-Mc/ALf1rmZTP4JKKEhUwiORU+vcfarFVLfcFiolKUo6sewoxSEgl36ak5t+4WamRsNr6nzjZXQjM35WsU+9vbg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-logical-assignment-operators/-/plugin-transform-logical-assignment-operators-7.24.1.tgz",
+      "integrity": "sha512-OhN6J4Bpz+hIBqItTeWJujDOfNP+unqv/NJgyhlpSqgBTPm37KkMmZV6SYcOj+pnDbdcl1qRGV/ZiIjX9Iy34w==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-logical-assignment-operators": "^7.10.4"
       },
       "engines": {
@@ -1227,12 +1243,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-member-expression-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.23.3.tgz",
-      "integrity": "sha512-sC3LdDBDi5x96LA+Ytekz2ZPk8i/Ck+DEuDbRAll5rknJ5XRTSaPKEYwomLcs1AA8wg9b3KjIQRsnApj+q51Ag==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-member-expression-literals/-/plugin-transform-member-expression-literals-7.24.1.tgz",
+      "integrity": "sha512-4ojai0KysTWXzHseJKa1XPNXKRbuUrhkOPY4rEGeR+7ChlJVKxFa3H3Bz+7tWaGKgJAXUWKOGmltN+u9B3+CVg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1242,13 +1258,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-amd": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.23.3.tgz",
-      "integrity": "sha512-vJYQGxeKM4t8hYCKVBlZX/gtIY2I7mRGFNcm85sgXGMTBcoV3QdVtdpbcWEbzbfUIUZKwvgFT82mRvaQIebZzw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-amd/-/plugin-transform-modules-amd-7.24.1.tgz",
+      "integrity": "sha512-lAxNHi4HVtjnHd5Rxg3D5t99Xm6H7b04hUS7EHIXcUl2EV4yl1gWdqZrNzXnSrHveL9qMdbODlLF55mvgjAfaQ==",
       "dev": true,
       "dependencies": {
         "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1258,13 +1274,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-commonjs": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.23.3.tgz",
-      "integrity": "sha512-aVS0F65LKsdNOtcz6FRCpE4OgsP2OFnW46qNxNIX9h3wuzaNcSQsJysuMwqSibC98HPrf2vCgtxKNwS0DAlgcA==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.24.1.tgz",
+      "integrity": "sha512-szog8fFTUxBfw0b98gEWPaEqF42ZUD/T3bkynW/wtgx2p/XCP55WEsb+VosKceRSd6njipdZvNogqdtI4Q0chw==",
       "dev": true,
       "dependencies": {
         "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-simple-access": "^7.22.5"
       },
       "engines": {
@@ -1275,14 +1291,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-systemjs": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.23.3.tgz",
-      "integrity": "sha512-ZxyKGTkF9xT9YJuKQRo19ewf3pXpopuYQd8cDXqNzc3mUNbOME0RKMoZxviQk74hwzfQsEe66dE92MaZbdHKNQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-systemjs/-/plugin-transform-modules-systemjs-7.24.1.tgz",
+      "integrity": "sha512-mqQ3Zh9vFO1Tpmlt8QPnbwGHzNz3lpNEMxQb1kAemn/erstyqw1r9KeOlOfo3y6xAnFEcOv2tSyrXfmMk+/YZA==",
       "dev": true,
       "dependencies": {
         "@babel/helper-hoist-variables": "^7.22.5",
         "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-validator-identifier": "^7.22.20"
       },
       "engines": {
@@ -1293,13 +1309,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-modules-umd": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.23.3.tgz",
-      "integrity": "sha512-zHsy9iXX2nIsCBFPud3jKn1IRPWg3Ing1qOZgeKV39m1ZgIdpJqvlWVeiHBZC6ITRG0MfskhYe9cLgntfSFPIg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-modules-umd/-/plugin-transform-modules-umd-7.24.1.tgz",
+      "integrity": "sha512-tuA3lpPj+5ITfcCluy6nWonSL7RvaG0AOTeAuvXqEKS34lnLzXpDb0dcP6K8jD0zWZFNDVly90AGFJPnm4fOYg==",
       "dev": true,
       "dependencies": {
         "@babel/helper-module-transforms": "^7.23.3",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1325,12 +1341,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-new-target": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.23.3.tgz",
-      "integrity": "sha512-YJ3xKqtJMAT5/TIZnpAR3I+K+WaDowYbN3xyxI8zxx/Gsypwf9B9h0VB+1Nh6ACAAPRS5NSRje0uVv5i79HYGQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-new-target/-/plugin-transform-new-target-7.24.1.tgz",
+      "integrity": "sha512-/rurytBM34hYy0HKZQyA0nHbQgQNFm4Q/BOc9Hflxi2X3twRof7NaE5W46j4kQitm7SvACVRXsa6N/tSZxvPug==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1340,12 +1356,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-nullish-coalescing-operator": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.23.4.tgz",
-      "integrity": "sha512-jHE9EVVqHKAQx+VePv5LLGHjmHSJR76vawFPTdlxR/LVJPfOEGxREQwQfjuZEOPTwG92X3LINSh3M40Rv4zpVA==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-nullish-coalescing-operator/-/plugin-transform-nullish-coalescing-operator-7.24.1.tgz",
+      "integrity": "sha512-iQ+caew8wRrhCikO5DrUYx0mrmdhkaELgFa+7baMcVuhxIkN7oxt06CZ51D65ugIb1UWRQ8oQe+HXAVM6qHFjw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-nullish-coalescing-operator": "^7.8.3"
       },
       "engines": {
@@ -1356,12 +1372,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-numeric-separator": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.23.4.tgz",
-      "integrity": "sha512-mps6auzgwjRrwKEZA05cOwuDc9FAzoyFS4ZsG/8F43bTLf/TgkJg7QXOrPO1JO599iA3qgK9MXdMGOEC8O1h6Q==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-numeric-separator/-/plugin-transform-numeric-separator-7.24.1.tgz",
+      "integrity": "sha512-7GAsGlK4cNL2OExJH1DzmDeKnRv/LXq0eLUSvudrehVA5Rgg4bIrqEUW29FbKMBRT0ztSqisv7kjP+XIC4ZMNw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-numeric-separator": "^7.10.4"
       },
       "engines": {
@@ -1372,16 +1388,15 @@
       }
     },
     "node_modules/@babel/plugin-transform-object-rest-spread": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.23.4.tgz",
-      "integrity": "sha512-9x9K1YyeQVw0iOXJlIzwm8ltobIIv7j2iLyP2jIhEbqPRQ7ScNgwQufU2I0Gq11VjyG4gI4yMXt2VFags+1N3g==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-rest-spread/-/plugin-transform-object-rest-spread-7.24.1.tgz",
+      "integrity": "sha512-XjD5f0YqOtebto4HGISLNfiNMTTs6tbkFf2TOqJlYKYmbo+mN9Dnpl4SRoofiziuOWMIyq3sZEUqLo3hLITFEA==",
       "dev": true,
       "dependencies": {
-        "@babel/compat-data": "^7.23.3",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-compilation-targets": "^7.23.6",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-object-rest-spread": "^7.8.3",
-        "@babel/plugin-transform-parameters": "^7.23.3"
+        "@babel/plugin-transform-parameters": "^7.24.1"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1391,13 +1406,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-object-super": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.23.3.tgz",
-      "integrity": "sha512-BwQ8q0x2JG+3lxCVFohg+KbQM7plfpBwThdW9A6TMtWwLsbDA01Ek2Zb/AgDN39BiZsExm4qrXxjk+P1/fzGrA==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-object-super/-/plugin-transform-object-super-7.24.1.tgz",
+      "integrity": "sha512-oKJqR3TeI5hSLRxudMjFQ9re9fBVUU0GICqM3J1mi8MqlhVr6hC/ZN4ttAyMuQR6EZZIY6h/exe5swqGNNIkWQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "@babel/helper-replace-supers": "^7.22.20"
+        "@babel/helper-plugin-utils": "^7.24.0",
+        "@babel/helper-replace-supers": "^7.24.1"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1407,12 +1422,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-optional-catch-binding": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.23.4.tgz",
-      "integrity": "sha512-XIq8t0rJPHf6Wvmbn9nFxU6ao4c7WhghTR5WyV8SrJfUFzyxhCm4nhC+iAp3HFhbAKLfYpgzhJ6t4XCtVwqO5A==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-catch-binding/-/plugin-transform-optional-catch-binding-7.24.1.tgz",
+      "integrity": "sha512-oBTH7oURV4Y+3EUrf6cWn1OHio3qG/PVwO5J03iSJmBg6m2EhKjkAu/xuaXaYwWW9miYtvbWv4LNf0AmR43LUA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-optional-catch-binding": "^7.8.3"
       },
       "engines": {
@@ -1423,12 +1438,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-optional-chaining": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.23.4.tgz",
-      "integrity": "sha512-ZU8y5zWOfjM5vZ+asjgAPwDaBjJzgufjES89Rs4Lpq63O300R/kOz30WCLo6BxxX6QVEilwSlpClnG5cZaikTA==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-optional-chaining/-/plugin-transform-optional-chaining-7.24.1.tgz",
+      "integrity": "sha512-n03wmDt+987qXwAgcBlnUUivrZBPZ8z1plL0YvgQalLm+ZE5BMhGm94jhxXtA1wzv1Cu2aaOv1BM9vbVttrzSg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5",
         "@babel/plugin-syntax-optional-chaining": "^7.8.3"
       },
@@ -1440,12 +1455,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-parameters": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.23.3.tgz",
-      "integrity": "sha512-09lMt6UsUb3/34BbECKVbVwrT9bO6lILWln237z7sLaWnMsTi7Yc9fhX5DLpkJzAGfaReXI22wP41SZmnAA3Vw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-parameters/-/plugin-transform-parameters-7.24.1.tgz",
+      "integrity": "sha512-8Jl6V24g+Uw5OGPeWNKrKqXPDw2YDjLc53ojwfMcKwlEoETKU9rU0mHUtcg9JntWI/QYzGAXNWEcVHZ+fR+XXg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1455,13 +1470,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-private-methods": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.23.3.tgz",
-      "integrity": "sha512-UzqRcRtWsDMTLrRWFvUBDwmw06tCQH9Rl1uAjfh6ijMSmGYQ+fpdB+cnqRC8EMh5tuuxSv0/TejGL+7vyj+50g==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-methods/-/plugin-transform-private-methods-7.24.1.tgz",
+      "integrity": "sha512-tGvisebwBO5em4PaYNqt4fkw56K2VALsAbAakY0FjTYqJp7gfdrgr7YX76Or8/cpik0W6+tj3rZ0uHU9Oil4tw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-create-class-features-plugin": "^7.24.1",
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1471,14 +1486,14 @@
       }
     },
     "node_modules/@babel/plugin-transform-private-property-in-object": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.23.4.tgz",
-      "integrity": "sha512-9G3K1YqTq3F4Vt88Djx1UZ79PDyj+yKRnUy7cZGSMe+a7jkwD259uKKuUzQlPkGam7R+8RJwh5z4xO27fA1o2A==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-private-property-in-object/-/plugin-transform-private-property-in-object-7.24.1.tgz",
+      "integrity": "sha512-pTHxDVa0BpUbvAgX3Gat+7cSciXqUcY9j2VZKTbSB6+VQGpNgNO9ailxTGHSXlqOnX1Hcx1Enme2+yv7VqP9bg==",
       "dev": true,
       "dependencies": {
         "@babel/helper-annotate-as-pure": "^7.22.5",
-        "@babel/helper-create-class-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-create-class-features-plugin": "^7.24.1",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/plugin-syntax-private-property-in-object": "^7.14.5"
       },
       "engines": {
@@ -1489,12 +1504,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-property-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.23.3.tgz",
-      "integrity": "sha512-jR3Jn3y7cZp4oEWPFAlRsSWjxKe4PZILGBSd4nis1TsC5qeSpb+nrtihJuDhNI7QHiVbUaiXa0X2RZY3/TI6Nw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-property-literals/-/plugin-transform-property-literals-7.24.1.tgz",
+      "integrity": "sha512-LetvD7CrHmEx0G442gOomRr66d7q8HzzGGr4PMHGr+5YIm6++Yke+jxj246rpvsbyhJwCLxcTn6zW1P1BSenqA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1504,12 +1519,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-regenerator": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.23.3.tgz",
-      "integrity": "sha512-KP+75h0KghBMcVpuKisx3XTu9Ncut8Q8TuvGO4IhY+9D5DFEckQefOuIsB/gQ2tG71lCke4NMrtIPS8pOj18BQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.24.1.tgz",
+      "integrity": "sha512-sJwZBCzIBE4t+5Q4IGLaaun5ExVMRY0lYwos/jNecjMrVCygCdph3IKv0tkP5Fc87e/1+bebAmEAGBfnRD+cnw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "regenerator-transform": "^0.15.2"
       },
       "engines": {
@@ -1520,12 +1535,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-reserved-words": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.23.3.tgz",
-      "integrity": "sha512-QnNTazY54YqgGxwIexMZva9gqbPa15t/x9VS+0fsEFWplwVpXYZivtgl43Z1vMpc1bdPP2PP8siFeVcnFvA3Cg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-reserved-words/-/plugin-transform-reserved-words-7.24.1.tgz",
+      "integrity": "sha512-JAclqStUfIwKN15HrsQADFgeZt+wexNQ0uLhuqvqAUFoqPMjEcFCYZBhq0LUdz6dZK/mD+rErhW71fbx8RYElg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1535,16 +1550,16 @@
       }
     },
     "node_modules/@babel/plugin-transform-runtime": {
-      "version": "7.23.4",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.23.4.tgz",
-      "integrity": "sha512-ITwqpb6V4btwUG0YJR82o2QvmWrLgDnx/p2A3CTPYGaRgULkDiC0DRA2C4jlRB9uXGUEfaSS/IGHfVW+ohzYDw==",
+      "version": "7.24.3",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-runtime/-/plugin-transform-runtime-7.24.3.tgz",
+      "integrity": "sha512-J0BuRPNlNqlMTRJ72eVptpt9VcInbxO6iP3jaxr+1NPhC0UkKL+6oeX6VXMEYdADnuqmMmsBspt4d5w8Y/TCbQ==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-imports": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
-        "babel-plugin-polyfill-corejs2": "^0.4.6",
-        "babel-plugin-polyfill-corejs3": "^0.8.5",
-        "babel-plugin-polyfill-regenerator": "^0.5.3",
+        "@babel/helper-module-imports": "^7.24.3",
+        "@babel/helper-plugin-utils": "^7.24.0",
+        "babel-plugin-polyfill-corejs2": "^0.4.10",
+        "babel-plugin-polyfill-corejs3": "^0.10.1",
+        "babel-plugin-polyfill-regenerator": "^0.6.1",
         "semver": "^6.3.1"
       },
       "engines": {
@@ -1564,12 +1579,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-shorthand-properties": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.23.3.tgz",
-      "integrity": "sha512-ED2fgqZLmexWiN+YNFX26fx4gh5qHDhn1O2gvEhreLW2iI63Sqm4llRLCXALKrCnbN4Jy0VcMQZl/SAzqug/jg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.24.1.tgz",
+      "integrity": "sha512-LyjVB1nsJ6gTTUKRjRWx9C1s9hE7dLfP/knKdrfeH9UPtAGjYGgxIbFfx7xyLIEWs7Xe1Gnf8EWiUqfjLhInZA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1579,12 +1594,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-spread": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.23.3.tgz",
-      "integrity": "sha512-VvfVYlrlBVu+77xVTOAoxQ6mZbnIq5FM0aGBSFEcIh03qHf+zNqA4DC/3XMUozTg7bZV3e3mZQ0i13VB6v5yUg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-spread/-/plugin-transform-spread-7.24.1.tgz",
+      "integrity": "sha512-KjmcIM+fxgY+KxPVbjelJC6hrH1CgtPmTvdXAfn3/a9CnWGSTY7nH4zm5+cjmWJybdcPSsD0++QssDsjcpe47g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-skip-transparent-expression-wrappers": "^7.22.5"
       },
       "engines": {
@@ -1595,12 +1610,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-sticky-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.23.3.tgz",
-      "integrity": "sha512-HZOyN9g+rtvnOU3Yh7kSxXrKbzgrm5X4GncPY1QOquu7epga5MxKHVpYu2hvQnry/H+JjckSYRb93iNfsioAGg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-sticky-regex/-/plugin-transform-sticky-regex-7.24.1.tgz",
+      "integrity": "sha512-9v0f1bRXgPVcPrngOQvLXeGNNVLc8UjMVfebo9ka0WF3/7+aVUHmaJVT3sa0XCzEFioPfPHZiOcYG9qOsH63cw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1610,12 +1625,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-template-literals": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.23.3.tgz",
-      "integrity": "sha512-Flok06AYNp7GV2oJPZZcP9vZdszev6vPBkHLwxwSpaIqx75wn6mUd3UFWsSsA0l8nXAKkyCmL/sR02m8RYGeHg==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-template-literals/-/plugin-transform-template-literals-7.24.1.tgz",
+      "integrity": "sha512-WRkhROsNzriarqECASCNu/nojeXCDTE/F2HmRgOzi7NGvyfYGq1NEjKBK3ckLfRgGc6/lPAqP0vDOSw3YtG34g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1625,12 +1640,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-typeof-symbol": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.23.3.tgz",
-      "integrity": "sha512-4t15ViVnaFdrPC74be1gXBSMzXk3B4Us9lP7uLRQHTFpV5Dvt33pn+2MyyNxmN3VTTm3oTrZVMUmuw3oBnQ2oQ==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-typeof-symbol/-/plugin-transform-typeof-symbol-7.24.1.tgz",
+      "integrity": "sha512-CBfU4l/A+KruSUoW+vTQthwcAdwuqbpRNB8HQKlZABwHRhsdHZ9fezp4Sn18PeAlYxTNiLMlx4xUBV3AWfg1BA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1640,12 +1655,12 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-escapes": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.23.3.tgz",
-      "integrity": "sha512-OMCUx/bU6ChE3r4+ZdylEqAjaQgHAgipgW8nsCfu5pGqDcFytVd91AwRvUJSBZDz0exPGgnjoqhgRYLRjFZc9Q==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-escapes/-/plugin-transform-unicode-escapes-7.24.1.tgz",
+      "integrity": "sha512-RlkVIcWT4TLI96zM660S877E7beKlQw7Ig+wqkKBiWfj0zH5Q4h50q6er4wzZKRNSYpfo6ILJ+hrJAGSX2qcNw==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1655,13 +1670,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-property-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.23.3.tgz",
-      "integrity": "sha512-KcLIm+pDZkWZQAFJ9pdfmh89EwVfmNovFBcXko8szpBeF8z68kWIPeKlmSOkT9BXJxs2C0uk+5LxoxIv62MROA==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-property-regex/-/plugin-transform-unicode-property-regex-7.24.1.tgz",
+      "integrity": "sha512-Ss4VvlfYV5huWApFsF8/Sq0oXnGO+jB+rijFEFugTd3cwSObUSnUi88djgR5528Csl0uKlrI331kRqe56Ov2Ng==",
       "dev": true,
       "dependencies": {
         "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1671,13 +1686,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.23.3.tgz",
-      "integrity": "sha512-wMHpNA4x2cIA32b/ci3AfwNgheiva2W0WUKWTK7vBHBhDKfPsc5cFGNWm69WBqpwd86u1qwZ9PWevKqm1A3yAw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-regex/-/plugin-transform-unicode-regex-7.24.1.tgz",
+      "integrity": "sha512-2A/94wgZgxfTsiLaQ2E36XAOdcZmGAaEEgVmxQWwZXWkGhvoHbaqXcKnU8zny4ycpu3vNqg0L/PcCiYtHtA13g==",
       "dev": true,
       "dependencies": {
         "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1687,13 +1702,13 @@
       }
     },
     "node_modules/@babel/plugin-transform-unicode-sets-regex": {
-      "version": "7.23.3",
-      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.23.3.tgz",
-      "integrity": "sha512-W7lliA/v9bNR83Qc3q1ip9CQMZ09CcHDbHfbLRDNuAhn1Mvkr1ZNF7hPmztMQvtTGVLJ9m8IZqWsTkXOml8dbw==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/plugin-transform-unicode-sets-regex/-/plugin-transform-unicode-sets-regex-7.24.1.tgz",
+      "integrity": "sha512-fqj4WuzzS+ukpgerpAoOnMfQXwUHFxXUZUE84oL2Kao2N8uSlvcpnAidKASgsNgzZHBsHWvcm8s9FPWUhAb8fA==",
       "dev": true,
       "dependencies": {
         "@babel/helper-create-regexp-features-plugin": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5"
+        "@babel/helper-plugin-utils": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
@@ -1703,26 +1718,27 @@
       }
     },
     "node_modules/@babel/preset-env": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.23.5.tgz",
-      "integrity": "sha512-0d/uxVD6tFGWXGDSfyMD1p2otoaKmu6+GD+NfAx0tMaH+dxORnp7T9TaVQ6mKyya7iBtCIVxHjWT7MuzzM9z+A==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.24.4.tgz",
+      "integrity": "sha512-7Kl6cSmYkak0FK/FXjSEnLJ1N9T/WA2RkMhu17gZ/dsxKJUuTYNIylahPTzqpLyJN4WhDif8X0XK1R8Wsguo/A==",
       "dev": true,
       "dependencies": {
-        "@babel/compat-data": "^7.23.5",
-        "@babel/helper-compilation-targets": "^7.22.15",
-        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/compat-data": "^7.24.4",
+        "@babel/helper-compilation-targets": "^7.23.6",
+        "@babel/helper-plugin-utils": "^7.24.0",
         "@babel/helper-validator-option": "^7.23.5",
-        "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.23.3",
-        "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.23.3",
-        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.23.3",
+        "@babel/plugin-bugfix-firefox-class-in-computed-class-key": "^7.24.4",
+        "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression": "^7.24.1",
+        "@babel/plugin-bugfix-v8-spread-parameters-in-optional-chaining": "^7.24.1",
+        "@babel/plugin-bugfix-v8-static-class-fields-redefine-readonly": "^7.24.1",
         "@babel/plugin-proposal-private-property-in-object": "7.21.0-placeholder-for-preset-env.2",
         "@babel/plugin-syntax-async-generators": "^7.8.4",
         "@babel/plugin-syntax-class-properties": "^7.12.13",
         "@babel/plugin-syntax-class-static-block": "^7.14.5",
         "@babel/plugin-syntax-dynamic-import": "^7.8.3",
         "@babel/plugin-syntax-export-namespace-from": "^7.8.3",
-        "@babel/plugin-syntax-import-assertions": "^7.23.3",
-        "@babel/plugin-syntax-import-attributes": "^7.23.3",
+        "@babel/plugin-syntax-import-assertions": "^7.24.1",
+        "@babel/plugin-syntax-import-attributes": "^7.24.1",
         "@babel/plugin-syntax-import-meta": "^7.10.4",
         "@babel/plugin-syntax-json-strings": "^7.8.3",
         "@babel/plugin-syntax-logical-assignment-operators": "^7.10.4",
@@ -1734,58 +1750,58 @@
         "@babel/plugin-syntax-private-property-in-object": "^7.14.5",
         "@babel/plugin-syntax-top-level-await": "^7.14.5",
         "@babel/plugin-syntax-unicode-sets-regex": "^7.18.6",
-        "@babel/plugin-transform-arrow-functions": "^7.23.3",
-        "@babel/plugin-transform-async-generator-functions": "^7.23.4",
-        "@babel/plugin-transform-async-to-generator": "^7.23.3",
-        "@babel/plugin-transform-block-scoped-functions": "^7.23.3",
-        "@babel/plugin-transform-block-scoping": "^7.23.4",
-        "@babel/plugin-transform-class-properties": "^7.23.3",
-        "@babel/plugin-transform-class-static-block": "^7.23.4",
-        "@babel/plugin-transform-classes": "^7.23.5",
-        "@babel/plugin-transform-computed-properties": "^7.23.3",
-        "@babel/plugin-transform-destructuring": "^7.23.3",
-        "@babel/plugin-transform-dotall-regex": "^7.23.3",
-        "@babel/plugin-transform-duplicate-keys": "^7.23.3",
-        "@babel/plugin-transform-dynamic-import": "^7.23.4",
-        "@babel/plugin-transform-exponentiation-operator": "^7.23.3",
-        "@babel/plugin-transform-export-namespace-from": "^7.23.4",
-        "@babel/plugin-transform-for-of": "^7.23.3",
-        "@babel/plugin-transform-function-name": "^7.23.3",
-        "@babel/plugin-transform-json-strings": "^7.23.4",
-        "@babel/plugin-transform-literals": "^7.23.3",
-        "@babel/plugin-transform-logical-assignment-operators": "^7.23.4",
-        "@babel/plugin-transform-member-expression-literals": "^7.23.3",
-        "@babel/plugin-transform-modules-amd": "^7.23.3",
-        "@babel/plugin-transform-modules-commonjs": "^7.23.3",
-        "@babel/plugin-transform-modules-systemjs": "^7.23.3",
-        "@babel/plugin-transform-modules-umd": "^7.23.3",
+        "@babel/plugin-transform-arrow-functions": "^7.24.1",
+        "@babel/plugin-transform-async-generator-functions": "^7.24.3",
+        "@babel/plugin-transform-async-to-generator": "^7.24.1",
+        "@babel/plugin-transform-block-scoped-functions": "^7.24.1",
+        "@babel/plugin-transform-block-scoping": "^7.24.4",
+        "@babel/plugin-transform-class-properties": "^7.24.1",
+        "@babel/plugin-transform-class-static-block": "^7.24.4",
+        "@babel/plugin-transform-classes": "^7.24.1",
+        "@babel/plugin-transform-computed-properties": "^7.24.1",
+        "@babel/plugin-transform-destructuring": "^7.24.1",
+        "@babel/plugin-transform-dotall-regex": "^7.24.1",
+        "@babel/plugin-transform-duplicate-keys": "^7.24.1",
+        "@babel/plugin-transform-dynamic-import": "^7.24.1",
+        "@babel/plugin-transform-exponentiation-operator": "^7.24.1",
+        "@babel/plugin-transform-export-namespace-from": "^7.24.1",
+        "@babel/plugin-transform-for-of": "^7.24.1",
+        "@babel/plugin-transform-function-name": "^7.24.1",
+        "@babel/plugin-transform-json-strings": "^7.24.1",
+        "@babel/plugin-transform-literals": "^7.24.1",
+        "@babel/plugin-transform-logical-assignment-operators": "^7.24.1",
+        "@babel/plugin-transform-member-expression-literals": "^7.24.1",
+        "@babel/plugin-transform-modules-amd": "^7.24.1",
+        "@babel/plugin-transform-modules-commonjs": "^7.24.1",
+        "@babel/plugin-transform-modules-systemjs": "^7.24.1",
+        "@babel/plugin-transform-modules-umd": "^7.24.1",
         "@babel/plugin-transform-named-capturing-groups-regex": "^7.22.5",
-        "@babel/plugin-transform-new-target": "^7.23.3",
-        "@babel/plugin-transform-nullish-coalescing-operator": "^7.23.4",
-        "@babel/plugin-transform-numeric-separator": "^7.23.4",
-        "@babel/plugin-transform-object-rest-spread": "^7.23.4",
-        "@babel/plugin-transform-object-super": "^7.23.3",
-        "@babel/plugin-transform-optional-catch-binding": "^7.23.4",
-        "@babel/plugin-transform-optional-chaining": "^7.23.4",
-        "@babel/plugin-transform-parameters": "^7.23.3",
-        "@babel/plugin-transform-private-methods": "^7.23.3",
-        "@babel/plugin-transform-private-property-in-object": "^7.23.4",
-        "@babel/plugin-transform-property-literals": "^7.23.3",
-        "@babel/plugin-transform-regenerator": "^7.23.3",
-        "@babel/plugin-transform-reserved-words": "^7.23.3",
-        "@babel/plugin-transform-shorthand-properties": "^7.23.3",
-        "@babel/plugin-transform-spread": "^7.23.3",
-        "@babel/plugin-transform-sticky-regex": "^7.23.3",
-        "@babel/plugin-transform-template-literals": "^7.23.3",
-        "@babel/plugin-transform-typeof-symbol": "^7.23.3",
-        "@babel/plugin-transform-unicode-escapes": "^7.23.3",
-        "@babel/plugin-transform-unicode-property-regex": "^7.23.3",
-        "@babel/plugin-transform-unicode-regex": "^7.23.3",
-        "@babel/plugin-transform-unicode-sets-regex": "^7.23.3",
+        "@babel/plugin-transform-new-target": "^7.24.1",
+        "@babel/plugin-transform-nullish-coalescing-operator": "^7.24.1",
+        "@babel/plugin-transform-numeric-separator": "^7.24.1",
+        "@babel/plugin-transform-object-rest-spread": "^7.24.1",
+        "@babel/plugin-transform-object-super": "^7.24.1",
+        "@babel/plugin-transform-optional-catch-binding": "^7.24.1",
+        "@babel/plugin-transform-optional-chaining": "^7.24.1",
+        "@babel/plugin-transform-parameters": "^7.24.1",
+        "@babel/plugin-transform-private-methods": "^7.24.1",
+        "@babel/plugin-transform-private-property-in-object": "^7.24.1",
+        "@babel/plugin-transform-property-literals": "^7.24.1",
+        "@babel/plugin-transform-regenerator": "^7.24.1",
+        "@babel/plugin-transform-reserved-words": "^7.24.1",
+        "@babel/plugin-transform-shorthand-properties": "^7.24.1",
+        "@babel/plugin-transform-spread": "^7.24.1",
+        "@babel/plugin-transform-sticky-regex": "^7.24.1",
+        "@babel/plugin-transform-template-literals": "^7.24.1",
+        "@babel/plugin-transform-typeof-symbol": "^7.24.1",
+        "@babel/plugin-transform-unicode-escapes": "^7.24.1",
+        "@babel/plugin-transform-unicode-property-regex": "^7.24.1",
+        "@babel/plugin-transform-unicode-regex": "^7.24.1",
+        "@babel/plugin-transform-unicode-sets-regex": "^7.24.1",
         "@babel/preset-modules": "0.1.6-no-external-plugins",
-        "babel-plugin-polyfill-corejs2": "^0.4.6",
-        "babel-plugin-polyfill-corejs3": "^0.8.5",
-        "babel-plugin-polyfill-regenerator": "^0.5.3",
+        "babel-plugin-polyfill-corejs2": "^0.4.10",
+        "babel-plugin-polyfill-corejs3": "^0.10.4",
+        "babel-plugin-polyfill-regenerator": "^0.6.1",
         "core-js-compat": "^3.31.0",
         "semver": "^6.3.1"
       },
@@ -1826,9 +1842,9 @@
       "dev": true
     },
     "node_modules/@babel/runtime": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.23.5.tgz",
-      "integrity": "sha512-NdUTHcPe4C99WxPub+K9l9tK5/lV4UXIoaHSYgzco9BCyjKAAwzdBI+wWtYqHt7LJdbo74ZjRPJgzVweq1sz0w==",
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.24.4.tgz",
+      "integrity": "sha512-dkxf7+hn8mFBwKjs9bvBlArzLVxVbS8usaPUDd5p2a9JCL9tB8OaOVN1isD4+Xyk4ns89/xeOmbQvgdK7IIVdA==",
       "dev": true,
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
@@ -1838,34 +1854,34 @@
       }
     },
     "node_modules/@babel/template": {
-      "version": "7.22.15",
-      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.22.15.tgz",
-      "integrity": "sha512-QPErUVm4uyJa60rkI73qneDacvdvzxshT3kksGqlGWYdOTIUOwJ7RDUL8sGqslY1uXWSL6xMFKEXDS3ox2uF0w==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.24.0.tgz",
+      "integrity": "sha512-Bkf2q8lMB0AFpX0NFEqSbx1OkTHf0f+0j82mkw+ZpzBnkk7e9Ql0891vlfgi+kHwOk8tQjiQHpqh4LaSa0fKEA==",
       "dev": true,
       "dependencies": {
-        "@babel/code-frame": "^7.22.13",
-        "@babel/parser": "^7.22.15",
-        "@babel/types": "^7.22.15"
+        "@babel/code-frame": "^7.23.5",
+        "@babel/parser": "^7.24.0",
+        "@babel/types": "^7.24.0"
       },
       "engines": {
         "node": ">=6.9.0"
       }
     },
     "node_modules/@babel/traverse": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.5.tgz",
-      "integrity": "sha512-czx7Xy5a6sapWWRx61m1Ke1Ra4vczu1mCTtJam5zRTBOonfdJ+S/B6HYmGYu3fJtr8GGET3si6IhgWVBhJ/m8w==",
+      "version": "7.24.1",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.24.1.tgz",
+      "integrity": "sha512-xuU6o9m68KeqZbQuDt2TcKSxUw/mrsvavlEqQ1leZ/B+C9tk6E4sRWy97WaXgvq5E+nU3cXMxv3WKOCanVMCmQ==",
       "dev": true,
       "dependencies": {
-        "@babel/code-frame": "^7.23.5",
-        "@babel/generator": "^7.23.5",
+        "@babel/code-frame": "^7.24.1",
+        "@babel/generator": "^7.24.1",
         "@babel/helper-environment-visitor": "^7.22.20",
         "@babel/helper-function-name": "^7.23.0",
         "@babel/helper-hoist-variables": "^7.22.5",
         "@babel/helper-split-export-declaration": "^7.22.6",
-        "@babel/parser": "^7.23.5",
-        "@babel/types": "^7.23.5",
-        "debug": "^4.1.0",
+        "@babel/parser": "^7.24.1",
+        "@babel/types": "^7.24.0",
+        "debug": "^4.3.1",
         "globals": "^11.1.0"
       },
       "engines": {
@@ -1873,9 +1889,9 @@
       }
     },
     "node_modules/@babel/types": {
-      "version": "7.23.5",
-      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.23.5.tgz",
-      "integrity": "sha512-ON5kSOJwVO6xXVRTvOI0eOnWe7VdUcIpsovGo9U/Br4Ie4UVFQTboO2cYnDhAGU6Fp+UxSiT+pMft0SMHfuq6w==",
+      "version": "7.24.0",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.24.0.tgz",
+      "integrity": "sha512-+j7a5c253RfKh8iABBhywc8NSfP5LURe7Uh4qpsh6jc+aLJguvmIUBdjSdEMQv2bENrCR5MfRdjGo7vzS/ob7w==",
       "dev": true,
       "dependencies": {
         "@babel/helper-string-parser": "^7.23.4",
@@ -1937,9 +1953,9 @@
       }
     },
     "node_modules/@casl/ability": {
-      "version": "6.5.0",
-      "resolved": "https://registry.npmjs.org/@casl/ability/-/ability-6.5.0.tgz",
-      "integrity": "sha512-3guc94ugr5ylZQIpJTLz0CDfwNi0mxKVECj1vJUPAvs+Lwunh/dcuUjwzc4MHM9D8JOYX0XUZMEPedpB3vIbOw==",
+      "version": "6.7.1",
+      "resolved": "https://registry.npmjs.org/@casl/ability/-/ability-6.7.1.tgz",
+      "integrity": "sha512-e+Vgrehd1/lzOSwSqKHtmJ6kmIuZbGBlM2LBS5IuYGGKmVHuhUuyh3XgTn1VIw9+TO4gqU+uptvxfIRBUEdJuw==",
       "dependencies": {
         "@ucast/mongo2js": "^1.3.0"
       },
@@ -1948,9 +1964,9 @@
       }
     },
     "node_modules/@casl/vue": {
-      "version": "2.2.1",
-      "resolved": "https://registry.npmjs.org/@casl/vue/-/vue-2.2.1.tgz",
-      "integrity": "sha512-1OeGhT4A7VBkEACacF2ZlHkPiFJvyFy9h2PhBnMoetFDojMHbrn3ZjKgL5zQ4wSIrTQo9KbbzG3f0uAei2GKCQ==",
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/@casl/vue/-/vue-2.2.2.tgz",
+      "integrity": "sha512-xWy4i5+3+WuBgENVesPalRTKpSJZ2cEMXtbqjWjqj7FDvoeso7jT1pBVk9ujKlIRhgfVWGdCRb7XzeISi2VLcA==",
       "peerDependencies": {
         "@casl/ability": "^2.0.0 || ^3.0.0 || ^4.0.0 || ^5.1.0 || ^6.0.0",
         "vue": "^3.0.0"
@@ -2059,9 +2075,9 @@
       }
     },
     "node_modules/@eslint/eslintrc/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
         "type-fest": "^0.20.2"
@@ -2094,910 +2110,109 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/@fastify/busboy": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/@fastify/busboy/-/busboy-2.1.0.tgz",
-      "integrity": "sha512-+KpH+QxZU7O4675t3mnkQKcZZg56u+K/Ct2K+N2AZYNVK8kyeo/bI18tI8aPm3tvNNRyTWfj6s5tnGNlcbQRsA==",
-      "engines": {
-        "node": ">=14"
-      }
+    "node_modules/@hapi/hoek": {
+      "version": "9.3.0",
+      "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz",
+      "integrity": "sha512-/c6rf4UJlmHlC9b5BaNvzAcFv7HZ2QHaV0D4/HNlBdvFnvQq8RI4kYdhyPCl7Xj+oWvTWQ8ujhqS53LIgAe6KQ==",
+      "dev": true
     },
-    "node_modules/@firebase/analytics": {
-      "version": "0.10.0",
-      "resolved": "https://registry.npmjs.org/@firebase/analytics/-/analytics-0.10.0.tgz",
-      "integrity": "sha512-Locv8gAqx0e+GX/0SI3dzmBY5e9kjVDtD+3zCFLJ0tH2hJwuCAiL+5WkHuxKj92rqQj/rvkBUCfA1ewlX2hehg==",
+    "node_modules/@hapi/topo": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@hapi/topo/-/topo-5.1.0.tgz",
+      "integrity": "sha512-foQZKJig7Ob0BMAYBfcJk8d77QtOe7Wo4ox7ff1lQYoNNAb6jwcY1ncdoy2e9wQZzvNy7ODZCYJkK8kzmcAnAg==",
+      "dev": true,
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
+        "@hapi/hoek": "^9.0.0"
       }
     },
-    "node_modules/@firebase/analytics-compat": {
-      "version": "0.2.6",
-      "resolved": "https://registry.npmjs.org/@firebase/analytics-compat/-/analytics-compat-0.2.6.tgz",
-      "integrity": "sha512-4MqpVLFkGK7NJf/5wPEEP7ePBJatwYpyjgJ+wQHQGHfzaCDgntOnl9rL2vbVGGKCnRqWtZDIWhctB86UWXaX2Q==",
+    "node_modules/@hotwax/app-version-info": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@hotwax/app-version-info/-/app-version-info-1.0.0.tgz",
+      "integrity": "sha512-PnJTqTbFvvl9N23yi1DjL4aNmTkpYFrayyoJyfH1qDJXADFbQ9kB7gJmKcfiPpyYMGR86Yf3Is5ct0+wReUJGQ=="
+    },
+    "node_modules/@hotwax/apps-theme": {
+      "version": "1.2.6",
+      "resolved": "https://registry.npmjs.org/@hotwax/apps-theme/-/apps-theme-1.2.6.tgz",
+      "integrity": "sha512-zpUjGoY7LBlKeiP0V7tonrmoey8HQ5THQmyixQ+IDtrjmEJNBjynW/Ef3gC0FUNNPuVqxWPZdT5CVgaETLGTwg=="
+    },
+    "node_modules/@humanwhocodes/config-array": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.5.0.tgz",
+      "integrity": "sha512-FagtKFz74XrTl7y6HCzQpwDfXP0yhxe9lHLD1UZxjvZIcbyRz8zTFF/yYNfSfzU414eDwZ1SrO0Qvtyf+wFMQg==",
+      "dev": true,
       "dependencies": {
-        "@firebase/analytics": "0.10.0",
-        "@firebase/analytics-types": "0.8.0",
-        "@firebase/component": "0.6.4",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
+        "@humanwhocodes/object-schema": "^1.2.0",
+        "debug": "^4.1.1",
+        "minimatch": "^3.0.4"
       },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
+      "engines": {
+        "node": ">=10.10.0"
       }
     },
-    "node_modules/@firebase/analytics-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/analytics-types": {
-      "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/@firebase/analytics-types/-/analytics-types-0.8.0.tgz",
-      "integrity": "sha512-iRP+QKI2+oz3UAh4nPEq14CsEjrjD6a5+fuypjScisAh9kXKFvdJOZJDwk7kikLvWVLGEs9+kIUS4LPQV7VZVw=="
+    "node_modules/@humanwhocodes/object-schema": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz",
+      "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
+      "dev": true
     },
-    "node_modules/@firebase/analytics/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    "node_modules/@intlify/bundle-utils": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/@intlify/bundle-utils/-/bundle-utils-0.1.0.tgz",
+      "integrity": "sha512-v0aeQmjNWppSLpPcLh3E1JiQg8bQFY9uD4ZuZssGq2elXsqB3JDH0TZfhO8Y83x1Ejk0qxq5hv015mYS2qzfZQ==",
+      "dev": true,
+      "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/@firebase/app": {
-      "version": "0.9.25",
-      "resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.9.25.tgz",
-      "integrity": "sha512-fX22gL5USXhOK21Hlh3oTeOzQZ6th6S2JrjXNEpBARmwzuUkqmVGVdsOCIFYIsLpK0dQE3o8xZnLrRg5wnzZ/g==",
+    "node_modules/@intlify/core": {
+      "version": "9.11.0",
+      "resolved": "https://registry.npmjs.org/@intlify/core/-/core-9.11.0.tgz",
+      "integrity": "sha512-ve7wvL9G+7zITIIc75hNhJ1sWjImfQgpU9aS/C2cIHCnKD37ZgRJosKDb257FwXcmUH0MhHfY/p5yjURaMXY+g==",
+      "dev": true,
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "idb": "7.1.1",
-        "tslib": "^2.1.0"
+        "@intlify/core-base": "9.11.0",
+        "@intlify/shared": "9.11.0"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
       }
     },
-    "node_modules/@firebase/app-check": {
-      "version": "0.8.1",
-      "resolved": "https://registry.npmjs.org/@firebase/app-check/-/app-check-0.8.1.tgz",
-      "integrity": "sha512-zi3vbM5tb/eGRWyiqf+1DXbxFu9Q07dnm46rweodgUpH9B8svxYkHfNwYWx7F5mjHU70SQDuaojH1We5ws9OKA==",
+    "node_modules/@intlify/core-base": {
+      "version": "9.11.0",
+      "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.11.0.tgz",
+      "integrity": "sha512-cveOqAstjLZIiyatcP/HrzrQ87cZI8ScPQna3yvoM8zjcjcIRK1MRvmxUNlPdg0rTNJMZw7rixPVM58O5aHVPA==",
+      "dev": true,
       "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
+        "@intlify/message-compiler": "9.11.0",
+        "@intlify/shared": "9.11.0"
       },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
       }
     },
-    "node_modules/@firebase/app-check-compat": {
-      "version": "0.3.8",
-      "resolved": "https://registry.npmjs.org/@firebase/app-check-compat/-/app-check-compat-0.3.8.tgz",
-      "integrity": "sha512-EaETtChR4UgMokJFw+r6jfcIyCTUZSe0a6ivF37D9MxlG9G3wzK1COyXgxoX96GzXmDPc2aubX4PxCrdVHhrnA==",
+    "node_modules/@intlify/devtools-if": {
+      "version": "9.1.10",
+      "resolved": "https://registry.npmjs.org/@intlify/devtools-if/-/devtools-if-9.1.10.tgz",
+      "integrity": "sha512-SHaKoYu6sog3+Q8js1y3oXLywuogbH1sKuc7NSYkN3GElvXSBaMoCzW+we0ZSFqj/6c7vTNLg9nQ6rxhKqYwnQ==",
       "dependencies": {
-        "@firebase/app-check": "0.8.1",
-        "@firebase/app-check-types": "0.5.0",
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
+        "@intlify/shared": "9.1.10"
       },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/app-check-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/app-check-interop-types": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/@firebase/app-check-interop-types/-/app-check-interop-types-0.3.0.tgz",
-      "integrity": "sha512-xAxHPZPIgFXnI+vb4sbBjZcde7ZluzPPaSK7Lx3/nmuVk4TjZvnL8ONnkd4ERQKL8WePQySU+pRcWkh8rDf5Sg=="
-    },
-    "node_modules/@firebase/app-check-types": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/@firebase/app-check-types/-/app-check-types-0.5.0.tgz",
-      "integrity": "sha512-uwSUj32Mlubybw7tedRzR24RP8M8JUVR3NPiMk3/Z4bCmgEKTlQBwMXrehDAZ2wF+TsBq0SN1c6ema71U/JPyQ=="
-    },
-    "node_modules/@firebase/app-check/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/app-compat": {
-      "version": "0.2.25",
-      "resolved": "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.2.25.tgz",
-      "integrity": "sha512-B/JtCp1FsTuzlh1tIGQpYM2AXps21/zlzpFsk5LRsROOTRhBcR2N45AyaONPFD06C0yS0Tw19foxADzHyOSC3A==",
-      "dependencies": {
-        "@firebase/app": "0.9.25",
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      }
-    },
-    "node_modules/@firebase/app-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/app-types": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/@firebase/app-types/-/app-types-0.9.0.tgz",
-      "integrity": "sha512-AeweANOIo0Mb8GiYm3xhTEBVCmPwTYAu9Hcd2qSkLuga/6+j9b1Jskl5bpiSQWy9eJ/j5pavxj6eYogmnuzm+Q=="
-    },
-    "node_modules/@firebase/app/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/auth": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/@firebase/auth/-/auth-1.5.1.tgz",
-      "integrity": "sha512-sVi7rq2YneLGJFqHa5S6nDfCHix9yuVV3RLhj/pWPlB4a36ofXal4E6PJwpeMc8uLjWEr1aovYN1jkXWNB6Avw==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0",
-        "undici": "5.26.5"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x",
-        "@react-native-async-storage/async-storage": "^1.18.1"
-      },
-      "peerDependenciesMeta": {
-        "@react-native-async-storage/async-storage": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/@firebase/auth-compat": {
-      "version": "0.5.1",
-      "resolved": "https://registry.npmjs.org/@firebase/auth-compat/-/auth-compat-0.5.1.tgz",
-      "integrity": "sha512-rgDZnrDoekRvtzXVji8Z61wxxkof6pTkjYEkybILrjM8tGP9tx4xa9qGpF4ax3AzF+rKr7mIa9NnoXEK4UNqmQ==",
-      "dependencies": {
-        "@firebase/auth": "1.5.1",
-        "@firebase/auth-types": "0.12.0",
-        "@firebase/component": "0.6.4",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0",
-        "undici": "5.26.5"
-      },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/auth-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/auth-interop-types": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/@firebase/auth-interop-types/-/auth-interop-types-0.2.1.tgz",
-      "integrity": "sha512-VOaGzKp65MY6P5FI84TfYKBXEPi6LmOCSMMzys6o2BN2LOsqy7pCuZCup7NYnfbk5OkkQKzvIfHOzTm0UDpkyg=="
-    },
-    "node_modules/@firebase/auth-types": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/@firebase/auth-types/-/auth-types-0.12.0.tgz",
-      "integrity": "sha512-pPwaZt+SPOshK8xNoiQlK5XIrS97kFYc3Rc7xmy373QsOJ9MmqXxLaYssP5Kcds4wd2qK//amx/c+A8O2fVeZA==",
-      "peerDependencies": {
-        "@firebase/app-types": "0.x",
-        "@firebase/util": "1.x"
-      }
-    },
-    "node_modules/@firebase/auth/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/component": {
-      "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/@firebase/component/-/component-0.6.4.tgz",
-      "integrity": "sha512-rLMyrXuO9jcAUCaQXCMjCMUsWrba5fzHlNK24xz5j2W6A/SRmK8mZJ/hn7V0fViLbxC0lPMtrK1eYzk6Fg03jA==",
-      "dependencies": {
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      }
-    },
-    "node_modules/@firebase/component/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/database": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@firebase/database/-/database-1.0.2.tgz",
-      "integrity": "sha512-8X6NBJgUQzDz0xQVaCISoOLINKat594N2eBbMR3Mu/MH/ei4WM+aAMlsNzngF22eljXu1SILP5G3evkyvsG3Ng==",
-      "dependencies": {
-        "@firebase/app-check-interop-types": "0.3.0",
-        "@firebase/auth-interop-types": "0.2.1",
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "faye-websocket": "0.11.4",
-        "tslib": "^2.1.0"
-      }
-    },
-    "node_modules/@firebase/database-compat": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@firebase/database-compat/-/database-compat-1.0.2.tgz",
-      "integrity": "sha512-09ryJnXDvuycsxn8aXBzLhBTuCos3HEnCOBWY6hosxfYlNCGnLvG8YMlbSAt5eNhf7/00B095AEfDsdrrLjxqA==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/database": "1.0.2",
-        "@firebase/database-types": "1.0.0",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      }
-    },
-    "node_modules/@firebase/database-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/database-types": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@firebase/database-types/-/database-types-1.0.0.tgz",
-      "integrity": "sha512-SjnXStoE0Q56HcFgNQ+9SsmJc0c8TqGARdI/T44KXy+Ets3r6x/ivhQozT66bMnCEjJRywYoxNurRTMlZF8VNg==",
-      "dependencies": {
-        "@firebase/app-types": "0.9.0",
-        "@firebase/util": "1.9.3"
-      }
-    },
-    "node_modules/@firebase/database/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/firestore": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-4.4.0.tgz",
-      "integrity": "sha512-VeDXD9PUjvcWY1tInBOMTIu2pijR3YYy+QAe5cxCo1Q1vW+aA/mpQHhebPM1J6b4Zd1MuUh8xpBRvH9ujKR56A==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "@firebase/webchannel-wrapper": "0.10.5",
-        "@grpc/grpc-js": "~1.9.0",
-        "@grpc/proto-loader": "^0.7.8",
-        "tslib": "^2.1.0",
-        "undici": "5.26.5"
-      },
-      "engines": {
-        "node": ">=10.10.0"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
-      }
-    },
-    "node_modules/@firebase/firestore-compat": {
-      "version": "0.3.23",
-      "resolved": "https://registry.npmjs.org/@firebase/firestore-compat/-/firestore-compat-0.3.23.tgz",
-      "integrity": "sha512-uUTBiP0GLVBETaOCfB11d33OWB8x1r2G1Xrl0sRK3Va0N5LJ/GRvKVSGfM7VScj+ypeHe8RpdwKoCqLpN1e+uA==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/firestore": "4.4.0",
-        "@firebase/firestore-types": "3.0.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/firestore-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/firestore-types": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/@firebase/firestore-types/-/firestore-types-3.0.0.tgz",
-      "integrity": "sha512-Meg4cIezHo9zLamw0ymFYBD4SMjLb+ZXIbuN7T7ddXN6MGoICmOTq3/ltdCGoDCS2u+H1XJs2u/cYp75jsX9Qw==",
-      "peerDependencies": {
-        "@firebase/app-types": "0.x",
-        "@firebase/util": "1.x"
-      }
-    },
-    "node_modules/@firebase/firestore/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/functions": {
-      "version": "0.11.0",
-      "resolved": "https://registry.npmjs.org/@firebase/functions/-/functions-0.11.0.tgz",
-      "integrity": "sha512-n1PZxKnJ++k73Q8khTPwihlbeKo6emnGzE0hX6QVQJsMq82y/XKmNpw2t/q30VJgwaia3ZXU1fd1C5wHncL+Zg==",
-      "dependencies": {
-        "@firebase/app-check-interop-types": "0.3.0",
-        "@firebase/auth-interop-types": "0.2.1",
-        "@firebase/component": "0.6.4",
-        "@firebase/messaging-interop-types": "0.2.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0",
-        "undici": "5.26.5"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
-      }
-    },
-    "node_modules/@firebase/functions-compat": {
-      "version": "0.3.6",
-      "resolved": "https://registry.npmjs.org/@firebase/functions-compat/-/functions-compat-0.3.6.tgz",
-      "integrity": "sha512-RQpO3yuHtnkqLqExuAT2d0u3zh8SDbeBYK5EwSCBKI9mjrFeJRXBnd3pEG+x5SxGJLy56/5pQf73mwt0OuH5yg==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/functions": "0.11.0",
-        "@firebase/functions-types": "0.6.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/functions-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/functions-types": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/@firebase/functions-types/-/functions-types-0.6.0.tgz",
-      "integrity": "sha512-hfEw5VJtgWXIRf92ImLkgENqpL6IWpYaXVYiRkFY1jJ9+6tIhWM7IzzwbevwIIud/jaxKVdRzD7QBWfPmkwCYw=="
-    },
-    "node_modules/@firebase/functions/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/installations": {
-      "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/@firebase/installations/-/installations-0.6.4.tgz",
-      "integrity": "sha512-u5y88rtsp7NYkCHC3ElbFBrPtieUybZluXyzl7+4BsIz4sqb4vSAuwHEUgCgCeaQhvsnxDEU6icly8U9zsJigA==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/util": "1.9.3",
-        "idb": "7.0.1",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
-      }
-    },
-    "node_modules/@firebase/installations-compat": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@firebase/installations-compat/-/installations-compat-0.2.4.tgz",
-      "integrity": "sha512-LI9dYjp0aT9Njkn9U4JRrDqQ6KXeAmFbRC0E7jI7+hxl5YmRWysq5qgQl22hcWpTk+cm3es66d/apoDU/A9n6Q==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
-        "@firebase/installations-types": "0.5.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/installations-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/installations-types": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/@firebase/installations-types/-/installations-types-0.5.0.tgz",
-      "integrity": "sha512-9DP+RGfzoI2jH7gY4SlzqvZ+hr7gYzPODrbzVD82Y12kScZ6ZpRg/i3j6rleto8vTFC8n6Len4560FnV1w2IRg==",
-      "peerDependencies": {
-        "@firebase/app-types": "0.x"
-      }
-    },
-    "node_modules/@firebase/installations/node_modules/idb": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npmjs.org/idb/-/idb-7.0.1.tgz",
-      "integrity": "sha512-UUxlE7vGWK5RfB/fDwEGgRf84DY/ieqNha6msMV99UsEMQhJ1RwbCd8AYBj3QMgnE3VZnfQvm4oKVCJTYlqIgg=="
-    },
-    "node_modules/@firebase/installations/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/logger": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/@firebase/logger/-/logger-0.4.0.tgz",
-      "integrity": "sha512-eRKSeykumZ5+cJPdxxJRgAC3G5NknY2GwEbKfymdnXtnT0Ucm4pspfR6GT4MUQEDuJwRVbVcSx85kgJulMoFFA==",
-      "dependencies": {
-        "tslib": "^2.1.0"
-      }
-    },
-    "node_modules/@firebase/logger/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/messaging": {
-      "version": "0.12.5",
-      "resolved": "https://registry.npmjs.org/@firebase/messaging/-/messaging-0.12.5.tgz",
-      "integrity": "sha512-i/rrEI2k9ueFhdIr8KQsptWGskrsnkC5TkohCTrJKz9P0C/PbNv14IAMkwhMJTqIur5VwuOnrUkc9Kdz7awekw==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
-        "@firebase/messaging-interop-types": "0.2.0",
-        "@firebase/util": "1.9.3",
-        "idb": "7.1.1",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
-      }
-    },
-    "node_modules/@firebase/messaging-compat": {
-      "version": "0.2.5",
-      "resolved": "https://registry.npmjs.org/@firebase/messaging-compat/-/messaging-compat-0.2.5.tgz",
-      "integrity": "sha512-qHQZxm4hEG8/HFU/ls5/bU+rpnlPDoZoqi3ATMeb6s4hovYV9+PfV5I7ZrKV5eFFv47Hx1PWLe5uPnS4e7gMwQ==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/messaging": "0.12.5",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/messaging-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/messaging-interop-types": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/@firebase/messaging-interop-types/-/messaging-interop-types-0.2.0.tgz",
-      "integrity": "sha512-ujA8dcRuVeBixGR9CtegfpU4YmZf3Lt7QYkcj693FFannwNuZgfAYaTmbJ40dtjB81SAu6tbFPL9YLNT15KmOQ=="
-    },
-    "node_modules/@firebase/messaging/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/performance": {
-      "version": "0.6.4",
-      "resolved": "https://registry.npmjs.org/@firebase/performance/-/performance-0.6.4.tgz",
-      "integrity": "sha512-HfTn/bd8mfy/61vEqaBelNiNnvAbUtME2S25A67Nb34zVuCSCRIX4SseXY6zBnOFj3oLisaEqhVcJmVPAej67g==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
-      }
-    },
-    "node_modules/@firebase/performance-compat": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@firebase/performance-compat/-/performance-compat-0.2.4.tgz",
-      "integrity": "sha512-nnHUb8uP9G8islzcld/k6Bg5RhX62VpbAb/Anj7IXs/hp32Eb2LqFPZK4sy3pKkBUO5wcrlRWQa6wKOxqlUqsg==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/performance": "0.6.4",
-        "@firebase/performance-types": "0.2.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/performance-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/performance-types": {
-      "version": "0.2.0",
-      "resolved": "https://registry.npmjs.org/@firebase/performance-types/-/performance-types-0.2.0.tgz",
-      "integrity": "sha512-kYrbr8e/CYr1KLrLYZZt2noNnf+pRwDq2KK9Au9jHrBMnb0/C9X9yWSXmZkFt4UIdsQknBq8uBB7fsybZdOBTA=="
-    },
-    "node_modules/@firebase/performance/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/remote-config": {
-      "version": "0.4.4",
-      "resolved": "https://registry.npmjs.org/@firebase/remote-config/-/remote-config-0.4.4.tgz",
-      "integrity": "sha512-x1ioTHGX8ZwDSTOVp8PBLv2/wfwKzb4pxi0gFezS5GCJwbLlloUH4YYZHHS83IPxnua8b6l0IXUaWd0RgbWwzQ==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/installations": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
-      }
-    },
-    "node_modules/@firebase/remote-config-compat": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/@firebase/remote-config-compat/-/remote-config-compat-0.2.4.tgz",
-      "integrity": "sha512-FKiki53jZirrDFkBHglB3C07j5wBpitAaj8kLME6g8Mx+aq7u9P7qfmuSRytiOItADhWUj7O1JIv7n9q87SuwA==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/logger": "0.4.0",
-        "@firebase/remote-config": "0.4.4",
-        "@firebase/remote-config-types": "0.3.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/remote-config-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/remote-config-types": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/@firebase/remote-config-types/-/remote-config-types-0.3.0.tgz",
-      "integrity": "sha512-RtEH4vdcbXZuZWRZbIRmQVBNsE7VDQpet2qFvq6vwKLBIQRQR5Kh58M4ok3A3US8Sr3rubYnaGqZSurCwI8uMA=="
-    },
-    "node_modules/@firebase/remote-config/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/storage": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/@firebase/storage/-/storage-0.12.0.tgz",
-      "integrity": "sha512-SGs02Y/mmWBRsqZiYLpv4Sf7uZYZzMWVNN+aKiDqPsFBCzD6hLvGkXz+u98KAl8FqcjgB8BtSu01wm4pm76KHA==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0",
-        "undici": "5.26.5"
-      },
-      "peerDependencies": {
-        "@firebase/app": "0.x"
-      }
-    },
-    "node_modules/@firebase/storage-compat": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/@firebase/storage-compat/-/storage-compat-0.3.3.tgz",
-      "integrity": "sha512-WNtjYPhpOA1nKcRu5lIodX0wZtP8pI0VxDJnk6lr+av7QZNS1s6zvr+ERDTve+Qu4Hq/ZnNaf3kBEQR2ccXn6A==",
-      "dependencies": {
-        "@firebase/component": "0.6.4",
-        "@firebase/storage": "0.12.0",
-        "@firebase/storage-types": "0.8.0",
-        "@firebase/util": "1.9.3",
-        "tslib": "^2.1.0"
-      },
-      "peerDependencies": {
-        "@firebase/app-compat": "0.x"
-      }
-    },
-    "node_modules/@firebase/storage-compat/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/storage-types": {
-      "version": "0.8.0",
-      "resolved": "https://registry.npmjs.org/@firebase/storage-types/-/storage-types-0.8.0.tgz",
-      "integrity": "sha512-isRHcGrTs9kITJC0AVehHfpraWFui39MPaU7Eo8QfWlqW7YPymBmRgjDrlOgFdURh6Cdeg07zmkLP5tzTKRSpg==",
-      "peerDependencies": {
-        "@firebase/app-types": "0.x",
-        "@firebase/util": "1.x"
-      }
-    },
-    "node_modules/@firebase/storage/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/util": {
-      "version": "1.9.3",
-      "resolved": "https://registry.npmjs.org/@firebase/util/-/util-1.9.3.tgz",
-      "integrity": "sha512-DY02CRhOZwpzO36fHpuVysz6JZrscPiBXD0fXp6qSrL9oNOx5KWICKdR95C0lSITzxp0TZosVyHqzatE8JbcjA==",
-      "dependencies": {
-        "tslib": "^2.1.0"
-      }
-    },
-    "node_modules/@firebase/util/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@firebase/webchannel-wrapper": {
-      "version": "0.10.5",
-      "resolved": "https://registry.npmjs.org/@firebase/webchannel-wrapper/-/webchannel-wrapper-0.10.5.tgz",
-      "integrity": "sha512-eSkJsnhBWv5kCTSU1tSUVl9mpFu+5NXXunZc83le8GMjMlsWwQArSc7cJJ4yl+aDFY0NGLi0AjZWMn1axOrkRg=="
-    },
-    "node_modules/@grpc/grpc-js": {
-      "version": "1.9.12",
-      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.12.tgz",
-      "integrity": "sha512-Um5MBuge32TS3lAKX02PGCnFM4xPT996yLgZNb5H03pn6NyJ4Iwn5YcPq6Jj9yxGRk7WOgaZFtVRH5iTdYBeUg==",
-      "dependencies": {
-        "@grpc/proto-loader": "^0.7.8",
-        "@types/node": ">=12.12.47"
-      },
-      "engines": {
-        "node": "^8.13.0 || >=10.10.0"
-      }
-    },
-    "node_modules/@grpc/proto-loader": {
-      "version": "0.7.10",
-      "resolved": "https://registry.npmjs.org/@grpc/proto-loader/-/proto-loader-0.7.10.tgz",
-      "integrity": "sha512-CAqDfoaQ8ykFd9zqBDn4k6iWT9loLAlc2ETmDFS9JCD70gDcnA4L3AFEo2iV7KyAtAAHFW9ftq1Fz+Vsgq80RQ==",
-      "dependencies": {
-        "lodash.camelcase": "^4.3.0",
-        "long": "^5.0.0",
-        "protobufjs": "^7.2.4",
-        "yargs": "^17.7.2"
-      },
-      "bin": {
-        "proto-loader-gen-types": "build/bin/proto-loader-gen-types.js"
-      },
-      "engines": {
-        "node": ">=6"
-      }
-    },
-    "node_modules/@grpc/proto-loader/node_modules/cliui": {
-      "version": "8.0.1",
-      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
-      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
-      "dependencies": {
-        "string-width": "^4.2.0",
-        "strip-ansi": "^6.0.1",
-        "wrap-ansi": "^7.0.0"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@grpc/proto-loader/node_modules/yargs": {
-      "version": "17.7.2",
-      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
-      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
-      "dependencies": {
-        "cliui": "^8.0.1",
-        "escalade": "^3.1.1",
-        "get-caller-file": "^2.0.5",
-        "require-directory": "^2.1.1",
-        "string-width": "^4.2.3",
-        "y18n": "^5.0.5",
-        "yargs-parser": "^21.1.1"
-      },
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@grpc/proto-loader/node_modules/yargs-parser": {
-      "version": "21.1.1",
-      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
-      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@hapi/hoek": {
-      "version": "9.3.0",
-      "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz",
-      "integrity": "sha512-/c6rf4UJlmHlC9b5BaNvzAcFv7HZ2QHaV0D4/HNlBdvFnvQq8RI4kYdhyPCl7Xj+oWvTWQ8ujhqS53LIgAe6KQ==",
-      "dev": true
-    },
-    "node_modules/@hapi/topo": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/@hapi/topo/-/topo-5.1.0.tgz",
-      "integrity": "sha512-foQZKJig7Ob0BMAYBfcJk8d77QtOe7Wo4ox7ff1lQYoNNAb6jwcY1ncdoy2e9wQZzvNy7ODZCYJkK8kzmcAnAg==",
-      "dev": true,
-      "dependencies": {
-        "@hapi/hoek": "^9.0.0"
-      }
-    },
-    "node_modules/@hotwax/app-version-info": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@hotwax/app-version-info/-/app-version-info-1.0.0.tgz",
-      "integrity": "sha512-PnJTqTbFvvl9N23yi1DjL4aNmTkpYFrayyoJyfH1qDJXADFbQ9kB7gJmKcfiPpyYMGR86Yf3Is5ct0+wReUJGQ=="
-    },
-    "node_modules/@hotwax/apps-theme": {
-      "version": "1.2.6",
-      "resolved": "https://registry.npmjs.org/@hotwax/apps-theme/-/apps-theme-1.2.6.tgz",
-      "integrity": "sha512-zpUjGoY7LBlKeiP0V7tonrmoey8HQ5THQmyixQ+IDtrjmEJNBjynW/Ef3gC0FUNNPuVqxWPZdT5CVgaETLGTwg=="
-    },
-    "node_modules/@hotwax/dxp-components": {
-      "version": "1.12.1",
-      "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.12.1.tgz",
-      "integrity": "sha512-5soKaVBFd7klZnHBCi68j4CZwTlrBCzvPsyd+wHMbenezU+lOwMK0ftdWXrQcQPedeGdVtQXvvgSPWnLL310bg==",
-      "dependencies": {
-        "@hotwax/oms-api": "^1.8.1",
-        "@ionic/core": "^7.6.0",
-        "@ionic/vue": "^7.6.0",
-        "firebase": "^10.3.1",
-        "luxon": "^3.3.0",
-        "pinia": "2.0.36",
-        "pinia-plugin-persistedstate": "^3.1.0",
-        "register-service-worker": "^1.7.2",
-        "vue": "^3.3.4",
-        "vue-i18n": "^9.2.2"
-      }
-    },
-    "node_modules/@hotwax/dxp-components/node_modules/@ionic/core": {
-      "version": "7.7.4",
-      "resolved": "https://registry.npmjs.org/@ionic/core/-/core-7.7.4.tgz",
-      "integrity": "sha512-zThio3ZfbTu+3eM6QBdyeEk5OBc7M0ApFwSlP/G7rrFVcTPm12FNvG9VPD+aN5NwnYy0EsV3hlMkxbawoqjVLw==",
-      "dependencies": {
-        "@stencil/core": "^4.12.2",
-        "ionicons": "^7.2.2",
-        "tslib": "^2.1.0"
-      }
-    },
-    "node_modules/@hotwax/dxp-components/node_modules/@ionic/vue": {
-      "version": "7.7.4",
-      "resolved": "https://registry.npmjs.org/@ionic/vue/-/vue-7.7.4.tgz",
-      "integrity": "sha512-THrMMoQHU2Ym+JaTj/dm/FV8FyB7ZXmc6kierZ/+BSvOncIekla8Afe6Qk2c2U1afOPos0MBINf9xXkwxnHfIw==",
-      "dependencies": {
-        "@ionic/core": "7.7.4",
-        "ionicons": "^7.0.0"
-      }
-    },
-    "node_modules/@hotwax/dxp-components/node_modules/@stencil/core": {
-      "version": "4.12.5",
-      "resolved": "https://registry.npmjs.org/@stencil/core/-/core-4.12.5.tgz",
-      "integrity": "sha512-vSyFjY7XSEx0ufa9SebOd437CvnneaTXlCpuGDhjUDxAjGBlu6ie5qHyubobVGBth//aErc6wZPHc6W75Vp3iQ==",
-      "bin": {
-        "stencil": "bin/stencil"
-      },
-      "engines": {
-        "node": ">=16.0.0",
-        "npm": ">=7.10.0"
-      }
-    },
-    "node_modules/@hotwax/dxp-components/node_modules/ionicons": {
-      "version": "7.2.2",
-      "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-7.2.2.tgz",
-      "integrity": "sha512-I3iYIfc9Q9FRifWyFSwTAvbEABWlWY32i0sAVDDPGYnaIZVugkLCZFbEcrphW6ixVPg8tt1oLwalo/JJwbEqnA==",
-      "dependencies": {
-        "@stencil/core": "^4.0.3"
-      }
-    },
-    "node_modules/@hotwax/dxp-components/node_modules/luxon": {
-      "version": "3.4.4",
-      "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.4.4.tgz",
-      "integrity": "sha512-zobTr7akeGHnv7eBOXcRgMeCP6+uyYsczwmeRCauvpvaAltgNyTbLH/+VaEAPUeWBT+1GuNmz4wC/6jtQzbbVA==",
-      "engines": {
-        "node": ">=12"
-      }
-    },
-    "node_modules/@hotwax/dxp-components/node_modules/tslib": {
-      "version": "2.6.2",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
-      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
-    },
-    "node_modules/@hotwax/dxp-components/node_modules/vue-i18n": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.8.0.tgz",
-      "integrity": "sha512-Izho+6PYjejsTq2mzjcRdBZ5VLRQoSuuexvR8029h5CpN03FYqiqBrShMyf2I1DKkN6kw/xmujcbvC+4QybpsQ==",
-      "dependencies": {
-        "@intlify/core-base": "9.8.0",
-        "@intlify/shared": "9.8.0",
-        "@vue/devtools-api": "^6.5.0"
-      },
-      "engines": {
-        "node": ">= 16"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/kazupon"
-      },
-      "peerDependencies": {
-        "vue": "^3.0.0"
-      }
-    },
-    "node_modules/@hotwax/oms-api": {
-      "version": "1.11.0",
-      "resolved": "https://registry.npmjs.org/@hotwax/oms-api/-/oms-api-1.11.0.tgz",
-      "integrity": "sha512-HQCXuADMVkQXAS9ClWFrTYNjSFP8wQuGMILEkLDh9R2YR1gNnJ4GezeZuxXQOjhxBg7zXxbdL3v5/q03P32O5g==",
-      "dependencies": {
-        "@types/node-json-transform": "^1.0.0",
-        "axios": "^0.21.1",
-        "axios-cache-adapter": "^2.7.3",
-        "deepmerge": "^4.3.0",
-        "http-status-codes": "^2.2.0",
-        "node-json-transform": "^1.1.2",
-        "qs": "^6.11.0"
-      }
-    },
-    "node_modules/@humanwhocodes/config-array": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.5.0.tgz",
-      "integrity": "sha512-FagtKFz74XrTl7y6HCzQpwDfXP0yhxe9lHLD1UZxjvZIcbyRz8zTFF/yYNfSfzU414eDwZ1SrO0Qvtyf+wFMQg==",
-      "dev": true,
-      "dependencies": {
-        "@humanwhocodes/object-schema": "^1.2.0",
-        "debug": "^4.1.1",
-        "minimatch": "^3.0.4"
-      },
-      "engines": {
-        "node": ">=10.10.0"
-      }
-    },
-    "node_modules/@humanwhocodes/object-schema": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz",
-      "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
-      "dev": true
-    },
-    "node_modules/@intlify/bundle-utils": {
-      "version": "0.1.0",
-      "resolved": "https://registry.npmjs.org/@intlify/bundle-utils/-/bundle-utils-0.1.0.tgz",
-      "integrity": "sha512-v0aeQmjNWppSLpPcLh3E1JiQg8bQFY9uD4ZuZssGq2elXsqB3JDH0TZfhO8Y83x1Ejk0qxq5hv015mYS2qzfZQ==",
-      "dev": true,
-      "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",
-      "resolved": "https://registry.npmjs.org/@intlify/core/-/core-9.8.0.tgz",
-      "integrity": "sha512-xd+3cxvMuasZh3b+cxsB98ZAC2SPfbSTuK8q0nJg2NfOuAcj62FKBkFG72lsvGz5MzppTlOQuLkacrCvltA8sA==",
-      "dev": true,
-      "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",
-      "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.8.0.tgz",
-      "integrity": "sha512-UxaSZVZ1DwqC/CltUZrWZNaWNhfmKtfyV4BJSt/Zt4Or/fZs1iFj0B+OekYk1+MRHfIOe3+x00uXGQI4PbO/9g==",
-      "dependencies": {
-        "@intlify/message-compiler": "9.8.0",
-        "@intlify/shared": "9.8.0"
-      },
-      "engines": {
-        "node": ">= 16"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/kazupon"
-      }
-    },
-    "node_modules/@intlify/devtools-if": {
-      "version": "9.1.10",
-      "resolved": "https://registry.npmjs.org/@intlify/devtools-if/-/devtools-if-9.1.10.tgz",
-      "integrity": "sha512-SHaKoYu6sog3+Q8js1y3oXLywuogbH1sKuc7NSYkN3GElvXSBaMoCzW+we0ZSFqj/6c7vTNLg9nQ6rxhKqYwnQ==",
-      "dependencies": {
-        "@intlify/shared": "9.1.10"
-      },
-      "engines": {
-        "node": ">= 10"
+      "engines": {
+        "node": ">= 10"
       }
     },
     "node_modules/@intlify/devtools-if/node_modules/@intlify/shared": {
@@ -3009,11 +2224,12 @@
       }
     },
     "node_modules/@intlify/message-compiler": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.8.0.tgz",
-      "integrity": "sha512-McnYWhcoYmDJvssVu6QGR0shqlkJuL1HHdi5lK7fNqvQqRYaQ4lSLjYmZxwc8tRNMdIe9/KUKfyPxU9M6yCtNQ==",
+      "version": "9.11.0",
+      "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.11.0.tgz",
+      "integrity": "sha512-x31Gl7cscnoI4UUY1yaIy8e7vVMVW1VVlTXZz4SIHKqoSEUkfmgqK8NAx1e7RcoHEbICR7uyCbud0ZL1s4OGXQ==",
+      "dev": true,
       "dependencies": {
-        "@intlify/shared": "9.8.0",
+        "@intlify/shared": "9.11.0",
         "source-map-js": "^1.0.2"
       },
       "engines": {
@@ -3066,9 +2282,10 @@
       }
     },
     "node_modules/@intlify/shared": {
-      "version": "9.8.0",
-      "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.8.0.tgz",
-      "integrity": "sha512-TmgR0RCLjzrSo+W3wT0ALf9851iFMlVI9EYNGeWvZFUQTAJx0bvfsMlPdgVtV1tDNRiAfhkFsMKu6jtUY1ZLKQ==",
+      "version": "9.11.0",
+      "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.11.0.tgz",
+      "integrity": "sha512-KHSNgi7sRjmSm7aD8QH8WFt9VfKaekJuJ473opbJlkGY3EDnDUU8ikIhG8PbasQbgNvbY3m3tWNGqk2omIdwMA==",
+      "dev": true,
       "engines": {
         "node": ">= 16"
       },
@@ -3243,45 +2460,45 @@
       }
     },
     "node_modules/@jridgewell/gen-mapping": {
-      "version": "0.3.3",
-      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz",
-      "integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==",
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.5.tgz",
+      "integrity": "sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==",
       "dev": true,
       "dependencies": {
-        "@jridgewell/set-array": "^1.0.1",
+        "@jridgewell/set-array": "^1.2.1",
         "@jridgewell/sourcemap-codec": "^1.4.10",
-        "@jridgewell/trace-mapping": "^0.3.9"
+        "@jridgewell/trace-mapping": "^0.3.24"
       },
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/resolve-uri": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz",
-      "integrity": "sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
       "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/set-array": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz",
-      "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz",
+      "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==",
       "dev": true,
       "engines": {
         "node": ">=6.0.0"
       }
     },
     "node_modules/@jridgewell/source-map": {
-      "version": "0.3.5",
-      "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.5.tgz",
-      "integrity": "sha512-UTYAUj/wviwdsMfzoSJspJxbkH5o1snzwX0//0ENX1u/55kkZZkcTZP6u9bwKGkv+dkk9at4m1Cpt0uY80kcpQ==",
+      "version": "0.3.6",
+      "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.6.tgz",
+      "integrity": "sha512-1ZJTZebgqllO79ue2bm3rIGud/bOe0pP5BjSRCRxxYkEZS8STV7zN84UBbiYu7jy+eCKSnVIUgoWWE/tt+shMQ==",
       "dev": true,
       "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.0",
-        "@jridgewell/trace-mapping": "^0.3.9"
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.25"
       }
     },
     "node_modules/@jridgewell/sourcemap-codec": {
@@ -3290,9 +2507,9 @@
       "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
     },
     "node_modules/@jridgewell/trace-mapping": {
-      "version": "0.3.20",
-      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.20.tgz",
-      "integrity": "sha512-R8LcPeWZol2zR8mmH3JeKQ6QRCFb7XgUhV9ZlGhHLGyg4wpPiPZNQOOWhFZhxKw8u//yTbNGI42Bx/3paXEQ+Q==",
+      "version": "0.3.25",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.25.tgz",
+      "integrity": "sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==",
       "dev": true,
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.1.0",
@@ -3300,9 +2517,9 @@
       }
     },
     "node_modules/@leichtgewicht/ip-codec": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.4.tgz",
-      "integrity": "sha512-Hcv+nVC0kZnQ3tD9GVu5xSMR4VVYOteQIr/hwFPVEvPdlXqgGEuRjiheChHgdM+JyqdgNcmzZOX/tnl0JOiI7A==",
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz",
+      "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==",
       "dev": true
     },
     "node_modules/@node-ipc/js-queue": {
@@ -3369,65 +2586,11 @@
       }
     },
     "node_modules/@polka/url": {
-      "version": "1.0.0-next.24",
-      "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.24.tgz",
-      "integrity": "sha512-2LuNTFBIO0m7kKIQvvPHN6UE63VjpmL9rnEEaOOaiSPbZK+zUOYIzBAWcED+3XYzhYsd/0mD57VdxAEqqV52CQ==",
+      "version": "1.0.0-next.25",
+      "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.25.tgz",
+      "integrity": "sha512-j7P6Rgr3mmtdkeDGTe0E/aYyWEWVtc5yFXtHCRHs28/jptDEWfaVOc5T7cblqy1XKPPfCxJc/8DwQ5YgLOZOVQ==",
       "dev": true
     },
-    "node_modules/@protobufjs/aspromise": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@protobufjs/aspromise/-/aspromise-1.1.2.tgz",
-      "integrity": "sha512-j+gKExEuLmKwvz3OgROXtrJ2UG2x8Ch2YZUxahh+s1F2HZ+wAceUNLkvy6zKCPVRkU++ZWQrdxsUeQXmcg4uoQ=="
-    },
-    "node_modules/@protobufjs/base64": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@protobufjs/base64/-/base64-1.1.2.tgz",
-      "integrity": "sha512-AZkcAA5vnN/v4PDqKyMR5lx7hZttPDgClv83E//FMNhR2TMcLUhfRUBHCmSl0oi9zMgDDqRUJkSxO3wm85+XLg=="
-    },
-    "node_modules/@protobufjs/codegen": {
-      "version": "2.0.4",
-      "resolved": "https://registry.npmjs.org/@protobufjs/codegen/-/codegen-2.0.4.tgz",
-      "integrity": "sha512-YyFaikqM5sH0ziFZCN3xDC7zeGaB/d0IUb9CATugHWbd1FRFwWwt4ld4OYMPWu5a3Xe01mGAULCdqhMlPl29Jg=="
-    },
-    "node_modules/@protobufjs/eventemitter": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@protobufjs/eventemitter/-/eventemitter-1.1.0.tgz",
-      "integrity": "sha512-j9ednRT81vYJ9OfVuXG6ERSTdEL1xVsNgqpkxMsbIabzSo3goCjDIveeGv5d03om39ML71RdmrGNjG5SReBP/Q=="
-    },
-    "node_modules/@protobufjs/fetch": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@protobufjs/fetch/-/fetch-1.1.0.tgz",
-      "integrity": "sha512-lljVXpqXebpsijW71PZaCYeIcE5on1w5DlQy5WH6GLbFryLUrBD4932W/E2BSpfRJWseIL4v/KPgBFxDOIdKpQ==",
-      "dependencies": {
-        "@protobufjs/aspromise": "^1.1.1",
-        "@protobufjs/inquire": "^1.1.0"
-      }
-    },
-    "node_modules/@protobufjs/float": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@protobufjs/float/-/float-1.0.2.tgz",
-      "integrity": "sha512-Ddb+kVXlXst9d+R9PfTIxh1EdNkgoRe5tOX6t01f1lYWOvJnSPDBlG241QLzcyPdoNTsblLUdujGSE4RzrTZGQ=="
-    },
-    "node_modules/@protobufjs/inquire": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@protobufjs/inquire/-/inquire-1.1.0.tgz",
-      "integrity": "sha512-kdSefcPdruJiFMVSbn801t4vFK7KB/5gd2fYvrxhuJYg8ILrmn9SKSX2tZdV6V+ksulWqS7aXjBcRXl3wHoD9Q=="
-    },
-    "node_modules/@protobufjs/path": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/@protobufjs/path/-/path-1.1.2.tgz",
-      "integrity": "sha512-6JOcJ5Tm08dOHAbdR3GrvP+yUUfkjG5ePsHYczMFLq3ZmMkAD98cDgcT2iA1lJ9NVwFd4tH/iSSoe44YWkltEA=="
-    },
-    "node_modules/@protobufjs/pool": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@protobufjs/pool/-/pool-1.1.0.tgz",
-      "integrity": "sha512-0kELaGSIDBKvcgS4zkjz1PeddatrjYcmMWOlAuAPwAeccUrPHdUqo/J6LiymHHEiJT5NrF1UVwxY14f+fy4WQw=="
-    },
-    "node_modules/@protobufjs/utf8": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@protobufjs/utf8/-/utf8-1.1.0.tgz",
-      "integrity": "sha512-Vvn3zZrhQZkkBE8LSuW3em98c0FwgO4nxzv6OdSxPKJIEKY2bGbHn+mhGIPerzI4twdxaP8/0+06HBpwf345Lw=="
-    },
     "node_modules/@rollup/plugin-babel": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -3523,9 +2686,9 @@
       "dev": true
     },
     "node_modules/@sideway/address": {
-      "version": "4.1.4",
-      "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.4.tgz",
-      "integrity": "sha512-7vwq+rOHVWjyXxVlR76Agnvhy8I9rpzjosTESvmhNeXOXdZZB15Fl+TI9x1SiHZH5Jv2wTGduSxFDIaq0m3DUw==",
+      "version": "4.1.5",
+      "resolved": "https://registry.npmjs.org/@sideway/address/-/address-4.1.5.tgz",
+      "integrity": "sha512-IqO/DUQHUkPeixNQ8n0JA6102hT9CmaljNTPmQ1u8MEhBo/R4Q8eKLN/vGZxuebwOroDB4cbpjheD4+/sKFK4Q==",
       "dev": true,
       "dependencies": {
         "@hapi/hoek": "^9.0.0"
@@ -3715,9 +2878,9 @@
       }
     },
     "node_modules/@types/eslint": {
-      "version": "8.44.8",
-      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.44.8.tgz",
-      "integrity": "sha512-4K8GavROwhrYl2QXDXm0Rv9epkA8GBFu0EI+XrrnnuCl7u8CWBRusX7fXJfanhZTDWSAL24gDI/UqXyUM0Injw==",
+      "version": "8.56.7",
+      "resolved": "https://registry.npmjs.org/@types/eslint/-/eslint-8.56.7.tgz",
+      "integrity": "sha512-SjDvI/x3zsZnOkYZ3lCt9lOZWZLB2jIlNKz+LBgCtDurK0JZcwucxYHn1w2BJkD34dgX9Tjnak0txtq4WTggEA==",
       "dev": true,
       "dependencies": {
         "@types/estree": "*",
@@ -3753,9 +2916,9 @@
       }
     },
     "node_modules/@types/express-serve-static-core": {
-      "version": "4.17.41",
-      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.17.41.tgz",
-      "integrity": "sha512-OaJ7XLaelTgrvlZD8/aa0vvvxZdUmlCn6MtWeB7TkiKW70BQLc9XEPpDLPdbo52ZhXUCrznlWdCHWxJWtdyajA==",
+      "version": "4.19.0",
+      "resolved": "https://registry.npmjs.org/@types/express-serve-static-core/-/express-serve-static-core-4.19.0.tgz",
+      "integrity": "sha512-bGyep3JqPCRry1wq+O5n7oiBgGWmeIJXPjXXCo8EK0u8duZGSYar7cGqd3ML2JUsLGeB7fmc06KYo9fLGWqPvQ==",
       "dev": true,
       "dependencies": {
         "@types/node": "*",
@@ -3812,22 +2975,18 @@
     "node_modules/@types/node": {
       "version": "14.18.63",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.63.tgz",
-      "integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ=="
+      "integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ==",
+      "dev": true
     },
     "node_modules/@types/node-forge": {
-      "version": "1.3.10",
-      "resolved": "https://registry.npmjs.org/@types/node-forge/-/node-forge-1.3.10.tgz",
-      "integrity": "sha512-y6PJDYN4xYBxwd22l+OVH35N+1fCYWiuC3aiP2SlXVE6Lo7SS+rSx9r89hLxrP4pn6n1lBGhHJ12pj3F3Mpttw==",
+      "version": "1.3.11",
+      "resolved": "https://registry.npmjs.org/@types/node-forge/-/node-forge-1.3.11.tgz",
+      "integrity": "sha512-FQx220y22OKNTqaByeBGqHWYz4cl94tpcxeFdvBo3wjG6XPBuZ0BNgNZRV5J5TFmmcsJ4IzsLkmGRiQbnYsBEQ==",
       "dev": true,
       "dependencies": {
         "@types/node": "*"
       }
     },
-    "node_modules/@types/node-json-transform": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@types/node-json-transform/-/node-json-transform-1.0.2.tgz",
-      "integrity": "sha512-gOq49i42EmHRKPTTD4cXru3MAFoDADqzUxzAweKtZZBmLJuAK0GsJHNX4HKdvZ/JJHf+F4TYgnvb7Ge0NlQiGw=="
-    },
     "node_modules/@types/normalize-package-data": {
       "version": "2.4.4",
       "resolved": "https://registry.npmjs.org/@types/normalize-package-data/-/normalize-package-data-2.4.4.tgz",
@@ -3841,9 +3000,9 @@
       "dev": true
     },
     "node_modules/@types/qs": {
-      "version": "6.9.10",
-      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.10.tgz",
-      "integrity": "sha512-3Gnx08Ns1sEoCrWssEgTSJs/rsT2vhGP+Ja9cnnk9k4ALxinORlQneLXFeFKOTJMOeZUFD1s7w+w2AphTpvzZw==",
+      "version": "6.9.14",
+      "resolved": "https://registry.npmjs.org/@types/qs/-/qs-6.9.14.tgz",
+      "integrity": "sha512-5khscbd3SwWMhFqylJBLQ0zIu7c1K6Vz0uBIt915BI3zV0q1nfjRQD3RqSBcPaO6PHEF4ov/t9y89fSiyThlPA==",
       "dev": true
     },
     "node_modules/@types/range-parser": {
@@ -3887,14 +3046,14 @@
       }
     },
     "node_modules/@types/serve-static": {
-      "version": "1.15.5",
-      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.5.tgz",
-      "integrity": "sha512-PDRk21MnK70hja/YF8AHfC7yIsiQHn1rcXx7ijCFBX/k+XQJhQT/gw3xekXKJvx+5SXaMMS8oqQy09Mzvz2TuQ==",
+      "version": "1.15.7",
+      "resolved": "https://registry.npmjs.org/@types/serve-static/-/serve-static-1.15.7.tgz",
+      "integrity": "sha512-W8Ym+h8nhuRwaKPaDw34QUkwsGi6Rc4yYqvKFo5rm2FUEhCFbzVWrxXUxuKK8TASjWsysJY0nsmNCGhCOIsrOw==",
       "dev": true,
       "dependencies": {
         "@types/http-errors": "*",
-        "@types/mime": "*",
-        "@types/node": "*"
+        "@types/node": "*",
+        "@types/send": "*"
       }
     },
     "node_modules/@types/sinonjs__fake-timers": {
@@ -3995,9 +3154,9 @@
       }
     },
     "node_modules/@typescript-eslint/eslint-plugin/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -4138,9 +3297,9 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -4205,9 +3364,9 @@
       "integrity": "sha512-ons5CwXZ/51wrUPfoduC+cO7AS1/wRb0ybpQJ9RrssossDxVy4t49QxWoWgfBDvVKsz9VXzBk9z0wqTdZ+Cq8g=="
     },
     "node_modules/@ucast/js": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/@ucast/js/-/js-3.0.3.tgz",
-      "integrity": "sha512-jBBqt57T5WagkAjqfCIIE5UYVdaXYgGkOFYv2+kjq2AVpZ2RIbwCo/TujJpDlwTVluUI+WpnRpoGU2tSGlEvFQ==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@ucast/js/-/js-3.0.4.tgz",
+      "integrity": "sha512-TgG1aIaCMdcaEyckOZKQozn1hazE0w90SVdlpIJ/er8xVumE11gYAtSbw/LBeUnA4fFnFWTcw3t6reqseeH/4Q==",
       "dependencies": {
         "@ucast/core": "^1.0.0"
       }
@@ -4237,29 +3396,76 @@
       "dev": true
     },
     "node_modules/@vue/babel-helper-vue-transform-on": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.1.5.tgz",
-      "integrity": "sha512-SgUymFpMoAyWeYWLAY+MkCK3QEROsiUnfaw5zxOVD/M64KQs8D/4oK6Q5omVA2hnvEOE0SCkH2TZxs/jnnUj7w==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.2.2.tgz",
+      "integrity": "sha512-nOttamHUR3YzdEqdM/XXDyCSdxMA9VizUKoroLX6yTyRtggzQMHXcmwh8a7ZErcJttIBIc9s68a1B8GZ+Dmvsw==",
       "dev": true
     },
     "node_modules/@vue/babel-plugin-jsx": {
-      "version": "1.1.5",
-      "resolved": "https://registry.npmjs.org/@vue/babel-plugin-jsx/-/babel-plugin-jsx-1.1.5.tgz",
-      "integrity": "sha512-nKs1/Bg9U1n3qSWnsHhCVQtAzI6aQXqua8j/bZrau8ywT1ilXQbK4FwEJGmU8fV7tcpuFvWmmN7TMmV1OBma1g==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@vue/babel-plugin-jsx/-/babel-plugin-jsx-1.2.2.tgz",
+      "integrity": "sha512-nYTkZUVTu4nhP199UoORePsql0l+wj7v/oyQjtThUVhJl1U+6qHuoVhIvR3bf7eVKjbCK+Cs2AWd7mi9Mpz9rA==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-module-imports": "^7.22.5",
-        "@babel/plugin-syntax-jsx": "^7.22.5",
-        "@babel/template": "^7.22.5",
-        "@babel/traverse": "^7.22.5",
-        "@babel/types": "^7.22.5",
-        "@vue/babel-helper-vue-transform-on": "^1.1.5",
+        "@babel/helper-module-imports": "~7.22.15",
+        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/plugin-syntax-jsx": "^7.23.3",
+        "@babel/template": "^7.23.9",
+        "@babel/traverse": "^7.23.9",
+        "@babel/types": "^7.23.9",
+        "@vue/babel-helper-vue-transform-on": "1.2.2",
+        "@vue/babel-plugin-resolve-type": "1.2.2",
         "camelcase": "^6.3.0",
         "html-tags": "^3.3.1",
         "svg-tags": "^1.0.0"
       },
       "peerDependencies": {
         "@babel/core": "^7.0.0-0"
+      },
+      "peerDependenciesMeta": {
+        "@babel/core": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vue/babel-plugin-jsx/node_modules/@babel/helper-module-imports": {
+      "version": "7.22.15",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz",
+      "integrity": "sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==",
+      "dev": true,
+      "dependencies": {
+        "@babel/types": "^7.22.15"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@vue/babel-plugin-resolve-type": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/@vue/babel-plugin-resolve-type/-/babel-plugin-resolve-type-1.2.2.tgz",
+      "integrity": "sha512-EntyroPwNg5IPVdUJupqs0CFzuf6lUrVvCspmv2J1FITLeGnUCuoGNNk78dgCusxEiYj6RMkTJflGSxk5aIC4A==",
+      "dev": true,
+      "dependencies": {
+        "@babel/code-frame": "^7.23.5",
+        "@babel/helper-module-imports": "~7.22.15",
+        "@babel/helper-plugin-utils": "^7.22.5",
+        "@babel/parser": "^7.23.9",
+        "@vue/compiler-sfc": "^3.4.15"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0-0"
+      }
+    },
+    "node_modules/@vue/babel-plugin-resolve-type/node_modules/@babel/helper-module-imports": {
+      "version": "7.22.15",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.22.15.tgz",
+      "integrity": "sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==",
+      "dev": true,
+      "dependencies": {
+        "@babel/types": "^7.22.15"
+      },
+      "engines": {
+        "node": ">=6.9.0"
       }
     },
     "node_modules/@vue/babel-plugin-transform-vue-jsx": {
@@ -4338,9 +3544,9 @@
       }
     },
     "node_modules/@vue/babel-preset-app/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -4889,9 +4095,9 @@
       }
     },
     "node_modules/@vue/cli-shared-utils/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -4922,49 +4128,49 @@
       "dev": true
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.3.11.tgz",
-      "integrity": "sha512-h97/TGWBilnLuRaj58sxNrsUU66fwdRKLOLQ9N/5iNDfp+DZhYH9Obhe0bXxhedl8fjAgpRANpiZfbgWyruQ0w==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.4.21.tgz",
+      "integrity": "sha512-MjXawxZf2SbZszLPYxaFCjxfibYrzr3eYbKxwpLR9EQN+oaziSu3qKVbwBERj1IFIB8OLUewxB5m/BFzi613og==",
       "dependencies": {
-        "@babel/parser": "^7.23.5",
-        "@vue/shared": "3.3.11",
+        "@babel/parser": "^7.23.9",
+        "@vue/shared": "3.4.21",
+        "entities": "^4.5.0",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.0.2"
       }
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.3.11.tgz",
-      "integrity": "sha512-zoAiUIqSKqAJ81WhfPXYmFGwDRuO+loqLxvXmfUdR5fOitPoUiIeFI9cTTyv9MU5O1+ZZglJVTusWzy+wfk5hw==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.4.21.tgz",
+      "integrity": "sha512-IZC6FKowtT1sl0CR5DpXSiEB5ayw75oT2bma1BEhV7RRR1+cfwLrxc2Z8Zq/RGFzJ8w5r9QtCOvTjQgdn0IKmA==",
       "dependencies": {
-        "@vue/compiler-core": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/compiler-core": "3.4.21",
+        "@vue/shared": "3.4.21"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.3.11.tgz",
-      "integrity": "sha512-U4iqPlHO0KQeK1mrsxCN0vZzw43/lL8POxgpzcJweopmqtoYy9nljJzWDIQS3EfjiYhfdtdk9Gtgz7MRXnz3GA==",
-      "dependencies": {
-        "@babel/parser": "^7.23.5",
-        "@vue/compiler-core": "3.3.11",
-        "@vue/compiler-dom": "3.3.11",
-        "@vue/compiler-ssr": "3.3.11",
-        "@vue/reactivity-transform": "3.3.11",
-        "@vue/shared": "3.3.11",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.4.21.tgz",
+      "integrity": "sha512-me7epoTxYlY+2CUM7hy9PCDdpMPfIwrOvAXud2Upk10g4YLv9UBW7kL798TvMeDhPthkZ0CONNrK2GoeI1ODiQ==",
+      "dependencies": {
+        "@babel/parser": "^7.23.9",
+        "@vue/compiler-core": "3.4.21",
+        "@vue/compiler-dom": "3.4.21",
+        "@vue/compiler-ssr": "3.4.21",
+        "@vue/shared": "3.4.21",
         "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5",
-        "postcss": "^8.4.32",
+        "magic-string": "^0.30.7",
+        "postcss": "^8.4.35",
         "source-map-js": "^1.0.2"
       }
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.3.11.tgz",
-      "integrity": "sha512-Zd66ZwMvndxRTgVPdo+muV4Rv9n9DwQ4SSgWWKWkPFebHQfVYRrVjeygmmDmPewsHyznCNvJ2P2d6iOOhdv8Qg==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.4.21.tgz",
+      "integrity": "sha512-M5+9nI2lPpAsgXOGQobnIueVqc9sisBFexh5yMIMRAPYLa7+5wEJs8iqOZc1WAa9WQbx9GR2twgznU8LTIiZ4Q==",
       "dependencies": {
-        "@vue/compiler-dom": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/compiler-dom": "3.4.21",
+        "@vue/shared": "3.4.21"
       }
     },
     "node_modules/@vue/component-compiler-utils": {
@@ -5032,9 +4238,9 @@
       "dev": true
     },
     "node_modules/@vue/devtools-api": {
-      "version": "6.5.1",
-      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.5.1.tgz",
-      "integrity": "sha512-+KpckaAQyfbvshdDW5xQylLni1asvNSGme1JFs8I1+/H5pHEhqUKMEQD/qn3Nx5+/nycBq11qAEi8lk+LXI2dA=="
+      "version": "6.6.1",
+      "resolved": "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.1.tgz",
+      "integrity": "sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA=="
     },
     "node_modules/@vue/eslint-config-typescript": {
       "version": "9.1.0",
@@ -5055,78 +4261,57 @@
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.3.11.tgz",
-      "integrity": "sha512-D5tcw091f0nuu+hXq5XANofD0OXnBmaRqMYl5B3fCR+mX+cXJIGNw/VNawBqkjLNWETrFW0i+xH9NvDbTPVh7g==",
-      "dependencies": {
-        "@vue/shared": "3.3.11"
-      }
-    },
-    "node_modules/@vue/reactivity-transform": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity-transform/-/reactivity-transform-3.3.11.tgz",
-      "integrity": "sha512-fPGjH0wqJo68A0wQ1k158utDq/cRyZNlFoxGwNScE28aUFOKFEnCBsvyD8jHn+0kd0UKVpuGuaZEQ6r9FJRqCg==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.4.21.tgz",
+      "integrity": "sha512-UhenImdc0L0/4ahGCyEzc/pZNwVgcglGy9HVzJ1Bq2Mm9qXOpP8RyNTjookw/gOCUlXSEtuZ2fUg5nrHcoqJcw==",
       "dependencies": {
-        "@babel/parser": "^7.23.5",
-        "@vue/compiler-core": "3.3.11",
-        "@vue/shared": "3.3.11",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.30.5"
+        "@vue/shared": "3.4.21"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.3.11.tgz",
-      "integrity": "sha512-g9ztHGwEbS5RyWaOpXuyIVFTschclnwhqEbdy5AwGhYOgc7m/q3NFwr50MirZwTTzX55JY8pSkeib9BX04NIpw==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.4.21.tgz",
+      "integrity": "sha512-pQthsuYzE1XcGZznTKn73G0s14eCJcjaLvp3/DKeYWoFacD9glJoqlNBxt3W2c5S40t6CCcpPf+jG01N3ULyrA==",
       "dependencies": {
-        "@vue/reactivity": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/reactivity": "3.4.21",
+        "@vue/shared": "3.4.21"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.3.11.tgz",
-      "integrity": "sha512-OlhtV1PVpbgk+I2zl+Y5rQtDNcCDs12rsRg71XwaA2/Rbllw6mBLMi57VOn8G0AjOJ4Mdb4k56V37+g8ukShpQ==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.4.21.tgz",
+      "integrity": "sha512-gvf+C9cFpevsQxbkRBS1NpU8CqxKw0ebqMvLwcGQrNpx6gqRDodqKqA+A2VZZpQ9RpK2f9yfg8VbW/EpdFUOJw==",
       "dependencies": {
-        "@vue/runtime-core": "3.3.11",
-        "@vue/shared": "3.3.11",
-        "csstype": "^3.1.2"
+        "@vue/runtime-core": "3.4.21",
+        "@vue/shared": "3.4.21",
+        "csstype": "^3.1.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.3.11.tgz",
-      "integrity": "sha512-AIWk0VwwxCAm4wqtJyxBylRTXSy1wCLOKbWxHaHiu14wjsNYtiRCSgVuqEPVuDpErOlRdNnuRgipQfXRLjLN5A==",
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.4.21.tgz",
+      "integrity": "sha512-aV1gXyKSN6Rz+6kZ6kr5+Ll14YzmIbeuWe7ryJl5muJ4uwSwY/aStXTixx76TwkZFJLm1aAlA/HSWEJ4EyiMkg==",
       "dependencies": {
-        "@vue/compiler-ssr": "3.3.11",
-        "@vue/shared": "3.3.11"
+        "@vue/compiler-ssr": "3.4.21",
+        "@vue/shared": "3.4.21"
       },
       "peerDependencies": {
-        "vue": "3.3.11"
+        "vue": "3.4.21"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.3.11.tgz",
-      "integrity": "sha512-u2G8ZQ9IhMWTMXaWqZycnK4UthG1fA238CD+DP4Dm4WJi5hdUKKLg0RMRaRpDPNMdkTwIDkp7WtD0Rd9BH9fLw=="
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.4.21.tgz",
+      "integrity": "sha512-PuJe7vDIi6VYSinuEbUIQgMIRZGgM8e4R+G+/dQTk0X1NEdvgvvgv7m+rfmDH1gZzyA1OjjoWskvHlfRNfQf3g=="
     },
     "node_modules/@vue/test-utils": {
-      "version": "2.4.3",
-      "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.3.tgz",
-      "integrity": "sha512-F4K7mF+ad++VlTrxMJVRnenKSJmO6fkQt2wpRDiKDesQMkfpniGWsqEi/JevxGBo2qEkwwjvTUAoiGJLNx++CA==",
+      "version": "2.4.5",
+      "resolved": "https://registry.npmjs.org/@vue/test-utils/-/test-utils-2.4.5.tgz",
+      "integrity": "sha512-oo2u7vktOyKUked36R93NB7mg2B+N7Plr8lxp2JBGwr18ch6EggFjixSCdIVVLkT6Qr0z359Xvnafc9dcKyDUg==",
       "dev": true,
       "dependencies": {
         "js-beautify": "^1.14.9",
-        "vue-component-type-helpers": "^1.8.21"
-      },
-      "peerDependencies": {
-        "@vue/server-renderer": "^3.0.1",
-        "vue": "^3.0.1"
-      },
-      "peerDependenciesMeta": {
-        "@vue/server-renderer": {
-          "optional": true
-        }
+        "vue-component-type-helpers": "^2.0.0"
       }
     },
     "node_modules/@vue/vue-loader-v15": {
@@ -5197,9 +4382,9 @@
       "dev": true
     },
     "node_modules/@webassemblyjs/ast": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.6.tgz",
-      "integrity": "sha512-IN1xI7PwOvLPgjcf180gC1bqn3q/QaOCwYUahIOhbYUu8KA/3tw2RT/T0Gidi1l7Hhj5D/INhJxiICObqpMu4Q==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.12.1.tgz",
+      "integrity": "sha512-EKfMUOPRRUTy5UII4qJDGPpqfwjOmZ5jeGFwid9mnoqIFK+e0vqoi1qH56JpmZSzEL53jKnNzScdmftJyG5xWg==",
       "dev": true,
       "dependencies": {
         "@webassemblyjs/helper-numbers": "1.11.6",
@@ -5219,9 +4404,9 @@
       "dev": true
     },
     "node_modules/@webassemblyjs/helper-buffer": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-buffer/-/helper-buffer-1.11.6.tgz",
-      "integrity": "sha512-z3nFzdcp1mb8nEOFFk8DrYLpHvhKC3grJD2ardfKOzmbmJvEf/tPIqCY+sNcwZIY8ZD7IkB2l7/pqhUhqm7hLA==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-buffer/-/helper-buffer-1.12.1.tgz",
+      "integrity": "sha512-nzJwQw99DNDKr9BVCOZcLuJJUlqkJh+kVzVl6Fmq/tI5ZtEyWT1KZMyOXltXLZJmDtvLCDgwsyrkohEtopTXCw==",
       "dev": true
     },
     "node_modules/@webassemblyjs/helper-numbers": {
@@ -5242,15 +4427,15 @@
       "dev": true
     },
     "node_modules/@webassemblyjs/helper-wasm-section": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.11.6.tgz",
-      "integrity": "sha512-LPpZbSOwTpEC2cgn4hTydySy1Ke+XEu+ETXuoyvuyezHO3Kjdu90KK95Sh9xTbmjrCsUwvWwCOQQNta37VrS9g==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@webassemblyjs/helper-wasm-section/-/helper-wasm-section-1.12.1.tgz",
+      "integrity": "sha512-Jif4vfB6FJlUlSbgEMHUyk1j234GTNG9dBJ4XJdOySoj518Xj0oGsNi59cUQF4RRMS9ouBUxDDdyBVfPTypa5g==",
       "dev": true,
       "dependencies": {
-        "@webassemblyjs/ast": "1.11.6",
-        "@webassemblyjs/helper-buffer": "1.11.6",
+        "@webassemblyjs/ast": "1.12.1",
+        "@webassemblyjs/helper-buffer": "1.12.1",
         "@webassemblyjs/helper-wasm-bytecode": "1.11.6",
-        "@webassemblyjs/wasm-gen": "1.11.6"
+        "@webassemblyjs/wasm-gen": "1.12.1"
       }
     },
     "node_modules/@webassemblyjs/ieee754": {
@@ -5278,28 +4463,28 @@
       "dev": true
     },
     "node_modules/@webassemblyjs/wasm-edit": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-edit/-/wasm-edit-1.11.6.tgz",
-      "integrity": "sha512-Ybn2I6fnfIGuCR+Faaz7YcvtBKxvoLV3Lebn1tM4o/IAJzmi9AWYIPWpyBfU8cC+JxAO57bk4+zdsTjJR+VTOw==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-edit/-/wasm-edit-1.12.1.tgz",
+      "integrity": "sha512-1DuwbVvADvS5mGnXbE+c9NfA8QRcZ6iKquqjjmR10k6o+zzsRVesil54DKexiowcFCPdr/Q0qaMgB01+SQ1u6g==",
       "dev": true,
       "dependencies": {
-        "@webassemblyjs/ast": "1.11.6",
-        "@webassemblyjs/helper-buffer": "1.11.6",
+        "@webassemblyjs/ast": "1.12.1",
+        "@webassemblyjs/helper-buffer": "1.12.1",
         "@webassemblyjs/helper-wasm-bytecode": "1.11.6",
-        "@webassemblyjs/helper-wasm-section": "1.11.6",
-        "@webassemblyjs/wasm-gen": "1.11.6",
-        "@webassemblyjs/wasm-opt": "1.11.6",
-        "@webassemblyjs/wasm-parser": "1.11.6",
-        "@webassemblyjs/wast-printer": "1.11.6"
+        "@webassemblyjs/helper-wasm-section": "1.12.1",
+        "@webassemblyjs/wasm-gen": "1.12.1",
+        "@webassemblyjs/wasm-opt": "1.12.1",
+        "@webassemblyjs/wasm-parser": "1.12.1",
+        "@webassemblyjs/wast-printer": "1.12.1"
       }
     },
     "node_modules/@webassemblyjs/wasm-gen": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-gen/-/wasm-gen-1.11.6.tgz",
-      "integrity": "sha512-3XOqkZP/y6B4F0PBAXvI1/bky7GryoogUtfwExeP/v7Nzwo1QLcq5oQmpKlftZLbT+ERUOAZVQjuNVak6UXjPA==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-gen/-/wasm-gen-1.12.1.tgz",
+      "integrity": "sha512-TDq4Ojh9fcohAw6OIMXqiIcTq5KUXTGRkVxbSo1hQnSy6lAM5GSdfwWeSxpAo0YzgsgF182E/U0mDNhuA0tW7w==",
       "dev": true,
       "dependencies": {
-        "@webassemblyjs/ast": "1.11.6",
+        "@webassemblyjs/ast": "1.12.1",
         "@webassemblyjs/helper-wasm-bytecode": "1.11.6",
         "@webassemblyjs/ieee754": "1.11.6",
         "@webassemblyjs/leb128": "1.11.6",
@@ -5307,24 +4492,24 @@
       }
     },
     "node_modules/@webassemblyjs/wasm-opt": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-opt/-/wasm-opt-1.11.6.tgz",
-      "integrity": "sha512-cOrKuLRE7PCe6AsOVl7WasYf3wbSo4CeOk6PkrjS7g57MFfVUF9u6ysQBBODX0LdgSvQqRiGz3CXvIDKcPNy4g==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-opt/-/wasm-opt-1.12.1.tgz",
+      "integrity": "sha512-Jg99j/2gG2iaz3hijw857AVYekZe2SAskcqlWIZXjji5WStnOpVoat3gQfT/Q5tb2djnCjBtMocY/Su1GfxPBg==",
       "dev": true,
       "dependencies": {
-        "@webassemblyjs/ast": "1.11.6",
-        "@webassemblyjs/helper-buffer": "1.11.6",
-        "@webassemblyjs/wasm-gen": "1.11.6",
-        "@webassemblyjs/wasm-parser": "1.11.6"
+        "@webassemblyjs/ast": "1.12.1",
+        "@webassemblyjs/helper-buffer": "1.12.1",
+        "@webassemblyjs/wasm-gen": "1.12.1",
+        "@webassemblyjs/wasm-parser": "1.12.1"
       }
     },
     "node_modules/@webassemblyjs/wasm-parser": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-parser/-/wasm-parser-1.11.6.tgz",
-      "integrity": "sha512-6ZwPeGzMJM3Dqp3hCsLgESxBGtT/OeCvCZ4TA1JUPYgmhAx38tTPR9JaKy0S5H3evQpO/h2uWs2j6Yc/fjkpTQ==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@webassemblyjs/wasm-parser/-/wasm-parser-1.12.1.tgz",
+      "integrity": "sha512-xikIi7c2FHXysxXe3COrVUPSheuBtpcfhbpFj4gmu7KRLYOzANztwUU0IbsqvMqzuNK2+glRGWCEqZo1WCLyAQ==",
       "dev": true,
       "dependencies": {
-        "@webassemblyjs/ast": "1.11.6",
+        "@webassemblyjs/ast": "1.12.1",
         "@webassemblyjs/helper-api-error": "1.11.6",
         "@webassemblyjs/helper-wasm-bytecode": "1.11.6",
         "@webassemblyjs/ieee754": "1.11.6",
@@ -5333,12 +4518,12 @@
       }
     },
     "node_modules/@webassemblyjs/wast-printer": {
-      "version": "1.11.6",
-      "resolved": "https://registry.npmjs.org/@webassemblyjs/wast-printer/-/wast-printer-1.11.6.tgz",
-      "integrity": "sha512-JM7AhRcE+yW2GWYaKeHL5vt4xqee5N2WcezptmgyhNS+ScggqcT1OtXykhAb13Sn5Yas0j2uv9tHgrjwvzAP4A==",
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@webassemblyjs/wast-printer/-/wast-printer-1.12.1.tgz",
+      "integrity": "sha512-+X4WAlOisVWQMikjbcvY2e0rwPsKQ9F688lksZhBcPycBBuii3O7m8FACbDMWDojpAqvjIncrG8J0XHKyQfVeA==",
       "dev": true,
       "dependencies": {
-        "@webassemblyjs/ast": "1.11.6",
+        "@webassemblyjs/ast": "1.12.1",
         "@xtuc/long": "4.2.2"
       }
     },
@@ -5386,9 +4571,9 @@
       }
     },
     "node_modules/acorn": {
-      "version": "8.11.2",
-      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.2.tgz",
-      "integrity": "sha512-nc0Axzp/0FILLEVsm4fNwLCwMttvhEI263QtVPQcbpfZZ3ts0hLsZGOpE6czNlid7CJ9MlyH8reXkpsf3YUY4w==",
+      "version": "8.11.3",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
+      "integrity": "sha512-Y9rRfJG5jcKOE0CLisYbojUjIrIEE7AGMzA/Sm4BslANhbS+cDMpgBdcPT91oJ7OuJ9hYJBx59RjbhxVnrF8Xg==",
       "dev": true,
       "bin": {
         "acorn": "bin/acorn"
@@ -5416,9 +4601,9 @@
       }
     },
     "node_modules/acorn-walk": {
-      "version": "8.3.1",
-      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.1.tgz",
-      "integrity": "sha512-TgUZgYvqZprrl7YldZNoa9OciCAyZR+Ejm9eXzKCmjsF5IKp/wgQ7Z/ZpjpGTIUPwrHQIcYeI8qDh4PsEwxMbw==",
+      "version": "8.3.2",
+      "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.2.tgz",
+      "integrity": "sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==",
       "dev": true,
       "engines": {
         "node": ">=0.4.0"
@@ -5544,6 +4729,7 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
       "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -5609,22 +4795,25 @@
       }
     },
     "node_modules/array-buffer-byte-length": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.0.tgz",
-      "integrity": "sha512-LPuwb2P+NrQw3XhxGc36+XSvuBPopovXYTR9Ew++Du9Yb/bx5AzBfrIsBoj0EZUifjQU+sHL21sseZ3jerWO/A==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz",
+      "integrity": "sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "is-array-buffer": "^3.0.1"
+        "call-bind": "^1.0.5",
+        "is-array-buffer": "^3.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/array-flatten": {
-      "version": "2.1.2",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-2.1.2.tgz",
-      "integrity": "sha512-hNfzcOV8W4NdualtqBFPyVO+54DSJuZGY9qT4pRroB6S9e3iiido2ISIC5h9R2sPJ8H3FHCIiEnsv1lPXO3KtQ==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
+      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==",
       "dev": true
     },
     "node_modules/array-union": {
@@ -5637,17 +4826,18 @@
       }
     },
     "node_modules/arraybuffer.prototype.slice": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.2.tgz",
-      "integrity": "sha512-yMBKppFur/fbHu9/6USUe03bZ4knMYiwFBcyiaXB8Go0qNehwX6inYPzK9U0NeQvGxKthcmHcaR8P5MStSRBAw==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz",
+      "integrity": "sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==",
       "dev": true,
       "dependencies": {
-        "array-buffer-byte-length": "^1.0.0",
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1",
-        "is-array-buffer": "^3.0.2",
+        "array-buffer-byte-length": "^1.0.1",
+        "call-bind": "^1.0.5",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.22.3",
+        "es-errors": "^1.2.1",
+        "get-intrinsic": "^1.2.3",
+        "is-array-buffer": "^3.0.4",
         "is-shared-array-buffer": "^1.0.2"
       },
       "engines": {
@@ -5706,9 +4896,9 @@
       }
     },
     "node_modules/autoprefixer": {
-      "version": "10.4.16",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.16.tgz",
-      "integrity": "sha512-7vd3UC6xKp0HLfua5IjZlcXvGAGy7cBAXTg2lyQ/8WpNhd6SiZ8Be+xm3FyBSYJx5GKcpRCzBh7RH4/0dnY+uQ==",
+      "version": "10.4.19",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.19.tgz",
+      "integrity": "sha512-BaENR2+zBZ8xXhM4pUaKUxlVdxZ0EZhjvbopwnXmxRUfqDmwSpC2lAi/QXvx7NRdPCo1WKEcEF6mV64si1z4Ew==",
       "dev": true,
       "funding": [
         {
@@ -5725,9 +4915,9 @@
         }
       ],
       "dependencies": {
-        "browserslist": "^4.21.10",
-        "caniuse-lite": "^1.0.30001538",
-        "fraction.js": "^4.3.6",
+        "browserslist": "^4.23.0",
+        "caniuse-lite": "^1.0.30001599",
+        "fraction.js": "^4.3.7",
         "normalize-range": "^0.1.2",
         "picocolors": "^1.0.0",
         "postcss-value-parser": "^4.2.0"
@@ -5743,10 +4933,13 @@
       }
     },
     "node_modules/available-typed-arrays": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.5.tgz",
-      "integrity": "sha512-DMD0KiN46eipeziST1LPP/STfDU0sufISXmjSgvVsoU2tqxctQeASejWcfNtxYKqETM1UxQ8sp2OrSBWpHY6sw==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
+      "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==",
       "dev": true,
+      "dependencies": {
+        "possible-typed-array-names": "^1.0.0"
+      },
       "engines": {
         "node": ">= 0.4"
       },
@@ -5818,13 +5011,13 @@
       }
     },
     "node_modules/babel-plugin-polyfill-corejs2": {
-      "version": "0.4.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.6.tgz",
-      "integrity": "sha512-jhHiWVZIlnPbEUKSSNb9YoWcQGdlTLq7z1GHL4AjFxaoOUMuuEVJ+Y4pAaQUGOGk93YsVCKPbqbfw3m0SM6H8Q==",
+      "version": "0.4.10",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs2/-/babel-plugin-polyfill-corejs2-0.4.10.tgz",
+      "integrity": "sha512-rpIuu//y5OX6jVU+a5BCn1R5RSZYWAl2Nar76iwaOdycqb6JPxediskWFMMl7stfwNJR4b7eiQvh5fB5TEQJTQ==",
       "dev": true,
       "dependencies": {
         "@babel/compat-data": "^7.22.6",
-        "@babel/helper-define-polyfill-provider": "^0.4.3",
+        "@babel/helper-define-polyfill-provider": "^0.6.1",
         "semver": "^6.3.1"
       },
       "peerDependencies": {
@@ -5841,25 +5034,25 @@
       }
     },
     "node_modules/babel-plugin-polyfill-corejs3": {
-      "version": "0.8.6",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.8.6.tgz",
-      "integrity": "sha512-leDIc4l4tUgU7str5BWLS2h8q2N4Nf6lGZP6UrNDxdtfF2g69eJ5L0H7S8A5Ln/arfFAfHor5InAdZuIOwZdgQ==",
+      "version": "0.10.4",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-corejs3/-/babel-plugin-polyfill-corejs3-0.10.4.tgz",
+      "integrity": "sha512-25J6I8NGfa5YkCDogHRID3fVCadIR8/pGl1/spvCkzb6lVn6SR3ojpx9nOn9iEBcUsjY24AmdKm5khcfKdylcg==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.4.3",
-        "core-js-compat": "^3.33.1"
+        "@babel/helper-define-polyfill-provider": "^0.6.1",
+        "core-js-compat": "^3.36.1"
       },
       "peerDependencies": {
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
       }
     },
     "node_modules/babel-plugin-polyfill-regenerator": {
-      "version": "0.5.3",
-      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.5.3.tgz",
-      "integrity": "sha512-8sHeDOmXC8csczMrYEOf0UTNa4yE2SxV5JGeT/LP1n0OYVDUUFPxG9vdk2AlDlIit4t+Kf0xCtpgXPBwnn/9pw==",
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/babel-plugin-polyfill-regenerator/-/babel-plugin-polyfill-regenerator-0.6.1.tgz",
+      "integrity": "sha512-JfTApdE++cgcTWjsiCQlLyFBMbTUft9ja17saCc93lgV33h4tuCVj7tlvu//qpLwaG+3yEz7/KhahGrUMkVq9g==",
       "dev": true,
       "dependencies": {
-        "@babel/helper-define-polyfill-provider": "^0.4.3"
+        "@babel/helper-define-polyfill-provider": "^0.6.1"
       },
       "peerDependencies": {
         "@babel/core": "^7.4.0 || ^8.0.0-0 <8.0.0"
@@ -5916,12 +5109,15 @@
       }
     },
     "node_modules/binary-extensions": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
-      "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
+      "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
       "dev": true,
       "engines": {
         "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/bl": {
@@ -5948,13 +5144,13 @@
       "dev": true
     },
     "node_modules/body-parser": {
-      "version": "1.20.1",
-      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.1.tgz",
-      "integrity": "sha512-jWi7abTbYwajOytWCQc37VulmWiRae5RyTpaCyDcS5/lMdtwSz5lOpDE67srw/HYe35f1z3fDQw+3txg7gNtWw==",
+      "version": "1.20.2",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-1.20.2.tgz",
+      "integrity": "sha512-ml9pReCu3M61kGlqoTm2umSXTlRTuGTx0bfYj+uIUKKYycG5NtSbeetV3faSU6R7ajOPw0g/J1PvK4qNy7s5bA==",
       "dev": true,
       "dependencies": {
         "bytes": "3.1.2",
-        "content-type": "~1.0.4",
+        "content-type": "~1.0.5",
         "debug": "2.6.9",
         "depd": "2.0.0",
         "destroy": "1.2.0",
@@ -5962,7 +5158,7 @@
         "iconv-lite": "0.4.24",
         "on-finished": "2.4.1",
         "qs": "6.11.0",
-        "raw-body": "2.5.1",
+        "raw-body": "2.5.2",
         "type-is": "~1.6.18",
         "unpipe": "1.0.0"
       },
@@ -6011,13 +5207,11 @@
       }
     },
     "node_modules/bonjour-service": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.1.1.tgz",
-      "integrity": "sha512-Z/5lQRMOG9k7W+FkeGTNjh7htqn/2LMnfOvBZ8pynNZCM9MwkQkI3zeI4oz09uWdcgmgHugVvBqxGg4VQJ5PCg==",
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/bonjour-service/-/bonjour-service-1.2.1.tgz",
+      "integrity": "sha512-oSzCS2zV14bh2kji6vNe7vrpJYCHGvcZnlffFQ1MEoX/WOeQ/teD8SYWKR942OI3INjq8OMNJlbPK5LLLUxFDw==",
       "dev": true,
       "dependencies": {
-        "array-flatten": "^2.1.2",
-        "dns-equal": "^1.0.0",
         "fast-deep-equal": "^3.1.3",
         "multicast-dns": "^7.2.5"
       }
@@ -6061,9 +5255,9 @@
       }
     },
     "node_modules/browserslist": {
-      "version": "4.22.2",
-      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.2.tgz",
-      "integrity": "sha512-0UgcrvQmBDvZHFGdYUehrCNIazki7/lUP3kkoi/r3YB2amZbFM9J43ZRkJTXBUZK4gmx56+Sqk9+Vs9mwZx9+A==",
+      "version": "4.23.0",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.23.0.tgz",
+      "integrity": "sha512-QW8HiM1shhT2GuzkvklfjcKDiWFXHOeFCIA/huJPwHsslwcydgk7X+z2zXpEijP98UCY7HbubZt5J2Zgvf0CaQ==",
       "dev": true,
       "funding": [
         {
@@ -6080,8 +5274,8 @@
         }
       ],
       "dependencies": {
-        "caniuse-lite": "^1.0.30001565",
-        "electron-to-chromium": "^1.4.601",
+        "caniuse-lite": "^1.0.30001587",
+        "electron-to-chromium": "^1.4.668",
         "node-releases": "^2.0.14",
         "update-browserslist-db": "^1.0.13"
       },
@@ -6167,13 +5361,18 @@
       }
     },
     "node_modules/call-bind": {
-      "version": "1.0.5",
-      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.5.tgz",
-      "integrity": "sha512-C3nQxfFZxFRVoJoGKKI8y3MOEo129NQ+FgQ08iye+Mk4zNZZGdjfs06bVTr+DBSlA66Q2VEcMki/cUCP4SercQ==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz",
+      "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==",
       "dependencies": {
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
         "function-bind": "^1.1.2",
-        "get-intrinsic": "^1.2.1",
-        "set-function-length": "^1.1.1"
+        "get-intrinsic": "^1.2.4",
+        "set-function-length": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -6229,9 +5428,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001566",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001566.tgz",
-      "integrity": "sha512-ggIhCsTxmITBAMmK8yZjEhCO5/47jKXPu6Dha/wuCS4JePVL+3uiDEBuhu2aIoT+bqTOR8L76Ip1ARL9xYsEJA==",
+      "version": "1.0.30001606",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001606.tgz",
+      "integrity": "sha512-LPbwnW4vfpJId225pwjZJOgX1m9sGfbw/RKJvw/t0QhYOOaTXHvkjVGFGPpvwEzufrjvTlsULnVTxdy4/6cqkg==",
       "dev": true,
       "funding": [
         {
@@ -6301,16 +5500,10 @@
       }
     },
     "node_modules/chokidar": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
-      "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
+      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
       "dev": true,
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://paulmillr.com/funding/"
-        }
-      ],
       "dependencies": {
         "anymatch": "~3.1.2",
         "braces": "~3.0.2",
@@ -6323,6 +5516,9 @@
       "engines": {
         "node": ">= 8.10.0"
       },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      },
       "optionalDependencies": {
         "fsevents": "~2.3.2"
       }
@@ -6497,9 +5693,9 @@
       }
     },
     "node_modules/cli-table3": {
-      "version": "0.6.3",
-      "resolved": "https://registry.npmjs.org/cli-table3/-/cli-table3-0.6.3.tgz",
-      "integrity": "sha512-w5Jac5SykAeZJKntOxJCrm63Eg5/4dhMWIcuTbo9rpE+brgaSZo0RuNJZeOyMgsUdhDeojvgyQLmjI+K50ZGyg==",
+      "version": "0.6.4",
+      "resolved": "https://registry.npmjs.org/cli-table3/-/cli-table3-0.6.4.tgz",
+      "integrity": "sha512-Lm3L0p+/npIQWNIiyF/nAn7T5dnOwR3xNTHXYEBFBFVPXzCVNZ5lqEC/1eo/EVfpDsQ1I+TX4ORPQgp+UI0CRw==",
       "dev": true,
       "dependencies": {
         "string-width": "^4.2.0"
@@ -6795,9 +5991,9 @@
       "dev": true
     },
     "node_modules/cookie": {
-      "version": "0.5.0",
-      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.5.0.tgz",
-      "integrity": "sha512-YZ3GUyn/o8gfKJlnlX7g7xq4gyO6OSuhGPKaaGssGB2qgDUS0gPgtTvoyZLTt9Ab6dC4hfc9dV5arkvc/OCmrw==",
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.6.0.tgz",
+      "integrity": "sha512-U71cyTamuh1CRNCfpGY6to28lxvNwPG4Guz/EVjgf3Jmzv0vlDp1atT9eS5dDjMYHucpHbWns6Lwf3BKz6svdw==",
       "dev": true,
       "engines": {
         "node": ">= 0.6"
@@ -6852,9 +6048,9 @@
       }
     },
     "node_modules/core-js": {
-      "version": "3.34.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.34.0.tgz",
-      "integrity": "sha512-aDdvlDder8QmY91H88GzNi9EtQi2TjvQhpCX6B1v/dAZHU1AuLgHvRh54RiOerpEhEW46Tkf+vgAViB/CWC0ag==",
+      "version": "3.36.1",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.36.1.tgz",
+      "integrity": "sha512-BTvUrwxVBezj5SZ3f10ImnX2oRByMxql3EimVqMysepbC9EeMUOpLwdy6Eoili2x6E4kf+ZUB5k/+Jv55alPfA==",
       "hasInstallScript": true,
       "funding": {
         "type": "opencollective",
@@ -6862,12 +6058,12 @@
       }
     },
     "node_modules/core-js-compat": {
-      "version": "3.34.0",
-      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.34.0.tgz",
-      "integrity": "sha512-4ZIyeNbW/Cn1wkMMDy+mvrRUxrwFNjKwbhCfQpDd+eLgYipDqp8oGFGtLmhh18EDPKA0g3VUBYOxQGGwvWLVpA==",
+      "version": "3.36.1",
+      "resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.36.1.tgz",
+      "integrity": "sha512-Dk997v9ZCt3X/npqzyGdTlq6t7lDBhZwGvV94PKzDArjp7BTRm7WlDAXYd/OWdeFHO8OChQYRJNJvUCqCbrtKA==",
       "dev": true,
       "dependencies": {
-        "browserslist": "^4.22.2"
+        "browserslist": "^4.23.0"
       },
       "funding": {
         "type": "opencollective",
@@ -6955,19 +6151,19 @@
       }
     },
     "node_modules/css-loader": {
-      "version": "6.8.1",
-      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.8.1.tgz",
-      "integrity": "sha512-xDAXtEVGlD0gJ07iclwWVkLoZOpEvAWaSyf6W18S2pOC//K8+qUDIx8IIT3D+HjnmkJPQeesOPv5aiUaJsCM2g==",
+      "version": "6.11.0",
+      "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-6.11.0.tgz",
+      "integrity": "sha512-CTJ+AEQJjq5NzLga5pE39qdiSV56F8ywCIsqNIRF0r7BDgWsN25aazToqAFg7ZrtA/U016xudB3ffgweORxX7g==",
       "dev": true,
       "dependencies": {
         "icss-utils": "^5.1.0",
-        "postcss": "^8.4.21",
-        "postcss-modules-extract-imports": "^3.0.0",
-        "postcss-modules-local-by-default": "^4.0.3",
-        "postcss-modules-scope": "^3.0.0",
+        "postcss": "^8.4.33",
+        "postcss-modules-extract-imports": "^3.1.0",
+        "postcss-modules-local-by-default": "^4.0.5",
+        "postcss-modules-scope": "^3.2.0",
         "postcss-modules-values": "^4.0.0",
         "postcss-value-parser": "^4.2.0",
-        "semver": "^7.3.8"
+        "semver": "^7.5.4"
       },
       "engines": {
         "node": ">= 12.13.0"
@@ -6977,7 +6173,16 @@
         "url": "https://opencollective.com/webpack"
       },
       "peerDependencies": {
+        "@rspack/core": "0.x || 1.x",
         "webpack": "^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@rspack/core": {
+          "optional": true
+        },
+        "webpack": {
+          "optional": true
+        }
       }
     },
     "node_modules/css-loader/node_modules/lru-cache": {
@@ -6993,9 +6198,9 @@
       }
     },
     "node_modules/css-loader/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -7511,6 +6716,57 @@
         "node": ">=0.10"
       }
     },
+    "node_modules/data-view-buffer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.1.tgz",
+      "integrity": "sha512-0lht7OugA5x3iJLOWFhWK/5ehONdprk0ISXqVFn/NFrDu+cuc8iADFrGQz5BnRK7LLU3JmkbXSxaqX+/mXYtUA==",
+      "dev": true,
+      "dependencies": {
+        "call-bind": "^1.0.6",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/data-view-byte-length": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.1.tgz",
+      "integrity": "sha512-4J7wRJD3ABAzr8wP+OcIcqq2dlUKp4DVflx++hs5h5ZKydWMI6/D/fAot+yh6g2tHh8fLFTvNOaVN357NvSrOQ==",
+      "dev": true,
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/data-view-byte-offset": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.0.tgz",
+      "integrity": "sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==",
+      "dev": true,
+      "dependencies": {
+        "call-bind": "^1.0.6",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/dayjs": {
       "version": "1.11.10",
       "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
@@ -7656,16 +6912,19 @@
       }
     },
     "node_modules/define-data-property": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.1.tgz",
-      "integrity": "sha512-E7uGkTzkk1d0ByLeSc6ZsFS79Axg+m1P/VsgYsxHgiuc3tFSj+MjMIwe90FC4lOAZzNBdY7kkO2P2wKdsQ1vgQ==",
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
+      "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
       "dependencies": {
-        "get-intrinsic": "^1.2.1",
-        "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0"
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.0.1"
       },
       "engines": {
         "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/define-lazy-prop": {
@@ -7740,12 +6999,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/dns-equal": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/dns-equal/-/dns-equal-1.0.0.tgz",
-      "integrity": "sha512-z+paD6YUQsk+AbGCEM4PrOXSss5gd66QfcVBFTKR/HpFL9jCqikS94HYwKww6fQyO7IxrIIyUu+g0Ka9tUS2Cg==",
-      "dev": true
-    },
     "node_modules/dns-packet": {
       "version": "5.6.1",
       "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-5.6.1.tgz",
@@ -7793,6 +7046,15 @@
         "url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
       }
     },
+    "node_modules/dom-serializer/node_modules/entities": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
+      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
+      "dev": true,
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/domelementtype": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
@@ -7979,9 +7241,9 @@
       }
     },
     "node_modules/editorconfig/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -8021,15 +7283,16 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.4.608",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.608.tgz",
-      "integrity": "sha512-J2f/3iIIm3Mo0npneITZ2UPe4B1bg8fTNrFjD8715F/k1BvbviRuqYGkET1PgprrczXYTHFvotbBOmUp6KE0uA==",
+      "version": "1.4.728",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.728.tgz",
+      "integrity": "sha512-Ud1v7hJJYIqehlUJGqR6PF1Ek8l80zWwxA6nGxigBsGJ9f9M2fciHyrIiNMerSHSH3p+0/Ia7jIlnDkt41h5cw==",
       "dev": true
     },
     "node_modules/emoji-regex": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true
     },
     "node_modules/emojis-list": {
       "version": "3.0.0",
@@ -8059,9 +7322,9 @@
       }
     },
     "node_modules/enhanced-resolve": {
-      "version": "5.15.0",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.15.0.tgz",
-      "integrity": "sha512-LXYT42KJ7lpIKECr2mAXIaMldcNCh/7E0KBKOu4KSfkHmP+mZmSs+8V5gBAqisWBy0OO4W5Oyys0GO1Y8KtdKg==",
+      "version": "5.16.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.16.0.tgz",
+      "integrity": "sha512-O+QWCviPNSSLAD9Ucn8Awv+poAkqn3T1XY5/N7kR7rQO9yfSGWkYZDwpJ+iKF7B8rxaQKWngSqACpgzeapSyoA==",
       "dev": true,
       "dependencies": {
         "graceful-fs": "^4.2.4",
@@ -8094,10 +7357,12 @@
       }
     },
     "node_modules/entities": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
-      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
-      "dev": true,
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+      "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+      "engines": {
+        "node": ">=0.12"
+      },
       "funding": {
         "url": "https://github.com/fb55/entities?sponsor=1"
       }
@@ -8121,50 +7386,57 @@
       }
     },
     "node_modules/es-abstract": {
-      "version": "1.22.3",
-      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.22.3.tgz",
-      "integrity": "sha512-eiiY8HQeYfYH2Con2berK+To6GrK2RxbPawDkGq4UiCQQfZHb6wX9qQqkbpPqaxQFcl8d9QzZqo0tGE0VcrdwA==",
-      "dev": true,
-      "dependencies": {
-        "array-buffer-byte-length": "^1.0.0",
-        "arraybuffer.prototype.slice": "^1.0.2",
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.5",
-        "es-set-tostringtag": "^2.0.1",
+      "version": "1.23.3",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.3.tgz",
+      "integrity": "sha512-e+HfNH61Bj1X9/jLc5v1owaLYuHdeHHSQlkhCBiTK8rBvKaULl/beGMxwrMXjpYrv4pz22BlY570vVePA2ho4A==",
+      "dev": true,
+      "dependencies": {
+        "array-buffer-byte-length": "^1.0.1",
+        "arraybuffer.prototype.slice": "^1.0.3",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.7",
+        "data-view-buffer": "^1.0.1",
+        "data-view-byte-length": "^1.0.1",
+        "data-view-byte-offset": "^1.0.0",
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "es-set-tostringtag": "^2.0.3",
         "es-to-primitive": "^1.2.1",
         "function.prototype.name": "^1.1.6",
-        "get-intrinsic": "^1.2.2",
-        "get-symbol-description": "^1.0.0",
+        "get-intrinsic": "^1.2.4",
+        "get-symbol-description": "^1.0.2",
         "globalthis": "^1.0.3",
         "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0",
-        "has-proto": "^1.0.1",
+        "has-property-descriptors": "^1.0.2",
+        "has-proto": "^1.0.3",
         "has-symbols": "^1.0.3",
-        "hasown": "^2.0.0",
-        "internal-slot": "^1.0.5",
-        "is-array-buffer": "^3.0.2",
+        "hasown": "^2.0.2",
+        "internal-slot": "^1.0.7",
+        "is-array-buffer": "^3.0.4",
         "is-callable": "^1.2.7",
-        "is-negative-zero": "^2.0.2",
+        "is-data-view": "^1.0.1",
+        "is-negative-zero": "^2.0.3",
         "is-regex": "^1.1.4",
-        "is-shared-array-buffer": "^1.0.2",
+        "is-shared-array-buffer": "^1.0.3",
         "is-string": "^1.0.7",
-        "is-typed-array": "^1.1.12",
+        "is-typed-array": "^1.1.13",
         "is-weakref": "^1.0.2",
         "object-inspect": "^1.13.1",
         "object-keys": "^1.1.1",
-        "object.assign": "^4.1.4",
-        "regexp.prototype.flags": "^1.5.1",
-        "safe-array-concat": "^1.0.1",
-        "safe-regex-test": "^1.0.0",
-        "string.prototype.trim": "^1.2.8",
-        "string.prototype.trimend": "^1.0.7",
-        "string.prototype.trimstart": "^1.0.7",
-        "typed-array-buffer": "^1.0.0",
-        "typed-array-byte-length": "^1.0.0",
-        "typed-array-byte-offset": "^1.0.0",
-        "typed-array-length": "^1.0.4",
+        "object.assign": "^4.1.5",
+        "regexp.prototype.flags": "^1.5.2",
+        "safe-array-concat": "^1.1.2",
+        "safe-regex-test": "^1.0.3",
+        "string.prototype.trim": "^1.2.9",
+        "string.prototype.trimend": "^1.0.8",
+        "string.prototype.trimstart": "^1.0.8",
+        "typed-array-buffer": "^1.0.2",
+        "typed-array-byte-length": "^1.0.1",
+        "typed-array-byte-offset": "^1.0.2",
+        "typed-array-length": "^1.0.6",
         "unbox-primitive": "^1.0.2",
-        "which-typed-array": "^1.1.13"
+        "which-typed-array": "^1.1.15"
       },
       "engines": {
         "node": ">= 0.4"
@@ -8173,21 +7445,52 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/es-define-property": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz",
+      "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==",
+      "dependencies": {
+        "get-intrinsic": "^1.2.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/es-module-lexer": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.4.1.tgz",
-      "integrity": "sha512-cXLGjP0c4T3flZJKQSuziYoq7MlT+rnvfZjfp7h+I7K9BNX54kP9nyWvdbwjQ4u1iWbOL4u96fgeZLToQlZC7w==",
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.5.0.tgz",
+      "integrity": "sha512-pqrTKmwEIgafsYZAGw9kszYzmagcE/n4dbgwGWLEXg7J4QFJVQRBld8j3Q3GNez79jzxZshq0bcT962QHOghjw==",
       "dev": true
     },
+    "node_modules/es-object-atoms": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.0.0.tgz",
+      "integrity": "sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==",
+      "dev": true,
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
     "node_modules/es-set-tostringtag": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.2.tgz",
-      "integrity": "sha512-BuDyupZt65P9D2D2vA/zqcI3G5xRsklm5N3xCwuiy+/vKy8i0ifdsQP1sLgO4tZDSCaQUSnmC48khknGMV3D2Q==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz",
+      "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==",
       "dev": true,
       "dependencies": {
-        "get-intrinsic": "^1.2.2",
-        "has-tostringtag": "^1.0.0",
-        "hasown": "^2.0.0"
+        "get-intrinsic": "^1.2.4",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -8211,9 +7514,10 @@
       }
     },
     "node_modules/escalade": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz",
-      "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
+      "integrity": "sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==",
+      "dev": true,
       "engines": {
         "node": ">=6"
       }
@@ -8303,9 +7607,9 @@
       }
     },
     "node_modules/eslint-plugin-cypress/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
         "type-fest": "^0.20.2"
@@ -8362,9 +7666,9 @@
       }
     },
     "node_modules/eslint-plugin-vue/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -8665,9 +7969,9 @@
       }
     },
     "node_modules/eslint/node_modules/globals": {
-      "version": "13.23.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-13.23.0.tgz",
-      "integrity": "sha512-XAmF0RjlrjY23MA51q3HltdlGxUpXPvg0GioKiD9X6HD28iMjo2dKC8Vqwm7lne4GNr78+RHTfliktR6ZH09wA==",
+      "version": "13.24.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz",
+      "integrity": "sha512-AhO5QUcj8llrbG09iWhPU2B204J1xnPeL8kQmVorSsy+Sjj1sk8gIyh6cUocGmH4L0UuhAJy+hJMRA4mgA4mFQ==",
       "dev": true,
       "dependencies": {
         "type-fest": "^0.20.2"
@@ -8710,9 +8014,9 @@
       }
     },
     "node_modules/eslint/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -8754,15 +8058,6 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "dev": true
     },
-    "node_modules/esm": {
-      "version": "3.2.25",
-      "resolved": "https://registry.npmjs.org/esm/-/esm-3.2.25.tgz",
-      "integrity": "sha512-U1suiZ2oDVWv4zPO56S0NcR5QriEahGtdN2OR6FiOG4WJvcjBVFB0qI4+eKoWFH483PKGuLuu6V8Z4T5g63UVA==",
-      "dev": true,
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/espree": {
       "version": "7.3.1",
       "resolved": "https://registry.npmjs.org/espree/-/espree-7.3.1.tgz",
@@ -8992,17 +8287,17 @@
       }
     },
     "node_modules/express": {
-      "version": "4.18.2",
-      "resolved": "https://registry.npmjs.org/express/-/express-4.18.2.tgz",
-      "integrity": "sha512-5/PsL6iGPdfQ/lKM1UuielYgv3BUoJfz1aUwU9vHZ+J7gyvwdQXFEBIEIaxeGf0GIcreATNyBExtalisDbuMqQ==",
+      "version": "4.19.2",
+      "resolved": "https://registry.npmjs.org/express/-/express-4.19.2.tgz",
+      "integrity": "sha512-5T6nhjsT+EOMzuck8JjBHARTHfMht0POzlA60WV2pMD3gyXw2LZnZ+ueGdNxG+0calOJcWKbpFcuzLZ91YWq9Q==",
       "dev": true,
       "dependencies": {
         "accepts": "~1.3.8",
         "array-flatten": "1.1.1",
-        "body-parser": "1.20.1",
+        "body-parser": "1.20.2",
         "content-disposition": "0.5.4",
         "content-type": "~1.0.4",
-        "cookie": "0.5.0",
+        "cookie": "0.6.0",
         "cookie-signature": "1.0.6",
         "debug": "2.6.9",
         "depd": "2.0.0",
@@ -9033,12 +8328,6 @@
         "node": ">= 0.10.0"
       }
     },
-    "node_modules/express/node_modules/array-flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
-      "integrity": "sha512-PCVAQswWemu6UdxsDFFX/+gVeYqKAod3D3UVm91jHwynguOwAvYPhx8nNlM++NqRcK6CxxpUafjmhIdKiHibqg==",
-      "dev": true
-    },
     "node_modules/express/node_modules/debug": {
       "version": "2.6.9",
       "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz",
@@ -9192,9 +8481,9 @@
       "dev": true
     },
     "node_modules/fastq": {
-      "version": "1.15.0",
-      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.15.0.tgz",
-      "integrity": "sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==",
+      "version": "1.17.1",
+      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
+      "integrity": "sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==",
       "dev": true,
       "dependencies": {
         "reusify": "^1.0.4"
@@ -9204,6 +8493,7 @@
       "version": "0.11.4",
       "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz",
       "integrity": "sha512-CzbClwlXAuiRQAlUyfqPgvPoNKTckTPGfwZV4ZdAhVcP2lh9KUxJg2b5GkE7XbjKQ3YJnQ9z6D9ntLAlB+tP8g==",
+      "dev": true,
       "dependencies": {
         "websocket-driver": ">=0.5.1"
       },
@@ -9352,39 +8642,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/firebase": {
-      "version": "10.7.1",
-      "resolved": "https://registry.npmjs.org/firebase/-/firebase-10.7.1.tgz",
-      "integrity": "sha512-Mlt7y7zQ43FtKp4SCyYie3tnrOL3UMF2XXiV4ZXMrC0d0wtcOYmABuybhkJpJCKILpdekxr39wjnaai0DZlWFg==",
-      "dependencies": {
-        "@firebase/analytics": "0.10.0",
-        "@firebase/analytics-compat": "0.2.6",
-        "@firebase/app": "0.9.25",
-        "@firebase/app-check": "0.8.1",
-        "@firebase/app-check-compat": "0.3.8",
-        "@firebase/app-compat": "0.2.25",
-        "@firebase/app-types": "0.9.0",
-        "@firebase/auth": "1.5.1",
-        "@firebase/auth-compat": "0.5.1",
-        "@firebase/database": "1.0.2",
-        "@firebase/database-compat": "1.0.2",
-        "@firebase/firestore": "4.4.0",
-        "@firebase/firestore-compat": "0.3.23",
-        "@firebase/functions": "0.11.0",
-        "@firebase/functions-compat": "0.3.6",
-        "@firebase/installations": "0.6.4",
-        "@firebase/installations-compat": "0.2.4",
-        "@firebase/messaging": "0.12.5",
-        "@firebase/messaging-compat": "0.2.5",
-        "@firebase/performance": "0.6.4",
-        "@firebase/performance-compat": "0.2.4",
-        "@firebase/remote-config": "0.4.4",
-        "@firebase/remote-config-compat": "0.2.4",
-        "@firebase/storage": "0.12.0",
-        "@firebase/storage-compat": "0.3.3",
-        "@firebase/util": "1.9.3"
-      }
-    },
     "node_modules/flat": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/flat/-/flat-5.0.2.tgz",
@@ -9409,15 +8666,15 @@
       }
     },
     "node_modules/flatted": {
-      "version": "3.2.9",
-      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.2.9.tgz",
-      "integrity": "sha512-36yxDn5H7OFZQla0/jFJmbIKTdZAQHngCedGxiMmpNfEZM0sdEeT+WczLQrjK6D7o2aiyLYDnkw0R3JK0Qv1RQ==",
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.1.tgz",
+      "integrity": "sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==",
       "dev": true
     },
     "node_modules/follow-redirects": {
-      "version": "1.15.3",
-      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.3.tgz",
-      "integrity": "sha512-1VzOtuEM8pC9SFU1E+8KfTjZyMztRsgEfwQl44z8A25uy13jSzTj6dyK2Df52iV0vgHCfBwLhDWevLn95w5v6Q==",
+      "version": "1.15.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
       "funding": [
         {
           "type": "individual",
@@ -9634,9 +8891,9 @@
       }
     },
     "node_modules/fork-ts-checker-webpack-plugin/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -9811,20 +9068,25 @@
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
       "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "dev": true,
       "engines": {
         "node": "6.* || 8.* || >= 10.*"
       }
     },
     "node_modules/get-intrinsic": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.2.tgz",
-      "integrity": "sha512-0gSo4ml/0j98Y3lngkFEot/zhiCeWsbYIlZ+uZOVgzLyLaUw7wxUL+nCTP0XJvJg1AXulJRI3UJi8GsbDuxdGA==",
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz",
+      "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==",
       "dependencies": {
+        "es-errors": "^1.3.0",
         "function-bind": "^1.1.2",
         "has-proto": "^1.0.1",
         "has-symbols": "^1.0.3",
         "hasown": "^2.0.0"
       },
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -9848,13 +9110,14 @@
       }
     },
     "node_modules/get-symbol-description": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.0.tgz",
-      "integrity": "sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz",
+      "integrity": "sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.1"
+        "call-bind": "^1.0.5",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.4"
       },
       "engines": {
         "node": ">= 0.4"
@@ -10035,20 +9298,20 @@
       }
     },
     "node_modules/has-property-descriptors": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.1.tgz",
-      "integrity": "sha512-VsX8eaIewvas0xnvinAe9bw4WfIeODpGYikiWYLH+dma0Jw6KHYqWiWfhQlgOVK8D6PvjubK5Uc4P0iIhIcNVg==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
+      "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
       "dependencies": {
-        "get-intrinsic": "^1.2.2"
+        "es-define-property": "^1.0.0"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/has-proto": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.1.tgz",
-      "integrity": "sha512-7qE+iP+O+bgF9clE5+UoBFzE65mlBiVj3tKCrlNQ0Ogwm0BjpT/gK4SlLYDMybDh5I3TCTKnPPa0oMG7JDYrhg==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz",
+      "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==",
       "engines": {
         "node": ">= 0.4"
       },
@@ -10068,12 +9331,12 @@
       }
     },
     "node_modules/has-tostringtag": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.0.tgz",
-      "integrity": "sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
+      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
       "dev": true,
       "dependencies": {
-        "has-symbols": "^1.0.2"
+        "has-symbols": "^1.0.3"
       },
       "engines": {
         "node": ">= 0.4"
@@ -10089,9 +9352,9 @@
       "dev": true
     },
     "node_modules/hasown": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.0.tgz",
-      "integrity": "sha512-vUptKVTpIJhcczKBbgnS+RtcuYMB8+oNzPK2/Hp3hanz8JmpATdmmgLgSaadVREkDm+e2giHwY3ZRkyjSIDDFA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
+      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
       "dependencies": {
         "function-bind": "^1.1.2"
       },
@@ -10172,9 +9435,9 @@
       }
     },
     "node_modules/html-entities": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.4.0.tgz",
-      "integrity": "sha512-igBTJcNNNhvZFRtm8uA6xMY6xYleeDwn3PeBCkDz7tHttv4F2hsDI2aPgNERWzvRcNYHNT3ymRaQzllmXj4YsQ==",
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.5.2.tgz",
+      "integrity": "sha512-K//PSRMQk4FZ78Kyau+mZurHn3FH0Vwr+H36eE0rPbeYkRRi9YxceYPhuN60UwWorxyKHhqoAJl2OFKa4BVtaA==",
       "dev": true,
       "funding": [
         {
@@ -10236,9 +9499,9 @@
       }
     },
     "node_modules/html-webpack-plugin": {
-      "version": "5.5.4",
-      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-5.5.4.tgz",
-      "integrity": "sha512-3wNSaVVxdxcu0jd4FpQFoICdqgxs4zIQQvj+2yQKFfBOnLETQ6X5CDWdeasuGlSsooFlMkEioWDTqBv1wvw5Iw==",
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/html-webpack-plugin/-/html-webpack-plugin-5.6.0.tgz",
+      "integrity": "sha512-iwaY4wzbe48AfKLZ/Cc8k0L+FKG6oSNRaZ8x5A/T/IVDGyXcbHncM9TdDa93wn0FsSm82FhTKW7f3vS61thXAw==",
       "dev": true,
       "dependencies": {
         "@types/html-minifier-terser": "^6.0.0",
@@ -10255,7 +9518,16 @@
         "url": "https://opencollective.com/html-webpack-plugin"
       },
       "peerDependencies": {
+        "@rspack/core": "0.x || 1.x",
         "webpack": "^5.20.0"
+      },
+      "peerDependenciesMeta": {
+        "@rspack/core": {
+          "optional": true
+        },
+        "webpack": {
+          "optional": true
+        }
       }
     },
     "node_modules/html-webpack-plugin/node_modules/tapable": {
@@ -10286,6 +9558,15 @@
         "entities": "^2.0.0"
       }
     },
+    "node_modules/htmlparser2/node_modules/entities": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
+      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
+      "dev": true,
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/http-deceiver": {
       "version": "1.2.7",
       "resolved": "https://registry.npmjs.org/http-deceiver/-/http-deceiver-1.2.7.tgz",
@@ -10311,7 +9592,8 @@
     "node_modules/http-parser-js": {
       "version": "0.5.8",
       "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.8.tgz",
-      "integrity": "sha512-SGeBX54F94Wgu5RH3X5jsDtf4eHyRogWX1XGT3b4HuW3tQPM4AaBzoUji/4AAJNXCEOWZ5O0DgZmJw1947gD5Q=="
+      "integrity": "sha512-SGeBX54F94Wgu5RH3X5jsDtf4eHyRogWX1XGT3b4HuW3tQPM4AaBzoUji/4AAJNXCEOWZ5O0DgZmJw1947gD5Q==",
+      "dev": true
     },
     "node_modules/http-proxy": {
       "version": "1.18.1",
@@ -10406,7 +9688,8 @@
     "node_modules/idb": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/idb/-/idb-7.1.1.tgz",
-      "integrity": "sha512-gchesWBzyvGHRO9W8tzUWFDycow5gwjvFKfyV9FF32Y7F50yZMp7mP+T2mJIWFx49zicqyC4uefHM17o6xKIVQ=="
+      "integrity": "sha512-gchesWBzyvGHRO9W8tzUWFDycow5gwjvFKfyV9FF32Y7F50yZMp7mP+T2mJIWFx49zicqyC4uefHM17o6xKIVQ==",
+      "dev": true
     },
     "node_modules/ieee754": {
       "version": "1.2.1",
@@ -10429,9 +9712,9 @@
       ]
     },
     "node_modules/ignore": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.0.tgz",
-      "integrity": "sha512-g7dmpshy+gD7mh88OC9NwSGTKoc3kyLAZQRU1mt53Aw/vnvfXnbC+F/7F7QoYVKbV+KNvJx8wArewKy1vXMtlg==",
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.1.tgz",
+      "integrity": "sha512-5Fytz/IraMjqpwfd34ke28PTVMjZjJG2MPn5t7OE4eUCUNf8BAa7b5WUS9/Qvr6mwOQS7Mk6vdsMno5he+T8Xw==",
       "dev": true,
       "engines": {
         "node": ">= 4"
@@ -10643,12 +9926,12 @@
       }
     },
     "node_modules/internal-slot": {
-      "version": "1.0.6",
-      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.6.tgz",
-      "integrity": "sha512-Xj6dv+PsbtwyPpEflsejS+oIZxmMlV44zAhG479uYu89MsjcYOhCFnNyKrkJrihbsiasQyY0afoCl/9BLR65bg==",
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz",
+      "integrity": "sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==",
       "dev": true,
       "dependencies": {
-        "get-intrinsic": "^1.2.2",
+        "es-errors": "^1.3.0",
         "hasown": "^2.0.0",
         "side-channel": "^1.0.4"
       },
@@ -10674,14 +9957,16 @@
       }
     },
     "node_modules/is-array-buffer": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.2.tgz",
-      "integrity": "sha512-y+FyyR/w8vfIRq4eQcM1EYgSTnmHXPqaF+IgzgraytCFq5Xh8lllDVmAZolPJiZttZLeFSINPYMaEJ7/vWUa1w==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
+      "integrity": "sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==",
       "dev": true,
       "dependencies": {
         "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.0",
-        "is-typed-array": "^1.1.10"
+        "get-intrinsic": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -10774,6 +10059,21 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/is-data-view": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.1.tgz",
+      "integrity": "sha512-AHkaJrsUVW6wq6JS8y3JnM/GJF/9cf+k20+iDzlSaJrinEo5+7vRiteOSwBhHRiAyQATN1AmY4hwzxJKPmYf+w==",
+      "dev": true,
+      "dependencies": {
+        "is-typed-array": "^1.1.13"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
     "node_modules/is-date-object": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.5.tgz",
@@ -10826,6 +10126,7 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
       "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -10874,9 +10175,9 @@
       "dev": true
     },
     "node_modules/is-negative-zero": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.2.tgz",
-      "integrity": "sha512-dqJvarLawXsFbNDeJW7zAz8ItJ9cd28YufuuFzh0G8pNHjJMnY08Dv7sYX2uF5UpQOwieAeOExEYAWWfu7ZZUA==",
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz",
+      "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==",
       "dev": true,
       "engines": {
         "node": ">= 0.4"
@@ -10974,12 +10275,15 @@
       }
     },
     "node_modules/is-shared-array-buffer": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.2.tgz",
-      "integrity": "sha512-sqN2UDu1/0y6uvXyStCOzyhAjCSlHceFoMKJW8W9EU9cvic/QdsZ0kEU93HEy3IUEFZIiH/3w+AH/UQbPHNdhA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz",
+      "integrity": "sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2"
+        "call-bind": "^1.0.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -11025,12 +10329,12 @@
       }
     },
     "node_modules/is-typed-array": {
-      "version": "1.1.12",
-      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.12.tgz",
-      "integrity": "sha512-Z14TF2JNG8Lss5/HMqt0//T9JeHXttXy5pH/DBU4vi98ozO2btxzq9MwYDZYnKwU8nRsz/+GVFVRDq3DkVuSPg==",
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz",
+      "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==",
       "dev": true,
       "dependencies": {
-        "which-typed-array": "^1.1.11"
+        "which-typed-array": "^1.1.14"
       },
       "engines": {
         "node": ">= 0.4"
@@ -11268,27 +10572,28 @@
       }
     },
     "node_modules/joi": {
-      "version": "17.11.0",
-      "resolved": "https://registry.npmjs.org/joi/-/joi-17.11.0.tgz",
-      "integrity": "sha512-NgB+lZLNoqISVy1rZocE9PZI36bL/77ie924Ri43yEvi9GUUMPeyVIr8KdFTMUlby1p0PBYMk9spIxEUQYqrJQ==",
+      "version": "17.12.3",
+      "resolved": "https://registry.npmjs.org/joi/-/joi-17.12.3.tgz",
+      "integrity": "sha512-2RRziagf555owrm9IRVtdKynOBeITiDpuZqIpgwqXShPncPKNiRQoiGsl/T8SQdq+8ugRzH2LqY67irr2y/d+g==",
       "dev": true,
       "dependencies": {
-        "@hapi/hoek": "^9.0.0",
-        "@hapi/topo": "^5.0.0",
-        "@sideway/address": "^4.1.3",
+        "@hapi/hoek": "^9.3.0",
+        "@hapi/topo": "^5.1.0",
+        "@sideway/address": "^4.1.5",
         "@sideway/formula": "^3.0.1",
         "@sideway/pinpoint": "^2.0.0"
       }
     },
     "node_modules/js-beautify": {
-      "version": "1.14.11",
-      "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.14.11.tgz",
-      "integrity": "sha512-rPogWqAfoYh1Ryqqh2agUpVfbxAhbjuN1SmU86dskQUKouRiggUTCO4+2ym9UPXllc2WAp0J+T5qxn7Um3lCdw==",
+      "version": "1.15.1",
+      "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.15.1.tgz",
+      "integrity": "sha512-ESjNzSlt/sWE8sciZH8kBF8BPlwXPwhR6pWKAw8bw4Bwj+iZcnKW6ONWUutJ7eObuBZQpiIb8S7OYspWrKt7rA==",
       "dev": true,
       "dependencies": {
         "config-chain": "^1.1.13",
-        "editorconfig": "^1.0.3",
+        "editorconfig": "^1.0.4",
         "glob": "^10.3.3",
+        "js-cookie": "^3.0.5",
         "nopt": "^7.2.0"
       },
       "bin": {
@@ -11310,16 +10615,16 @@
       }
     },
     "node_modules/js-beautify/node_modules/glob": {
-      "version": "10.3.10",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.10.tgz",
-      "integrity": "sha512-fa46+tv1Ak0UPK1TOy/pZrIybNNt4HCv7SDzwyfiOZkvZLEbjsZkJBPtDHVshZjbecAoAGSC20MjLDG/qr679g==",
+      "version": "10.3.12",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.3.12.tgz",
+      "integrity": "sha512-TCNv8vJ+xz4QiqTpfOJA7HvYv+tNIRHKfUWw/q+v2jdgN4ebz+KY9tGx5J4rHP0o84mNP+ApH66HRX8us3Khqg==",
       "dev": true,
       "dependencies": {
         "foreground-child": "^3.1.0",
-        "jackspeak": "^2.3.5",
+        "jackspeak": "^2.3.6",
         "minimatch": "^9.0.1",
-        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0",
-        "path-scurry": "^1.10.1"
+        "minipass": "^7.0.4",
+        "path-scurry": "^1.10.2"
       },
       "bin": {
         "glob": "dist/esm/bin.mjs"
@@ -11332,9 +10637,9 @@
       }
     },
     "node_modules/js-beautify/node_modules/minimatch": {
-      "version": "9.0.3",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.3.tgz",
-      "integrity": "sha512-RHiac9mvaRw0x3AYRgDC1CxAP7HTcNrrECeA8YYJeWnpo+2Q5CegtZjaotWTWxDG3UeGA1coE05iH1mPjT/2mg==",
+      "version": "9.0.4",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.4.tgz",
+      "integrity": "sha512-KqWh+VchfxcMNRAJjj2tnsSJdNbHsVgnkBhTNrW7AjVo6OvLtxw8zfT9oLw1JSohlFzJ8jCoTgaoXvJ+kHt6fw==",
       "dev": true,
       "dependencies": {
         "brace-expansion": "^2.0.1"
@@ -11355,6 +10660,15 @@
         "node": ">=16 || 14 >=14.17"
       }
     },
+    "node_modules/js-cookie": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-3.0.5.tgz",
+      "integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==",
+      "dev": true,
+      "engines": {
+        "node": ">=14"
+      }
+    },
     "node_modules/js-message": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
@@ -11735,12 +11049,8 @@
     "node_modules/lodash": {
       "version": "4.17.21",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
-    },
-    "node_modules/lodash.camelcase": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
-      "integrity": "sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA=="
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
+      "dev": true
     },
     "node_modules/lodash.debounce": {
       "version": "4.0.8",
@@ -11997,11 +11307,6 @@
         "node": ">=8"
       }
     },
-    "node_modules/long": {
-      "version": "5.2.3",
-      "resolved": "https://registry.npmjs.org/long/-/long-5.2.3.tgz",
-      "integrity": "sha512-lcHwpNoggQTObv5apGNCTdJrO69eHOZMi4BNC+rTLER8iHAqGrUVeLh/irVIM7zTw2bOXA8T6uNPeujwOLg/2Q=="
-    },
     "node_modules/lower-case": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz",
@@ -12035,9 +11340,9 @@
       }
     },
     "node_modules/magic-string": {
-      "version": "0.30.5",
-      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.5.tgz",
-      "integrity": "sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==",
+      "version": "0.30.9",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.9.tgz",
+      "integrity": "sha512-S1+hd+dIrC8EZqKyT9DstTH/0Z+f76kmmvZnkfQVmOpDEF9iVgdYif3Q/pIWHmCoo59bQVGW0kVL3e2nl+9+Sw==",
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.4.15"
       },
@@ -12201,12 +11506,13 @@
       }
     },
     "node_modules/mini-css-extract-plugin": {
-      "version": "2.7.6",
-      "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.6.tgz",
-      "integrity": "sha512-Qk7HcgaPkGG6eD77mLvZS1nmxlao3j+9PkrT9Uc7HAE1id3F41+DdBRYRYkbyfNRGzm8/YWtzhw7nVPmwhqTQw==",
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.8.1.tgz",
+      "integrity": "sha512-/1HDlyFRxWIZPI1ZpgqlZ8jMw/1Dp/dl3P0L1jtZ+zVcHqwPhGwaJwKL00WVgfnBy6PWCde9W65or7IIETImuA==",
       "dev": true,
       "dependencies": {
-        "schema-utils": "^4.0.0"
+        "schema-utils": "^4.0.0",
+        "tapable": "^2.2.1"
       },
       "engines": {
         "node": ">= 12.13.0"
@@ -12272,6 +11578,15 @@
         "url": "https://opencollective.com/webpack"
       }
     },
+    "node_modules/mini-css-extract-plugin/node_modules/tapable": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz",
+      "integrity": "sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==",
+      "dev": true,
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/minimalistic-assert": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
@@ -12341,9 +11656,9 @@
       "dev": true
     },
     "node_modules/mrmime": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz",
-      "integrity": "sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==",
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz",
+      "integrity": "sha512-eu38+hdgojoyq63s+yTpN4XMBdt5l8HhMhc4VKLO9KM5caLIBvUm4thi7fFaxyTmCKeNnXZ5pAlBwCUnhA09uw==",
       "dev": true,
       "engines": {
         "node": ">=10"
@@ -12474,14 +11789,6 @@
         "node": ">= 6.13.0"
       }
     },
-    "node_modules/node-json-transform": {
-      "version": "1.1.2",
-      "resolved": "https://registry.npmjs.org/node-json-transform/-/node-json-transform-1.1.2.tgz",
-      "integrity": "sha512-Y3twjldHF1htCiCu6elGwQDdNp5PD54U66waWa2XNKh+g2lXSnWo3nq9SZnZOV3odFAqkM/roiNZx078RE2new==",
-      "dependencies": {
-        "lodash": "^4.17.15"
-      }
-    },
     "node_modules/node-releases": {
       "version": "2.0.14",
       "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
@@ -13007,12 +12314,12 @@
       "dev": true
     },
     "node_modules/path-scurry": {
-      "version": "1.10.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.1.tgz",
-      "integrity": "sha512-MkhCqzzBEpPvxxQ71Md0b1Kk51W01lrYvlMzSUaIzNsODdd7mqhiimSZlr+VegAz5Z6Vzt9Xg2ttE//XBhH3EQ==",
+      "version": "1.10.2",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.10.2.tgz",
+      "integrity": "sha512-7xTavNy5RQXnsjANvVvMkEjvloOinkAjv/Z6Ildz9v2RinZ4SBKTWFOVRbaF8p0vpHnyjV/UwNDdKuUv6M5qcA==",
       "dev": true,
       "dependencies": {
-        "lru-cache": "^9.1.1 || ^10.0.0",
+        "lru-cache": "^10.2.0",
         "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
       },
       "engines": {
@@ -13023,9 +12330,9 @@
       }
     },
     "node_modules/path-scurry/node_modules/lru-cache": {
-      "version": "10.1.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.1.0.tgz",
-      "integrity": "sha512-/1clY/ui8CzjKFyjdvwPWJUYKiFVXG2I2cY0ssG7h4+hwk+XOIX7ZSG9Q7TW8TW3Kp3BUSqgFWBLgL4PJ+Blag==",
+      "version": "10.2.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.2.0.tgz",
+      "integrity": "sha512-2bIM8x+VAf6JT4bKAljS1qUWgMsqZRPGJS6FSahIMPVvctcNhyVp7AJu7quxOW9jwkryBReKZY5tY5JYv2n/7Q==",
       "dev": true,
       "engines": {
         "node": "14 || >=16.14"
@@ -13093,64 +12400,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/pinia": {
-      "version": "2.0.36",
-      "resolved": "https://registry.npmjs.org/pinia/-/pinia-2.0.36.tgz",
-      "integrity": "sha512-4UKApwjlmJH+VuHKgA+zQMddcCb3ezYnyewQ9NVrsDqZ/j9dMv5+rh+1r48whKNdpFkZAWVxhBp5ewYaYX9JcQ==",
-      "dependencies": {
-        "@vue/devtools-api": "^6.5.0",
-        "vue-demi": "*"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/posva"
-      },
-      "peerDependencies": {
-        "@vue/composition-api": "^1.4.0",
-        "typescript": ">=4.4.4",
-        "vue": "^2.6.14 || ^3.2.0"
-      },
-      "peerDependenciesMeta": {
-        "@vue/composition-api": {
-          "optional": true
-        },
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/pinia-plugin-persistedstate": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.0.tgz",
-      "integrity": "sha512-tZbNGf2vjAQcIm7alK40sE51Qu/m9oWr+rEgNm/2AWr1huFxj72CjvpQcIQzMknDBJEkQznCLAGtJTIcLKrKdw==",
-      "peerDependencies": {
-        "pinia": "^2.0.0"
-      }
-    },
-    "node_modules/pinia/node_modules/vue-demi": {
-      "version": "0.14.6",
-      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.6.tgz",
-      "integrity": "sha512-8QA7wrYSHKaYgUxDA5ZC24w+eHm3sYCbp0EzcDwKqN3p6HqtTCGR/GVsPyZW92unff4UlcSh++lmqDWN3ZIq4w==",
-      "hasInstallScript": true,
-      "bin": {
-        "vue-demi-fix": "bin/vue-demi-fix.js",
-        "vue-demi-switch": "bin/vue-demi-switch.js"
-      },
-      "engines": {
-        "node": ">=12"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/antfu"
-      },
-      "peerDependencies": {
-        "@vue/composition-api": "^1.0.0-rc.1",
-        "vue": "^3.0.0-0 || ^2.6.0"
-      },
-      "peerDependenciesMeta": {
-        "@vue/composition-api": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/pkg-dir": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
@@ -13205,14 +12454,23 @@
       "resolved": "https://registry.npmjs.org/debug/-/debug-3.2.7.tgz",
       "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==",
       "dev": true,
-      "dependencies": {
-        "ms": "^2.1.1"
+      "dependencies": {
+        "ms": "^2.1.1"
+      }
+    },
+    "node_modules/possible-typed-array-names": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz",
+      "integrity": "sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==",
+      "dev": true,
+      "engines": {
+        "node": ">= 0.4"
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.32",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.32.tgz",
-      "integrity": "sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==",
+      "version": "8.4.38",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.38.tgz",
+      "integrity": "sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==",
       "funding": [
         {
           "type": "opencollective",
@@ -13230,7 +12488,7 @@
       "dependencies": {
         "nanoid": "^3.3.7",
         "picocolors": "^1.0.0",
-        "source-map-js": "^1.0.2"
+        "source-map-js": "^1.2.0"
       },
       "engines": {
         "node": "^10 || ^12 || >=14"
@@ -13382,9 +12640,9 @@
       }
     },
     "node_modules/postcss-loader/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -13501,9 +12759,9 @@
       }
     },
     "node_modules/postcss-modules-extract-imports": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz",
-      "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==",
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.1.0.tgz",
+      "integrity": "sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==",
       "dev": true,
       "engines": {
         "node": "^10 || ^12 || >= 14"
@@ -13513,9 +12771,9 @@
       }
     },
     "node_modules/postcss-modules-local-by-default": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.3.tgz",
-      "integrity": "sha512-2/u2zraspoACtrbFRnTijMiQtb4GW4BvatjaG/bCjYQo8kLTdevCUlwuBHx2sCnSyrI3x3qj4ZK1j5LQBgzmwA==",
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.0.5.tgz",
+      "integrity": "sha512-6MieY7sIfTK0hYfafw1OMEG+2bg8Q1ocHCpoWLqOKj3JXlKu4G7btkmM/B7lFubYkYWmRSPLZi5chid63ZaZYw==",
       "dev": true,
       "dependencies": {
         "icss-utils": "^5.0.0",
@@ -13530,9 +12788,9 @@
       }
     },
     "node_modules/postcss-modules-scope": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.0.0.tgz",
-      "integrity": "sha512-hncihwFA2yPath8oZ15PZqvWGkWf+XUfQgUGamS4LqoP1anQLOsOJw0vr7J7IwLpoY9fatA2qiGUGmuZL0Iqlg==",
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.2.0.tgz",
+      "integrity": "sha512-oq+g1ssrsZOsx9M96c5w8laRmvEu9C3adDSjI8oTcbfkrTE8hx/zfyobUoWIxaKPO8bt6S62kxpw5GqypEw1QQ==",
       "dev": true,
       "dependencies": {
         "postcss-selector-parser": "^6.0.4"
@@ -13741,9 +12999,9 @@
       }
     },
     "node_modules/postcss-selector-parser": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
+      "version": "6.0.16",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.16.tgz",
+      "integrity": "sha512-A0RVJrX+IUkVZbW3ClroRWurercFhieevHB38sr2+l9eUClMqome3LmEmnhlNy+5Mr2EYN6B2Kaw9wYdd+VHiw==",
       "dev": true,
       "dependencies": {
         "cssesc": "^3.0.0",
@@ -14003,29 +13261,6 @@
       "integrity": "sha512-vtK/94akxsTMhe0/cbfpR+syPuszcuwhqVjJq26CuNDgFGj682oRBXOP5MJpv2r7JtE8MsiepGIqvvOTBwn2vA==",
       "dev": true
     },
-    "node_modules/protobufjs": {
-      "version": "7.2.5",
-      "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.2.5.tgz",
-      "integrity": "sha512-gGXRSXvxQ7UiPgfw8gevrfRWcTlSbOFg+p/N+JVJEK5VhueL2miT6qTymqAmjr1Q5WbOCyJbyrk6JfWKwlFn6A==",
-      "hasInstallScript": true,
-      "dependencies": {
-        "@protobufjs/aspromise": "^1.1.2",
-        "@protobufjs/base64": "^1.1.2",
-        "@protobufjs/codegen": "^2.0.4",
-        "@protobufjs/eventemitter": "^1.1.0",
-        "@protobufjs/fetch": "^1.1.0",
-        "@protobufjs/float": "^1.0.2",
-        "@protobufjs/inquire": "^1.1.0",
-        "@protobufjs/path": "^1.1.2",
-        "@protobufjs/pool": "^1.1.0",
-        "@protobufjs/utf8": "^1.1.0",
-        "@types/node": ">=13.7.0",
-        "long": "^5.0.0"
-      },
-      "engines": {
-        "node": ">=12.0.0"
-      }
-    },
     "node_modules/proxy-addr": {
       "version": "2.0.7",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
@@ -14086,11 +13321,11 @@
       }
     },
     "node_modules/qs": {
-      "version": "6.11.2",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.11.2.tgz",
-      "integrity": "sha512-tDNIz22aBzCDxLtVH++VnTfzxlfeK5CbqohpSqpJgj1Wg/cQbStNAz3NuqCs5vV+pjBsK4x4pN9HlVh7rcYRiA==",
+      "version": "6.12.0",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.12.0.tgz",
+      "integrity": "sha512-trVZiI6RMOkO476zLGaBIzszOdFPnCCXHPG9kn0yuS1uz6xdVxPfZdB3vUig9pxPFDM9BRAgz/YUIVQ1/vuiUg==",
       "dependencies": {
-        "side-channel": "^1.0.4"
+        "side-channel": "^1.0.6"
       },
       "engines": {
         "node": ">=0.6"
@@ -14150,9 +13385,9 @@
       }
     },
     "node_modules/raw-body": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.1.tgz",
-      "integrity": "sha512-qqJBtEyVgS0ZmPGdCFPWJ3FreoqvG4MVQln/kCgF7Olq95IbOp0/BWyMwbdtn4VTvkM8Y7khCQ2Xgk/tcrCXig==",
+      "version": "2.5.2",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-2.5.2.tgz",
+      "integrity": "sha512-8zGqypfENjCIqGhgXToC8aB2r7YrBX+AQAfIPs/Mlk+BtPTztOvTS01NRW/3Eh60J+a48lt8qsCzirQ6loCVfA==",
       "dev": true,
       "dependencies": {
         "bytes": "3.1.2",
@@ -14259,9 +13494,9 @@
       }
     },
     "node_modules/regenerator-runtime": {
-      "version": "0.14.0",
-      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz",
-      "integrity": "sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==",
+      "version": "0.14.1",
+      "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
+      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==",
       "dev": true
     },
     "node_modules/regenerator-transform": {
@@ -14274,14 +13509,15 @@
       }
     },
     "node_modules/regexp.prototype.flags": {
-      "version": "1.5.1",
-      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.1.tgz",
-      "integrity": "sha512-sy6TXMN+hnP/wMy+ISxg3krXx7BAtWVO4UouuCN/ziM9UEne0euamVNafDfvC83bRNr95y0V5iijeDQFUNpvrg==",
+      "version": "1.5.2",
+      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.2.tgz",
+      "integrity": "sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "set-function-name": "^2.0.0"
+        "call-bind": "^1.0.6",
+        "define-properties": "^1.2.1",
+        "es-errors": "^1.3.0",
+        "set-function-name": "^2.0.1"
       },
       "engines": {
         "node": ">= 0.4"
@@ -14380,6 +13616,7 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
       "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -14464,9 +13701,9 @@
       }
     },
     "node_modules/rfdc": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.3.0.tgz",
-      "integrity": "sha512-V2hovdzFbOi77/WajaSMXk2OLm+xNIeQdMMuB7icj7bk6zi2F8GGAxigcnDFpJHbNyNcgyJDiP+8nOrY5cZGrA==",
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.3.1.tgz",
+      "integrity": "sha512-r5a3l5HzYlIC68TpmYKlxWjmOP6wiPJ1vWv2HeLhNsRZMrCkxeqxiHlQ21oXmQ4F3SiryXBHhAD7JZqvOJjFmg==",
       "dev": true
     },
     "node_modules/rimraf": {
@@ -14604,13 +13841,13 @@
       }
     },
     "node_modules/safe-array-concat": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.0.1.tgz",
-      "integrity": "sha512-6XbUAseYE2KtOuGueyeobCySj9L4+66Tn6KQMOPQJrAJEowYKW/YR/MGJZl7FdydUdaFu4LYyDZjxf4/Nmo23Q==",
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz",
+      "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1",
+        "call-bind": "^1.0.7",
+        "get-intrinsic": "^1.2.4",
         "has-symbols": "^1.0.3",
         "isarray": "^2.0.5"
       },
@@ -14625,6 +13862,7 @@
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
       "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -14641,15 +13879,18 @@
       ]
     },
     "node_modules/safe-regex-test": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.0.tgz",
-      "integrity": "sha512-JBUUzyOgEwXQY1NuPtvcj/qcBDbDmEvWufhlnXZIm75DEHp+afM1r1ujJpJsV/gSM4t59tpDyPi1sd6ZaPFfsA==",
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz",
+      "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.1.3",
+        "call-bind": "^1.0.6",
+        "es-errors": "^1.3.0",
         "is-regex": "^1.1.4"
       },
+      "engines": {
+        "node": ">= 0.4"
+      },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
@@ -14758,9 +13999,9 @@
       "dev": true
     },
     "node_modules/serialize-javascript": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.1.tgz",
-      "integrity": "sha512-owoXEFjWRllis8/M1Q+Cw5k8ZH40e3zhp/ovX+Xr/vi1qj6QesbyXXViFbpNvWvPNAD62SutwEXavefrLJWj7w==",
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-6.0.2.tgz",
+      "integrity": "sha512-Saa1xPByTTq2gdeFZYLLo+RFE35NHZkAbqZeWNd3BpzppeVisAqpDjcp8dyf6uIvEqJRd46jemmyA4iFIeVk8g==",
       "dev": true,
       "dependencies": {
         "randombytes": "^2.1.0"
@@ -14866,28 +14107,31 @@
       "dev": true
     },
     "node_modules/set-function-length": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.1.1.tgz",
-      "integrity": "sha512-VoaqjbBJKiWtg4yRcKBQ7g7wnGnLV3M8oLvVWwOk2PdYY6PEFegR1vezXR0tw6fZGF9csVakIRjrJiy2veSBFQ==",
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
+      "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==",
       "dependencies": {
-        "define-data-property": "^1.1.1",
-        "get-intrinsic": "^1.2.1",
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.2.4",
         "gopd": "^1.0.1",
-        "has-property-descriptors": "^1.0.0"
+        "has-property-descriptors": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/set-function-name": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.1.tgz",
-      "integrity": "sha512-tMNCiqYVkXIZgc2Hnoy2IvC/f8ezc5koaRFkCjrpWzGpCd3qbZXPzVy9MAZzK1ch/X0jvSkojys3oqJN0qCmdA==",
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz",
+      "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==",
       "dev": true,
       "dependencies": {
-        "define-data-property": "^1.0.1",
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
         "functions-have-names": "^1.2.3",
-        "has-property-descriptors": "^1.0.0"
+        "has-property-descriptors": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -14948,13 +14192,17 @@
       "deprecated": "older versions vulnerable to prototype pollution"
     },
     "node_modules/side-channel": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.4.tgz",
-      "integrity": "sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz",
+      "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==",
       "dependencies": {
-        "call-bind": "^1.0.0",
-        "get-intrinsic": "^1.0.2",
-        "object-inspect": "^1.9.0"
+        "call-bind": "^1.0.7",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.4",
+        "object-inspect": "^1.13.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -14967,13 +14215,13 @@
       "dev": true
     },
     "node_modules/sirv": {
-      "version": "2.0.3",
-      "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.3.tgz",
-      "integrity": "sha512-O9jm9BsID1P+0HOi81VpXPoDxYP374pkOLzACAoyUQ/3OUVndNpsz6wMnY2z+yOxzbllCKZrM+9QrWsv4THnyA==",
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.4.tgz",
+      "integrity": "sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==",
       "dev": true,
       "dependencies": {
-        "@polka/url": "^1.0.0-next.20",
-        "mrmime": "^1.0.0",
+        "@polka/url": "^1.0.0-next.24",
+        "mrmime": "^2.0.0",
         "totalist": "^3.0.0"
       },
       "engines": {
@@ -15062,9 +14310,9 @@
       }
     },
     "node_modules/source-map-js": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz",
-      "integrity": "sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==",
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
+      "integrity": "sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==",
       "engines": {
         "node": ">=0.10.0"
       }
@@ -15097,9 +14345,9 @@
       }
     },
     "node_modules/spdx-exceptions": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.3.0.tgz",
-      "integrity": "sha512-/tTrYOC7PPI1nUAgx34hUpqXuyJG+DTHJTnIULG4rDygi4xu/tfgmq1e1cIRwRzwZgo4NLySi+ricLkZkw4i5A==",
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.5.0.tgz",
+      "integrity": "sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==",
       "dev": true
     },
     "node_modules/spdx-expression-parse": {
@@ -15113,9 +14361,9 @@
       }
     },
     "node_modules/spdx-license-ids": {
-      "version": "3.0.16",
-      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.16.tgz",
-      "integrity": "sha512-eWN+LnM3GR6gPu35WxNgbGl8rmY1AEmoMDvL/QD6zYmPWgywxWqJWNdLGT+ke8dKNWrcYgYjPpG5gbTfghP8rw==",
+      "version": "3.0.17",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.17.tgz",
+      "integrity": "sha512-sh8PWc/ftMqAAdFiBu6Fy6JUOYjqDJBJvIhpfDMyHrr0Rbp5liZqd4TjtQ/RgfLjKFZb+LMx5hpml5qOWy0qvg==",
       "dev": true
     },
     "node_modules/spdy": {
@@ -15226,6 +14474,7 @@
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
       "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
       "dependencies": {
         "emoji-regex": "^8.0.0",
         "is-fullwidth-code-point": "^3.0.0",
@@ -15251,34 +14500,41 @@
       }
     },
     "node_modules/string.prototype.matchall": {
-      "version": "4.0.10",
-      "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.10.tgz",
-      "integrity": "sha512-rGXbGmOEosIQi6Qva94HUjgPs9vKW+dkG7Y8Q5O2OYkWL6wFaTRZO8zM4mhP94uX55wgyrXzfS2aGtGzUL7EJQ==",
+      "version": "4.0.11",
+      "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.11.tgz",
+      "integrity": "sha512-NUdh0aDavY2og7IbBPenWqR9exH+E26Sv8e0/eTe1tltDGZL+GtBkDAnnyBtmekfK6/Dq3MkcGtzXFEd1LQrtg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1",
-        "get-intrinsic": "^1.2.1",
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.4",
+        "gopd": "^1.0.1",
         "has-symbols": "^1.0.3",
-        "internal-slot": "^1.0.5",
-        "regexp.prototype.flags": "^1.5.0",
-        "set-function-name": "^2.0.0",
-        "side-channel": "^1.0.4"
+        "internal-slot": "^1.0.7",
+        "regexp.prototype.flags": "^1.5.2",
+        "set-function-name": "^2.0.2",
+        "side-channel": "^1.0.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/string.prototype.trim": {
-      "version": "1.2.8",
-      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.8.tgz",
-      "integrity": "sha512-lfjY4HcixfQXOfaqCvcBuOIapyaroTXhbkfJN3gcB1OtyupngWK4sEET9Knd0cXd28kTUqu/kHoV4HKSJdnjiQ==",
+      "version": "1.2.9",
+      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz",
+      "integrity": "sha512-klHuCNxiMZ8MlsOihJhJEBJAiMVqU3Z2nEXWfWnIqjN0gEFS9J9+IxKozWWtQGcgoa1WUZzLjKPTr4ZHNFTFxw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.0",
+        "es-object-atoms": "^1.0.0"
       },
       "engines": {
         "node": ">= 0.4"
@@ -15288,28 +14544,31 @@
       }
     },
     "node_modules/string.prototype.trimend": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.7.tgz",
-      "integrity": "sha512-Ni79DqeB72ZFq1uH/L6zJ+DKZTkOtPIHovb3YZHQViE+HDouuU4mBrLOLDn5Dde3RF8qw5qVETEjhu9locMLvA==",
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.8.tgz",
+      "integrity": "sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
       }
     },
     "node_modules/string.prototype.trimstart": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.7.tgz",
-      "integrity": "sha512-NGhtDFu3jCEm7B4Fy0DpLewdJQOZcQ0rGbwQ/+stjnrp2i+rlKeCvos9hOIeCmqwratM47OBxY7uFZzjxHXmrg==",
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.8.tgz",
+      "integrity": "sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "define-properties": "^1.2.0",
-        "es-abstract": "^1.22.1"
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -15333,6 +14592,7 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
       "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
       "dependencies": {
         "ansi-regex": "^5.0.1"
       },
@@ -15478,9 +14738,9 @@
       }
     },
     "node_modules/table": {
-      "version": "6.8.1",
-      "resolved": "https://registry.npmjs.org/table/-/table-6.8.1.tgz",
-      "integrity": "sha512-Y4X9zqrCftUhMeH2EptSSERdVKt/nEdijTOacGD/97EKjhQ/Qs8RTlEGABSJNNN8lac9kheH+af7yAkEWlgneA==",
+      "version": "6.8.2",
+      "resolved": "https://registry.npmjs.org/table/-/table-6.8.2.tgz",
+      "integrity": "sha512-w2sfv80nrAh2VCbqR5AK27wswXhqcck2AhfnNW76beQXskGZ1V12GwS//yYVa3d3fcvAip2OUnbDAjW2k3v9fA==",
       "dev": true,
       "dependencies": {
         "ajv": "^8.0.1",
@@ -15626,9 +14886,9 @@
       }
     },
     "node_modules/terser": {
-      "version": "5.26.0",
-      "resolved": "https://registry.npmjs.org/terser/-/terser-5.26.0.tgz",
-      "integrity": "sha512-dytTGoE2oHgbNV9nTzgBEPaqAWvcJNl66VZ0BkJqlvp71IjO8CxdBx/ykCNb47cLnCmCvRZ6ZR0tLkqvZCdVBQ==",
+      "version": "5.30.3",
+      "resolved": "https://registry.npmjs.org/terser/-/terser-5.30.3.tgz",
+      "integrity": "sha512-STdUgOUx8rLbMGO9IOwHLpCqolkDITFFQSMYYwKE1N2lY6MVSaeoi10z/EhWxRc6ybqoVmKSkhKYH/XUpl7vSA==",
       "dev": true,
       "dependencies": {
         "@jridgewell/source-map": "^0.3.3",
@@ -15644,16 +14904,16 @@
       }
     },
     "node_modules/terser-webpack-plugin": {
-      "version": "5.3.9",
-      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.9.tgz",
-      "integrity": "sha512-ZuXsqE07EcggTWQjXUj+Aot/OMcD0bMKGgF63f7UxYcu5/AJF53aIpK1YoP5xR9l6s/Hy2b+t1AM0bLNPRuhwA==",
+      "version": "5.3.10",
+      "resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-5.3.10.tgz",
+      "integrity": "sha512-BKFPWlPDndPs+NGGCr1U59t0XScL5317Y0UReNrHaw9/FwhPENlq6bfgs+4yPfyP51vqC1bQ4rp1EfXW5ZSH9w==",
       "dev": true,
       "dependencies": {
-        "@jridgewell/trace-mapping": "^0.3.17",
+        "@jridgewell/trace-mapping": "^0.3.20",
         "jest-worker": "^27.4.5",
         "schema-utils": "^3.1.1",
         "serialize-javascript": "^6.0.1",
-        "terser": "^5.16.8"
+        "terser": "^5.26.0"
       },
       "engines": {
         "node": ">= 10.13.0"
@@ -15791,15 +15051,12 @@
       "dev": true
     },
     "node_modules/tmp": {
-      "version": "0.2.1",
-      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.1.tgz",
-      "integrity": "sha512-76SUhtfqR2Ijn+xllcI5P1oyannHNHByD80W1q447gU3mp9G9PSpGdWmjUOHRDPiHYacIk66W7ubDTuPF3BEtQ==",
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/tmp/-/tmp-0.2.3.tgz",
+      "integrity": "sha512-nZD7m9iCPC5g0pYmcaxogYKggSfLsdxl8of3Q/oIbqCqLLIO9IAF0GWjX1z9NZRHPiXv8Wex4yDCaZsgEw0Y8w==",
       "dev": true,
-      "dependencies": {
-        "rimraf": "^3.0.0"
-      },
       "engines": {
-        "node": ">=8.17.0"
+        "node": ">=14.14"
       }
     },
     "node_modules/to-fast-properties": {
@@ -15962,9 +15219,9 @@
       }
     },
     "node_modules/ts-loader/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
       "dev": true,
       "dependencies": {
         "lru-cache": "^6.0.0"
@@ -16076,29 +15333,30 @@
       }
     },
     "node_modules/typed-array-buffer": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.0.tgz",
-      "integrity": "sha512-Y8KTSIglk9OZEr8zywiIHG/kmQ7KWyjseXs1CbSo8vC42w7hg2HgYTxSWwP0+is7bWDc1H+Fo026CpHFwm8tkw==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz",
+      "integrity": "sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
-        "get-intrinsic": "^1.2.1",
-        "is-typed-array": "^1.1.10"
+        "call-bind": "^1.0.7",
+        "es-errors": "^1.3.0",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
       }
     },
     "node_modules/typed-array-byte-length": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.0.tgz",
-      "integrity": "sha512-Or/+kvLxNpeQ9DtSydonMxCx+9ZXOswtwJn17SNLvhptaXYDJvkFFP5zbfU/uLmvnBJlI4yrnXRxpdWH/M5tNA==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz",
+      "integrity": "sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "has-proto": "^1.0.1",
-        "is-typed-array": "^1.1.10"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
@@ -16108,16 +15366,17 @@
       }
     },
     "node_modules/typed-array-byte-offset": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.0.tgz",
-      "integrity": "sha512-RD97prjEt9EL8YgAgpOkf3O4IF9lhJFr9g0htQkm0rchFp/Vx7LW5Q8fSXXub7BXAODyUQohRMyOc3faCPd0hg==",
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz",
+      "integrity": "sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==",
       "dev": true,
       "dependencies": {
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.2",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "has-proto": "^1.0.1",
-        "is-typed-array": "^1.1.10"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13"
       },
       "engines": {
         "node": ">= 0.4"
@@ -16127,14 +15386,20 @@
       }
     },
     "node_modules/typed-array-length": {
-      "version": "1.0.4",
-      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.4.tgz",
-      "integrity": "sha512-KjZypGq+I/H7HI5HlOoGHkWUUGq+Q0TPhQurLbyrVrvnKTBgzLhIJ7j6J/XTQOi0d1RjyZ0wdas8bKs2p0x3Ng==",
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.6.tgz",
+      "integrity": "sha512-/OxDN6OtAk5KBpGb28T+HZc2M+ADtvRxXrKKbUwtsLgdoxgX13hyy7ek6bFRl5+aBs2yZzB0c4CnQfAtVypW/g==",
       "dev": true,
       "dependencies": {
-        "call-bind": "^1.0.2",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
-        "is-typed-array": "^1.1.9"
+        "gopd": "^1.0.1",
+        "has-proto": "^1.0.3",
+        "is-typed-array": "^1.1.13",
+        "possible-typed-array-names": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
       },
       "funding": {
         "url": "https://github.com/sponsors/ljharb"
@@ -16168,17 +15433,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/undici": {
-      "version": "5.26.5",
-      "resolved": "https://registry.npmjs.org/undici/-/undici-5.26.5.tgz",
-      "integrity": "sha512-cSb4bPFd5qgR7qr2jYAi0hlX9n5YKK2ONKkLFkxl+v/9BvC0sOpZjBHDBSXc5lWAf5ty9oZdRXytBIHzgUcerw==",
-      "dependencies": {
-        "@fastify/busboy": "^2.0.0"
-      },
-      "engines": {
-        "node": ">=14.0"
-      }
-    },
     "node_modules/unicode-canonical-property-names-ecmascript": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz",
@@ -16397,229 +15651,62 @@
         "node >=0.6.0"
       ],
       "dependencies": {
-        "assert-plus": "^1.0.0",
-        "core-util-is": "1.0.2",
-        "extsprintf": "^1.2.0"
-      }
-    },
-    "node_modules/vue": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.3.11.tgz",
-      "integrity": "sha512-d4oBctG92CRO1cQfVBZp6WJAs0n8AK4Xf5fNjQCBeKCvMI1efGQ5E3Alt1slFJS9fZuPcFoiAiqFvQlv1X7t/w==",
-      "dependencies": {
-        "@vue/compiler-dom": "3.3.11",
-        "@vue/compiler-sfc": "3.3.11",
-        "@vue/runtime-dom": "3.3.11",
-        "@vue/server-renderer": "3.3.11",
-        "@vue/shared": "3.3.11"
-      },
-      "peerDependencies": {
-        "typescript": "*"
-      },
-      "peerDependenciesMeta": {
-        "typescript": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/vue-cli-plugin-i18n": {
-      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/vue-cli-plugin-i18n/-/vue-cli-plugin-i18n-1.0.1.tgz",
-      "integrity": "sha512-sLo6YzudaWgn5dOMvrKixE5bb/onYGxcxm+0YexqoOx0QtR+7hZ/P5WPFBMM9v/2i1ec2YYe2PvKTBel7KE+tA==",
-      "dev": true,
-      "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",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.15.tgz",
-      "integrity": "sha512-FCvIEevPmgCgqFBH7wD+3B97y7u7oj/Wr69zADBf403Tui377bThTjBvekaZvlRr4IwUAu3M6hYZeULZFJbdYg==",
-      "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",
-      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.6.0.tgz",
-      "integrity": "sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      }
-    },
-    "node_modules/vue-cli-plugin-i18n/node_modules/vue": {
-      "version": "2.7.15",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-2.7.15.tgz",
-      "integrity": "sha512-a29fsXd2G0KMRqIFTpRgpSbWaNBK3lpCTOLuGLEDnlHWdjB8fwl6zyYZ8xCrqkJdatwZb4mGHiEfJjnw0Q6AwQ==",
-      "dev": true,
-      "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",
-      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.28.2.tgz",
-      "integrity": "sha512-C5GZjs1tYlAqjwymaaCPDjCyGo10ajUphiwA922jKt9n7KPpqR7oM1PCwYzhB/E7+nT3wfdG3oRre5raIT1rKA==",
-      "dev": true
-    },
-    "node_modules/vue-component-type-helpers": {
-      "version": "1.8.25",
-      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-1.8.25.tgz",
-      "integrity": "sha512-NCA6sekiJIMnMs4DdORxATXD+/NRkQpS32UC+I1KQJUasx+Z7MZUb3Y+MsKsFmX+PgyTYSteb73JW77AibaCCw==",
-      "dev": true
-    },
-    "node_modules/vue-eslint-parser": {
-      "version": "8.3.0",
-      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz",
-      "integrity": "sha512-dzHGG3+sYwSf6zFBa0Gi9ZDshD7+ad14DGOdTLjruRVgZXe2J+DcZ9iUhyR48z5g1PqRa20yt3Njna/veLJL/g==",
-      "dev": true,
-      "dependencies": {
-        "debug": "^4.3.2",
-        "eslint-scope": "^7.0.0",
-        "eslint-visitor-keys": "^3.1.0",
-        "espree": "^9.0.0",
-        "esquery": "^1.4.0",
-        "lodash": "^4.17.21",
-        "semver": "^7.3.5"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/mysticatea"
-      },
-      "peerDependencies": {
-        "eslint": ">=6.0.0"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/eslint-scope": {
-      "version": "7.2.2",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
-      "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
-      "dev": true,
-      "dependencies": {
-        "esrecurse": "^4.3.0",
-        "estraverse": "^5.2.0"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/eslint"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/espree": {
-      "version": "9.6.1",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
-      "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==",
-      "dev": true,
-      "dependencies": {
-        "acorn": "^8.9.0",
-        "acorn-jsx": "^5.3.2",
-        "eslint-visitor-keys": "^3.4.1"
-      },
-      "engines": {
-        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/eslint"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/estraverse": {
-      "version": "5.3.0",
-      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
-      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
-      "dev": true,
-      "engines": {
-        "node": ">=4.0"
-      }
-    },
-    "node_modules/vue-eslint-parser/node_modules/lru-cache": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
-      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
-      "dev": true,
-      "dependencies": {
-        "yallist": "^4.0.0"
-      },
-      "engines": {
-        "node": ">=10"
+        "assert-plus": "^1.0.0",
+        "core-util-is": "1.0.2",
+        "extsprintf": "^1.2.0"
       }
     },
-    "node_modules/vue-eslint-parser/node_modules/semver": {
-      "version": "7.5.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.5.4.tgz",
-      "integrity": "sha512-1bCSESV6Pv+i21Hvpxp3Dx+pSD8lIPt8uVjRrxAUt/nbswYc+tK6Y2btiULjd4+fnq15PX+nqQDC7Oft7WkwcA==",
-      "dev": true,
+    "node_modules/vue": {
+      "version": "3.4.21",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.4.21.tgz",
+      "integrity": "sha512-5hjyV/jLEIKD/jYl4cavMcnzKwjMKohureP8ejn3hhEjwhWIhWeuzL2kJAjzl/WyVsgPY56Sy4Z40C3lVshxXA==",
       "dependencies": {
-        "lru-cache": "^6.0.0"
+        "@vue/compiler-dom": "3.4.21",
+        "@vue/compiler-sfc": "3.4.21",
+        "@vue/runtime-dom": "3.4.21",
+        "@vue/server-renderer": "3.4.21",
+        "@vue/shared": "3.4.21"
       },
-      "bin": {
-        "semver": "bin/semver.js"
+      "peerDependencies": {
+        "typescript": "*"
       },
-      "engines": {
-        "node": ">=10"
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
       }
     },
-    "node_modules/vue-eslint-parser/node_modules/yallist": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
-      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
-      "dev": true
-    },
-    "node_modules/vue-hot-reload-api": {
-      "version": "2.3.4",
-      "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
-      "integrity": "sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==",
-      "dev": true
-    },
-    "node_modules/vue-i18n": {
-      "version": "9.1.10",
-      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.1.10.tgz",
-      "integrity": "sha512-jpr7gV5KPk4n+sSPdpZT8Qx3XzTcNDWffRlHV/cT2NUyEf+sEgTTmLvnBAibjOFJ0zsUyZlVTAWH5DDnYep+1g==",
+    "node_modules/vue-cli-plugin-i18n": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/vue-cli-plugin-i18n/-/vue-cli-plugin-i18n-1.0.1.tgz",
+      "integrity": "sha512-sLo6YzudaWgn5dOMvrKixE5bb/onYGxcxm+0YexqoOx0QtR+7hZ/P5WPFBMM9v/2i1ec2YYe2PvKTBel7KE+tA==",
+      "dev": true,
       "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"
+        "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-i18n-extract": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/vue-i18n-extract/-/vue-i18n-extract-1.0.2.tgz",
-      "integrity": "sha512-+zwDKvle4KcfloXZnj5hF01ViKDiFr5RMx5507D7oyDXpSleRpekF5YHgZa/+Ra6Go68//z0Nya58J9tKFsCjw==",
+    "node_modules/vue-cli-plugin-i18n/node_modules/@vue/compiler-sfc": {
+      "version": "2.7.16",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-2.7.16.tgz",
+      "integrity": "sha512-KWhJ9k5nXuNtygPU7+t1rX6baZeqOYLEforUPjgNDBnLicfHCoi48H87Q8XyLZOrNNsmhuwKqtpDQWjEFe6Ekg==",
       "dev": true,
       "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"
+        "@babel/parser": "^7.23.5",
+        "postcss": "^8.4.14",
+        "source-map": "^0.6.1"
       },
-      "bin": {
-        "vue-i18n-extract": "dist-node/index.bin.js"
+      "optionalDependencies": {
+        "prettier": "^1.18.2 || ^2.0.0"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/ansi-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/ansi-regex": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-3.0.1.tgz",
       "integrity": "sha512-+O9Jct8wf++lXxxFc4hc8LsjaSq0HFzzL7cVsw8pRDIPdjKD2mT4ytDZlLuSBZ4cLKZFXIrMGO7DbQCtMJJMKw==",
@@ -16628,7 +15715,7 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/camelcase": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/camelcase": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
       "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
@@ -16637,7 +15724,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cli-table3": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cli-table3": {
       "version": "0.5.1",
       "resolved": "https://registry.npmjs.org/cli-table3/-/cli-table3-0.5.1.tgz",
       "integrity": "sha512-7Qg2Jrep1S/+Q3EceiZtQcDPWxhAvBw+ERf1162v4sikJrvojMHFqXt8QIVha8UlH9rgU0BeWPytZ9/TzYqlUw==",
@@ -16653,7 +15740,7 @@
         "colors": "^1.1.2"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cliui": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cliui": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
       "integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
@@ -16664,7 +15751,7 @@
         "wrap-ansi": "^5.1.0"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/ansi-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cliui/node_modules/ansi-regex": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
       "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
@@ -16673,7 +15760,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/string-width": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cliui/node_modules/string-width": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
       "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
@@ -16687,7 +15774,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/cliui/node_modules/strip-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/cliui/node_modules/strip-ansi": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
       "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
@@ -16699,13 +15786,31 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/emoji-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/dotenv": {
+      "version": "8.6.0",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-8.6.0.tgz",
+      "integrity": "sha512-IrPdXQsk2BbzvCBGBOTmmSH5SodmqZNt4ERAZDmW4CT+tL8VtvinqywuANaFu4bOMWki16nqf0e4oC0QIaDr/g==",
+      "dev": true,
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/vue-cli-plugin-i18n/node_modules/emoji-regex": {
       "version": "7.0.3",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-7.0.3.tgz",
       "integrity": "sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA==",
       "dev": true
     },
-    "node_modules/vue-i18n-extract/node_modules/find-up": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/esm": {
+      "version": "3.2.25",
+      "resolved": "https://registry.npmjs.org/esm/-/esm-3.2.25.tgz",
+      "integrity": "sha512-U1suiZ2oDVWv4zPO56S0NcR5QriEahGtdN2OR6FiOG4WJvcjBVFB0qI4+eKoWFH483PKGuLuu6V8Z4T5g63UVA==",
+      "dev": true,
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/vue-cli-plugin-i18n/node_modules/find-up": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
       "integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
@@ -16717,7 +15822,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/is-fullwidth-code-point": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/is-fullwidth-code-point": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
       "integrity": "sha512-VHskAKYM8RfSFXwee5t5cbN5PZeq1Wrh6qd5bkyiXIf6UQcN6w/A0eXM9r6t8d+GYOh+o6ZhiEnb88LN/Y8m2w==",
@@ -16726,7 +15831,7 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/locate-path": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/locate-path": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
       "integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
@@ -16739,7 +15844,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/p-locate": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/p-locate": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-3.0.0.tgz",
       "integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
@@ -16751,7 +15856,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/path-exists": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/path-exists": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
       "integrity": "sha512-bpC7GYwiDYQ4wYLe+FA8lhRjhQCMcQGuSgGGqDkg/QerRWw9CmGRT0iSOVRSZJ29NMLZgIzqaljJ63oaL4NIJQ==",
@@ -16760,7 +15865,7 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/string-width": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/string-width": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-2.1.1.tgz",
       "integrity": "sha512-nOqH59deCq9SRHlxq1Aw85Jnt4w6KvLKqWVik6oA9ZklXLNIOlqg4F2yrT1MVaTjAqvVwdfeZ7w7aCvJD7ugkw==",
@@ -16773,7 +15878,7 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/strip-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/strip-ansi": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-4.0.0.tgz",
       "integrity": "sha512-4XaJ2zQdCzROZDivEVIDPkcQn8LMFSa8kj8Gxb/Lnwzv9A8VctNZ+lfivC/sV3ivW8ElJTERXZoPBRrZKkNKow==",
@@ -16785,7 +15890,41 @@
         "node": ">=4"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/vue": {
+      "version": "2.7.16",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-2.7.16.tgz",
+      "integrity": "sha512-4gCtFXaAA3zYZdTp5s4Hl2sozuySsgz4jy1EnpBHNfpMa9dK1ZCG7viqBPCwXtmgc8nHqUsAu3G4gtmXkkY3Sw==",
+      "deprecated": "Vue 2 has reached EOL and is no longer actively maintained. See https://v2.vuejs.org/eol/ for more details.",
+      "dev": true,
+      "dependencies": {
+        "@vue/compiler-sfc": "2.7.16",
+        "csstype": "^3.1.0"
+      }
+    },
+    "node_modules/vue-cli-plugin-i18n/node_modules/vue-i18n": {
+      "version": "8.28.2",
+      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-8.28.2.tgz",
+      "integrity": "sha512-C5GZjs1tYlAqjwymaaCPDjCyGo10ajUphiwA922jKt9n7KPpqR7oM1PCwYzhB/E7+nT3wfdG3oRre5raIT1rKA==",
+      "dev": true
+    },
+    "node_modules/vue-cli-plugin-i18n/node_modules/vue-i18n-extract": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/vue-i18n-extract/-/vue-i18n-extract-1.0.2.tgz",
+      "integrity": "sha512-+zwDKvle4KcfloXZnj5hF01ViKDiFr5RMx5507D7oyDXpSleRpekF5YHgZa/+Ra6Go68//z0Nya58J9tKFsCjw==",
+      "dev": true,
+      "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-cli-plugin-i18n/node_modules/wrap-ansi": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-5.1.0.tgz",
       "integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
@@ -16799,7 +15938,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/ansi-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/wrap-ansi/node_modules/ansi-regex": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
       "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
@@ -16808,7 +15947,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/string-width": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/wrap-ansi/node_modules/string-width": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
       "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
@@ -16822,7 +15961,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/wrap-ansi/node_modules/strip-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/wrap-ansi/node_modules/strip-ansi": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
       "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
@@ -16834,13 +15973,13 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/y18n": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/y18n": {
       "version": "4.0.3",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.3.tgz",
       "integrity": "sha512-JKhqTOwSrqNA1NY5lSztJ1GrBiUodLMmIZuLiDaMRJ+itFd+ABVE8XBjOvIWL+rSqNDC74LCSFmlb/U4UZ4hJQ==",
       "dev": true
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs": {
       "version": "13.3.2",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",
       "integrity": "sha512-AX3Zw5iPruN5ie6xGRIDgqkT+ZhnRlZMLMHAs8tg7nRruy2Nb+i5o9bwghAogtM08q1dpr2LVoS8KSTMYpWXUw==",
@@ -16858,7 +15997,7 @@
         "yargs-parser": "^13.1.2"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs-parser": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs-parser": {
       "version": "13.1.2",
       "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.2.tgz",
       "integrity": "sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==",
@@ -16868,7 +16007,7 @@
         "decamelize": "^1.2.0"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/ansi-regex": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs/node_modules/ansi-regex": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.1.tgz",
       "integrity": "sha512-ILlv4k/3f6vfQ4OoP2AGvirOktlQ98ZEL1k9FaQjxa3L1abBgbuTDAdPOpvbGncC0BTVQrl+OM8xZGK6tWXt7g==",
@@ -16877,7 +16016,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/string-width": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs/node_modules/string-width": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
       "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
@@ -16891,7 +16030,7 @@
         "node": ">=6"
       }
     },
-    "node_modules/vue-i18n-extract/node_modules/yargs/node_modules/strip-ansi": {
+    "node_modules/vue-cli-plugin-i18n/node_modules/yargs/node_modules/strip-ansi": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
       "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
@@ -16903,6 +16042,134 @@
         "node": ">=6"
       }
     },
+    "node_modules/vue-component-type-helpers": {
+      "version": "2.0.10",
+      "resolved": "https://registry.npmjs.org/vue-component-type-helpers/-/vue-component-type-helpers-2.0.10.tgz",
+      "integrity": "sha512-FC5fKJjDks3Ue/KRSYBdsiCaZa0kUPQfs8yQpb8W9mlO6BenV8G1z58xobeRMzevnmEcDa09LLwuXDwb4f6NMQ==",
+      "dev": true
+    },
+    "node_modules/vue-eslint-parser": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz",
+      "integrity": "sha512-dzHGG3+sYwSf6zFBa0Gi9ZDshD7+ad14DGOdTLjruRVgZXe2J+DcZ9iUhyR48z5g1PqRa20yt3Njna/veLJL/g==",
+      "dev": true,
+      "dependencies": {
+        "debug": "^4.3.2",
+        "eslint-scope": "^7.0.0",
+        "eslint-visitor-keys": "^3.1.0",
+        "espree": "^9.0.0",
+        "esquery": "^1.4.0",
+        "lodash": "^4.17.21",
+        "semver": "^7.3.5"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mysticatea"
+      },
+      "peerDependencies": {
+        "eslint": ">=6.0.0"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/eslint-scope": {
+      "version": "7.2.2",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz",
+      "integrity": "sha512-dOt21O7lTMhDM+X9mB4GX+DZrZtCUJPL/wlcTqxyrx5IvO0IYtILdtrQGQp+8n5S0gwSVmOf9NQrjMOgfQZlIg==",
+      "dev": true,
+      "dependencies": {
+        "esrecurse": "^4.3.0",
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/espree": {
+      "version": "9.6.1",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-9.6.1.tgz",
+      "integrity": "sha512-oruZaFkjorTpF32kDSI5/75ViwGeZginGGy2NoOSg3Q9bnwlnmDm4HLnkl0RE3n+njDXR037aY1+x58Z/zFdwQ==",
+      "dev": true,
+      "dependencies": {
+        "acorn": "^8.9.0",
+        "acorn-jsx": "^5.3.2",
+        "eslint-visitor-keys": "^3.4.1"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/estraverse": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
+      "dev": true,
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/lru-cache": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+      "integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+      "dev": true,
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/semver": {
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.6.0.tgz",
+      "integrity": "sha512-EnwXhrlwXMk9gKu5/flx5sv/an57AkRplG3hTK68W7FRDN+k+OWBj65M7719OkA82XLBxrcX0KSHj+X5COhOVg==",
+      "dev": true,
+      "dependencies": {
+        "lru-cache": "^6.0.0"
+      },
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/vue-eslint-parser/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true
+    },
+    "node_modules/vue-hot-reload-api": {
+      "version": "2.3.4",
+      "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
+      "integrity": "sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==",
+      "dev": true
+    },
+    "node_modules/vue-i18n": {
+      "version": "9.1.10",
+      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.1.10.tgz",
+      "integrity": "sha512-jpr7gV5KPk4n+sSPdpZT8Qx3XzTcNDWffRlHV/cT2NUyEf+sEgTTmLvnBAibjOFJ0zsUyZlVTAWH5DDnYep+1g==",
+      "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/node_modules/@intlify/core-base": {
       "version": "9.1.10",
       "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.1.10.tgz",
@@ -16941,9 +16208,9 @@
       }
     },
     "node_modules/vue-loader": {
-      "version": "17.3.1",
-      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-17.3.1.tgz",
-      "integrity": "sha512-nmVu7KU8geOyzsStyyaxID/uBGDMS8BkPXb6Lu2SNkMawriIbb+hYrNtgftHMKxOSkjjjTF5OSSwPo3KP59egg==",
+      "version": "17.4.2",
+      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-17.4.2.tgz",
+      "integrity": "sha512-yTKOA4R/VN4jqjw4y5HrynFL8AK0Z3/Jt7eOJXEitsm0GMRHDBjCfCiuTiLP7OESvsZYo2pATCWhDqxC5ZrM6w==",
       "dev": true,
       "dependencies": {
         "chalk": "^4.1.0",
@@ -17038,11 +16305,11 @@
       "integrity": "sha512-PGGwFarWpReyJc8XONuNBb86mpfLqYO6+MWjkFnCDWcagjM2BLY7rskLTgn3eT3skq0qu+2K2roiIAgiXJDXSQ=="
     },
     "node_modules/vue-router": {
-      "version": "4.2.5",
-      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.2.5.tgz",
-      "integrity": "sha512-DIUpKcyg4+PTQKfFPX88UWhlagBEBEfJ5A8XDXRJLUnZOvcpMF8o/dnL90vpVkGaPbjvXazV/rC1qBKrZlFugw==",
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.3.0.tgz",
+      "integrity": "sha512-dqUcs8tUeG+ssgWhcPbjHvazML16Oga5w34uCUmsk7i0BcnskoLGwjpa15fqMr2Fa5JgVBrdL2MEgqz6XZ/6IQ==",
       "dependencies": {
-        "@vue/devtools-api": "^6.5.0"
+        "@vue/devtools-api": "^6.5.1"
       },
       "funding": {
         "url": "https://github.com/sponsors/posva"
@@ -17124,9 +16391,9 @@
       }
     },
     "node_modules/watchpack": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz",
-      "integrity": "sha512-Lcvm7MGST/4fup+ifyKi2hjyIAwcdI4HRgtvTpIUxBRhB+RFtUh8XtDOxUfctVCnhVi+QQj49i91OyvzkJl6cg==",
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.1.tgz",
+      "integrity": "sha512-8wrBCMtVhqcXP2Sup1ctSkga6uc2Bx0IIvKyT7yTFier5AXHooSI+QyQQAtTb7+E0IUCCKyTFmXqdqgum2XWGg==",
       "dev": true,
       "dependencies": {
         "glob-to-regexp": "^0.4.1",
@@ -17161,34 +16428,34 @@
       "dev": true
     },
     "node_modules/webpack": {
-      "version": "5.89.0",
-      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.89.0.tgz",
-      "integrity": "sha512-qyfIC10pOr70V+jkmud8tMfajraGCZMBWJtrmuBymQKCrLTRejBI8STDp1MCyZu/QTdZSeacCQYpYNQVOzX5kw==",
+      "version": "5.91.0",
+      "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.91.0.tgz",
+      "integrity": "sha512-rzVwlLeBWHJbmgTC/8TvAcu5vpJNII+MelQpylD4jNERPwpBJOE2lEcko1zJX3QJeLjTTAnQxn/OJ8bjDzVQaw==",
       "dev": true,
       "dependencies": {
         "@types/eslint-scope": "^3.7.3",
-        "@types/estree": "^1.0.0",
-        "@webassemblyjs/ast": "^1.11.5",
-        "@webassemblyjs/wasm-edit": "^1.11.5",
-        "@webassemblyjs/wasm-parser": "^1.11.5",
+        "@types/estree": "^1.0.5",
+        "@webassemblyjs/ast": "^1.12.1",
+        "@webassemblyjs/wasm-edit": "^1.12.1",
+        "@webassemblyjs/wasm-parser": "^1.12.1",
         "acorn": "^8.7.1",
         "acorn-import-assertions": "^1.9.0",
-        "browserslist": "^4.14.5",
+        "browserslist": "^4.21.10",
         "chrome-trace-event": "^1.0.2",
-        "enhanced-resolve": "^5.15.0",
+        "enhanced-resolve": "^5.16.0",
         "es-module-lexer": "^1.2.1",
         "eslint-scope": "5.1.1",
         "events": "^3.2.0",
         "glob-to-regexp": "^0.4.1",
-        "graceful-fs": "^4.2.9",
+        "graceful-fs": "^4.2.11",
         "json-parse-even-better-errors": "^2.3.1",
         "loader-runner": "^4.2.0",
         "mime-types": "^2.1.27",
         "neo-async": "^2.6.2",
         "schema-utils": "^3.2.0",
         "tapable": "^2.1.1",
-        "terser-webpack-plugin": "^5.3.7",
-        "watchpack": "^2.4.0",
+        "terser-webpack-plugin": "^5.3.10",
+        "watchpack": "^2.4.1",
         "webpack-sources": "^3.2.3"
       },
       "bin": {
@@ -17259,6 +16526,7 @@
       "version": "6.5.1",
       "resolved": "https://registry.npmjs.org/webpack-chain/-/webpack-chain-6.5.1.tgz",
       "integrity": "sha512-7doO/SRtLu8q5WM0s7vPKPWX580qhi0/yBHkOxNkv50f6qB76Zy9o2wRTrrPULqYTvQlVHuvbA8v+G5ayuUDsA==",
+      "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.",
       "dev": true,
       "dependencies": {
         "deepmerge": "^1.5.2",
@@ -17278,9 +16546,9 @@
       }
     },
     "node_modules/webpack-dev-middleware": {
-      "version": "5.3.3",
-      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-5.3.3.tgz",
-      "integrity": "sha512-hj5CYrY0bZLB+eTO+x/j67Pkrquiy7kWepMHmUMoPsmcUaeEnQJqFzHJOyxgWlq746/wUuA64p9ta34Kyb01pA==",
+      "version": "5.3.4",
+      "resolved": "https://registry.npmjs.org/webpack-dev-middleware/-/webpack-dev-middleware-5.3.4.tgz",
+      "integrity": "sha512-BVdTqhhs+0IfoeAf7EoH5WE+exCmqGerHfDM0IL096Px60Tq2Mn9MAbnaGUe6HiMa41KMCYF19gyzZmBcq/o4Q==",
       "dev": true,
       "dependencies": {
         "colorette": "^2.0.10",
@@ -17354,9 +16622,9 @@
       }
     },
     "node_modules/webpack-dev-server": {
-      "version": "4.15.1",
-      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.15.1.tgz",
-      "integrity": "sha512-5hbAst3h3C3L8w6W4P96L5vaV0PxSmJhxZvWKYIdgxOQm8pNZ5dEOmmSLBVpP85ReeyRt6AS1QJNyo/oFFPeVA==",
+      "version": "4.15.2",
+      "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.15.2.tgz",
+      "integrity": "sha512-0XavAZbNJ5sDrCbkpWL8mia0o5WPOd2YGtxrEiZkBK9FjLppIUK2TgxK6qGD2P3hUXTJNNPVibrerKcx5WkR1g==",
       "dev": true,
       "dependencies": {
         "@types/bonjour": "^3.5.9",
@@ -17387,7 +16655,7 @@
         "serve-index": "^1.9.1",
         "sockjs": "^0.3.24",
         "spdy": "^4.0.2",
-        "webpack-dev-middleware": "^5.3.1",
+        "webpack-dev-middleware": "^5.3.4",
         "ws": "^8.13.0"
       },
       "bin": {
@@ -17483,9 +16751,9 @@
       }
     },
     "node_modules/webpack-dev-server/node_modules/ws": {
-      "version": "8.14.2",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.14.2.tgz",
-      "integrity": "sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==",
+      "version": "8.16.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.16.0.tgz",
+      "integrity": "sha512-HS0c//TP7Ina87TfiPUz1rQzMhHrl/SG2guqRcTOIUYD2q8uhUdNHZYJUaQ8aTGPzCh+c6oawMKW35nFl1dxyQ==",
       "dev": true,
       "engines": {
         "node": ">=10.0.0"
@@ -17563,6 +16831,7 @@
       "version": "0.7.4",
       "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz",
       "integrity": "sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==",
+      "dev": true,
       "dependencies": {
         "http-parser-js": ">=0.5.1",
         "safe-buffer": ">=5.1.0",
@@ -17576,14 +16845,15 @@
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
       "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
+      "dev": true,
       "engines": {
         "node": ">=0.8.0"
       }
     },
     "node_modules/whatwg-fetch": {
-      "version": "3.6.19",
-      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.6.19.tgz",
-      "integrity": "sha512-d67JP4dHSbm2TrpFj8AbO8DnL1JXL5J9u0Kq2xW6d0TFDbCA3Muhdt8orXC22utleTVj7Prqt82baN6RBvnEgw==",
+      "version": "3.6.20",
+      "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.6.20.tgz",
+      "integrity": "sha512-EqhiFU6daOA8kpjOWTL0olhVOF3i7OrFzSYiGsEMB8GcXS+RrzauAERX65xMeNWVqxA6HXH2m69Z9LaKKdisfg==",
       "dev": true
     },
     "node_modules/whatwg-url": {
@@ -17631,16 +16901,16 @@
       "dev": true
     },
     "node_modules/which-typed-array": {
-      "version": "1.1.13",
-      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.13.tgz",
-      "integrity": "sha512-P5Nra0qjSncduVPEAr7xhoF5guty49ArDTwzJ/yNuPIbZppyRxFQsRCWrocxIY+CnMVG+qfbU2FmDKyvSGClow==",
+      "version": "1.1.15",
+      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.15.tgz",
+      "integrity": "sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==",
       "dev": true,
       "dependencies": {
-        "available-typed-arrays": "^1.0.5",
-        "call-bind": "^1.0.4",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.7",
         "for-each": "^0.3.3",
         "gopd": "^1.0.1",
-        "has-tostringtag": "^1.0.0"
+        "has-tostringtag": "^1.0.2"
       },
       "engines": {
         "node": ">= 0.4"
@@ -17865,6 +17135,7 @@
       "version": "6.6.0",
       "resolved": "https://registry.npmjs.org/workbox-google-analytics/-/workbox-google-analytics-6.6.0.tgz",
       "integrity": "sha512-p4DJa6OldXWd6M9zRl0H6vB9lkrmqYFkRQ2xEiNdBFp9U0LhsGO7hsBscVEyH9H2/3eZZt8c97NB2FD9U2NJ+Q==",
+      "deprecated": "It is not compatible with newer versions of GA starting with v4, as long as you are using GAv3 it should be ok, but the package is not longer being maintained",
       "dev": true,
       "dependencies": {
         "workbox-background-sync": "6.6.0",
@@ -17993,6 +17264,7 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
       "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
       "dependencies": {
         "ansi-styles": "^4.0.0",
         "string-width": "^4.1.0",
@@ -18060,6 +17332,7 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
       "dependencies": {
         "color-convert": "^2.0.1"
       },
@@ -18074,6 +17347,7 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
       "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "dev": true,
       "dependencies": {
         "color-name": "~1.1.4"
       },
@@ -18084,7 +17358,8 @@
     "node_modules/wrap-ansi/node_modules/color-name": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "dev": true
     },
     "node_modules/wrappy": {
       "version": "1.0.2",
@@ -18148,6 +17423,7 @@
       "version": "5.0.8",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
       "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "dev": true,
       "engines": {
         "node": ">=10"
       }
diff --git a/package.json b/package.json
index 1cda8406..3886d685 100644
--- a/package.json
+++ b/package.json
@@ -19,11 +19,12 @@
     "@casl/vue": "^2.2.0",
     "@hotwax/app-version-info": "^1.0.0",
     "@hotwax/apps-theme": "^1.2.6",
-    "@hotwax/dxp-components": "1.12.1",
-    "@hotwax/oms-api": "^1.10.0",
     "@ionic/core": "6.7.5",
     "@ionic/vue": "6.7.5",
     "@ionic/vue-router": "6.7.5",
+    "axios": "^0.21.1",
+    "axios-cache-adapter": "^2.7.3",
+    "http-status-codes": "^2.1.4",
     "boolean-parser": "0.0.2",
     "boon-js": "^2.0.3",
     "core-js": "^3.6.5",
diff --git a/src/App.vue b/src/App.vue
index a7e43f2f..00ae8f1d 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -13,9 +13,7 @@ import { options, settings, pulseOutline } from 'ionicons/icons';
 import emitter from "@/event-bus"
 import { useRouter } from 'vue-router';
 import { mapGetters, useStore } from 'vuex';
-import { Settings } from 'luxon'
 import Menu from '@/components/Menu.vue';
-import { initialise, resetConfig } from '@/adapter'
 
 export default defineComponent({
   name: 'App',
@@ -26,17 +24,12 @@ export default defineComponent({
   },
   data() {
     return {
-      loader: null as any,
-      maxAge: process.env.VUE_APP_CACHE_MAX_AGE ? parseInt(process.env.VUE_APP_CACHE_MAX_AGE) : 0,
-      alias: JSON.parse(process.env.VUE_APP_ALIAS) as any,
-      defaultAlias: process.env.VUE_APP_DEFAULT_ALIAS,
+      loader: null as any
     };
   },
   computed: {
     ...mapGetters({
       instanceUrl: 'user/getInstanceUrl',
-      userProfile: 'user/getUserProfile',
-      eComStore: 'user/getCurrentEComStore',
       userToken: 'user/getUserToken',
       isAuthenticated: 'user/isAuthenticated',
     })
@@ -61,30 +54,8 @@ export default defineComponent({
         this.loader.dismiss();
         this.loader = null as any;
       }
-    },
-    async unauthorized() {
-      // Mark the user as unauthorised, this will help in not making the logout api call in actions
-      this.store.dispatch("user/logout", { isUserUnauthorised: true });
-      const redirectUrl = window.location.origin + '/login';
-      window.location.href = `${process.env.VUE_APP_LOGIN_URL}?redirectUrl=${redirectUrl}`;
     }
   },
-  created() {
-    initialise({
-      token: this.userToken,
-      instanceUrl: this.instanceUrl,
-      cacheMaxAge: this.maxAge,
-      events: {
-        unauthorised: this.unauthorized,
-        responseError: () => {
-          setTimeout(() => this.dismissLoader(), 100);
-        },
-        queueTask: (payload: any) => {
-          emitter.emit("queueTask", payload);
-        }
-      }
-    })
-  },
   async mounted() {
     this.loader = await loadingController
     .create({
@@ -94,21 +65,10 @@ export default defineComponent({
     });
     emitter.on('presentLoader', this.presentLoader);
     emitter.on('dismissLoader', this.dismissLoader);
-    // Handles case when user resumes or reloads the app
-    // Luxon timezzone should be set with the user's selected timezone
-    if (this.userProfile && this.userProfile.userTimeZone) {
-      Settings.defaultZone = this.userProfile.userTimeZone;
-    }
-    if (this.isAuthenticated && !this.instanceUrl && !process.env.VUE_APP_BASE_URL) {
-      // If the current URL is available in alias show it for consistency
-      const defaultAliasInstanceUrl = this.alias[this.defaultAlias];
-      this.store.dispatch("user/setUserInstanceUrl", defaultAliasInstanceUrl);
-    }
   },
   unmounted() {
     emitter.off('presentLoader', this.presentLoader);
     emitter.off('dismissLoader', this.dismissLoader);
-    resetConfig()
   },
   setup() {
     const router = useRouter();
diff --git a/src/adapter/index.ts b/src/adapter/index.ts
deleted file mode 100644
index 23716e29..00000000
--- a/src/adapter/index.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import { api, client, getConfig, init, initialise, logout, resetConfig, updateInstanceUrl, updateToken } from '@hotwax/oms-api'
-
-export {
-  api,
-  client,
-  getConfig,
-  init,
-  initialise,
-  logout,
-  resetConfig,
-  updateInstanceUrl,
-  updateToken
-}
\ No newline at end of file
diff --git a/src/api/index.ts b/src/api/index.ts
new file mode 100644
index 00000000..74a770e2
--- /dev/null
+++ b/src/api/index.ts
@@ -0,0 +1,113 @@
+import axios from "axios";
+import { setupCache } from "axios-cache-adapter"
+import OfflineHelper from "@/offline-helper"
+import emitter from "@/event-bus"
+import store from "@/store";
+import { StatusCodes } from "http-status-codes";
+import router from "@/router"
+
+axios.interceptors.request.use((config: any) => {
+  // TODO: pass csrf token
+  const token = store.getters["user/getUserToken"];
+  if (token) {
+    config.headers["api_key"] =  token;
+    config.headers["Content-Type"] = "application/json";
+  }
+
+  return config;
+});
+
+// TODO: need to update this as per the changes in the Moqui response format, if required.
+axios.interceptors.response.use(function (response: any) {
+  // Any status code that lie within the range of 2xx cause this function to trigger
+  // Do something with response data
+
+  // TODO: explore more on a secure way to store the csrf token
+  // Cannot store it in cookies or localStorage as its not safe
+  // https://stackoverflow.com/questions/67062876/is-it-secure-to-store-a-csrf-token-value-in-the-dom
+  // https://stackoverflow.com/questions/62289684/what-is-the-correct-way-for-a-client-to-store-a-csrf-token
+  const csrfToken = response.headers["x-csrf-token"]
+  const meta = document.createElement("meta")
+  meta.name = "csrf"
+  meta.content = csrfToken
+  document.getElementsByTagName("head")[0].appendChild(meta)
+
+  document.cookie = `x-csrf-token=${csrfToken}`
+
+  return response;
+}, function (error: any) {
+  // TODO Handle it in a better way
+  // Currently when the app gets offline, the time between adding a loader and removing it is fractional due to which loader dismiss is called before loader present
+  // which cause loader to run indefinitely
+  // Following gives dismiss loader a delay of 100 microseconds to get both the actions in sync
+  setTimeout(() => emitter.emit("dismissLoader"), 100);
+  if (error.response) {
+    // TODO Handle case for failed queue request
+    const { status } = error.response;
+    if (status === StatusCodes.UNAUTHORIZED) {
+      store.dispatch("user/logout");
+      router.push("/login")
+    }
+  }
+  // Any status codes that falls outside the range of 2xx cause this function to trigger
+  // Do something with response error
+  return Promise.reject(error);
+});
+
+const maxAge = process.env.VUE_APP_CACHE_MAX_AGE ? parseInt(process.env.VUE_APP_CACHE_MAX_AGE) : 0;
+const axiosCache = setupCache({
+  maxAge: maxAge * 1000
+})
+
+
+/**
+ * Generic method to call APIs
+ *
+ * @param {string}  url - API Url
+ * @param {string=} method - "GET", "PUT", "POST", "DELETE , and "PATCH"
+ * @param {any} [data] - Optional: `data` is the data to be sent as the request body. Only applicable for request methods "PUT", "POST", "DELETE , and "PATCH"
+ * When no `transformRequest` is set, must be of one of the following types:
+ * - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams
+ * - Browser only: FormData, File, Blob
+ * - Node only: Stream, Buffer
+ * @param {any} [params] - Optional: `params` are the URL parameters to be sent with the request. Must be a plain object or a URLSearchParams object
+ * @param {boolean} [cache] - Optional: Apply caching to it
+ *  @param {boolean} [queue] - Optional: Apply offline queueing to it
+ * @return {Promise} Response from API as returned by Axios
+ */
+const api = async (customConfig: any) => {
+  // Prepare configuration
+  const config: any = {
+    url: customConfig.url,
+    method: customConfig.method,
+    data: customConfig.data,
+    params: customConfig.params,
+    // withCredentials: true
+  }
+
+  const baseURL = store.getters["user/getInstanceUrl"];
+  if (baseURL) config.baseURL = `https://${baseURL}.hotwax.io/rest/s1/order-routing/`;
+  if(customConfig.cache) config.adapter = axiosCache.adapter;
+  const networkStatus =  await OfflineHelper.getNetworkStatus();
+  if (customConfig.queue && !networkStatus.connected) {
+    if (!config.headers) config.headers = { ...axios.defaults.headers.common, ...config.headers };
+    emitter.emit("queueTask", {
+      callbackEvent: customConfig.callbackEvent,
+      payload: config
+    });
+  } else {
+      return axios(config);
+  }
+}
+
+/**
+ * Client method to directly pass configuration to axios
+ *
+ * @param {any}  config - API configuration
+ * @return {Promise} Response from API as returned by Axios
+ */
+const client = (config: any) => {
+  return axios.request(config);
+}
+
+export { api as default, client, axios };
\ No newline at end of file
diff --git a/src/authorization/Actions.ts b/src/authorization/Actions.ts
deleted file mode 100644
index 1b4c62dd..00000000
--- a/src/authorization/Actions.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export default {
-  'APP_JOB_UPDATE': 'APP_JOB_UPDATE',
-  "APP_THRESHOLD_RULE_UPDATE": "APP_THRESHOLD_RULE_UPDATE",
-}
\ No newline at end of file
diff --git a/src/authorization/Rules.ts b/src/authorization/Rules.ts
deleted file mode 100644
index 5f0321bd..00000000
--- a/src/authorization/Rules.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-export default {
-  "APP_SELECT_PRODUCT_VIEW": "",
-  "APP_THRESHOLD_UPDATES_VIEW": "",
-  "APP_SAVE_THRESHOLD_VIEW": "COMMON_ADMIN",
-  "APP_JOB_VIEW": "",
-  "APP_JOB_UPDATE": "COMMON_ADMIN",
-  "APP_THRESHOLD_RULE_UPDATE": "COMMON_ADMIN",
-} as any 
\ No newline at end of file
diff --git a/src/authorization/index.ts b/src/authorization/index.ts
deleted file mode 100644
index 42edc1b3..00000000
--- a/src/authorization/index.ts
+++ /dev/null
@@ -1,124 +0,0 @@
-import { AbilityBuilder, PureAbility } from '@casl/ability';
-import { getEvaluator, parse } from 'boon-js';
-import { Tokens } from 'boon-js/lib/types'
-
-// TODO Improve this
-// We will move this code to an external plugin and use below Actions and Rules accordlingly
-let Actions = {} as any;
-let Rules = {} as any;
-
-// We are using CASL library to define permissions.
-// Instead of using Action-Subject based authorisation we are going with Claim based Authorization.
-// We would be defining the permissions for each action and case, map with server permissiosn based upon certain rules.
-// https://casl.js.org/v5/en/cookbook/claim-authorization
-// Following the comment of Sergii Stotskyi, author of CASL
-// https://github.com/stalniy/casl/issues/525
-// We are defining a PureAbility and creating an instance with AbilityBuilder.
-type ClaimBasedAbility = PureAbility<string>;
-const { build } = new AbilityBuilder<ClaimBasedAbility>(PureAbility);
-const ability = build();
-
-/**
- * The method returns list of permissions required for the rules. We are having set of rules, 
- * through which app permissions are defined based upon the server permissions.
- * When getting server permissions, as all the permissions are not be required. 
- * Specific permissions used defining the rules are extracted and sent to server. 
- * @returns permissions
- */
-const getServerPermissionsFromRules = () => {
-    // Iterate for each rule
-    const permissions = Object.keys(Rules).reduce((permissions: any, rule: any) => {
-        const permissionRule = Rules[rule];
-        // some rules may be empty, no permission is required from server
-        if (permissionRule) {
-            // Each rule may have multiple permissions along with operators
-            // Boon js parse rules into tokens, each token may be operator or server permission
-            // permissionId will have token name as identifier. 
-            const permissionTokens = parse(permissionRule);
-            permissions = permissionTokens.reduce((permissions: any, permissionToken: any) => {
-                // Token object with name as identifier has permissionId 
-                if (Tokens.IDENTIFIER === permissionToken.name) {
-                    permissions.add(permissionToken.value);
-                }
-                return permissions;
-            }, permissions)
-        }
-        return permissions;
-    }, new Set())
-    return [...permissions];
-}
-
-/**
- * The method is used to prepare app permissions from the server permissions.
- * Rules could be defined such that each app permission could be defined based upon certain one or more server permissions.
- * @param serverPermissions 
- * @returns appPermissions
- */
-const prepareAppPermissions = (serverPermissions: any) => {
-    const serverPermissionsInput = serverPermissions.reduce((serverPermissionsInput: any, permission: any) => {
-        serverPermissionsInput[permission] = true;
-        return serverPermissionsInput;
-    }, {})
-    // Boonjs evaluator needs server permissions as object with permissionId and boolean value
-    // Each rule is passed to evaluator along with the server permissions
-    // if the server permissions and rule matches, app permission is added to list
-    const permissions = Object.keys(Rules).reduce((permissions: any, rule: any) => {
-        const permissionRule = Rules[rule];
-        // If for any app permission, we have empty rule we user is assigned the permission
-        // If rule is not defined, the app permisions is still evaluated or provided to all the users.
-        if (!permissionRule || (permissionRule && getEvaluator(permissionRule)(serverPermissionsInput))) {
-            permissions.push(rule);
-        }
-        return permissions;
-    }, [])
-    const { can, rules } = new AbilityBuilder<ClaimBasedAbility>(PureAbility);
-    permissions.map((permission: any) => {
-        can(permission);
-    })
-    return rules;
-}
-
-/**
- * 
- * Sets the current app permissions. This should be used after perparing the app permissions from the server permissions
- * @param permissions 
- * @returns 
- */
-const setPermissions = (permissions: any) => {
-    // If the user has passed undefined or null, it should not break the code
-    if (!permissions) permissions = [];
-    ability.update(permissions)
-    return true;
-};
-
-/**
- * Resets the permissions list. Used for cases like logout 
- */
-const resetPermissions = () => setPermissions([]);
-
-/**
- * 
- * @param permission 
- * @returns 
- */
-const hasPermission = (permission: string) => ability.can(permission);
-
-export { Actions, getServerPermissionsFromRules, hasPermission, prepareAppPermissions, resetPermissions, setPermissions};
-
-// TODO Move this code to an external plugin, to be used across the apps
-export default {
-    install(app: any, options: any) {
-
-        // Rules and Actions could be app and OMS package specific
-        Rules = options.rules;
-        Actions = options.actions;
-
-        // TODO Check why global properties is not working and apply across.
-        app.config.globalProperties.$permission = this;
-    },
-    getServerPermissionsFromRules, 
-    hasPermission, 
-    prepareAppPermissions, 
-    resetPermissions, 
-    setPermissions
-}
diff --git a/src/components/ErrorMessageModal.vue b/src/components/ErrorMessageModal.vue
deleted file mode 100644
index 5967c0c5..00000000
--- a/src/components/ErrorMessageModal.vue
+++ /dev/null
@@ -1,20 +0,0 @@
-<template>
-  <ion-content class="ion-padding">
-    {{ errorMessage }}  
-  </ion-content>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import {
-  IonContent,
-} from '@ionic/vue';
-
-export default defineComponent ({
-  name: 'ErrorMessageModal',
-  components: {
-    IonContent,
-  },
-  props: ["errorMessage"]
-})
-</script>
\ No newline at end of file
diff --git a/src/components/JobConfiguration.vue b/src/components/JobConfiguration.vue
deleted file mode 100644
index 3584b8e7..00000000
--- a/src/components/JobConfiguration.vue
+++ /dev/null
@@ -1,378 +0,0 @@
-<template>
-  <section>
-    <ion-item lines="none">
-      <h1>{{ title }}</h1>
-      <ion-badge slot="end" color="dark" v-if="job?.runTime">{{ $t("running") }} {{ timeTillJob(runTime ? runTime : job.runTime) }}</ion-badge>
-    </ion-item>
-
-    <ion-list>
-      <ion-item>
-        <ion-icon slot="start" :icon="calendarClearOutline" />
-        <ion-label>{{ $t("Last run") }}</ion-label>
-        <ion-label slot="end">{{ job?.lastUpdatedStamp ? getTime(job.lastUpdatedStamp) : $t('No previous occurrence') }}</ion-label>
-      </ion-item>
-
-      <ion-item>
-        <ion-icon slot="start" :icon="timeOutline" />
-        <ion-label>{{ $t("Run time") }}</ion-label>
-        <ion-label @click="() => isOpen = true" slot="end">{{ job?.runTime ? getTime(runTime ? runTime : job.runTime) : $t('Select run time') }}</ion-label>
-        <!-- TODO: display a button when we are not having a runtime and open the datetime component
-        on click of that button
-        Currently, when mapping the same datetime component for label and button so it's not working so for
-        now commented the button and added a fallback string -->
-        <!-- <ion-button id="open-run-time-modal" size="small" fill="outline" color="medium" v-show="!job?.runTime">{{ $t("Select run time") }}</ion-button> -->
-        <ion-modal :is-open="isOpen" @didDismiss="() => isOpen = false">
-          <ion-content force-overscroll="false">
-            <ion-datetime
-              show-default-buttons
-              hour-cycle="h12"
-              :value="job?.runTime ? getDateTime(job.runTime) : ''"
-              @ionChange="updateRunTime($event, job)"
-            />
-          </ion-content>
-        </ion-modal>
-      </ion-item>
-
-      <ion-item lines="inset">
-        <ion-icon slot="start" :icon="timerOutline" />
-        <ion-label>{{ $t("Schedule") }}</ion-label>
-        <ion-select :interface-options="customPopoverOptions" interface="popover" :value="jobStatus" :placeholder="$t('Disabled')" @ionChange="($event) => jobStatus = $event['detail'].value">
-          <ion-select-option v-for="freq in generateFrequencyOptions" :key="freq.value" :value="freq.value">{{ $t(freq.label) }}</ion-select-option>
-        </ion-select>
-      </ion-item>
-
-      <!-- TODO: enable this feature of passing count when supported on backend -->
-      <!-- <ion-item>
-        <ion-icon slot="start" :icon="syncOutline" />
-        <ion-label>{{ $t("Repeat untill disabled") }}</ion-label>
-        <ion-checkbox slot="end" :checked="repeat" @ionChange="repeatUntillDisabled($event['detail'].checked)"/>
-      </ion-item>
-
-      <ion-item v-show="!repeat">
-        <ion-label>{{ $t("Auto disable after") }}</ion-label>
-        <ion-input :placeholder="$t('occurrences')" v-model="count"/>
-      </ion-item> -->
-      <ion-item v-if="job?.systemJobEnumId === 'JOB_EXP_PROD_THRSHLD'" lines="inset">
-        <ion-icon slot="start" :icon="cogOutline" />
-        <ion-label>{{ $t("Name") }}</ion-label>
-        <ion-input class="ion-text-end" name="ruleName" v-model="ruleName" id="ruleName" />
-      </ion-item>
-
-      <ion-item v-if="job?.runtimeData?.searchPreferenceId" button detail="true" @click="updateThresholdRule" lines="full">
-        <ion-icon slot="start" :icon="pencilOutline" />
-        <ion-label class="ion-text-wrap">{{ $t("Edit threshold rule") }}</ion-label>
-        <ion-note slot="end">
-          {{ productCount }} {{ $t("products selected")}}
-        </ion-note>
-      </ion-item>
-
-    </ion-list>
-    <div class="actions desktop-only">
-      <div>
-        <ion-button size="small" fill="outline" color="medium" :disabled="!hasPermission(Actions.APP_JOB_UPDATE) || status === 'SERVICE_DRAFT'" @click="skipJob(job)">{{ $t("Skip once") }}</ion-button>
-        <ion-button size="small" fill="outline" color="danger" :disabled="!hasPermission(Actions.APP_JOB_UPDATE) || status === 'SERVICE_DRAFT'" @click="cancelJob(job)">{{ $t("Disable") }}</ion-button>
-      </div>
-      <div>
-        <ion-button size="small" fill="outline" :disabled="!hasPermission(Actions.APP_JOB_UPDATE)" @click="saveChanges()">{{ $t("Save changes") }}</ion-button>
-      </div>
-    </div>
-
-    <div class=" actions mobile-only">
-      <ion-button size="small" fill="outline" color="medium" :disabled="hasPermission(Actions.APP_JOB_UPDATE) || status === 'SERVICE_DRAFT'" @click="skipJob(job)">{{ $t("Skip once") }}</ion-button>
-      <ion-button size="small" fill="outline" color="danger" :disabled="hasPermission(Actions.APP_JOB_UPDATE) || status === 'SERVICE_DRAFT'" @click="cancelJob(job)">{{ $t("Disable") }}</ion-button>
-      <ion-button expand="block" fill="outline" :disabled="!hasPermission(Actions.APP_JOB_UPDATE)" @click="saveChanges()">{{ $t("Save changes") }}</ion-button>
-    </div>
-  </section>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "vue";
-import {
-  IonBadge,
-  IonButton,
-  IonContent,
-  IonDatetime,
-  IonIcon,
-  IonInput,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonModal,
-  IonNote,
-  IonSelect,
-  IonSelectOption,
-  alertController
-} from "@ionic/vue";
-import {
-  calendarClearOutline,
-  chevronForwardOutline,
-  cogOutline,
-  timeOutline,
-  timerOutline,
-  syncOutline,
-  pencilOutline,
-  personCircleOutline
-} from "ionicons/icons";
-import { mapGetters, useStore } from "vuex";
-import { handleDateTimeInput, hasError, showToast } from "@/utils";
-import { JobService } from "@/services/JobService";
-import { DateTime } from 'luxon';
-import { translate } from "@/i18n";
-import logger from "@/logger";
-import { Actions, hasPermission } from '@/authorization'
-
-export default defineComponent({
-  name: "JobConfiguration",
-  components: {
-    IonBadge,
-    IonButton,
-    IonContent,
-    IonDatetime,
-    IonIcon,
-    IonInput,
-    IonItem,
-    IonLabel,
-    IonList,
-    IonModal,
-    IonNote,
-    IonSelect,
-    IonSelectOption
-  },
-  data() {
-    return {
-      jobStatus: this.status,
-      ruleName: this.job?.jobName,
-      jobEnums: JSON.parse(process.env?.VUE_APP_JOB_ENUMS as string) as any,
-      runTime: '',
-      isOpen: false
-    }
-  },
-  props: ["job", "title", "status", "type", "productCount"],
-  computed: {
-    ...mapGetters({
-      userProfile: 'user/getUserProfile'
-    }),
-    generateFrequencyOptions(): any {
-      const optionDefault = [{
-          "value": "EVERY_5_MIN",
-          "label": "Every 5 minutes"
-        },{
-          "value": "EVERY_15_MIN",
-          "label": "Every 15 minutes"
-        },{
-          "value": "EVERY_30_MIN",
-          "label": "Every 30 minutes"
-        },{
-          "value": "HOURLY",
-          "label": "Hourly"
-        },{
-          "value": "EVERY_6_HOUR",
-          "label": "Every 6 hours"
-        },{
-          "value": "EVERYDAY",
-          "label": "Every day"
-        }
-      ]
-
-      const slow = [{
-          "value": "HOURLY",
-          "label": "Hourly"
-        },{
-          "value": "EVERY_6_HOUR",
-          "label": "Every 6 hours"
-        },{
-          "value": "EVERYDAY",
-          "label": "Every day"
-        }
-      ]
-      return (this as any).type === 'slow' ? slow : optionDefault;
-    }
-  },
-  methods: {
-    updateThresholdRule(){
-      this.$router.push(`select-product?id=${this.job.jobId}`)
-    },
-    getDateTime(time: any) {
-      return DateTime.fromMillis(time).toISO()
-    },
-    async skipJob(job: any) {
-      const alert = await alertController
-        .create({
-          header: this.$t('Skip job'),
-          message: this.$t('Skipping will run this job at the next occurrence based on the temporal expression.'),
-          buttons: [{
-            text: this.$t("Don't skip"),
-            role: 'cancel'
-          }, {
-            text: this.$t('Skip'),
-            handler: async () => {
-              if (job) {
-                // TODO: using updatedRunTime value to update the runTime in the configuration component as currently currentJob state is not maintained
-                const { updatedRunTime } = await this.store.dispatch('job/skipJob', job)
-                if(updatedRunTime) {
-                  this.runTime = updatedRunTime;
-                  this.store.dispatch('job/fetchPendingJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums})
-                }
-              }
-            }
-          }]
-        });
-      return alert.present();
-    },
-    async cancelJob(job: any) {
-      const alert = await alertController
-        .create({
-          header: this.$t('Cancel job'),
-          message: this.$t('Canceling this job will cancel this occurrence and all following occurrences. This job will have to be re-enabled manually to run it again.'),
-          buttons: [{
-            text: this.$t("Don't cancel"),
-            role: 'cancel'
-          }, {
-            text: this.$t('Cancel'),
-            handler: async () => {
-              const resp = await this.store.dispatch('job/cancelJob', job);
-              if(resp.status == 200 && !hasError(resp) && resp.data.successMessage) {
-                this.store.dispatch('job/fetchPendingJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums})
-              }
-            }
-          }],
-        });
-      return alert.present();
-    },
-    async saveChanges() {
-      const alert = await alertController
-        .create({
-          header: this.$t('Save changes'),
-          message: this.$t('Are you sure you want to save these changes?'),
-          buttons: [{
-            text: this.$t('Cancel'),
-            role: 'cancel'
-          }, {
-            text: this.$t('Save'),
-            handler: () => {
-              this.updateJob();
-            }
-          }]
-        });
-      return alert.present();
-    },
-    async discardChanges() {
-      const alert = await alertController
-        .create({
-          header: this.$t('Discard changes'),
-          message: this.$t('All unsaved changes will be lost. Are you sure you want to leave this page.'),
-          buttons: [this.$t('Cancel'), this.$t('Save')],
-        });
-      return alert.present();
-    },
-    async updateJob() {
-      const job = this.job;
-      job.jobName = this.ruleName;
-      job['jobStatus'] = this.jobStatus !== 'SERVICE_DRAFT' ? this.jobStatus : 'HOURLY';
-      if (job?.statusId === 'SERVICE_PENDING') {
-        try {
-          const payload = {
-            'jobId': job.jobId,
-            'systemJobEnumId': job.systemJobEnumId,
-            'recurrenceTimeZone': this.userProfile.userTimeZone,
-            'tempExprId': job.frequency ? job.frequency : job.jobStatus, // TODO: change jobStatus to frequency
-            'statusId': "SERVICE_PENDING"
-          } as any
-
-          job?.runTime && (payload['runTime'] = job.runTime)
-          job?.sinceId && (payload['sinceId'] = job.sinceId)
-          job?.jobName && (payload['jobName'] = job.jobName)
-
-          const resp = await JobService.updateJob(payload)
-          if(resp.status == 200 && !hasError(resp) && resp.data.successMessage) {
-            this.store.dispatch('job/fetchPendingJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums})
-            showToast(translate('Service updated successfully'))
-          } else {
-            showToast(translate('Something went wrong'))
-          }
-        } catch(err) {
-          showToast(translate('Something went wrong'))
-          logger.error(err)
-        }
-      }
-    },
-    getTime (time: any) {
-      return DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED);
-    },
-    timeTillJob (time: any) {
-      const timeDiff = DateTime.fromMillis(time).diff(DateTime.local());
-      return DateTime.local().plus(timeDiff).toRelative();
-    },
-    updateRunTime(ev: CustomEvent, job: any) {
-      if (job) {
-        const currTime = DateTime.now().toMillis();
-        const setTime = handleDateTimeInput(ev['detail'].value);
-
-        if(setTime > currTime) {
-          job.runTime = setTime;
-        } else {
-          showToast(translate("Provide a future date and time"))
-        }
-      }
-    }
-  },
-  setup(props) {
-    const customPopoverOptions: any = {
-      header: props.title,
-      showBackdrop: false
-    }
-    const store = useStore();
-    return {
-      Actions,
-      calendarClearOutline,
-      chevronForwardOutline,
-      cogOutline,
-      customPopoverOptions,
-      hasPermission,
-      timeOutline,
-      timerOutline,
-      store,
-      syncOutline,
-      pencilOutline,
-      personCircleOutline
-    };
-  }
-});
-</script>
-
-<style scoped>
-ion-list {
-  margin: var(--spacer-base) 0;
-}
-
-.actions > ion-button {
-  margin: var(--spacer-sm);
-}
-
-@media (min-width: 991px) {  
-  section {
-    overflow: hidden;
-    border: var(--border-medium);
-    border-radius: 16px;
-  }
-  .actions {
-    display: flex;
-    justify-content: space-between;
-    margin: var(--spacer-base) var(--spacer-sm) var(--spacer-base);
-  }
-
-  .mobile-only {
-    display: none;
-  }  
-}
-
-ion-item:nth-child(2) > ion-label:nth-child(3) {
-  cursor: pointer;
-}
-
-ion-modal {
-  --width: 290px;
-  --height: 440px;
-  --border-radius: 8px;
-}
-</style>
\ No newline at end of file
diff --git a/src/components/JobHistoryModal.vue b/src/components/JobHistoryModal.vue
deleted file mode 100644
index 48dc5f66..00000000
--- a/src/components/JobHistoryModal.vue
+++ /dev/null
@@ -1,131 +0,0 @@
-<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>{{ getEnumName(currentJob?.systemJobEnumId) }}</ion-title>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <div v-if="jobHistory?.length === 0">
-      <p class="ion-text-center">{{ $t("No jobs have run yet")}}</p>
-    </div>
-
-    <div v-else>
-      <ion-list>
-        <ion-item v-for="(job, index) in jobHistory" :key="index">
-          <ion-label>
-            {{ job.runTime ? getTime(job.runTime) : "-" }}
-            <p v-if="job.runTime">{{ getDate(job.runTime) }}</p>
-          </ion-label>
-          <ion-badge v-if="job.statusId" :color="job.statusId === 'SERVICE_FINISHED' ? 'success' : 'danger'">{{ getStatusDesc(job.statusId) }}</ion-badge>
-        </ion-item>
-      </ion-list>
-    </div>
-  </ion-content>
-</template>
-
-<script lang="ts">
-import {
-  IonButtons,
-  IonButton,
-  IonBadge,
-  IonContent,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { closeOutline } from 'ionicons/icons';
-import { mapGetters, useStore } from 'vuex';
-import { DateTime } from 'luxon';
-import { JobService } from '@/services/JobService'
-import { hasError } from '@/utils';
-
-export default defineComponent({
-  name: 'JobHistoryModal',
-  components: {
-    IonButtons,
-    IonButton,
-    IonBadge,
-    IonContent,
-    IonHeader,
-    IonIcon,
-    IonItem,
-    IonLabel,
-    IonList,
-    IonTitle,
-    IonToolbar,
-  },
-  data() {
-    return {
-      jobHistory: []
-    }
-  },
-  props: ['currentJob'],
-  computed: {
-    ...mapGetters({
-      getEnumName: 'job/getEnumName',
-      getCurrentEComStore:'user/getCurrentEComStore',
-      getStatusDesc: 'util/getStatusDesc'
-    })
-  },
-  methods: {
-    closeModal() {
-      modalController.dismiss({ dismissed: true });
-    },
-    getDate (runTime: any) {
-      return DateTime.fromMillis(runTime).toLocaleString(DateTime.DATE_MED);
-    },
-    getTime (runTime: any) {
-      return DateTime.fromMillis(runTime).toLocaleString(DateTime.TIME_SIMPLE);
-    },
-    async fetchJobHistory() {
-      let resp;
-
-      try {
-        resp = await JobService.fetchJobInformation({
-          "inputFields": {
-            "productStoreId": this.getCurrentEComStore.productStoreId,
-            "statusId": ["SERVICE_CANCELLED", "SERVICE_CRASHED", "SERVICE_FAILED", "SERVICE_FINISHED"],
-            "statusId_op": "in",
-            "systemJobEnumId": this.currentJob?.systemJobEnumId
-          },
-          "fieldList": [ "runTime", "statusId" ],
-          "entityName": "JobSandbox",
-          "noConditionFind": "Y",
-          "viewSize": process.env.VUE_APP_VIEW_SIZE,
-          "orderBy": "runTime DESC"
-        })
-        if(resp.status === 200 && resp.data.docs?.length > 0 && !hasError(resp)) {
-          this.jobHistory = resp.data.docs;
-        } else {
-          this.jobHistory = [];
-        }
-      } catch(err) {
-        this.$log.error(err);
-      }
-    }
-  },
-  mounted() {
-    this.fetchJobHistory()
-  },
-  setup() {
-    const store = useStore();
-
-    return {
-      closeOutline,
-      store
-    };
-  },
-});
-</script>
\ No newline at end of file
diff --git a/src/components/JobReorderModal.vue b/src/components/JobReorderModal.vue
deleted file mode 100644
index 7cb80517..00000000
--- a/src/components/JobReorderModal.vue
+++ /dev/null
@@ -1,193 +0,0 @@
-<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>{{ $t('Export product threshold jobs') }}</ion-title>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <ion-reorder-group @ionItemReorder="doReorder($event)" disabled="false">
-      <ion-item v-for="job in modifiedJobs" :key="job.jobId">
-        <ion-label>{{ job.jobName }}</ion-label>
-        <ion-label>{{ job.runTime ? getTime(job.runTime) : "-"  }}</ion-label>
-        <ion-label>{{ timeTillJob(job.runTime)}}</ion-label>
-        <ion-icon :icon="checkmarkCircleOutline" color="success" v-if="successJobs.includes(job.jobId)" />
-        <ion-icon :icon="closeCircleOutline" color="danger" v-if="failedJobs.includes(job.jobId)" />
-        <ion-reorder />
-      </ion-item>
-    </ion-reorder-group>
-
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="save()" :disabled="!hasPermission(Actions.APP_JOB_UPDATE) || failedJobs.length || isReordering">
-        <ion-icon :icon="saveOutline" />
-      </ion-fab-button>
-    </ion-fab>
-  </ion-content>
-</template>
-
-<script lang="ts">
-import {
-  IonButtons,
-  IonButton,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonLabel,
-  IonReorder,
-  IonReorderGroup,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { checkmarkCircleOutline, closeCircleOutline, closeOutline, saveOutline } from 'ionicons/icons';
-import { mapGetters, useStore } from 'vuex';
-import { DateTime } from 'luxon';
-import { JobService } from '@/services/JobService';
-import { hasError, showToast } from '@/utils';
-import logger from '@/logger';
-import { translate } from '@/i18n';
-import { Actions, hasPermission } from '@/authorization'
-
-export default defineComponent({
-  name: 'JobReorderModal',
-  components: {
-    IonButtons,
-    IonButton,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonItem,
-    IonLabel,
-    IonReorder,
-    IonReorderGroup,
-    IonTitle,
-    IonToolbar,
-  },
-  data() {
-    return {
-      failedJobs: [] as any,
-      successJobs: [] as any,
-      modifiedJobs: JSON.parse(JSON.stringify((this as any).jobs)),
-      isReordering: false
-    }
-  },
-  computed: {
-    ...mapGetters({
-      userProfile: "user/getUserProfile"
-    }),
-  },
-  props: ["jobs"],
-  methods: {
-    timeTillJob (time: any) {
-      const timeDiff = DateTime.fromMillis(time).diff(DateTime.local());
-      return DateTime.local().plus(timeDiff).toRelative();
-    },
-    closeModal(isJobsUpdated = false) {
-      modalController.dismiss({ isJobsUpdated });
-    },
-    getTime (time: any) {
-      return DateTime.fromMillis(time).toLocaleString(DateTime.TIME_SIMPLE);
-    },
-    findJobDiff(previousSeq: any, updatedSeq: any) {
-      // finding the diff using array element position
-      const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
-        if (updatedSeq[key].jobId === previousSeq[key].jobId && updatedSeq[key].runTime === previousSeq[key].runTime) return diff
-        return {
-          ...diff,
-          [key]: updatedSeq[key]
-        }
-      }, {})
-      return diffSeq;
-    },
-    doReorder(event: CustomEvent) {
-      // making the item reorder action as complete and storing the updated order in jobs
-      const updatedSeq = event.detail.complete(JSON.parse(JSON.stringify(this.modifiedJobs)));
-      let diffSeq = this.findJobDiff(this.jobs, updatedSeq)
-      const runTimeSequence = this.jobs.map((job: any) => job.runTime)
-      diffSeq = Object.keys(diffSeq).map((key: any) => {
-        diffSeq[key].runTime = runTimeSequence[key]
-        return diffSeq[key]
-      })
-      this.modifiedJobs = updatedSeq
-    },
-    async save() {
-      this.isReordering = true;
-      this.failedJobs = []
-      this.successJobs = []
-      
-      const diffSeq = this.findJobDiff(this.jobs, this.modifiedJobs)
-      const updatedJobsOrder = Object.keys(diffSeq).map((key) => diffSeq[key])
-
-      if(!updatedJobsOrder.length) {
-        showToast(translate('No jobs to update'))
-        this.closeModal();
-        return;
-      }
-
-      await Promise.allSettled(updatedJobsOrder.map(async (job: any) => {
-        const payload = {
-          'jobId': job.jobId,
-          'systemJobEnumId': job.systemJobEnumId,
-          'statusId': "SERVICE_PENDING",
-          'runTime': job.runTime
-        }
-        try {
-          const resp = await JobService.updateJob(payload)
-          if (resp.status == 200 && !hasError(resp) && resp.data.successMessage) {
-            // if the job succeded when updating then adding the jobId to the successJobs array
-            this.successJobs.push(job.jobId)
-            
-          } else {
-            // if the job failed when updating then adding the jobId to the failedJobs array
-            this.failedJobs.push(job.jobId)
-            logger.error(`Failed to update job ${job.jobId}`)            
-          }
-        } catch (err) {
-          this.failedJobs.push(job.jobId)
-          logger.error(err)
-        }
-      }))
-
-      this.isReordering = false;
-      // If there are no failed jobs then redirecting the user to the threshold updates page
-      if (!this.failedJobs.length) {
-        this.closeModal(true);
-        showToast(translate('Jobs sequence updated successfully'))
-      } else {
-        showToast(translate('Failed to update some jobs'))
-      }
-    },
-  },
-  setup() {
-    const store = useStore();
-    return {
-      Actions,
-      checkmarkCircleOutline,
-      closeCircleOutline,
-      closeOutline,
-      hasPermission,
-      saveOutline,
-      store
-    };
-  },
-});
-</script>
-
-<style scoped>
-ion-modal {
-  --width: 290px;
-  --height: 382px;
-  --border-radius: 8px;
-}
-</style>
\ No newline at end of file
diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 7390808d..0eeba0d4 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -20,33 +20,12 @@
         </ion-menu-toggle>
       </ion-list>
     </ion-content>
-    <ion-footer>
-      <ion-toolbar>
-        <ion-item lines="none">
-          <ion-label class="ion-text-wrap">
-            <p class="overline">{{ instanceUrl }}</p>
-          </ion-label>
-          <ion-note slot="end">{{ userProfile?.userTimeZone }}</ion-note>
-        </ion-item>
-        <ion-item v-if="userProfile?.stores?.length > 1" lines="none">
-          <ion-select interface="popover" :value="eComStore.productStoreId" @ionChange="setEComStore($event)">
-            <ion-select-option v-for="store in (userProfile?.stores ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName }}</ion-select-option>
-          </ion-select>
-        </ion-item>
-        <ion-item v-else lines="none">
-          <ion-label class="ion-text-wrap">
-            {{ eComStore.storeName }}
-          </ion-label>
-        </ion-item>
-      </ion-toolbar>
-    </ion-footer>
   </ion-menu>
 </template>
   
 <script lang="ts">
   import {
     IonContent,
-    IonFooter,
     IonHeader,
     IonIcon,
     IonItem,
@@ -54,25 +33,19 @@
     IonList,
     IonMenu,
     IonMenuToggle,
-    IonNote,
-    IonSelect,
-    IonSelectOption,
     IonTitle,
     IonToolbar,
   } from "@ionic/vue";
   import { defineComponent, computed } from "vue";
   import { mapGetters } from "vuex";
   import { useStore } from "@/store";
-  import { hasPermission } from "@/authorization";
   import { useRouter } from "vue-router";
   import { optionsOutline, settingsOutline, pulseOutline } from 'ionicons/icons';
-  import emitter from "@/event-bus";
   
   export default defineComponent({
     name: "Menu",
     components: {
       IonContent,
-      IonFooter,
       IonHeader,
       IonIcon,
       IonItem,
@@ -80,54 +53,24 @@
       IonList,
       IonMenu,
       IonMenuToggle,
-      IonNote,
-      IonSelect,
-      IonSelectOption,
       IonTitle,
       IonToolbar
     },
     computed: {
       ...mapGetters({
         isUserAuthenticated: 'user/isUserAuthenticated',
-        eComStore: 'user/getCurrentEComStore',
         instanceUrl: 'user/getInstanceUrl',
-        userProfile: 'user/getUserProfile',
       })
     },
     methods: {
-      async setEComStore(event: CustomEvent) {
-        if(this.eComStore.productStoreId !== event.detail.value) {
-          await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
-          emitter.emit("productStoreChanged")
-        }
-      },
       getValidMenuItems(appPages: any) {
-        return appPages.filter((appPage: any) => (!appPage.meta || !appPage.meta.permissionId) || hasPermission(appPage.meta.permissionId));
+        return appPages.filter((appPage: any) => (!appPage.meta || !appPage.meta.permissionId));
       }
     },
     setup() {
       const store = useStore();
       const router = useRouter();
       const appPages = [
-        {
-          title: "Create Rule",
-          url: "/select-product",
-          iosIcon: optionsOutline,
-          mdIcon: optionsOutline,
-          meta: {
-            permissionId: "APP_SELECT_PRODUCT_VIEW"
-
-          }
-        },
-        {
-          title: "Rule Pipeline",
-          url: "/threshold-updates",
-          iosIcon: pulseOutline,
-          mdIcon: pulseOutline,
-          meta: {
-            permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-          }
-        },
         {
           title: "Settings",
           url: "/settings",
@@ -143,7 +86,6 @@
 
       return {
         appPages,
-        hasPermission,
         router,
         pulseOutline,
         optionsOutline,
diff --git a/src/components/ProductFilterModal.vue b/src/components/ProductFilterModal.vue
deleted file mode 100644
index 0ccf08d5..00000000
--- a/src/components/ProductFilterModal.vue
+++ /dev/null
@@ -1,200 +0,0 @@
-<template>
-  <ion-header>
-    <ion-toolbar>
-      <ion-buttons slot="start">
-        <ion-button @click="closeModal">
-          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
-        </ion-button>
-      </ion-buttons>
-      <ion-title>{{ $t(`${ type === 'included' ? `Include ${label}` : `Exclude ${label}` }`) }}</ion-title>
-      <ion-buttons slot="end">
-        <ion-button fill="clear" color="danger" @click="selectedValues = []">{{ $t("Clear All") }}</ion-button>
-      </ion-buttons>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <ion-searchbar :placeholder="$t(`Search ${label}`)" v-model="queryString" @keyup.enter="queryString = $event.target.value; search($event)"/>
-
-    <ion-list>
-      <ion-item v-for="option in facetOptions" :key="option.id"  @click="updateSelectedValues(option.id)">
-        <ion-label>{{ option.label }}</ion-label>
-        <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="selectedValues.includes(option.id)" />
-        <ion-note v-else slot="end" color="danger">{{ type === 'included' ? $t("excluded") : $t("included") }}</ion-note>
-      </ion-item>
-    </ion-list>
-    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
-    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="updateFilters()">
-        <ion-icon :icon="checkmarkOutline" />
-      </ion-fab-button>
-    </ion-fab>
-    <ion-infinite-scroll @ionInfinite="loadMoreTags($event)" threshold="100px" :disabled="!isScrollable">
-      <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
-    </ion-infinite-scroll>
-  </ion-content>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "vue";
-import {
-  IonButton,
-  IonButtons,
-  IonCheckbox,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonInfiniteScroll,
-  IonInfiniteScrollContent,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonNote,
-  IonSearchbar,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from "@ionic/vue";
-import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons'
-import { ProductService } from "@/services/ProductService";
-import { mapGetters, useStore } from "vuex";
-
-export default defineComponent({
-  name: "ProductFilterModal",
-  components: {
-    IonButton,
-    IonButtons,
-    IonCheckbox,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonInfiniteScroll,
-    IonInfiniteScrollContent,
-    IonItem,
-    IonLabel,
-    IonList,
-    IonNote,
-    IonSearchbar,
-    IonTitle,
-    IonToolbar
-  },
-  data() {
-    return {
-      queryString: '',
-      facetOptions: [] as any,
-      isFilterChanged: false,
-      isScrollable: true,
-      selectedValues: [] as Array<string>
-    }
-  },
-  computed: {
-    ...mapGetters({
-      appliedFilters: 'product/getAppliedFilters'
-    })
-  },
-  props: ["label", "facetToSelect", "searchfield", 'type'],
-  mounted() {
-    this.selectedValues = JSON.parse(JSON.stringify(this.appliedFilters[this.type][this.searchfield])).list;
-  },
-  methods: {
-    closeModal() {
-      modalController.dismiss({ dismissed: true, isFilterChanged: this.isFilterChanged });
-    },
-    async search(event: any) {
-      this.queryString = event.target.value;
-      this.getTags();
-    },
-    async getTags(vSize?: any, vIndex?: any) {
-      const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
-      const viewIndex = vIndex ? vIndex : 0;
-
-      const payload = {
-        facetToSelect: this.facetToSelect,
-        docType: 'PRODUCT',
-        coreName: 'enterpriseSearch',
-        searchfield: this.searchfield,
-        jsonQuery: '{"query":"*:*","filter":["docType:PRODUCT"]}',
-        noConditionFind: 'N',
-        limit: viewSize,
-        q: this.queryString,
-        term: this.queryString,
-        offset: viewIndex * viewSize,
-      }
-
-      const resp = await ProductService.fetchFacets(payload);
-      if (resp.status == 200 && resp.data.length > 0) {
-        this.facetOptions = viewIndex === 0 ? resp.data : [...this.facetOptions , ...resp.data];
-        this.isScrollable = (this.facetOptions.length % process.env.VUE_APP_VIEW_SIZE) === 0;
-      } else {
-        this.facetOptions = [];
-        this.isScrollable = false;
-      }
-    },
-    async loadMoreTags(event: any){
-      this.getTags(
-        undefined,
-        Math.ceil(this.facetOptions.length / process.env.VUE_APP_VIEW_SIZE).toString() 
-      ).then(() => {
-        event.target.complete();
-      })
-    },
-    updateSelectedValues(value: string) {
-      this.selectedValues.includes(value) ? this.selectedValues.splice(this.selectedValues.indexOf(value), 1) : this.selectedValues.push(value);
-    },
-    async updateFilters() {
-      this.isFilterChanged = true;
-      this.selectedValues.length ? await this.updateAppliedFilters() : await this.clearFilters();
-      this.closeModal();
-    },
-    async updateAppliedFilters() {
-      // if filters are not updated
-      if (JSON.stringify(this.appliedFilters[this.type][this.searchfield].list) == JSON.stringify(this.selectedValues)) {
-        this.isFilterChanged = false;
-        return;
-      }
-
-      const appliedFilters = JSON.parse(JSON.stringify(this.appliedFilters[this.type][this.searchfield]))
-      appliedFilters.list = this.selectedValues
-      
-      await this.store.dispatch('product/updateAppliedFilters', {
-        type: this.type,
-        id: this.searchfield,
-        value: appliedFilters
-      })
-    },
-    async clearFilters() {
-      // if no filters are already not applied
-      if (!this.appliedFilters[this.type][this.searchfield].list.length) {
-        this.isFilterChanged = false;
-        return;
-      }
-
-      await this.store.dispatch('product/clearFilters', {
-        type: this.type,
-        id: this.searchfield,
-        value: {
-          list: [],
-          operator: 'OR'
-        }
-      })
-    },
-    isAlreadyApplied(value: string) {
-      const type = this.type === 'included' ? 'excluded' : 'included'
-      return this.appliedFilters[type][this.searchfield].list.includes(value)
-    }
-  },
-  setup() {
-    const store = useStore();
-
-    return {
-      arrowBackOutline,
-      checkmarkOutline,
-      store
-    }
-  }
-})
-</script>
\ No newline at end of file
diff --git a/src/components/ProductListItem.vue b/src/components/ProductListItem.vue
deleted file mode 100644
index e312f8f5..00000000
--- a/src/components/ProductListItem.vue
+++ /dev/null
@@ -1,49 +0,0 @@
-<template>
-  <ion-item button @click="viewProduct()" detail="true" lines="none">
-    <ion-thumbnail slot="start">
-      <img :src="product.mainImageUrl" />
-    </ion-thumbnail>
-    <ion-label>
-      <p>{{ product.productName }}</p>
-      <h3>{{ product.sku }}</h3>
-      <p>{{$filters.getFeature(product.featureHierarchy, '1/COLOR/')}} | {{$filters.getFeature(product.featureHierarchy, '1/SIZE/')}}</p>
-    </ion-label>
-  </ion-item>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-import {
-  IonItem,
-  IonThumbnail,
-  IonLabel
-} from '@ionic/vue'
-import { useRouter } from 'vue-router'
-import { useStore } from 'vuex';
-
-export default defineComponent({
-  name: "ProductListItem",
-  components: {
-    IonItem,
-    IonThumbnail,
-    IonLabel
-  },
-  props: ["product"],
-  methods: {
-    async viewProduct () {
-      //TODO need to implement updateCurrentProduct action
-      await this.store.dispatch('product/updateCurrentProduct', {product: this.product});
-      this.router.push({ path: `/product/${this.product.sku}` })
-    }
-  },
-  setup() {
-    const router = useRouter();
-    const store = useStore();
-    
-    return {
-      router,
-      store
-    }
-  },
-})
-</script>
\ No newline at end of file
diff --git a/src/components/SafetyStockModal.vue b/src/components/SafetyStockModal.vue
deleted file mode 100644
index 53d3d78f..00000000
--- a/src/components/SafetyStockModal.vue
+++ /dev/null
@@ -1,104 +0,0 @@
-<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>{{ $t("Set safety stock") }}</ion-title>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <ion-item>
-      <ion-label>{{ $t("Safety stock") }}</ion-label>
-      <ion-input placeholder="new safety stock" />
-    </ion-item>
-    
-    <ion-list>
-      <ion-list-header>{{ $t("Info") }}</ion-list-header>
-    
-      <ion-item>
-        <ion-icon :icon="shirtOutline" slot="start" />
-        <ion-label>56 SKUs</ion-label>
-      </ion-item>
-      <ion-item>
-        <ion-icon :icon="businessOutline" slot="start" />
-        <ion-label>20 locations</ion-label>
-      </ion-item>
-
-      <ion-item lines="none">
-        <ion-label class="ion-text-wrap">{{ $t("You can also download the products, locations and safety stock you selected in a CSV to upload in other systems") }}</ion-label>
-      </ion-item>
-    </ion-list>
-
-    <ion-button fill="outline" color="medium">{{ $t("Download data in csv") }}</ion-button>
-
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
-        <ion-icon :icon="cloudUploadOutline" />
-      </ion-fab-button>
-    </ion-fab>
-  </ion-content>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import {
-  IonButton,
-  IonButtons,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonInput,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonListHeader,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from '@ionic/vue';
-import {
-  closeOutline,
-  shirtOutline,
-  businessOutline,
-  cloudUploadOutline
-} from 'ionicons/icons';
-
-export default defineComponent({
-  name: 'SatetyStockModal',
-  components: {
-    IonButton,
-    IonButtons,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonInput,
-    IonItem,
-    IonLabel,
-    IonList,
-    IonListHeader,
-    IonTitle,
-    IonToolbar
-  },
-  methods: {
-    closeModal() {
-      modalController.dismiss({ dismissed: true });
-    },
-  },
-  setup() {
-    return {
-      closeOutline,
-      cloudUploadOutline,
-      shirtOutline,
-      businessOutline,
-    };
-  },
-});
-</script>
\ No newline at end of file
diff --git a/src/main.ts b/src/main.ts
index a1c97d4c..89a4e5bb 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -29,13 +29,6 @@ import './theme/variables.css';
 
 import i18n from './i18n'
 import store from './store'
-import permissionPlugin from '@/authorization';
-import permissionRules from '@/authorization/Rules';
-import permissionActions from '@/authorization/Actions';
-import { dxpComponents } from '@hotwax/dxp-components'
-import { login, logout, loader } from './user-utils';
-import { getConfig, initialise } from '@/adapter'
-import localeMessages from './locales';
 
 
 const app = createApp(App)
@@ -47,21 +40,7 @@ const app = createApp(App)
   })
   .use(router)
   .use(i18n)
-  .use(store)
-  .use(permissionPlugin, {
-    rules: permissionRules,
-    actions: permissionActions
-  })
-  .use(dxpComponents, {
-    defaultImgUrl: require("@/assets/images/defaultImage.png"),
-    login,
-    logout,
-    loader,
-    appLoginUrl: process.env.VUE_APP_LOGIN_URL as string,
-    getConfig,
-    initialise,
-    localeMessages
-  });
+  .use(store);
 
 // Filters are removed in Vue 3 and global filter introduced https://v3.vuejs.org/guide/migration/filters.html#global-filters
 app.config.globalProperties.$filters = {
diff --git a/src/router/index.ts b/src/router/index.ts
index 6b8910cc..372e5fdc 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,20 +1,12 @@
 import { createRouter, createWebHistory } from '@ionic/vue-router';
 import { RouteRecordRaw } from 'vue-router';
-import SelectFacility from '@/views/SelectFacility.vue'
-import SelectFacilityCSVUpload from '@/views/SelectFacilityCSVUpload.vue'
-import SelectProduct from '@/views/SelectProduct.vue'
-import SelectProductCSVUpload from '@/views/SelectProductCSVUpload.vue'
-import ThresholdUpdates from '@/views/ThresholdUpdates.vue'
 import Settings from "@/views/Settings.vue"
 import store from '@/store'
-import ScheduleThreshold from '@/views/ScheduleThreshold.vue'
-
-import { hasPermission } from '@/authorization';
 import { showToast } from '@/utils'
 import { translate } from '@/i18n'
+import Login from '@/views/Login.vue'
 
 import 'vue-router'
-import { DxpLogin, useAuthStore } from '@hotwax/dxp-components';
 import { loader } from '@/user-utils';
 
 // Defining types for the meta values
@@ -25,77 +17,30 @@ declare module 'vue-router' {
 }
 
 const authGuard = async (to: any, from: any, next: any) => {
-  const authStore = useAuthStore()
-  if (!authStore.isAuthenticated || !store.getters['user/isAuthenticated']) {
-    await loader.present('Authenticating')
-    // TODO use authenticate() when support is there
-    const redirectUrl = window.location.origin + '/login'
-    window.location.href = `${process.env.VUE_APP_LOGIN_URL}?redirectUrl=${redirectUrl}`
-    loader.dismiss()
+  if (store.getters["user/isAuthenticated"]) {
+    next()
+  } else {
+    next("/login")
   }
-  next()
 };
 
 const loginGuard = (to: any, from: any, next: any) => {
-  const authStore = useAuthStore()
-  if (authStore.isAuthenticated && !to.query?.token && !to.query?.oms) {
-    next('/')
+  if (!store.getters["user/isAuthenticated"]) {
+    next()
+  } else {
+    next("/")
   }
-  next();
 };
 
 const routes: Array<RouteRecordRaw> = [
   {
     path: '/',
-    redirect: '/select-product'
-  },
-  {
-    path: '/select-product',
-    name: 'SelectProduct',
-    component: SelectProduct,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_SELECT_PRODUCT_VIEW"
-    }
-  },    
-  {
-    path: '/select-product-csv-upload',
-    name: 'SelectProductCSVUpload',
-    component: SelectProductCSVUpload,
-    meta: {
-      permissionId: ""
-    }
-  },
-  {
-    path: '/select-facility',
-    name: 'SelectFacility',
-    component: SelectFacility,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: ""
-    }
-  },
-  {
-    path: '/select-facility-csv-upload',
-    name: 'SelectFacilityCSVUpload',
-    component: SelectFacilityCSVUpload,
-    meta: {
-      permissionId: ""
-    }
-  },
-  {
-    path: '/threshold-updates',
-    name: 'ThresholdUpdates',
-    component: ThresholdUpdates,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_THRESHOLD_UPDATES_VIEW"
-    }
+    redirect: '/settings'
   },
   {
     path: '/login',
     name: 'DxpLogin',
-    component: DxpLogin,
+    component: Login,
     beforeEnter: loginGuard
   },
   {
@@ -103,16 +48,7 @@ const routes: Array<RouteRecordRaw> = [
     name: "Settings",
     component: Settings,
     beforeEnter: authGuard
-  },
-  {
-    path: '/schedule-threshold',
-    name: 'ScheduleThreshold',
-    component: ScheduleThreshold,
-    beforeEnter: authGuard,
-    meta: {
-      permissionId: "APP_SAVE_THRESHOLD_VIEW"
-    }
-  },
+  }
 ]
 
 const router = createRouter({
@@ -120,18 +56,4 @@ const router = createRouter({
   routes
 })
 
-router.beforeEach((to, from) => {
-  if (to.meta.permissionId && !hasPermission(to.meta.permissionId)) {
-    let redirectToPath = from.path;
-    // If the user has navigated from Login page or if it is page load, redirect user to settings page without showing any toast
-    if (redirectToPath == "/login" || redirectToPath == "/") redirectToPath = "/settings";
-    else {
-      showToast(translate('You do not have permission to access this page'));
-    }
-    return {
-      path: redirectToPath,
-    }
-  }
-})
-
 export default router
\ No newline at end of file
diff --git a/src/services/JobService.ts b/src/services/JobService.ts
deleted file mode 100644
index 0f4e9469..00000000
--- a/src/services/JobService.ts
+++ /dev/null
@@ -1,94 +0,0 @@
-import { api } from '@/adapter';
-import store from "@/store";
-import { hasError } from '@/utils';
-import logger from "@/logger";
-
-const fetchJob = async (payload: any): Promise<any> => {
-  let resp;
-  const params = {
-    "inputFields": {
-      "productStoreId": payload.eComStoreId,
-      "productStoreId_op": "equals",
-      "jobId": payload.jobId.toString(),
-      "jobId_op": "equals"
-    },
-    "fieldList": [ "systemJobEnumId", "runTime", "tempExprId", "parentJobId", "serviceName", "jobId", "jobName", "statusId", "cancelDateTime", "finishDateTime", "startDateTime", "runtimeDataId", "productStoreId" ],
-    "noConditionFind": "Y",
-  }
-  try {
-    resp = await fetchJobInformation(params)
-    if (resp.status === 200 && resp.data.docs?.length > 0 && !hasError(resp)) {
-      const job = resp.data.docs[0];
-      job['statusDesc'] = store.state.util.statusDesc[job.statusId];
-      await store.dispatch('job/fetchTemporalExpression', [job.tempExprId]);
-      await store.dispatch('job/fetchJobDescription', [job.systemJobEnumId]);
-      if (job.runtimeData && job.runtimeData.searchPreferenceId) await store.dispatch('job/fetchThresholdRules', [job.runtimeData.searchPreferenceId])
-      return job;   
-    } else {
-      logger.error(resp);
-      return {};
-    }
-  } catch (err) {
-    logger.error(err);
-    return {}
-  }
-}
-
-const fetchJobInformation = async (payload: any, cache = false): Promise <any>  => {
-  return api({
-    url: "/findJobs",
-    method: "post",
-    data: payload,
-    cache
-  });
-}
-const fetchJobDescription = async (payload: any): Promise <any>  => {
-  return api({
-    url: "performFind",
-    method: "post",
-    data: payload
-  });
-}
-
-const updateJob = async (payload: any): Promise <any>  => {
-  return api({
-    url: "service/updateJobSandbox",
-    method: "post",
-    data: payload
-  });
-}
-
-const scheduleJob = async (payload: any): Promise <any>  => {
-  return api({
-    url: "scheduleService",
-    method: "post",
-    data: payload
-  });
-}
-
-const fetchTemporalExpression = async (payload: any): Promise <any>  => {
-  return api({
-    url: "performFind",
-    method: "post",
-    data: payload
-  });
-}
-
-const fetchThresholdRules = async (payload: any): Promise <any>  => {
-  return api({
-    url: "performFind",
-    method: "post",
-    data: payload
-  });
-}
-
-
-export const JobService = {
-  fetchJobDescription,
-  fetchJobInformation,
-  fetchTemporalExpression,
-  fetchThresholdRules,
-  updateJob,
-  scheduleJob,
-  fetchJob
-}
\ No newline at end of file
diff --git a/src/services/ProductService.ts b/src/services/ProductService.ts
deleted file mode 100644
index 2d2261ab..00000000
--- a/src/services/ProductService.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-import { api } from '@/adapter';
-
-const fetchProducts = async (query: any): Promise <any>  => {
-  return api({
-   // TODO: We can replace this with any API
-    url: "searchProducts", 
-    method: "post",
-    data: query,
-    cache: true
-  });
-}
-
-const getProducts = async (payload: any): Promise<any> => {
-  return api({
-    url: "/solr-query",
-    method: "POST",
-    data: payload
-  })
-}
-
-const updateSearchPreference = async (payload: any): Promise<any> => {
-  return api({
-    url: "service/updateSearchPreference",
-    method: "post",
-    data: payload
-  });
-}
-
-const createSearchPreference = async (payload: any): Promise<any> => {
-  return api({
-    url: "service/createSearchPreference",
-    method: "post",
-    data: payload
-  });
-}
-
-const fetchFacets = async (payload: any): Promise<any> => {
-  return api({
-    url: "/AutoCompleteSolrFacet",
-    method: "get",
-    params: payload
-  });
-}
-
-const associateSearchPrefToUser = async (payload: any): Promise<any> => {
-  return api({
-    url: "service/createUserSearchPreference",
-    method: "post",
-    data: payload
-  });
-}
-
-export const ProductService = {
-  associateSearchPrefToUser,
-  fetchFacets,
-  createSearchPreference,
-  fetchProducts,
-  getProducts,
-  updateSearchPreference
-}
\ No newline at end of file
diff --git a/src/services/UserService.ts b/src/services/UserService.ts
index 9c012a11..7aa87e0c 100644
--- a/src/services/UserService.ts
+++ b/src/services/UserService.ts
@@ -1,263 +1,95 @@
-import { api, client } from '@/adapter';
-import store from '@/store';
-import { hasError } from '@/utils'
+import api, {client} from '@/api';
+import store from "@/store";
+import { hasError } from "@/utils";
 
 const login = async (username: string, password: string): Promise <any> => {
-  return api({
-    url: "login", 
-    method: "post",
-    data: {
-      'USERNAME': username, 
-      'PASSWORD': password
+  let token = ""
+  try {
+    const resp = await api({
+      url: "login", 
+      method: "post",
+      data: {
+        username,
+        password
+      }
+    }) as any;
+
+    if(!hasError(resp) && resp.data.token) {
+      token = resp.data.token
+    } else {
+      throw "Sorry, login failed. Please try again";
     }
-  });
+  } catch(err) {
+    return Promise.reject("Sorry, login failed. Please try again");
+  }
+  return Promise.resolve(token)
 }
 
 const getUserProfile = async (token: any): Promise<any> => {
-  const baseURL = store.getters['user/getBaseUrl'];
+  console.log('sdo');
+  const baseURL = store.getters["user/getBaseUrl"];
+  console.log(baseURL);
+  
   try {
     const resp = await client({
-      url: "user-profile",
-      method: "get",
+      url: "user/profile",
+      method: "GET",
       baseURL,
       headers: {
-        Authorization:  'Bearer ' + token,
-        'Content-Type': 'application/json'
+        "api_key": token,
+        "Content-Type": "application/json"
       }
     });
-    if(hasError(resp)) return Promise.reject("Error getting user profile: " + JSON.stringify(resp.data));
+    if(hasError(resp)) throw "Error getting user profile";
     return Promise.resolve(resp.data)
   } catch(error: any) {
     return Promise.reject(error)
   }
 }
 
-const getAvailableTimeZones = async (): Promise <any>  => {
-  return api({
-    url: "getAvailableTimeZones",
-    method: "get",
-    cache: true
-  });
-}
-const setUserTimeZone = async (payload: any): Promise <any>  => {
-  return api({
-    url: "setUserTimeZone",
-    method: "post",
-    data: payload
-  });
-}
-const getEComStores = async (token: any, partyId: any): Promise<any> => {
+const getEComStores = async (token: any): Promise<any> => {
   try {
-    const params = {
-      "inputFields": {
-        "storeName_op": "not-empty",
-        partyId
-      },
-      "fieldList": ["productStoreId", "storeName"],
-      "entityName": "ProductStoreAndRole",
-      "distinct": "Y",
-      "noConditionFind": "Y",
-      "filterByDate": 'Y',
-    }
-    const baseURL = store.getters['user/getBaseUrl'];
+    const baseURL = store.getters["user/getBaseUrl"];
     const resp = await client({
-      url: "performFind",
-      method: "get",
+      url: "user/productStore",
+      method: "GET",
       baseURL,
-      params,
       headers: {
-        Authorization:  'Bearer ' + token,
-        'Content-Type': 'application/json'
+        "api_key": token,
+        "Content-Type": "application/json"
       }
     });
     // Disallow login if the user is not associated with any product store
-    if (hasError(resp) || resp.data.docs.length === 0) {
-      return Promise.reject(resp.data);
-    } else {
-      return Promise.resolve(resp.data.docs);
-    }
-  } catch(error: any) {
-    return Promise.reject(error)
-  }
-}
-const getEcommerceCatalog = async (token: any, productStoreId: any): Promise<any> => {
-  try {
-    const params = {
-      "inputFields": {
-        productStoreId
-      },
-      "fieldList": ["productStoreId", "prodCatalogId"],
-      "entityName": "ProductStoreCatalog",
-      "distinct": "Y",
-      "noConditionFind": "Y",
-      "filterByDate": 'Y',
-    }
-    const baseURL = store.getters['user/getBaseUrl'];
-    const resp = await client({
-      url: "performFind",
-      method: "get",
-      baseURL,
-      params,
-      headers: {
-        Authorization:  'Bearer ' + token,
-        'Content-Type': 'application/json'
-      }
-    });
-    if (hasError(resp) || resp.data.docs?.length == 0) {
-      // if has error or not catalog found
-      return Promise.reject(resp.data.docs);
+    if (hasError(resp) || resp.data.length === 0) {
+      throw resp.data;
     } else {
-      return Promise.resolve(resp.data.docs[0]);
+      return Promise.resolve(resp.data);
     }
   } catch(error: any) {
     return Promise.reject(error)
   }
 }
 
-
-const setUserPreference = async (payload: any): Promise<any> => {
+const getAvailableTimeZones = async (): Promise <any>  => {
   return api({
-    url: "service/setUserPreference",
-    method: "post",
-    data: payload
+    url: "user/getAvailableTimeZones",
+    method: "get",
+    cache: true
   });
 }
 
-const getUserPreference = async (payload: any): Promise<any> => {
+const setUserTimeZone = async (payload: any): Promise <any>  => {
   return api({
-    url: "service/getUserPreference",
-    //TODO Due to security reasons service model of OMS 1.0 does not support sending parameters in get request that's why we use post here
+    url: "setUserTimeZone",
     method: "post",
-    data: payload,
+    data: payload
   });
 }
 
-const getPreferredStore = async (token: any): Promise<any> => {
-  const baseURL = store.getters['user/getBaseUrl'];
-  try {
-    const resp = await client({
-      url: "service/getUserPreference",
-      //TODO Due to security reasons service model of OMS 1.0 does not support sending parameters in get request that's why we use post here
-      method: "post",
-      baseURL,
-      headers: {
-        Authorization:  'Bearer ' + token,
-        'Content-Type': 'application/json'
-      },
-      data: {
-        'userPrefTypeId': 'SELECTED_BRAND'
-      },
-    });
-    if (hasError(resp)) {
-      return Promise.reject(resp.data);
-    } else {
-      return Promise.resolve(resp.data.userPrefValue);
-    }
-  } catch(error: any) {
-    return Promise.reject(error)
-  }
-  
-}
-
-const getUserPermissions = async (payload: any, token: any): Promise<any> => {
-  const baseURL = store.getters['user/getBaseUrl'];
-  let serverPermissions = [] as any;
-
-  // If the server specific permission list doesn't exist, getting server permissions will be of no use
-  // It means there are no rules yet depending upon the server permissions.
-  if (payload.permissionIds && payload.permissionIds.length == 0) return serverPermissions;
-  // TODO pass specific permissionIds
-  let resp;
-    // TODO Make it configurable from the environment variables.
-    // Though this might not be an server specific configuration, 
-    // we will be adding it to environment variable for easy configuration at app level
-    const viewSize = 200;
-
-    try {
-      const params = {
-        "viewIndex": 0,
-        viewSize,
-        permissionIds: payload.permissionIds
-      }
-      resp = await client({
-        url: "getPermissions",
-        method: "post",
-        baseURL,
-        data: params,
-        headers: {
-          Authorization:  'Bearer ' + token,
-          'Content-Type': 'application/json'
-        }
-      })
-      if(resp.status === 200 && resp.data.docs?.length && !hasError(resp)) {
-        serverPermissions = resp.data.docs.map((permission: any) => permission.permissionId);
-        const total = resp.data.count;
-        const remainingPermissions = total - serverPermissions.length;
-        if (remainingPermissions > 0) {
-          // We need to get all the remaining permissions
-          const apiCallsNeeded = Math.floor(remainingPermissions / viewSize) + ( remainingPermissions % viewSize != 0 ? 1 : 0);
-          const responses = await Promise.all([...Array(apiCallsNeeded).keys()].map(async (index: any) => {
-            const response = await client({
-              url: "getPermissions",
-              method: "post",
-              baseURL,
-              data: {
-                "viewIndex": index + 1,
-                viewSize,
-                permissionIds: payload.permissionIds
-              },
-              headers: {
-                Authorization:  'Bearer ' + token,
-                'Content-Type': 'application/json'
-              }
-            })
-            if(!hasError(response)){
-              return Promise.resolve(response);
-              } else {
-              return Promise.reject(response);
-              }
-          }))
-          const permissionResponses = {
-            success: [],
-            failed: []
-          }
-          responses.reduce((permissionResponses: any, permissionResponse: any) => {
-            if (permissionResponse.status !== 200 || hasError(permissionResponse) || !permissionResponse.data?.docs) {
-              permissionResponses.failed.push(permissionResponse);
-            } else {
-              permissionResponses.success.push(permissionResponse);
-            }
-            return permissionResponses;
-          }, permissionResponses)
-
-          serverPermissions = permissionResponses.success.reduce((serverPermissions: any, response: any) => {
-            serverPermissions.push(...response.data.docs.map((permission: any) => permission.permissionId));
-            return serverPermissions;
-          }, serverPermissions)
-
-          // If partial permissions are received and we still allow user to login, some of the functionality might not work related to the permissions missed.
-          // Show toast to user intimiting about the failure
-          // Allow user to login
-          // TODO Implement Retry or improve experience with show in progress icon and allowing login only if all the data related to user profile is fetched.
-          if (permissionResponses.failed.length > 0) Promise.reject("Something went wrong while getting complete user permissions.");
-        }
-      }
-      return serverPermissions;
-    } catch(error: any) {
-      return Promise.reject(error);
-    }
-}
-
-
 export const UserService = {
-    getEcommerceCatalog,
-    getPreferredStore,
-    getUserPermissions,
-    getUserProfile,
-    login,
-    getAvailableTimeZones,
-    setUserTimeZone,
-    setUserPreference,
-    getUserPreference,
-    getEComStores
+  getAvailableTimeZones,
+  getEComStores,
+  getUserProfile,
+  login,
+  setUserTimeZone
 }
\ No newline at end of file
diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
deleted file mode 100644
index 9cd4f276..00000000
--- a/src/services/UtilService.ts
+++ /dev/null
@@ -1,42 +0,0 @@
-import { api } from '@/adapter';
-
-const getServiceStatusDesc = async (payload: any): Promise<any> => {
-  return api({
-    url: "performFind",
-    method: "post",
-    data: payload,
-    cache: true
-  });
-}
-
-const getShopifyConfig = async (payload: any): Promise <any>  => {
-  return api({
-    url: "performFind",
-    method: "post",
-    data: payload
-  });
-}
-
-const fetchFacilitiesByProductStore = async (payload: any): Promise <any>  => {
-  return api({
-    url: "performFind",
-    method: "post",
-    data: payload
-  });
-}
-
-
-const fetchChannels = async (payload: any): Promise<any> => {
-  return api({
-    url: "performFind",
-    method: "POST",
-    data: payload
-  })
-}
-
-export const UtilService = {
-  fetchFacilitiesByProductStore,
-  getServiceStatusDesc,
-  getShopifyConfig,
-  fetchChannels
-}
\ No newline at end of file
diff --git a/src/store/index.ts b/src/store/index.ts
index 707a438e..579b6808 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -5,10 +5,6 @@ import actions from './actions'
 import RootState from './RootState'
 import createPersistedState from "vuex-persistedstate";
 import userModule from './modules/user';
-import productModule from "./modules/product"
-import jobModule from './modules/job'
-import utilModule from "./modules/util"
-import { setPermissions } from '@/authorization'
 
 
 // TODO check how to register it from the components only
@@ -21,7 +17,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: ['user', 'util'],
+    paths: ['user'],
     fetchBeforeUse: true
 })
 
@@ -33,15 +29,10 @@ const store = createStore<RootState>({
     getters,
     plugins: [ persistState ],
     modules: { 
-        'user': userModule,
-        'product': productModule,
-        'job': jobModule,
-        'util': utilModule
+        'user': userModule
     },
 })
 
-setPermissions(store.getters['user/getUserPermissions']);
-
 export default store
 export function useStore(): typeof store {
     return useVuexStore()
diff --git a/src/store/modules/job/JobState.ts b/src/store/modules/job/JobState.ts
deleted file mode 100644
index ffe78fcc..00000000
--- a/src/store/modules/job/JobState.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-export default interface JobState {
-    pending: {
-      list: any,
-      total: 0
-    }
-    running: {
-      list: any,
-      total: 0
-    }
-    history: {
-      list: any,
-      total: 0
-    }
-    temporalExp: any;
-    enumIds: any;
-    thresholdRules: any;
-}
\ No newline at end of file
diff --git a/src/store/modules/job/actions.ts b/src/store/modules/job/actions.ts
deleted file mode 100644
index 7c6bce6a..00000000
--- a/src/store/modules/job/actions.ts
+++ /dev/null
@@ -1,331 +0,0 @@
-import { ActionTree } from 'vuex'
-import RootState from '@/store/RootState'
-import JobState from './JobState'
-import * as types from './mutation-types'
-import { getResponseError, hasError, showToast } from '@/utils'
-import { JobService } from '@/services/JobService'
-import { translate } from '@/i18n'
-import { DateTime } from 'luxon';
-import logger from "@/logger";
-
-const actions: ActionTree<JobState, RootState> = {
-  async fetchJobDescription({ commit, state }, payload){
-    const enumIds = [] as any;
-    const cachedEnumIds = Object.keys(state.enumIds);
-    payload.map((id: any) => {
-      if(!cachedEnumIds.includes(id) && id){
-        enumIds.push(id);
-      }
-    });
-    if(enumIds.length <= 0) return enumIds.map((id: any) => state.enumIds[id]);
-
-    const resp = await JobService.fetchJobDescription({
-      "inputFields": {
-        "enumId": enumIds,
-        "enumId_op": "in"
-      },
-      "fieldList": ['enumId', 'description', 'enumName'],
-      "entityName": "Enumeration",
-      "noConditionFind": "Y",
-      "viewSize": payload.length
-    })
-    if (resp.status === 200 && resp.data?.count > 0 && !hasError(resp)) {
-      const enumInformation = resp.data.docs;
-      if (resp.data.docs) {
-        commit(types.JOB_DESCRIPTION_UPDATED, enumInformation);
-      }
-    }
-    return resp;
-  },
-
-  async fetchJobHistory({ commit, dispatch, state }, payload){ 
-    await JobService.fetchJobInformation({
-      "inputFields": {
-        "systemJobEnumId_fld0_value": payload.jobEnums[0],
-        "systemJobEnumId_fld0_grp": "1",
-        "systemJobEnumId_fld0_op": "equals",
-        "systemJobEnumId_fld1_value": payload.jobEnums[1],
-        "systemJobEnumId_fld1_grp": "2",
-        "systemJobEnumId_fld1_op": "equals",
-        "productStoreId": this.state.user.currentEComStore.productStoreId,
-        "productStoreId_grp": "2",
-        "statusId": ["SERVICE_CANCELLED", "SERVICE_CRASHED", "SERVICE_FAILED", "SERVICE_FINISHED"],
-        "statusId_op": "in",
-        "systemJobEnumId_op": "not-empty"
-      },
-      "fieldList": [ "systemJobEnumId", "runTime", "tempExprId", "parentJobId", "serviceName", "jobId", "jobName", "statusId", "cancelDateTime", "finishDateTime", "startDateTime", "runtimeDataId" ],
-      "entityName": "JobSandbox",
-      "noConditionFind": "Y",
-      "viewSize": payload.viewSize,
-      "viewIndex": payload.viewIndex,
-      "orderBy": "runTime DESC"
-    }).then((resp) => {
-      if (resp.status === 200 && resp.data.docs?.length > 0 && !hasError(resp)) {
-        if (resp.data.docs) {
-          const total = resp.data.count;
-          let jobs = resp.data.docs;
-          if(payload.viewIndex && payload.viewIndex > 0){
-            jobs = state.history.list.concat(resp.data.docs);
-          }
-          jobs.map((job: any) => {
-            job['statusDesc'] = this.state.util.statusDesc[job.statusId];
-          })          
-          commit(types.JOB_HISTORY_UPDATED, { jobs, total });
-          const tempExprList = [] as any;
-          const enumIds = [] as any;
-          const searchPreferenceIds = [] as any;
-          resp.data.docs.map((item: any) => {
-            enumIds.push(item.systemJobEnumId);
-            tempExprList.push(item.tempExprId);
-            if (item.runtimeData && item.runtimeData.searchPreferenceId) searchPreferenceIds.push(item.runtimeData.searchPreferenceId)
-          })
-          const tempExpr = [...new Set(tempExprList)];
-          dispatch('fetchTemporalExpression', tempExpr);
-          dispatch('fetchJobDescription', enumIds);
-          dispatch('fetchThresholdRules', [...new Set(searchPreferenceIds)])
-        }
-      } else {
-        commit(types.JOB_HISTORY_UPDATED, { jobs: [], total: 0 });
-      }
-    }).catch((err) => {
-      commit(types.JOB_HISTORY_UPDATED, { jobs: [], total: 0 });
-      logger.error(err);
-      showToast(translate("Something went wrong"), err);
-    }) 
-  },
-
-  async fetchRunningJobs({ commit, dispatch, state }, payload){
-    await JobService.fetchJobInformation({
-      "inputFields": {
-        "systemJobEnumId_fld0_value": payload.jobEnums[0],
-        "systemJobEnumId_fld0_grp": "1",
-        "systemJobEnumId_fld0_op": "equals",
-        "systemJobEnumId_fld1_value": payload.jobEnums[1],
-        "systemJobEnumId_fld1_grp": "2",
-        "systemJobEnumId_fld1_op": "equals",
-        "productStoreId": this.state.user.currentEComStore.productStoreId,
-        "productStoreId_grp": "2",
-        "statusId": ["SERVICE_RUNNING", "SERVICE_QUEUED"],
-        "statusId_op": "in",
-        "systemJobEnumId_op": "not-empty",
-      },
-      "fieldList": [ "systemJobEnumId", "runTime", "tempExprId", "parentJobId", "serviceName", "jobId", "jobName", "statusId", "runtimeDataId" ],
-      "entityName": "JobSandbox",
-      "noConditionFind": "Y",
-      "viewSize": payload.viewSize,
-      "viewIndex": payload.viewIndex,
-      "orderBy": "runTime DESC"
-    }).then((resp) => {
-      if (resp.status === 200 && resp.data.docs?.length > 0 && !hasError(resp)) {
-        if (resp.data.docs) {
-          const total = resp.data.count;
-          let jobs = resp.data.docs;
-          if(payload.viewIndex && payload.viewIndex > 0){
-            jobs = state.running.list.concat(resp.data.docs);
-          }
-          jobs.map((job: any) => {
-            job['statusDesc'] = this.state.util.statusDesc[job.statusId];
-          })
-          commit(types.JOB_RUNNING_UPDATED, { jobs, total });
-          const tempExprList = [] as any;
-          const enumIds = [] as any;
-          const searchPreferenceIds = [] as any;
-          resp.data.docs.map((item: any) => {
-            enumIds.push(item.systemJobEnumId);
-            tempExprList.push(item.tempExprId);
-            if (item.runtimeData && item.runtimeData.searchPreferenceId) searchPreferenceIds.push(item.runtimeData.searchPreferenceId)
-          })
-          const tempExpr = [...new Set(tempExprList)];
-          dispatch('fetchTemporalExpression', tempExpr);
-          dispatch('fetchJobDescription', enumIds);
-          dispatch('fetchThresholdRules', [...new Set(searchPreferenceIds)])
-        }
-      } else {
-        commit(types.JOB_RUNNING_UPDATED, { jobs: [], total: 0 });
-      }
-    }).catch((err) => {
-      commit(types.JOB_RUNNING_UPDATED, { jobs: [], total: 0 });
-      logger.error(err);
-      showToast(translate("Something went wrong"), err);
-    }) 
-  },
-
-  async fetchPendingJobs({ commit, dispatch, state }, payload){
-    await JobService.fetchJobInformation({
-      "inputFields": {
-        "systemJobEnumId_fld0_value": payload.jobEnums[0],
-        "systemJobEnumId_fld0_grp": "1",
-        "systemJobEnumId_fld0_op": "equals",
-        "systemJobEnumId_fld1_value": payload.jobEnums[1],
-        "systemJobEnumId_fld1_grp": "2",
-        "systemJobEnumId_fld1_op": "equals",
-        "productStoreId": this.state.user.currentEComStore.productStoreId,
-        "productStoreId_grp": "2",
-        "statusId": "SERVICE_PENDING",
-        "systemJobEnumId_op": "not-empty"
-      },
-      "fieldList": [ "systemJobEnumId", "runTime", "tempExprId", "parentJobId", "serviceName", "jobId", "jobName", "currentRetryCount", "statusId", "runtimeDataId", "productStoreId" ],
-      "entityName": "JobSandbox",
-      "noConditionFind": "Y",
-      "viewSize": payload.viewSize,
-      "viewIndex": payload.viewIndex,
-      "orderBy": "runTime ASC"
-    }).then((resp) => {
-      if (resp.status === 200 && resp.data.docs?.length > 0 && !hasError(resp)) {
-        if (resp.data.docs) {
-          const total = resp.data.count;
-          let jobs = resp.data.docs;
-          if(payload.viewIndex && payload.viewIndex > 0){
-            jobs = state.pending.list.concat(resp.data.docs);
-          }
-          
-          commit(types.JOB_PENDING_UPDATED, { jobs, total });
-          const tempExprList = [] as any;
-          const enumIds = [] as any;
-          const searchPreferenceIds = [] as any;
-          resp.data.docs.map((item: any) => {
-            enumIds.push(item.systemJobEnumId);
-            tempExprList.push(item.tempExprId);
-            if (item.runtimeData && item.runtimeData.searchPreferenceId) searchPreferenceIds.push(item.runtimeData.searchPreferenceId)
-          })
-          const tempExpr = [...new Set(tempExprList)];
-          dispatch('fetchTemporalExpression', tempExpr);
-          dispatch('fetchJobDescription', enumIds);
-          dispatch('fetchThresholdRules', [...new Set(searchPreferenceIds)])
-        }
-      } else {
-        commit(types.JOB_PENDING_UPDATED, { jobs: [], total: 0 });
-      }
-    }).catch((err) => {
-      commit(types.JOB_PENDING_UPDATED, { jobs: [], total: 0 });
-      logger.error(err);
-      showToast(translate("Something went wrong"), err);
-    })
-  },
-  async fetchTemporalExpression({ state, commit }, tempExprIds){
-    const tempIds = [] as any;
-    const cachedTempExprId = Object.keys(state.temporalExp);
-    tempExprIds.map((id: any) => {
-      if(!cachedTempExprId.includes(id) && id){
-        tempIds.push(id);
-      }
-    });
-    if(tempIds.length <= 0) return tempExprIds.map((id: any) => state.temporalExp[id]);
-    
-    const resp = await JobService.fetchTemporalExpression({
-        "inputFields": {
-        "tempExprId": tempIds,
-        "temoExprId_op": "in"
-      },
-      "viewSize": tempIds.length,
-      "fieldList": [ "tempExprId", "description","integer1", "integer2" ],
-      "entityName": "TemporalExpression",
-      "noConditionFind": "Y",
-    })
-    if (resp.status === 200 && !hasError(resp)) {
-      commit(types.JOB_TEMPORAL_EXPRESSION_UPDATED, resp.data.docs);
-    }
-    return resp;
-  },
-  async fetchThresholdRules({ state, commit }, thresholdRuleIds){
-    const tempIds = [] as any;
-    const cachedThresholdRuleIds = Object.keys(state.thresholdRules);
-    thresholdRuleIds.map((id: any) => {
-      if(!cachedThresholdRuleIds.includes(id) && id){
-        tempIds.push(id);
-      }
-    });
-    if(tempIds.length <= 0) return thresholdRuleIds.map((id: any) => state.temporalExp[id]);
-    try {
-      const resp = await JobService.fetchThresholdRules({
-        "inputFields": {
-          "searchPrefId": tempIds,
-          "searchPrefId_op": "in"
-        },
-        "viewSize": tempIds.length,
-        "fieldList": [ "searchPrefId", "searchPrefValue"],
-        "entityName": "SearchPreference",
-        "noConditionFind": "Y",
-      })
-      if (resp.status === 200 && !hasError(resp)) {
-        commit(types.JOB_THRESHOLD_RULES_UPDATED, resp.data.docs);
-      }
-      return resp;
-    } catch(err: any){
-      logger.error(err);
-      return Promise.reject(new Error(err))
-    }
-  },
-
-  removeThresholdRule({ commit }, id){
-    commit(types.JOB_THRESHOLD_RULE_REMOVED, id);
-  },
-
-  clearJobState({commit}) {
-    commit(types.JOB_PENDING_UPDATED, {jobs: [], total: 0});
-    commit(types.JOB_HISTORY_UPDATED, {jobs: [], total: 0});
-    commit(types.JOB_RUNNING_UPDATED, {jobs: [], total: 0});
-  },
-
-  async skipJob({ getters }, job) {
-    let skipTime = {};
-    const integer1 = getters['getTemporalExpr'](job.tempExprId).integer1;
-    const integer2 = getters['getTemporalExpr'](job.tempExprId).integer2
-    if(integer1 === 12) {
-      skipTime = { minutes: integer2 }
-    } else if (integer1 === 10) {
-      skipTime = { hours: integer2 }
-    } else if (integer1 === 5) {
-      skipTime = { days: integer2 }
-    } else {
-      showToast(translate("This job schedule cannot be skipped"));
-      return;
-    }
-    const time = DateTime.fromMillis(job.runTime).diff(DateTime.local()).plus(skipTime);
-    const updatedRunTime = time.toMillis() + DateTime.local().toMillis()
-    const payload = {
-      'jobId': job.jobId,
-      'runTime': updatedRunTime,
-      'systemJobEnumId': job.systemJobEnumId,
-      'recurrenceTimeZone': this.state.user.current.userTimeZone,
-      'statusId': "SERVICE_PENDING"
-    } as any
-
-    const resp = await JobService.updateJob(payload)
-    if (resp.status === 200 && !hasError(resp) && resp.data.successMessage) {
-      // TODO: improve the condition to store the current job in state.
-      // returning the updated runTime on success as, the job configuration component does not get updated when
-      // skipping a job from there.
-      return { updatedRunTime: payload.runTime }
-    }
-    return resp;
-  },
-
-  async cancelJob({ dispatch }, job) {
-    let resp;
-
-    try {
-      resp = await JobService.updateJob({
-        jobId: job.jobId,
-        systemJobEnumId: job.systemJobEnumId,
-        statusId: "SERVICE_CANCELLED",
-        recurrenceTimeZone: this.state.user.current.userTimeZone,
-        cancelDateTime: DateTime.now().toMillis()
-      });
-      if (resp.status == 200 && !hasError(resp)) {
-        showToast(translate('Service updated successfully'))
-      } else {
-        showToast(translate('Something went wrong'), getResponseError(resp))
-      }
-    } catch (err) {
-      showToast(translate('Something went wrong'), err)
-      logger.error(err)
-      // TODO: explore around handling error, so that we can directly access the response status code
-      // This is returned so that response is handled in catch instead of then
-      // err is string and when trying to access status it gives error
-      return Promise.reject(err)
-    }
-    return resp;
-  },
-}
-export default actions;
\ No newline at end of file
diff --git a/src/store/modules/job/getters.ts b/src/store/modules/job/getters.ts
deleted file mode 100644
index 44605b1e..00000000
--- a/src/store/modules/job/getters.ts
+++ /dev/null
@@ -1,56 +0,0 @@
-import { GetterTree } from 'vuex'
-import JobState from './JobState'
-import RootState from '../../RootState'
-import parser from 'boolean-parser'
-
-const getters: GetterTree <JobState, RootState> = {
-    getPendingJobs (state){
-      return state.pending.list;
-    },
-    getTemporalExpr: (state) => (id: string): any  => {
-      return state.temporalExp[id];
-    },
-    getEnumDescription: (state) => (id: string): any => {
-      return state.enumIds[id]?.description;
-    },
-    getEnumName: (state) => (id: string): any => {
-      return state.enumIds[id] ? state.enumIds[id]?.enumName : '';
-    },
-    isPendingJobsScrollable: (state) => {
-      return state.pending.list?.length > 0 && state.pending.list?.length < state.pending.total
-    },
-    isRunningJobsScrollable: (state) => {
-      return state.running.list?.length > 0 && state.running.list?.length < state.running.total
-    },
-    getRunningJobs (state){
-      return state.running.list;
-    },
-    isHistoryJobsScrollable: (state) => {
-      return state.history.list?.length > 0 && state.history.list?.length < state.history.total
-    },
-    getJobHistory (state){
-      return state.history.list;
-    },
-    getTagsAndOperator: (state, getters) => (id: string, type: string): any => {
-      const tagString = getters.getTags(id, type);
-      const operator = tagString.indexOf(' AND ') > 0 ? 'AND' : 'OR'
-      if(tagString){
-        let tags = parser.removeOuterBrackets(tagString.trim());
-        //Need to parse as it is returned in json format
-        tags = tags.split(` ${operator} `).map((tag: any) => JSON.parse(tag))
-        return { tags, operator }
-      } 
-      return { tags: [], operator };
-    },
-    getTags: (state) => (id: string, type: string): any => {
-      const thresholdRule = state.thresholdRules[id];
-      if (!thresholdRule) return "";
-      const tags = thresholdRule.json.filter.find((filter: any) => filter.startsWith(type === 'included' ? 'tags:' : '-tags:')) 
-      return tags ? tags.substring(tags.indexOf(":") + 1) : "";
-    },
-    getThresholdRule: (state) => (id: string): any => {
-      return state.thresholdRules[id];
-    }
-  }
-
-  export default getters;
\ No newline at end of file
diff --git a/src/store/modules/job/index.ts b/src/store/modules/job/index.ts
deleted file mode 100644
index 0d414713..00000000
--- a/src/store/modules/job/index.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-import actions from './actions'
-import getters from './getters'
-import mutations from './mutations'
-import { Module } from 'vuex'
-import JobState from './JobState'
-import RootState from '../../RootState'
-
-const jobModule: Module<JobState, RootState> = {
-    namespaced: true,
-    state: {
-      pending: {
-        list: [],
-        total: 0
-      },
-      running: {
-        list: [],
-        total: 0
-      },
-      history: {
-        list: [],
-        total: 0
-      },
-      temporalExp: [],
-      enumIds: {},
-      thresholdRules: {}
-    },
-    getters,
-    actions,
-    mutations,
-}
-
-export default jobModule;
-
-// TODO
-// store.registerModule('job', jobModule);
diff --git a/src/store/modules/job/mutation-types.ts b/src/store/modules/job/mutation-types.ts
deleted file mode 100644
index 8505d657..00000000
--- a/src/store/modules/job/mutation-types.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-export const SN_JOB = 'job'
-export const JOB_PENDING_UPDATED = SN_JOB + '/PENDING_UPDATED'
-export const JOB_TEMPORAL_EXPRESSION_UPDATED = SN_JOB + '/TEMPORAL_EXPRESSION_UPDATED'
-export const JOB_THRESHOLD_RULES_UPDATED = SN_JOB + '/THRESHOLD_RULES_UPDATED'
-export const JOB_DESCRIPTION_UPDATED = SN_JOB + '/DESCRIPTION_UPDATED'
-export const JOB_HISTORY_UPDATED = SN_JOB + '/HISTORY_UPDATED'
-export const JOB_RUNNING_UPDATED = SN_JOB + '/RUNNING_UPDATED'
-export const JOB_THRESHOLD_RULE_REMOVED = SN_JOB + 'THRESHOLD_RULE_REMOVED'
\ No newline at end of file
diff --git a/src/store/modules/job/mutations.ts b/src/store/modules/job/mutations.ts
deleted file mode 100644
index b394ab19..00000000
--- a/src/store/modules/job/mutations.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-import { MutationTree } from 'vuex'
-import JobState from './JobState'
-import * as types from './mutation-types'
-import logger from "@/logger";
-
-const mutations: MutationTree <JobState> = {
-    [types.JOB_PENDING_UPDATED] (state, payload) {
-        state.pending.list = payload.jobs;
-        state.pending.total = payload.total;
-    },
-    [types.JOB_RUNNING_UPDATED] (state, payload) {
-        state.running.list = payload.jobs;
-        state.running.total = payload.total;
-    },
-    [types.JOB_HISTORY_UPDATED] (state, payload) {
-        state.history.list = payload.jobs;
-        state.history.total = payload.total;
-    },
-    [types.JOB_TEMPORAL_EXPRESSION_UPDATED] (state, temporalExpressions) {
-        if(temporalExpressions){
-            temporalExpressions.forEach((temporalExpression: any) => {
-              state.temporalExp[temporalExpression.tempExprId] = temporalExpression;
-            })
-        }
-    },
-    [types.JOB_THRESHOLD_RULES_UPDATED] (state, thresholdRules) {
-        if(thresholdRules){
-            state.thresholdRules = thresholdRules.reduce((thresholdRules: any, thresholdRule: any) => {
-                // Try catch to handle when parsing fails
-                try {
-                    thresholdRules[thresholdRule.searchPrefId] = JSON.parse(thresholdRule.searchPrefValue);
-                } catch(err) {
-                    logger.error(err);
-                }
-              return thresholdRules;
-            }, state.thresholdRules)
-        }
-    },
-    [types.JOB_DESCRIPTION_UPDATED] (state, enums) {
-        if (enums) {
-            enums.forEach((enumInfo: any) => {
-              state.enumIds[enumInfo.enumId] = enumInfo
-            });
-        }
-    },
-    [types.JOB_THRESHOLD_RULE_REMOVED] (state, id) {
-        if(id) {
-            delete state.thresholdRules[id]
-        }
-    }
-}
-export default mutations;
\ No newline at end of file
diff --git a/src/store/modules/product/ProductState.ts b/src/store/modules/product/ProductState.ts
deleted file mode 100644
index 072ae303..00000000
--- a/src/store/modules/product/ProductState.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-export default interface ProductState {
-  products: {
-    list: any;
-    total: {
-      variant: number;
-      virtual: number;
-    }
-  };
-  appliedFilters: {
-    included: {
-      tags: {
-        list: any;
-        operator: string;
-      };
-    },
-    excluded: {
-      tags: {
-        list: any;
-        operator: string;
-      };
-    }
-  };
-  query: any;
-  threshold: number;
-}
\ No newline at end of file
diff --git a/src/store/modules/product/actions.ts b/src/store/modules/product/actions.ts
deleted file mode 100644
index daa11bdc..00000000
--- a/src/store/modules/product/actions.ts
+++ /dev/null
@@ -1,157 +0,0 @@
-import { ProductService } from "@/services/ProductService";
-import { ActionTree } from 'vuex'
-import RootState from '@/store/RootState'
-import ProductState from './ProductState'
-import * as types from './mutation-types'
-import { hasError, showToast, getFeature } from '@/utils'
-import { translate } from '@/i18n'
-import logger from "@/logger";
-
-const actions: ActionTree<ProductState, RootState> = {
-
-  async getProducts({ commit, state }) {
-    let resp;
-
-    const query = state.query
-
-    try {
-      resp = await ProductService.getProducts(query);
-
-      if (resp.status === 200 && resp.data.grouped.groupId?.ngroups > 0 && !hasError(resp)) {
-        let products = resp.data.grouped.groupId?.groups;
-        let totalVirtual = resp.data.grouped.groupId.ngroups;
-        let totalVariant = resp.data.grouped.groupId.matches;
-        products = products.map((product: any) => {
-          return {
-            productId: product.groupValue,
-            productName: product.doclist.docs[0]?.parentProductName,
-            variants: product.doclist.docs.map((variant: any) => {
-              return {
-                ...variant,
-                'color': getFeature(variant.featureHierarchy, '1/COLOR/'),
-                'size': getFeature(variant.featureHierarchy, '1/SIZE/')
-              }
-            })
-          }
-        })
-
-        if(query.json.params.start && query.json.params.start > 0) products = state.products.list.concat(products);
-        if(query.json.query !== "*:*"){
-          totalVirtual = state.products.total.virtual
-          totalVariant = state.products.total.variant
-        }
-        commit(types.PRODUCT_LIST_UPDATED, { products, totalVirtual, totalVariant });
-      } else {
-        showToast(translate("Products not found"));
-        commit(types.PRODUCT_LIST_UPDATED, { products: [], totalVirtual: query.json.query === "*:*" ? 0 : state.products.total.virtual, totalVariant: query.json.query === "*:*" ? 0 : state.products.total.variant });
-      }
-    } catch (error) {
-      logger.error(error);
-      showToast(translate("Something went wrong"), error);
-    }
-    return resp;
-  },
-
-  setAppliedfiltersAndOperator({ commit, dispatch }, payload){
-    commit(types.PRODUCT_ALL_FILTERS_UPDATED, payload)
-    dispatch('updateQuery');
-  },
-
-  async updateAppliedFilters({ commit, state, dispatch }, payload) {
-    commit(types.PRODUCT_FILTER_UPDATED, { id: payload.id, type: payload.type, value: payload.value })
-    dispatch('updateQuery')
-  },
-
-  async updateAppliedFilterOperator({ commit, state, dispatch }, payload) {
-    const appliedFilters = JSON.parse(JSON.stringify((state.appliedFilters as any)[payload.type][payload.id]))
-    appliedFilters.operator = payload.value;
-    commit(types.PRODUCT_FILTER_UPDATED, {id: payload.id, type: payload.type, value: appliedFilters})
-    // If we have list items then only apply filters again
-    if(appliedFilters.list.length) dispatch('updateQuery')
-  },
-
-  async updateQuery({ commit, dispatch, state }, payload) {
-    // initializing the filter always on updateQuery call because we are adding values in the filter
-    // as string and if some value is removed then we need to do multiple operations on the filter string
-    // to remove that value from the query filter
-    state.query.json['filter'] = ["docType: PRODUCT", "groupId: *", `prodCatalogIds: ${this.state.user.currentEComStore.prodCatalogId}`]
-    state.query.json['params'] = {
-      "group": true,
-      "group.field": "groupId",
-      "group.limit": 10000,
-      "group.ngroups": true
-    }
-    state.query.json['query'] = "*:*"
-
-    if(payload && payload.queryString) {
-      state.query.json.params.defType = 'edismax'
-      state.query.json.params.qf = 'productId productName upc sku internalName brandName parentProductName'
-      state.query.json.query = `${payload.queryString}`
-    }
-
-    if (payload) {
-      state.query.json.params.rows = payload.viewSize
-      state.query.json.params.start = payload.viewSize * payload.viewIndex
-    }
-    state.query.json['filter'] = Object.keys(state.appliedFilters.included).reduce((filter, value) => {
-      const filterValues = (state.appliedFilters.included as any)[value]
-      if (filterValues.list.length > 0) {
-        filter.push(`${value}: ("${filterValues.list.join('" ' + filterValues.operator + ' "')}")`)
-      }
-      return filter
-    }, state.query.json['filter'])
-
-    state.query.json['filter'] = Object.keys(state.appliedFilters.excluded).reduce((filter, value) => {
-      const filterValues = (state.appliedFilters.excluded as any)[value]
-      if (filterValues.list.length > 0) {
-        filter.push(`-${value}: ("${filterValues.list.join('" ' + filterValues.operator + ' "')}")`)
-      }
-      return filter
-    }, state.query.json['filter'])
-
-    commit(types.PRODUCT_QUERY_UPDATED, state.query)
-    await dispatch('getProducts')
-  },
-
-  async resetFilters({ commit, state, dispatch }, payload) {
-    const appliedFilters = JSON.parse(JSON.stringify((state.appliedFilters as any)[payload.type]))
-    const value = Object.keys(appliedFilters).reduce((value: any, filter: any) => {
-      value[filter] = {
-        list: [],
-        operator: "OR"
-      }
-      return value
-    }, {})
-    commit(types.PRODUCT_FILTERS_UPDATED, {type: payload.type, value})
-    await dispatch('updateQuery')
-  },
-
-  async clearAllFilters({ commit, state }) {
-    const appliedFilters = JSON.parse(JSON.stringify(state.appliedFilters))
-    const value = Object.keys(appliedFilters).reduce((value: any, type: any) => {
-      const val = Object.keys(appliedFilters[type]).reduce((val: any, filter: any) => {
-        val[filter] = {
-          list: [],
-          operator: 'OR'
-        }
-        return val
-      }, {})
-      value[type] = val
-      return value
-    }, {})
-    commit(types.PRODUCT_ALL_FILTERS_UPDATED, value)
-  },
-
-  async clearFilters({ commit, dispatch }, payload) {
-    commit(types.PRODUCT_FILTER_UPDATED, {id: payload.id, type: payload.type, value: payload.value})
-    await dispatch('updateQuery')
-  },
-  clearProductList({ commit }){
-    commit(types.PRODUCT_LIST_UPDATED, { products: [], totalVirtual: 0, totalVariant: 0 });
-  },
-
-  async updateThreshold({ commit }, value) {
-    commit(types.PRODUCT_THRESHOLD_UPDATED, value)
-  }
-}
-export default actions;
\ No newline at end of file
diff --git a/src/store/modules/product/getters.ts b/src/store/modules/product/getters.ts
deleted file mode 100644
index 86754f8f..00000000
--- a/src/store/modules/product/getters.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import { GetterTree } from "vuex";
-import ProductState from "./ProductState";
-import RootState from "../../RootState";
-
-const getters: GetterTree<ProductState, RootState> = {
-  getSearchProducts(state) {
-    return state.products.list;
-  },
-  isScrollable(state) {
-    return (
-      state.products.list.length > 0 &&
-      state.products.list.length < state.products.total.virtual
-    );
-  },
-  getProducts(state) {
-    return state.products;
-  },
-  getAppliedFilters(state) {
-    return state.appliedFilters;
-  },
-  getQuery(state) {
-    return state.query;
-  },
-  getThreshold(state) {
-    return state.threshold;
-  }
-};
-export default getters;
\ No newline at end of file
diff --git a/src/store/modules/product/index.ts b/src/store/modules/product/index.ts
deleted file mode 100644
index 20146854..00000000
--- a/src/store/modules/product/index.ts
+++ /dev/null
@@ -1,51 +0,0 @@
-import actions from './actions'
-import getters from './getters'
-import mutations from './mutations'
-import { Module } from 'vuex'
-import ProductState from './ProductState'
-import RootState from '../../RootState'
-
-const productModule: Module<ProductState, RootState> = {
-    namespaced: true,
-    state: {
-      products: {
-        list: [],
-        total: {
-          virtual: 0,
-          variant: 0
-        }
-      },
-      appliedFilters: {
-        included: {
-          tags: {
-            list: [],
-            operator: "OR"
-          },
-        },
-        excluded: {
-          tags: {
-            list: [],
-            operator: "OR"
-          },
-        }
-      },
-      query: {
-        "json": {
-          "params": {
-            "group": true,
-            "group.field": "groupId",
-            "group.limit": 10000,
-            "group.ngroups": true
-          } as any,
-          "query": "*:*",
-          "filter": ["docType: PRODUCT"]
-        }
-      },
-      threshold: 0
-    },
-    getters,
-    actions,
-    mutations,
-}
-
-export default productModule;
\ No newline at end of file
diff --git a/src/store/modules/product/mutation-types.ts b/src/store/modules/product/mutation-types.ts
deleted file mode 100644
index 58af0ada..00000000
--- a/src/store/modules/product/mutation-types.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export const SN_PRODUCT = 'product'
-export const PRODUCT_LIST_UPDATED = SN_PRODUCT + '/LIST_UPDATED'
-export const PRODUCT_FILTER_UPDATED = SN_PRODUCT + '/FILTER_UPDATED'
-export const PRODUCT_QUERY_UPDATED = SN_PRODUCT + '/QUERY_UPDATED'
-export const PRODUCT_FILTERS_UPDATED = SN_PRODUCT + '/FILTERS_UPDATED'
-export const PRODUCT_ALL_FILTERS_UPDATED = SN_PRODUCT + '/ALL_FILTERS_UPDATED'
-export const PRODUCT_THRESHOLD_UPDATED = SN_PRODUCT + '/THRESHOLD_UPDATED'
diff --git a/src/store/modules/product/mutations.ts b/src/store/modules/product/mutations.ts
deleted file mode 100644
index 3ba78c8a..00000000
--- a/src/store/modules/product/mutations.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { MutationTree } from 'vuex'
-import ProductState from './ProductState'
-import * as types from './mutation-types'
-
-const mutations: MutationTree <ProductState> = {
-  [types.PRODUCT_LIST_UPDATED] (state, payload) {
-    state.products.list = payload.products;
-    state.products.total.variant = payload.totalVariant;
-    state.products.total.virtual = payload.totalVirtual;
-  },
-  [types.PRODUCT_FILTER_UPDATED] (state, payload) {
-    (state.appliedFilters as any)[payload.type][payload.id] = payload.value
-  },
-  [types.PRODUCT_QUERY_UPDATED] (state, payload) {
-    state.query = payload
-  },
-  [types.PRODUCT_FILTERS_UPDATED] (state, payload) {
-    (state.appliedFilters as any)[payload.type] = payload.value
-  },
-  [types.PRODUCT_ALL_FILTERS_UPDATED] (state, payload) {
-    state.appliedFilters = payload
-  },
-  [types.PRODUCT_THRESHOLD_UPDATED] (state, payload) {
-    state.threshold = payload
-  }
-}
-export default mutations;
\ No newline at end of file
diff --git a/src/store/modules/user/UserState.ts b/src/store/modules/user/UserState.ts
index 07feebae..afbd45ce 100644
--- a/src/store/modules/user/UserState.ts
+++ b/src/store/modules/user/UserState.ts
@@ -1,6 +1,4 @@
 export default interface UserState {
-    permissions: any;
-    pwaState: any;
     token: string;
     current: object | null;
     instanceUrl: string;
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index a12e9609..d424752c 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -3,90 +3,44 @@ import { ActionTree } from 'vuex'
 import RootState from '@/store/RootState'
 import UserState from './UserState'
 import * as types from './mutation-types'
-import { hasError, showToast } from '@/utils'
+import { showToast } from '@/utils'
 import { translate } from '@/i18n'
-import { Settings } from 'luxon';
 import logger from "@/logger";
-import {
-  getServerPermissionsFromRules,
-  prepareAppPermissions,
-  resetPermissions,
-  setPermissions
-} from '@/authorization'
-import { logout, updateInstanceUrl, updateToken, resetConfig } from '@/adapter'
-import { useAuthStore } from '@hotwax/dxp-components'
 import emitter from '@/event-bus'
-
-
+import { Settings } from "luxon"
 
 const actions: ActionTree<UserState, RootState> = {
 
   /**
  * Login user and return token
  */
-  async login ({ commit, dispatch }, payload) {
-
+  async login ({ commit }, { username, password }) {
     try {
-      const {token, oms} = payload;
-      dispatch("setUserInstanceUrl", oms);
-
-      // Getting the permissions list from server
-      const permissionId = process.env.VUE_APP_PERMISSION_ID;
-      // Prepare permissions list
-      const serverPermissionsFromRules = getServerPermissionsFromRules();
-      if (permissionId) serverPermissionsFromRules.push(permissionId);
-
-      const serverPermissions = await UserService.getUserPermissions({
-        permissionIds: [...new Set(serverPermissionsFromRules)]
-      }, token);
-      const appPermissions = prepareAppPermissions(serverPermissions);
-
-
-      // Checking if the user has permission to access the app
-      // If there is no configuration, the permission check is not enabled
-      if (permissionId) {
-        // As the token is not yet set in the state passing token headers explicitly
-        // TODO Abstract this out, how token is handled should be part of the method not the callee
-        const hasPermission = appPermissions.some((appPermission: any) => appPermission.action === permissionId );        // If there are any errors or permission check fails do not allow user to login
-        if (!hasPermission) {
-          const permissionError = 'You do not have permission to access the app.';
-          showToast(translate(permissionError));
-          logger.error("error", permissionError);
-          return Promise.reject(new Error(permissionError));
-        }
+      if(!username.length || !password.length) {
+        return Promise.reject('')
       }
 
+      emitter.emit("presentLoader", { message: "Logging in...", backdropDismiss: false })
+      // TODO: implement support for permission check
+      const token = await UserService.login(username, password)
+
       const userProfile = await UserService.getUserProfile(token);
-      userProfile.stores = await UserService.getEComStores(token, userProfile.partyId);
 
-      let preferredStore = userProfile.stores.length ?  userProfile.stores[0] : {};
+      // TODO: fetch only associated product stores for user, currently api does not support this
+      userProfile.stores = await UserService.getEComStores(token);
 
-      const preferredStoreId =  await UserService.getPreferredStore(token);
-      if (preferredStoreId) {
-        const store = userProfile.stores.find((store: any) => store.productStoreId === preferredStoreId);
-        store && (preferredStore = store)
+      if (userProfile.timeZone) {
+        Settings.defaultZone = userProfile.timeZone;
       }
-      // prodCatalogId will be used getting the products instead of productStoreIds as the productStoreIds is tokenized
-      // For STORE, the results will have  X_STORE results as well
-      preferredStore.prodCatalogId = (await UserService.getEcommerceCatalog(token, preferredStore.productStoreId))?.prodCatalogId;
-      /*  ---- Guard clauses ends here --- */
 
-      setPermissions(appPermissions);
-      if (userProfile.userTimeZone) {
-        Settings.defaultZone = userProfile.userTimeZone;
-      }
-      updateToken(token)
-
-      // TODO user single mutation
-      commit(types.USER_INFO_UPDATED, userProfile);
-      commit(types.USER_CURRENT_ECOM_STORE_UPDATED, preferredStore);
-      commit(types.USER_PERMISSIONS_UPDATED, appPermissions);
       commit(types.USER_TOKEN_CHANGED, { newToken: token })
-
+      emitter.emit("dismissLoader")
+      commit(types.USER_INFO_UPDATED, userProfile);
+      commit(types.USER_CURRENT_ECOM_STORE_UPDATED, userProfile.stores.length ? userProfile.stores[0] : {});
+      return Promise.resolve({ token })
     } catch (err: any) {
-      // If any of the API call in try block has status code other than 2xx it will be handled in common catch block.
-      // TODO Check if handling of specific status codes is required.
-      showToast(translate('Something went wrong while login. Please contact administrator'));
+      emitter.emit("dismissLoader")
+      showToast(translate(err));
       logger.error("error", err);
       return Promise.reject(new Error(err))
     }
@@ -95,88 +49,22 @@ const actions: ActionTree<UserState, RootState> = {
   /**
    * Logout user
    */
-  async logout ({ commit }, payload) {
-    // store the url on which we need to redirect the user after logout api completes in case of SSO enabled
-    let redirectionUrl = ''
-
-    emitter.emit('presentLoader', { message: 'Logging out', backdropDismiss: false })
-
-    // Calling the logout api to flag the user as logged out, only when user is authorised
-    // if the user is already unauthorised then not calling the logout api as it returns 401 again that results in a loop, thus there is no need to call logout api if the user is unauthorised
-    if(!payload?.isUserUnauthorised) {
-      let resp;
-
-      // wrapping the parsing logic in try catch as in some case the logout api makes redirection, and then we are unable to parse the resp and thus the logout process halts
-      try {
-        resp = await logout();
-
-        // Added logic to remove the `//` from the resp as in case of get request we are having the extra characters and in case of post we are having 403
-        resp = JSON.parse(resp.startsWith('//') ? resp.replace('//', '') : resp)
-      } catch(err) {
-        logger.error('Error parsing data', err)
-      }
-
-      if(resp?.logoutAuthType == 'SAML2SSO') {
-        redirectionUrl = resp.logoutUrl
-      }
-    }
-
-    const authStore = useAuthStore()
-
+  async logout ({ commit }) {
     // TODO add any other tasks if need
     commit(types.USER_END_SESSION)
-    this.dispatch('product/clearAllFilters')
-    this.dispatch('product/clearProductList');
-    this.dispatch('util/clearFacilitiesByProductStore')
-    this.dispatch('util/clearShopifyConfig')
-    this.dispatch('job/clearJobState');
-    resetPermissions();
-    resetConfig();
-
-    // reset plugin state on logout
-    authStore.$reset()
-
-    // If we get any url in logout api resp then we will redirect the user to the url
-    if(redirectionUrl) {
-      window.location.href = redirectionUrl
-    }
-
-    emitter.emit('dismissLoader')
-    return redirectionUrl;
-  },
-
-  /**
-   * update current eComStore information
-   */
-   async setEcomStore({ commit }, payload) {
-    let productStore = payload.productStore;
-    if(!productStore) {
-      productStore = this.state.user.current.stores.find((store: any) => store.productStoreId === payload.productStoreId);
-    }
-    // prodCatalogId will be used getting the products instead of productStoreIds as the productStoreIds is tokenized
-    // For STORE, the results will have  X_STORE results as well
-    productStore.prodCatalogId = (await UserService.getEcommerceCatalog(undefined, productStore.productStoreId))?.prodCatalogId;
-
-    commit(types.USER_CURRENT_ECOM_STORE_UPDATED, productStore);
-    this.dispatch('product/clearAllFilters')
-    this.dispatch('product/clearProductList');
-    this.dispatch('job/clearJobState');
-    await UserService.setUserPreference({
-      'userPrefTypeId': 'SELECTED_BRAND',
-      'userPrefValue': productStore.productStoreId
-    });
   },
 
+  
   /**
-   * Update user timeZone
-   */
-  async setUserTimeZone ( { state, commit }, payload) {
-    const resp = await UserService.setUserTimeZone(payload)
-    if (resp.status === 200 && !hasError(resp)) {
-      const current: any = state.current;
-      current.userTimeZone = payload.tzId;
+  * Update user timeZone
+  */
+  async setUserTimeZone({ state, commit }, payload) {
+    const current: any = state.current;
+    // TODO: add support to change the user time on server, currently api to update user is not available
+    if(current.timeZone !== payload.tzId) {
+      current.timeZone = payload.tzId;
       commit(types.USER_INFO_UPDATED, current);
-      Settings.defaultZone = current.userTimeZone;
+      Settings.defaultZone = current.timeZone;
       showToast(translate("Time zone updated successfully"));
     }
   },
@@ -184,11 +72,14 @@ const actions: ActionTree<UserState, RootState> = {
   // Set User Instance Url
   setUserInstanceUrl ({ commit }, payload){
     commit(types.USER_INSTANCE_URL_UPDATED, payload)
-    updateInstanceUrl(payload)
   },
 
-  updatePwaState({ commit }, payload) {
-    commit(types.USER_PWA_STATE_UPDATED, payload);
+  setEcomStore({ commit, state }, payload) {
+    let productStore = payload.productStore;
+    if(!productStore) {
+      productStore = (state.current as any).stores.find((store: any) => store.productStoreId === payload.productStoreId);
+    }
+    commit(types.USER_CURRENT_ECOM_STORE_UPDATED, productStore);
   }
 }
 
diff --git a/src/store/modules/user/getters.ts b/src/store/modules/user/getters.ts
index b6c22f67..ce5192c8 100644
--- a/src/store/modules/user/getters.ts
+++ b/src/store/modules/user/getters.ts
@@ -6,7 +6,7 @@ const getters: GetterTree <UserState, RootState> = {
     getBaseUrl (state) {
         let baseURL = process.env.VUE_APP_BASE_URL;
         if (!baseURL) baseURL = state.instanceUrl;
-        return baseURL.startsWith('http') ? baseURL : `https://${baseURL}.hotwax.io/api/`;
+        return baseURL.startsWith('http') ? baseURL : `https://${baseURL}.hotwax.io/rest/s1/order-routing/`;
     },
     isAuthenticated (state) {
         return !!state.token;
@@ -27,11 +27,5 @@ const getters: GetterTree <UserState, RootState> = {
     getCurrentEComStore(state) {
         return state.currentEComStore
     },
-    getUserPermissions (state) {
-        return state.permissions;
-    },
-    getPwaState(state) {
-        return state.pwaState;
-    },
 }
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/user/index.ts b/src/store/modules/user/index.ts
index 3ba85293..1d2cbb56 100644
--- a/src/store/modules/user/index.ts
+++ b/src/store/modules/user/index.ts
@@ -9,14 +9,9 @@ const userModule: Module<UserState, RootState> = {
     namespaced: true,
     state: {
       token: '',
-      permissions: [],
       current: {},
       instanceUrl: '',
-      currentEComStore: {},
-      pwaState: {
-        updateExists: false,
-        registration: null,
-      }
+      currentEComStore: {}
     },
     getters,
     actions,
diff --git a/src/store/modules/user/mutation-types.ts b/src/store/modules/user/mutation-types.ts
index 95162856..e7c812f4 100644
--- a/src/store/modules/user/mutation-types.ts
+++ b/src/store/modules/user/mutation-types.ts
@@ -3,6 +3,4 @@ export const USER_TOKEN_CHANGED = SN_USER + '/TOKEN_CHANGED'
 export const USER_END_SESSION = SN_USER + '/END_SESSION'
 export const USER_INFO_UPDATED = SN_USER + '/INFO_UPDATED'
 export const USER_INSTANCE_URL_UPDATED = SN_USER + '/INSTANCE_URL_UPDATED'
-export const USER_CURRENT_ECOM_STORE_UPDATED = SN_USER + '/CURRENT_ECOM_STORE_UPDATED'
-export const USER_PERMISSIONS_UPDATED = SN_USER + '/PERMISSIONS_UPDATED'
-export const USER_PWA_STATE_UPDATED = SN_USER + '/PWA_STATE_UPDATED'
\ No newline at end of file
+export const USER_CURRENT_ECOM_STORE_UPDATED = SN_USER + '/CURRENT_ECOM_STORE_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/user/mutations.ts b/src/store/modules/user/mutations.ts
index 2fafc6aa..e91a0dee 100644
--- a/src/store/modules/user/mutations.ts
+++ b/src/store/modules/user/mutations.ts
@@ -10,7 +10,6 @@ const mutations: MutationTree <UserState> = {
       state.token = ''
       state.current = {}
       state.currentEComStore = {}
-      state.permissions = []
     },
     [types.USER_INFO_UPDATED] (state, payload) {
         state.current = payload
@@ -18,15 +17,11 @@ const mutations: MutationTree <UserState> = {
     [types.USER_INSTANCE_URL_UPDATED] (state, payload) {
         state.instanceUrl = payload;
     },
+    [types.USER_INFO_UPDATED] (state, payload) {
+        state.current = payload
+    },
     [types.USER_CURRENT_ECOM_STORE_UPDATED] (state, payload) {
         state.currentEComStore = payload;
     },
-    [types.USER_PERMISSIONS_UPDATED] (state, payload) {
-        state.permissions = payload
-    },
-    [types.USER_PWA_STATE_UPDATED](state, payload) {
-        state.pwaState.registration = payload.registration;
-        state.pwaState.updateExists = payload.updateExists;
-    },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
deleted file mode 100644
index bdc6415f..00000000
--- a/src/store/modules/util/UtilState.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export default interface UtilState {
-  statusDesc: any;
-  shopifyConfig: any;
-  facilitiesByProductStore: any;
-  channels: [];
-}
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
deleted file mode 100644
index 04d0b31e..00000000
--- a/src/store/modules/util/actions.ts
+++ /dev/null
@@ -1,120 +0,0 @@
-import { UtilService } from '@/services/UtilService'
-import { ActionTree } from 'vuex'
-import RootState from '@/store/RootState'
-import UtilState from './UtilState'
-import * as types from './mutation-types'
-import { hasError } from '@/utils'
-import logger from "@/logger";
-
-const actions: ActionTree<UtilState, RootState> = {
-  /**
-   * Status Description
-   */
-  async getServiceStatusDesc ({ commit }) {
-    try{
-      const resp = await UtilService.getServiceStatusDesc({
-        "inputFields": {
-          "statusTypeId": "SERVICE_STATUS",
-          "statusTypeId_op": "equals"
-        },
-        "entityName": "StatusItem",
-        "fieldList": ["statusId", "description"],
-        "noConditionFind": "Y",
-        "viewSize": 20
-      }) 
-      if (resp.status === 200 && !hasError(resp) && resp.data.count) {
-        commit(types.UTIL_SERVICE_STATUS_DESC_UPDATED, resp.data.docs);
-      }
-    } catch(err) {
-      logger.error(err)
-    }
-  },
-
-  async getShopifyConfig({ state, commit }, payload) {
-    // TODO: for now passing view size as 1 by considering that one product store id is associated with only
-    // one shopify config
-    const resp = await UtilService.getShopifyConfig({
-      "inputFields": {
-        "productStoreId": payload
-      },
-      "entityName": "ShopifyConfig",
-      "distinct": "Y",
-      "noConditionFind": "Y",
-      "fieldList": ["shopifyConfigId", "productStoreId"],
-      "viewSize": 1
-    })
-
-    if (resp.status === 200 && !hasError(resp) && resp.data?.docs?.length > 0) {
-      const shopifyConfig = resp.data.docs[0]
-
-      const shopifyConfigs = JSON.parse(JSON.stringify(state.shopifyConfig))
-      shopifyConfigs[shopifyConfig.productStoreId] = shopifyConfig.shopifyConfigId
-
-      commit(types.UTIL_SHOPIFY_CONFIG_UPDATED, shopifyConfigs);
-      return shopifyConfig;
-    }
-    return {};
-  },
-
-  async fetchFacilitiesByProductStore({ state, commit }, payload) {
-
-    try {
-      const resp = await UtilService.fetchFacilitiesByProductStore(payload);
-
-      if (resp.status === 200 && !hasError(resp) && resp.data?.count > 0) {
-        const facilities = resp.data.docs.reduce((facilities: any, data: any) => {
-          if(!facilities[data.productStoreId]) {
-            facilities[data.productStoreId] = []
-          }
-
-          facilities[data.productStoreId].push(data.facilityId)
-          return facilities
-        }, {})
-        commit(types.UTIL_PRODUCT_STORE_FACILITY_UPDATED, {
-          ...state.facilitiesByProductStore,
-          ...facilities
-        });
-        return facilities;
-      }
-    } catch (err) {
-      logger.error(err)
-    }
-    return {};
-  },
-  
-  async fetchChannels({ commit }) {
-    let channels = []
-    const params = {
-      entityName: "FacilityGroup",
-      inputFields: {
-        facilityGroupTypeId: 'CHANNEL_FAC_GROUP'
-      },
-      noConditionFind: 'Y',
-      orderBy: "facilityGroupName ASC",
-      fieldList: ["facilityGroupId", "facilityGroupTypeId", "facilityGroupName", "description"],
-      viewSize: 50
-    }
-
-    try {
-      const resp = await UtilService.fetchChannels(params)
-      if (!hasError(resp)) {
-        channels = resp.data.docs
-      } else {
-        throw resp.data
-      }
-    } catch (error) {
-      logger.error(error)
-    }
-    commit(types.UTIL_CHANNELS_UPDATED, channels)
-  },
-
-  async clearFacilitiesByProductStore({ commit }) {
-    commit(types.UTIL_PRODUCT_STORE_FACILITY_UPDATED, {})
-  },
-
-  async clearShopifyConfig({ commit }) {
-    commit(types.UTIL_SHOPIFY_CONFIG_UPDATED, {})
-  }
-}
-
-export default actions;
\ No newline at end of file
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
deleted file mode 100644
index 46ed083d..00000000
--- a/src/store/modules/util/getters.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { GetterTree } from 'vuex'
-import UtilState from './UtilState'
-import RootState from '@/store/RootState'
-
-const getters: GetterTree <UtilState, RootState> = {
-  getStatusDesc: (state) => (statusId: any) => {
-    return state.statusDesc[statusId] ? state.statusDesc[statusId] : "-";
-  },
-  getShopifyConfig(state) {
-    return state.shopifyConfig
-  },
-  getFacilityByProductStore(state) {
-    return state.facilitiesByProductStore
-  },
-  getChannels(state) {
-    return state.channels;
-  }
-}
-export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
deleted file mode 100644
index 0846d1ec..00000000
--- a/src/store/modules/util/index.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import actions from './actions'
-import getters from './getters'
-import mutations from './mutations'
-import { Module } from 'vuex'
-import UtilState from './UtilState'
-import RootState from '@/store/RootState'
-
-const utilModule: Module<UtilState, RootState> = {
-  namespaced: true,
-  state: {
-    statusDesc: {},
-    shopifyConfig: {},
-    facilitiesByProductStore: {},
-    channels: []
-  },
-  getters,
-  actions,
-  mutations,
-}
-
-export default utilModule;
\ No newline at end of file
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
deleted file mode 100644
index a7dc3abd..00000000
--- a/src/store/modules/util/mutation-types.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export const SN_UTIL = 'util'
-export const UTIL_SERVICE_STATUS_DESC_UPDATED = SN_UTIL + '/SERVICE_STATUS_DESC_UPDATED'
-export const UTIL_SHOPIFY_CONFIG_UPDATED = SN_UTIL + '/SHOPIFY_CONFIG_UPDATED'
-export const UTIL_PRODUCT_STORE_FACILITY_UPDATED = SN_UTIL + '/PRODUCT_STORE_FACILITY_UPDATED'
-export const UTIL_CHANNELS_UPDATED = SN_UTIL + '/CHANNELS_UPDATED'
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
deleted file mode 100644
index 0e0ad324..00000000
--- a/src/store/modules/util/mutations.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { MutationTree } from 'vuex'
-import UtilState from './UtilState'
-import * as types from './mutation-types'
-
-const mutations: MutationTree <UtilState> = {
-  [types.UTIL_SERVICE_STATUS_DESC_UPDATED] (state, payload) {
-    payload.map((status: any) => {
-      state.statusDesc[status.statusId] = status.description;
-    })
-  },
-  [types.UTIL_SHOPIFY_CONFIG_UPDATED] (state, payload) {
-    state.shopifyConfig = payload;
-  },
-  [types.UTIL_PRODUCT_STORE_FACILITY_UPDATED] (state, payload) {
-    state.facilitiesByProductStore = payload
-  },
-  [types.UTIL_CHANNELS_UPDATED](state, payload) {
-    state.channels = payload
-  }
-}
-export default mutations;
\ No newline at end of file
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 6e08b98b..7226d8df 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -1,6 +1,4 @@
-import { modalController, toastController } from '@ionic/vue';
-import { DateTime } from "luxon";
-import ErrorMessageModal from "@/components/ErrorMessageModal.vue";
+import { toastController } from '@ionic/vue';
 
 // TODO Use separate files for specific utilities
 
@@ -9,54 +7,14 @@ const hasError = (response: any) => {
     return typeof response.data != "object" || !!response.data._ERROR_MESSAGE_ || !!response.data._ERROR_MESSAGE_LIST_ || !!response.data.error;
 }
 
-const showToast = async (message: string, err?: any) => {
-  const config = {
-    message,
-    duration: 3000,
-    position: 'bottom'
-  } as any
-  if (err) {
-    config.buttons = [
-      {
-        text: 'view',
-        side: 'end',
-        handler: async () => {
-          const errorMessageModal = await modalController.create({
-            component: ErrorMessageModal,
-            componentProps: {
-              errorMessage: err,
-            },
-            initialBreakpoint: 0.08,
-            breakpoints: [0, 0.10, 0.5, 0.75]
-          });
-          return errorMessageModal.present();
-        }
-      }
-    ]
-  }
-  const toast = await toastController.create(config)
+const showToast = async (message: string) => {
+  const toast = await toastController
+    .create({
+      message,
+      duration: 3000,
+      position: "top",
+    })
   return toast.present();
 }
 
-const getFeature = (featureHierarchy: any, featureKey: string) => {
-  let featureValue = ''
-  if (featureHierarchy) {
-    const feature = featureHierarchy.find((featureItem: any) => featureItem.startsWith(featureKey))
-    const featureSplit = feature ? feature.split('/') : [];
-    featureValue = featureSplit[2] ? featureSplit[2] : '';
-  }
-  return featureValue;
-}
-
-const handleDateTimeInput = (dateTimeValue: any) => {
-  // TODO Handle it in a better way
-  // Remove timezone and then convert to timestamp
-  // Current date time picker picks browser timezone and there is no supprt to change it
-  const dateTime = DateTime.fromISO(dateTimeValue, { setZone: true}).toFormat("yyyy-MM-dd'T'HH:mm:ss")
-  return DateTime.fromISO(dateTime).toMillis()
-}
-
-const getResponseError = (resp: any) => {
-  return resp.data.error || resp.data._ERROR_MESSAGE_ || resp.data._ERROR_MESSAGE_LIST_ || resp.data.errorMessage || resp.data.errorMessageList || "";
-}
-export { handleDateTimeInput, showToast, hasError, getFeature, getResponseError }
+export { showToast, hasError }
diff --git a/src/views/Login.vue b/src/views/Login.vue
new file mode 100644
index 00000000..bd3a19ea
--- /dev/null
+++ b/src/views/Login.vue
@@ -0,0 +1,79 @@
+<template>
+  <ion-page>
+    <ion-content>
+      <div class="flex">
+        <form class="login-container" @keyup.enter="login(form)" @submit.prevent>
+          <Logo />
+
+          <ion-item lines="full">
+            <ion-label position="fixed">{{ translate("OMS") }}</ion-label>
+            <ion-input name="instanceUrl" v-model="instanceUrl" id="instanceUrl" type="text" required />
+          </ion-item>
+          <ion-item lines="full">
+            <ion-label position="fixed">{{ translate("Username") }}</ion-label>
+            <ion-input name="username" v-model="username" id="username" type="text" required />
+          </ion-item>
+          <ion-item lines="none">
+            <ion-label position="fixed">{{ translate("Password") }}</ion-label>
+            <ion-input name="password" v-model="password" id="password" type="password" required />
+          </ion-item>
+
+          <div class="ion-padding">
+            <ion-button type="submit" color="primary" fill="outline" expand="block" @click="login(form)">{{ translate("Login") }}</ion-button>
+          </div>
+        </form>
+      </div>
+    </ion-content>
+  </ion-page>
+</template>
+
+<script setup lang="ts">
+import { 
+  IonButton,
+  IonContent,
+  IonInput,
+  IonItem,
+  IonLabel,
+  IonPage
+} from "@ionic/vue";
+import { computed, onMounted, ref } from "vue";
+import { useRouter } from "vue-router";
+import store from "@/store";
+import Logo from "@/components/Logo.vue";
+import { translate } from "@/i18n"
+
+const username = ref("")
+const password = ref("")
+const instanceUrl = ref("")
+const router = useRouter();
+
+const currentInstanceUrlSaved = computed(() => store.getters["user/getInstanceUrl"])
+
+onMounted(() => {
+  instanceUrl.value = currentInstanceUrlSaved.value;
+})
+
+function login() {
+  store.dispatch("user/setUserInstanceUrl", instanceUrl.value.trim())
+  store.dispatch("user/login", { username: username.value.trim(), password: password.value }).then((data: any) => {
+    if (data.token) {
+      username.value = ""
+      password.value = ""
+      router.push("/")
+    }
+  }).catch(err => err)
+}
+</script>
+
+<style scoped>
+.login-container {
+  width: 375px;
+}
+
+.flex {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+}
+</style>
diff --git a/src/views/ScheduleThreshold.vue b/src/views/ScheduleThreshold.vue
deleted file mode 100644
index 9e0edc48..00000000
--- a/src/views/ScheduleThreshold.vue
+++ /dev/null
@@ -1,721 +0,0 @@
-<template>
-  <ion-page>
-    <ion-header :translucent="true">
-      <ion-toolbar>
-        <ion-back-button slot="start" default-href="/select-product"/>
-        <ion-title>{{ $t("Schedule new threshold") }}</ion-title>
-      </ion-toolbar>
-    </ion-header>
-
-    <ion-content>
-      <div>
-        <aside>
-          <ion-list>
-            <ion-list-header>{{ $t("Info") }}</ion-list-header>
-            <ion-item>
-              <ion-icon :icon="shirtOutline" slot="start" />
-              <ion-label>{{ products.total.variant }} {{ $t('SKUs') }}</ion-label>
-            </ion-item>
-            <ion-item>
-              <ion-icon :icon="optionsOutline" slot="start" />
-              <ion-label>{{ threshold }} {{ $t('threshold') }}</ion-label>
-            </ion-item>
-            <ion-item>
-              <ion-label color="medium">{{ $t("Name") }}</ion-label>
-              <ion-input :placeholder="$t('rule name')" v-model="jobName"/>
-            </ion-item>
-
-            <ion-item>
-              <ion-icon slot="start" :icon="timeOutline" />
-              <ion-label>{{ $t("Run time") }}</ion-label>
-              <ion-label @click="() => isOpen = true" slot="end">{{ initialRunTime ? getTime(initialRunTime) : $t('Select run time') }}</ion-label>
-              <ion-modal :is-open="isOpen" @didDismiss="() => isOpen = false">
-                <ion-content force-overscroll="false">
-                  <!-- TODO: check why datetime component is not unmounted after scheduling the job -->
-                  <!-- For now added a key with current time to re-render the component always when coming to the page -->
-                  <ion-datetime
-                    show-default-buttons
-                    hour-cycle="h12"
-                    :key="DateTime.now().toMillis()"
-                    :value="initialRunTime ? getDateTime(initialRunTime) : ''"
-                    @ionChange="updateRunTime($event)"
-                  />
-                </ion-content>
-              </ion-modal>
-            </ion-item>
-            <ion-item-divider v-if="channels.length" color="light">
-              <ion-label>{{ $t('Channels') }}</ion-label>
-            </ion-item-divider>
-            <ion-item v-for="channel in channels" :key="channel.facilityGroupId">
-              <ion-label>{{ channel?.facilityGroupName }}</ion-label>
-              <ion-toggle :checked="isChannelChecked(channel.facilityGroupId)" :disabled="isChannelDisabled(channel.facilityGroupId)" slot="end" @ionChange="updateChannels($event, channel.facilityGroupId)"/>
-            </ion-item>
-          </ion-list>
-        </aside>
-
-        <main>
-          <h2>{{ $t("Threshold pipeline") }}</h2>
-          <ion-reorder-group @ionItemReorder="doReorder($event)" disabled="false">
-            <div v-for="job in jobsForReorder" :key="job.jobId">
-              <ion-card>
-                <ion-card-header>
-                  <ion-card-title>
-                    {{ job.jobId ? job.jobName : jobName }}
-                  </ion-card-title>
-                  <ion-reorder></ion-reorder>
-                </ion-card-header>
-
-                <ion-item>
-                  <ion-label>{{ getEnumDescription(job.systemJobEnumId) ? getEnumDescription(job.systemJobEnumId) : job.systemJobEnumId }}</ion-label>
-                  <ion-icon :icon="checkmarkCircleOutline" color="success" v-if="successJobs.includes(job.jobId)" />
-                  <ion-icon :icon="closeCircleOutline" color="danger" v-if="failedJobs.includes(job.jobId)" />
-                </ion-item>
-
-                <ion-item>
-                  <ion-icon slot="start" :icon="timeOutline" />
-                  <ion-label class="ion-text-wrap">{{ job.runTime ? getTime(job.runTime) : "-"  }}</ion-label>
-                  <ion-badge v-if="job.runTime" color="dark">{{ timeTillJob(job.runTime)}}</ion-badge>
-                </ion-item>
-
-                <ion-item lines="none">
-                  <ion-icon slot="start" :icon="timerOutline" />
-                  <ion-label class="ion-text-wrap">{{ job.tempExprId && temporalExpr(job.tempExprId)?.description ? temporalExpr(job.tempExprId)?.description : "🙃"  }}</ion-label>
-                </ion-item>
-              </ion-card>
-            </div>
-          </ion-reorder-group>
-        </main>
-      </div>
-
-      <div class="action desktop-only">
-        <!-- disabling button as once user have clicked schedule job and some jobs have failed then clicking the button again will re-run the whole process -->
-        <ion-button @click="saveThresholdRule()" :disabled="failedJobs.length || isServiceScheduling">
-          <ion-icon slot="start" :icon="saveOutline" />
-          {{ $t("Schedule Job") }}
-        </ion-button>
-      </div>
-
-      <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="mobile-only">
-        <ion-fab-button @click="saveThresholdRule()" :disabled="failedJobs.length || isServiceScheduling">
-          <ion-icon :icon="arrowForwardOutline" />
-        </ion-fab-button>
-      </ion-fab>
-    </ion-content>
-  </ion-page>
-</template>
-
-<script lang="ts">
-import { arrowForwardOutline, checkmarkCircleOutline, closeCircleOutline, copyOutline, optionsOutline, saveOutline, shirtOutline, timerOutline, timeOutline } from 'ionicons/icons'
-import {
-  IonBackButton,
-  IonBadge,
-  IonButton,
-  IonCard,
-  IonCardHeader,
-  IonCardTitle,
-  IonContent,
-  IonDatetime,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonInput,
-  IonItem,
-  IonItemDivider,
-  IonLabel,
-  IonList,
-  IonListHeader,
-  IonModal,
-  IonPage,
-  IonReorder,
-  IonReorderGroup,
-  IonTitle,
-  IonToggle,
-  IonToolbar
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { getResponseError, handleDateTimeInput, hasError, showToast } from '@/utils';
-import { translate } from '@/i18n';
-import { JobService } from '@/services/JobService';
-import { DateTime } from 'luxon';
-import { mapGetters, useStore } from 'vuex';
-import { ProductService } from '@/services/ProductService';
-import { useRouter } from 'vue-router';
-import logger from '@/logger';
-import emitter from '@/event-bus';
-
-export default defineComponent({
-  name: 'SelectProduct',
-  components: {
-    IonBackButton,
-    IonBadge,
-    IonButton,
-    IonCard,
-    IonCardHeader,
-    IonCardTitle,
-    IonContent,
-    IonDatetime,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonInput,
-    IonItem,
-    IonItemDivider,
-    IonLabel,
-    IonList,
-    IonListHeader,
-    IonModal,
-    IonPage,
-    IonReorder,
-    IonReorderGroup,
-    IonTitle,
-    IonToggle,
-    IonToolbar
-  },
-  data() {
-    return {
-      jobName: '',
-      jobEnumId: 'JOB_EXP_PROD_THRSHLD',
-      isServiceScheduling: false,
-      jobsForReorder: [] as any,
-      initialJobsOrder: [] as any,
-      initialRunTime: '',
-      updatedJobsOrder: [] as any,
-      failedJobs: [] as any,
-      successJobs: [] as any,
-      job: {} as any,
-      isOpen: false,
-      selectedChannels: [] as any
-    }
-  },
-  computed: {
-    ...mapGetters({
-      currentEComStore: 'user/getCurrentEComStore',
-      shopifyConfig: 'util/getShopifyConfig',
-      channels: 'util/getChannels',
-      facilitiesByProductStore: 'util/getFacilityByProductStore',
-      query: 'product/getQuery',
-      temporalExpr: 'job/getTemporalExpr',
-      getEnumDescription: 'job/getEnumDescription',
-      userProfile: 'user/getUserProfile',
-      threshold: 'product/getThreshold',
-      products: 'product/getProducts',
-    })
-  },
-  methods: {
-    // method to update the run time for all the jobs, for now hardcoded the time diff of 15 mins.
-    updateRunTime(ev: CustomEvent, timeDiff = 900000) {
-      const currTime = DateTime.now().toMillis();
-      const setTime = handleDateTimeInput(ev['detail'].value);
-      let changedDateTime: any;
-
-      if(setTime > currTime) {
-        changedDateTime = setTime;
-      } else {
-        showToast(translate("Provide a future date and time"))
-      }
-
-      const previousSeq = JSON.parse(JSON.stringify(this.jobsForReorder))
-
-      // added this condition to handle the case of method called twice
-      if (changedDateTime === previousSeq[0].runTime) return;
-
-      // assigning the selected time to the first job and then updating the runTime by timediff for
-      // each next jobs
-      let threshold = 0;
-      this.jobsForReorder.map((job: any) => {
-        job.runTime = changedDateTime + threshold;
-        threshold += timeDiff
-      })
-      const updatedSeq = JSON.parse(JSON.stringify(this.jobsForReorder))
-      this.initialRunTime = this.jobsForReorder.find((job: any) => job.statusId !== 'SERVICE_DRAFT').runTime
-
-      // return the jobs that have a difference from the original sequence
-      let diffSeq = this.findJobDiff(previousSeq, updatedSeq)
-
-      const updatedRunTime = updatedSeq.map((job: any) => job.runTime)
-      Object.keys(diffSeq).map((key: any) => {
-        diffSeq[key].runTime = updatedRunTime[key]
-      })
-
-      diffSeq = Object.keys(diffSeq).map((key) => diffSeq[key])
-
-      // assigned the diffSeq to the updatedJobsOrder and initialJobsOrder as the updatedJobsOrder will
-      // be used to determine which jobs to update and initialJobsOrder will be used when reordering the
-      // jobs
-      this.updatedJobsOrder = this.initialJobsOrder = diffSeq
-    },
-    findJobDiff(previousSeq: any, updatedSeq: any) {
-      const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
-        if (updatedSeq[key].jobId === previousSeq[key].jobId && updatedSeq[key].runTime === previousSeq[key].runTime) return diff
-        return {
-          ...diff,
-          [key]: updatedSeq[key]
-        }
-      }, {})
-      return diffSeq;
-    },
-    doReorder(event: CustomEvent) {
-      const previousSeq = JSON.parse(JSON.stringify(this.initialJobsOrder))
-
-      // returns the updated sequence after reordering
-      const updatedSeq = event.detail.complete(JSON.parse(JSON.stringify(this.jobsForReorder)));
-
-      let diffSeq = this.findJobDiff(previousSeq, updatedSeq)
-
-      const updatedRunTime = previousSeq.map((job: any) => job.runTime)
-      Object.keys(diffSeq).map((key: any) => {
-        diffSeq[key].runTime = updatedRunTime[key]
-      })
-
-      diffSeq = Object.keys(diffSeq).map((key) => diffSeq[key])
-
-      this.jobsForReorder = updatedSeq
-      this.updatedJobsOrder = diffSeq
-    },
-    getDate (runTime: any) {
-      return DateTime.fromMillis(runTime).toLocaleString(DateTime.DATE_MED);
-    },
-    getTime (runTime: any) {
-      return DateTime.fromMillis(runTime).toLocaleString(DateTime.TIME_SIMPLE);
-    },
-    getDateTime(time: any) {
-      return DateTime.fromMillis(time)
-    },
-    timeTillJob (time: any) {
-      const timeDiff = DateTime.fromMillis(time).diff(DateTime.local());
-      return DateTime.local().plus(timeDiff).toRelative();
-    },
-    async saveThresholdRule() {
-      emitter.emit('presentLoader');
-
-      this.isServiceScheduling = true;
-      this.failedJobs = []
-      this.successJobs = []
-      const solrQuery = this.query
-
-      const jobRunTime = this.jobsForReorder.find((job: any) => !job.jobId)?.runTime
-
-      let diffSeq = this.findJobDiff(this.initialJobsOrder, this.jobsForReorder)
-      this.updatedJobsOrder = Object.keys(diffSeq).map((key) => diffSeq[key])
-
-      // filtered jobs by removing the new job as we need to update already existing job
-      const jobsToUpdate = this.updatedJobsOrder.filter((job: any) => job.jobId)
-
-      // re-initialized params object from query as there is no need for grouping or pagination when storing the query
-      solrQuery.json.params = {
-        "q.op": "AND"
-      }
-      // made the query to default (*:*) before storing, as the threshold will be set for all the products those
-      // are fullfilling the filters condition
-      solrQuery.json['query'] = "*:*"
-
-      try {
-        const resp = await ProductService.createSearchPreference({
-          searchPrefValue: JSON.stringify(solrQuery)
-        });
-
-        if (resp.status == 200 && resp?.data?.searchPrefId) {
-          const searchPreferenceId = resp.data.searchPrefId;
-          const params = {
-            "searchPrefId": searchPreferenceId,
-            "userSearchPrefTypeId": "THRESHOLD_INV_QUERY"
-          }
-          // TODO: Handle the case whether we will schedule service if searchPrefId is not associated with user.
-          await ProductService.associateSearchPrefToUser(params);
-          await this.scheduleService(searchPreferenceId, this.threshold, jobRunTime)
-
-          // checking whether the service has been scheduled successfully, if yes then only updating other jobs otherwise not
-          if (this.successJobs.includes('')) {
-
-            await Promise.allSettled(jobsToUpdate.map(async (job: any) => {
-              // using resp and checking it, as we need jobId that will not be available in case
-              // of promise is rejected
-              try {
-
-                const payload = {
-                  'jobId': job.jobId,
-                  'systemJobEnumId': job.systemJobEnumId,
-                  'tempExprId': job.frequency ? job.frequency : job.jobStatus,
-                  'statusId': "SERVICE_PENDING"
-                } as any
-
-                job?.runTime && (payload['runTime'] = job.runTime)
-                job?.sinceId && (payload['sinceId'] = job.sinceId)
-                job?.jobName && (payload['jobName'] = job.jobName)
-
-                const resp = await JobService.updateJob(payload)
-                if(resp.status == 200 && !hasError(resp) && resp.data.successMessage) {
-                  // if the job succeded when updating then adding the jobId to the successJobs array
-                  this.successJobs.push(job.jobId)
-                } else {
-                  // if the job failed when updating then adding the jobId to the failedJobs array
-                  this.failedJobs.push(job.jobId)
-                  showToast(translate('Failed to update some jobs'))
-                  logger.error('Failed to update some jobs')
-                }
-              } catch(err) {
-                this.failedJobs.push(job.jobId)
-                showToast(translate('Failed to update some jobs'))
-                logger.error(err)
-              }
-            }))
-          } else {
-            logger.error('Failed to schedule service, hence other jobs are not updated')
-            this.failedJobs = this.updatedJobsOrder.map((job: any) => job.jobId)
-            showToast(translate('Failed to schedule service, hence other jobs are not updated'))
-          }
-        } else {
-          showToast(translate('Failed to schedule service, hence other jobs are not updated'))
-          logger.error('Failed to schedule service as search preference is not created, hence other jobs are not updated')
-          this.failedJobs = this.updatedJobsOrder.map((job: any) => job.jobId)
-          this.failedJobs.push('')
-        }
-      } catch (err) {
-        logger.error(err)
-        showToast(translate('Something went wrong'))
-        this.failedJobs = this.updatedJobsOrder.map((job: any) => job.jobId)
-        this.failedJobs.push('')
-      }
-      this.isServiceScheduling = false
-      emitter.emit('dismissLoader');
-
-      // If there are no failed jobs then redirecting the user to the select product page
-      if (!this.failedJobs.length) {
-        this.store.dispatch('product/clearAllFilters')
-        this.router.push('/select-product')
-      } else {
-        logger.error('Some jobs have failed while updating/scheduling')
-      }
-    },
-    async scheduleService(searchPreferenceId: string, threshold: string, runTime: string) {
-      const productStoreId = this.currentEComStore.productStoreId
-      let shopifyConfigId = this.shopifyConfig[productStoreId]
-      let facilityId = this.facilitiesByProductStore[productStoreId]
-
-      // Used Guard Clause
-      if (!Object.keys(this.job).length) {
-        // adding new job in failed status if the draft job data is not available
-        this.failedJobs.push('')
-        showToast(translate('Configuration missing'))
-        return;
-      }
-
-      if(!shopifyConfigId) {
-        const shopifyConfig = await this.store.dispatch('util/getShopifyConfig', productStoreId)
-        shopifyConfigId = shopifyConfig.shopifyConfigId
-      }
-
-      if (!facilityId) {
-        const resp = await this.store.dispatch('util/fetchFacilitiesByProductStore', {
-          inputFields: {
-            productStoreId,
-            facilityTypeId: 'CONFIGURATION',
-            facilityGroupId: this.selectedChannels,
-            facilityGroupId_op: 'in'
-          },
-          entityName: 'ProductStoreFacilityDetail',
-          fieldList: ['facilityId', 'productStoreId'],
-          distinct: 'Y',
-          noConditionFind: 'Y',
-          filterByDate: 'Y',
-          viewSize: 10
-        })
-        facilityId = resp[productStoreId]
-      }
-
-      if (!facilityId.length) {
-        // adding new job in failed status if the facilityId is not available
-        this.failedJobs.push('')
-        showToast(translate('Configuration missing'))
-        return;
-      }
-
-      const payload = this.job ? {
-        'JOB_NAME': this.jobName ? this.jobName : this.userProfile.partyName,
-        'SERVICE_NAME': this.job.serviceName,
-        'SERVICE_COUNT': '0',
-        'jobFields': {
-          'productStoreId': productStoreId,
-          'systemJobEnumId': this.job.systemJobEnumId,
-          'maxRecurrenceCount': '-1',
-          'parentJobId': this.job.parentJobId,
-          'recurrenceTimeZone': this.userProfile?.userTimeZone
-        },
-        'shopifyConfigId': shopifyConfigId,
-        'statusId': "SERVICE_PENDING",
-        'systemJobEnumId': this.job.systemJobEnumId,
-        'includeAll': true, // true: includes all the product, false: includes only products updated in the last 24 hours
-        searchPreferenceId,
-        threshold,
-        facilityId
-      } as any : {}
-
-      // checking if the runtimeData has productStoreId, and if present then adding it on root level
-      this.job?.runtimeData?.productStoreId?.length >= 0 && (payload['productStoreId'] = productStoreId)
-      this.job?.priority && (payload['SERVICE_PRIORITY'] = this.job.priority.toString())
-
-      try {
-        const scheduleJobRequests = [];
-        // Job will be scheduled for single run where include all will be true
-        // This will apply threshold on exisiting products
-        // Deep cloning payload so that both the schedules do not share same reference
-        scheduleJobRequests.push(JobService.scheduleJob(JSON.parse(JSON.stringify({ ...this.job.runtimeData, ...payload }))).catch(error => { return error }))
-        payload['SERVICE_TEMP_EXPR'] = 'EVERYDAY';
-        payload['jobFields'].tempExprId = 'EVERYDAY'; // Need to remove this as we are passing frequency in SERVICE_TEMP_EXPR, currently kept it for backward compatibility
-        payload['SERVICE_RUN_AS_SYSTEM'] = 'Y';
-        payload['jobFields'].runAsUser = 'system';// default system, but empty in run now. TODO Need to remove this as we are using SERVICE_RUN_AS_SYSTEM, currently kept it for backward compatibility
-        payload['includeAll'] =  false;
-        payload['SERVICE_TIME'] = runTime.toString()
-
-        // Scheduling Job that will run everyday and as system
-        scheduleJobRequests.push(JobService.scheduleJob({ ...this.job.runtimeData, ...payload }).catch(error => { return error }))
-        let scheduleJobResponse = await Promise.all(scheduleJobRequests);
-        let ifScheduleJobSuccess = scheduleJobResponse.every((response: any) => {
-          return response.status == 200 && !hasError(response);
-        })
-        if (ifScheduleJobSuccess) {
-          showToast(translate('Service has been scheduled'))
-          this.successJobs.push('')
-        } else {
-          let errorMessage = scheduleJobResponse.reduce((errorMessage: string, response: any) => {
-            return errorMessage += getResponseError(response);
-          }, "")
-          logger.error(errorMessage)
-          this.failedJobs.push('')
-        }
-      } catch (err) {
-        this.failedJobs.push('')
-        this.$log.error(err);
-      }
-    },
-    async fetchExportThresholdJobs() {
-      // added loader as fetching jobs information may take some time
-      emitter.emit('presentLoader');
-
-      const payload = {
-        "inputFields": {
-          "statusId": "SERVICE_DRAFT",
-          "statusId_op": "equals",
-          "systemJobEnumId": "JOB_EXP_PROD_THRSHLD",
-          "systemJobEnumId_op": "equals"
-        },
-        "fieldList": [ "systemJobEnumId", "runTime", "tempExprId", "parentJobId", "serviceName", "jobId", "jobName", "currentRetryCount", "statusId", "runtimeDataId", "productStoreId", "priority"],
-        "noConditionFind": "Y",
-        "viewSize": 1,
-        "orderBy": "runTime ASC"
-      }
-
-      // making separate api calls for draft and pending jobs information and not using promise.all
-      // as the api calls are not dependent on each other and also we don't need to take any decision based on success
-      // of these api calls together
-      try {
-        let exportProductThresholdRequests = [];
-
-        exportProductThresholdRequests.push(JobService.fetchJobInformation(JSON.parse(JSON.stringify(payload)), true).catch(error => { return error }))
-
-        exportProductThresholdRequests.push(JobService.fetchJobInformation({
-          ...payload,
-          "inputFields": {
-            "statusId": "SERVICE_PENDING",
-            "statusId_op": "equals",
-            "productStoreId": this.currentEComStore.productStoreId,
-            "productStoreId_op": "equals",
-            "systemJobEnumId": "JOB_EXP_PROD_THRSHLD",
-            "systemJobEnumId_op": "equals"
-          },
-          viewSize: 50
-        }).catch(error => { return error }))
-
-        let exportProductThresholdResponses = await Promise.allSettled(exportProductThresholdRequests);
-
-        // using specific index as the promise will return the result in the same order as request
-        let draftExportProductThresholdResponse = exportProductThresholdResponses[0]
-        let pendingExportProductThresholdResponse = exportProductThresholdResponses[1]
-
-        if (draftExportProductThresholdResponse.status === 'fulfilled' && !hasError(draftExportProductThresholdResponse.value) && draftExportProductThresholdResponse.value.data.count) {
-          let job = draftExportProductThresholdResponse.value.data.docs[0] // using 0th index as we will only have a single draft data for a job
-
-          this.job = {
-            ...job,
-            id: job.jobId,
-            frequency: job.tempExprId,
-            enumId: job.systemJobEnumId,
-            status: job.statusId
-          }
-        } else {
-          logger.error('Failed to fetch export product threshold draft job information')
-        }
-
-        if (pendingExportProductThresholdResponse.status === 'fulfilled' && !hasError(pendingExportProductThresholdResponse.value) && pendingExportProductThresholdResponse.value.data.count) {
-          let jobs = pendingExportProductThresholdResponse.value.data.docs // using 0th index as we will only have a single draft data for a job
-
-          // storing the pending jobs in reorder array as those jobs will always available for reordering
-          this.jobsForReorder = jobs.map((job: any) => ({
-            ...job,
-            id: job.jobId,
-            frequency: job.tempExprId,
-            enumId: job.systemJobEnumId,
-            status: job.statusId
-          }))
-        } else {
-          logger.error('Failed to fetch export product threshold pending jobs information')
-        }
-
-        const exportProductThresholdJobs = [...this.jobsForReorder, ...[this.job]]
-        const tempExpr = exportProductThresholdJobs.map((job: any) => job.tempExprId)
-
-        await this.store.dispatch('job/fetchJobDescription', [this.jobEnumId]);
-        await this.store.dispatch('job/fetchTemporalExpression', tempExpr)
-      } catch(err) {
-        logger.error('Failed to fetch product threshold jobs information')
-      }
-
-      emitter.emit('dismissLoader');
-    },
-    updateChannels(event: CustomEvent, facilityGroupId: string) {
-      if (event.detail.checked && this.selectedChannels?.some((channel: any) => channel === facilityGroupId)) {
-        return;
-      }
-
-      if (this.selectedChannels?.some((channel:any) => channel === facilityGroupId)) {
-        this.selectedChannels.splice(this.selectedChannels?.indexOf(facilityGroupId), 1);
-      } else {
-        this.selectedChannels.push(facilityGroupId);
-      }
-    },
-    isChannelChecked(facilityGroupId: string) {
-      return this.selectedChannels?.some((channel: any) => channel === facilityGroupId)
-    },
-    isChannelDisabled(facilityGroupId: string) {
-      return this.selectedChannels?.length == 1 && this.selectedChannels?.some((channel: any) => channel === facilityGroupId)
-    }
-  },
-  async ionViewWillEnter() {
-    // TODO: check if we can handle this in a more better way
-    // added this check as on refresh on schedule page the product filters gets reset and all the filters are cleared in the query
-    // so redirecting the user to select-product page in this case
-    // if a user is coming to the schedule page from product page then always the length of filter will be more than 2
-    if(this.query.json.filter.length < 2) {
-      showToast(translate('No rules found, redirecting to product page'))
-      this.store.dispatch('product/clearAllFilters')
-      this.router.push('/select-product')
-      return;
-    }
-
-    await this.fetchExportThresholdJobs();
-
-    // Finding the runTime of the first job or if there are no pending jobs then assigning current time
-    // to initialRunTime and similarly finding last run time to assign a time to the new job
-    this.initialRunTime = this.jobsForReorder[0]?.runTime || DateTime.now().toMillis()
-    let lastRunTime = this.jobsForReorder[this.jobsForReorder.length - 1]?.runTime || DateTime.now().toMillis()
-    const newJob = {
-      'jobName': (this as any).jobName,
-      'systemJobEnumId': 'JOB_EXP_PROD_THRSHLD',
-      'tempExprId': 'EVERYDAY',
-      'statusId': 'SERVICE_PENDING',
-      'runTime': this.jobsForReorder.length ? lastRunTime + 900000 : this.initialRunTime,
-      'jobId': '' // adding jobId as to identify the new job to be scheduled
-    }
-
-    this.jobsForReorder?.push(newJob)
-
-    // dispatching temp expr action to fetch the description for EVERYDAY as if in some case we don't get
-    // the desc for temp expr and thus have an empty field
-    await this.store.dispatch('job/fetchTemporalExpression', ['EVERYDAY'])
-
-    // maintaining the initial order of jobs to take the diff from the updated seq after reordering
-    this.initialJobsOrder = JSON.parse(JSON.stringify(this.jobsForReorder))
-    this.updatedJobsOrder = [ newJob ]
-    
-    //fetch channels and preselect all
-    await this.store.dispatch('util/fetchChannels')
-    this.selectedChannels = this.channels.map((channel: any) => channel.facilityGroupId)
-  },
-  ionViewDidLeave() {
-    // TODO: remove this initialization from the hook and update the code accordingly
-    // Done this as currently the component is not being unmounted when changing the route as there exist
-    // a connection between parent and child and ionViewWillEnter hook does not reinitialize the
-    // local data property
-    this.jobName = ''
-    this.jobsForReorder = []
-    this.initialJobsOrder = []
-    this.initialRunTime = ''
-    this.updatedJobsOrder = []
-    this.failedJobs = []
-    this.successJobs = []
-    this.isServiceScheduling = false
-    this.isOpen = false
-  },
-  setup() {
-    const store = useStore();
-    const router = useRouter();
-
-    return {
-      DateTime,
-      arrowForwardOutline,
-      checkmarkCircleOutline,
-      closeCircleOutline,
-      copyOutline,
-      optionsOutline,
-      router,
-      saveOutline,
-      shirtOutline,
-      store,
-      timerOutline,
-      timeOutline
-    }
-  }
-});
-</script>
-
-<style scoped>
-ion-card-header {
-  display: flex;
-  justify-content: space-between;
-}
-
-h2 {
-  font-size: 18px;
-  margin-left: 10px;
-}
-@media (min-width: 991px) {
-  ion-content > div:first-child {
-    display: grid;
-    grid-template-columns: 600px 50ch;
-    gap: var(--spacer-xl);
-    width: max-content;
-    margin: auto;
-  }
-
-  h2 {
-    font-size: revert;
-    text-align: center;
-  }
-
-  aside {
-    position: sticky;
-    top: var(--spacer-sm);
-    height: max-content;
-  }
-
-  .action {
-    position: fixed;
-    z-index: 3;
-    bottom: 10%;
-    left: 50%;
-    transform: translate(-50%, 0);
-  }
-}
-
-ion-label:nth-child(3) {
-  cursor: pointer;
-}
-
-ion-modal {
-  --width: 290px;
-  --height: 440px;
-  --border-radius: 8px;
-}
-</style>
\ No newline at end of file
diff --git a/src/views/SelectFacility.vue b/src/views/SelectFacility.vue
deleted file mode 100644
index 664f83bd..00000000
--- a/src/views/SelectFacility.vue
+++ /dev/null
@@ -1,225 +0,0 @@
-<template>
-  <ion-page>
-    <ion-header :translucent="true">
-      <ion-toolbar>
-        <ion-back-button default-href="/" slot="start" />
-        <ion-title>{{ $t("Select facility") }}</ion-title>
-        <ion-buttons slot="end">
-          <ion-button fill="clear" class="mobile-only">
-            <ion-icon :icon="downloadOutline" />
-          </ion-button>
-          <ion-button fill="clear" class="mobile-only">
-            <ion-icon :icon="filterOutline" />
-          </ion-button>
-          <ion-button class="desktop-only" @click="() => router.push('/select-facility-csv-upload')">{{ $t("Upload CSV") }}</ion-button>
-        </ion-buttons>
-      </ion-toolbar>
-    </ion-header>
-
-    <ion-content>
-      <div class="find">
-        <section class="search">
-          <ion-searchbar :placeholder="$t('Search orders')" />
-        </section>
-
-        <aside class="filters desktop-only">
-          <ion-list>
-            <ion-list-header>{{ $t("Filter stores") }}</ion-list-header>
-            <ion-item>
-              <ion-label>{{ $t("State") }}</ion-label>
-              <ion-select value="all">
-                <ion-select-option value="all">All</ion-select-option>
-              </ion-select>
-            </ion-item>
-            <ion-item>
-              <ion-label>{{ $t("Type") }}</ion-label>
-              <ion-select value="any">
-                <ion-select-option value="any">Any</ion-select-option>
-              </ion-select>
-            </ion-item>
-          </ion-list>
-
-          <ion-list>
-            <ion-list-header>{{ $t("Selected products") }}</ion-list-header>
-            <ion-item-divider>
-              Parent
-              <ion-checkbox slot="end"/>
-            </ion-item-divider>
-            <ion-item>
-              <ion-label>Variant name</ion-label>
-              <ion-checkbox slot="end" />
-            </ion-item>
-            <ion-item>
-              <ion-label>Variant name</ion-label>
-              <ion-checkbox slot="end" />
-            </ion-item>
-            <ion-item>
-              <ion-label>Variant name</ion-label>
-              <ion-checkbox slot="end" />
-            </ion-item>
-          </ion-list>
-        </aside>
-
-        <main class="main">
-          <section class="sort"></section>
-
-          <section class="section-header"></section>
-
-          <ion-item lines="none">
-            <ion-label>{{ $t("Stores") }}</ion-label>
-          </ion-item>
-
-          <section class="section-grid">
-            <ion-card>
-              <ion-item-divider>
-                Store Group
-                <ion-checkbox slot="end"/>
-              </ion-item-divider>
-              <ion-item>
-                <ion-label>Store name</ion-label>
-                <ion-checkbox slot="end" />
-              </ion-item>
-              <ion-item>
-                <ion-label>Store name</ion-label>
-                <ion-checkbox slot="end" />
-              </ion-item>
-              <ion-item>
-                <ion-label>Store name</ion-label>
-                <ion-checkbox slot="end" />
-              </ion-item>
-            </ion-card>
-            <ion-card>
-              <ion-item-divider>
-                Store Group
-                <ion-checkbox slot="end"/>
-              </ion-item-divider>
-              <ion-item>
-                <ion-label>Store name</ion-label>
-                <ion-checkbox slot="end" />
-              </ion-item>
-              <ion-item>
-                <ion-label>Store name</ion-label>
-                <ion-checkbox slot="end" />
-              </ion-item>
-              <ion-item>
-                <ion-label>Store name</ion-label>
-                <ion-checkbox slot="end" />
-              </ion-item>
-            </ion-card>
-          </section>
-        </main>
-      </div>
-
-      <div class="action desktop-only">
-        <ion-button @click="setSafetyStock()">
-          {{ $t("Set safety stock") }}
-          <ion-icon slot="end" :icon="checkmarkDoneOutline" />
-        </ion-button>
-      </div>
-
-      <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="mobile-only">
-        <ion-fab-button @click="setSafetyStock()">
-          <ion-icon :icon="checkmarkDoneOutline" />
-        </ion-fab-button>
-      </ion-fab>
-    </ion-content>
-  </ion-page>
-</template>
-
-<script lang="ts">
-import {
-  IonBackButton,
-  IonButton,
-  IonButtons,
-  IonCard,
-  IonContent,
-  IonCheckbox,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonItemDivider,
-  IonLabel,
-  IonList,
-  IonListHeader,
-  IonPage,
-  IonSearchbar,
-  IonSelect,
-  IonSelectOption,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from "@ionic/vue";
-import { defineComponent } from "vue";
-import {
-  checkmarkDoneOutline,
-  downloadOutline,
-  filterOutline
-} from "ionicons/icons";
-import { useRouter } from "vue-router";
-import SafetyStockModal from "@/components/SafetyStockModal.vue";
-
-export default defineComponent({
-  name: "SelectFacility",
-  components: {
-    IonBackButton,
-    IonButton,
-    IonButtons,
-    IonCard,
-    IonContent,
-    IonCheckbox,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonItem,
-    IonItemDivider,
-    IonLabel,
-    IonList,
-    IonListHeader,
-    IonPage,
-    IonSearchbar,
-    IonSelect,
-    IonSelectOption,
-    IonTitle,
-    IonToolbar
-  },
-  methods: {
-    async setSafetyStock() {
-      const safetystockmodal = await modalController.create({
-        component: SafetyStockModal,
-      });
-      return safetystockmodal.present();
-    },
-  },
-  setup() {
-    const router = useRouter();
-    return {
-      checkmarkDoneOutline,
-      downloadOutline,
-      filterOutline,
-      router
-    };
-  },
-});
-</script>
-
-<style scoped>
-.filters {
-  border-right: 1px solid var(--ion-color-medium);
-}
-
-ion-item-divider > ion-checkbox {
-   margin-inline-end: 16px;
-}
-
-@media (min-width: 991px) {
-  .action {
-    position: absolute;
-    bottom: 25%;
-    left: 50%;
-    transform: translate(-50%, 0);
-  }
-}
-</style>
diff --git a/src/views/SelectFacilityCSVUpload.vue b/src/views/SelectFacilityCSVUpload.vue
deleted file mode 100644
index ffdd5e5d..00000000
--- a/src/views/SelectFacilityCSVUpload.vue
+++ /dev/null
@@ -1,100 +0,0 @@
-<template>
-  <ion-page>
-    <ion-header :translucent="true">
-      <ion-toolbar>
-        <ion-back-button slot="start" default-href="/" />
-        <ion-title>{{ $t("Upload CSV") }}</ion-title>
-      </ion-toolbar>
-    </ion-header>
-
-    <ion-content>
-      <div class="upload-csv">
-        <ion-item>
-          <ion-label>{{ $t("Store list") }}</ion-label>
-          <ion-input :placeholder="$t('Select CSV')" />
-          <ion-button fill="outline">{{ $t("Upload") }}</ion-button>
-        </ion-item>
-
-        <ion-item lines="none">
-          <ion-label class="ion-text-wrap">{{ $t("Select the column index for the following information in the uploaded CSV") }}</ion-label>
-        </ion-item>
-        <ion-item>
-          <ion-label>{{ $t("Store ID column") }}</ion-label>
-          <ion-select :placeholder="$t('Select')">
-            <ion-select-option>1234</ion-select-option>
-            <ion-select-option>5678</ion-select-option>
-            <ion-select-option>9012</ion-select-option>
-          </ion-select>
-        </ion-item>
-         <ion-item lines="none">
-          <ion-label>{{ $t("Store group column (optional)") }}</ion-label>
-          <ion-select :placeholder="$t('Select')">
-            <ion-select-option>1234</ion-select-option>
-            <ion-select-option>5678</ion-select-option>
-            <ion-select-option>9012</ion-select-option>
-          </ion-select>
-        </ion-item>
-
-        <ion-button expand="block" size="large" color="medium">{{ $t("Save") }}</ion-button>
-
-        <ion-item>
-          <ion-label>50 {{ $t("stores selected") }}</ion-label>
-          <ion-button slot="end" fill="outline" color="dark">
-            <ion-icon slot="start" :icon="downloadOutline" />
-            {{ $t("Download") }}
-          </ion-button>
-        </ion-item>
-      </div>
-    </ion-content>
-  </ion-page>
-</template>
-
-<script lang="ts">
-import {
-  IonBackButton,
-  IonButton,
-  IonContent,
-  IonHeader,
-  IonIcon,
-  IonInput,
-  IonItem,
-  IonLabel,
-  IonPage,
-  IonSelect,
-  IonSelectOption,
-  IonTitle,
-  IonToolbar,
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { downloadOutline } from 'ionicons/icons';
-export default defineComponent({
-  name: 'SelectFacilityCSVUpload',
-  components: {
-    IonBackButton,
-    IonButton,
-    IonContent,
-    IonHeader,
-    IonIcon,
-    IonInput,
-    IonItem,
-    IonLabel,
-    IonPage,
-    IonSelect,
-    IonSelectOption,
-    IonTitle,
-    IonToolbar,
-  },
-  setup() {
-    return {
-      downloadOutline,
-    };
-  },
-});
-</script>
-
-<style scoped>
-.upload-csv {
-  max-width: 732px;
-  margin: 0 auto;
-}
-</style>
\ No newline at end of file
diff --git a/src/views/SelectProduct.vue b/src/views/SelectProduct.vue
deleted file mode 100644
index 9089a218..00000000
--- a/src/views/SelectProduct.vue
+++ /dev/null
@@ -1,604 +0,0 @@
-<template>
-  <ion-page>
-    <ion-header :translucent="true">
-      <ion-toolbar>
-        <ion-menu-button v-if="!jobId" slot="start" />
-        <ion-back-button v-if="jobId" slot="start" @click="navigateBack" default-href="/" />
-        <ion-title>{{ $t("Create rule") }}</ion-title>
-        <ion-buttons slot="end">
-          <ion-button fill="clear" class="mobile-only">
-            <ion-icon :icon="downloadOutline" />
-          </ion-button>
-          <ion-button fill="clear" class="mobile-only">
-            <ion-icon :icon="filterOutline" />
-          </ion-button>
-          <ion-button v-if="jobId && (isFilterChanged || threshold != job?.runtimeData?.threshold)" fill="clear">
-            <ion-icon slot="end" color="warning" :icon="warningOutline" />
-          </ion-button>
-        </ion-buttons>
-      </ion-toolbar>
-    </ion-header>
-
-    <ion-content>
-      <div class="find">
-
-        <aside class="filters desktop-only">
-          <ion-list>
-            <ion-item lines="inset">
-              <ion-label>{{ $t("Threshold") }}</ion-label>
-              <ion-input type="number" :placeholder="$t('global threshold')" v-model="threshold"/>
-            </ion-item>
-            <ion-list-header>
-              <div>
-                <h3>{{ $t("Include") }}</h3>
-                <ion-button fill="clear" color="warning" @click="resetFilters('included')">{{ $t('reset') }}</ion-button>
-              </div>
-            </ion-list-header>
-            <ion-card>
-              <ion-item lines="none">
-                <ion-label>{{ $t("Tags") }}</ion-label>
-                <ion-button fill="clear" slot="end" size="small" @click="searchFilter('tags', 'tagsFacet', 'tags', 'included')">
-                  <ion-label>{{ $t('add') }}</ion-label>
-                  <ion-icon :icon="addCircleOutline" />
-                </ion-button>
-              </ion-item>
-              <ion-item lines="none">
-                <ion-label>{{ $t("Operator") }}</ion-label>
-                <ion-select interface="popover" @ionChange="applyOperator('included', 'tags', $event.detail.value)" :value="appliedFilters['included']['tags'].operator">
-                  <ion-select-option value="AND">AND</ion-select-option>
-                  <ion-select-option value="OR">OR</ion-select-option>
-                </ion-select>
-              </ion-item>
-              <ion-card-content>
-                <ion-chip :outline="true" v-for="(tag, index) in appliedFilters['included']['tags'].list" :key="index">
-                  <ion-icon :icon="pricetagOutline" />
-                  <ion-label>{{ tag }}</ion-label>
-                  <ion-icon :icon="closeCircle" @click="removeFilters('included', 'tags', tag)"/>
-                </ion-chip>
-              </ion-card-content>
-            </ion-card>
-          </ion-list>
-          <ion-list>
-            <ion-list-header>
-              <div>
-                <h3>{{ $t("Exclude") }}</h3>
-                <ion-button fill="clear" color="warning" @click="resetFilters('excluded')">{{ $t('reset') }}</ion-button>
-              </div>
-            </ion-list-header>
-            <ion-card>
-              <ion-item lines="none">
-                <ion-label>{{ $t("Tags") }}</ion-label>
-                <ion-button fill="clear" slot="end" size="small" @click="searchFilter('tags', 'tagsFacet', 'tags', 'excluded')">
-                  <ion-label>{{ $t('add') }}</ion-label>
-                  <ion-icon :icon="addCircleOutline" />
-                </ion-button>
-              </ion-item>
-              <ion-item lines="none">
-                <ion-label>{{ $t("Operator") }}</ion-label>
-                <ion-select @ionChange="applyOperator('excluded', 'tags', $event.detail.value)" interface="popover" :value="appliedFilters['excluded']['tags'].operator">
-                  <ion-select-option value="AND">AND</ion-select-option>
-                  <ion-select-option value="OR">OR</ion-select-option>
-                </ion-select>
-              </ion-item>
-              <ion-card-content>
-                <ion-chip :outline="true" v-for="(tag, index) in appliedFilters['excluded']['tags'].list" :key="index">
-                  <ion-icon :icon="pricetagOutline" />
-                  <ion-label>{{ tag }}</ion-label>
-                  <ion-icon :icon="closeCircle" @click="removeFilters('excluded', 'tags', tag)"/>
-                </ion-chip>
-              </ion-card-content>
-            </ion-card>
-          </ion-list>
-        </aside>
-
-        <main class="main">
-          <section class="sort">
-            <ion-item lines="none">
-              <h2>{{ $t("Results") }}: {{ products.total.virtual }} {{ $t("virtual, ") }} {{ products.total.variant }} {{ $t("variants") }}</h2>
-            </ion-item>
-
-            <section class="search">
-              <ion-searchbar :placeholder="$t('Check products')" v-model="queryString" @keyup.enter="queryString = $event.target.value; searchProducts($event)" />
-            </section>  
-          </section>
-
-          <hr />
-          <div v-for="product in products.list" :key="product">
-            <section class="section-header">
-              <div class="primary-info">
-                <ion-item lines="none">
-                  <ion-label>
-                    {{ product.productName }}
-                    <p>{{ product.variants.length}} {{ $t("variants") }}</p>
-                  </ion-label>
-                </ion-item>
-              </div>
-  
-            <div class="tags"></div>
-            </section>
-  
-            <section class="section-grid">
-              <div v-for="variant in product.variants" :key="variant">
-                <ion-card>
-                  <DxpShopifyImg :src="variant.mainImageUrl" />
-                  <ion-item lines="none">
-                    <ion-label class="ion-text-wrap">
-                      {{ variant.productName }}
-                      <p v-if="variant.color">{{ $t("Color") }}: {{ variant.color }}</p>
-                      <p v-if="variant.size">{{ $t("Size") }}: {{ variant.size }}</p>
-                    </ion-label>
-                  </ion-item>
-                </ion-card>
-              </div>
-            </section>
-            <hr />
-          </div>
-          <ion-infinite-scroll @ionInfinite="loadMoreProducts($event)" threshold="100px" :disabled="!isScrollable">
-            <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
-          </ion-infinite-scroll>
-        </main>
-      </div>
-
-      <div class="action desktop-only">
-        <ion-button v-if="jobId" :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE) || isJobEditable() || isServiceScheduling" @click="updateThreshold()">
-          <ion-icon slot="start" :icon="saveOutline" />
-          {{ $t("Update threshold rule") }}
-        </ion-button>
-        <ion-button :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE)" v-else @click="saveThreshold()">
-          <ion-icon slot="start" :icon="saveOutline" />
-          {{ $t("Save threshold rule") }}
-        </ion-button>
-      </div>
-
-      <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="mobile-only">
-        <ion-fab-button v-if="jobId" :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE) || isServiceScheduling || isJobEditable()" @click="updateThreshold()">
-          <ion-icon :icon="arrowForwardOutline" />
-        </ion-fab-button>
-        <ion-fab-button :disabled="!hasPermission(Actions.APP_THRESHOLD_RULE_UPDATE)" v-else @click="saveThreshold()">
-          <ion-icon :icon="arrowForwardOutline" />
-        </ion-fab-button>
-      </ion-fab>
-    </ion-content>
-  </ion-page>
-</template>
-
-<script lang="ts">
-import { DxpShopifyImg } from '@hotwax/dxp-components'; 
-import {
-  alertController,
-  IonBackButton,
-  IonButton,
-  IonButtons,
-  IonCard,
-  IonCardContent,
-  IonChip,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonInput,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonListHeader,
-  IonMenuButton,
-  IonPage,
-  IonSearchbar,
-  IonSelect,
-  IonSelectOption,
-  IonTitle,
-  IonToolbar,
-  modalController,
-  IonInfiniteScroll,
-  IonInfiniteScrollContent
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { arrowForwardOutline, downloadOutline, filterOutline, saveOutline, pricetagOutline, closeCircle, addCircleOutline, albumsOutline, warningOutline } from 'ionicons/icons';
-import { useRouter } from 'vue-router';
-import { mapGetters, useStore } from 'vuex';
-import ProductFilterModal from '@/components/ProductFilterModal.vue';
-import { hasError, showToast } from '@/utils';
-import { translate } from '@/i18n';
-import { ProductService } from '@/services/ProductService';
-import { JobService } from '@/services/JobService';
-import { DateTime } from 'luxon';
-import { Actions, hasPermission } from '@/authorization'
-import emitter from '@/event-bus';
-
-export default defineComponent({
-  name: 'SelectProduct',
-  components: {
-    IonBackButton,
-    IonButton,
-    IonButtons,
-    IonCard,
-    IonCardContent,
-    IonChip,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonInfiniteScroll,
-    IonInfiniteScrollContent,
-    IonInput,
-    IonItem,
-    IonLabel,
-    IonList,
-    IonListHeader,
-    IonMenuButton,
-    IonPage,
-    IonSearchbar,
-    IonSelect,
-    IonSelectOption,
-    IonTitle,
-    IonToolbar,
-    DxpShopifyImg
-  },
-  computed: {
-    ...mapGetters({
-      products: 'product/getProducts',
-      isScrollable: 'product/isScrollable',
-      appliedFilters: 'product/getAppliedFilters',
-      query: 'product/getQuery',
-      pendingJobs: 'job/getPendingJobs',
-      getTagsAndOperator: 'job/getTagsAndOperator',
-      getCurrentEComStore:'user/getCurrentEComStore',
-      userProfile: 'user/getUserProfile',
-      currentEComStore: 'user/getCurrentEComStore',
-      shopifyConfig: 'util/getShopifyConfig',
-      facilitiesByProductStore: 'util/getFacilityByProductStore',
-    })
-  },
-  data () {
-    return {
-      threshold: '' as any,
-      queryString: '',
-      isFilterChanged: false,
-      isServiceScheduling: false,
-      job: {} as any,
-      jobId: "" as any
-    }
-  },
-  methods: {
-    async applyThresholdRule(){
-      let job = this.pendingJobs.find((job: any) => job.jobId === this.jobId)
-      job = job ? job : await JobService.fetchJob({eComStoreId: this.getCurrentEComStore.productStoreId, jobId: this.jobId})
-      if (job) {
-        this.job = job;
-        if (job.runtimeData?.searchPreferenceId) {
-          await this.store.dispatch('product/setAppliedfiltersAndOperator', this.prepareAppliedFilters(job)); 
-          this.threshold = job.runtimeData.threshold;
-        } else {
-          showToast(translate("No threshold rule found. Invalid job"));
-        }
-      } else {
-        showToast(translate("No job found."));
-      }
-    },
-    isJobEditable(){
-      return !(((this.job.statusId === 'SERVICE_PENDING' && this.job.runTime > DateTime.now().toMillis()) && (this.isFilterChanged || this.threshold != this.job.runtimeData.threshold)));
-    },
-    prepareAppliedFilters(job: any){
-      const includedTagsAndOperator = this.getTagsAndOperator(job.runtimeData.searchPreferenceId, "included");
-      const excludedTagsAndOperator = this.getTagsAndOperator(job.runtimeData.searchPreferenceId, "excluded");
-      return {
-        included: {
-          tags: {
-            list: includedTagsAndOperator.tags,
-            operator: includedTagsAndOperator.operator
-          }
-        },
-        excluded: {
-          tags: {
-            list: excludedTagsAndOperator.tags,
-            operator: excludedTagsAndOperator.operator
-          } 
-        }
-      }
-    },
-    async navigateBack(){
-      if(this.isFilterChanged || this.threshold != this.job?.runtimeData?.threshold){
-        const alert = await alertController.create({
-          header: this.$t("Save changes"),
-          message: this.$t("Make sure you have saved your changes. All unsaved changes to this rule will be lost."),
-          buttons: [
-            {
-              text: this.$t("Keep editing"),
-              role: 'cancel',
-            },
-            {
-              text: this.$t("Discard"),
-              handler: () => {
-                this.isFilterChanged = false;
-                this.store.dispatch('product/clearAllFilters');
-                this.router.push("/threshold-updates");
-              },
-            },
-          ],
-        });
-        return alert.present();
-      }
-      this.router.push("/threshold-updates");
-      this.store.dispatch('product/clearAllFilters');
-    },
-    searchProducts(event: any) {
-      this.queryString = event.target.value;
-      this.getProducts();
-    },
-    async getProducts(vSize?: any, vIndex?: any) {
-      const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
-      const viewIndex = vIndex ? vIndex : 0;
-      this.store.dispatch("product/updateQuery", { viewSize, viewIndex, queryString: this.queryString })
-    },
-    async loadMoreProducts(event: any){
-      this.getProducts(
-        undefined,
-        Math.ceil(this.products.list.length / process.env.VUE_APP_VIEW_SIZE).toString()
-      ).then(() => {
-        event.target.complete();
-      })
-    },
-    async updateThreshold() {
-      this.isServiceScheduling = true;
-      const solrQuery = this.query
-      // re-initialized params object from query as there is no need for grouping or pagination when storing the query
-      solrQuery.json.params = {
-        "q.op": "AND"
-      }
-      // made the query to default (*:*) before storing, as the threshold will be set for all the products those
-      // are fullfilling the filters condition
-      solrQuery.json['query'] = "*:*"
-
-      try {
-        const resp = await ProductService.updateSearchPreference({
-          searchPrefId: this.job.runtimeData.searchPreferenceId,
-          searchPrefValue: JSON.stringify(solrQuery)
-        });
-        
-        if (resp.status === 200 && !hasError(resp)) {
-          const payload = {
-            'JOB_NAME': this.job.jobName,
-            'SERVICE_NAME': this.job.serviceName,
-            'SERVICE_COUNT': '0',
-            'jobFields': {
-              'productStoreId': this.job.productStoreId ? this.job.productStoreId : '',
-              'systemJobEnumId': this.job.systemJobEnumId,
-              'parentJobId': this.job.parentJobId
-            },
-            'shopifyConfigId': this.job.runtimeData.shopifyConfigId ? this.job.runtimeData.shopifyConfigId : "",
-            'statusId': "SERVICE_PENDING",
-            'systemJobEnumId': this.job.systemJobEnumId,
-            'includeAll': true, // true: includes all the product, false: includes only products updated in the last 24 hours
-            'searchPreferenceId': this.job.runtimeData.searchPreferenceId,
-            'threshold': this.threshold,
-            'facilityId': this.job.runtimeData.facilityId ? this.job.runtimeData.facilityId : [],
-          } as any;
-
-          // checking if the runtimeData has productStoreId, and if present then adding it on root level
-          this.job.runtimeData?.productStoreId?.length >= 0 && (payload['productStoreId'] = this.job.productStoreId)
-          this.job.priority && (payload['SERVICE_PRIORITY'] = this.job.priority.toString())
-
-          if(this.job.runtimeData.threshold != this.threshold){
-            this.job.runtimeData.threshold = this.threshold
-            await this.store.dispatch('job/cancelJob', this.job).then((resp) => {
-              if(resp.status === 200 && !hasError(resp)){
-                // Scheduling Job that will run only once for all the products
-                JobService.scheduleJob(JSON.parse(JSON.stringify({ ...this.job.runtimeData, ...payload }))).then((resp: any) => {
-                  if(resp.status === 200 && !hasError(resp) && resp.data){
-                    payload['SERVICE_TEMP_EXPR'] = this.job.tempExprId;
-                    payload['jobFields'].tempExprId = this.job.tempExprId; // Need to remove this as we are passing frequency in SERVICE_TEMP_EXPR, currently kept it for backward compatibility
-                    payload['jobFields'].maxRecurrenceCount = '-1';
-                    payload['jobFields'].recurrenceTimeZone = this.job.recurrenceTimeZone;
-                    payload['SERVICE_RUN_AS_SYSTEM'] = 'Y';
-                    payload['jobFields'].runAsUser = 'system';// default system, but empty in run now. TODO Need to remove this as we are using SERVICE_RUN_AS_SYSTEM, currently kept it for backward compatibility
-                    payload['includeAll'] =  false;
-                    payload['SERVICE_TIME'] = this.job.runTime.toString()
-                    // Scheduling Job that will run everyday and as system
-                    JobService.scheduleJob({ ...this.job.runtimeData, ...payload }).then((resp) => {
-                      if(resp.status === 200 && !hasError(resp) && resp.data){
-                        this.isFilterChanged = false;
-                        this.store.dispatch('job/removeThresholdRule', this.job.runtimeData.searchPreferenceId);
-                        this.$router.push('/threshold-updates')
-                      } else {
-                        this.$log.error(resp);
-                        showToast(translate('Unable to schedule service.'))
-                      }
-                    }).catch(error => { return error });
-                  } else {
-                    this.$log.error(resp);
-                    showToast(translate('Unable to schedule service.'))
-                  }
-                }).catch((error: any) => { return error })
-              } else {
-                this.$log.error(resp);
-              } 
-            }).catch(err => {
-              this.$log.error(err);
-            })
-          } else {
-            JobService.scheduleJob(JSON.parse(JSON.stringify({ ...this.job.runtimeData, ...payload }))).then((resp: any) => {
-              if(resp.status === 200 && !hasError(resp) && resp.data){
-                showToast(translate('Service updated successfully'));
-                this.isFilterChanged = false;
-                this.store.dispatch('job/removeThresholdRule', this.job.runtimeData.searchPreferenceId);
-                this.$router.push('/threshold-updates')
-              } else {
-                this.$log.error(resp);
-                showToast(translate('Unable to schedule service.'))
-              }
-            }).catch((error: any) => { return error })  
-          }
-        } else {
-          showToast(translate('Unable to schedule service.'))
-        }
-      } catch (err) {
-        this.$log.error(err);
-        showToast(translate('Unable to update threshold rule.'))
-      }
-      this.isServiceScheduling = false;
-    },
-    async saveThreshold() {
-      // an alert will be displayed, if the user does not enter a threshold value before proceeding to save page
-      if (!this.threshold) {
-        const alert = await alertController
-          .create({
-            header: this.$t('Enter threshold value'),
-            message: this.$t('Please enter a threshold value to set for these products before proceeding.'),
-            buttons: [{
-              text: this.$t("Ok"),
-              role: 'cancel'
-            }],
-          });
-        return alert.present();
-      }
-      await this.store.dispatch('product/updateThreshold', this.threshold)
-      this.router.push('/schedule-threshold')
-    },
-    async searchFilter(label: string, facetToSelect: string, searchfield: string, type: string) {
-      const modal = await modalController.create({
-        component: ProductFilterModal,
-        componentProps: {
-          label,
-          facetToSelect,
-          searchfield,
-          type
-        },
-        backdropDismiss: false
-      })
-      modal.onDidDismiss().then((payload) => {
-        if(payload.data?.isFilterChanged){
-          this.queryString = '';
-          this.isFilterChanged = true;
-        }
-      })
-      modal.present();
-    },
-    async removeFilters(type: string, id: string, value: string) {
-      const appliedFilters = JSON.parse(JSON.stringify(this.appliedFilters[type][id]))
-      appliedFilters.list.splice(appliedFilters.list.indexOf(value), 1)
-
-      await this.store.dispatch('product/updateAppliedFilters', {
-        type,
-        id,
-        value: appliedFilters
-      })
-      this.queryString = ''
-      this.isFilterChanged = true;
-    },
-    async applyOperator(type: string, id: string, value: string) {
-      // TODO Find a better way
-      // This is done as when applying the exisiting rule as the value of the select box changes
-      // query is sent multiple times
-      if (this.appliedFilters[type][id].operator === value) return;
-
-      await this.store.dispatch('product/updateAppliedFilterOperator', {
-        type,
-        id,
-        value
-      })
-      this.queryString = ''
-      this.isFilterChanged = true;
-    },
-    async resetFilters(type: string) {
-      // checking that if any of the current type does not have any attribute selected than not making solr query
-      if (Object.entries(this.appliedFilters[type]).every((filter: any) => filter[1].length <= 0)) {
-        return;
-      }
-      await this.store.dispatch('product/resetFilters', { type })
-      this.queryString = ''
-      this.isFilterChanged = true;
-    }
-  },
-  ionViewDidLeave() {
-    //Cleared query string to clear search keyword whenever user navigates to SelectProduct page
-    this.queryString = '';
-    this.threshold = '';
-    emitter.off("productStoreChanged", this.getProducts);
-  },
-  async ionViewWillEnter(){
-    this.jobId = this.$route.query.id
-    this.isFilterChanged = false;
-    if (this.jobId) {
-      this.applyThresholdRule()
-    } else {
-      // subscribing for emitter only we are creating a new rule for job scheduling, as when updating a rule
-      // there is no option to change the product store
-      emitter.on("productStoreChanged", this.getProducts);
-      this.getProducts();
-    }
-  },
-  setup() {
-    const router = useRouter();
-    const store = useStore();
-
-    return {
-      Actions,
-      arrowForwardOutline,
-      downloadOutline,
-      filterOutline,
-      hasPermission,
-      router,
-      saveOutline,
-      store,
-      pricetagOutline,
-      closeCircle,
-      addCircleOutline,
-      albumsOutline,
-      warningOutline
-    };
-  },
-});
-</script>
-
-<style scoped>
-.section-grid {
-  grid-auto-flow: column;
-  grid-auto-columns: 200px;
-  grid-template-columns: none;
-  width: 100vw;
-  overflow-x: scroll;
-  scroll-snap-type: x mandatory;
-}
-
-.section-grid > div {
-  scroll-snap-align: start;
-  /* Here 20px padding-bottom is given 
-    to match the 10px bottom and 10px top margin of card */
-  padding-bottom: calc(10px * 2);
-}
-
-.section-grid > div > ion-card {
-  height: 100%;
-}
-
-ion-list-header > div {
-  flex: 1;
-  display: flex;
-  justify-content: space-between;
-}
-
-@media (min-width: 991px) {
-  .find {
-    padding: var( --spacer-lg);
-    gap: var(--spacer-lg);
-  } 
-
-  .action {
-    position: fixed;
-    z-index: 3;
-    bottom: 10%;
-    left: 50%;
-    transform: translate(-50%, 0);
-  }
-
-  .section-grid {
-    width: unset;
-    grid-auto-columns: unset;
-    grid-template-columns: repeat(auto-fill, 200px);
-    grid-auto-flow: unset;
-    overflow: unset;
-  }
-}
-</style>
diff --git a/src/views/SelectProductCSVUpload.vue b/src/views/SelectProductCSVUpload.vue
deleted file mode 100644
index 3bd6ef40..00000000
--- a/src/views/SelectProductCSVUpload.vue
+++ /dev/null
@@ -1,93 +0,0 @@
-<template>
-  <ion-page>
-    <ion-header :translucent="true">
-      <ion-toolbar>
-        <ion-back-button slot="start" default-href="/" />
-        <ion-title>{{ $t("Upload CSV") }}</ion-title>
-      </ion-toolbar>
-    </ion-header>
-
-    <ion-content>
-      <main>
-        <ion-item>
-          <ion-label>{{ $t("Product list") }}</ion-label>
-          <ion-input :placeholder="$t('Select CSV')" />
-          <ion-button fill="outline">{{ $t("Upload") }}</ion-button>
-        </ion-item>
-
-        <ion-item lines="none">
-          <ion-label>{{ $t("Select the column index for the following information in the uploaded CSV") }}</ion-label>
-        </ion-item>
-        <ion-item>
-          <ion-label>{{ $t("Product SKU column") }}</ion-label>
-          <ion-select :placeholder="$t('Select')">
-            <ion-select-option>1234</ion-select-option>
-            <ion-select-option>5678</ion-select-option>
-            <ion-select-option>9012</ion-select-option>
-          </ion-select>
-        </ion-item>
-
-        <ion-button expand="block" size="large" color="medium">{{ $t("Save") }}</ion-button>
-
-        <ion-item>
-          <ion-label>50 {{ $t("products selected") }}</ion-label>
-          <ion-button slot="end" fill="outline" color="dark">
-            <ion-icon slot="start" :icon="downloadOutline" />
-            {{ $t("Download") }}
-          </ion-button>
-        </ion-item>
-      </main>
-    </ion-content>
-  </ion-page>
-</template>
-
-<script lang="ts">
-import {
-  IonBackButton,
-  IonButton,
-  IonContent,
-  IonHeader,
-  IonIcon,
-  IonInput,
-  IonItem,
-  IonLabel,
-  IonPage,
-  IonSelect,
-  IonSelectOption,
-  IonTitle,
-  IonToolbar,
-} from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { downloadOutline } from 'ionicons/icons';
-
-export default defineComponent({
-  name: 'SelectProductCSVUpload',
-  components: {
-    IonBackButton,
-    IonButton,
-    IonContent,
-    IonHeader,
-    IonIcon,
-    IonInput,
-    IonItem,
-    IonLabel,
-    IonPage,
-    IonSelect,
-    IonSelectOption,
-    IonTitle,
-    IonToolbar,
-  },
-  setup() {
-    return {
-      downloadOutline,
-    };
-  },
-});
-</script>
-
-<style scoped>
-main {
-  max-width: 732px;
-  margin: 0 auto;
-}
-</style>
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index 24eb5ba4..d92647e9 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -18,24 +18,34 @@
             is added on sides from ion-item and ion-padding-vertical to compensate the removed
             vertical padding -->
             <ion-card-header class="ion-no-padding ion-padding-vertical">
-              <ion-card-subtitle>{{ userProfile.userLoginId }}</ion-card-subtitle>
-              <ion-card-title>{{ userProfile?.partyName }}</ion-card-title>
+              <ion-card-subtitle>{{ userProfile.userId }}</ion-card-subtitle>
+              <ion-card-title>{{ userProfile?.userFullName }}</ion-card-title>
             </ion-card-header>
           </ion-item>
           <ion-button color="danger" @click="logout()">{{ $t("Logout") }}</ion-button>
-          <ion-button fill="outline" @click="goToLaunchpad()">
-            {{ $t("Go to Launchpad") }}
-            <ion-icon slot="end" :icon="openOutline" />
-          </ion-button>
-          <!-- Commenting this code as we currently do not have reset password functionality -->
-          <!-- <ion-button fill="outline" color="medium">{{ $t("Reset password") }}</ion-button> -->
         </ion-card>
       </div>
       <div class="section-header">
         <h1>{{ $t('OMS') }}</h1>
       </div>
       <section>
-        <DxpOmsInstanceNavigator />
+        <ion-card>
+          <ion-card-header>
+            <ion-card-subtitle>
+              {{ $t('OMS instance') }}
+            </ion-card-subtitle>
+            <ion-card-title>
+              {{ oms }}
+            </ion-card-title>
+          </ion-card-header>
+          <ion-card-content>
+            {{ $t('This is the name of the OMS you are connected to right now. Make sure that you are connected to the right instance before proceeding.') }}
+          </ion-card-content>
+          <ion-button @click="goToOms()" fill="clear">
+            {{ $t('Go to OMS') }}
+            <ion-icon slot="end" :icon="openOutline" />
+          </ion-button>
+        </ion-card>
 
         <ion-card>
           <ion-card-header>
@@ -59,7 +69,13 @@
       </section>
       <hr />
 
-      <DxpAppVersionInfo />
+      <div class="section-header">
+        <h1>
+          {{ translate("App") }}
+          <p class="overline" >{{ translate("Version:") + appVersion }}</p>
+        </h1>
+        <p class="overline">{{ translate("Built:") + getDateTime(appInfo.builtTime) }}</p>
+      </div>
 
       <section>
         <ion-card>
@@ -72,7 +88,7 @@
             {{ $t('The timezone you select is used to ensure automations you schedule are always accurate to the time you select.') }}
           </ion-card-content>
           <ion-item lines="none">
-            <ion-label> {{ userProfile && userProfile.userTimeZone ? userProfile.userTimeZone : '-' }} </ion-label>
+            <ion-label> {{ userProfile && userProfile.timeZone ? userProfile.timeZone : '-' }} </ion-label>
             <ion-button @click="changeTimeZone()" slot="end" fill="outline" color="dark">{{ $t("Change") }}</ion-button>
           </ion-item>
         </ion-card>
@@ -89,6 +105,8 @@ import { mapGetters, useStore } from 'vuex';
 import { useRouter } from 'vue-router';
 import TimeZoneModal from '@/views/TimezoneModal.vue';
 import Image from '@/components/Image.vue'
+import { DateTime } from "luxon";
+import { translate } from '@/i18n';
 
 export default defineComponent({
   name: 'Settings',
@@ -115,13 +133,17 @@ export default defineComponent({
   },
   data() {
     return {
-      baseURL: process.env.VUE_APP_BASE_URL
+      baseURL: process.env.VUE_APP_BASE_URL,
+      appVersion: '',
+      appInfo: process.env.VUE_APP_VERSION_INFO ? JSON.parse(process.env.VUE_APP_VERSION_INFO) : {} as any
     };
   },
   computed: {
     ...mapGetters({
       userProfile: 'user/getUserProfile',
-      currentEComStore: 'user/getCurrentEComStore'
+      currentEComStore: 'user/getCurrentEComStore',
+      oms: 'user/getInstanceUrl',
+      token: 'user/user/getUserToken',
     })
   },
   methods: {
@@ -143,18 +165,24 @@ export default defineComponent({
       });
       return timeZoneModal.present();
     },
-    logout () {
-      this.store.dispatch('user/logout', { isUserUnauthorised: false }).then((redirectionUrl) => {
-        // if not having redirection url then redirect the user to launchpad
-        if(!redirectionUrl) {
-          const redirectUrl = window.location.origin + '/login'
-          window.location.href = `${process.env.VUE_APP_LOGIN_URL}?isLoggedOut=true&redirectUrl=${redirectUrl}`
-        }
+    logout() {
+      this.store.dispatch("user/logout").then(() => {
+        this.router.push("/login");
       })
     },
     goToLaunchpad() {
       window.location.href = `${process.env.VUE_APP_LOGIN_URL}`
     },
+    getDateTime(time: any) {
+      return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "";
+    },
+    goToOms() {
+      const link = (this.oms.startsWith('http') ? this.oms.replace(/\/api\/?|\/$/, "") : `https://${this.oms}.hotwax.io`) + `/qapps?token=${this.token}`
+      window.open(link, '_blank', 'noopener, noreferrer')
+    }
+  },
+  mounted() {
+    this.appVersion = this.appInfo.branch ? (this.appInfo.branch + "-" + this.appInfo.revision) : this.appInfo.tag;
   },
   setup(){
     const store = useStore();
@@ -169,6 +197,7 @@ export default defineComponent({
       store,
       router,
       timeOutline,
+      translate,
       openOutline
     }
   }
diff --git a/src/views/ThresholdUpdates.vue b/src/views/ThresholdUpdates.vue
deleted file mode 100644
index c440a784..00000000
--- a/src/views/ThresholdUpdates.vue
+++ /dev/null
@@ -1,688 +0,0 @@
-<template>
-  <ion-page>
-    <ion-header :translucent="true">
-      <ion-toolbar>
-        <ion-menu-button slot="start" />
-        <ion-title>{{ $t("Rule pipeline") }}</ion-title>
-      </ion-toolbar>
-
-      <ion-toolbar>
-        <ion-segment v-model="segmentSelected" @ionChange="segmentChanged">
-          <ion-segment-button value="pending">
-            <ion-label>{{ $t("Pending") }}</ion-label>
-          </ion-segment-button>
-          <ion-segment-button value="running">
-            <ion-label>{{ $t("Running") }}</ion-label>
-          </ion-segment-button>
-          <ion-segment-button value="history">
-            <ion-label>{{ $t("History") }}</ion-label>
-          </ion-segment-button>
-        </ion-segment>
-      </ion-toolbar>
-    </ion-header>
-
-    <ion-content>
-      <main>
-        <section v-if="segmentSelected === 'pending'">
-          <!-- Empty state -->
-          <div v-if="pendingJobs?.length === 0">
-            <p class="ion-text-center">{{ $t("There are no jobs pending right now")}}</p>
-            <div class="ion-text-center">
-              <ion-button fill="outline" @click="refreshJobs(undefined, true)">
-                {{ $t('retry') }}
-                <ion-spinner v-if="isRetrying" name="crescent" />
-              </ion-button>
-            </div>
-          </div>
-
-          <div v-else>
-            <ion-card v-for="job in pendingJobs" :key="job.jobId" @click="viewJobConfiguration(job)" :button="isDesktop">
-              <ion-card-header>
-                <ion-card-title>{{ getEnumName(job.systemJobEnumId) }}</ion-card-title>
-                <ion-badge v-if="job.runTime" color="dark">{{ timeFromNow(job.runTime)}}</ion-badge>
-              </ion-card-header>
-
-              <ion-item lines="none">
-                <ion-label class="ion-text-wrap">
-                  <p>{{ job.jobName }}</p>
-                  <p>{{ getEnumDescription(job.systemJobEnumId) }}</p>
-                </ion-label>
-              </ion-item>
-
-              <ion-item v-if="job.runtimeData && job.runtimeData.threshold !== null && job.runtimeData.threshold !== undefined">
-                <ion-icon slot="start" :icon="optionsOutline"/>
-                <ion-label class="ion-text-wrap">{{ job.runtimeData.threshold }} {{ $t('threshold') }}</ion-label>
-              </ion-item>
-
-              <ion-item v-if="job.runtimeData && job.runtimeData.searchPreferenceId">
-                <ion-icon slot="start" :icon="checkmarkCircleOutline" />
-                <ion-label class="ion-text-wrap">{{ getTags(job.runtimeData.searchPreferenceId, "included") ? getTags(job.runtimeData.searchPreferenceId, "included") : "-" }}</ion-label>
-              </ion-item>
-
-              <ion-item v-if="job.runtimeData && job.runtimeData.searchPreferenceId">
-                <ion-icon slot="start" :icon="closeCircleOutline" />
-                <ion-label class="ion-text-wrap">{{ getTags(job.runtimeData.searchPreferenceId, "excluded") ? getTags(job.runtimeData.searchPreferenceId, "excluded") : "-" }}</ion-label>
-              </ion-item>
-
-              <ion-item>
-                <ion-icon slot="start" :icon="timeOutline" />
-                <ion-label class="ion-text-wrap">{{ job.runTime ? getTime(job.runTime) : "-"  }}</ion-label>
-              </ion-item>
-
-              <ion-item lines="full">
-                <ion-icon slot="start" :icon="timerOutline" />
-                <ion-label class="ion-text-wrap">{{ job.tempExprId ? temporalExpr(job.tempExprId)?.description : "🙃"  }}</ion-label>
-              </ion-item>
-
-              <div class="actions">
-                <div>
-                  <ion-button :disabled="!hasPermission(Actions.APP_JOB_UPDATE)" fill="clear" @click.stop="skipJob(job)">{{ $t("Skip") }}</ion-button>
-                  <ion-button :disabled="!hasPermission(Actions.APP_JOB_UPDATE)" color="danger" fill="clear" @click.stop="cancelJob(job)">{{ $t("Cancel") }}</ion-button>
-                </div>
-                <div>
-                  <ion-button fill="clear" color="medium" slot="end" @click.stop="copyJobInformation(job)">
-                    <ion-icon slot="icon-only" :icon="copyOutline" />
-                  </ion-button>
-                  <ion-button fill="clear" color="medium" slot="end" @click.stop="viewJobHistory(job)">
-                    <ion-icon slot="icon-only" :icon="timeOutline" />
-                  </ion-button>
-                </div>
-              </div> 
-            </ion-card>
-            <ion-refresher slot="fixed" @ionRefresh="refreshJobs($event)">
-              <ion-refresher-content pullingIcon="crescent" refreshingSpinner="crescent" />
-            </ion-refresher>
-            <ion-infinite-scroll @ionInfinite="loadMorePendingJobs($event)" threshold="100px" :disabled="!isPendingJobsScrollable">
-              <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
-            </ion-infinite-scroll>
-          </div>
-        </section>
-
-        <section v-if="segmentSelected === 'running'">
-          <!-- Empty state -->
-          <div v-if="runningJobs?.length === 0">
-            <p class="ion-text-center">{{ $t("There are no jobs running right now")}}</p>
-            <div class="ion-text-center">
-              <ion-button fill="outline" @click="refreshJobs(undefined, true)">
-                {{ $t('retry') }}
-                <ion-spinner v-if="isRetrying" name="crescent" />
-              </ion-button>
-            </div>
-          </div>
-
-          <div v-else>
-            <ion-card v-for="job in runningJobs" :key="job.jobId">
-              <ion-card-header>
-                <div>
-                  <ion-card-subtitle class="overline">{{ job.parentJobId }}</ion-card-subtitle>
-                  <ion-card-title>{{ getEnumName(job.systemJobEnumId) }}</ion-card-title>
-                </div>
-                <ion-badge color="dark">Running</ion-badge>
-              </ion-card-header>
-
-              <ion-item lines="none">
-                <ion-label class="ion-text-wrap">
-                  <p>{{ job.jobName }}</p>
-                  <p>{{ getEnumDescription(job.systemJobEnumId) }}</p>
-                </ion-label>
-              </ion-item>
-              <ion-item v-if="job.runtimeData && job.runtimeData.threshold !== null && job.runtimeData.threshold !== undefined">
-                <ion-icon slot="start" :icon="optionsOutline"/>
-                <ion-label class="ion-text-wrap">{{ job.runtimeData.threshold }} {{ $t('threshold') }}</ion-label>
-              </ion-item>
-
-              <ion-item v-if="job.runtimeData && job.runtimeData.searchPreferenceId">
-                <ion-icon slot="start" :icon="checkmarkCircleOutline" />
-                <ion-label class="ion-text-wrap">{{ getTags(job.runtimeData.searchPreferenceId, "included") ? getTags(job.runtimeData.searchPreferenceId, "included") : "-" }}</ion-label>
-              </ion-item>
-
-              <ion-item v-if="job.runtimeData && job.runtimeData.searchPreferenceId">
-                <ion-icon slot="start" :icon="closeCircleOutline" />
-                <ion-label class="ion-text-wrap">{{ getTags(job.runtimeData.searchPreferenceId, "excluded") ? getTags(job.runtimeData.searchPreferenceId, "excluded") : "-" }}</ion-label>
-              </ion-item>
-
-              <ion-item>
-                <ion-icon slot="start" :icon="timeOutline" />
-                <ion-label class="ion-text-wrap">{{ job.runTime ? getTime(job.runTime) : "-"  }}</ion-label>
-              </ion-item>
-
-              <ion-item lines="full">
-                <ion-icon slot="start" :icon="timerOutline" />
-                <ion-label class="ion-text-wrap">{{ job.tempExprId ? temporalExpr(job.tempExprId)?.description : "🙃"  }}</ion-label>
-              </ion-item>
-
-              <div class="actions">
-                <div></div>
-                <div>
-                  <ion-button fill="clear" color="medium" slot="end" @click.stop="copyJobInformation(job)">
-                    <ion-icon slot="icon-only" :icon="copyOutline" />
-                  </ion-button>
-                  <ion-button fill="clear" color="medium" slot="end" @click.stop="viewJobHistory(job)">
-                    <ion-icon slot="icon-only" :icon="timeOutline" />
-                  </ion-button>
-                </div>
-              </div>
-            </ion-card>
-
-            <ion-refresher slot="fixed" @ionRefresh="refreshJobs($event)">
-              <ion-refresher-content pullingIcon="crescent" refreshingSpinner="crescent" />
-            </ion-refresher>
-            <ion-infinite-scroll @ionInfinite="loadMoreRunningJobs($event)" threshold="100px" :disabled="!isRunningJobsScrollable">
-              <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
-            </ion-infinite-scroll>
-          </div> 
-        </section>
-
-        <section v-if="segmentSelected === 'history'">
-          <!-- Empty state -->
-          <div v-if="jobHistory?.length === 0">
-            <p class="ion-text-center">{{ $t("No jobs have run yet")}}</p>
-            <div class="ion-text-center">
-              <ion-button fill="outline" @click="refreshJobs(undefined, true)">
-                {{ $t('retry') }}
-                <ion-spinner v-if="isRetrying" name="crescent" />
-              </ion-button>
-            </div>
-          </div>
-
-          <div v-else>
-          <ion-card v-for="job in jobHistory" :key="job.jobId">
-            <ion-card-header>
-              <div>
-                <ion-card-subtitle class="overline">{{ job.parentJobId }}</ion-card-subtitle>
-                <ion-card-title>{{ getEnumName(job.systemJobEnumId) }}</ion-card-title>
-              </div>
-              <div>
-                <ion-badge v-if="job.cancelDateTime || job.finishDateTime" color="dark">{{ job.statusId == "SERVICE_CANCELLED" || job.statusId == "SERVICE_CRASHED" ?  timeFromNow(job.cancelDateTime) : timeFromNow(job.finishDateTime) }}</ion-badge>
-                <ion-badge v-if="job.statusId" :color="job.statusId === 'SERVICE_FINISHED' ? 'success' : 'danger'">{{ job.statusDesc }}</ion-badge>
-              </div>
-            </ion-card-header>
-
-            <ion-item lines="none">
-              <ion-label class="ion-text-wrap">
-                <p>{{ job.jobName }}</p>
-                <p>{{ getEnumDescription(job.systemJobEnumId) }}</p>
-              </ion-label>
-            </ion-item>
-            <ion-item v-if="job.runtimeData && job.runtimeData.threshold !== null && job.runtimeData.threshold !== undefined">
-              <ion-icon slot="start" :icon="optionsOutline"/>
-              <ion-label class="ion-text-wrap">{{ job.runtimeData.threshold }} {{ $t('threshold') }}</ion-label>
-            </ion-item>
-
-            <ion-item v-if="job.runtimeData && job.runtimeData.searchPreferenceId">
-              <ion-icon slot="start" :icon="checkmarkCircleOutline" />
-              <ion-label class="ion-text-wrap">{{ getTags(job.runtimeData.searchPreferenceId, "included") ? getTags(job.runtimeData.searchPreferenceId, "included") : "-" }}</ion-label>
-            </ion-item>
-
-            <ion-item v-if="job.runtimeData && job.runtimeData.searchPreferenceId">
-              <ion-icon slot="start" :icon="closeCircleOutline" />
-              <ion-label class="ion-text-wrap">{{ getTags(job.runtimeData.searchPreferenceId, "excluded") ? getTags(job.runtimeData.searchPreferenceId, "excluded") : "-" }}</ion-label>
-            </ion-item>
-
-            <ion-item>
-              <ion-icon slot="start" :icon="timeOutline" />
-              <ion-label class="ion-text-wrap">{{ job.runTime ? getTime(job.runTime) : "-"  }}</ion-label>
-              <ion-note slot="end">{{ job.statusId == "SERVICE_CANCELLED" || job.statusId == "SERVICE_CRASHED" ? getJobExecutionTime(job.startDateTime, job.cancelDateTime) : getJobExecutionTime(job.startDateTime, job.finishDateTime) }}</ion-note>
-            </ion-item>
-
-            <ion-item lines="full">
-              <ion-icon slot="start" :icon="timerOutline" />
-              <ion-label class="ion-text-wrap">{{ job.tempExprId ? temporalExpr(job.tempExprId)?.description : "🙃"  }}</ion-label>
-            </ion-item>
-
-            <div class="actions">
-              <div></div>
-              <div>
-                <ion-button fill="clear" color="medium" slot="end" @click.stop="copyJobInformation(job)">
-                  <ion-icon slot="icon-only" :icon="copyOutline" />
-                </ion-button>
-                <ion-button fill="clear" color="medium" slot="end" @click.stop="viewJobHistory(job)">
-                  <ion-icon slot="icon-only" :icon="timeOutline" />
-                </ion-button>
-              </div>
-            </div>
-          </ion-card>
-
-          <ion-refresher slot="fixed" @ionRefresh="refreshJobs($event)">
-            <ion-refresher-content pullingIcon="crescent" refreshingSpinner="crescent" />
-          </ion-refresher>
-          <ion-infinite-scroll @ionInfinite="loadMoreJobHistory($event)" threshold="100px" :disabled="!isHistoryJobsScrollable">
-            <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
-          </ion-infinite-scroll>
-          </div>          
-        </section>
-
-        <aside class="desktop-only" v-show="segmentSelected === 'pending' && currentJob">
-          <JobConfiguration :title="title" :job="currentJob" :productCount="productCount" :status="currentJobStatus" :type="freqType" :key="currentJob"/>
-        </aside>
-      </main>
-
-      <!-- showing reorder option on pending page and only when we are having pending jobs -->
-      <!-- Not defined fab button in the pending section div, as the slot property only works in ion-content and defining the button in div makes the fab button scrollable -->
-      <ion-fab v-if="segmentSelected === 'pending' && pendingJobs?.length !== 0" vertical="bottom" horizontal="end" slot="fixed">
-        <ion-fab-button @click="openReorderModal()">
-          <ion-icon :icon="pencilOutline" />
-        </ion-fab-button>
-      </ion-fab>
-    </ion-content>
-  </ion-page>
-</template>
-<script lang="ts">
-import { mapGetters, useStore } from 'vuex'
-import { defineComponent, ref } from "vue";
-import {
-  IonBadge,
-  IonButton,
-  IonContent,
-  IonCard,
-  IonCardHeader,
-  IonCardSubtitle,
-  IonCardTitle,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonLabel,
-  IonMenuButton,
-  IonNote,
-  IonPage,
-  IonRefresher,
-  IonRefresherContent,
-  IonToolbar,
-  IonTitle,
-  IonInfiniteScroll,
-  IonInfiniteScrollContent,
-  alertController,
-  IonSegment,
-  IonSegmentButton,
-  IonSpinner,
-  isPlatform,
-  modalController,
-  createAnimation
-} from "@ionic/vue";
-import JobConfiguration from '@/components/JobConfiguration.vue'
-import { copyOutline, closeCircleOutline, checkmarkCircleOutline, pencilOutline, optionsOutline, timeOutline, timerOutline } from "ionicons/icons";
-import { Plugins } from '@capacitor/core';
-import { hasError, showToast } from '@/utils'
-import JobHistoryModal from '@/components/JobHistoryModal.vue';
-import { DateTime } from 'luxon';
-import { ProductService } from '@/services/ProductService';
-import { Actions, hasPermission } from '@/authorization'
-import JobReorderModal from '@/components/JobReorderModal.vue';
-import emitter from '@/event-bus';
-
-export default defineComponent({
-  name: "ThresholdUpdates",
-  components: {
-    IonBadge,
-    IonButton,
-    IonContent,
-    IonCard,
-    IonCardHeader,
-    IonCardSubtitle,
-    IonCardTitle,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonItem,
-    IonLabel,
-    IonMenuButton,
-    IonNote,
-    IonPage,
-    IonRefresher,
-    IonRefresherContent,
-    IonToolbar,
-    IonTitle,
-    IonInfiniteScroll,
-    IonInfiniteScrollContent,
-    IonSegment,
-    IonSegmentButton,
-    IonSpinner,
-    JobConfiguration
-  },
-  data() {
-    return {
-      jobFrequencyType: JSON.parse(process.env?.VUE_APP_JOB_FREQUENCY_TYPE as string) as any,
-      jobEnums: [
-        ...JSON.parse(process.env?.VUE_APP_JOB_ENUMS as string) as any
-      ],
-      currentJob: '' as any,
-      title: '',
-      currentJobStatus: '',
-      freqType: '' as any,
-      isJobDetailAnimationCompleted: false,
-      isDesktop: isPlatform('desktop'),
-      isRetrying: false,
-      productCount: 0
-    }
-  },
-  computed: {
-    ...mapGetters({
-      jobHistory: 'job/getJobHistory',
-      pendingJobs: 'job/getPendingJobs',
-      runningJobs: 'job/getRunningJobs',
-      temporalExpr: 'job/getTemporalExpr',
-      getTags: 'job/getTags',
-      getEnumDescription: 'job/getEnumDescription',
-      getEnumName: 'job/getEnumName',
-      isPendingJobsScrollable: 'job/isPendingJobsScrollable',
-      isRunningJobsScrollable: 'job/isRunningJobsScrollable',
-      isHistoryJobsScrollable: 'job/isHistoryJobsScrollable',
-      products: 'product/getProducts',
-      query: 'job/getThresholdRule'
-    })
-  },
-  mounted(){
-    this.store.dispatch('util/getServiceStatusDesc')
-    emitter.on("productStoreChanged", this.refreshJobs);
-  },
-  unmounted() {
-    emitter.off("productStoreChanged", this.refreshJobs);
-  },
-  methods: {
-    getJobExecutionTime(startTime: any, endTime: any){
-      if (startTime && endTime) {
-        const timeDiff = DateTime.fromMillis(endTime).diff( DateTime.fromMillis(startTime))
-        const hours =  timeDiff.hours
-        const minutes = timeDiff.minutes
-        const seconds =  timeDiff
-        let format = ""
-        if(hours) format += "hh 'hr' "
-        if(minutes) format += "mm 'min' "
-        if(seconds) format += "ss 'sec'"
-        if (format) return timeDiff.toFormat(format);
-      }
-      return
-    },
-    async copyJobInformation(job: any) {
-      const { Clipboard } = Plugins;
-      const jobDetails = `jobId: ${job.jobId}, jobName: ${this.getEnumName(job.systemJobEnumId)}, jobDescription: ${this.getEnumDescription(job.systemJobEnumId)}`;
-
-      await Clipboard.write({
-        string: jobDetails
-      }).then(() => {
-        showToast(this.$t("Copied job details to clipboard"));
-      })
-    },
-    async viewJobHistory(job: any) {
-      const jobHistoryModal = await modalController.create({
-        component: JobHistoryModal,
-        componentProps: { currentJob: job }
-      });
-      return jobHistoryModal.present();
-    },
-    getTime (time: any) {
-      return DateTime.fromMillis(time).toLocaleString(DateTime.TIME_SIMPLE);
-    },
-    timeFromNow (time: any) {
-      const timeDiff = DateTime.fromMillis(time).diff(DateTime.local());
-      return DateTime.local().plus(timeDiff).toRelative();
-    },
-    async loadMoreJobHistory(event: any){
-      this.getJobHistory(
-        undefined,
-        Math.ceil(this.jobHistory.length / (process.env.VUE_APP_VIEW_SIZE as any)).toString()
-      ).then(() => {
-        event.target.complete();
-      })
-    },
-    async loadMoreRunningJobs(event: any){
-      this.getRunningJobs(
-        undefined,
-        Math.ceil(this.runningJobs.length / (process.env.VUE_APP_VIEW_SIZE as any)).toString()
-      ).then(() => {
-        event.target.complete();
-      })
-    },
-    async loadMorePendingJobs (event: any) {
-      this.getPendingJobs(
-        undefined,
-        Math.ceil(this.pendingJobs.length / (process.env.VUE_APP_VIEW_SIZE as any)).toString()
-      ).then(() => {
-        event.target.complete();
-      })
-    },
-    async refreshJobs(event: any, isRetrying = false) {
-      this.isRetrying = isRetrying;
-      if(this.segmentSelected === 'pending') {
-        this.store.dispatch('job/fetchPendingJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums}).then(() => {
-          if(event) event.target.complete();
-          this.isRetrying = false;
-        });
-      } else if(this.segmentSelected === 'running') {
-        this.store.dispatch('job/fetchRunningJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums}).then(() => {
-          if(event) event.target.complete();
-          this.isRetrying = false;
-        });
-      } else {
-        this.store.dispatch('job/fetchJobHistory', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums}).then(() => {
-          if(event) event.target.complete();
-          this.isRetrying = false;
-        });
-      }
-    },
-    segmentChanged (e: CustomEvent) {
-      this.segmentSelected = e.detail.value
-      this.segmentSelected === 'pending' ? this.store.dispatch('job/fetchPendingJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums}) : 
-      this.segmentSelected === 'running' ? this.store.dispatch('job/fetchRunningJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums}) :
-      this.store.dispatch('job/fetchJobHistory', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums});
-    },
-    async skipJob (job: any) {
-      const alert = await alertController
-        .create({
-          header: this.$t('Skip job'),
-          message: this.$t('Skipping will run this job at the next occurrence based on the temporal expression.'),
-          buttons: [
-            {
-              text: this.$t("Don't skip"),
-              role: 'cancel',
-            },
-            {
-              text: this.$t('Skip'),
-              handler: async () => {
-                await this.store.dispatch('job/skipJob', job);
-                await this.store.dispatch('job/fetchPendingJobs', {viewIndex: 0, jobEnums: this.jobEnums})
-              },
-            }
-          ]
-        });
-      return alert.present();
-    },
-    async getPendingJobs(vSize: any, vIndex: any) {
-      const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
-      const viewIndex = vIndex ? vIndex : 0;
-      await this.store.dispatch('job/fetchPendingJobs', {viewSize, viewIndex, jobEnums: this.jobEnums});
-    },
-    async getRunningJobs(vSize: any, vIndex: any) {
-      const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
-      const viewIndex = vIndex ? vIndex : 0;
-      await this.store.dispatch('job/fetchRunningJobs', {viewSize, viewIndex, jobEnums: this.jobEnums});
-    },
-    async getJobHistory(vSize: any, vIndex: any) {
-      const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
-      const viewIndex = vIndex ? vIndex : 0;
-      await this.store.dispatch('job/fetchJobHistory', {viewSize, viewIndex, jobEnums: this.jobEnums});
-    },
-    async cancelJob(job: any){
-      const alert = await alertController
-        .create({
-          header: this.$t('Cancel job'),
-          message: this.$t('Canceling this job will cancel this occurrence and all following occurrences. This job will have to be re-enabled manually to run it again.'),
-          buttons: [
-            {
-              text: this.$t("DON'T CANCEL"),
-              role: 'cancel',
-            },
-            {
-              text: this.$t("CANCEL"),
-              handler: async () => {
-                const resp = await this.store.dispatch('job/cancelJob', job);
-                if(resp.status == 200 && !hasError(resp) && resp.data.successMessage) {
-                  this.store.dispatch('job/fetchPendingJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums})
-                }
-              },
-            }
-          ],
-        });
-
-       return alert.present();
-    },    
-    viewJobConfiguration(job: any) {
-      if(!this.isDesktop) {
-        return;
-      }
-      // For Jobs like Import jobs, we will not have any rule setup
-      if (job.runtimeData?.searchPreferenceId) {
-        const query = JSON.parse(JSON.stringify(this.query(job.runtimeData.searchPreferenceId)))
-        this.getProductCount(query);
-      }
-      this.currentJob = {id: job.jobId, ...job}
-      this.title = this.getEnumName(job.systemJobEnumId)
-      this.currentJobStatus = job.tempExprId
-      const id = this.jobEnums.find((enums) => enums === job.systemJobEnumId)
-      this.freqType = id && (Object.entries(this.jobFrequencyType).find((freq) => freq[0] == id) as any)[1]
-      if (this.currentJob && !this.isJobDetailAnimationCompleted) {
-        this.playAnimation();
-        this.isJobDetailAnimationCompleted = true;
-      }
-    },
-    async getProductCount(query: any){
-      //Passed rows = 0 as we only need product count and not the data
-      query.json.params.rows = 0;
-      try {
-        const resp = await ProductService.getProducts(query);
-        if(resp.status === 200 && !hasError(resp) && resp.data.response){
-          this.productCount = resp.data.response.numFound
-        } else {
-          this.$log.error(resp);
-          this.productCount = 0;
-        } 
-      } catch (err) {
-        this.$log.error(err);
-        this.productCount = 0;
-      }
-    },
-    playAnimation() {
-      const aside = this.$el.querySelector('aside') as Element
-      const main = document.querySelector('main') as Element
-
-      const revealAnimation = createAnimation()
-        .addElement(aside)
-        .duration(1500)
-        .easing('ease')
-        .keyframes([
-          { offset: 0, flex: '0', opacity: '0' },
-          { offset: 0.5, flex: '1', opacity: '0' },
-          { offset: 1, flex: '1', opacity: '1' }
-        ])
-
-      const gapAnimation = createAnimation()
-        .addElement(main)
-        .duration(500)
-        .fromTo('gap', '0', 'var(--spacer-2xl)');
-
-      createAnimation()
-        .addAnimation([gapAnimation, revealAnimation])
-        .play();
-    },
-    async openReorderModal() {
-      const jobReorderModal = await modalController.create({
-        component: JobReorderModal,
-        componentProps: { jobs: this.pendingJobs.filter((job: any) => job.systemJobEnumId === 'JOB_EXP_PROD_THRSHLD')} // passing export jobs, as we will only reorder export threshold jobs
-      })
-      jobReorderModal.onDidDismiss().then((result: any) => {
-        if (result?.data?.isJobsUpdated) {
-          this.store.dispatch('job/fetchPendingJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums});
-        }
-      })
-      return jobReorderModal.present();
-    }
-  },
-  ionViewWillEnter() {
-    // reassigning current job when entering in the view to not display the job config component if previously opened
-    this.currentJob = undefined
-    this.isJobDetailAnimationCompleted = false
-    if (this.segmentSelected === 'pending') {
-      this.store.dispatch('job/fetchPendingJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums})
-    } else if (this.segmentSelected === 'running') {
-      this.store.dispatch('job/fetchRunningJobs', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums})
-    } else {
-      this.store.dispatch('job/fetchJobHistory', {viewSize:process.env.VUE_APP_VIEW_SIZE, viewIndex:0, jobEnums: this.jobEnums});
-    }
-  },
-  setup() {
-    const store = useStore();
-    const segmentSelected = ref('pending');
-
-    return {
-      Actions,
-      copyOutline,
-      hasPermission,
-      store,
-      closeCircleOutline,
-      checkmarkCircleOutline,
-      pencilOutline,
-      optionsOutline,
-      timeOutline,
-      timerOutline,
-      segmentSelected
-    };
-  }
-});
-</script>
-
-<style scoped>
-ion-card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding-bottom: 0px;
-}
-
-ion-card-header :last-child {
-  display: flex;
-  flex-direction: column;
-  align-items: end;
-  row-gap: 4px;
-}
-
-ion-item {
-  --background: transparent;
-}
-
-aside {
-  position: sticky;
-  top: var(--spacer-lg);
-}
-
-.actions {
-  display: flex;
-  justify-content: space-between;
-}
-
-@media (min-width: 991px) {
-  ion-header{
-    display: flex;
-  }
-
-  main {
-    display: flex;
-    justify-content: center;
-    align-items: start;
-    gap: var(--spacer-2xl);
-    max-width: 990px;
-    margin: var(--spacer-base) auto 0;
-  } 
-
-  main > section {
-    max-width: 50ch;
-  } 
-
-  aside {
-    width: 0px;
-    opacity: 0;
-  }
-}
-</style>
diff --git a/src/views/TimezoneModal.vue b/src/views/TimezoneModal.vue
index 0e8918a1..8cfed970 100644
--- a/src/views/TimezoneModal.vue
+++ b/src/views/TimezoneModal.vue
@@ -6,40 +6,45 @@
           <ion-icon :icon="close" />
         </ion-button>
       </ion-buttons>
-      <ion-title>{{ $t("Select time zone") }}</ion-title>
+      <ion-title>{{ translate("Select time zone") }}</ion-title>
     </ion-toolbar>
     <ion-toolbar>
-      <ion-searchbar @ionFocus="selectSearchBarText($event)" :placeholder="$t('Search time zones')"  v-model="queryString" v-on:keyup.enter="queryString = $event.target.value; findTimeZone()" />
+      <ion-searchbar @ionFocus="selectSearchBarText($event)" :placeholder="translate('Search time zones')"  v-model="queryString" v-on:keyup.enter="queryString = $event.target.value; findTimeZone()" />
     </ion-toolbar>
   </ion-header>
 
   <ion-content class="ion-padding">
-    <!-- Empty state -->
-    <div class="empty-state" v-if="filteredTimeZones.length === 0">
-      <p>{{ $t("No time zone found")}}</p>
+    <div class="empty-state" v-if="isLoading">
+      <ion-item lines="none">
+        <ion-spinner name="crescent" slot="start" />
+        {{ translate("Fetching time zones") }}
+      </ion-item>
+    </div>
+    <div class="empty-state" v-else-if="!filteredTimeZones.length">
+      <p>{{ translate("No time zone found") }}</p>
     </div>
 
     <!-- Timezones -->
     <div v-else>
       <ion-list>
         <ion-radio-group value="rd" v-model="timeZoneId">
-          <ion-item  v-bind:key="timeZone.id" v-for="timeZone in filteredTimeZones">
+          <ion-item :key="timeZone.id" v-for="timeZone in filteredTimeZones">
             <ion-label>{{ timeZone.label }} ({{ timeZone.id }})</ion-label>
-            <ion-radio :value="timeZone.id" slot="start"></ion-radio>
+            <ion-radio slot="start" :value="timeZone.id" />
           </ion-item>
         </ion-radio-group>
       </ion-list>
     </div>
     
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button :disabled="!timeZoneId" @click="saveAlert">
+      <ion-fab-button :disabled="!timeZoneId" @click="setUserTimeZone">
         <ion-icon :icon="save" />
       </ion-fab-button>
     </ion-fab>
   </ion-content>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
 import { 
   IonButtons,
   IonButton,
@@ -49,119 +54,75 @@ import {
   IonHeader,
   IonItem,
   IonIcon,
-  IonLabel,
-  IonList,
   IonRadioGroup,
   IonRadio,
+  IonList,
   IonSearchbar,
+  IonSpinner,
   IonTitle,
   IonToolbar,
   modalController,
-  alertController } from "@ionic/vue";
-import { defineComponent } from "vue";
+} from "@ionic/vue";
+import { onBeforeMount, ref } from "vue";
 import { close, save } from "ionicons/icons";
 import { useStore } from "@/store";
 import { UserService } from "@/services/UserService";
-import { hasError } from '@/utils'
-import { DateTime } from 'luxon';
+import { hasError } from "@/utils"
+import { DateTime } from "luxon";
+import { translate } from "@/i18n"
 
-export default defineComponent({
-  name: "TimeZoneModal",
-  components: { 
-    IonButtons,
-    IonButton,
-    IonContent,
-    IonFab,
-    IonFabButton,
-    IonHeader,
-    IonIcon,
-    IonItem,
-    IonLabel,
-    IonList,
-    IonRadioGroup,
-    IonRadio,
-    IonSearchbar,
-    IonTitle,
-    IonToolbar 
-  },
-  data() {
-    return {
-      queryString: '',
-      filteredTimeZones: [],
-      timeZones: [],
-      timeZoneId: ''
-    }
-  },
-  methods: {
-    closeModal() {
-      modalController.dismiss({ dismissed: true });
-    },
-    async saveAlert() {
-      const message = this.$t("Are you sure you want to change the time zone to?", { timeZoneId: this.timeZoneId });
-      const alert = await alertController.create({
-        header: this.$t("Update time zone"),
-        message,
-        buttons: [
-          {
-            text: this.$t("Cancel"),
-          },
-          {
-            text: this.$t("Confirm"),
-            handler: () => {
-              this.setUserTimeZone();
-            }
-          }
-        ],
-      });
-      return alert.present();
-    },
-    escapeRegExp(text: string) {
-      //TODO Handle it in a better way
-      // Currently when the user types special character as it part of Regex expressions it breaks the code
-      // so removed the characters for now
-      return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&');
-    },
-    findTimeZone() { 
-      const regularExp = new RegExp(`${this.escapeRegExp(this.queryString)}`, 'i');
+const store = useStore();
+let queryString = ref("")
+let filteredTimeZones = ref([])
+let timeZones = ref([])
+let timeZoneId = ref("")
+let isLoading = ref(true)
+
+onBeforeMount(() => {
+  getAvailableTimeZones();
+})
 
-      this.filteredTimeZones = this.timeZones.filter((timeZone: any) => {
-        return regularExp.test(timeZone.id) || regularExp.test(timeZone.label);
+function closeModal() {
+  modalController.dismiss({ dismissed: true });
+}
+
+function escapeRegExp(text: string) {
+  //TODO Handle it in a better way
+  // Currently when the user types special character as it part of Regex expressions it breaks the code
+  // so removed the characters for now
+  return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
+}
+
+function findTimeZone() { 
+  const regularExp = new RegExp(`${escapeRegExp(queryString.value)}`, "i");
+  filteredTimeZones.value = timeZones.value.filter((timeZone: any) => {
+    return regularExp.test(timeZone.id) || regularExp.test(timeZone.label);
+  });
+}
+
+function getAvailableTimeZones() {
+  UserService.getAvailableTimeZones().then((resp: any) => {
+    if (resp.status === 200 && !hasError(resp)) {
+      timeZones.value = resp.data.timeZones.filter((timeZone: any) => {
+        return DateTime.local().setZone(timeZone.id).isValid;
       });
-    },
-    async getAvailableTimeZones() {
-      UserService.getAvailableTimeZones().then((resp: any) => {
-        if(resp.status === 200 && !hasError(resp)) {
-          // We are filtering valid the timeZones coming with response here
-          this.timeZones = resp.data.filter((timeZone: any) => {
-            return DateTime.local().setZone(timeZone.id).isValid;
-          });
-          this.findTimeZone();
-        }
-      })
-    },
-    selectSearchBarText(event: any) {
-      event.target.getInputElement().then((element: any) => {
-        element.select();
-      })
-    },
-    async setUserTimeZone() {
-      return this.store.dispatch("user/setUserTimeZone", {
-        "tzId": this.timeZoneId
-      }).then(() => {
-        this.closeModal()
-      })
+      findTimeZone();
     }
-  },
-  beforeMount () {
-    this.getAvailableTimeZones();
-  },
-  setup() {
-    const store = useStore();
-    return {
-      close,
-      save,
-      store
-    };
-  }
-});
+    isLoading.value = false;
+  })
+}
+
+function selectSearchBarText(event: any) {
+  event.target.getInputElement().then((element: any) => {
+    element.select();
+  })
+}
+
+async function setUserTimeZone() {
+  return store.dispatch("user/setUserTimeZone", {
+    "tzId": timeZoneId.value
+  }).then(() => {
+    closeModal()
+  })
+}
 </script>

From 89a54166f26655a7bac4606cb76132c8779c4d05 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 5 Apr 2024 16:59:16 +0530
Subject: [PATCH 019/250] Improved: code for better login flow (#246)

---
 src/components/Menu.vue             | 35 +++++++++++++++++++++++++++++
 src/services/UserService.ts         | 35 +++++++++++++----------------
 src/store/modules/user/actions.ts   |  1 +
 src/store/modules/user/mutations.ts |  3 ---
 src/views/TimezoneModal.vue         |  2 +-
 5 files changed, 53 insertions(+), 23 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 0eeba0d4..d5294143 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -20,12 +20,33 @@
         </ion-menu-toggle>
       </ion-list>
     </ion-content>
+    <ion-footer>
+      <ion-toolbar>
+        <ion-item lines="none">
+          <ion-label class="ion-text-wrap">
+            <p class="overline">{{ instanceUrl }}</p>
+          </ion-label>
+          <ion-note slot="end">{{ userProfile?.timeZone }}</ion-note>
+        </ion-item>
+        <ion-item v-if="userProfile?.stores?.length > 1" lines="none">
+          <ion-select interface="popover" :value="eComStore.productStoreId" @ionChange="setEComStore($event)">
+            <ion-select-option v-for="store in (userProfile?.stores ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName }}</ion-select-option>
+          </ion-select>
+        </ion-item>
+        <ion-item v-else lines="none">
+          <ion-label class="ion-text-wrap">
+            {{ eComStore.storeName }}
+          </ion-label>
+        </ion-item>
+      </ion-toolbar>
+    </ion-footer>
   </ion-menu>
 </template>
   
 <script lang="ts">
   import {
     IonContent,
+    IonFooter,
     IonHeader,
     IonIcon,
     IonItem,
@@ -33,6 +54,9 @@
     IonList,
     IonMenu,
     IonMenuToggle,
+    IonNote,
+    IonSelect,
+    IonSelectOption,
     IonTitle,
     IonToolbar,
   } from "@ionic/vue";
@@ -46,6 +70,7 @@
     name: "Menu",
     components: {
       IonContent,
+      IonFooter,
       IonHeader,
       IonIcon,
       IonItem,
@@ -53,16 +78,26 @@
       IonList,
       IonMenu,
       IonMenuToggle,
+      IonNote,
+      IonSelect,
+      IonSelectOption,
       IonTitle,
       IonToolbar
     },
     computed: {
       ...mapGetters({
         isUserAuthenticated: 'user/isUserAuthenticated',
+        eComStore: 'user/getCurrentEComStore',
         instanceUrl: 'user/getInstanceUrl',
+        userProfile: 'user/getUserProfile',
       })
     },
     methods: {
+      async setEComStore(event: CustomEvent) {
+        if(this.eComStore.productStoreId !== event.detail.value) {
+          await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
+        }
+      },
       getValidMenuItems(appPages: any) {
         return appPages.filter((appPage: any) => (!appPage.meta || !appPage.meta.permissionId));
       }
diff --git a/src/services/UserService.ts b/src/services/UserService.ts
index 7aa87e0c..065d50cb 100644
--- a/src/services/UserService.ts
+++ b/src/services/UserService.ts
@@ -26,10 +26,7 @@ const login = async (username: string, password: string): Promise <any> => {
 }
 
 const getUserProfile = async (token: any): Promise<any> => {
-  console.log('sdo');
   const baseURL = store.getters["user/getBaseUrl"];
-  console.log(baseURL);
-  
   try {
     const resp = await client({
       url: "user/profile",
@@ -47,6 +44,22 @@ const getUserProfile = async (token: any): Promise<any> => {
   }
 }
 
+const getAvailableTimeZones = async (): Promise <any>  => {
+  return api({
+    url: "user/getAvailableTimeZones",
+    method: "get",
+    cache: true
+  });
+}
+
+const setUserTimeZone = async (payload: any): Promise <any>  => {
+  return api({
+    url: "setUserTimeZone",
+    method: "post",
+    data: payload
+  });
+}
+
 const getEComStores = async (token: any): Promise<any> => {
   try {
     const baseURL = store.getters["user/getBaseUrl"];
@@ -70,22 +83,6 @@ const getEComStores = async (token: any): Promise<any> => {
   }
 }
 
-const getAvailableTimeZones = async (): Promise <any>  => {
-  return api({
-    url: "user/getAvailableTimeZones",
-    method: "get",
-    cache: true
-  });
-}
-
-const setUserTimeZone = async (payload: any): Promise <any>  => {
-  return api({
-    url: "setUserTimeZone",
-    method: "post",
-    data: payload
-  });
-}
-
 export const UserService = {
   getAvailableTimeZones,
   getEComStores,
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index d424752c..1897208c 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -9,6 +9,7 @@ import logger from "@/logger";
 import emitter from '@/event-bus'
 import { Settings } from "luxon"
 
+
 const actions: ActionTree<UserState, RootState> = {
 
   /**
diff --git a/src/store/modules/user/mutations.ts b/src/store/modules/user/mutations.ts
index e91a0dee..1813dcb0 100644
--- a/src/store/modules/user/mutations.ts
+++ b/src/store/modules/user/mutations.ts
@@ -17,9 +17,6 @@ const mutations: MutationTree <UserState> = {
     [types.USER_INSTANCE_URL_UPDATED] (state, payload) {
         state.instanceUrl = payload;
     },
-    [types.USER_INFO_UPDATED] (state, payload) {
-        state.current = payload
-    },
     [types.USER_CURRENT_ECOM_STORE_UPDATED] (state, payload) {
         state.currentEComStore = payload;
     },
diff --git a/src/views/TimezoneModal.vue b/src/views/TimezoneModal.vue
index 8cfed970..b0097b87 100644
--- a/src/views/TimezoneModal.vue
+++ b/src/views/TimezoneModal.vue
@@ -30,7 +30,7 @@
         <ion-radio-group value="rd" v-model="timeZoneId">
           <ion-item :key="timeZone.id" v-for="timeZone in filteredTimeZones">
             <ion-label>{{ timeZone.label }} ({{ timeZone.id }})</ion-label>
-            <ion-radio slot="start" :value="timeZone.id" />
+            <ion-radio :value="timeZone.id" slot="start" />
           </ion-item>
         </ion-radio-group>
       </ion-list>

From af82c618996d5a6f90b2bc84c76151e4f68cc6cc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 09:46:06 +0530
Subject: [PATCH 020/250] Improved: removed unused imports and added code to be
 called on login (#246)

---
 src/App.vue         | 7 +++++++
 src/router/index.ts | 4 ----
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 00ae8f1d..222369c7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -13,6 +13,7 @@ import { options, settings, pulseOutline } from 'ionicons/icons';
 import emitter from "@/event-bus"
 import { useRouter } from 'vue-router';
 import { mapGetters, useStore } from 'vuex';
+import { Settings } from 'luxon'
 import Menu from '@/components/Menu.vue';
 
 export default defineComponent({
@@ -30,6 +31,7 @@ export default defineComponent({
   computed: {
     ...mapGetters({
       instanceUrl: 'user/getInstanceUrl',
+      userProfile: 'user/getUserProfile',
       userToken: 'user/getUserToken',
       isAuthenticated: 'user/isAuthenticated',
     })
@@ -65,6 +67,11 @@ export default defineComponent({
     });
     emitter.on('presentLoader', this.presentLoader);
     emitter.on('dismissLoader', this.dismissLoader);
+
+    if (this.userProfile) {
+    // Luxon timezone should be set with the user's selected timezone
+    this.userProfile.timeZone && (Settings.defaultZone = this.userProfile.timeZone);
+  }
   },
   unmounted() {
     emitter.off('presentLoader', this.presentLoader);
diff --git a/src/router/index.ts b/src/router/index.ts
index 372e5fdc..d0dbaa8d 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -2,12 +2,8 @@ import { createRouter, createWebHistory } from '@ionic/vue-router';
 import { RouteRecordRaw } from 'vue-router';
 import Settings from "@/views/Settings.vue"
 import store from '@/store'
-import { showToast } from '@/utils'
-import { translate } from '@/i18n'
 import Login from '@/views/Login.vue'
-
 import 'vue-router'
-import { loader } from '@/user-utils';
 
 // Defining types for the meta values
 declare module 'vue-router' {

From b650718391897f81e88578b3ac978862c7155a31 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 10:14:11 +0530
Subject: [PATCH 021/250] Improved: added missing translation entry in locales
 (#246)

---
 src/locales/en.json         | 5 +++--
 src/views/TimezoneModal.vue | 1 +
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index da8b1691..8f4ace56 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -5,7 +5,7 @@
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
   "Authenticating": "Authenticating",
   "Blank": "Blank",
-  "Built: ": "Built: {builtDateTime}",
+  "Built:": "Built:",
   "Cancel": "Cancel",
   "CANCEL": "CANCEL",
   "Canceling this job will cancel this occurrence and all following occurrences. This job will have to be re-enabled manually to run it again.": "Canceling this job will cancel this occurrence and all following occurrences. This job will have to be re-enabled manually to run it again.",
@@ -39,6 +39,7 @@
   "Failed": "Failed",
   "Failed to update some jobs": "Failed to update some jobs",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
+  "Fetching time zones": "Fetching time zones",
   "Go to Launchpad": "Go to Launchpad",
   "Go to OMS": "Go to OMS",
   "History": "History",
@@ -163,7 +164,7 @@
   "Username": "Username",
   "virtual, ": "virtual, ",
   "variants": "variants",
-  "Version: ": "Version: {appVersion}",
+  "Version:": "Version:",
   "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems": "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems",
   "You do not have permission to access this page": "You do not have permission to access this page",
   "You do not have permission to access the app.": "You do not have permission to access the app."
diff --git a/src/views/TimezoneModal.vue b/src/views/TimezoneModal.vue
index b0097b87..cae0d016 100644
--- a/src/views/TimezoneModal.vue
+++ b/src/views/TimezoneModal.vue
@@ -54,6 +54,7 @@ import {
   IonHeader,
   IonItem,
   IonIcon,
+  IonLabel,
   IonRadioGroup,
   IonRadio,
   IonList,

From f6bdacb52b1d2a6c5526acf6df94948fece0be78 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 10:20:56 +0530
Subject: [PATCH 022/250] Improved: logic and intendation for the code to
 update luxon timezone with user selected timezone (#246)

---
 src/App.vue | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 222369c7..b91d89a0 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -68,10 +68,11 @@ export default defineComponent({
     emitter.on('presentLoader', this.presentLoader);
     emitter.on('dismissLoader', this.dismissLoader);
 
-    if (this.userProfile) {
-    // Luxon timezone should be set with the user's selected timezone
-    this.userProfile.timeZone && (Settings.defaultZone = this.userProfile.timeZone);
-  }
+    // Handles case when user resumes or reloads the app
+    // Luxon timezzone should be set with the user's selected timezone
+    if (this.userProfile && this.userProfile.userTimeZone) {
+      Settings.defaultZone = this.userProfile.userTimeZone;
+    }
   },
   unmounted() {
     emitter.off('presentLoader', this.presentLoader);

From 855442c08aa43f912e703423f876ed7d2fe5b731 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 10:25:39 +0530
Subject: [PATCH 023/250] Improved: removed permissions check from the pages in
 menu (#246)

---
 src/components/Menu.vue | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index d5294143..cdd27ad4 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -7,7 +7,7 @@
     </ion-header>
     <ion-content>
       <ion-list>
-        <ion-menu-toggle auto-hide="false" v-for="(page, index) in getValidMenuItems(appPages)" :key="index">
+        <ion-menu-toggle auto-hide="false" v-for="(page, index) in appPages" :key="index">
           <ion-item 
             button
             router-direction="root"
@@ -97,9 +97,6 @@
         if(this.eComStore.productStoreId !== event.detail.value) {
           await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
         }
-      },
-      getValidMenuItems(appPages: any) {
-        return appPages.filter((appPage: any) => (!appPage.meta || !appPage.meta.permissionId));
       }
     },
     setup() {

From 462d92d662325173f27da05fb68ed9a66d38f863 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 12:19:17 +0530
Subject: [PATCH 024/250] Improved: app to use composition api instead of using
 options api (#247)

---
 src/App.vue              | 120 +++++++++++-----------------
 src/components/Image.vue | 106 +++++++++++--------------
 src/components/Logo.vue  |   8 --
 src/components/Menu.vue  |  91 +++++++--------------
 src/locales/en.json      |   2 +-
 src/views/Settings.vue   | 166 ++++++++++++++-------------------------
 6 files changed, 178 insertions(+), 315 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index b91d89a0..8e604c84 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,90 +5,60 @@
   </ion-app>
 </template>
 
-<script lang="ts">
-import { IonApp, IonRouterOutlet } from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { loadingController } from '@ionic/vue';
-import { options, settings, pulseOutline } from 'ionicons/icons';
+<script setup lang="ts">
+import { IonApp, IonRouterOutlet, loadingController } from '@ionic/vue';
+import { computed, onMounted, onUnmounted, ref } from 'vue';
 import emitter from "@/event-bus"
-import { useRouter } from 'vue-router';
-import { mapGetters, useStore } from 'vuex';
 import { Settings } from 'luxon'
 import Menu from '@/components/Menu.vue';
+import store from "./store";
+import { translate } from './i18n';
 
-export default defineComponent({
-  name: 'App',
-  components: {
-    Menu,
-    IonApp,
-    IonRouterOutlet
-  },
-  data() {
-    return {
-      loader: null as any
-    };
-  },
-  computed: {
-    ...mapGetters({
-      instanceUrl: 'user/getInstanceUrl',
-      userProfile: 'user/getUserProfile',
-      userToken: 'user/getUserToken',
-      isAuthenticated: 'user/isAuthenticated',
-    })
-  },
-  methods: {
-    async presentLoader(options = { message: '', backdropDismiss: true }) {
-      // When having a custom message remove already existing loader
-      if(options.message && this.loader) this.dismissLoader();
 
-      if (!this.loader) {
-        this.loader = await loadingController
-        .create({
-          message: options.message ? this.$t(options.message) : this.$t("Click the backdrop to dismiss."),
-          translucent: true,
-          backdropDismiss: options.backdropDismiss
-        });
-      }
-      this.loader.present();
-    },
-    dismissLoader() {
-      if (this.loader) {
-        this.loader.dismiss();
-        this.loader = null as any;
-      }
-    }
-  },
-  async mounted() {
-    this.loader = await loadingController
+const loader = ref(null) as any
+const userProfile = computed(() => store.getters["user/getUserProfile"])
+
+async function presentLoader(options = { message: '', backdropDismiss: true }) {
+  // When having a custom message remove already existing loader
+  if(options.message && loader.value) dismissLoader();
+
+  if (!loader.value) {
+    loader.value = await loadingController
     .create({
-      message: this.$t("Click the backdrop to dismiss."),
+      message: options.message ? translate(options.message) : translate("Click the backdrop to dismiss."),
       translucent: true,
-      backdropDismiss: true
+      backdropDismiss: options.backdropDismiss
     });
-    emitter.on('presentLoader', this.presentLoader);
-    emitter.on('dismissLoader', this.dismissLoader);
+  }
+  loader.value.present();
+}
 
-    // Handles case when user resumes or reloads the app
-    // Luxon timezzone should be set with the user's selected timezone
-    if (this.userProfile && this.userProfile.userTimeZone) {
-      Settings.defaultZone = this.userProfile.userTimeZone;
-    }
-  },
-  unmounted() {
-    emitter.off('presentLoader', this.presentLoader);
-    emitter.off('dismissLoader', this.dismissLoader);
-  },
-  setup() {
-    const router = useRouter();
-    const store = useStore();
+function dismissLoader() {
+  if (loader.value) {
+    loader.value.dismiss();
+    loader.value = null as any;
+  }
+}
 
-    return {
-      options,
-      pulseOutline,
-      settings,
-      store,
-      router
-    }
+onMounted(async () => {
+  loader.value = await loadingController
+    .create({
+      message: translate("Click the backdrop to dismiss."),
+      translucent: true,
+      backdropDismiss: true
+    });
+  emitter.on('presentLoader', presentLoader);
+  emitter.on('dismissLoader', dismissLoader);
+
+  // Handles case when user resumes or reloads the app
+  // Luxon timezzone should be set with the user's selected timezone
+  if (userProfile.value && userProfile.value.timeZone) {
+    Settings.defaultZone = userProfile.value.userTimeZone;
   }
-});
+})
+
+onUnmounted(() => {
+  emitter.off("presentLoader", presentLoader);
+  emitter.off("dismissLoader", dismissLoader);
+})
 </script>
diff --git a/src/components/Image.vue b/src/components/Image.vue
index aa2fb4e9..3057cf6b 100644
--- a/src/components/Image.vue
+++ b/src/components/Image.vue
@@ -2,68 +2,54 @@
   <img :src="imageUrl"/>
 </template>
 
-<script lang="ts">
-import { defineComponent } from "vue";
+<script setup lang="ts">
+import { defineProps, onMounted, onUpdated, ref } from 'vue';
+import defaultImage from "../assets/images/defaultImage.png";
 
-export default defineComponent({
-  name: "Image",
-  props: ['src'],
-  components: {},
-  created() {
-    if (
-      process.env.VUE_APP_RESOURCE_URL
-    ) {
-      this.resourceUrl = process.env.VUE_APP_RESOURCE_URL;
-    }
-  },
-  mounted() {
-    this.setImageUrl();
-  },
-  updated() {
-    this.setImageUrl();
-  },
-  data() {
-    return {
-      resourceUrl: '',
-      imageUrl: require("@/assets/images/defaultImage.png")
-    }
-  },
-  methods: {
-    checkIfImageExists(src: string) {
-      return new Promise((resolve, reject) => {
-        const img = new Image();
-        img.onload = function () {
-          resolve(true);
-        }
-        img.onerror = function () {
-          reject(false);
-        }
-        img.src = src;
+declare let process: any;
+
+const props = defineProps(['src']);
+let imageUrl = ref(defaultImage);
+let resourceUrl = process.env.VUE_APP_RESOURCE_URL || "";
+
+const setImageUrl = () => {
+  if (props.src) {
+    if (props.src.startsWith('http')) {
+      // If starts with http, it is web url check for existence and assign
+      checkIfImageExists(props.src).then(() => {
+        imageUrl.value = props.src;
+      }).catch(() => {
+        console.error("Image doesn't exist");
+      })
+    } else if (props.src.indexOf('assets/') != -1 || props.src.startsWith('/img/')) {
+      // Assign directly in case of assets or if image starts with /img/ (when url start with /img/ then the img is the local asset url of the app)
+      imageUrl.value = props.src;
+    } else {
+      // Image is from resource server, hence append to base resource url, check for existence and assign
+      const newImageUrl = resourceUrl.concat(props.src)
+      checkIfImageExists(imageUrl.value).then(() => {
+        imageUrl.value = newImageUrl;
+      }).catch(() => {
+        console.error("Image doesn't exist");
       })
-    },
-    setImageUrl() {
-      if (this.src) {
-        if (this.src.indexOf('assets/') != -1) {
-          // Assign directly in case of assets
-          this.imageUrl = this.src;
-        } else if (this.src.startsWith('http')) {
-          // If starts with http, it is web url check for existence and assign
-          this.checkIfImageExists(this.src).then(() => {
-            this.imageUrl = this.src;
-          }).catch(() => {
-            this.$log.warn("Image doesn't exist", this.src);
-          })
-        } else {
-          // Image is from resource server, hence append to base resource url, check for existence and assign
-          const imageUrl = this.resourceUrl.concat(this.src)
-          this.checkIfImageExists(imageUrl).then(() => {
-            this.imageUrl = imageUrl;
-          }).catch(() => {
-            this.$log.warn("Image doesn't exist", imageUrl);
-          })
-        }
-      }
     }
-  },
+  }
+}
+
+const checkIfImageExists = (src: string) => {
+  return new Promise((resolve, reject) => {
+    const img = new Image();
+    img.onload = () => resolve(true);
+    img.onerror = () => reject(false);
+    img.src = src;
+  })
+}
+
+onMounted(() => {
+  setImageUrl();
+})
+
+onUpdated(() => {
+  setImageUrl();
 });
 </script>
diff --git a/src/components/Logo.vue b/src/components/Logo.vue
index 4db063ad..71eba2ff 100644
--- a/src/components/Logo.vue
+++ b/src/components/Logo.vue
@@ -5,14 +5,6 @@
   </figure>
 </template>
 
-<script lang="ts">
-import { defineComponent } from 'vue'
-
-export default defineComponent({
-  name: "Logo",
-})
-</script>
-
 <style scoped>
 .dark {
   display: none;
diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index cdd27ad4..e1004216 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -43,7 +43,7 @@
   </ion-menu>
 </template>
   
-<script lang="ts">
+<script setup lang="ts">
   import {
     IonContent,
     IonFooter,
@@ -60,73 +60,38 @@
     IonTitle,
     IonToolbar,
   } from "@ionic/vue";
-  import { defineComponent, computed } from "vue";
-  import { mapGetters } from "vuex";
+  import { computed } from "vue";
   import { useStore } from "@/store";
   import { useRouter } from "vue-router";
-  import { optionsOutline, settingsOutline, pulseOutline } from 'ionicons/icons';
-  
-  export default defineComponent({
-    name: "Menu",
-    components: {
-      IonContent,
-      IonFooter,
-      IonHeader,
-      IonIcon,
-      IonItem,
-      IonLabel,
-      IonList,
-      IonMenu,
-      IonMenuToggle,
-      IonNote,
-      IonSelect,
-      IonSelectOption,
-      IonTitle,
-      IonToolbar
-    },
-    computed: {
-      ...mapGetters({
-        isUserAuthenticated: 'user/isUserAuthenticated',
-        eComStore: 'user/getCurrentEComStore',
-        instanceUrl: 'user/getInstanceUrl',
-        userProfile: 'user/getUserProfile',
-      })
-    },
-    methods: {
-      async setEComStore(event: CustomEvent) {
-        if(this.eComStore.productStoreId !== event.detail.value) {
-          await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
-        }
-      }
-    },
-    setup() {
-      const store = useStore();
-      const router = useRouter();
-      const appPages = [
-        {
-          title: "Settings",
-          url: "/settings",
-          iosIcon: settingsOutline,
-          mdIcon: settingsOutline
-        }
-      ];
+  import { settingsOutline } from 'ionicons/icons';
 
-      const selectedIndex = computed(() => {
-        const path = router.currentRoute.value.path;
-        return appPages.findIndex((screen) => screen.url === path);
-      });
+  const store = useStore();
+  const router = useRouter();
+  const appPages = [
+    {
+      title: "Settings",
+      url: "/settings",
+      iosIcon: settingsOutline,
+      mdIcon: settingsOutline
+    }
+  ];
 
-      return {
-        appPages,
-        router,
-        pulseOutline,
-        optionsOutline,
-        settingsOutline,
-        selectedIndex,
-        store,
-      };
-    },
+  const userProfile = computed(() => store.getters["user/getUserProfile"])
+  const isUserAuthenticated = computed(() => store.getters["user/isUserAuthenticated"])
+  const eComStore = computed(() => store.getters["user/getCurrentEComStore"])
+  const instanceUrl = computed(() => store.getters["user/getInstanceUrl"])
+  const selectedIndex = computed(() => {
+    const path = router.currentRoute.value.path;
+    return appPages.findIndex((screen) => screen.url === path);
   });
+
+  function setEComStore(event: CustomEvent) {
+    if(userProfile.value?.stores) {
+      store.dispatch("user/setEcomStore", {
+        "productStoreId": event.detail.value
+      })
+    }
+  }
   </script>
   
   <style scoped>
diff --git a/src/locales/en.json b/src/locales/en.json
index 8f4ace56..0d7b0ea2 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -57,7 +57,7 @@
   "Last run": "Last run",
   "Loading": "Loading",
   "Login": "Login",
-  "Logging in": "Logging in",
+  "Logging in...": "Logging in...",
   "Logging out": "Logging out",
   "Logout": "Logout",
   "Make sure you have saved your changes. All unsaved changes to this rule will be lost.": "Make sure you have saved your changes. All unsaved changes to this rule will be lost.",
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index d92647e9..c95eaae2 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-menu-button slot="start" />
-        <ion-title>{{ $t("Settings") }}</ion-title>
+        <ion-title>{{ translate("Settings") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
@@ -22,27 +22,27 @@
               <ion-card-title>{{ userProfile?.userFullName }}</ion-card-title>
             </ion-card-header>
           </ion-item>
-          <ion-button color="danger" @click="logout()">{{ $t("Logout") }}</ion-button>
+          <ion-button color="danger" @click="logout()">{{ translate("Logout") }}</ion-button>
         </ion-card>
       </div>
       <div class="section-header">
-        <h1>{{ $t('OMS') }}</h1>
+        <h1>{{ translate('OMS') }}</h1>
       </div>
       <section>
         <ion-card>
           <ion-card-header>
             <ion-card-subtitle>
-              {{ $t('OMS instance') }}
+              {{ translate('OMS instance') }}
             </ion-card-subtitle>
             <ion-card-title>
               {{ oms }}
             </ion-card-title>
           </ion-card-header>
           <ion-card-content>
-            {{ $t('This is the name of the OMS you are connected to right now. Make sure that you are connected to the right instance before proceeding.') }}
+            {{ translate('This is the name of the OMS you are connected to right now. Make sure that you are connected to the right instance before proceeding.') }}
           </ion-card-content>
           <ion-button @click="goToOms()" fill="clear">
-            {{ $t('Go to OMS') }}
+            {{ translate('Go to OMS') }}
             <ion-icon slot="end" :icon="openOutline" />
           </ion-button>
         </ion-card>
@@ -50,17 +50,17 @@
         <ion-card>
           <ion-card-header>
             <ion-card-subtitle>
-              {{ $t("Product Store") }}
+              {{ translate("Product Store") }}
             </ion-card-subtitle>
             <ion-card-title>
-              {{ $t("Store") }}
+              {{ translate("Store") }}
             </ion-card-title>
           </ion-card-header>
           <ion-card-content>
-            {{ $t('A store repesents a company or a unique catalog of products. If your OMS is connected to multiple eCommerce stores sellling different collections of products, you may have multiple Product Stores set up in HotWax Commerce.') }}
+            {{ translate('A store repesents a company or a unique catalog of products. If your OMS is connected to multiple eCommerce stores sellling different collections of products, you may have multiple Product Stores set up in HotWax Commerce.') }}
           </ion-card-content>
           <ion-item lines="none">
-            <ion-label>{{ $t("Select store") }}</ion-label>
+            <ion-label>{{ translate("Select store") }}</ion-label>
             <ion-select interface="popover" :value="currentEComStore.productStoreId" @ionChange="setEComStore($event)">
               <ion-select-option v-for="store in (userProfile ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName }}</ion-select-option>
             </ion-select>
@@ -81,11 +81,11 @@
         <ion-card>
           <ion-card-header>
             <ion-card-title>
-              {{ $t('Timezone') }}
+              {{ translate('Timezone') }}
             </ion-card-title>
           </ion-card-header>
           <ion-card-content>
-            {{ $t('The timezone you select is used to ensure automations you schedule are always accurate to the time you select.') }}
+            {{ translate('The timezone you select is used to ensure automations you schedule are always accurate to the time you select.') }}
           </ion-card-content>
           <ion-item lines="none">
             <ion-label> {{ userProfile && userProfile.timeZone ? userProfile.timeZone : '-' }} </ion-label>
@@ -97,111 +97,61 @@
   </ion-page>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
 import {  IonAvatar, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonMenuButton, IonPage, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController } from '@ionic/vue';
-import { defineComponent } from 'vue';
-import { codeWorkingOutline, ellipsisVertical, globeOutline, openOutline, personCircleOutline, storefrontOutline, timeOutline } from 'ionicons/icons'
-import { mapGetters, useStore } from 'vuex';
+import { computed, onMounted, ref } from 'vue';
+import { openOutline } from 'ionicons/icons'
+import { useStore } from 'vuex';
 import { useRouter } from 'vue-router';
 import TimeZoneModal from '@/views/TimezoneModal.vue';
 import Image from '@/components/Image.vue'
 import { DateTime } from "luxon";
 import { translate } from '@/i18n';
 
-export default defineComponent({
-  name: 'Settings',
-  components: {
-    IonAvatar,
-    IonButton, 
-    IonCard,
-    IonCardContent,
-    IonCardHeader,
-    IonCardSubtitle,
-    IonCardTitle,
-    IonContent, 
-    IonHeader, 
-    IonIcon,
-    IonItem, 
-    IonLabel, 
-    IonMenuButton,
-    IonPage, 
-    IonSelect, 
-    IonSelectOption,
-    IonTitle, 
-    IonToolbar,
-    Image
-  },
-  data() {
-    return {
-      baseURL: process.env.VUE_APP_BASE_URL,
-      appVersion: '',
-      appInfo: process.env.VUE_APP_VERSION_INFO ? JSON.parse(process.env.VUE_APP_VERSION_INFO) : {} as any
-    };
-  },
-  computed: {
-    ...mapGetters({
-      userProfile: 'user/getUserProfile',
-      currentEComStore: 'user/getCurrentEComStore',
-      oms: 'user/getInstanceUrl',
-      token: 'user/user/getUserToken',
-    })
-  },
-  methods: {
-    setEComStore(event: any) {
-      // If the value is same, no need to update
-      // Handled case for programmatical changes
-      // https://github.com/ionic-team/ionic-framework/discussions/25532
-      // https://github.com/ionic-team/ionic-framework/issues/20106
-      // https://github.com/ionic-team/ionic-framework/pull/25858
-      if(this.userProfile?.stores && this.currentEComStore?.productStoreId !== event.detail.value) {
-        this.store.dispatch('user/setEcomStore', {
-          'productStoreId': event.detail.value
-        })
-      }
-    },
-    async changeTimeZone() {
-      const timeZoneModal = await modalController.create({
-        component: TimeZoneModal,
-      });
-      return timeZoneModal.present();
-    },
-    logout() {
-      this.store.dispatch("user/logout").then(() => {
-        this.router.push("/login");
-      })
-    },
-    goToLaunchpad() {
-      window.location.href = `${process.env.VUE_APP_LOGIN_URL}`
-    },
-    getDateTime(time: any) {
-      return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "";
-    },
-    goToOms() {
-      const link = (this.oms.startsWith('http') ? this.oms.replace(/\/api\/?|\/$/, "") : `https://${this.oms}.hotwax.io`) + `/qapps?token=${this.token}`
-      window.open(link, '_blank', 'noopener, noreferrer')
-    }
-  },
-  mounted() {
-    this.appVersion = this.appInfo.branch ? (this.appInfo.branch + "-" + this.appInfo.revision) : this.appInfo.tag;
-  },
-  setup(){
-    const store = useStore();
-    const router = useRouter();
 
-    return {
-      codeWorkingOutline,
-      ellipsisVertical,
-      globeOutline,
-      personCircleOutline,
-      storefrontOutline,
-      store,
-      router,
-      timeOutline,
-      translate,
-      openOutline
-    }
+const store = useStore()
+const router = useRouter()
+const appVersion = ref("")
+const appInfo = (process.env.VUE_APP_VERSION_INFO ? JSON.parse(process.env.VUE_APP_VERSION_INFO) : {}) as any
+
+const userProfile = computed(() => store.getters["user/getUserProfile"])
+const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const token = computed(() => store.getters["user/getUserToken"])
+const oms = computed(() => store.getters["user/getInstanceUrl"])
+
+onMounted(() => {
+  appVersion.value = appInfo.branch ? (appInfo.branch + "-" + appInfo.revision) : appInfo.tag;
+})
+
+function setEComStore(event: CustomEvent) {
+  if(userProfile.value?.stores) {
+    store.dispatch("user/setEcomStore", {
+      "productStoreId": event.detail.value
+    })
   }
-});
+}
+
+async function changeTimeZone() {
+  const timeZoneModal = await modalController.create({
+    component: TimeZoneModal,
+  });
+  return timeZoneModal.present();
+}
+
+function logout() {
+  store.dispatch("user/logout").then(() => {
+    router.push("/login");
+  })
+}
+
+function getDateTime(time: any) {
+  return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "";
+}
+
+function goToOms() {
+  const link = (oms.value.startsWith('http') ? oms.value.replace(/\/api\/?|\/$/, "") : `https://${oms.value}.hotwax.io`) + `/qapps?token=${token.value}`
+  window.open(link, '_blank', 'noopener, noreferrer')
+}
 </script>
 
 <style scoped>

From 0b1b912bbd304c071b0839fa033b92e977816c27 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 15:03:18 +0530
Subject: [PATCH 025/250] Improved: translate method to allow dynamic variable
 (#246)

---
 src/i18n.ts            | 4 ++--
 src/locales/en.json    | 4 ++--
 src/views/Settings.vue | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/i18n.ts b/src/i18n.ts
index 39d62622..c1f714c5 100644
--- a/src/i18n.ts
+++ b/src/i18n.ts
@@ -27,11 +27,11 @@ const i18n = createI18n({
 
 // TODO Check if this is needed in updated versions
 // Currently this method is added to be used in ts files
-const translate = (key: string) => {
+const translate = (key: string, named?: any) => {
   if (!key) {
     return '';
   }
-  return i18n.global.t(key);
+  return i18n.global.t(key, named);
 };
 
 export { i18n as default, translate }
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index 8f4ace56..198bada7 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -5,7 +5,7 @@
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
   "Authenticating": "Authenticating",
   "Blank": "Blank",
-  "Built:": "Built:",
+  "Built: ": "Built: {builtDateTime}",
   "Cancel": "Cancel",
   "CANCEL": "CANCEL",
   "Canceling this job will cancel this occurrence and all following occurrences. This job will have to be re-enabled manually to run it again.": "Canceling this job will cancel this occurrence and all following occurrences. This job will have to be re-enabled manually to run it again.",
@@ -164,7 +164,7 @@
   "Username": "Username",
   "virtual, ": "virtual, ",
   "variants": "variants",
-  "Version:": "Version:",
+  "Version: ": "Version: {appVersion}",
   "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems": "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems",
   "You do not have permission to access this page": "You do not have permission to access this page",
   "You do not have permission to access the app.": "You do not have permission to access the app."
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index d92647e9..e349bcec 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -72,9 +72,9 @@
       <div class="section-header">
         <h1>
           {{ translate("App") }}
-          <p class="overline" >{{ translate("Version:") + appVersion }}</p>
+          <p class="overline" >{{ translate("Version: ", { appVersion }) }}</p>
         </h1>
-        <p class="overline">{{ translate("Built:") + getDateTime(appInfo.builtTime) }}</p>
+        <p class="overline">{{ translate("Built: ", { builtDateTime: getDateTime(appInfo.builtTime) }) }}</p>
       </div>
 
       <section>

From 9bf23cb242619e05585f62ff83cd038e648a3c12 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 16:29:29 +0530
Subject: [PATCH 026/250] Improved: component name, icons used (#238)

---
 src/components/LinkFacilitiesToGroupModal.vue             | 4 ++--
 src/components/LinkThresholdFacilitiesToGroupModal.vue    | 4 ++--
 .../{ProductFilterByItem.vue => ProductFilters.vue}       | 0
 src/views/CreateSafetyStock.vue                           | 4 ++--
 src/views/CreateShipping.vue                              | 4 ++--
 src/views/CreateStorePickup.vue                           | 4 ++--
 src/views/CreateThreshold.vue                             | 4 ++--
 src/views/TimezoneModal.vue                               | 8 ++++----
 8 files changed, 16 insertions(+), 16 deletions(-)
 rename src/components/{ProductFilterByItem.vue => ProductFilters.vue} (100%)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 0eda3f17..a038e1c5 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button>
-          <ion-icon slot="icon-only" :icon="close" />
+          <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Link facilities") }}</ion-title>
@@ -50,6 +50,6 @@
 
 <script setup lang="ts">
 import { IonButton, IonButtons, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
-import { close, saveOutline } from "ionicons/icons";
+import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@hotwax/dxp-components'
 </script>
\ No newline at end of file
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index 8973a1cd..db70e096 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button>
-          <ion-icon slot="icon-only" :icon="close" />
+          <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Link threshold") }}</ion-title>
@@ -50,6 +50,6 @@
 
 <script setup lang="ts">
 import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonRadio, IonRadioGroup, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
-import { close, saveOutline } from "ionicons/icons";
+import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@hotwax/dxp-components'
 </script>
\ No newline at end of file
diff --git a/src/components/ProductFilterByItem.vue b/src/components/ProductFilters.vue
similarity index 100%
rename from src/components/ProductFilterByItem.vue
rename to src/components/ProductFilters.vue
diff --git a/src/views/CreateSafetyStock.vue b/src/views/CreateSafetyStock.vue
index 8c279eb7..904c47ac 100644
--- a/src/views/CreateSafetyStock.vue
+++ b/src/views/CreateSafetyStock.vue
@@ -65,7 +65,7 @@
         </ion-card>
       </section>
 
-      <ProductFilterByItem />
+      <ProductFilters />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -80,5 +80,5 @@
 import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
-import ProductFilterByItem from '@/components/ProductFilterByItem.vue';
+import ProductFilters from '@/components/ProductFilters.vue';
 </script>
\ No newline at end of file
diff --git a/src/views/CreateShipping.vue b/src/views/CreateShipping.vue
index 122a23f6..084330fb 100644
--- a/src/views/CreateShipping.vue
+++ b/src/views/CreateShipping.vue
@@ -85,7 +85,7 @@
         </ion-card>
       </section>
 
-      <ProductFilterByItem />
+      <ProductFilters />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -101,7 +101,7 @@ import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCa
 import { ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
-import ProductFilterByItem from '@/components/ProductFilterByItem.vue';
+import ProductFilters from '@/components/ProductFilters.vue';
 
 const selectedSegment = ref("facility")
 </script>
diff --git a/src/views/CreateStorePickup.vue b/src/views/CreateStorePickup.vue
index 45020cd6..49335693 100644
--- a/src/views/CreateStorePickup.vue
+++ b/src/views/CreateStorePickup.vue
@@ -85,7 +85,7 @@
         </ion-card>
       </section>
 
-      <ProductFilterByItem />
+      <ProductFilters />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -101,7 +101,7 @@ import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCa
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
 import { ref } from 'vue';
-import ProductFilterByItem from '@/components/ProductFilterByItem.vue';
+import ProductFilters from '@/components/ProductFilters.vue';
 
 const selectedSegment = ref("facility")
 </script>
diff --git a/src/views/CreateThreshold.vue b/src/views/CreateThreshold.vue
index 6088e6fb..5c96ca20 100644
--- a/src/views/CreateThreshold.vue
+++ b/src/views/CreateThreshold.vue
@@ -42,7 +42,7 @@
         </ion-card>
       </section>
 
-      <ProductFilterByItem />
+      <ProductFilters />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -57,7 +57,7 @@
 import { IonBackButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
 import { saveOutline } from 'ionicons/icons'
 import { translate } from "@hotwax/dxp-components";
-import ProductFilterByItem from '@/components/ProductFilterByItem.vue';
+import ProductFilters from '@/components/ProductFilters.vue';
 </script>
 
 <style scoped>
diff --git a/src/views/TimezoneModal.vue b/src/views/TimezoneModal.vue
index 0e8918a1..a834bdf0 100644
--- a/src/views/TimezoneModal.vue
+++ b/src/views/TimezoneModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button @click="closeModal"> 
-          <ion-icon :icon="close" />
+          <ion-icon :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ $t("Select time zone") }}</ion-title>
@@ -33,7 +33,7 @@
     
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button :disabled="!timeZoneId" @click="saveAlert">
-        <ion-icon :icon="save" />
+        <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
   </ion-content>
@@ -59,7 +59,7 @@ import {
   modalController,
   alertController } from "@ionic/vue";
 import { defineComponent } from "vue";
-import { close, save } from "ionicons/icons";
+import { closeOutline, saveOutline } from "ionicons/icons";
 import { useStore } from "@/store";
 import { UserService } from "@/services/UserService";
 import { hasError } from '@/utils'
@@ -159,7 +159,7 @@ export default defineComponent({
     const store = useStore();
     return {
       close,
-      save,
+      saveOutline,
       store
     };
   }

From 89902b719d7535d66889b60bccc9eb747cdb1f85 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 16:33:04 +0530
Subject: [PATCH 027/250] Improved: renamed the rule creation pages (#238)

---
 src/router/index.ts                              | 16 ++++++++--------
 ...SafetyStock.vue => CreateSafetyStockRule.vue} |  0
 ...CreateShipping.vue => CreateShippingRule.vue} |  0
 ...StorePickup.vue => CreateStorePickupRule.vue} |  0
 ...eateThreshold.vue => CreateThresholdRule.vue} |  0
 5 files changed, 8 insertions(+), 8 deletions(-)
 rename src/views/{CreateSafetyStock.vue => CreateSafetyStockRule.vue} (100%)
 rename src/views/{CreateShipping.vue => CreateShippingRule.vue} (100%)
 rename src/views/{CreateStorePickup.vue => CreateStorePickupRule.vue} (100%)
 rename src/views/{CreateThreshold.vue => CreateThresholdRule.vue} (100%)

diff --git a/src/router/index.ts b/src/router/index.ts
index 92059124..35b68fca 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -13,10 +13,10 @@ import SafetyStock from '@/views/SafetyStock.vue'
 import StorePickup from '@/views/StorePickup.vue'
 import Shipping from '@/views/Shipping.vue'
 import InventoryChannels from '@/views/InventoryChannels.vue'
-import CreateThreshold from '@/views/CreateThreshold.vue';
-import CreateSafetyStock from '@/views/CreateSafetyStock.vue'
-import CreateStorePickup from '@/views/CreateStorePickup.vue'
-import CreateShipping from '@/views/CreateShipping.vue'
+import CreateThresholdRule from '@/views/CreateThresholdRule.vue';
+import CreateSafetyStockRule from '@/views/CreateSafetyStockRule.vue'
+import CreateStorePickupRule from '@/views/CreateStorePickupRule.vue'
+import CreateShippingRule from '@/views/CreateShippingRule.vue'
 
 import { hasPermission } from '@/authorization';
 import { showToast } from '@/utils'
@@ -100,25 +100,25 @@ const routes: Array<RouteRecordRaw> = [
   {
     path: '/create-threshold',
     name: 'Create threshold',
-    component: CreateThreshold,
+    component: CreateThresholdRule,
     beforeEnter: authGuard
   },
   {
     path: '/create-safety-stock',
     name: 'Create safety stock',
-    component: CreateSafetyStock,
+    component: CreateSafetyStockRule,
     beforeEnter: authGuard
   },
   {
     path: '/create-store-pickup',
     name: 'Create store pickup',
-    component: CreateStorePickup,
+    component: CreateStorePickupRule,
     beforeEnter: authGuard
   },
   {
     path: '/create-shipping',
     name: 'Create shipping',
-    component: CreateShipping,
+    component: CreateShippingRule,
     beforeEnter: authGuard
   },
   {
diff --git a/src/views/CreateSafetyStock.vue b/src/views/CreateSafetyStockRule.vue
similarity index 100%
rename from src/views/CreateSafetyStock.vue
rename to src/views/CreateSafetyStockRule.vue
diff --git a/src/views/CreateShipping.vue b/src/views/CreateShippingRule.vue
similarity index 100%
rename from src/views/CreateShipping.vue
rename to src/views/CreateShippingRule.vue
diff --git a/src/views/CreateStorePickup.vue b/src/views/CreateStorePickupRule.vue
similarity index 100%
rename from src/views/CreateStorePickup.vue
rename to src/views/CreateStorePickupRule.vue
diff --git a/src/views/CreateThreshold.vue b/src/views/CreateThresholdRule.vue
similarity index 100%
rename from src/views/CreateThreshold.vue
rename to src/views/CreateThresholdRule.vue

From 1644f3f9c4ef99fab85c7d9796700dea569be960 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 8 Apr 2024 17:05:00 +0530
Subject: [PATCH 028/250] Improved: base url for the app (#246)

---
 src/api/index.ts                  | 2 +-
 src/store/modules/user/getters.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/api/index.ts b/src/api/index.ts
index 74a770e2..dbe7b402 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -86,7 +86,7 @@ const api = async (customConfig: any) => {
   }
 
   const baseURL = store.getters["user/getInstanceUrl"];
-  if (baseURL) config.baseURL = `https://${baseURL}.hotwax.io/rest/s1/order-routing/`;
+  if (baseURL) config.baseURL = `https://${baseURL}.hotwax.io/rest/s1/available-to-promise/`;
   if(customConfig.cache) config.adapter = axiosCache.adapter;
   const networkStatus =  await OfflineHelper.getNetworkStatus();
   if (customConfig.queue && !networkStatus.connected) {
diff --git a/src/store/modules/user/getters.ts b/src/store/modules/user/getters.ts
index ce5192c8..849c7826 100644
--- a/src/store/modules/user/getters.ts
+++ b/src/store/modules/user/getters.ts
@@ -6,7 +6,7 @@ const getters: GetterTree <UserState, RootState> = {
     getBaseUrl (state) {
         let baseURL = process.env.VUE_APP_BASE_URL;
         if (!baseURL) baseURL = state.instanceUrl;
-        return baseURL.startsWith('http') ? baseURL : `https://${baseURL}.hotwax.io/rest/s1/order-routing/`;
+        return baseURL.startsWith('http') ? baseURL : `https://${baseURL}.hotwax.io/rest/s1/available-to-promise/`;
     },
     isAuthenticated (state) {
         return !!state.token;

From 666812c72ce5e3f045de86ce0930e7a8d982c285 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 9 Apr 2024 18:39:37 +0530
Subject: [PATCH 029/250] Implemented: util store, logic for fetching product
 features and tags (#250)

---
 src/components/ProductFilters.vue             | 30 +++++--
 src/components/SelectProductFeaturesModal.vue | 87 +++++++++++++++++++
 src/components/SelectProductTagsModal.vue     | 75 ++++++++++++++++
 src/locales/en.json                           |  1 +
 src/services/UtilService.ts                   | 22 +++++
 src/store/RootState.ts                        |  2 -
 src/store/index.ts                            |  6 +-
 src/store/modules/util/UtilState.ts           |  4 +
 src/store/modules/util/actions.ts             | 56 ++++++++++++
 src/store/modules/util/getters.ts             | 13 +++
 src/store/modules/util/index.ts               | 21 +++++
 src/store/modules/util/mutation-types.ts      |  3 +
 src/store/modules/util/mutations.ts           | 13 +++
 13 files changed, 324 insertions(+), 9 deletions(-)
 create mode 100644 src/components/SelectProductFeaturesModal.vue
 create mode 100644 src/components/SelectProductTagsModal.vue
 create mode 100644 src/services/UtilService.ts
 create mode 100644 src/store/modules/util/UtilState.ts
 create mode 100644 src/store/modules/util/actions.ts
 create mode 100644 src/store/modules/util/getters.ts
 create mode 100644 src/store/modules/util/index.ts
 create mode 100644 src/store/modules/util/mutation-types.ts
 create mode 100644 src/store/modules/util/mutations.ts

diff --git a/src/components/ProductFilters.vue b/src/components/ProductFilters.vue
index a6cb10bc..437fcc4e 100644
--- a/src/components/ProductFilters.vue
+++ b/src/components/ProductFilters.vue
@@ -7,7 +7,7 @@
     <ion-card>
       <ion-item lines="none">
         <ion-label>{{ translate("Included") }}</ion-label>
-        <ion-button fill="clear">
+        <ion-button fill="clear" @click="openSelectProductTagsModal('Included')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
@@ -23,7 +23,7 @@
     <ion-card>
       <ion-item lines="none"> 
         <ion-label>{{ translate("Excluded") }}</ion-label>
-        <ion-button fill="clear">
+        <ion-button fill="clear" @click="openSelectProductTagsModal('Excluded')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
@@ -45,7 +45,7 @@
     <ion-card>
       <ion-item lines="none">
         <ion-label>{{ translate("Included") }}</ion-label>
-        <ion-button fill="clear">
+        <ion-button fill="clear" @click="openSelectProductFeaturesModal('Include')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
@@ -61,7 +61,7 @@
     <ion-card>
       <ion-item lines="none"> 
         <ion-label>{{ translate("Excluded") }}</ion-label>
-        <ion-button fill="clear">
+        <ion-button fill="clear" @click="openSelectProductFeaturesModal('Exclude')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
@@ -77,7 +77,27 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonCard, IonCardContent, IonChip, IonIcon, IonItem, IonLabel } from '@ionic/vue';
+import { IonButton, IonCard, IonCardContent, IonChip, IonIcon, IonItem, IonLabel, modalController } from '@ionic/vue';
 import { addCircleOutline, closeCircle } from 'ionicons/icons'
 import { translate } from '@/i18n';
+import SelectProductFeaturesModal from '@/components/SelectProductFeaturesModal.vue'
+import SelectProductTagsModal from '@/components/SelectProductTagsModal.vue'
+
+async function openSelectProductFeaturesModal(type: string) {
+  const modal = await modalController.create({
+    component: SelectProductFeaturesModal,
+    componentProps: { type }
+  })
+
+  modal.present()
+}
+
+async function openSelectProductTagsModal(type: string) {
+  const modal = await modalController.create({
+    component: SelectProductTagsModal,
+    componentProps: { type }
+  })
+
+  modal.present()
+}
 </script>
\ No newline at end of file
diff --git a/src/components/SelectProductFeaturesModal.vue b/src/components/SelectProductFeaturesModal.vue
new file mode 100644
index 00000000..ae1d666e
--- /dev/null
+++ b/src/components/SelectProductFeaturesModal.vue
@@ -0,0 +1,87 @@
+<template>
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button @click="closeModal()">
+          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+        </ion-button>
+      </ion-buttons>
+      <ion-title>{{ translate("features", { type }) }}</ion-title>
+      <ion-buttons slot="end">
+        <ion-button fill="clear" color="danger">{{ translate("Clear All") }}</ion-button>
+      </ion-buttons>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-searchbar :placeholder="translate('Search tags')" v-model="queryString" @keyup.enter="filterProductFeatures()" />
+
+    <ion-list>
+      <div v-for="type in Object.keys(filteredProductFeaturesByType)" :key="type">
+        <ion-item-divider color="light" v-if="filteredProductFeaturesByType[type].length">
+          <ion-label>{{ type }}</ion-label>
+        </ion-item-divider>
+
+        <ion-item v-for="feature in filteredProductFeaturesByType[type]" :key="feature.productFeatureId">
+          <ion-checkbox>{{ feature.description }}</ion-checkbox>
+        </ion-item>
+      </div>
+    </ion-list>
+  </ion-content>
+
+  <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab-button>
+      <ion-icon :icon="checkmarkOutline" />
+    </ion-fab-button>
+  </ion-fab>
+</template>
+
+<script setup lang="ts">
+import { computed, defineProps, onMounted, ref } from 'vue';
+import {
+  IonButton,
+  IonButtons,
+  IonCheckbox,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonItem,
+  IonItemDivider,
+  IonLabel,
+  IonList,
+  IonSearchbar,
+  IonTitle,
+  IonToolbar,
+  modalController
+} from "@ionic/vue";
+import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons'
+import { translate } from '@/i18n';
+import { useStore } from 'vuex';
+
+defineProps(["type"])
+const store = useStore();
+const queryString = ref('')
+const filteredProductFeaturesByType = ref({}) as any;
+
+const productFeaturesByType = computed(() => store.getters["util/getProductFeaturesByType"])
+
+onMounted(async () => {
+  await store.dispatch("util/fetchProductFeatures")
+  filterProductFeatures()
+})
+
+function closeModal() {
+  modalController.dismiss()
+}
+
+function filterProductFeatures() {
+  const filteredFeaturesByType = JSON.parse(JSON.stringify(productFeaturesByType.value))
+
+  Object.keys(filteredFeaturesByType).map((type: any) => {
+    filteredFeaturesByType[type] = filteredFeaturesByType[type].filter((feature: any) => feature.description.toLowerCase().includes(queryString.value.toLowerCase()))
+  })
+  filteredProductFeaturesByType.value = filteredFeaturesByType
+}
+</script>
\ No newline at end of file
diff --git a/src/components/SelectProductTagsModal.vue b/src/components/SelectProductTagsModal.vue
new file mode 100644
index 00000000..1760ac59
--- /dev/null
+++ b/src/components/SelectProductTagsModal.vue
@@ -0,0 +1,75 @@
+<template>
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button @click="closeModal()">
+          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+        </ion-button>
+      </ion-buttons>
+      <ion-title>{{ translate("features", { type }) }}</ion-title>
+      <ion-buttons slot="end">
+        <ion-button fill="clear" color="danger">{{ translate("Clear All") }}</ion-button>
+      </ion-buttons>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-searchbar :placeholder="translate('Search tags')" v-model="queryString" @keyup.enter="filterProductTags()" />
+
+    <ion-list>
+      <ion-item v-for="tag in filteredTags" :key="tag.keyword">
+        <ion-checkbox>{{ tag.keyword }}</ion-checkbox>
+      </ion-item>
+    </ion-list>
+  </ion-content>
+
+  <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab-button>
+      <ion-icon :icon="checkmarkOutline" />
+    </ion-fab-button>
+  </ion-fab>
+</template>
+
+<script setup lang="ts">
+import { computed, defineProps, onMounted, ref } from 'vue';
+import {
+  IonButton,
+  IonButtons,
+  IonCheckbox,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonItem,
+  IonList,
+  IonSearchbar,
+  IonTitle,
+  IonToolbar,
+  modalController
+} from "@ionic/vue";
+import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons'
+import { translate } from '@/i18n';
+import { useStore } from 'vuex';
+
+defineProps(["type"])
+const store = useStore();
+const queryString = ref('')
+const filteredTags = ref([]) as any
+
+const productTags = computed(() => store.getters["util/getProductTags"])
+
+onMounted(async () => {
+  await store.dispatch("util/fetchProductTags")
+  filteredTags.value = productTags.value
+})
+
+function closeModal() {
+  modalController.dismiss()
+}
+
+function filterProductTags() {
+  filteredTags.value = productTags.value.filter((tag: any) => tag.keyword.toLowerCase().includes(queryString.value.toLowerCase()))
+}
+
+</script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index 2d1ab7a8..224ef9dc 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -55,6 +55,7 @@
   "Failed": "Failed",
   "Failed to update some jobs": "Failed to update some jobs",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
+  "features": "{type} features",
   "Fetching time zones": "Fetching time zones",
   "Frequency": "Frequency",
   "Go to Launchpad": "Go to Launchpad",
diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
new file mode 100644
index 00000000..0658f925
--- /dev/null
+++ b/src/services/UtilService.ts
@@ -0,0 +1,22 @@
+import api, {client} from '@/api';
+
+const fetchProductFeatures = async (): Promise <any>  => {
+  return api({
+    url: "products/features",
+    method: "get",
+    cache: true
+  });
+}
+
+const fetchProductTags = async (): Promise <any>  => {
+  return api({
+    url: "products/10000/tags",
+    method: "get",
+    cache: true
+  });
+}
+
+export const UtilService = {
+  fetchProductFeatures,
+  fetchProductTags
+}
\ No newline at end of file
diff --git a/src/store/RootState.ts b/src/store/RootState.ts
index 15a4721f..9755745b 100644
--- a/src/store/RootState.ts
+++ b/src/store/RootState.ts
@@ -1,6 +1,4 @@
 export default interface RootState {
     user: any;
-    product: any;
-    job: any;
     util: any;
 }
\ No newline at end of file
diff --git a/src/store/index.ts b/src/store/index.ts
index 579b6808..4c99ef5b 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -5,6 +5,7 @@ import actions from './actions'
 import RootState from './RootState'
 import createPersistedState from "vuex-persistedstate";
 import userModule from './modules/user';
+import utilModule from './modules/util';
 
 
 // TODO check how to register it from the components only
@@ -17,7 +18,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: ['user'],
+    paths: ['user', 'util'],
     fetchBeforeUse: true
 })
 
@@ -29,7 +30,8 @@ const store = createStore<RootState>({
     getters,
     plugins: [ persistState ],
     modules: { 
-        'user': userModule
+        'user': userModule,
+        'util': utilModule
     },
 })
 
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
new file mode 100644
index 00000000..3b359f24
--- /dev/null
+++ b/src/store/modules/util/UtilState.ts
@@ -0,0 +1,4 @@
+export default interface UtilState {
+    featuresByType: any;
+    tags: any;
+}
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
new file mode 100644
index 00000000..91cea8bb
--- /dev/null
+++ b/src/store/modules/util/actions.ts
@@ -0,0 +1,56 @@
+import { ActionTree } from 'vuex'
+import RootState from '@/store/RootState'
+import { UtilService } from '@/services/UtilService'
+import { hasError } from '@/utils'
+import logger from '@/logger'
+import UtilState from './UtilState'
+import * as types from './mutation-types'
+
+
+const actions: ActionTree<UtilState, RootState> = {
+  async fetchProductFeatures ({ commit, state }) {
+    // const features = JSON.parse(JSON.stringify())
+    const featuresByType = {} as any
+
+    try {
+      const resp = await UtilService.fetchProductFeatures()
+
+      if(!hasError(resp)) {
+        const features = resp.data
+        
+        features.map((feature: any) => {
+          if(featuresByType[feature.featureTypeDescription]) featuresByType[feature.featureTypeDescription].push(feature)
+          else featuresByType[feature.featureTypeDescription] = [feature]
+        })
+
+        commit(types.UTIL_FEATURES_BY_TYPE_UPDATED, featuresByType)
+      } else {
+        throw resp.data
+      }
+    } catch (err: any) {
+      logger.error(err)
+    }
+  },
+
+  async fetchProductTags ({ commit, state }) {
+    const productTags = JSON.parse(JSON.stringify(state.tags))
+
+    if(productTags.length) {
+      return;
+    }
+
+    try {
+      const resp = await UtilService.fetchProductTags()
+
+      if(!hasError(resp)) {
+        commit(types.UTIL_PRODUCT_TAGS_UPDATED, resp.data)
+      } else {
+        throw resp.data
+      }
+    } catch (err: any) {
+      logger.error(err)
+    }
+  }
+}
+
+export default actions;
\ No newline at end of file
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
new file mode 100644
index 00000000..016331a8
--- /dev/null
+++ b/src/store/modules/util/getters.ts
@@ -0,0 +1,13 @@
+import { GetterTree } from 'vuex'
+import UtilState from './UtilState'
+import RootState from '@/store/RootState'
+
+const getters: GetterTree<UtilState, RootState> = {
+  getProductFeaturesByType(state) {
+    return state.featuresByType
+  },
+  getProductTags(state) {
+    return state.tags
+  }
+}
+export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
new file mode 100644
index 00000000..7ffc5751
--- /dev/null
+++ b/src/store/modules/util/index.ts
@@ -0,0 +1,21 @@
+import actions from './actions'
+import getters from './getters'
+import mutations from './mutations'
+import { Module } from 'vuex'
+import RootState from '@/store/RootState'
+import UtilState from './UtilState'
+
+const utilModule: Module<UtilState, RootState> = {
+    namespaced: true,
+    state: {
+      featuresByType: {},
+      tags: []
+    },
+    getters,
+    actions,
+    mutations,
+}
+
+// TODO
+// store.registerModule('user', userModule);
+export default utilModule;
\ No newline at end of file
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
new file mode 100644
index 00000000..d3b0eb6d
--- /dev/null
+++ b/src/store/modules/util/mutation-types.ts
@@ -0,0 +1,3 @@
+export const SN_UTIL = 'util'
+export const UTIL_FEATURES_BY_TYPE_UPDATED = SN_UTIL + '/FEATURES_UPDATED'
+export const UTIL_PRODUCT_TAGS_UPDATED = SN_UTIL + '/PRODUCT_TAGS_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
new file mode 100644
index 00000000..60973030
--- /dev/null
+++ b/src/store/modules/util/mutations.ts
@@ -0,0 +1,13 @@
+import { MutationTree } from 'vuex'
+import UtilState from './UtilState'
+import * as types from './mutation-types'
+
+const mutations: MutationTree <UtilState> = {
+    [types.UTIL_FEATURES_BY_TYPE_UPDATED] (state, payload) {
+        state.featuresByType = payload
+    },
+    [types.UTIL_PRODUCT_TAGS_UPDATED] (state, payload) {
+        state.tags = payload
+    }
+}
+export default mutations;
\ No newline at end of file

From 8f06c390b6b059d2c5d34a9ae04834d5994e6211 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 10 Apr 2024 13:01:46 +0530
Subject: [PATCH 030/250] Implemented: logic to fetch product filters using
 solrFacets (#250)

---
 src/components/AddProductFiltersModal.vue     | 169 ++++++++++++++++++
 src/components/ProductFilters.vue             |  31 ++--
 src/components/SelectProductFeaturesModal.vue |  87 ---------
 src/components/SelectProductTagsModal.vue     |  75 --------
 src/services/RuleService.ts                   |  12 ++
 src/services/UtilService.ts                   |  20 +--
 src/store/modules/rule/RuleState.ts           |   3 +
 src/store/modules/rule/actions.ts             |  27 +++
 src/store/modules/rule/getters.ts             |   8 +
 src/store/modules/rule/index.ts               |  17 ++
 src/store/modules/rule/mutation-types.ts      |   1 +
 src/store/modules/rule/mutations.ts           |   7 +
 src/store/modules/util/UtilState.ts           |   3 +-
 src/store/modules/util/actions.ts             |  40 ++---
 src/store/modules/util/getters.ts             |   8 +-
 src/store/modules/util/index.ts               |   3 +-
 src/store/modules/util/mutation-types.ts      |   3 +-
 src/store/modules/util/mutations.ts           |   9 +-
 src/views/CreateThresholdRule.vue             |  58 +++++-
 src/views/Login.vue                           |  10 +-
 20 files changed, 341 insertions(+), 250 deletions(-)
 create mode 100644 src/components/AddProductFiltersModal.vue
 delete mode 100644 src/components/SelectProductFeaturesModal.vue
 delete mode 100644 src/components/SelectProductTagsModal.vue
 create mode 100644 src/services/RuleService.ts
 create mode 100644 src/store/modules/rule/RuleState.ts
 create mode 100644 src/store/modules/rule/actions.ts
 create mode 100644 src/store/modules/rule/getters.ts
 create mode 100644 src/store/modules/rule/index.ts
 create mode 100644 src/store/modules/rule/mutation-types.ts
 create mode 100644 src/store/modules/rule/mutations.ts

diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
new file mode 100644
index 00000000..5340c039
--- /dev/null
+++ b/src/components/AddProductFiltersModal.vue
@@ -0,0 +1,169 @@
+<template>
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button @click="closeModal">
+          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+        </ion-button>
+      </ion-buttons>
+      <ion-title>{{ $t(`${ type === 'included' ? `Include ${label}` : `Exclude ${label}` }`) }}</ion-title>
+      <ion-buttons slot="end">
+        <ion-button fill="clear" color="danger" @click="selectedValues = []">{{ $t("Clear All") }}</ion-button>
+      </ion-buttons>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-searchbar :placeholder="translate('Search', { label })" v-model="queryString" @keyup.enter="search()"/>
+
+    <ion-list>
+      <ion-item v-for="option in facetOptions" :key="option.id"  @click="updateSelectedValues(option.id)">
+        <ion-checkbox :checked="selectedValues.includes(option.id)">
+          {{ option.label }}
+        </ion-checkbox>
+        <!-- <ion-note v-else slot="end" color="danger">{{ type === 'included' ? $t("excluded") : $t("included") }}</ion-note> -->
+      </ion-item>
+    </ion-list>
+
+    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
+    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="checkmarkOutline" />
+      </ion-fab-button>
+    </ion-fab>
+
+    <ion-infinite-scroll @ionInfinite="loadMoreTags($event)" threshold="100px" :disabled="!isScrollable">
+      <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
+    </ion-infinite-scroll>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { defineComponent } from "vue";
+import {
+  IonButton,
+  IonButtons,
+  IonCheckbox,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonInfiniteScroll,
+  IonInfiniteScrollContent,
+  IonItem,
+  IonLabel,
+  IonList,
+  IonNote,
+  IonSearchbar,
+  IonTitle,
+  IonToolbar,
+  modalController
+} from "@ionic/vue";
+import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons';
+import { mapGetters, useStore } from "vuex";
+import { UtilService } from "@/services/UtilService";
+import { defineProps, ref } from "vue";
+import { translate } from "@/i18n";
+import { hasError } from "@/utils";
+
+const queryString = ref('');
+const facetOptions = ref([]) as any;
+const isFilterChanged = ref(false);
+const isScrollable = ref(true);
+const selectedValues = ref([]) as any;
+
+const props = defineProps(["label", "facetToSelect", "searchfield", "type"])
+
+function closeModal() {
+  modalController.dismiss({ dismissed: true });
+}
+
+function search() {
+  getTags();
+}
+
+async function getTags(vSize?: any, vIndex?: any) {
+  const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
+  const viewIndex = vIndex ? vIndex : 0;
+
+  const payload = {
+    facetToSelect: props.facetToSelect,
+    docType: 'PRODUCT',
+    coreName: 'enterpriseSearch',
+    searchfield: props.searchfield,
+    jsonQuery: '{"query":"*:*","filter":["docType:PRODUCT"]}',
+    noConditionFind: 'N',
+    limit: viewSize,
+    q: queryString.value,
+    term: queryString.value,
+    offset: 0,
+  }
+
+  const resp = await UtilService.fetchFacets(payload);
+  if(!hasError(resp)) {
+    const results = resp.data.facetResponse.response
+    facetOptions.value = viewIndex === 0 ? results : [...facetOptions.value , ...results];
+    isScrollable.value = (facetOptions.value.length % process.env.VUE_APP_VIEW_SIZE) === 0;
+
+  } else {
+    facetOptions.value = [];
+    isScrollable.value = false;
+  }
+}
+
+async function loadMoreTags(event: any){
+  getTags(
+    undefined,
+    Math.ceil(facetOptions.value.length / process.env.VUE_APP_VIEW_SIZE).toString() 
+  ).then(() => {
+    event.target.complete();
+  })
+}
+
+function updateSelectedValues(value: string) {
+  selectedValues.value.includes(value) ? selectedValues.value.splice(selectedValues.value.indexOf(value), 1) : selectedValues.value.push(value);
+}
+
+// async updateFilters() {
+//   this.isFilterChanged = true;
+//   this.selectedValues.length ? await this.updateAppliedFilters() : await this.clearFilters();
+//   this.closeModal();
+// },
+// async updateAppliedFilters() {
+//   // if filters are not updated
+//   if (JSON.stringify(this.appliedFilters[this.type][this.searchfield].list) == JSON.stringify(this.selectedValues)) {
+//     this.isFilterChanged = false;
+//     return;
+//   }
+
+//   const appliedFilters = JSON.parse(JSON.stringify(this.appliedFilters[this.type][this.searchfield]))
+//   appliedFilters.list = this.selectedValues
+  
+//   await this.store.dispatch('product/updateAppliedFilters', {
+//     type: this.type,
+//     id: this.searchfield,
+//     value: appliedFilters
+//   })
+// },
+// async clearFilters() {
+//   // if no filters are already not applied
+//   if (!this.appliedFilters[this.type][this.searchfield].list.length) {
+//     this.isFilterChanged = false;
+//     return;
+//   }
+
+//   await this.store.dispatch('product/clearFilters', {
+//     type: this.type,
+//     id: this.searchfield,
+//     value: {
+//       list: [],
+//       operator: 'OR'
+//     }
+//   })
+// },
+// isAlreadyApplied(value: string) {
+//   const type = this.type === 'included' ? 'excluded' : 'included'
+//   return this.appliedFilters[type][this.searchfield].list.includes(value)
+// }
+</script>
\ No newline at end of file
diff --git a/src/components/ProductFilters.vue b/src/components/ProductFilters.vue
index 437fcc4e..0e4354da 100644
--- a/src/components/ProductFilters.vue
+++ b/src/components/ProductFilters.vue
@@ -7,7 +7,7 @@
     <ion-card>
       <ion-item lines="none">
         <ion-label>{{ translate("Included") }}</ion-label>
-        <ion-button fill="clear" @click="openSelectProductTagsModal('Included')">
+        <ion-button fill="clear" @click="openProductFilterModal('tags', 'tagsFacet', 'tags', 'included')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
@@ -23,7 +23,7 @@
     <ion-card>
       <ion-item lines="none"> 
         <ion-label>{{ translate("Excluded") }}</ion-label>
-        <ion-button fill="clear" @click="openSelectProductTagsModal('Excluded')">
+        <ion-button fill="clear" @click="openProductFilterModal('tags', 'tagsFacet', 'tags', 'excluded')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
@@ -45,7 +45,7 @@
     <ion-card>
       <ion-item lines="none">
         <ion-label>{{ translate("Included") }}</ion-label>
-        <ion-button fill="clear" @click="openSelectProductFeaturesModal('Include')">
+        <ion-button fill="clear" @click="openProductFilterModal('productFeatures', 'productFeaturesFacet', 'productFeatures', 'included')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
@@ -61,7 +61,7 @@
     <ion-card>
       <ion-item lines="none"> 
         <ion-label>{{ translate("Excluded") }}</ion-label>
-        <ion-button fill="clear" @click="openSelectProductFeaturesModal('Exclude')">
+        <ion-button fill="clear" @click="openProductFilterModal('productFeatures', 'productFeaturesFacet', 'productFeatures', 'included')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
@@ -80,22 +80,17 @@
 import { IonButton, IonCard, IonCardContent, IonChip, IonIcon, IonItem, IonLabel, modalController } from '@ionic/vue';
 import { addCircleOutline, closeCircle } from 'ionicons/icons'
 import { translate } from '@/i18n';
-import SelectProductFeaturesModal from '@/components/SelectProductFeaturesModal.vue'
-import SelectProductTagsModal from '@/components/SelectProductTagsModal.vue'
+import AddProductFiltersModal from '@/components/AddProductFiltersModal.vue';
 
-async function openSelectProductFeaturesModal(type: string) {
+async function openProductFilterModal(label: string, facetToSelect: string, searchfield: string, type: string) {
   const modal = await modalController.create({
-    component: SelectProductFeaturesModal,
-    componentProps: { type }
-  })
-
-  modal.present()
-}
-
-async function openSelectProductTagsModal(type: string) {
-  const modal = await modalController.create({
-    component: SelectProductTagsModal,
-    componentProps: { type }
+    component: AddProductFiltersModal,
+    componentProps: {
+      label,
+      facetToSelect,
+      searchfield,
+      type
+    },
   })
 
   modal.present()
diff --git a/src/components/SelectProductFeaturesModal.vue b/src/components/SelectProductFeaturesModal.vue
deleted file mode 100644
index ae1d666e..00000000
--- a/src/components/SelectProductFeaturesModal.vue
+++ /dev/null
@@ -1,87 +0,0 @@
-<template>
-  <ion-header>
-    <ion-toolbar>
-      <ion-buttons slot="start">
-        <ion-button @click="closeModal()">
-          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
-        </ion-button>
-      </ion-buttons>
-      <ion-title>{{ translate("features", { type }) }}</ion-title>
-      <ion-buttons slot="end">
-        <ion-button fill="clear" color="danger">{{ translate("Clear All") }}</ion-button>
-      </ion-buttons>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <ion-searchbar :placeholder="translate('Search tags')" v-model="queryString" @keyup.enter="filterProductFeatures()" />
-
-    <ion-list>
-      <div v-for="type in Object.keys(filteredProductFeaturesByType)" :key="type">
-        <ion-item-divider color="light" v-if="filteredProductFeaturesByType[type].length">
-          <ion-label>{{ type }}</ion-label>
-        </ion-item-divider>
-
-        <ion-item v-for="feature in filteredProductFeaturesByType[type]" :key="feature.productFeatureId">
-          <ion-checkbox>{{ feature.description }}</ion-checkbox>
-        </ion-item>
-      </div>
-    </ion-list>
-  </ion-content>
-
-  <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
-    <ion-fab-button>
-      <ion-icon :icon="checkmarkOutline" />
-    </ion-fab-button>
-  </ion-fab>
-</template>
-
-<script setup lang="ts">
-import { computed, defineProps, onMounted, ref } from 'vue';
-import {
-  IonButton,
-  IonButtons,
-  IonCheckbox,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonItemDivider,
-  IonLabel,
-  IonList,
-  IonSearchbar,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from "@ionic/vue";
-import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons'
-import { translate } from '@/i18n';
-import { useStore } from 'vuex';
-
-defineProps(["type"])
-const store = useStore();
-const queryString = ref('')
-const filteredProductFeaturesByType = ref({}) as any;
-
-const productFeaturesByType = computed(() => store.getters["util/getProductFeaturesByType"])
-
-onMounted(async () => {
-  await store.dispatch("util/fetchProductFeatures")
-  filterProductFeatures()
-})
-
-function closeModal() {
-  modalController.dismiss()
-}
-
-function filterProductFeatures() {
-  const filteredFeaturesByType = JSON.parse(JSON.stringify(productFeaturesByType.value))
-
-  Object.keys(filteredFeaturesByType).map((type: any) => {
-    filteredFeaturesByType[type] = filteredFeaturesByType[type].filter((feature: any) => feature.description.toLowerCase().includes(queryString.value.toLowerCase()))
-  })
-  filteredProductFeaturesByType.value = filteredFeaturesByType
-}
-</script>
\ No newline at end of file
diff --git a/src/components/SelectProductTagsModal.vue b/src/components/SelectProductTagsModal.vue
deleted file mode 100644
index 1760ac59..00000000
--- a/src/components/SelectProductTagsModal.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<template>
-  <ion-header>
-    <ion-toolbar>
-      <ion-buttons slot="start">
-        <ion-button @click="closeModal()">
-          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
-        </ion-button>
-      </ion-buttons>
-      <ion-title>{{ translate("features", { type }) }}</ion-title>
-      <ion-buttons slot="end">
-        <ion-button fill="clear" color="danger">{{ translate("Clear All") }}</ion-button>
-      </ion-buttons>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <ion-searchbar :placeholder="translate('Search tags')" v-model="queryString" @keyup.enter="filterProductTags()" />
-
-    <ion-list>
-      <ion-item v-for="tag in filteredTags" :key="tag.keyword">
-        <ion-checkbox>{{ tag.keyword }}</ion-checkbox>
-      </ion-item>
-    </ion-list>
-  </ion-content>
-
-  <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
-    <ion-fab-button>
-      <ion-icon :icon="checkmarkOutline" />
-    </ion-fab-button>
-  </ion-fab>
-</template>
-
-<script setup lang="ts">
-import { computed, defineProps, onMounted, ref } from 'vue';
-import {
-  IonButton,
-  IonButtons,
-  IonCheckbox,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonList,
-  IonSearchbar,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from "@ionic/vue";
-import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons'
-import { translate } from '@/i18n';
-import { useStore } from 'vuex';
-
-defineProps(["type"])
-const store = useStore();
-const queryString = ref('')
-const filteredTags = ref([]) as any
-
-const productTags = computed(() => store.getters["util/getProductTags"])
-
-onMounted(async () => {
-  await store.dispatch("util/fetchProductTags")
-  filteredTags.value = productTags.value
-})
-
-function closeModal() {
-  modalController.dismiss()
-}
-
-function filterProductTags() {
-  filteredTags.value = productTags.value.filter((tag: any) => tag.keyword.toLowerCase().includes(queryString.value.toLowerCase()))
-}
-
-</script>
\ No newline at end of file
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
new file mode 100644
index 00000000..4ba95efe
--- /dev/null
+++ b/src/services/RuleService.ts
@@ -0,0 +1,12 @@
+import api, {client} from '@/api';
+
+const fetchRuleGroup = async (payload: any): Promise <any>  => {
+  return api({
+    url: `ruleGroups/${payload.ruleGroupId}`,
+    method: "GET"
+  });
+}
+
+export const RuleService = {
+  fetchRuleGroup
+}
\ No newline at end of file
diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
index 0658f925..0d01afd4 100644
--- a/src/services/UtilService.ts
+++ b/src/services/UtilService.ts
@@ -1,22 +1,22 @@
 import api, {client} from '@/api';
 
-const fetchProductFeatures = async (): Promise <any>  => {
+const fetchFacets = async (payload: any): Promise<any> => {
   return api({
-    url: "products/features",
-    method: "get",
-    cache: true
+    url: "solrFacets",
+    method: "GET",
+    params: payload
   });
 }
 
-const fetchProductTags = async (): Promise <any>  => {
+const fetchConfigFacilities = async (payload: any): Promise <any>  => {
   return api({
-    url: "products/10000/tags",
-    method: "get",
-    cache: true
+    url: "facilities",
+    method: "GET",
+    params: payload
   });
 }
 
 export const UtilService = {
-  fetchProductFeatures,
-  fetchProductTags
+  fetchConfigFacilities,
+  fetchFacets
 }
\ No newline at end of file
diff --git a/src/store/modules/rule/RuleState.ts b/src/store/modules/rule/RuleState.ts
new file mode 100644
index 00000000..335f2a44
--- /dev/null
+++ b/src/store/modules/rule/RuleState.ts
@@ -0,0 +1,3 @@
+export default interface RuleState {
+    
+}
\ No newline at end of file
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
new file mode 100644
index 00000000..1c7a4103
--- /dev/null
+++ b/src/store/modules/rule/actions.ts
@@ -0,0 +1,27 @@
+import { ActionTree } from 'vuex'
+import RootState from '@/store/RootState'
+import * as types from './mutation-types'
+import RuleState from './RuleState'
+import { RuleService } from '@/services/RuleService'
+import { hasError } from '@/utils'
+import logger from '@/logger'
+
+
+const actions: ActionTree<RuleState, RootState> = {
+  async fetchRuleGroup({ commit }, ruleGroupId) {
+    try {
+      const resp = await RuleService.fetchRuleGroup(ruleGroupId)
+
+      if(!hasError(resp)) {
+        console.log(resp);
+        
+      } else {
+        throw resp.data;
+      }
+    } catch(err: any) {
+      logger.error(err);
+    }
+  },
+}
+
+export default actions;
\ No newline at end of file
diff --git a/src/store/modules/rule/getters.ts b/src/store/modules/rule/getters.ts
new file mode 100644
index 00000000..01ccbe6c
--- /dev/null
+++ b/src/store/modules/rule/getters.ts
@@ -0,0 +1,8 @@
+import { GetterTree } from 'vuex'
+import RootState from '@/store/RootState'
+import RuleState from './RuleState';
+
+const getters: GetterTree <RuleState, RootState> = {
+    
+}
+export default getters;
\ No newline at end of file
diff --git a/src/store/modules/rule/index.ts b/src/store/modules/rule/index.ts
new file mode 100644
index 00000000..ee1083a5
--- /dev/null
+++ b/src/store/modules/rule/index.ts
@@ -0,0 +1,17 @@
+import actions from './actions'
+import getters from './getters'
+import mutations from './mutations'
+import { Module } from 'vuex'
+import RootState from '@/store/RootState'
+import RuleState from './RuleState'
+
+const userModule: Module<RuleState, RootState> = {
+    namespaced: true,
+    state: {
+    },
+    getters,
+    actions,
+    mutations,
+}
+
+export default userModule;
\ No newline at end of file
diff --git a/src/store/modules/rule/mutation-types.ts b/src/store/modules/rule/mutation-types.ts
new file mode 100644
index 00000000..3b389deb
--- /dev/null
+++ b/src/store/modules/rule/mutation-types.ts
@@ -0,0 +1 @@
+export const SN_RULE = 'rule'
\ No newline at end of file
diff --git a/src/store/modules/rule/mutations.ts b/src/store/modules/rule/mutations.ts
new file mode 100644
index 00000000..3b559428
--- /dev/null
+++ b/src/store/modules/rule/mutations.ts
@@ -0,0 +1,7 @@
+import { MutationTree } from 'vuex'
+import RuleState from './RuleState';
+
+const mutations: MutationTree <RuleState> = {
+   
+}
+export default mutations;
\ No newline at end of file
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index 3b359f24..14b42e44 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -1,4 +1,3 @@
 export default interface UtilState {
-    featuresByType: any;
-    tags: any;
+  configFacilities: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 91cea8bb..86eeefba 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -8,48 +8,30 @@ import * as types from './mutation-types'
 
 
 const actions: ActionTree<UtilState, RootState> = {
-  async fetchProductFeatures ({ commit, state }) {
-    // const features = JSON.parse(JSON.stringify())
-    const featuresByType = {} as any
+  async fetchConfigFacilities ({ commit, state }) {
+    let configFacilities = JSON.parse(JSON.stringify(state.configFacilities))
 
-    try {
-      const resp = await UtilService.fetchProductFeatures()
-
-      if(!hasError(resp)) {
-        const features = resp.data
-        
-        features.map((feature: any) => {
-          if(featuresByType[feature.featureTypeDescription]) featuresByType[feature.featureTypeDescription].push(feature)
-          else featuresByType[feature.featureTypeDescription] = [feature]
-        })
-
-        commit(types.UTIL_FEATURES_BY_TYPE_UPDATED, featuresByType)
-      } else {
-        throw resp.data
-      }
-    } catch (err: any) {
-      logger.error(err)
-    }
-  },
-
-  async fetchProductTags ({ commit, state }) {
-    const productTags = JSON.parse(JSON.stringify(state.tags))
-
-    if(productTags.length) {
+    if(configFacilities.length) {
       return;
     }
 
+    const payload = {
+      facilityTypeId: 'CONFIGURATION'
+    }
+    
     try {
-      const resp = await UtilService.fetchProductTags()
+      const resp = await UtilService.fetchConfigFacilities(payload);
 
       if(!hasError(resp)) {
-        commit(types.UTIL_PRODUCT_TAGS_UPDATED, resp.data)
+        configFacilities = resp.data;
       } else {
         throw resp.data
       }
     } catch (err: any) {
       logger.error(err)
     }
+
+    commit(types.UTIL_CONFIG_FACILITES_UPDATED, configFacilities)
   }
 }
 
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 016331a8..6ab69ec2 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -3,11 +3,9 @@ import UtilState from './UtilState'
 import RootState from '@/store/RootState'
 
 const getters: GetterTree<UtilState, RootState> = {
-  getProductFeaturesByType(state) {
-    return state.featuresByType
-  },
-  getProductTags(state) {
-    return state.tags
+  getConfigFacilities(state) {
+    return state.configFacilities ? JSON.parse(JSON.stringify(state.configFacilities)) : []
   }
 }
+
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 7ffc5751..8d6b0ccc 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -8,8 +8,7 @@ import UtilState from './UtilState'
 const utilModule: Module<UtilState, RootState> = {
     namespaced: true,
     state: {
-      featuresByType: {},
-      tags: []
+      configFacilities: []
     },
     getters,
     actions,
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index d3b0eb6d..8570e1ff 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -1,3 +1,2 @@
 export const SN_UTIL = 'util'
-export const UTIL_FEATURES_BY_TYPE_UPDATED = SN_UTIL + '/FEATURES_UPDATED'
-export const UTIL_PRODUCT_TAGS_UPDATED = SN_UTIL + '/PRODUCT_TAGS_UPDATED'
\ No newline at end of file
+export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index 60973030..4cae5ba9 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -3,11 +3,8 @@ import UtilState from './UtilState'
 import * as types from './mutation-types'
 
 const mutations: MutationTree <UtilState> = {
-    [types.UTIL_FEATURES_BY_TYPE_UPDATED] (state, payload) {
-        state.featuresByType = payload
-    },
-    [types.UTIL_PRODUCT_TAGS_UPDATED] (state, payload) {
-        state.tags = payload
-    }
+  [types.UTIL_CONFIG_FACILITES_UPDATED] (state, payload) {
+      state.configFacilities = payload
+  }
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 602e5ea4..1849a010 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -17,10 +17,10 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input :label="translate('Name')" />
+                <ion-input :label="translate('Name')" v-model="formData.name" />
               </ion-item>
               <ion-item>
-                <ion-input :label="translate('Threshold')" />
+                <ion-input :label="translate('Threshold')" v-model="formData.threshold" />
               </ion-item>
             </div>
           </ion-card>
@@ -31,13 +31,13 @@
       </div>
 
       <section> 
-        <ion-card >
+        <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
           <ion-card-header>
             <div>
-              <ion-card-title>{{ "Facitlity Name" }}</ion-card-title>
-              <ion-card-subtitle>{{ "Facility ID" }}</ion-card-subtitle>
+              <ion-card-title>{{ facility.facilityName }}</ion-card-title>
+              <ion-card-subtitle>{{ facility.facilityId }}</ion-card-subtitle>
             </div>
-            <ion-checkbox />
+            <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
           </ion-card-header>
         </ion-card>
       </section>
@@ -54,10 +54,54 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
+import {
+  IonBackButton,
+  IonCard,
+  IonCardHeader,
+  IonCardSubtitle,
+  IonCardTitle,
+  IonCheckbox,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonInput,
+  IonItem,
+  IonPage,
+  IonTitle,
+  IonToolbar
+} from '@ionic/vue';
 import { saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
+import { computed, onMounted, ref } from 'vue';
+import { useStore } from 'vuex';
+
+const store = useStore();
+const formData = ref({
+  name: '',
+  threshold: '',
+  selectedConfigFacilites: []
+}) as any;
+
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
+
+onMounted(async () => {
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
+function toggleFacilitySelection(facilityId: any) {
+  if(formData.value.selectedConfigFacilites.includes(facilityId)) {
+    formData.value.selectedConfigFacilites = formData.value.selectedConfigFacilites.filter((currentFacilityId: string) => currentFacilityId !== facilityId)
+  } else {
+    formData.value.selectedConfigFacilites.push(facilityId)
+  }
+}
+
+function isFacilitySelected(facilityId: any) {
+  return formData.value.selectedConfigFacilites.includes(facilityId)
+}
 </script>
 
 <style scoped>
diff --git a/src/views/Login.vue b/src/views/Login.vue
index bd3a19ea..7902054f 100644
--- a/src/views/Login.vue
+++ b/src/views/Login.vue
@@ -6,16 +6,13 @@
           <Logo />
 
           <ion-item lines="full">
-            <ion-label position="fixed">{{ translate("OMS") }}</ion-label>
-            <ion-input name="instanceUrl" v-model="instanceUrl" id="instanceUrl" type="text" required />
+            <ion-input :label="translate('OMS')" label-placement="fixed" name="instanceUrl" v-model="instanceUrl" id="instanceUrl" type="text" required />
           </ion-item>
           <ion-item lines="full">
-            <ion-label position="fixed">{{ translate("Username") }}</ion-label>
-            <ion-input name="username" v-model="username" id="username" type="text" required />
+            <ion-input :label="translate('Username')" label-placement="fixed" name="username" v-model="username" id="username" type="text" required />
           </ion-item>
           <ion-item lines="none">
-            <ion-label position="fixed">{{ translate("Password") }}</ion-label>
-            <ion-input name="password" v-model="password" id="password" type="password" required />
+            <ion-input :label="translate('Password')" label-placement="fixed" name="password" v-model="password" id="password" type="password" required />
           </ion-item>
 
           <div class="ion-padding">
@@ -33,7 +30,6 @@ import {
   IonContent,
   IonInput,
   IonItem,
-  IonLabel,
   IonPage
 } from "@ionic/vue";
 import { computed, onMounted, ref } from "vue";

From 3bb73e66f1bd5fea0236dad26c4bdeebae1da017 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 10 Apr 2024 18:14:09 +0530
Subject: [PATCH 031/250] Implemented: logic for product filters selection
 (#250)

---
 src/components/AddProductFiltersModal.vue | 73 ++++++++---------------
 src/components/ProductFilters.vue         | 41 ++++++++-----
 src/locales/en.json                       |  8 +--
 src/store/modules/util/UtilState.ts       |  1 +
 src/store/modules/util/actions.ts         |  4 ++
 src/store/modules/util/getters.ts         |  5 +-
 src/store/modules/util/index.ts           | 12 +++-
 src/store/modules/util/mutation-types.ts  |  3 +-
 src/store/modules/util/mutations.ts       |  5 +-
 9 files changed, 82 insertions(+), 70 deletions(-)

diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index 5340c039..c045c54a 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -6,7 +6,7 @@
           <ion-icon slot="icon-only" :icon="arrowBackOutline" />
         </ion-button>
       </ion-buttons>
-      <ion-title>{{ $t(`${ type === 'included' ? `Include ${label}` : `Exclude ${label}` }`) }}</ion-title>
+      <ion-title>{{ type === "included" ? translate("Include", { label }) : translate("Exclude", { label }) }}</ion-title>
       <ion-buttons slot="end">
         <ion-button fill="clear" color="danger" @click="selectedValues = []">{{ $t("Clear All") }}</ion-button>
       </ion-buttons>
@@ -18,16 +18,17 @@
 
     <ion-list>
       <ion-item v-for="option in facetOptions" :key="option.id"  @click="updateSelectedValues(option.id)">
-        <ion-checkbox :checked="selectedValues.includes(option.id)">
+        <ion-label v-if="isAlreadyApplied(option.id)">{{ option.label }}</ion-label>
+        <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="selectedValues.includes(option.id)">
           {{ option.label }}
         </ion-checkbox>
-        <!-- <ion-note v-else slot="end" color="danger">{{ type === 'included' ? $t("excluded") : $t("included") }}</ion-note> -->
+        <ion-note v-else slot="end" color="danger">{{ type === 'included' ? $t("excluded") : $t("included") }}</ion-note>
       </ion-item>
     </ion-list>
 
     <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
     <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="saveFilters()">
         <ion-icon :icon="checkmarkOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -39,7 +40,7 @@
 </template>
 
 <script setup lang="ts">
-import { defineComponent } from "vue";
+import { computed, defineComponent, onMounted } from "vue";
 import {
   IonButton,
   IonButtons,
@@ -73,7 +74,14 @@ const isFilterChanged = ref(false);
 const isScrollable = ref(true);
 const selectedValues = ref([]) as any;
 
-const props = defineProps(["label", "facetToSelect", "searchfield", "type"])
+const props = defineProps(["label", "facetToSelect", "searchfield", "type"]);
+const store = useStore();
+
+const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
+
+onMounted(() => {
+  selectedValues.value = JSON.parse(JSON.stringify(appliedFilters.value[props.type][props.searchfield]))
+})
 
 function closeModal() {
   modalController.dismiss({ dismissed: true });
@@ -125,45 +133,16 @@ function updateSelectedValues(value: string) {
   selectedValues.value.includes(value) ? selectedValues.value.splice(selectedValues.value.indexOf(value), 1) : selectedValues.value.push(value);
 }
 
-// async updateFilters() {
-//   this.isFilterChanged = true;
-//   this.selectedValues.length ? await this.updateAppliedFilters() : await this.clearFilters();
-//   this.closeModal();
-// },
-// async updateAppliedFilters() {
-//   // if filters are not updated
-//   if (JSON.stringify(this.appliedFilters[this.type][this.searchfield].list) == JSON.stringify(this.selectedValues)) {
-//     this.isFilterChanged = false;
-//     return;
-//   }
-
-//   const appliedFilters = JSON.parse(JSON.stringify(this.appliedFilters[this.type][this.searchfield]))
-//   appliedFilters.list = this.selectedValues
-  
-//   await this.store.dispatch('product/updateAppliedFilters', {
-//     type: this.type,
-//     id: this.searchfield,
-//     value: appliedFilters
-//   })
-// },
-// async clearFilters() {
-//   // if no filters are already not applied
-//   if (!this.appliedFilters[this.type][this.searchfield].list.length) {
-//     this.isFilterChanged = false;
-//     return;
-//   }
-
-//   await this.store.dispatch('product/clearFilters', {
-//     type: this.type,
-//     id: this.searchfield,
-//     value: {
-//       list: [],
-//       operator: 'OR'
-//     }
-//   })
-// },
-// isAlreadyApplied(value: string) {
-//   const type = this.type === 'included' ? 'excluded' : 'included'
-//   return this.appliedFilters[type][this.searchfield].list.includes(value)
-// }
+function isAlreadyApplied(value: string) {
+  const type = props.type === 'included' ? 'excluded' : 'included'
+  return appliedFilters.value[type][props.searchfield].includes(value)
+}
+
+async function saveFilters() {
+  const selectedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
+  selectedFilters[props.type][props.searchfield] = selectedValues.value
+
+  await store.dispatch('util/updateAppliedFilters', selectedFilters)
+  modalController.dismiss()
+}
 </script>
\ No newline at end of file
diff --git a/src/components/ProductFilters.vue b/src/components/ProductFilters.vue
index 0e4354da..da58e68a 100644
--- a/src/components/ProductFilters.vue
+++ b/src/components/ProductFilters.vue
@@ -13,9 +13,9 @@
         </ion-button>
       </ion-item>
       <ion-card-content>
-        <ion-chip outline>
-          {{ "Tag name" }}
-          <ion-icon :icon="closeCircle"/>
+        <ion-chip outline v-for="(tag, index) in appliedFilters['included']['tags']" :key="index">
+          {{ tag }}
+          <ion-icon :icon="closeCircle" @click="removeFilters('included', 'tags', tag)" />
         </ion-chip>
       </ion-card-content>
     </ion-card>
@@ -29,9 +29,9 @@
         </ion-button>
       </ion-item>
       <ion-card-content>
-        <ion-chip outline>
-          {{ "Tag name" }}
-          <ion-icon :icon="closeCircle"/>
+        <ion-chip outline v-for="(tag, index) in appliedFilters['excluded']['tags']" :key="index">
+          {{ tag }}
+          <ion-icon :icon="closeCircle" @click="removeFilters('excluded', 'tags', tag)" />
         </ion-chip>
       </ion-card-content>
     </ion-card>
@@ -45,15 +45,15 @@
     <ion-card>
       <ion-item lines="none">
         <ion-label>{{ translate("Included") }}</ion-label>
-        <ion-button fill="clear" @click="openProductFilterModal('productFeatures', 'productFeaturesFacet', 'productFeatures', 'included')">
+        <ion-button fill="clear" @click="openProductFilterModal('product features', 'productFeaturesFacet', 'productFeatures', 'included')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
       </ion-item>
       <ion-card-content>
-        <ion-chip outline>
-          {{ "Feature name" }}
-          <ion-icon :icon="closeCircle"/>
+        <ion-chip outline v-for="(feature, index) in appliedFilters['included']['productFeatures']" :key="index">
+          {{ feature }}
+          <ion-icon :icon="closeCircle" @click="removeFilters('included', 'productFeatures', feature)" />
         </ion-chip>
       </ion-card-content>
     </ion-card>
@@ -61,15 +61,15 @@
     <ion-card>
       <ion-item lines="none"> 
         <ion-label>{{ translate("Excluded") }}</ion-label>
-        <ion-button fill="clear" @click="openProductFilterModal('productFeatures', 'productFeaturesFacet', 'productFeatures', 'included')">
+        <ion-button fill="clear" @click="openProductFilterModal('product features', 'productFeaturesFacet', 'productFeatures', 'excluded')">
           {{ translate("Add") }}
           <ion-icon :icon="addCircleOutline" slot="end" />
         </ion-button>
       </ion-item>
       <ion-card-content>
-        <ion-chip outline>
-          {{ "Feature name" }}
-          <ion-icon :icon="closeCircle"/>
+        <ion-chip outline v-for="(feature, index) in appliedFilters['excluded']['productFeatures']" :key="index">
+          {{ feature }}
+          <ion-icon :icon="closeCircle" @click="removeFilters('excluded', 'productFeatures', feature)" />
         </ion-chip>
       </ion-card-content>
     </ion-card>
@@ -81,6 +81,12 @@ import { IonButton, IonCard, IonCardContent, IonChip, IonIcon, IonItem, IonLabel
 import { addCircleOutline, closeCircle } from 'ionicons/icons'
 import { translate } from '@/i18n';
 import AddProductFiltersModal from '@/components/AddProductFiltersModal.vue';
+import { computed } from 'vue';
+import { useStore } from 'vuex';
+
+const store = useStore();
+
+const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
 
 async function openProductFilterModal(label: string, facetToSelect: string, searchfield: string, type: string) {
   const modal = await modalController.create({
@@ -95,4 +101,11 @@ async function openProductFilterModal(label: string, facetToSelect: string, sear
 
   modal.present()
 }
+
+async function removeFilters(type: string, id: string, value: string) {
+  const selectedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
+  selectedFilters[type][id] = selectedFilters[type][id].filter((filter: any) => filter !== value)
+
+  await store.dispatch('util/updateAppliedFilters', selectedFilters)
+}
 </script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index 224ef9dc..9efc7556 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -47,7 +47,7 @@
   "Every day": "Every day",
   "excluded": "excluded",
   "Excluded": "Excluded",
-  "Exclude tags": "Exclude tags",
+  "Exclude": "Exclude {label}",
   "Export product thresholds": "Export product thresholds",
   "Export product threshold jobs": "Export product threshold jobs",
   "Facilities": "Facilities",
@@ -62,7 +62,6 @@
   "Go to OMS": "Go to OMS",
   "History": "History",
   "Hourly": "Hourly",
-  "Exclude": "Exclude",
   "Facility groups": "Facility groups",
   "Filter stores": "Filter stores",
   "ID": "ID",
@@ -72,8 +71,7 @@
   "Inventory channels": "Inventory channels",
   "global threshold": "global threshold",
   "included": "included",
-  "Include": "Include",
-  "Include tags": "Include tags",
+  "Include": "Include {label}",
   "Info": "Info",
   "Inventory group": "Inventory group",
   "Jobs sequence updated successfully": "Jobs sequence updated successfully",
@@ -145,7 +143,7 @@
   "Schedule new threshold": "Schedule new threshold",
   "Schedule Job": "Schedule Job",
   "Search orders": "Search orders",
-  "Search tags": "Search tags",
+  "Search": "Search {label}",
   "Select": "Select",
   "Select all variants": "Select all variants",
   "Select CSV": "Select CSV",
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index 14b42e44..b1c6e0fa 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -1,3 +1,4 @@
 export default interface UtilState {
   configFacilities: any;
+  appliedFilters: any; 
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 86eeefba..a63408b6 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -32,6 +32,10 @@ const actions: ActionTree<UtilState, RootState> = {
     }
 
     commit(types.UTIL_CONFIG_FACILITES_UPDATED, configFacilities)
+  },
+
+  async updateAppliedFilters ({ commit, state }, payload) {
+    commit(types.UTIL_APPLIED_FILTERS_UPDATED, payload)
   }
 }
 
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 6ab69ec2..6c38ba9a 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -5,7 +5,10 @@ import RootState from '@/store/RootState'
 const getters: GetterTree<UtilState, RootState> = {
   getConfigFacilities(state) {
     return state.configFacilities ? JSON.parse(JSON.stringify(state.configFacilities)) : []
-  }
+  },
+  getAppliedFilters(state) {
+    return state.appliedFilters;
+  },
 }
 
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 8d6b0ccc..0b9624ec 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -8,7 +8,17 @@ import UtilState from './UtilState'
 const utilModule: Module<UtilState, RootState> = {
     namespaced: true,
     state: {
-      configFacilities: []
+      configFacilities: [],
+      appliedFilters: {
+        included: {
+          tags: [],
+          productFeatures: []
+        },
+        excluded: {
+          tags: [],
+          productFeatures: []
+        }
+      },
     },
     getters,
     actions,
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 8570e1ff..2129dc5f 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -1,2 +1,3 @@
 export const SN_UTIL = 'util'
-export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDATED'
\ No newline at end of file
+export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDATED'
+export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index 4cae5ba9..59d84c22 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -5,6 +5,9 @@ import * as types from './mutation-types'
 const mutations: MutationTree <UtilState> = {
   [types.UTIL_CONFIG_FACILITES_UPDATED] (state, payload) {
       state.configFacilities = payload
-  }
+  },
+  [types.UTIL_APPLIED_FILTERS_UPDATED] (state, payload) {
+    state.appliedFilters = payload
+  },
 }
 export default mutations;
\ No newline at end of file

From 440495b68c1fa3801ce744614f6e0fa26f3cc8ce Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 12 Apr 2024 09:28:19 +0530
Subject: [PATCH 032/250] Implemented: store and logic for fetching ruleGroup
 and rules (#250)

---
 src/services/RuleService.ts              | 15 ++++++++---
 src/store/index.ts                       |  6 +++--
 src/store/modules/rule/RuleState.ts      |  3 ++-
 src/store/modules/rule/actions.ts        | 34 ++++++++++++++++++++----
 src/store/modules/rule/getters.ts        |  7 ++++-
 src/store/modules/rule/index.ts          | 14 +++++-----
 src/store/modules/rule/mutation-types.ts |  4 ++-
 src/store/modules/rule/mutations.ts      |  8 +++++-
 src/views/CreateThresholdRule.vue        |  9 ++++++-
 src/views/Threshold.vue                  |  8 ++++++
 10 files changed, 87 insertions(+), 21 deletions(-)

diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index 4ba95efe..d8b2c19f 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -1,12 +1,21 @@
-import api, {client} from '@/api';
+import api from '@/api';
 
 const fetchRuleGroup = async (payload: any): Promise <any>  => {
   return api({
-    url: `ruleGroups/${payload.ruleGroupId}`,
+    url: `ruleGroups`,
+    method: "GET",
+    data: payload
+  });
+}
+
+const fetchRules = async (ruleGroupId: any): Promise <any>  => {
+  return api({
+    url: `ruleGroups/${ruleGroupId}/rules`,
     method: "GET"
   });
 }
 
 export const RuleService = {
-  fetchRuleGroup
+  fetchRuleGroup,
+  fetchRules
 }
\ No newline at end of file
diff --git a/src/store/index.ts b/src/store/index.ts
index 4c99ef5b..243d01cd 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -6,6 +6,7 @@ import RootState from './RootState'
 import createPersistedState from "vuex-persistedstate";
 import userModule from './modules/user';
 import utilModule from './modules/util';
+import ruleModule from './modules/rule';
 
 
 // TODO check how to register it from the components only
@@ -18,7 +19,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: ['user', 'util'],
+    paths: [],
     fetchBeforeUse: true
 })
 
@@ -31,7 +32,8 @@ const store = createStore<RootState>({
     plugins: [ persistState ],
     modules: { 
         'user': userModule,
-        'util': utilModule
+        'util': utilModule,
+        'rule': ruleModule
     },
 })
 
diff --git a/src/store/modules/rule/RuleState.ts b/src/store/modules/rule/RuleState.ts
index 335f2a44..eb62feae 100644
--- a/src/store/modules/rule/RuleState.ts
+++ b/src/store/modules/rule/RuleState.ts
@@ -1,3 +1,4 @@
 export default interface RuleState {
-    
+  rules: any;
+  ruleGroup: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 1c7a4103..02d4a3fd 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -8,19 +8,43 @@ import logger from '@/logger'
 
 
 const actions: ActionTree<RuleState, RootState> = {
-  async fetchRuleGroup({ commit }, ruleGroupId) {
+  async fetchRuleGroup({ commit }, payload) {
+    let ruleGroup = {} as any;
+
+    try {
+      const resp = await RuleService.fetchRuleGroup(payload)
+      if(!hasError(resp) && resp.data.length) {
+        ruleGroup = resp.data[0]
+      } else {
+        throw resp.data;
+      }
+    } catch(err: any) {
+      logger.error("No rule group found");
+      throw new Error("No rule group found")
+    }
+
+    commit(types.RULE_GROUP_UPDATED, ruleGroup);
+    return ruleGroup
+  },
+
+  async fetchRules({ commit, dispatch }, payload) {
+    let rules = [] as any;
+
     try {
-      const resp = await RuleService.fetchRuleGroup(ruleGroupId)
+      const ruleGroup = await dispatch('fetchRuleGroup', payload)
+
+      const resp = await RuleService.fetchRules(ruleGroup.groupId)
 
       if(!hasError(resp)) {
-        console.log(resp);
-        
+        rules = resp.data;
       } else {
-        throw resp.data;
+        throw resp.data
       }
     } catch(err: any) {
       logger.error(err);
     }
+
+    commit(types.RULE_RULES_UPDATED, rules);
   },
 }
 
diff --git a/src/store/modules/rule/getters.ts b/src/store/modules/rule/getters.ts
index 01ccbe6c..bc056e4d 100644
--- a/src/store/modules/rule/getters.ts
+++ b/src/store/modules/rule/getters.ts
@@ -3,6 +3,11 @@ import RootState from '@/store/RootState'
 import RuleState from './RuleState';
 
 const getters: GetterTree <RuleState, RootState> = {
-    
+  getRules (state) {
+    return state.rules;
+  },
+  getRuleGroup (state) {
+    return state.ruleGroup
+  }
 }
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/rule/index.ts b/src/store/modules/rule/index.ts
index ee1083a5..ed0802f9 100644
--- a/src/store/modules/rule/index.ts
+++ b/src/store/modules/rule/index.ts
@@ -6,12 +6,14 @@ import RootState from '@/store/RootState'
 import RuleState from './RuleState'
 
 const userModule: Module<RuleState, RootState> = {
-    namespaced: true,
-    state: {
-    },
-    getters,
-    actions,
-    mutations,
+  namespaced: true,
+  state: {
+    rules: [],
+    ruleGroup: {}
+  },
+  getters,
+  actions,
+  mutations,
 }
 
 export default userModule;
\ No newline at end of file
diff --git a/src/store/modules/rule/mutation-types.ts b/src/store/modules/rule/mutation-types.ts
index 3b389deb..ad7c41f2 100644
--- a/src/store/modules/rule/mutation-types.ts
+++ b/src/store/modules/rule/mutation-types.ts
@@ -1 +1,3 @@
-export const SN_RULE = 'rule'
\ No newline at end of file
+export const SN_RULE = 'rule'
+export const RULE_RULES_UPDATED = SN_RULE + '/RULES_UPDATED'
+export const RULE_GROUP_UPDATED = SN_RULE + '/GROUP_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/rule/mutations.ts b/src/store/modules/rule/mutations.ts
index 3b559428..e9ea631e 100644
--- a/src/store/modules/rule/mutations.ts
+++ b/src/store/modules/rule/mutations.ts
@@ -1,7 +1,13 @@
 import { MutationTree } from 'vuex'
 import RuleState from './RuleState';
+import * as types from './mutation-types'
 
 const mutations: MutationTree <RuleState> = {
-   
+  [types.RULE_RULES_UPDATED] (state, payload) {
+    state.rules = payload;
+  },
+  [types.RULE_GROUP_UPDATED] (state, payload) {
+    state.ruleGroup = payload;
+  },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 1849a010..1dee2a32 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -46,7 +46,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="createThresholdRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -86,6 +86,7 @@ const formData = ref({
 }) as any;
 
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
+const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
 
 onMounted(async () => {
   await store.dispatch("util/fetchConfigFacilities");
@@ -102,6 +103,12 @@ function toggleFacilitySelection(facilityId: any) {
 function isFacilitySelected(facilityId: any) {
   return formData.value.selectedConfigFacilites.includes(facilityId)
 }
+
+function createThresholdRule() {
+  console.log(formData);
+  console.log(appliedFilters.value);
+  
+}
 </script>
 
 <style scoped>
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index c38ace8b..5765ff48 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -32,9 +32,17 @@ import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
+import { onMounted } from 'vue';
+import { useStore } from 'vuex';
 
+
+const store = useStore();
 const router = useRouter()
 
+onMounted(async() => {
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
+})
+
 function CreateThreshold() {
   router.replace({ path: '/create-threshold' })
 }

From c88362645456d84f0d8282a57f7de522fddc70cc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 12 Apr 2024 12:43:55 +0530
Subject: [PATCH 033/250] Implmented: logic for creating and fetching threshold
 rule (#250)

---
 src/components/RuleItem.vue       | 10 ++--
 src/services/RuleService.ts       | 87 ++++++++++++++++++++++++++++-
 src/store/index.ts                |  2 +-
 src/store/modules/rule/actions.ts | 25 +++++++--
 src/views/CreateThresholdRule.vue | 92 +++++++++++++++++++++++++++++--
 src/views/Threshold.vue           |  7 ++-
 6 files changed, 204 insertions(+), 19 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index d47b4d51..2b5420fb 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -2,8 +2,8 @@
   <ion-card>
     <ion-card-header>
       <div>
-        <ion-card-subtitle class="overline">{{ "Rule ID" }}</ion-card-subtitle>
-        <ion-card-title>{{ "Rule name" }}</ion-card-title>
+        <ion-card-subtitle class="overline">{{ rule.ruleId }}</ion-card-subtitle>
+        <ion-card-title>{{ rule.ruleName }}</ion-card-title>
         <ion-card-subtitle>{{ "1/4" }}</ion-card-subtitle>
       </div>
       <div>
@@ -19,7 +19,7 @@
     <ion-item lines="full" v-if="selectedPage.path === '/threshold'">
       <ion-icon slot="start" :icon="globeOutline"/>
       <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
-      <ion-chip slot="end" outline @click="editThreshold()">5</ion-chip>
+      <ion-chip slot="end" outline @click="editThreshold()">{{ rule.ruleActions[0].fieldValue }}</ion-chip>
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/safety-stock'">
       <ion-icon slot="start" :icon="pulseOutline"/>
@@ -129,7 +129,7 @@ import { translate } from '@/i18n';
 
 const router = useRouter();
 
-defineProps(["selectedSegment"])
+const props = defineProps(["selectedSegment", "rule"])
 
 const selectedPage = ref({
   path: '',
@@ -139,6 +139,8 @@ const selectedPage = ref({
 onMounted(() => {
   selectedPage.value.path = router.currentRoute.value.path
   selectedPage.value.name = router.currentRoute.value.name
+  console.log(props.rule);
+  
 })
 
 async function editThreshold() {
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index d8b2c19f..d07c6b71 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -1,4 +1,6 @@
 import api from '@/api';
+import logger from '@/logger';
+import { hasError } from '@/utils';
 
 const fetchRuleGroup = async (payload: any): Promise <any>  => {
   return api({
@@ -15,7 +17,90 @@ const fetchRules = async (ruleGroupId: any): Promise <any>  => {
   });
 }
 
+const createRuleGroup = async (payload: any): Promise <any>  => {
+  let ruleGroup = {}
+  try {
+    const resp = await api({
+      url: `ruleGroups/`,
+      method: "POST",
+      data: payload
+    }) as any;
+
+    if(!hasError(resp)) {
+      ruleGroup = resp.data;
+    } else {
+      throw resp.data
+    }
+  } catch(err: any) {
+    logger.error(err)
+    return Promise.reject("Failed to create rule group");
+  }
+  return Promise.resolve(ruleGroup);
+}
+
+const createRule = async (payload: any): Promise <any>  => {
+  let rule = {}
+  try {
+    const resp = await api({
+      url: `decisionRules/`,
+      method: "POST",
+      data: payload
+    }) as any;
+    
+    if(!hasError(resp)) {
+      rule = resp.data;
+    } else {
+      throw resp.data
+    }
+  } catch(err: any) {
+    logger.error(err)
+    return Promise.reject("Failed to create rule");
+  }
+  return Promise.resolve(rule);
+}
+
+const updateRule = async (payload: any, ruleId: string): Promise <any>  => {
+  try {
+    const resp = await api({
+      url: `decisionRules/${ruleId}`,
+      method: "POST",
+      data: payload
+    }) as any;
+    
+    if(!hasError(resp)) {
+      return Promise.resolve(resp.data)
+    } else {
+      throw resp.data
+    }
+  } catch(err: any) {
+    logger.error(err)
+    return Promise.reject("Failed to update rule");
+  }
+}
+
+const fetchRulesActionsAndConditions = async (ruleId: any): Promise <any>  => {
+  try {
+    const resp = await api({
+      url: `decisionRules/${ruleId}`,
+      method: "GET"
+    }) as any;
+    
+    if(!hasError(resp)) {
+      return Promise.resolve(resp.data)
+    } else {
+      throw resp.data
+    }
+  } catch(err: any) {
+    logger.error(err)
+    return Promise.reject("Failed to update rule");
+  }
+}
+
 export const RuleService = {
+  createRule,
+  createRuleGroup,
   fetchRuleGroup,
-  fetchRules
+  fetchRules,
+  fetchRulesActionsAndConditions,
+  updateRule
 }
\ No newline at end of file
diff --git a/src/store/index.ts b/src/store/index.ts
index 243d01cd..81382037 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -19,7 +19,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: [],
+    paths: ['user'],
     fetchBeforeUse: true
 })
 
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 02d4a3fd..3bdcfe7b 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -20,23 +20,38 @@ const actions: ActionTree<RuleState, RootState> = {
       }
     } catch(err: any) {
       logger.error("No rule group found");
-      throw new Error("No rule group found")
     }
-
+    
     commit(types.RULE_GROUP_UPDATED, ruleGroup);
     return ruleGroup
   },
 
   async fetchRules({ commit, dispatch }, payload) {
-    let rules = [] as any;
+    const rules = [] as any;
 
     try {
       const ruleGroup = await dispatch('fetchRuleGroup', payload)
 
-      const resp = await RuleService.fetchRules(ruleGroup.groupId)
+      if(!ruleGroup.ruleGroupId) {
+        throw new Error("No rule founds")
+      }
+      const resp = await RuleService.fetchRules(ruleGroup.ruleGroupId)
 
       if(!hasError(resp)) {
-        rules = resp.data;
+        const responses = await Promise.allSettled(
+          resp.data.map((rule: any) => RuleService.fetchRulesActionsAndConditions(rule.ruleId))
+        )
+
+        const hasFailedResponse = responses.some((response: any) => hasError(response.value))
+        if (hasFailedResponse) {
+          logger.error('Failed to fetch some rules')
+        }
+
+        responses.map((response: any) => {
+          if(response.status === 'fulfilled') {
+            rules.push(response.value)
+          }
+        })
       } else {
         throw resp.data
       }
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 1dee2a32..9bd2e807 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -17,7 +17,7 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input :label="translate('Name')" v-model="formData.name" />
+                <ion-input :label="translate('Name')" v-model="formData.ruleName" />
               </ion-item>
               <ion-item>
                 <ion-input :label="translate('Threshold')" v-model="formData.threshold" />
@@ -77,10 +77,14 @@ import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
 import { computed, onMounted, ref } from 'vue';
 import { useStore } from 'vuex';
+import { RuleService } from '@/services/RuleService';
+import { showToast } from '@/utils';
+import logger from '@/logger';
+import router from '@/router';
 
 const store = useStore();
 const formData = ref({
-  name: '',
+  ruleName: '',
   threshold: '',
   selectedConfigFacilites: []
 }) as any;
@@ -104,10 +108,88 @@ function isFacilitySelected(facilityId: any) {
   return formData.value.selectedConfigFacilites.includes(facilityId)
 }
 
-function createThresholdRule() {
-  console.log(formData);
-  console.log(appliedFilters.value);
+function generateRuleActions(ruleId: string) {
+  return [{
+    "_entity": "ruleAction",
+    "ruleId": ruleId,
+    "actionTypeEnumId": "ATP_THRESHOLD",
+    "fieldName": "safety_stock",
+    "fieldValue": formData.value.threshold
+  }]
+}
+
+function generateRuleConditions(ruleId: string) {
+  const conditions = [];
+  
+  const selectedFacilites = formData.value.selectedConfigFacilites
+  if(selectedFacilites?.length) {
+    conditions.push({
+      "_entity": "ruleCondition",
+      "ruleId": ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
+      "fieldName": "facilities",
+      "operator": "in",
+      "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
+      "multiValued": selectedFacilites.length > 1 ? "Y" : "N"
+    })
+  }
+
+  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+    Object.entries(filters as any).map(([filter, value]: any) => {
+      if(value.length) {
+        conditions.push({ 
+          "_entity": "ruleCondition",
+          "ruleId": ruleId,
+          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+          "fieldName": filter,
+          "operator": type === "included" ? "in" : "not-in",
+          "fieldValue": value.length > 1 ? value.join(",") : value[0],
+          "multiValued": value?.length > 1 ? "Y" : "N"
+        })
+      }
+    })
+  })
+
+  return conditions;
+}
+
+async function createThresholdRule() {
+  let ruleGroup =   await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_THRESHOLD" });
+
+  try {
+    if(!ruleGroup.ruleGroupId) {
+      ruleGroup = await RuleService.createRuleGroup({
+        "_entity": "ruleGroup",
+        "groupTypeEnumId": "RG_THRESHOLD"
+      })
+    }
+    
+    const rule = await RuleService.createRule({
+      "_entity": "rule",
+      "ruleId": formData.value.ruleName.trim().toUpperCase().split(' ').join('_'),
+      "ruleGroupId": ruleGroup.ruleGroupId,
+      "ruleName": formData.value.ruleName
+    })
+    
+    const actions = generateRuleActions(rule.ruleId)
+    const conditions = generateRuleConditions(rule.ruleId)
+    
+    await RuleService.updateRule({
+      "_entity": "rule",
+    "ruleId": rule.ruleId,
+    "ruleGroupId": ruleGroup.ruleGroupId,
+    "ruleName": formData.value.ruleName,
+    "lastUpdatedStamp": "2024-04-12T05:05:48.770Z",
+    "ruleConditions": conditions,
+    "ruleActions": actions
+    }, rule.ruleId)
   
+    showToast(translate("Rule created successfully."))
+    router.push("/threshold");
+  } catch(err: any) {
+    logger.error(err);
+    showToast(translate("Failed to create rule"))
+  }  
 }
 </script>
 
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 5765ff48..0c5e961f 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -12,8 +12,7 @@
         <ScheduleRuleItem />
 
         <section>
-          <RuleItem />
-          <RuleItem />
+          <RuleItem v-for="rule in rules" :rule="rule" :key="rule.ruleId" />
         </section>
       </main>
 
@@ -32,13 +31,15 @@ import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
-import { onMounted } from 'vue';
+import { computed, onMounted } from 'vue';
 import { useStore } from 'vuex';
 
 
 const store = useStore();
 const router = useRouter()
 
+const rules = computed(() => store.getters["rule/getRules"]);
+
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
 })

From 9ff8385a88f7812b37814e72b6405216195d1ba6 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 12 Apr 2024 16:45:55 +0530
Subject: [PATCH 034/250] Improved: added statusId and sequenceNum while rule
 creation and code to display rule items on threshold page (#250)

---
 src/components/RuleItem.vue         | 122 +++++++++++++++++++++++-----
 src/services/RuleService.ts         |  10 +--
 src/store/modules/rule/actions.ts   |  21 ++++-
 src/store/modules/rule/getters.ts   |   5 +-
 src/store/modules/rule/index.ts     |   5 +-
 src/store/modules/rule/mutations.ts |   3 +-
 src/utils/index.ts                  |   2 +-
 src/views/CreateThresholdRule.vue   |  21 ++---
 src/views/Threshold.vue             |   1 +
 9 files changed, 146 insertions(+), 44 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 2b5420fb..8fb484d4 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -4,7 +4,7 @@
       <div>
         <ion-card-subtitle class="overline">{{ rule.ruleId }}</ion-card-subtitle>
         <ion-card-title>{{ rule.ruleName }}</ion-card-title>
-        <ion-card-subtitle>{{ "1/4" }}</ion-card-subtitle>
+        <ion-card-subtitle>{{ "1/" }}{{ total }}</ion-card-subtitle>
       </div>
       <div>
         <ion-button fill="clear" color="medium" class="ion-no-padding">
@@ -19,7 +19,7 @@
     <ion-item lines="full" v-if="selectedPage.path === '/threshold'">
       <ion-icon slot="start" :icon="globeOutline"/>
       <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
-      <ion-chip slot="end" outline @click="editThreshold()">{{ rule.ruleActions[0].fieldValue }}</ion-chip>
+      <ion-chip slot="end" outline @click="editThreshold()">{{ rule.ruleActions[0]?.fieldValue }}</ion-chip>
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/safety-stock'">
       <ion-icon slot="start" :icon="pulseOutline"/>
@@ -43,7 +43,7 @@
             <ion-icon :icon="optionsOutline" slot="icon-only" />
           </ion-button>
         </ion-item-divider>
-        
+
         <ion-item lines="none">
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ "<Config facility Id>, <Config facility Id>" }}</ion-label>
@@ -58,11 +58,13 @@
           </ion-button>
         </ion-item-divider>
 
-        <ion-item v-if="selectedPage.path === '/threshold'" lines="none">
-          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ "<Config facility Name, Config facility Name>" }}</ion-label>
-        </ion-item>
-  
+        <template v-if="selectedPage.path === '/threshold'">
+          <ion-item v-if="getRuleConditions('ENTCT_ATP_FACILITIES')" lines="none">
+            <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+            <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FACILITIES") }}</ion-label>
+          </ion-item>
+        </template>
+
         <template v-else>
           <ion-item>
             <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
@@ -83,35 +85,35 @@
         </ion-button>
       </ion-item-divider>
 
-      <ion-item>
+      <ion-item v-if="getRuleConditions('ENTCT_ATP_FILTER', 'tags', 'in')">
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
       </ion-item>
-      <ion-item lines="none">
+      <ion-item lines="none" v-if="getRuleConditions('ENTCT_ATP_FILTER', 'tags', 'not-in')">
         <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ "<Product Tag, Product Tag>" }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
       </ion-item>
 
-      <template v-if="selectedPage.path === '/threshold' || selectedPage.path === '/safety-stock'">
+      <template v-if="(selectedPage.path === '/threshold' || selectedPage.path === '/safety-stock')">
         <ion-item-divider color="light">
           <ion-label>{{ translate("Product features") }}</ion-label>
           <ion-button slot="end" fill="clear" color="medium">
             <ion-icon :icon="optionsOutline" slot="icon-only" />
           </ion-button>
         </ion-item-divider>
-  
-        <ion-item>
+
+        <ion-item v-if="getRuleConditions('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ "<Product Features, Product Features>" }}</ion-label>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
         </ion-item>
-        <ion-item lines="full">
+        <ion-item lines="full" v-if="getRuleConditions('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
           <ion-icon slot="start" :icon="closeCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ "<Product Features, Product Features>" }}</ion-label>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
         </ion-item>
       </template>
 
       <ion-item lines="none">
-        <ion-button fill="clear">{{ translate("Edit name") }}</ion-button>
+        <ion-button @click="editRuleName()" fill="clear">{{ translate("Edit name") }}</ion-button>
         <ion-button color="medium" fill="clear" slot="end">
           <ion-icon :icon="archiveOutline" slot="icon-only"/>
         </ion-button>
@@ -122,14 +124,21 @@
 
 <script setup lang="ts">
 import { IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController, popoverController } from '@ionic/vue';
-import { defineProps, onMounted, ref } from 'vue';
+import { computed, defineProps, onMounted, ref } from 'vue';
 import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@/i18n';
+import { RuleService } from '@/services/RuleService';
+import { useStore } from 'vuex';
+import { hasError, showToast } from '@/utils';
+import logger from '@/logger';
 
 const router = useRouter();
+const store = useStore();
 
 const props = defineProps(["selectedSegment", "rule"])
+const total = computed(() => store.getters["rule/getTotalRulesCount"])
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 
 const selectedPage = ref({
   path: '',
@@ -139,8 +148,6 @@ const selectedPage = ref({
 onMounted(() => {
   selectedPage.value.path = router.currentRoute.value.path
   selectedPage.value.name = router.currentRoute.value.name
-  console.log(props.rule);
-  
 })
 
 async function editThreshold() {
@@ -150,6 +157,7 @@ async function editThreshold() {
       name: "threshold",
       placeholder: translate("Threshold"),
       type: "number",
+      value: props.rule.ruleActions[0].fieldValue,
       min: 0
     }],
     buttons: [{
@@ -158,6 +166,22 @@ async function editThreshold() {
     },
     {
       text: translate('Update'),
+      handler: async(data) => {
+        if(data.threshold) {
+          const rule = JSON.parse(JSON.stringify(props.rule))
+          rule.ruleActions[0].fieldValue = data.threshold
+
+          try {
+            await RuleService.updateRule(rule, props.rule.ruleId)
+            await store.dispatch('rule/updateRuleData', { rule })
+            showToast(translate("Threshold updated successfully."))
+            alertController.dismiss()
+          } catch(err: any) {
+            showToast(translate("Failed to update threhold."))
+            logger.error(err);
+          }
+        }
+      }
     }]
   })
 
@@ -184,6 +208,60 @@ async function editSafetyStock() {
 
   await alert.present()
 }
+
+async function editRuleName() {
+  const alert = await alertController.create({
+    header: translate("Edit rule name"),
+    inputs: [{
+      name: "safetyStock",
+      placeholder: translate("Name"),
+      type: "text",
+      value: props.rule.ruleName
+    }],
+    buttons: [{
+      text: translate('Cancel'),
+      role: "cancel"
+    },
+    {
+      text: translate('Update'),
+      handler: async(data) => {
+        if(data.safetyStock) {
+          const rule = JSON.parse(JSON.stringify(props.rule))
+          rule.ruleName = data.safetyStock
+
+          try {
+            await RuleService.updateRule(rule, props.rule.ruleId)
+            showToast(translate("Rule name updated successfully."))
+            await store.dispatch('rule/updateRuleData', { rule })
+            alertController.dismiss()
+          } catch(err: any) {
+            logger.error(err)
+            showToast(translate("Failed to update rule name."))
+          }
+        }
+      }
+    }]
+  })
+
+  await alert.present()
+}
+
+function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, operator? : string) {
+  if(fieldName && operator) {
+    const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)
+    return condition?.fieldValue.split(",").join(", ")
+  } else {
+    const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)
+    if(condition) {
+      let facilities = condition?.fieldValue.split(",")
+      facilities = facilities.map((id: string) => {
+        let facility = configFacilities.value.find((facility: any) => facility.facilityId === id)
+        return facility ? facility.facilityName : null
+      })
+      return facilities.join(", ")
+    }
+  }
+}
 </script>
 
 <style scoped>
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index d07c6b71..6dae159b 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -10,10 +10,11 @@ const fetchRuleGroup = async (payload: any): Promise <any>  => {
   });
 }
 
-const fetchRules = async (ruleGroupId: any): Promise <any>  => {
+const fetchRules = async (payload: any): Promise <any>  => {
   return api({
-    url: `ruleGroups/${ruleGroupId}/rules`,
-    method: "GET"
+    url: `ruleGroups/${payload.ruleGroupId}/rules`,
+    method: "GET",
+    params: payload
   });
 }
 
@@ -73,8 +74,7 @@ const updateRule = async (payload: any, ruleId: string): Promise <any>  => {
       throw resp.data
     }
   } catch(err: any) {
-    logger.error(err)
-    return Promise.reject("Failed to update rule");
+    return Promise.reject(err ? err : "Failed to update rule");
   }
 }
 
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 3bdcfe7b..039c472d 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -14,6 +14,7 @@ const actions: ActionTree<RuleState, RootState> = {
     try {
       const resp = await RuleService.fetchRuleGroup(payload)
       if(!hasError(resp) && resp.data.length) {
+        
         ruleGroup = resp.data[0]
       } else {
         throw resp.data;
@@ -35,7 +36,11 @@ const actions: ActionTree<RuleState, RootState> = {
       if(!ruleGroup.ruleGroupId) {
         throw new Error("No rule founds")
       }
-      const resp = await RuleService.fetchRules(ruleGroup.ruleGroupId)
+      const resp = await RuleService.fetchRules({ 
+        ruleGroupId: ruleGroup.ruleGroupId,
+        "statusId": "ATP_RULE_ACTIVE",
+        "orderByField": "sequenceNum"
+      })
 
       if(!hasError(resp)) {
         const responses = await Promise.allSettled(
@@ -58,9 +63,19 @@ const actions: ActionTree<RuleState, RootState> = {
     } catch(err: any) {
       logger.error(err);
     }
-
-    commit(types.RULE_RULES_UPDATED, rules);
+    commit(types.RULE_RULES_UPDATED, { list: rules, total: rules.length});
   },
+  
+  updateRuleData({ commit, state }, payload) {
+    const rules = JSON.parse(JSON.stringify(state.rules.list))
+
+    const index = rules.findIndex((rule: any) => rule.ruleId === payload.rule.ruleId);
+    // If index is found, replace the object
+    if (index !== -1) {
+      rules.splice(index, 1, payload.rule);
+    }
+    commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total});
+  }
 }
 
 export default actions;
\ No newline at end of file
diff --git a/src/store/modules/rule/getters.ts b/src/store/modules/rule/getters.ts
index bc056e4d..17899261 100644
--- a/src/store/modules/rule/getters.ts
+++ b/src/store/modules/rule/getters.ts
@@ -4,7 +4,10 @@ import RuleState from './RuleState';
 
 const getters: GetterTree <RuleState, RootState> = {
   getRules (state) {
-    return state.rules;
+    return state.rules.list;
+  },
+  getTotalRulesCount (state) {
+    return state.rules.total;
   },
   getRuleGroup (state) {
     return state.ruleGroup
diff --git a/src/store/modules/rule/index.ts b/src/store/modules/rule/index.ts
index ed0802f9..d3e52d6d 100644
--- a/src/store/modules/rule/index.ts
+++ b/src/store/modules/rule/index.ts
@@ -8,7 +8,10 @@ import RuleState from './RuleState'
 const userModule: Module<RuleState, RootState> = {
   namespaced: true,
   state: {
-    rules: [],
+    rules: {
+      list: [],
+      total: ''
+    },
     ruleGroup: {}
   },
   getters,
diff --git a/src/store/modules/rule/mutations.ts b/src/store/modules/rule/mutations.ts
index e9ea631e..850f5ff5 100644
--- a/src/store/modules/rule/mutations.ts
+++ b/src/store/modules/rule/mutations.ts
@@ -4,7 +4,8 @@ import * as types from './mutation-types'
 
 const mutations: MutationTree <RuleState> = {
   [types.RULE_RULES_UPDATED] (state, payload) {
-    state.rules = payload;
+    state.rules.list = payload.list;
+    state.rules.total = payload.total;
   },
   [types.RULE_GROUP_UPDATED] (state, payload) {
     state.ruleGroup = payload;
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 7226d8df..8e082b97 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -12,7 +12,7 @@ const showToast = async (message: string) => {
     .create({
       message,
       duration: 3000,
-      position: "top",
+      position: "bottom",
     })
   return toast.present();
 }
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 9bd2e807..29cab749 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -91,6 +91,8 @@ const formData = ref({
 
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
+const rules = computed(() => store.getters["rule/getRules"]);
+const total = computed(() => store.getters["rule/getTotalRulesCount"])
 
 onMounted(async () => {
   await store.dispatch("util/fetchConfigFacilities");
@@ -163,12 +165,14 @@ async function createThresholdRule() {
         "groupTypeEnumId": "RG_THRESHOLD"
       })
     }
-    
+
     const rule = await RuleService.createRule({
       "_entity": "rule",
       "ruleId": formData.value.ruleName.trim().toUpperCase().split(' ').join('_'),
       "ruleGroupId": ruleGroup.ruleGroupId,
-      "ruleName": formData.value.ruleName
+      "ruleName": formData.value.ruleName,
+      "statusId": "ATP_RULE_ACTIVE",
+      "sequenceNum": total.value ? rules.value[total.value-1].sequenceNum + 1 : 1
     })
     
     const actions = generateRuleActions(rule.ruleId)
@@ -176,14 +180,11 @@ async function createThresholdRule() {
     
     await RuleService.updateRule({
       "_entity": "rule",
-    "ruleId": rule.ruleId,
-    "ruleGroupId": ruleGroup.ruleGroupId,
-    "ruleName": formData.value.ruleName,
-    "lastUpdatedStamp": "2024-04-12T05:05:48.770Z",
-    "ruleConditions": conditions,
-    "ruleActions": actions
-    }, rule.ruleId)
-  
+      "ruleId": rule.ruleId,
+      "ruleConditions": conditions,
+      "ruleActions": actions
+    }, rule.ruleId);
+
     showToast(translate("Rule created successfully."))
     router.push("/threshold");
   } catch(err: any) {
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 0c5e961f..23c5e3e7 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -42,6 +42,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
+  await store.dispatch("util/fetchConfigFacilities");
 })
 
 function CreateThreshold() {

From 98e0d280e2053d0d3db5081c313ee08d301171b8 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 12 Apr 2024 18:29:44 +0530
Subject: [PATCH 035/250] Implemented: logic to archive an rule (#250)

---
 src/components/RuleItem.vue       | 31 ++++++++++++++++++++++++++++++-
 src/store/modules/rule/actions.ts | 10 ++++++++++
 2 files changed, 40 insertions(+), 1 deletion(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 8fb484d4..6f8ca104 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -114,7 +114,7 @@
 
       <ion-item lines="none">
         <ion-button @click="editRuleName()" fill="clear">{{ translate("Edit name") }}</ion-button>
-        <ion-button color="medium" fill="clear" slot="end">
+        <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
           <ion-icon :icon="archiveOutline" slot="icon-only"/>
         </ion-button>
       </ion-item>
@@ -262,6 +262,35 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
     }
   }
 }
+
+async function archiveRule() {
+  const alert = await alertController
+    .create({
+      header: translate('Archive rule'),
+      message: translate('Are you sure you want to archive this rule?'),
+      buttons: [{
+        text: translate('No'),
+        role: 'cancel'
+      }, {
+        text: translate('Yes'),
+        handler: async () => {
+          const rule = JSON.parse(JSON.stringify(props.rule))
+          rule.statusId = "ATP_RULE_ARCHIVED"
+
+          try {
+            await RuleService.updateRule(rule, props.rule.ruleId)
+            await store.dispatch('rule/archiveRule', { rule })
+            showToast(translate("Rule archived successfully."))
+            alertController.dismiss()
+          } catch(err: any) {
+            showToast(translate("Failed to update threhold."))
+            logger.error(err);
+          }
+        }
+      }]
+    });
+  return alert.present();
+}
 </script>
 
 <style scoped>
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 039c472d..0f461a57 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -75,6 +75,16 @@ const actions: ActionTree<RuleState, RootState> = {
       rules.splice(index, 1, payload.rule);
     }
     commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total});
+  },
+
+  archiveRule({ commit, state }, { rule }) {
+    const rules = JSON.parse(JSON.stringify(state.rules.list))
+
+    const index = rules.findIndex((currRule: any) => currRule.ruleId === rule.ruleId);
+    if (index !== -1) {
+      rules.splice(index, 1);
+    }
+    commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total});
   }
 }
 

From 470504a303f5da955a226133e3bec320806797d1 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 15 Apr 2024 11:14:26 +0530
Subject: [PATCH 036/250] Implemented: modal for config facilities selection
 (#250)

---
 src/components/RuleItem.vue                   |  29 ++++-
 .../SelectConfigFacilitiesModal.vue           | 105 ++++++++++++++++++
 src/services/RuleService.ts                   |   2 +-
 3 files changed, 130 insertions(+), 6 deletions(-)
 create mode 100644 src/components/SelectConfigFacilitiesModal.vue

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 6f8ca104..9b1446c3 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -26,7 +26,7 @@
       <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
       <ion-chip slot="end" outline @click="editSafetyStock()">5</ion-chip>
     </ion-item>
-    <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">
+    <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">Fixed the positioning of the security group displayed for the loggedin user.
       <ion-icon slot="start" :icon="storefrontOutline"/>
       <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
     </ion-item>
@@ -53,7 +53,7 @@
       <template v-else>
         <ion-item-divider color="light">
           <ion-label>{{ translate("Facility groups") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium">
+          <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()" >
             <ion-icon :icon="optionsOutline" slot="icon-only" />
           </ion-button>
         </ion-item-divider>
@@ -123,15 +123,16 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController, popoverController } from '@ionic/vue';
+import { IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController, modalController } from '@ionic/vue';
 import { computed, defineProps, onMounted, ref } from 'vue';
 import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@/i18n';
 import { RuleService } from '@/services/RuleService';
 import { useStore } from 'vuex';
-import { hasError, showToast } from '@/utils';
+import { showToast } from '@/utils';
 import logger from '@/logger';
+import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
 
 const router = useRouter();
 const store = useStore();
@@ -252,7 +253,8 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
     return condition?.fieldValue.split(",").join(", ")
   } else {
     const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)
-    if(condition) {
+
+    if(condition && condition.fieldValue) {
       let facilities = condition?.fieldValue.split(",")
       facilities = facilities.map((id: string) => {
         let facility = configFacilities.value.find((facility: any) => facility.facilityId === id)
@@ -291,6 +293,23 @@ async function archiveRule() {
     });
   return alert.present();
 }
+
+function getSelectedFacilities() {
+  const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
+  return condition.fieldValue ? condition.fieldValue.split(",") : []
+}
+
+async function openSelectConfigFacilitiesModal() {
+  const modal = await modalController.create({
+    component: SelectConfigFacilitiesModal,
+    componentProps: {
+      selectedFacilities: getSelectedFacilities(),
+      rule: props.rule
+    },
+  })
+
+  modal.present()
+}
 </script>
 
 <style scoped>
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
new file mode 100644
index 00000000..d09259a1
--- /dev/null
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -0,0 +1,105 @@
+<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("Select facilities") }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-list>
+      <ion-item v-for="facility in configFacilities" :key="facility.facilityId">
+        <ion-checkbox :checked="isSelected(facility.facilityId)" @ionChange="toggleFacilitySelection(facility)">
+          <ion-label>
+            {{ facility.facilityName }}
+            <p>{{ facility.facilityId }}</p>
+          </ion-label>
+        </ion-checkbox>
+      </ion-item>
+    </ion-list>
+
+    <ion-fab @click="saveFacilities()" vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button>
+        <ion-icon :icon="saveOutline" />  
+      </ion-fab-button>
+    </ion-fab>
+  </ion-content>
+</template>
+  
+<script setup lang="ts">
+import {
+  IonButtons,
+  IonButton,
+  IonCheckbox,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonItem,
+  IonLabel,
+  IonList,
+  IonTitle,
+  IonToolbar,
+  modalController
+} from "@ionic/vue";
+import { computed, defineProps, onMounted } from "vue";
+import { closeOutline, saveOutline } from "ionicons/icons";
+import { useStore } from "vuex";
+import { translate } from "@/i18n";
+import { RuleService } from "@/services/RuleService";
+import { showToast } from "@/utils";
+
+const store = useStore();
+const props = defineProps(["rule", "selectedFacilities"])
+
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
+let selectedFacilityValues = JSON.parse(JSON.stringify(props.selectedFacilities))
+
+onMounted(async () => {
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
+async function closeModal() {
+  modalController.dismiss({ dismissed: true });
+}
+
+async function toggleFacilitySelection(updatedFacility: any) {
+  const selectedFacility = selectedFacilityValues.some((facilityId: any) => facilityId === updatedFacility.facilityId);
+  if (selectedFacility) {
+    selectedFacilityValues = selectedFacilityValues.filter((facilityId: any) => facilityId !== updatedFacility.facilityId);
+  } else {
+    selectedFacilityValues.push(updatedFacility.facilityId);
+  }
+}
+
+function isSelected(currentFacilityId: any) {
+  return selectedFacilityValues.some((facilityId: any) => facilityId === currentFacilityId);
+}
+
+async function saveFacilities() {  
+  const rule = JSON.parse(JSON.stringify(props.rule))
+
+  rule.ruleConditions.map((condition: any) => {
+    if(condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES") {
+      condition.fieldValue = selectedFacilityValues.join(",")
+    }
+  })
+
+  await RuleService.updateRule(rule, rule.ruleId)
+
+  showToast(translate("Config facilities updated successfully."))
+  await store.dispatch('rule/updateRuleData', { rule })
+  modalController.dismiss();
+}
+</script>
+
+<style scoped>
+ion-content {
+  --padding-bottom: 80px;
+}
+</style>
\ No newline at end of file
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index 6dae159b..7c2428ef 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -84,7 +84,7 @@ const fetchRulesActionsAndConditions = async (ruleId: any): Promise <any>  => {
       url: `decisionRules/${ruleId}`,
       method: "GET"
     }) as any;
-    
+
     if(!hasError(resp)) {
       return Promise.resolve(resp.data)
     } else {

From 0ea1741be46b5394534265107ae438ad97c83295 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 15 Apr 2024 16:00:22 +0530
Subject: [PATCH 037/250] Implemented: modal and logic for product filters
 selection (#250)

---
 src/components/RuleItem.vue                   |  20 +-
 .../SelectConfigFacilitiesModal.vue           |  12 +-
 src/components/UpdateProductFiltersModa.vue   | 191 ++++++++++++++++++
 src/locales/en.json                           |   2 +-
 4 files changed, 219 insertions(+), 6 deletions(-)
 create mode 100644 src/components/UpdateProductFiltersModa.vue

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 9b1446c3..482700c4 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -70,7 +70,7 @@
             <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
             <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
           </ion-item>
-    
+
           <ion-item lines="none">
             <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
             <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
@@ -80,7 +80,7 @@
 
       <ion-item-divider color="light">
         <ion-label>{{ translate("Product tags") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium">
+        <ion-button slot="end" fill="clear" color="medium" @click="openUpdateProductFiltersModal('tags', 'tagsFacet', 'tags', 'included')">
           <ion-icon :icon="optionsOutline" slot="icon-only" />
         </ion-button>
       </ion-item-divider>
@@ -133,6 +133,7 @@ import { useStore } from 'vuex';
 import { showToast } from '@/utils';
 import logger from '@/logger';
 import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
+import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModa.vue';
 
 const router = useRouter();
 const store = useStore();
@@ -310,6 +311,21 @@ async function openSelectConfigFacilitiesModal() {
 
   modal.present()
 }
+
+async function openUpdateProductFiltersModal(label: string, facetToSelect: string, searchfield: string, type: string) {
+  const modal = await modalController.create({
+    component: UpdateProductFiltersModal,
+    componentProps: {
+      label,
+      facetToSelect,
+      searchfield,
+      type,
+      rule: props.rule
+    },
+  })
+
+  modal.present()
+}
 </script>
 
 <style scoped>
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index d09259a1..a4f96209 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -53,6 +53,7 @@ import { useStore } from "vuex";
 import { translate } from "@/i18n";
 import { RuleService } from "@/services/RuleService";
 import { showToast } from "@/utils";
+import logger from "@/logger";
 
 const store = useStore();
 const props = defineProps(["rule", "selectedFacilities"])
@@ -92,9 +93,14 @@ async function saveFacilities() {
 
   await RuleService.updateRule(rule, rule.ruleId)
 
-  showToast(translate("Config facilities updated successfully."))
-  await store.dispatch('rule/updateRuleData', { rule })
-  modalController.dismiss();
+  try {
+    showToast(translate("Config facilities updated successfully."))
+    await store.dispatch('rule/updateRuleData', { rule })
+    modalController.dismiss();
+  } catch(err: any) {
+    showToast(translate("Failed to update config facilities."))
+    logger.error(err)
+  }
 }
 </script>
 
diff --git a/src/components/UpdateProductFiltersModa.vue b/src/components/UpdateProductFiltersModa.vue
new file mode 100644
index 00000000..c4f0aebe
--- /dev/null
+++ b/src/components/UpdateProductFiltersModa.vue
@@ -0,0 +1,191 @@
+<template>
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button @click="closeModal">
+          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+        </ion-button>
+      </ion-buttons>
+      <ion-title>{{ translate("Select", { label }) }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-searchbar :placeholder="translate('Search', { label })" v-model="queryString" @keyup.enter="search()"/>
+
+    <ion-segment v-model="selectedSegment">
+      <ion-segment-button value="included">
+        <ion-label>{{ translate("Included") }}</ion-label>
+      </ion-segment-button>
+      <ion-segment-button value="excluded">
+        <ion-label>{{ translate("Excluded") }}</ion-label>
+      </ion-segment-button>
+    </ion-segment>
+
+    <ion-list>
+      <ion-item v-for="option in facetOptions" :key="option.id"  @click="!isAlreadyApplied(option.id) ? updateSelectedValues(option.id): ''">
+        <ion-label v-if="isAlreadyApplied(option.id)">{{ option.label }}</ion-label>
+        <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="isSelected(option.id)">
+          {{ option.label }}
+        </ion-checkbox>
+        <ion-note v-else slot="end" color="danger">{{ selectedSegment === 'included' ? $t("excluded") : $t("included") }}</ion-note>
+      </ion-item>
+    </ion-list>
+
+    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
+    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button @click="saveFilters()">
+        <ion-icon :icon="checkmarkOutline" />
+      </ion-fab-button>
+    </ion-fab>
+
+    <ion-infinite-scroll @ionInfinite="loadMoreTags($event)" threshold="100px" :disabled="!isScrollable">
+      <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
+    </ion-infinite-scroll>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted } from "vue";
+import {
+  IonButton,
+  IonButtons,
+  IonCheckbox,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonInfiniteScroll,
+  IonInfiniteScrollContent,
+  IonItem,
+  IonLabel,
+  IonList,
+  IonNote,
+  IonSearchbar,
+  IonSegment,
+  IonSegmentButton,
+  IonTitle,
+  IonToolbar,
+  alertController,
+  modalController
+} from "@ionic/vue";
+import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons';
+import { useStore } from "vuex";
+import { UtilService } from "@/services/UtilService";
+import { RuleService } from "@/services/RuleService";
+import { defineProps, ref } from "vue";
+import { translate } from "@/i18n";
+import { hasError, showToast } from "@/utils";
+import logger from "@/logger";
+
+const queryString = ref('');
+const facetOptions = ref([]) as any;
+const isScrollable = ref(true);
+const selectedSegment = ref("included")
+const includedFilters = ref([]) as any;
+const excludedFilters = ref([]) as any;
+
+const props = defineProps(["label", "facetToSelect", "searchfield", "type", "rule"]);
+const store = useStore();
+
+onMounted(() => {
+  const includedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.label && condition.operator === 'in')
+  if(includedCondition && includedCondition.fieldValue) includedFilters.value = includedCondition.fieldValue.split(",");
+
+  const excludedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.label && condition.operator === 'not-in')
+  if(excludedCondition && excludedCondition.fieldValue) includedFilters.value = excludedCondition.fieldValue.split(",");
+})
+
+function closeModal() {
+  modalController.dismiss({ dismissed: true });
+}
+
+function search() {
+  getTags();
+}
+
+async function getTags(vSize?: any, vIndex?: any) {
+  const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
+  const viewIndex = vIndex ? vIndex : 0;
+
+  const payload = {
+    facetToSelect: props.facetToSelect,
+    docType: 'PRODUCT',
+    coreName: 'enterpriseSearch',
+    searchfield: props.searchfield,
+    jsonQuery: '{"query":"*:*","filter":["docType:PRODUCT"]}',
+    noConditionFind: 'N',
+    limit: viewSize,
+    q: queryString.value,
+    term: queryString.value,
+    offset: 0,
+  }
+
+  const resp = await UtilService.fetchFacets(payload);
+  if(!hasError(resp)) {
+    const results = resp.data.facetResponse.response
+    facetOptions.value = viewIndex === 0 ? results : [...facetOptions.value , ...results];
+    isScrollable.value = (facetOptions.value.length % process.env.VUE_APP_VIEW_SIZE) === 0;
+
+  } else {
+    facetOptions.value = [];
+    isScrollable.value = false;
+  }
+}
+
+async function loadMoreTags(event: any){
+  getTags(
+    undefined,
+    Math.ceil(facetOptions.value.length / process.env.VUE_APP_VIEW_SIZE).toString() 
+  ).then(() => {
+    event.target.complete();
+  })
+}
+
+function updateSelectedValues(value: string) {
+  if(selectedSegment.value === 'included') {
+    if(includedFilters.value.includes(value)) includedFilters.value.splice(includedFilters.value.indexOf(value), 1)
+    else includedFilters.value.push(value)
+  } 
+  else {
+    if(excludedFilters.value.includes(value)) excludedFilters.value.splice(excludedFilters.value.indexOf(value), 1)
+    else excludedFilters.value.push(value) 
+  }
+}
+
+function isAlreadyApplied(value: string) {
+  if(selectedSegment.value === 'included') {
+    return excludedFilters.value.includes(value);
+  } else {
+    return includedFilters.value.includes(value)
+  }
+}
+
+function isSelected(value: string) {
+  if(selectedSegment.value === 'included') return includedFilters.value.includes(value);
+  else return excludedFilters.value.includes(value)
+}
+
+async function saveFilters() {
+  const rule = JSON.parse(JSON.stringify(props.rule))
+
+  rule.ruleConditions.map((condition: any) => {
+    if(condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.label && condition.operator === 'in') {
+      condition.fieldValue = includedFilters.value
+    } else if(condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.label && condition.operator === 'not-in') {
+      condition.fieldValue = excludedFilters.value
+    }
+  })
+
+  try {
+    await RuleService.updateRule(rule, rule.ruleId)
+    await store.dispatch('rule/updateRuleData', { rule })
+    showToast(translate("Product filters updated succesfully."))
+    alertController.dismiss()
+  } catch(err: any) {
+    showToast(translate("Failed to update product filters."))
+    logger.error(err);
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index 9efc7556..c470aa55 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -144,7 +144,7 @@
   "Schedule Job": "Schedule Job",
   "Search orders": "Search orders",
   "Search": "Search {label}",
-  "Select": "Select",
+  "Select": "Select {label}",
   "Select all variants": "Select all variants",
   "Select CSV": "Select CSV",
   "Selected products": "Selected products",

From bd964dcb4aeaba67f1e66dd5021edf510e7a5751 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 16 Apr 2024 11:51:03 +0530
Subject: [PATCH 038/250] Improved: added functionality to product features
 filter, used translate instead of  (#250)

---
 src/components/AddProductFiltersModal.vue     | 15 +++++-----
 src/components/RuleItem.vue                   | 11 ++++---
 .../SelectConfigFacilitiesModal.vue           |  5 ++--
 src/components/UpdateProductFiltersModa.vue   | 29 ++++++++++---------
 src/views/Threshold.vue                       |  4 +--
 5 files changed, 31 insertions(+), 33 deletions(-)

diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index c045c54a..352d3838 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -8,7 +8,7 @@
       </ion-buttons>
       <ion-title>{{ type === "included" ? translate("Include", { label }) : translate("Exclude", { label }) }}</ion-title>
       <ion-buttons slot="end">
-        <ion-button fill="clear" color="danger" @click="selectedValues = []">{{ $t("Clear All") }}</ion-button>
+        <ion-button fill="clear" color="danger" @click="selectedValues = []">{{ translate("Clear All") }}</ion-button>
       </ion-buttons>
     </ion-toolbar>
   </ion-header>
@@ -22,25 +22,25 @@
         <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="selectedValues.includes(option.id)">
           {{ option.label }}
         </ion-checkbox>
-        <ion-note v-else slot="end" color="danger">{{ type === 'included' ? $t("excluded") : $t("included") }}</ion-note>
+        <ion-note v-else slot="end" color="danger">{{ type === 'included' ? translate("excluded") : translate("included") }}</ion-note>
       </ion-item>
     </ion-list>
 
     <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
     <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFilters()">
-        <ion-icon :icon="checkmarkOutline" />
+        <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
 
     <ion-infinite-scroll @ionInfinite="loadMoreTags($event)" threshold="100px" :disabled="!isScrollable">
-      <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
+      <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="translate('Loading')"/>
     </ion-infinite-scroll>
   </ion-content>
 </template>
 
 <script setup lang="ts">
-import { computed, defineComponent, onMounted } from "vue";
+import { computed, onMounted } from "vue";
 import {
   IonButton,
   IonButtons,
@@ -61,8 +61,8 @@ import {
   IonToolbar,
   modalController
 } from "@ionic/vue";
-import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons';
-import { mapGetters, useStore } from "vuex";
+import { arrowBackOutline, saveOutline } from 'ionicons/icons';
+import { useStore } from "vuex";
 import { UtilService } from "@/services/UtilService";
 import { defineProps, ref } from "vue";
 import { translate } from "@/i18n";
@@ -70,7 +70,6 @@ import { hasError } from "@/utils";
 
 const queryString = ref('');
 const facetOptions = ref([]) as any;
-const isFilterChanged = ref(false);
 const isScrollable = ref(true);
 const selectedValues = ref([]) as any;
 
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 482700c4..cd809903 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -80,7 +80,7 @@
 
       <ion-item-divider color="light">
         <ion-label>{{ translate("Product tags") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium" @click="openUpdateProductFiltersModal('tags', 'tagsFacet', 'tags', 'included')">
+        <ion-button slot="end" fill="clear" color="medium" @click="openUpdateProductFiltersModal('tags', 'tagsFacet', 'tags')">
           <ion-icon :icon="optionsOutline" slot="icon-only" />
         </ion-button>
       </ion-item-divider>
@@ -97,7 +97,7 @@
       <template v-if="(selectedPage.path === '/threshold' || selectedPage.path === '/safety-stock')">
         <ion-item-divider color="light">
           <ion-label>{{ translate("Product features") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium">
+          <ion-button slot="end" fill="clear" color="medium"  @click="openUpdateProductFiltersModal('product features', 'productFeaturesFacet', 'productFeatures')">
             <ion-icon :icon="optionsOutline" slot="icon-only" />
           </ion-button>
         </ion-item-divider>
@@ -251,7 +251,7 @@ async function editRuleName() {
 function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, operator? : string) {
   if(fieldName && operator) {
     const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)
-    return condition?.fieldValue.split(",").join(", ")
+    return condition?.fieldValue?.split(",").join(", ")
   } else {
     const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)
 
@@ -297,7 +297,7 @@ async function archiveRule() {
 
 function getSelectedFacilities() {
   const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
-  return condition.fieldValue ? condition.fieldValue.split(",") : []
+  return (condition && condition.fieldValue) ? condition.fieldValue.split(",") : []
 }
 
 async function openSelectConfigFacilitiesModal() {
@@ -312,14 +312,13 @@ async function openSelectConfigFacilitiesModal() {
   modal.present()
 }
 
-async function openUpdateProductFiltersModal(label: string, facetToSelect: string, searchfield: string, type: string) {
+async function openUpdateProductFiltersModal(label: string, facetToSelect: string, searchfield: string) {
   const modal = await modalController.create({
     component: UpdateProductFiltersModal,
     componentProps: {
       label,
       facetToSelect,
       searchfield,
-      type,
       rule: props.rule
     },
   })
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index a4f96209..6bc7680d 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -91,11 +91,10 @@ async function saveFacilities() {
     }
   })
 
-  await RuleService.updateRule(rule, rule.ruleId)
-
   try {
-    showToast(translate("Config facilities updated successfully."))
+    await RuleService.updateRule(rule, rule.ruleId)
     await store.dispatch('rule/updateRuleData', { rule })
+    showToast(translate("Config facilities updated successfully."))
     modalController.dismiss();
   } catch(err: any) {
     showToast(translate("Failed to update config facilities."))
diff --git a/src/components/UpdateProductFiltersModa.vue b/src/components/UpdateProductFiltersModa.vue
index c4f0aebe..b8fbeaef 100644
--- a/src/components/UpdateProductFiltersModa.vue
+++ b/src/components/UpdateProductFiltersModa.vue
@@ -28,19 +28,19 @@
         <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="isSelected(option.id)">
           {{ option.label }}
         </ion-checkbox>
-        <ion-note v-else slot="end" color="danger">{{ selectedSegment === 'included' ? $t("excluded") : $t("included") }}</ion-note>
+        <ion-note v-else slot="end" color="danger">{{ selectedSegment === 'included' ? translate("excluded") : translate("included") }}</ion-note>
       </ion-item>
     </ion-list>
 
     <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
     <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFilters()">
-        <ion-icon :icon="checkmarkOutline" />
+        <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
 
     <ion-infinite-scroll @ionInfinite="loadMoreTags($event)" threshold="100px" :disabled="!isScrollable">
-      <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="$t('Loading')"/>
+      <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="translate('Loading')"/>
     </ion-infinite-scroll>
   </ion-content>
 </template>
@@ -67,10 +67,9 @@ import {
   IonSegmentButton,
   IonTitle,
   IonToolbar,
-  alertController,
   modalController
 } from "@ionic/vue";
-import { arrowBackOutline, checkmarkOutline } from 'ionicons/icons';
+import { arrowBackOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
 import { UtilService } from "@/services/UtilService";
 import { RuleService } from "@/services/RuleService";
@@ -86,15 +85,17 @@ const selectedSegment = ref("included")
 const includedFilters = ref([]) as any;
 const excludedFilters = ref([]) as any;
 
-const props = defineProps(["label", "facetToSelect", "searchfield", "type", "rule"]);
+const props = defineProps(["label", "facetToSelect", "searchfield", "rule"]);
 const store = useStore();
 
 onMounted(() => {
-  const includedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.label && condition.operator === 'in')
+  const includedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
+  console.log(includedCondition.fieldNameValue);
+  
   if(includedCondition && includedCondition.fieldValue) includedFilters.value = includedCondition.fieldValue.split(",");
 
-  const excludedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.label && condition.operator === 'not-in')
-  if(excludedCondition && excludedCondition.fieldValue) includedFilters.value = excludedCondition.fieldValue.split(",");
+  const excludedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
+  if(excludedCondition && excludedCondition.fieldValue) excludedFilters.value = excludedCondition.fieldValue.split(",");
 })
 
 function closeModal() {
@@ -171,10 +172,10 @@ async function saveFilters() {
   const rule = JSON.parse(JSON.stringify(props.rule))
 
   rule.ruleConditions.map((condition: any) => {
-    if(condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.label && condition.operator === 'in') {
-      condition.fieldValue = includedFilters.value
-    } else if(condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.label && condition.operator === 'not-in') {
-      condition.fieldValue = excludedFilters.value
+    if(condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in') {
+      condition.fieldValue = includedFilters.value.join(",")
+    } else if(condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in') {
+      condition.fieldValue = excludedFilters.value.join(",")
     }
   })
 
@@ -182,7 +183,7 @@ async function saveFilters() {
     await RuleService.updateRule(rule, rule.ruleId)
     await store.dispatch('rule/updateRuleData', { rule })
     showToast(translate("Product filters updated succesfully."))
-    alertController.dismiss()
+    modalController.dismiss()
   } catch(err: any) {
     showToast(translate("Failed to update product filters."))
     logger.error(err);
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 23c5e3e7..4f531550 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-menu-button slot="start" />
-        <ion-title>{{ $t("Threshold") }}</ion-title>
+        <ion-title>{{ translate("Threshold") }}</ion-title>
       </ion-toolbar>
     </ion-header>
 
@@ -33,7 +33,7 @@ import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
 import { computed, onMounted } from 'vue';
 import { useStore } from 'vuex';
-
+import { translate } from '@/i18n';
 
 const store = useStore();
 const router = useRouter()

From 4556747fb74a04a8084182d7637be1327c906680 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 16 Apr 2024 12:02:52 +0530
Subject: [PATCH 039/250] Improved: logic for updating product filters to add
 condition if not present already (#250)

---
 src/components/UpdateProductFiltersModa.vue | 34 ++++++++++++++++++---
 1 file changed, 30 insertions(+), 4 deletions(-)

diff --git a/src/components/UpdateProductFiltersModa.vue b/src/components/UpdateProductFiltersModa.vue
index b8fbeaef..913c635f 100644
--- a/src/components/UpdateProductFiltersModa.vue
+++ b/src/components/UpdateProductFiltersModa.vue
@@ -171,13 +171,39 @@ function isSelected(value: string) {
 async function saveFilters() {
   const rule = JSON.parse(JSON.stringify(props.rule))
 
-  rule.ruleConditions.map((condition: any) => {
-    if(condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in') {
+  if(includedFilters.value.length) {
+    const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
+    if(condition) {
       condition.fieldValue = includedFilters.value.join(",")
-    } else if(condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in') {
+    } else {
+      rule.ruleConditions.push({ 
+        "_entity": "ruleCondition",
+        "ruleId": rule.ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+        "fieldName": props.searchfield,
+        "operator": selectedSegment.value === "included" ? "in" : "not-in",
+        "fieldValue": includedFilters.value?.length > 1 ? includedFilters.value.join(",") : includedFilters.value[0],
+        "multiValued": includedFilters.value?.length > 1 ? "Y" : "N"
+      })
+    }
+  }
+
+  if(excludedFilters.value.length) {
+    const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
+    if(condition) {
       condition.fieldValue = excludedFilters.value.join(",")
+    } else {
+      rule.ruleConditions.push({ 
+        "_entity": "ruleCondition",
+        "ruleId": rule.ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+        "fieldName": props.searchfield,
+        "operator": selectedSegment.value === "included" ? "in" : "not-in",
+        "fieldValue": excludedFilters.value?.length > 1 ? excludedFilters.value.join(",") : excludedFilters.value[0],
+        "multiValued": excludedFilters.value?.length > 1 ? "Y" : "N"
+      })
     }
-  })
+  }
 
   try {
     await RuleService.updateRule(rule, rule.ruleId)

From c04bc5e83b1fe8289a3994466e6ec3824110f509 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 16 Apr 2024 12:39:58 +0530
Subject: [PATCH 040/250] Improved: logic to updating product features for a
 rule (#250)

---
 src/components/UpdateProductFiltersModa.vue | 56 ++++++++++-----------
 1 file changed, 26 insertions(+), 30 deletions(-)

diff --git a/src/components/UpdateProductFiltersModa.vue b/src/components/UpdateProductFiltersModa.vue
index 913c635f..62411298 100644
--- a/src/components/UpdateProductFiltersModa.vue
+++ b/src/components/UpdateProductFiltersModa.vue
@@ -171,38 +171,34 @@ function isSelected(value: string) {
 async function saveFilters() {
   const rule = JSON.parse(JSON.stringify(props.rule))
 
-  if(includedFilters.value.length) {
-    const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
-    if(condition) {
-      condition.fieldValue = includedFilters.value.join(",")
-    } else {
-      rule.ruleConditions.push({ 
-        "_entity": "ruleCondition",
-        "ruleId": rule.ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-        "fieldName": props.searchfield,
-        "operator": selectedSegment.value === "included" ? "in" : "not-in",
-        "fieldValue": includedFilters.value?.length > 1 ? includedFilters.value.join(",") : includedFilters.value[0],
-        "multiValued": includedFilters.value?.length > 1 ? "Y" : "N"
-      })
-    }
+  const includeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
+  if(includeCondition) {
+    includeCondition.fieldValue = includedFilters.value.join(",")
+  } else {
+    rule.ruleConditions.push({
+      "_entity": "ruleCondition",
+      "ruleId": rule.ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+      "fieldName": props.searchfield,
+      "operator": selectedSegment.value === "included" ? "in" : "not-in",
+      "fieldValue": includedFilters.value?.length > 1 ? includedFilters.value.join(",") : includedFilters.value[0],
+      "multiValued": includedFilters.value?.length > 1 ? "Y" : "N"
+    })
   }
 
-  if(excludedFilters.value.length) {
-    const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
-    if(condition) {
-      condition.fieldValue = excludedFilters.value.join(",")
-    } else {
-      rule.ruleConditions.push({ 
-        "_entity": "ruleCondition",
-        "ruleId": rule.ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-        "fieldName": props.searchfield,
-        "operator": selectedSegment.value === "included" ? "in" : "not-in",
-        "fieldValue": excludedFilters.value?.length > 1 ? excludedFilters.value.join(",") : excludedFilters.value[0],
-        "multiValued": excludedFilters.value?.length > 1 ? "Y" : "N"
-      })
-    }
+  const excludeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
+  if(excludeCondition) {
+    excludeCondition.fieldValue = excludedFilters.value.join(",")
+  } else {
+    rule.ruleConditions.push({
+      "_entity": "ruleCondition",
+      "ruleId": rule.ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+      "fieldName": props.searchfield,
+      "operator": selectedSegment.value === "included" ? "in" : "not-in",
+      "fieldValue": excludedFilters.value?.length > 1 ? excludedFilters.value.join(",") : excludedFilters.value[0],
+      "multiValued": excludedFilters.value?.length > 1 ? "Y" : "N"
+    })
   }
 
   try {

From fd70a39a08b19aa257bdfd004395305a3bb945cc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 16 Apr 2024 12:40:38 +0530
Subject: [PATCH 041/250] Improved: product filter modal name (#250)

---
 src/components/RuleItem.vue                                     | 2 +-
 ...dateProductFiltersModa.vue => UpdateProductFiltersModal.vue} | 0
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename src/components/{UpdateProductFiltersModa.vue => UpdateProductFiltersModal.vue} (100%)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index cd809903..21b5accb 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -133,7 +133,7 @@ import { useStore } from 'vuex';
 import { showToast } from '@/utils';
 import logger from '@/logger';
 import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
-import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModa.vue';
+import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModal.vue';
 
 const router = useRouter();
 const store = useStore();
diff --git a/src/components/UpdateProductFiltersModa.vue b/src/components/UpdateProductFiltersModal.vue
similarity index 100%
rename from src/components/UpdateProductFiltersModa.vue
rename to src/components/UpdateProductFiltersModal.vue

From d51dd55eba67d95cf9feb89f2c4d70c86d80b66e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 16 Apr 2024 14:59:00 +0530
Subject: [PATCH 042/250] Improved: code for optimal solution (#250)

---
 src/components/RuleItem.vue                  |  2 +-
 src/components/UpdateProductFiltersModal.vue | 11 +++--------
 src/locales/en.json                          |  3 +++
 src/store/RootState.ts                       |  1 +
 src/store/index.ts                           |  2 +-
 src/store/modules/rule/actions.ts            |  6 +++---
 src/store/modules/util/actions.ts            | 11 ++---------
 src/views/CreateThresholdRule.vue            | 20 +++++++++-----------
 8 files changed, 23 insertions(+), 33 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 21b5accb..6ce98587 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -213,7 +213,7 @@ async function editSafetyStock() {
 
 async function editRuleName() {
   const alert = await alertController.create({
-    header: translate("Edit rule name"),
+    header: translate("Edit name"),
     inputs: [{
       name: "safetyStock",
       placeholder: translate("Name"),
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index 62411298..63995d3f 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -90,8 +90,6 @@ const store = useStore();
 
 onMounted(() => {
   const includedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
-  console.log(includedCondition.fieldNameValue);
-  
   if(includedCondition && includedCondition.fieldValue) includedFilters.value = includedCondition.fieldValue.split(",");
 
   const excludedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
@@ -156,16 +154,13 @@ function updateSelectedValues(value: string) {
 }
 
 function isAlreadyApplied(value: string) {
-  if(selectedSegment.value === 'included') {
-    return excludedFilters.value.includes(value);
-  } else {
-    return includedFilters.value.includes(value)
-  }
+  if(selectedSegment.value === 'included') return excludedFilters.value.includes(value);
+  else return includedFilters.value.includes(value);
 }
 
 function isSelected(value: string) {
   if(selectedSegment.value === 'included') return includedFilters.value.includes(value);
-  else return excludedFilters.value.includes(value)
+  else return excludedFilters.value.includes(value);
 }
 
 async function saveFilters() {
diff --git a/src/locales/en.json b/src/locales/en.json
index c470aa55..4ff8a049 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -53,6 +53,7 @@
   "Facilities": "Facilities",
   "Facility": "Facility",
   "Failed": "Failed",
+  "Failed to create rule.": "Failed to create rule.",
   "Failed to update some jobs": "Failed to update some jobs",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
   "features": "{type} features",
@@ -126,6 +127,7 @@
   "reset": "reset",
   "retry": "retry",
   "Rule Configuration": "Rule Configuration",
+  "Rule created successfully.": "Rule created successfully.",
   "rule name": "rule name",
   "Run now": "Run now",
   "running": "running",
@@ -148,6 +150,7 @@
   "Select all variants": "Select all variants",
   "Select CSV": "Select CSV",
   "Selected products": "Selected products",
+  "Select facilities": "Select facilities",
   "Select facility": "Select facility",
   "Select locations": "Select locations",
   "Select the column index for the following information in the uploaded CSV": "Select the column index for the following information in the uploaded CSV",
diff --git a/src/store/RootState.ts b/src/store/RootState.ts
index 9755745b..fac58843 100644
--- a/src/store/RootState.ts
+++ b/src/store/RootState.ts
@@ -1,4 +1,5 @@
 export default interface RootState {
     user: any;
     util: any;
+    rule: any;
 }
\ No newline at end of file
diff --git a/src/store/index.ts b/src/store/index.ts
index 81382037..60e047e0 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -19,7 +19,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: ['user'],
+    paths: ['user', 'util'],
     fetchBeforeUse: true
 })
 
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 0f461a57..a180cb13 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -13,8 +13,8 @@ const actions: ActionTree<RuleState, RootState> = {
 
     try {
       const resp = await RuleService.fetchRuleGroup(payload)
+
       if(!hasError(resp) && resp.data.length) {
-        
         ruleGroup = resp.data[0]
       } else {
         throw resp.data;
@@ -22,7 +22,6 @@ const actions: ActionTree<RuleState, RootState> = {
     } catch(err: any) {
       logger.error("No rule group found");
     }
-    
     commit(types.RULE_GROUP_UPDATED, ruleGroup);
     return ruleGroup
   },
@@ -36,8 +35,9 @@ const actions: ActionTree<RuleState, RootState> = {
       if(!ruleGroup.ruleGroupId) {
         throw new Error("No rule founds")
       }
+
       const resp = await RuleService.fetchRules({ 
-        ruleGroupId: ruleGroup.ruleGroupId,
+        "ruleGroupId": ruleGroup.ruleGroupId,
         "statusId": "ATP_RULE_ACTIVE",
         "orderByField": "sequenceNum"
       })
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index a63408b6..3d045758 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -11,16 +11,10 @@ const actions: ActionTree<UtilState, RootState> = {
   async fetchConfigFacilities ({ commit, state }) {
     let configFacilities = JSON.parse(JSON.stringify(state.configFacilities))
 
-    if(configFacilities.length) {
-      return;
-    }
+    if(configFacilities.length) return;
 
-    const payload = {
-      facilityTypeId: 'CONFIGURATION'
-    }
-    
     try {
-      const resp = await UtilService.fetchConfigFacilities(payload);
+      const resp = await UtilService.fetchConfigFacilities({ facilityTypeId: 'CONFIGURATION' });
 
       if(!hasError(resp)) {
         configFacilities = resp.data;
@@ -30,7 +24,6 @@ const actions: ActionTree<UtilState, RootState> = {
     } catch (err: any) {
       logger.error(err)
     }
-
     commit(types.UTIL_CONFIG_FACILITES_UPDATED, configFacilities)
   },
 
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 29cab749..a063c649 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -166,30 +166,28 @@ async function createThresholdRule() {
       })
     }
 
-    const rule = await RuleService.createRule({
+    const params = {
       "_entity": "rule",
       "ruleId": formData.value.ruleName.trim().toUpperCase().split(' ').join('_'),
       "ruleGroupId": ruleGroup.ruleGroupId,
       "ruleName": formData.value.ruleName,
       "statusId": "ATP_RULE_ACTIVE",
       "sequenceNum": total.value ? rules.value[total.value-1].sequenceNum + 1 : 1
-    })
-    
-    const actions = generateRuleActions(rule.ruleId)
-    const conditions = generateRuleConditions(rule.ruleId)
-    
+    }
+
+    const rule = await RuleService.createRule(params)
+
     await RuleService.updateRule({
-      "_entity": "rule",
-      "ruleId": rule.ruleId,
-      "ruleConditions": conditions,
-      "ruleActions": actions
+      ...params,
+      "ruleConditions": generateRuleConditions(rule.ruleId),
+      "ruleActions": generateRuleActions(rule.ruleId)
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
     router.push("/threshold");
   } catch(err: any) {
     logger.error(err);
-    showToast(translate("Failed to create rule"))
+    showToast(translate("Failed to create rule."))
   }  
 }
 </script>

From 3ac8ad72c213369da9cefe7c194ca02c02a2c3f4 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 16 Apr 2024 15:15:57 +0530
Subject: [PATCH 043/250] Fixed: code to highlight menu for child routes (#253)

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

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 802b1f45..239ec4ed 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -117,7 +117,7 @@
   const instanceUrl = computed(() => store.getters["user/getInstanceUrl"])
   const selectedIndex = computed(() => {
     const path = router.currentRoute.value.path;
-    return appPages.findIndex((screen) => screen.url === path);
+    return appPages.findIndex((screen) => screen.url === path || screen.childRoutes?.includes(path) || screen.childRoutes?.some((route) => path.includes(route)));
   });
 
   function setEComStore(event: CustomEvent) {

From a19878df2020b93ac1add0ec23d89b55ca5d5d8e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 17 Apr 2024 12:57:57 +0530
Subject: [PATCH 044/250] Implemented: logic for scheduling rule group and
 disable it (#250)

---
 .env.example                              |  1 +
 src/components/ScheduleActionsPopover.vue | 33 ++++++++++-
 src/components/ScheduleRuleItem.vue       | 67 ++++++++++++++++++++---
 src/services/RuleService.ts               | 17 ++++++
 src/store/modules/rule/actions.ts         | 13 ++++-
 src/utils/index.ts                        |  7 ++-
 6 files changed, 127 insertions(+), 11 deletions(-)

diff --git a/.env.example b/.env.example
index 495de819..aa97581d 100644
--- a/.env.example
+++ b/.env.example
@@ -10,3 +10,4 @@ VUE_APP_ALIAS={}
 VUE_APP_DEFAULT_ALIAS=""
 VUE_APP_DEFAULT_LOG_LEVEL="error"
 VUE_APP_LOGIN_URL="http://launchpad.hotwax.io/login"
+VUE_APP_CRON_EXPRESSIONS={"Every 5 minutes":"0 */5 * ? * *","Every 15 minutes":"0 */15 * ? * *","Every 30 minutes":"0 */30 * ? * *","Hourly":"0 0 * ? * *","Every six hours":"0 0 */6 ? * *","Every day at midnight":"0 0 0 * * ?"}
diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
index a769ed15..18d968ee 100644
--- a/src/components/ScheduleActionsPopover.vue
+++ b/src/components/ScheduleActionsPopover.vue
@@ -10,7 +10,7 @@
         <ion-icon slot="start" :icon="flashOutline" />
         <ion-label>{{ translate("Run now") }}</ion-label>
       </ion-item> 
-      <ion-item button lines="none">
+      <ion-item button lines="none" @click="disableRuleGroup()">
         <ion-icon slot="start" :icon="stopCircleOutline" color="danger" />
         <ion-label color="danger">{{ translate("Disable") }}</ion-label>
       </ion-item> 
@@ -22,4 +22,35 @@
 import { IonContent, IonIcon, IonItem, IonLabel, IonList, IonListHeader } from "@ionic/vue";
 import { translate } from "@/i18n";
 import { flashOutline, stopCircleOutline, timeOutline } from 'ionicons/icons'
+import { useStore } from "vuex";
+import { computed } from "vue";
+import { RuleService } from "@/services/RuleService";
+import { hasError, showToast } from "@/utils";
+import logger from "@/logger";
+
+const store = useStore();
+const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+
+async function disableRuleGroup() {
+  const payload = {
+    ruleGroupId: ruleGroup.value.ruleGroupId,
+    paused: "Y",
+    systemMessageRemoteId: "RemoteSftp"
+  }
+
+  try {
+    const resp = await RuleService.scheduleRule(payload)
+    if(!hasError(resp)){
+      const ruleGroupValue = JSON.parse(JSON.stringify(ruleGroup.value))
+      ruleGroupValue.schedule.paused = "Y"
+      store.dispatch("rule/updateRuleGroup", ruleGroupValue)
+      showToast(translate("Rule group disabled successfully."))
+    } else {
+      throw resp.data
+    }
+  } catch(err) {
+    showToast(translate("Failed to disable rule group."))
+    logger.error(err)
+  }
+}
 </script> 
\ No newline at end of file
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index 7228221a..a7ddc093 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -2,18 +2,25 @@
   <ion-card>
     <ion-card-header>
       <ion-card-title>{{ translate("Schedule") }}</ion-card-title>
-      <ion-badge color="warning">{{ translate("Paused") }}</ion-badge>
+      <ion-badge :color="ruleGroup.schedule?.paused === 'Y' ? 'warning' : 'dark'">{{ ruleGroup.schedule?.paused === "Y" ? translate("Paused") : timeTillJob(ruleGroup.schedule?.nextExecutionDateTime) }}</ion-badge>
     </ion-card-header>
-  
+
+    <ion-item>
+      <ion-icon slot="start" :icon="timeOutline"/>
+      <ion-label>{{ translate("Run time") }}</ion-label>
+      <!-- When the group is in draft status, do not display the runTime from the schedule -->
+      <ion-label slot="end">{{ ruleGroup.schedule?.paused === 'N' ? getDateAndTime(ruleGroup.schedule?.nextExecutionDateTime) : "-" }}</ion-label>
+    </ion-item>
     <ion-item>
-      <ion-icon slot="start" :icon="timeOutline" />
-      <ion-select :label="translate('Run time')" value="" interface="popover">
-        <ion-select-option value="">{{ "Select" }}</ion-select-option>
+      <ion-icon slot="start" :icon="timerOutline"/>
+      <!-- When the group is in draft status or the job is not present, do not display the frequency and just display the label for schedule -->
+      <ion-select :label="translate('Schedule')" interface="popover" :placeholder="translate('Select')" value="0 0 0 * * ?" :disabled="true">
+        <ion-select-option v-for="(expression, description) in cronExpressions" :key="expression" :value="expression">{{ description }}</ion-select-option>
       </ion-select>
     </ion-item>
   
     <ion-item lines="none">
-      <ion-button fill="clear">{{ translate("Save changes") }}</ion-button>
+      <ion-button fill="clear" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
       <ion-button color="medium" fill="clear" slot="end" @click="OpenScheduleActionsPopover($event)">
         <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
       </ion-button>
@@ -22,10 +29,21 @@
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardTitle, IonIcon, IonItem, IonSelect, IonSelectOption, popoverController } from '@ionic/vue';
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardTitle, IonIcon, IonItem, IonLabel, IonSelect, IonSelectOption, onIonViewDidEnter, popoverController } from '@ionic/vue';
 import { translate } from '@/i18n';
-import { ellipsisVerticalOutline, timeOutline } from 'ionicons/icons';
+import { ellipsisVerticalOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import ScheduleActionsPopover from "@/components/ScheduleActionsPopover.vue";
+import { computed, ref, onMounted } from 'vue';
+import { getDateAndTime, hasError, showToast } from '@/utils'
+import { useStore } from 'vuex';
+import logger from '@/logger';
+import { RuleService } from '@/services/RuleService';
+import { DateTime } from 'luxon';
+
+const store = useStore();
+const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+
+const cronExpressions = JSON.parse(process.env?.VUE_APP_CRON_EXPRESSIONS as string)
 
 async function OpenScheduleActionsPopover(event: Event) {
   const popover = await popoverController.create({
@@ -36,6 +54,39 @@ async function OpenScheduleActionsPopover(event: Event) {
 
   return popover.present();
 }
+
+async function saveSchedule() {
+  const payload = {
+    ruleGroupId: ruleGroup.value.ruleGroupId,
+    paused: 'N',
+    ...ruleGroup.value,
+    cronExpression: "0 0 0 * * ?",
+    // Hardcoding for now, need to fetch system message remote id for the ftp server config.
+    systemMessageRemoteId: "RemoteSftp"
+  }
+
+  try {
+    const resp = await RuleService.scheduleRule(payload)
+    if(!hasError(resp)) {
+      showToast(translate("Rule scheduled successfully."))
+      await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
+    } else {
+      throw resp.data
+    }
+  } catch(err) {
+    showToast(translate("Failed to schedule rule."))
+    logger.error(err)
+  }
+}
+
+function timeTillJob(time: any) {
+  if(!time) {
+    return;
+  }
+  const timeDiff = DateTime.fromMillis(time).diff(DateTime.local());
+  return DateTime.local().plus(timeDiff).toRelative();
+}
+
 </script>
 
 <style scoped>
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index 7c2428ef..9abc9f6f 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -96,11 +96,28 @@ const fetchRulesActionsAndConditions = async (ruleId: any): Promise <any>  => {
   }
 }
 
+const fetchRuleScheduleInformation = async (ruleGroupId: string): Promise<any> => {
+  return api({
+    url: `ruleGroups/${ruleGroupId}/schedule`,
+    method: "GET"
+  });
+}
+
+const scheduleRule = async (payload: any): Promise<any> => {
+  return api({
+    url: `ruleGroups/${payload.ruleGroupId}/schedule`,
+    method: "POST",
+    data: payload
+  });
+}
+
 export const RuleService = {
   createRule,
   createRuleGroup,
   fetchRuleGroup,
   fetchRules,
   fetchRulesActionsAndConditions,
+  fetchRuleScheduleInformation,
+  scheduleRule,
   updateRule
 }
\ No newline at end of file
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index a180cb13..2dd6d244 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -10,18 +10,25 @@ import logger from '@/logger'
 const actions: ActionTree<RuleState, RootState> = {
   async fetchRuleGroup({ commit }, payload) {
     let ruleGroup = {} as any;
+    let resp;
 
     try {
-      const resp = await RuleService.fetchRuleGroup(payload)
+      resp = await RuleService.fetchRuleGroup(payload)
 
       if(!hasError(resp) && resp.data.length) {
         ruleGroup = resp.data[0]
+
+        resp = await RuleService.fetchRuleScheduleInformation(ruleGroup.ruleGroupId)
+        if(!hasError(resp) && resp.data?.schedule) {
+          ruleGroup.schedule = resp.data.schedule
+        }
       } else {
         throw resp.data;
       }
     } catch(err: any) {
       logger.error("No rule group found");
     }
+
     commit(types.RULE_GROUP_UPDATED, ruleGroup);
     return ruleGroup
   },
@@ -77,6 +84,10 @@ const actions: ActionTree<RuleState, RootState> = {
     commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total});
   },
 
+  updateRuleGroup({ commit }, payload) {
+    commit(types.RULE_GROUP_UPDATED, payload);
+  },
+
   archiveRule({ commit, state }, { rule }) {
     const rules = JSON.parse(JSON.stringify(state.rules.list))
 
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 8e082b97..ba6c5d77 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -1,4 +1,5 @@
 import { toastController } from '@ionic/vue';
+import { DateTime } from 'luxon';
 
 // TODO Use separate files for specific utilities
 
@@ -17,4 +18,8 @@ const showToast = async (message: string) => {
   return toast.present();
 }
 
-export { showToast, hasError }
+function getDateAndTime(time: any) {
+  return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "-";
+}
+
+export { getDateAndTime, hasError, showToast }
\ No newline at end of file

From 383c9f23bee6645814b30c122bb645b21f71ca9e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 17 Apr 2024 15:40:53 +0530
Subject: [PATCH 045/250] Implemented: logic for runNow and history fetching
 (#250)

---
 src/components/RuleGroupHistoryModal.vue  | 83 +++++++++++++++++++++++
 src/components/ScheduleActionsPopover.vue | 76 +++++++++++++++++++--
 src/services/RuleService.ts               | 16 +++++
 src/utils/index.ts                        | 15 +++-
 4 files changed, 183 insertions(+), 7 deletions(-)
 create mode 100644 src/components/RuleGroupHistoryModal.vue

diff --git a/src/components/RuleGroupHistoryModal.vue b/src/components/RuleGroupHistoryModal.vue
new file mode 100644
index 00000000..420eb8d8
--- /dev/null
+++ b/src/components/RuleGroupHistoryModal.vue
@@ -0,0 +1,83 @@
+<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("Group history") }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+  
+  <ion-content>
+    <ion-list>
+      <ion-item v-for="history in groupHistory" :key="history.jobRunId">
+        <ion-label>
+          <h3>{{ getTime(history.startTime) }}</h3>
+          <p>{{ getDate(history.startTime) }}</p>
+        </ion-label>
+        <ion-badge color="dark" v-if="history.endTime">{{ timeTillRun(history.endTime) }}</ion-badge>
+      </ion-item>
+    </ion-list>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { translate } from "@/i18n";
+import {
+  IonBadge,
+  IonButton,
+  IonButtons,
+  IonContent,
+  IonHeader,
+  IonIcon,
+  IonItem,
+  IonLabel,
+  IonList,
+  IonTitle,
+  IonToolbar,
+  modalController,
+  onIonViewWillEnter,
+} from "@ionic/vue";
+import { closeOutline } from "ionicons/icons";
+import { computed, onMounted, ref } from "vue";
+import { getDate, getTime, timeTillRun, hasError } from "@/utils";
+import { useStore } from "vuex";
+import { RuleService } from "@/services/RuleService";
+import logger from "@/logger";
+
+const store = useStore();
+const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+
+let groupHistory = ref([]) as any
+
+onMounted(async () => {
+  await fetchGroupHistory()
+})
+
+async function fetchGroupHistory() {
+  groupHistory.value = []
+
+  if(!ruleGroup.value?.jobName) {
+    return;
+  }
+
+  try {
+    const resp = await RuleService.fetchRuleGroupHistory(ruleGroup.value.jobName)
+
+    if(!hasError(resp)) {
+      // Sorting the history based on startTime, as we does not get the records in sorted order from api
+      groupHistory.value = resp.data.sort((a: any, b: any) => b.startTime - a.startTime)
+    } else {
+      throw resp.data;
+    }
+  } catch(err) {
+    logger.error(err)
+  }
+}
+
+function closeModal() {
+  modalController.dismiss();
+}
+</script>
diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
index 18d968ee..075447af 100644
--- a/src/components/ScheduleActionsPopover.vue
+++ b/src/components/ScheduleActionsPopover.vue
@@ -2,24 +2,24 @@
   <ion-content>
     <ion-list>
       <ion-list-header>{{ translate("More options") }}</ion-list-header>
-      <ion-item button>
+      <ion-item button @click="openRuleGroupHistoryModal()">
         <ion-icon slot="start" :icon="timeOutline" />
         <ion-label>{{ translate("History") }}</ion-label>
-      </ion-item> 
-      <ion-item button>
+      </ion-item>
+      <ion-item button @click="runNow()">
         <ion-icon slot="start" :icon="flashOutline" />
         <ion-label>{{ translate("Run now") }}</ion-label>
-      </ion-item> 
+      </ion-item>
       <ion-item button lines="none" @click="disableRuleGroup()">
         <ion-icon slot="start" :icon="stopCircleOutline" color="danger" />
         <ion-label color="danger">{{ translate("Disable") }}</ion-label>
-      </ion-item> 
+      </ion-item>
     </ion-list>
   </ion-content>
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonIcon, IonItem, IonLabel, IonList, IonListHeader } from "@ionic/vue";
+import { IonContent, IonIcon, IonItem, IonLabel, IonList, IonListHeader, alertController, modalController } from "@ionic/vue";
 import { translate } from "@/i18n";
 import { flashOutline, stopCircleOutline, timeOutline } from 'ionicons/icons'
 import { useStore } from "vuex";
@@ -27,6 +27,8 @@ import { computed } from "vue";
 import { RuleService } from "@/services/RuleService";
 import { hasError, showToast } from "@/utils";
 import logger from "@/logger";
+import RuleGroupHistoryModal from '@/components/RuleGroupHistoryModal.vue';
+import { popoverController } from "@ionic/core";
 
 const store = useStore();
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
@@ -45,6 +47,7 @@ async function disableRuleGroup() {
       ruleGroupValue.schedule.paused = "Y"
       store.dispatch("rule/updateRuleGroup", ruleGroupValue)
       showToast(translate("Rule group disabled successfully."))
+      popoverController.dismiss();
     } else {
       throw resp.data
     }
@@ -53,4 +56,65 @@ async function disableRuleGroup() {
     logger.error(err)
   }
 }
+
+async function openRuleGroupHistoryModal() {
+  const groupHistoryModal = await modalController.create({
+    component: RuleGroupHistoryModal
+  })
+
+  await popoverController.dismiss();
+  groupHistoryModal.present();
+}
+
+async function runNow() {
+  const scheduleAlert = await alertController
+    .create({
+      header: translate("Run now"),
+      message: translate("Running this schedule now will not replace this schedule. A copy of this schedule will be created and run immediately. You may not be able to reverse this action."),
+      buttons: [
+        {
+          text: translate("Cancel"),
+          role: "cancel",
+        },
+        {
+          text: translate("Run now"),
+          handler: async () => {
+            // Checking that if we already have the job schedule before calling runNow, because if the job scheduler is not present then runNow action can't be performed
+            // If the scheduler for the job is available then we will have jobName, if not then first scheduling the job in draft status just to create a routing schedule and then calling runNow action
+            if(!ruleGroup.value.jobName) {
+              const payload = {
+                ruleGroupId: ruleGroup.value.ruleGroupId,
+                paused: "Y",  // passing Y as we just need to configure the scheduler and do not need to schedule it in active state
+              }
+
+              try {
+                const resp = await RuleService.scheduleRule(payload)
+                if(hasError(resp)) {
+                  throw resp.data
+                }
+              } catch(err) {
+                logger.error(err)
+                return;
+              }
+            }
+
+            try {
+              const resp = await RuleService.runNow(ruleGroup.value.ruleGroupId)
+              if(!hasError(resp) && resp.data.jobRunId) {
+                showToast(translate("Service has been scheduled"))
+                popoverController.dismiss();
+              } else {
+                throw resp.data
+              }
+            } catch(err) {
+              showToast(translate("Failed to schedule service"))
+              logger.error(err)
+            }
+          }
+        }
+      ]
+    });
+
+  return scheduleAlert.present();
+}
 </script> 
\ No newline at end of file
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index 9abc9f6f..2a92138e 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -111,13 +111,29 @@ const scheduleRule = async (payload: any): Promise<any> => {
   });
 }
 
+const fetchRuleGroupHistory = async (jobName: string): Promise<any> => {
+  return api({
+    url: `serviceJobRuns/${jobName}`,
+    method: "GET"
+  });
+}
+
+const runNow = async (ruleGroupId: any): Promise<any> => {
+  return api({
+    url: `ruleGroups/${ruleGroupId}/runNow`,
+    method: "POST"
+  });
+}
+
 export const RuleService = {
   createRule,
   createRuleGroup,
   fetchRuleGroup,
+  fetchRuleGroupHistory,
   fetchRules,
   fetchRulesActionsAndConditions,
   fetchRuleScheduleInformation,
+  runNow,
   scheduleRule,
   updateRule
 }
\ No newline at end of file
diff --git a/src/utils/index.ts b/src/utils/index.ts
index ba6c5d77..5327c415 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -22,4 +22,17 @@ function getDateAndTime(time: any) {
   return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "-";
 }
 
-export { getDateAndTime, hasError, showToast }
\ No newline at end of file
+const getTime = (time: any) => {
+  return time ? DateTime.fromMillis(time).toLocaleString(DateTime.TIME_SIMPLE) : "-";
+}
+
+function getDate(runTime: any) {
+  return DateTime.fromMillis(runTime).toLocaleString(DateTime.DATE_MED);
+}
+
+function timeTillRun(endTime: any) {
+  const timeDiff = DateTime.fromMillis(endTime).diff(DateTime.local());
+  return DateTime.local().plus(timeDiff).toRelative();
+}
+
+export { getDate, getDateAndTime, getTime, hasError, showToast, timeTillRun }
\ No newline at end of file

From 8380ed9473d71bb309d75ea715dfb7f9e6223288 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 17 Apr 2024 15:56:55 +0530
Subject: [PATCH 046/250] Improved: added the missing entries for static text
 in locale file (#250)

---
 src/components/ScheduleRuleItem.vue | 4 ++--
 src/locales/en.json                 | 4 ++++
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index a7ddc093..c687a078 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -68,13 +68,13 @@ async function saveSchedule() {
   try {
     const resp = await RuleService.scheduleRule(payload)
     if(!hasError(resp)) {
-      showToast(translate("Rule scheduled successfully."))
+      showToast(translate("Service has been scheduled"))
       await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
     } else {
       throw resp.data
     }
   } catch(err) {
-    showToast(translate("Failed to schedule rule."))
+    showToast(translate("Failed to schedule service"))
     logger.error(err)
   }
 }
diff --git a/src/locales/en.json b/src/locales/en.json
index 4ff8a049..e09f35cf 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -54,6 +54,7 @@
   "Facility": "Facility",
   "Failed": "Failed",
   "Failed to create rule.": "Failed to create rule.",
+  "Failed to disable rule group.": "Failed to disable rule group.",
   "Failed to update some jobs": "Failed to update some jobs",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
   "features": "{type} features",
@@ -71,6 +72,7 @@
   "Internal ID cannot be more than 20 characters.": "Internal ID cannot be more than 20 characters.",
   "Inventory channels": "Inventory channels",
   "global threshold": "global threshold",
+  "Group history": "Group history",
   "included": "included",
   "Include": "Include {label}",
   "Info": "Info",
@@ -128,10 +130,12 @@
   "retry": "retry",
   "Rule Configuration": "Rule Configuration",
   "Rule created successfully.": "Rule created successfully.",
+  "Rule group disabled successfully.": "Rule group disabled successfully.",
   "rule name": "rule name",
   "Run now": "Run now",
   "running": "running",
   "Running": "Running",
+  "Running this schedule now will not replace this schedule. A copy of this schedule will be created and run immediately. You may not be able to reverse this action.": "Running this schedule now will not replace this schedule. A copy of this schedule will be created and run immediately. You may not be able to reverse this action.",
   "Run time": "Run time",
   "Save changes": "Save changes",
   "Schedule": "Schedule",

From 5dc831c78f0cd87fea64ec458c7e90065c49aa30 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 17 Apr 2024 16:46:53 +0530
Subject: [PATCH 047/250] Improved: added missing translations for the static
 text (#250)

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

diff --git a/src/locales/en.json b/src/locales/en.json
index e09f35cf..5c42e52b 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -20,6 +20,7 @@
   "Click the backdrop to dismiss.": "Click the backdrop to dismiss.",
   "Color": "Color",
   "Configuration missing": "Configuration missing",
+  "Config facilities updated successfully.": "Config facilities updated successfully.",
   "Confirm": "Confirm",
   "Copy details": "Copy details",
   "Create group": "Create group",
@@ -55,7 +56,10 @@
   "Failed": "Failed",
   "Failed to create rule.": "Failed to create rule.",
   "Failed to disable rule group.": "Failed to disable rule group.",
+  "Failed to update config facilities.": "Failed to update config facilities.",
+  "Failed to update product filters.": "Failed to update product filters.",
   "Failed to update some jobs": "Failed to update some jobs",
+  "Failed to schedule service": "Failed to schedule service",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
   "features": "{type} features",
   "Fetching time zones": "Fetching time zones",
@@ -113,6 +117,7 @@
   "Product and channel": "Product and channel",
   "Product list": "Product list",
   "Product features": "Product features",
+  "Product filters updated succesfully.": "Product filters updated succesfully.",
   "Product SKU column": "Product SKU column",
   "Product Store": "Product Store",
   "Product tags": "Product tags",

From b34a378c75b74249ceee3e592c5e386511ec12d9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 17 Apr 2024 18:18:42 +0530
Subject: [PATCH 048/250] Improved: preventing additional api calls if
 ruleGroup is not found (#250)

---
 src/store/modules/rule/actions.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 2dd6d244..f0931cff 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -41,6 +41,7 @@ const actions: ActionTree<RuleState, RootState> = {
 
       if(!ruleGroup.ruleGroupId) {
         throw new Error("No rule founds")
+        return;
       }
 
       const resp = await RuleService.fetchRules({ 

From 28cd7f777cb0fc6d399eb69e3c07b09f5c803d37 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 09:41:14 +0530
Subject: [PATCH 049/250] Improved: indentation, error message, clear state on
 logout (#250)

---
 src/components/AddProductFiltersModal.vue | 10 +++++-----
 src/locales/en.json                       |  1 +
 src/services/RuleService.ts               |  8 ++++----
 src/store/modules/rule/actions.ts         |  6 +++++-
 src/store/modules/rule/mutation-types.ts  |  3 ++-
 src/store/modules/rule/mutations.ts       |  7 +++++++
 src/store/modules/user/actions.ts         |  2 ++
 src/store/modules/util/actions.ts         |  6 +++++-
 src/store/modules/util/mutation-types.ts  |  3 ++-
 src/store/modules/util/mutations.ts       | 15 ++++++++++++++-
 src/views/CreateThresholdRule.vue         |  4 ++--
 11 files changed, 49 insertions(+), 16 deletions(-)

diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index 352d3838..ccc602eb 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -33,7 +33,7 @@
       </ion-fab-button>
     </ion-fab>
 
-    <ion-infinite-scroll @ionInfinite="loadMoreTags($event)" threshold="100px" :disabled="!isScrollable">
+    <ion-infinite-scroll @ionInfinite="loadMoreFilters($event)" threshold="100px" :disabled="!isScrollable">
       <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="translate('Loading')"/>
     </ion-infinite-scroll>
   </ion-content>
@@ -87,10 +87,10 @@ function closeModal() {
 }
 
 function search() {
-  getTags();
+  getFilters();
 }
 
-async function getTags(vSize?: any, vIndex?: any) {
+async function getFilters(vSize?: any, vIndex?: any) {
   const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
   const viewIndex = vIndex ? vIndex : 0;
 
@@ -119,8 +119,8 @@ async function getTags(vSize?: any, vIndex?: any) {
   }
 }
 
-async function loadMoreTags(event: any){
-  getTags(
+async function loadMoreFilters(event: any){
+  getFilters(
     undefined,
     Math.ceil(facetOptions.value.length / process.env.VUE_APP_VIEW_SIZE).toString() 
   ).then(() => {
diff --git a/src/locales/en.json b/src/locales/en.json
index 5c42e52b..405dd57a 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -56,6 +56,7 @@
   "Failed": "Failed",
   "Failed to create rule.": "Failed to create rule.",
   "Failed to disable rule group.": "Failed to disable rule group.",
+  "Failed to fetch rule information.": "Failed to fetch rule information.",
   "Failed to update config facilities.": "Failed to update config facilities.",
   "Failed to update product filters.": "Failed to update product filters.",
   "Failed to update some jobs": "Failed to update some jobs",
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index 2a92138e..efb108df 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -4,7 +4,7 @@ import { hasError } from '@/utils';
 
 const fetchRuleGroup = async (payload: any): Promise <any>  => {
   return api({
-    url: `ruleGroups`,
+    url: "ruleGroups",
     method: "GET",
     data: payload
   });
@@ -22,7 +22,7 @@ const createRuleGroup = async (payload: any): Promise <any>  => {
   let ruleGroup = {}
   try {
     const resp = await api({
-      url: `ruleGroups/`,
+      url: "ruleGroups",
       method: "POST",
       data: payload
     }) as any;
@@ -43,7 +43,7 @@ const createRule = async (payload: any): Promise <any>  => {
   let rule = {}
   try {
     const resp = await api({
-      url: `decisionRules/`,
+      url: "decisionRules",
       method: "POST",
       data: payload
     }) as any;
@@ -92,7 +92,7 @@ const fetchRulesActionsAndConditions = async (ruleId: any): Promise <any>  => {
     }
   } catch(err: any) {
     logger.error(err)
-    return Promise.reject("Failed to update rule");
+    return Promise.reject("Failed to fetch rule information.");
   }
 }
 
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index f0931cff..1822a91c 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -97,7 +97,11 @@ const actions: ActionTree<RuleState, RootState> = {
       rules.splice(index, 1);
     }
     commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total});
-  }
+  },
+
+  async clearRuleState({ commit }) {
+    commit(types.RULE_CLEARED)
+  },
 }
 
 export default actions;
\ No newline at end of file
diff --git a/src/store/modules/rule/mutation-types.ts b/src/store/modules/rule/mutation-types.ts
index ad7c41f2..487424e2 100644
--- a/src/store/modules/rule/mutation-types.ts
+++ b/src/store/modules/rule/mutation-types.ts
@@ -1,3 +1,4 @@
 export const SN_RULE = 'rule'
 export const RULE_RULES_UPDATED = SN_RULE + '/RULES_UPDATED'
-export const RULE_GROUP_UPDATED = SN_RULE + '/GROUP_UPDATED'
\ No newline at end of file
+export const RULE_GROUP_UPDATED = SN_RULE + '/GROUP_UPDATED'
+export const RULE_CLEARED = SN_RULE + "/CLEARED"
\ No newline at end of file
diff --git a/src/store/modules/rule/mutations.ts b/src/store/modules/rule/mutations.ts
index 850f5ff5..fecbe0fd 100644
--- a/src/store/modules/rule/mutations.ts
+++ b/src/store/modules/rule/mutations.ts
@@ -10,5 +10,12 @@ const mutations: MutationTree <RuleState> = {
   [types.RULE_GROUP_UPDATED] (state, payload) {
     state.ruleGroup = payload;
   },
+  [types.RULE_CLEARED](state) {
+    state.rules = {
+      list: [],
+      total: ''
+    },
+    state.ruleGroup = {}
+  },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 1897208c..9bf3eef5 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -53,6 +53,8 @@ const actions: ActionTree<UserState, RootState> = {
   async logout ({ commit }) {
     // TODO add any other tasks if need
     commit(types.USER_END_SESSION)
+    this.dispatch("rule/clearRuleState")
+    this.dispatch("util/clearUtilState")
   },
 
   
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 3d045758..15639cf9 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -29,7 +29,11 @@ const actions: ActionTree<UtilState, RootState> = {
 
   async updateAppliedFilters ({ commit, state }, payload) {
     commit(types.UTIL_APPLIED_FILTERS_UPDATED, payload)
-  }
+  },
+
+  async clearUtilState({ commit }) {
+    commit(types.UTIL_CLEARED)
+  },
 }
 
 export default actions;
\ No newline at end of file
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 2129dc5f..106235a9 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -1,3 +1,4 @@
 export const SN_UTIL = 'util'
 export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDATED'
-export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
\ No newline at end of file
+export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
+export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index 59d84c22..d1943ccc 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -4,10 +4,23 @@ import * as types from './mutation-types'
 
 const mutations: MutationTree <UtilState> = {
   [types.UTIL_CONFIG_FACILITES_UPDATED] (state, payload) {
-      state.configFacilities = payload
+    state.configFacilities = payload
   },
   [types.UTIL_APPLIED_FILTERS_UPDATED] (state, payload) {
     state.appliedFilters = payload
   },
+  [types.UTIL_CLEARED] (state) {
+    state.configFacilities = [],
+    state.appliedFilters = {
+      included: {
+        tags: [],
+        productFeatures: []
+      },
+      excluded: {
+        tags: [],
+        productFeatures: []
+      }
+    }
+  },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index a063c649..4c85d586 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -146,7 +146,7 @@ function generateRuleConditions(ruleId: string) {
           "fieldName": filter,
           "operator": type === "included" ? "in" : "not-in",
           "fieldValue": value.length > 1 ? value.join(",") : value[0],
-          "multiValued": value?.length > 1 ? "Y" : "N"
+          "multiValued": value.length > 1 ? "Y" : "N"
         })
       }
     })
@@ -156,7 +156,7 @@ function generateRuleConditions(ruleId: string) {
 }
 
 async function createThresholdRule() {
-  let ruleGroup =   await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_THRESHOLD" });
+  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_THRESHOLD" });
 
   try {
     if(!ruleGroup.ruleGroupId) {

From a45cc454722debd4d5daf9a219516721fd70b9af Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 10:51:29 +0530
Subject: [PATCH 050/250] Improved: removed entity from payload, and update
 method name to fetch schedules (#250)

---
 src/components/ScheduleActionsPopover.vue    | 4 ++--
 src/components/ScheduleRuleItem.vue          | 2 +-
 src/components/UpdateProductFiltersModal.vue | 2 --
 src/services/RuleService.ts                  | 4 ++--
 src/views/CreateThresholdRule.vue            | 7 +------
 5 files changed, 6 insertions(+), 13 deletions(-)

diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
index 075447af..5cc0b189 100644
--- a/src/components/ScheduleActionsPopover.vue
+++ b/src/components/ScheduleActionsPopover.vue
@@ -41,7 +41,7 @@ async function disableRuleGroup() {
   }
 
   try {
-    const resp = await RuleService.scheduleRule(payload)
+    const resp = await RuleService.scheduleRuleGroup(payload)
     if(!hasError(resp)){
       const ruleGroupValue = JSON.parse(JSON.stringify(ruleGroup.value))
       ruleGroupValue.schedule.paused = "Y"
@@ -88,7 +88,7 @@ async function runNow() {
               }
 
               try {
-                const resp = await RuleService.scheduleRule(payload)
+                const resp = await RuleService.scheduleRuleGroup(payload)
                 if(hasError(resp)) {
                   throw resp.data
                 }
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index c687a078..94083be4 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -66,7 +66,7 @@ async function saveSchedule() {
   }
 
   try {
-    const resp = await RuleService.scheduleRule(payload)
+    const resp = await RuleService.scheduleRuleGroup(payload)
     if(!hasError(resp)) {
       showToast(translate("Service has been scheduled"))
       await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index 63995d3f..c4965a9b 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -171,7 +171,6 @@ async function saveFilters() {
     includeCondition.fieldValue = includedFilters.value.join(",")
   } else {
     rule.ruleConditions.push({
-      "_entity": "ruleCondition",
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FILTER",
       "fieldName": props.searchfield,
@@ -186,7 +185,6 @@ async function saveFilters() {
     excludeCondition.fieldValue = excludedFilters.value.join(",")
   } else {
     rule.ruleConditions.push({
-      "_entity": "ruleCondition",
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FILTER",
       "fieldName": props.searchfield,
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index efb108df..fa2542b3 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -103,7 +103,7 @@ const fetchRuleScheduleInformation = async (ruleGroupId: string): Promise<any> =
   });
 }
 
-const scheduleRule = async (payload: any): Promise<any> => {
+const scheduleRuleGroup = async (payload: any): Promise<any> => {
   return api({
     url: `ruleGroups/${payload.ruleGroupId}/schedule`,
     method: "POST",
@@ -134,6 +134,6 @@ export const RuleService = {
   fetchRulesActionsAndConditions,
   fetchRuleScheduleInformation,
   runNow,
-  scheduleRule,
+  scheduleRuleGroup,
   updateRule
 }
\ No newline at end of file
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 4c85d586..6a9c243c 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -112,7 +112,6 @@ function isFacilitySelected(facilityId: any) {
 
 function generateRuleActions(ruleId: string) {
   return [{
-    "_entity": "ruleAction",
     "ruleId": ruleId,
     "actionTypeEnumId": "ATP_THRESHOLD",
     "fieldName": "safety_stock",
@@ -126,7 +125,6 @@ function generateRuleConditions(ruleId: string) {
   const selectedFacilites = formData.value.selectedConfigFacilites
   if(selectedFacilites?.length) {
     conditions.push({
-      "_entity": "ruleCondition",
       "ruleId": ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
       "fieldName": "facilities",
@@ -139,8 +137,7 @@ function generateRuleConditions(ruleId: string) {
   Object.entries(appliedFilters.value).map(([type, filters]: any) => {
     Object.entries(filters as any).map(([filter, value]: any) => {
       if(value.length) {
-        conditions.push({ 
-          "_entity": "ruleCondition",
+        conditions.push({
           "ruleId": ruleId,
           "conditionTypeEnumId": "ENTCT_ATP_FILTER",
           "fieldName": filter,
@@ -161,13 +158,11 @@ async function createThresholdRule() {
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
-        "_entity": "ruleGroup",
         "groupTypeEnumId": "RG_THRESHOLD"
       })
     }
 
     const params = {
-      "_entity": "rule",
       "ruleId": formData.value.ruleName.trim().toUpperCase().split(' ').join('_'),
       "ruleGroupId": ruleGroup.ruleGroupId,
       "ruleName": formData.value.ruleName,

From 6f2f6b6d6cf9936ed6009330c8e774becdf0a1eb Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 11:19:42 +0530
Subject: [PATCH 051/250] Improved: code to fetch configFacilities on basis of
 productStore and sending productStoreId while ruleGroup creation (#250)

---
 src/components/SelectConfigFacilitiesModal.vue | 18 +++++++++++++-----
 src/services/UtilService.ts                    |  2 +-
 src/store/modules/util/actions.ts              |  3 ++-
 src/views/CreateThresholdRule.vue              |  5 ++++-
 4 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index 6bc7680d..6ddc0447 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -85,11 +85,19 @@ function isSelected(currentFacilityId: any) {
 async function saveFacilities() {  
   const rule = JSON.parse(JSON.stringify(props.rule))
 
-  rule.ruleConditions.map((condition: any) => {
-    if(condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES") {
-      condition.fieldValue = selectedFacilityValues.join(",")
-    }
-  })
+  const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
+  if(condition) {
+    condition.fieldValue = selectedFacilityValues.join(",")
+  } else {
+    rule.ruleConditions.push({
+      "ruleId": rule.ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
+      "fieldName": "facilities",
+      "operator": "in",
+      "fieldValue": selectedFacilityValues.length > 1 ? selectedFacilityValues.join(",") : selectedFacilityValues[0],
+      "multiValued": selectedFacilityValues.length > 1 ? "Y" : "N"
+    })
+  }
 
   try {
     await RuleService.updateRule(rule, rule.ruleId)
diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
index 0d01afd4..cc5b6087 100644
--- a/src/services/UtilService.ts
+++ b/src/services/UtilService.ts
@@ -10,7 +10,7 @@ const fetchFacets = async (payload: any): Promise<any> => {
 
 const fetchConfigFacilities = async (payload: any): Promise <any>  => {
   return api({
-    url: "facilities",
+    url: `productStores/${payload.productStoreId}/facilities`,
     method: "GET",
     params: payload
   });
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 15639cf9..c5414edc 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -5,6 +5,7 @@ import { hasError } from '@/utils'
 import logger from '@/logger'
 import UtilState from './UtilState'
 import * as types from './mutation-types'
+import store from "@/store"
 
 
 const actions: ActionTree<UtilState, RootState> = {
@@ -14,7 +15,7 @@ const actions: ActionTree<UtilState, RootState> = {
     if(configFacilities.length) return;
 
     try {
-      const resp = await UtilService.fetchConfigFacilities({ facilityTypeId: 'CONFIGURATION' });
+      const resp = await UtilService.fetchConfigFacilities({ facilityTypeId: 'CONFIGURATION', productStoreId: store.state.user.currentEComStore.productStoreId });
 
       if(!hasError(resp)) {
         configFacilities = resp.data;
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 6a9c243c..f5eff1a3 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -93,6 +93,7 @@ const configFacilities = computed(() => store.getters["util/getConfigFacilities"
 const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
 const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
+const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onMounted(async () => {
   await store.dispatch("util/fetchConfigFacilities");
@@ -158,7 +159,9 @@ async function createThresholdRule() {
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
-        "groupTypeEnumId": "RG_THRESHOLD"
+        "groupTypeEnumId": "RG_THRESHOLD",
+        "productStoreId": currentEComStore.value.productStoreId,
+        "statusId": "ATP_RG_ACTIVE"
       })
     }
 

From 4b78f01a0ad8d30166681dfeb0efbd64a8dc0c9c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 11:29:06 +0530
Subject: [PATCH 052/250] Improved: dynamically rendered the rule number on the
 rule card (#250)

---
 src/components/RuleItem.vue | 4 ++--
 src/views/Threshold.vue     | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 6ce98587..3bf61405 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -4,7 +4,7 @@
       <div>
         <ion-card-subtitle class="overline">{{ rule.ruleId }}</ion-card-subtitle>
         <ion-card-title>{{ rule.ruleName }}</ion-card-title>
-        <ion-card-subtitle>{{ "1/" }}{{ total }}</ion-card-subtitle>
+        <ion-card-subtitle>{{ index+1 }}/{{ total }}</ion-card-subtitle>
       </div>
       <div>
         <ion-button fill="clear" color="medium" class="ion-no-padding">
@@ -138,7 +138,7 @@ import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModal.vu
 const router = useRouter();
 const store = useStore();
 
-const props = defineProps(["selectedSegment", "rule"])
+const props = defineProps(["selectedSegment", "rule", "index"])
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 4f531550..dc405f8b 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -12,7 +12,7 @@
         <ScheduleRuleItem />
 
         <section>
-          <RuleItem v-for="rule in rules" :rule="rule" :key="rule.ruleId" />
+          <RuleItem v-for="(rule, index) in rules" :rule="rule" :index="index" :key="rule.ruleId" />
         </section>
       </main>
 

From 23a016f35b033ed22bbaae52730386e080651ffc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 11:32:20 +0530
Subject: [PATCH 053/250] Improved: variable name for rule index (#250)

---
 src/components/RuleItem.vue | 4 ++--
 src/views/Threshold.vue     | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 3bf61405..a6d73965 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -4,7 +4,7 @@
       <div>
         <ion-card-subtitle class="overline">{{ rule.ruleId }}</ion-card-subtitle>
         <ion-card-title>{{ rule.ruleName }}</ion-card-title>
-        <ion-card-subtitle>{{ index+1 }}/{{ total }}</ion-card-subtitle>
+        <ion-card-subtitle>{{ ruleIndex+1 }}/{{ total }}</ion-card-subtitle>
       </div>
       <div>
         <ion-button fill="clear" color="medium" class="ion-no-padding">
@@ -138,7 +138,7 @@ import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModal.vu
 const router = useRouter();
 const store = useStore();
 
-const props = defineProps(["selectedSegment", "rule", "index"])
+const props = defineProps(["selectedSegment", "rule", "ruleIndex"])
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index dc405f8b..d8c58b3f 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -12,7 +12,7 @@
         <ScheduleRuleItem />
 
         <section>
-          <RuleItem v-for="(rule, index) in rules" :rule="rule" :index="index" :key="rule.ruleId" />
+          <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
       </main>
 

From bc7adee2a4f3b8b6bafc14ab5ad801ad204624a7 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 11:39:58 +0530
Subject: [PATCH 054/250] Improved: code to not generate ruleId by ruleName,
 changed the variable/method name for fetching filters (#250)

---
 src/components/UpdateProductFiltersModal.vue | 10 +++++-----
 src/views/CreateThresholdRule.vue            |  3 +--
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index c4965a9b..67fa1e7e 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -39,7 +39,7 @@
       </ion-fab-button>
     </ion-fab>
 
-    <ion-infinite-scroll @ionInfinite="loadMoreTags($event)" threshold="100px" :disabled="!isScrollable">
+    <ion-infinite-scroll @ionInfinite="loadMoreFilters($event)" threshold="100px" :disabled="!isScrollable">
       <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="translate('Loading')"/>
     </ion-infinite-scroll>
   </ion-content>
@@ -101,10 +101,10 @@ function closeModal() {
 }
 
 function search() {
-  getTags();
+  getFilters();
 }
 
-async function getTags(vSize?: any, vIndex?: any) {
+async function getFilters(vSize?: any, vIndex?: any) {
   const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
   const viewIndex = vIndex ? vIndex : 0;
 
@@ -133,8 +133,8 @@ async function getTags(vSize?: any, vIndex?: any) {
   }
 }
 
-async function loadMoreTags(event: any){
-  getTags(
+async function loadMoreFilters(event: any){
+  getFilters(
     undefined,
     Math.ceil(facetOptions.value.length / process.env.VUE_APP_VIEW_SIZE).toString() 
   ).then(() => {
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index f5eff1a3..904f6dbf 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -100,7 +100,7 @@ onMounted(async () => {
 })
 
 function toggleFacilitySelection(facilityId: any) {
-  if(formData.value.selectedConfigFacilites.includes(facilityId)) {
+  if(isFacilitySelected(facilityId)) {
     formData.value.selectedConfigFacilites = formData.value.selectedConfigFacilites.filter((currentFacilityId: string) => currentFacilityId !== facilityId)
   } else {
     formData.value.selectedConfigFacilites.push(facilityId)
@@ -166,7 +166,6 @@ async function createThresholdRule() {
     }
 
     const params = {
-      "ruleId": formData.value.ruleName.trim().toUpperCase().split(' ').join('_'),
       "ruleGroupId": ruleGroup.ruleGroupId,
       "ruleName": formData.value.ruleName,
       "statusId": "ATP_RULE_ACTIVE",

From 79b7de40b4a21116716e9ea89cc3484228d24530 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 11:58:56 +0530
Subject: [PATCH 055/250] Improved: indentation, and moved click event to
 ion-fab-button (#250)

---
 .../SelectConfigFacilitiesModal.vue           |  4 +--
 src/store/modules/util/index.ts               | 30 +++++++++----------
 2 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index 6ddc0447..38b18945 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -22,8 +22,8 @@
       </ion-item>
     </ion-list>
 
-    <ion-fab @click="saveFacilities()" vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button @click="saveFacilities()">
         <ion-icon :icon="saveOutline" />  
       </ion-fab-button>
     </ion-fab>
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 0b9624ec..96b8d892 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -6,23 +6,23 @@ import RootState from '@/store/RootState'
 import UtilState from './UtilState'
 
 const utilModule: Module<UtilState, RootState> = {
-    namespaced: true,
-    state: {
-      configFacilities: [],
-      appliedFilters: {
-        included: {
-          tags: [],
-          productFeatures: []
-        },
-        excluded: {
-          tags: [],
-          productFeatures: []
-        }
+  namespaced: true,
+  state: {
+    configFacilities: [],
+    appliedFilters: {
+      included: {
+        tags: [],
+        productFeatures: []
       },
+      excluded: {
+        tags: [],
+        productFeatures: []
+      }
     },
-    getters,
-    actions,
-    mutations,
+  },
+  getters,
+  actions,
+  mutations,
 }
 
 // TODO

From 51e036ce9ebf8940fe0c9a2a494aebd89ad0f8a6 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 12:42:02 +0530
Subject: [PATCH 056/250] Improved: code to fetch ruleGroup based on
 productStoreId (#250)

---
 src/services/RuleService.ts | 2 +-
 src/views/Threshold.vue     | 5 +++--
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index fa2542b3..a642a6b1 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -6,7 +6,7 @@ const fetchRuleGroup = async (payload: any): Promise <any>  => {
   return api({
     url: "ruleGroups",
     method: "GET",
-    data: payload
+    params: payload
   });
 }
 
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index d8c58b3f..618c2a0d 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -9,7 +9,7 @@
 
     <ion-content>
       <main>
-        <ScheduleRuleItem />
+        <ScheduleRuleItem v-if="rules.length"/>
 
         <section>
           <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
@@ -39,9 +39,10 @@ const store = useStore();
 const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
+const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD', "productStoreId": currentEComStore.value.productStoreId })
   await store.dispatch("util/fetchConfigFacilities");
 })
 

From cbe7ca64792e84b000de5c79f833256882e0572c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 12:49:42 +0530
Subject: [PATCH 057/250] Improved: added empty state on threshold-rules page
 (#250)

---
 src/locales/en.json     |  1 +
 src/theme/variables.css | 13 +++++++++++++
 src/views/Threshold.vue |  9 +++++++--
 3 files changed, 21 insertions(+), 2 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 405dd57a..dfbce0de 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -106,6 +106,7 @@
   "No previous occurrence": "No previous occurrence",
   "No rules found, redirecting to product page": "No rules found, redirecting to product page",
   "No threshold rule found. Invalid job": "No threshold rule found. Invalid job",
+  "No threshold rules found": "No threshold rules found",
   "No time zone found": "No time zone found",
   "OMS instance": "OMS instance",
   "Only show selected products": "Only show selected products",
diff --git a/src/theme/variables.css b/src/theme/variables.css
index eaeddcce..8229085d 100644
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@@ -331,6 +331,19 @@ ion-content>section {
   align-items: start;
 }
 
+.empty-state {
+  max-width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 10px;
+}
+
+.empty-state > p {
+  text-align: center; 
+}
+
 @media (min-width: 700px) {
   main {
     max-width: 375px;
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 618c2a0d..1d8c94ee 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -8,14 +8,18 @@
     </ion-header>
 
     <ion-content>
-      <main>
-        <ScheduleRuleItem v-if="rules.length"/>
+      <main v-if="ruleGroup.ruleGroupId">
+        <ScheduleRuleItem />
 
         <section>
           <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
       </main>
 
+      <div class="empty-state" v-else>
+       <p>{{ translate("No threshold rules found") }}</p>
+      </div>
+
       <ion-fab vertical="bottom" horizontal="end" slot="fixed">
         <ion-fab-button @click="CreateThreshold()">
           <ion-icon :icon="addOutline" />
@@ -39,6 +43,7 @@ const store = useStore();
 const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
+const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onMounted(async() => {

From 9e1e26c9085172923e474eb8d75e2aee06e1c1c6 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 15:17:08 +0530
Subject: [PATCH 058/250] Improved: fieldName for the threshold rule(#250)

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

diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 904f6dbf..67e58fa9 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -115,7 +115,7 @@ function generateRuleActions(ruleId: string) {
   return [{
     "ruleId": ruleId,
     "actionTypeEnumId": "ATP_THRESHOLD",
-    "fieldName": "safety_stock",
+    "fieldName": "facility-safety-stock",
     "fieldValue": formData.value.threshold
   }]
 }

From 269f376fa553bc134a013dc7e99ade9120592572 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 16:45:32 +0530
Subject: [PATCH 059/250] Improved: code to clear state on product store change
 and rule creation, improved rule fetching logic (#255)

---
 src/store/modules/rule/actions.ts        |  4 +++-
 src/store/modules/util/UtilState.ts      |  2 +-
 src/store/modules/util/actions.ts        |  4 ++++
 src/store/modules/util/mutation-types.ts |  3 ++-
 src/store/modules/util/mutations.ts      | 12 ++++++++++++
 src/views/CreateThresholdRule.vue        |  2 ++
 src/views/Settings.vue                   |  1 +
 src/views/Threshold.vue                  |  3 +--
 8 files changed, 26 insertions(+), 5 deletions(-)

diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 1822a91c..7918ba97 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -5,15 +5,17 @@ import RuleState from './RuleState'
 import { RuleService } from '@/services/RuleService'
 import { hasError } from '@/utils'
 import logger from '@/logger'
+import { useStore } from 'vuex'
 
 
 const actions: ActionTree<RuleState, RootState> = {
   async fetchRuleGroup({ commit }, payload) {
+    const store = useStore();
     let ruleGroup = {} as any;
     let resp;
 
     try {
-      resp = await RuleService.fetchRuleGroup(payload)
+      resp = await RuleService.fetchRuleGroup({ ...payload, productStoreId: store.getters['user/getCurrentEComStore']?.productStoreId })
 
       if(!hasError(resp) && resp.data.length) {
         ruleGroup = resp.data[0]
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index b1c6e0fa..9d52ea32 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -1,4 +1,4 @@
 export default interface UtilState {
   configFacilities: any;
-  appliedFilters: any; 
+  appliedFilters: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index c5414edc..a775d0d6 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -35,6 +35,10 @@ const actions: ActionTree<UtilState, RootState> = {
   async clearUtilState({ commit }) {
     commit(types.UTIL_CLEARED)
   },
+
+  async clearAppliedFilters({ commit }) {
+    commit(types.UTIL_APPLIED_FILTERS_CLEARED)
+  },
 }
 
 export default actions;
\ No newline at end of file
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 106235a9..dd1d4711 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -1,4 +1,5 @@
 export const SN_UTIL = 'util'
 export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDATED'
 export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
-export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
\ No newline at end of file
+export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
+export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index d1943ccc..6d5ed654 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -22,5 +22,17 @@ const mutations: MutationTree <UtilState> = {
       }
     }
   },
+  [types.UTIL_APPLIED_FILTERS_CLEARED](state) {
+    state.appliedFilters = {
+      included: {
+        tags: [],
+        productFeatures: []
+      },
+      excluded: {
+        tags: [],
+        productFeatures: []
+      }
+    }
+  },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 67e58fa9..b292350a 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -181,6 +181,8 @@ async function createThresholdRule() {
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
     router.push("/threshold");
   } catch(err: any) {
     logger.error(err);
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index 1b5a424e..0b145213 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -127,6 +127,7 @@ function setEComStore(event: CustomEvent) {
     store.dispatch("user/setEcomStore", {
       "productStoreId": event.detail.value
     })
+    store.dispatch("rule/clearRuleState")
   }
 }
 
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 1d8c94ee..782f9061 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -44,10 +44,9 @@ const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
-const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD', "productStoreId": currentEComStore.value.productStoreId })
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
   await store.dispatch("util/fetchConfigFacilities");
 })
 

From 1055615203e9b70aaeebf75602efd6923896cc67 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 18 Apr 2024 17:57:53 +0530
Subject: [PATCH 060/250] Implemented: code to fetch rules for all the pages
 (#255)

---
 src/store/modules/rule/actions.ts |  6 +++---
 src/views/SafetyStock.vue         | 21 ++++++++++++++++++---
 src/views/Shipping.vue            | 30 ++++++++++++++++++++++++++----
 src/views/StorePickup.vue         | 31 ++++++++++++++++++++++++++-----
 src/views/Threshold.vue           |  2 +-
 5 files changed, 74 insertions(+), 16 deletions(-)

diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 7918ba97..a59d78fd 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -5,17 +5,17 @@ import RuleState from './RuleState'
 import { RuleService } from '@/services/RuleService'
 import { hasError } from '@/utils'
 import logger from '@/logger'
-import { useStore } from 'vuex'
+import store from '@/store'
 
 
 const actions: ActionTree<RuleState, RootState> = {
   async fetchRuleGroup({ commit }, payload) {
-    const store = useStore();
+    const productStore = await store.getters['user/getCurrentEComStore']
     let ruleGroup = {} as any;
     let resp;
 
     try {
-      resp = await RuleService.fetchRuleGroup({ ...payload, productStoreId: store.getters['user/getCurrentEComStore']?.productStoreId })
+      resp = await RuleService.fetchRuleGroup({ ...payload, productStoreId: productStore.productStoreId })
 
       if(!hasError(resp) && resp.data.length) {
         ruleGroup = resp.data[0]
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 12beacf2..e232dfdf 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -8,14 +8,17 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <main v-if="ruleGroup.ruleGroupId">
         <ScheduleRuleItem />
 
         <section>
-          <RuleItem />
-          <RuleItem />
+          <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
       </main>
+
+      <div class="empty-state" v-else>
+       <p>{{ translate("No threshold rules found") }}</p>
+      </div>
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -32,9 +35,21 @@ import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
 import { useRouter } from "vue-router";
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
+import { useStore } from 'vuex';
+import { computed, onMounted } from 'vue';
+import { translate } from '@/i18n';
 
+const store = useStore();
 const router = useRouter()
 
+const rules = computed(() => store.getters["rule/getRules"]);
+const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+
+onMounted(async() => {
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
 function createRule() {
   router.replace({ path: '/create-safety-stock' })
 }
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 22066e12..0609291f 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -7,7 +7,7 @@
       </ion-toolbar>
 
       <ion-toolbar>
-        <ion-segment v-model="selectedSegment">
+        <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()">
           <ion-segment-button value="productAndFacility">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
@@ -22,18 +22,21 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <main v-if="ruleGroup.ruleGroupId">
         <ScheduleRuleItem v-if="selectedSegment !== 'facility'" />
 
         <section v-if="selectedSegment === 'productAndFacility' || selectedSegment === 'productAndChannel'">
-          <RuleItem :selectedSegment="selectedSegment" />
-          <RuleItem :selectedSegment="selectedSegment" />
+          <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
         <section v-else>
           <FacilityItem />
           <FacilityItem />
         </section>
       </main>
+
+      <div class="empty-state" v-else>
+        <p>{{ translate("No store pickup rules found") }}</p>
+      </div>
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -53,11 +56,30 @@ import { translate } from '@/i18n';
 import FacilityItem from '@/components/FacilityItem.vue';
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+import { computed, onMounted } from 'vue';
 
 const selectedSegment = ref("productAndFacility")
 
+const store = useStore();
 const router = useRouter()
 
+const rules = computed(() => store.getters["rule/getRules"]);
+const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+
+onMounted(async() => {
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SHIPPING_FACILITY' })
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
+async function updateRuleGroup() {
+  if(selectedSegment.value === 'productAndChannel') {
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_CHANNEL'})
+  } else {
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY'})
+  }
+}
+
 function createShipping() {
   router.replace({ path: '/create-shipping' })
 }
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 39c99d60..26277191 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -7,7 +7,7 @@
       </ion-toolbar>
 
       <ion-toolbar>
-        <ion-segment v-model="selectedSegment">
+        <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()">
           <ion-segment-button value="productAndFacility">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
@@ -22,12 +22,11 @@
     </ion-header>
 
     <ion-content>
-      <main>
+      <main v-if="ruleGroup.ruleGroupId">
         <ScheduleRuleItem v-if="selectedSegment !== 'facility'" />
 
         <section v-if="selectedSegment === 'productAndFacility' || selectedSegment === 'productAndChannel'">
-          <RuleItem :selectedSegment="selectedSegment" />
-          <RuleItem :selectedSegment="selectedSegment" />
+          <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
         <section v-else>
           <FacilityItem />
@@ -35,6 +34,10 @@
         </section>
       </main>
 
+      <div class="empty-state" v-else>
+        <p>{{ translate("No store pickup rules found") }}</p>
+      </div>
+
       <ion-fab vertical="bottom" horizontal="end" slot="fixed">
         <ion-fab-button @click="createStorePickup()">
           <ion-icon :icon="addOutline" />
@@ -53,11 +56,29 @@ import FacilityItem from '@/components/FacilityItem.vue'
 import { translate } from '@/i18n';
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
+import { computed, onMounted } from 'vue';
 
 const selectedSegment = ref("productAndFacility")
-
+const store = useStore();
 const router = useRouter()
 
+const rules = computed(() => store.getters["rule/getRules"]);
+const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+
+onMounted(async() => {
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' })
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
+async function updateRuleGroup() {
+  if(selectedSegment.value === 'productAndChannel') {
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_CHANNEL'})
+  } else {
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY'})
+  }
+}
+
 function createStorePickup() {
   router.replace({ path: '/create-store-pickup' })
 }
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 782f9061..3b839a69 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -46,7 +46,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' })
   await store.dispatch("util/fetchConfigFacilities");
 })
 

From 1c2ec194bdd875541f283486789745cdbd0ba205 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 19 Apr 2024 11:20:52 +0530
Subject: [PATCH 061/250] Implemented: functionality to fetch and create safety
 stock rule (#255)

---
 .../AddProductFacilityGroupModal.vue          |  96 +++++++++++
 src/components/RuleItem.vue                   | 142 ++++++++++-----
 src/components/UpdateFacilityGroupModal.vue   | 120 +++++++++++++
 src/components/UpdateProductFiltersModal.vue  |   6 +-
 src/services/UtilService.ts                   |   8 +
 src/store/modules/util/UtilState.ts           |   1 +
 src/store/modules/util/actions.ts             |  21 +++
 src/store/modules/util/getters.ts             |   3 +
 src/store/modules/util/index.ts               |   1 +
 src/store/modules/util/mutation-types.ts      |   3 +-
 src/store/modules/util/mutations.ts           |   3 +
 src/views/CreateSafetyStockRule.vue           | 161 ++++++++++++++++--
 src/views/SafetyStock.vue                     |   2 +-
 src/views/Threshold.vue                       |   2 +-
 14 files changed, 513 insertions(+), 56 deletions(-)
 create mode 100644 src/components/AddProductFacilityGroupModal.vue
 create mode 100644 src/components/UpdateFacilityGroupModal.vue

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
new file mode 100644
index 00000000..5b40d68b
--- /dev/null
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -0,0 +1,96 @@
+<template>
+  <ion-header>
+    <ion-toolbar>
+      <ion-buttons slot="start">
+        <ion-button @click="closeModal">
+          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+        </ion-button>
+      </ion-buttons>
+      <ion-title>{{ type === "included" ? translate("Include facility group") : translate("Exclude facility group") }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-list>
+      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId"  @click="updateselectedGroups(group)">
+        <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName }}</ion-label>
+        <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isAlreadySelected(group.facilityGroupId)">
+          {{ group.facilityGroupName }}
+        </ion-checkbox>
+        <ion-note v-else slot="end" color="danger">{{ type === 'included' ? translate("excluded") : translate("included") }}</ion-note>
+      </ion-item>
+    </ion-list>
+
+    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
+    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button @click="saveFacilityGroups()">
+        <ion-icon :icon="saveOutline" />
+      </ion-fab-button>
+    </ion-fab>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import { computed, onMounted } from "vue";
+import {
+  IonButton,
+  IonButtons,
+  IonCheckbox,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonItem,
+  IonLabel,
+  IonList,
+  IonNote,
+  IonTitle,
+  IonToolbar,
+  modalController
+} from "@ionic/vue";
+import { arrowBackOutline, saveOutline } from 'ionicons/icons';
+import { useStore } from "vuex";
+import { defineProps, ref } from "vue";
+import { translate } from "@/i18n";
+
+const selectedGroups = ref([]) as any;
+
+const props = defineProps(["selectedFacilityGroups", "type"]);
+const store = useStore();
+
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
+
+onMounted(() => {
+  selectedGroups.value = JSON.parse(JSON.stringify(props.selectedFacilityGroups[props.type]))
+})
+
+function closeModal() {
+  modalController.dismiss({ dismissed: true, selectedGroups });
+}
+
+function isAlreadySelected(id: any) {
+  return selectedGroups.value.some((group: any) => group.facilityGroupId === id)
+}
+
+function updateselectedGroups(selectedGroup: any) {
+  const currentGroup = selectedGroups.value.find((group: any) => group.facilityGroupId === selectedGroup.facilityGroupId)
+
+  if(currentGroup?.facilityGroupId) {
+    selectedGroups.value = selectedGroups.value.filter((group: any) => group.facilityGroupId !== selectedGroup.facilityGroupId)
+  } else {
+    selectedGroups.value.push(selectedGroup)
+    
+  }
+}
+
+function isAlreadyApplied(value: string) {
+  const type = props.type === 'included' ? 'excluded' : 'included'
+  return props.selectedFacilityGroups[type].some((group: any) => group.facilityGroupId === value)
+}
+
+function saveFacilityGroups() {
+  modalController.dismiss({ dismissed: true, selectedGroups: selectedGroups.value })
+}
+
+</script>
\ No newline at end of file
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index a6d73965..26154c5b 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -19,12 +19,12 @@
     <ion-item lines="full" v-if="selectedPage.path === '/threshold'">
       <ion-icon slot="start" :icon="globeOutline"/>
       <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
-      <ion-chip slot="end" outline @click="editThreshold()">{{ rule.ruleActions[0]?.fieldValue }}</ion-chip>
+      <ion-chip slot="end" outline @click="editThreshold()">{{ rule.ruleActions?.length ? rule.ruleActions[0]?.fieldValue : '-' }}</ion-chip>
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/safety-stock'">
       <ion-icon slot="start" :icon="pulseOutline"/>
       <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
-      <ion-chip slot="end" outline @click="editSafetyStock()">5</ion-chip>
+      <ion-chip slot="end" outline @click="editSafetyStock()">{{ rule.ruleActions?.length ? rule.ruleActions[0].fieldValue : '-' }}</ion-chip>
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">Fixed the positioning of the security group displayed for the loggedin user.
       <ion-icon slot="start" :icon="storefrontOutline"/>
@@ -36,46 +36,32 @@
     </ion-item>
 
     <ion-list>
-      <template v-if="selectedSegment === 'productAndChannel'">
+      <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'productAndChannel'">
         <ion-item-divider color="light">
           <ion-label>{{ translate("Channels") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium">
+          <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()">
             <ion-icon :icon="optionsOutline" slot="icon-only" />
           </ion-button>
         </ion-item-divider>
 
-        <ion-item lines="none">
+        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FACILITIES')" lines="none">
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ "<Config facility Id>, <Config facility Id>" }}</ion-label>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FACILITIES") }}</ion-label>
         </ion-item>
       </template>
-
+      
       <template v-else>
         <ion-item-divider color="light">
           <ion-label>{{ translate("Facility groups") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()" >
+          <ion-button slot="end" fill="clear" color="medium" @click="openUpdateFacilityGroupModal()">
             <ion-icon :icon="optionsOutline" slot="icon-only" />
           </ion-button>
         </ion-item-divider>
-
-        <template v-if="selectedPage.path === '/threshold'">
-          <ion-item v-if="getRuleConditions('ENTCT_ATP_FACILITIES')" lines="none">
-            <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-            <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FACILITIES") }}</ion-label>
-          </ion-item>
-        </template>
-
-        <template v-else>
-          <ion-item>
-            <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-            <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
-          </ion-item>
-
-          <ion-item lines="none">
-            <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-            <ion-label class="ion-text-wrap">{{ "<Group name, Group name>" }}</ion-label>
-          </ion-item>
-        </template>
+        
+        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS')" lines="none">
+          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS") }}</ion-label>
+        </ion-item>
       </template>
 
       <ion-item-divider color="light">
@@ -85,11 +71,11 @@
         </ion-button>
       </ion-item-divider>
 
-      <ion-item v-if="getRuleConditions('ENTCT_ATP_FILTER', 'tags', 'in')">
+      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
         <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
       </ion-item>
-      <ion-item lines="none" v-if="getRuleConditions('ENTCT_ATP_FILTER', 'tags', 'not-in')">
+      <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
         <ion-icon slot="start" :icon="closeCircleOutline"/>
         <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
       </ion-item>
@@ -102,11 +88,11 @@
           </ion-button>
         </ion-item-divider>
 
-        <ion-item v-if="getRuleConditions('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
+        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
         </ion-item>
-        <ion-item lines="full" v-if="getRuleConditions('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
+        <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
           <ion-icon slot="start" :icon="closeCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
         </ion-item>
@@ -134,6 +120,7 @@ import { showToast } from '@/utils';
 import logger from '@/logger';
 import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
 import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModal.vue';
+import UpdateFacilityGroupModal from '@/components/UpdateFacilityGroupModal.vue';
 
 const router = useRouter();
 const store = useStore();
@@ -141,6 +128,7 @@ const store = useStore();
 const props = defineProps(["selectedSegment", "rule", "ruleIndex"])
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 const selectedPage = ref({
   path: '',
@@ -159,7 +147,7 @@ async function editThreshold() {
       name: "threshold",
       placeholder: translate("Threshold"),
       type: "number",
-      value: props.rule.ruleActions[0].fieldValue,
+      value: props.rule.ruleActions?.length ? props.rule.ruleActions[0].fieldValue : 0,
       min: 0
     }],
     buttons: [{
@@ -171,7 +159,17 @@ async function editThreshold() {
       handler: async(data) => {
         if(data.threshold) {
           const rule = JSON.parse(JSON.stringify(props.rule))
-          rule.ruleActions[0].fieldValue = data.threshold
+
+          if(!rule.ruleActions?.length) {
+            rule.ruleActions = [{
+              "ruleId": props.rule.ruleId,
+              "actionTypeEnumId": "ATP_SAFETY_STOCK",
+              "fieldName": "facility-safety-stock",
+              "fieldValue": data.threshold
+            }]
+          } else {
+            rule.ruleActions[0].fieldValue = data.threshold
+          }
 
           try {
             await RuleService.updateRule(rule, props.rule.ruleId)
@@ -194,9 +192,10 @@ async function editSafetyStock() {
   const alert = await alertController.create({
     header: translate("Edit safety stock"),
     inputs: [{
-      name: "safety-stock",
+      name: "safetyStock",
       placeholder: translate("Safety stock"),
       type: "number",
+      value: props.rule.ruleActions?.length ? props.rule.ruleActions[0].fieldValue : 0,
       min: 0
     }],
     buttons: [{
@@ -205,6 +204,34 @@ async function editSafetyStock() {
     },
     {
       text: translate('Update'),
+      handler: async (data) => {
+        console.log(data);
+        
+        if(data.safetyStock) {
+          const rule = JSON.parse(JSON.stringify(props.rule))
+
+          if(!rule.ruleActions?.length) {
+            rule.ruleActions = [{
+              "ruleId": props.rule.ruleId,
+              "actionTypeEnumId": "ATP_SAFETY_STOCK",
+              "fieldName": "facility-safety-stock",
+              "fieldValue": data.safetyStock
+            }]
+          } else {
+            rule.ruleActions[0].fieldValue = data.threshold
+          }
+
+          try {
+            await RuleService.updateRule(rule, props.rule.ruleId)
+            await store.dispatch('rule/updateRuleData', { rule })
+            showToast(translate("Safety stock updated successfully."))
+            alertController.dismiss()
+          } catch(err: any) {
+            showToast(translate("Failed to update safety stock."))
+            logger.error(err);
+          }
+        }
+      }
     }]
   })
 
@@ -249,6 +276,8 @@ async function editRuleName() {
 }
 
 function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, operator? : string) {
+  if(!props.rule.ruleConditions) return;
+
   if(fieldName && operator) {
     const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)
     return condition?.fieldValue?.split(",").join(", ")
@@ -256,12 +285,21 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
     const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)
 
     if(condition && condition.fieldValue) {
-      let facilities = condition?.fieldValue.split(",")
-      facilities = facilities.map((id: string) => {
-        let facility = configFacilities.value.find((facility: any) => facility.facilityId === id)
-        return facility ? facility.facilityName : null
-      })
-      return facilities.join(", ")
+      if(conditionTypeEnumId === 'ENTCT_ATP_FACILITIES') {
+        let facilities = condition?.fieldValue.split(",")
+        facilities = facilities.map((id: string) => {
+          let facility = configFacilities.value.find((facility: any) => facility.facilityId === id)
+          return facility ? facility.facilityName : null
+        })
+        return facilities.join(", ")
+      } else {
+        let facilityGroupIds = condition?.fieldValue.split(",")
+        facilityGroupIds = facilityGroupIds.map((id: string) => {
+          let group = facilityGroups.value.find((group: any) => group.facilityGroupId === id)
+          return group ? group.facilityGroupName : null
+        })
+        return facilityGroupIds.join(", ")
+      }
     }
   }
 }
@@ -296,7 +334,12 @@ async function archiveRule() {
 }
 
 function getSelectedFacilities() {
-  const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
+  const condition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
+  return (condition && condition.fieldValue) ? condition.fieldValue.split(",") : []
+}
+
+function getSelectedFacilityGroups() {
+  const condition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS")
   return (condition && condition.fieldValue) ? condition.fieldValue.split(",") : []
 }
 
@@ -312,6 +355,23 @@ async function openSelectConfigFacilitiesModal() {
   modal.present()
 }
 
+async function openUpdateFacilityGroupModal() {
+  const modal = await modalController.create({
+    component: UpdateFacilityGroupModal,
+    componentProps: {
+      rule: props.rule,
+      selectedFacilityGroupIds: getSelectedFacilityGroups()
+    },
+  })
+
+  modal.present()
+}
+
+function isRuleConditionAvailable(conditionTypeEnumId: string, fieldName?: string, operator? : string) {
+  if(fieldName) return props.rule.ruleConditions?.some((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)
+  else return props.rule.ruleConditions?.some((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId) 
+}
+
 async function openUpdateProductFiltersModal(label: string, facetToSelect: string, searchfield: string) {
   const modal = await modalController.create({
     component: UpdateProductFiltersModal,
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
new file mode 100644
index 00000000..133e1999
--- /dev/null
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -0,0 +1,120 @@
+<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("Select facilities") }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-list>
+      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId">
+        <ion-checkbox :checked="isSelected(group.facilityGroupId)" @ionChange="toggleFacilityGroupSelection(group)">
+          <ion-label>
+            {{ group.facilityGroupName }}
+            <p>{{ group.facilityGroupId }}</p>
+          </ion-label>
+        </ion-checkbox>
+      </ion-item>
+    </ion-list>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button @click="saveFacilities()">
+        <ion-icon :icon="saveOutline" />  
+      </ion-fab-button>
+    </ion-fab>
+  </ion-content>
+</template>
+  
+<script setup lang="ts">
+import {
+  IonButtons,
+  IonButton,
+  IonCheckbox,
+  IonContent,
+  IonFab,
+  IonFabButton,
+  IonHeader,
+  IonIcon,
+  IonItem,
+  IonLabel,
+  IonList,
+  IonTitle,
+  IonToolbar,
+  modalController
+} from "@ionic/vue";
+import { computed, defineProps, onMounted } from "vue";
+import { closeOutline, saveOutline } from "ionicons/icons";
+import { useStore } from "vuex";
+import { translate } from "@/i18n";
+import { RuleService } from "@/services/RuleService";
+import { showToast } from "@/utils";
+import logger from "@/logger";
+
+const store = useStore();
+const props = defineProps(["rule", "selectedFacilityGroupIds"])
+
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
+let selectedFacilityGroupIds = JSON.parse(JSON.stringify(props.selectedFacilityGroupIds))
+
+onMounted(async () => {
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
+async function closeModal() {
+  modalController.dismiss({ dismissed: true });
+}
+
+async function toggleFacilityGroupSelection(updatedGroup: any) {
+  const selectedGroup = selectedFacilityGroupIds.some((groupId: any) => groupId === updatedGroup.facilityGroupId);
+  if(selectedGroup) {
+    selectedFacilityGroupIds = selectedFacilityGroupIds.filter((groupId: any) => groupId !== updatedGroup.facilityGroupId);
+  } else {
+    selectedFacilityGroupIds.push(updatedGroup.facilityGroupId);
+  }
+}
+
+function isSelected(currentGroupId: any) {
+  return selectedFacilityGroupIds.some((groupId: any) => groupId === currentGroupId);
+}
+
+async function saveFacilities() {  
+  const rule = JSON.parse(JSON.stringify(props.rule))
+
+  if(!rule.ruleConditions) rule.ruleConditions = []
+
+  const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS")
+  if(condition) {
+    condition.fieldValue = selectedFacilityGroupIds.join(",")
+  } else {
+    rule.ruleConditions.push({
+      "ruleId": rule.ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+      "fieldName": "facilityGroupId",
+      "operator": "in",
+      "fieldValue": selectedFacilityGroupIds.length > 1 ? selectedFacilityGroupIds.join(",") : selectedFacilityGroupIds[0],
+      "multiValued": selectedFacilityGroupIds.length > 1 ? "Y" : "N"
+    })
+  }
+
+  try {
+    await RuleService.updateRule(rule, rule.ruleId)
+    await store.dispatch('rule/updateRuleData', { rule })
+    showToast(translate("Facility groups updated successfully."))
+    modalController.dismiss();
+  } catch(err: any) {
+    showToast(translate("Failed to update facility groups."))
+    logger.error(err)
+  }
+}
+</script>
+
+<style scoped>
+ion-content {
+  --padding-bottom: 80px;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index 67fa1e7e..c082a6b0 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -89,10 +89,10 @@ const props = defineProps(["label", "facetToSelect", "searchfield", "rule"]);
 const store = useStore();
 
 onMounted(() => {
-  const includedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
+  const includedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
   if(includedCondition && includedCondition.fieldValue) includedFilters.value = includedCondition.fieldValue.split(",");
 
-  const excludedCondition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
+  const excludedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
   if(excludedCondition && excludedCondition.fieldValue) excludedFilters.value = excludedCondition.fieldValue.split(",");
 })
 
@@ -166,6 +166,8 @@ function isSelected(value: string) {
 async function saveFilters() {
   const rule = JSON.parse(JSON.stringify(props.rule))
 
+  if(!rule.ruleConditions) rule.ruleConditions = []
+
   const includeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
   if(includeCondition) {
     includeCondition.fieldValue = includedFilters.value.join(",")
diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
index cc5b6087..a5261765 100644
--- a/src/services/UtilService.ts
+++ b/src/services/UtilService.ts
@@ -16,7 +16,15 @@ const fetchConfigFacilities = async (payload: any): Promise <any>  => {
   });
 }
 
+const fetchFacilityGroups = async (payload: any): Promise <any>  => {
+  return api({
+    url: `productStores/${payload.productStoreId}/facilityGroups`,
+    method: "GET"
+  });
+}
+
 export const UtilService = {
   fetchConfigFacilities,
+  fetchFacilityGroups,
   fetchFacets
 }
\ No newline at end of file
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index 9d52ea32..b1c800ca 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -1,4 +1,5 @@
 export default interface UtilState {
   configFacilities: any;
   appliedFilters: any;
+  facilityGroups: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index a775d0d6..2b95d196 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -28,6 +28,27 @@ const actions: ActionTree<UtilState, RootState> = {
     commit(types.UTIL_CONFIG_FACILITES_UPDATED, configFacilities)
   },
 
+  async fetchFacilityGroups ({ commit, state }) {
+    // let facilityGroups = JSON.parse(JSON.stringify(state.facilityGroups))
+
+    // if(facilityGroups.length) return;
+
+    let facilityGroups = {} as any;
+
+    try {
+      const resp = await UtilService.fetchFacilityGroups({ productStoreId: store.state.user.currentEComStore.productStoreId });
+
+      if(!hasError(resp)) {
+        facilityGroups = resp.data;
+      } else {
+        throw resp.data
+      }
+    } catch (err: any) {
+      logger.error(err)
+    }
+    commit(types.UTIL_FACILITY_GROUPS_UPDATED, facilityGroups)
+  },
+
   async updateAppliedFilters ({ commit, state }, payload) {
     commit(types.UTIL_APPLIED_FILTERS_UPDATED, payload)
   },
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 6c38ba9a..9e228ad5 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -9,6 +9,9 @@ const getters: GetterTree<UtilState, RootState> = {
   getAppliedFilters(state) {
     return state.appliedFilters;
   },
+  getFacilityGroups(state) {
+    return state.facilityGroups;
+  },
 }
 
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 96b8d892..4a3faff5 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -9,6 +9,7 @@ const utilModule: Module<UtilState, RootState> = {
   namespaced: true,
   state: {
     configFacilities: [],
+    facilityGroups: [],
     appliedFilters: {
       included: {
         tags: [],
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index dd1d4711..45362c81 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -2,4 +2,5 @@ export const SN_UTIL = 'util'
 export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDATED'
 export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
 export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
-export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
\ No newline at end of file
+export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
+export const UTIL_FACILITY_GROUPS_UPDATED = SN_UTIL + '/FACILITY_GROUPS_CLEARED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index 6d5ed654..b483e2aa 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -9,6 +9,9 @@ const mutations: MutationTree <UtilState> = {
   [types.UTIL_APPLIED_FILTERS_UPDATED] (state, payload) {
     state.appliedFilters = payload
   },
+  [types.UTIL_FACILITY_GROUPS_UPDATED] (state, payload) {
+    state.facilityGroups = payload
+  },
   [types.UTIL_CLEARED] (state) {
     state.configFacilities = [],
     state.appliedFilters = {
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 77f9a482..6845ee04 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -17,10 +17,10 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input :label="translate('Name')" />
+                <ion-input :label="translate('Name')" v-model="formData.ruleName" />
               </ion-item>
               <ion-item>
-                <ion-input :label="translate('Safety stock')" />
+                <ion-input :label="translate('Safety stock')" v-model="formData.safetyStock" />
               </ion-item>
             </div>
           </ion-card>
@@ -35,14 +35,14 @@
         <ion-card>
           <ion-item lines="none">
             <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
+            <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
             </ion-button>
           </ion-item>
           <ion-card-content>
-            <ion-chip outline>
-              {{ "Facility group name" }}
+            <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
+              {{ group.facilityGroupName }}
               <ion-icon :icon="closeCircle"/>
             </ion-chip>
           </ion-card-content>
@@ -51,14 +51,14 @@
         <ion-card>
           <ion-item lines="none"> 
             <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
+            <ion-button fill="clear" @click="openProductFacilityGroupModal('excluded')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
             </ion-button>
           </ion-item>
           <ion-card-content>
-            <ion-chip outline>
-              {{ "Facility group name" }}
+            <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
+              {{ group.facilityGroupName }}
               <ion-icon :icon="closeCircle"/>
             </ion-chip>
           </ion-card-content>
@@ -69,7 +69,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -77,8 +77,149 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonTitle, IonToolbar, modalController } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
+import { computed, onMounted, ref } from 'vue';
+import { useStore } from 'vuex';
+import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
+import { RuleService } from '@/services/RuleService';
+import { useRouter } from 'vue-router';
+import logger from '@/logger';
+import { showToast } from '@/utils';
+
+const router = useRouter();
+const store = useStore();
+
+const formData = ref({
+  ruleName: '',
+  SafetyStock: '',
+  selectedFacilityGroups: {
+    included: [],
+    excluded: []
+  }
+}) as any;
+
+const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
+const rules = computed(() => store.getters["rule/getRules"]);
+const total = computed(() => store.getters["rule/getTotalRulesCount"])
+const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+
+onMounted(async () => {
+  store.dispatch("util/clearAppliedFilters")
+  await store.dispatch("util/fetchFacilityGroups");
+})
+
+async function openProductFacilityGroupModal(type: string) {
+  const modal = await modalController.create({
+    component: AddProductFacilityGroupModal,
+    componentProps: {
+      type,
+      selectedFacilityGroups: formData.value.selectedFacilityGroups
+    }
+  })
+
+  modal.onDidDismiss().then((result: any) => {
+    if(result.data?.selectedGroups?.length) {
+      formData.value.selectedFacilityGroups[type] = result.data.selectedGroups
+    }
+  })
+
+  modal.present()
+}
+
+function generateRuleActions(ruleId: string) {
+  return [{
+    "ruleId": ruleId,
+    "actionTypeEnumId": "ATP_SAFETY_STOCK",
+    "fieldName": "facility-safety-stock",
+    "fieldValue": formData.value.safetyStock
+  }]
+}
+
+function generateRuleConditions(ruleId: string) {
+  const conditions = [];
+
+  const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
+  if(includedFacilityGroupIds?.length) {
+    conditions.push({
+      "ruleId": ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+      "fieldName": "facilities",
+      "operator": "in",
+      "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
+      "multiValued": includedFacilityGroupIds.length > 1 ? "Y" : "N"
+    })
+  }
+
+  const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
+  if(excludedFacilityGroupIds?.length) {
+    conditions.push({
+      "ruleId": ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+      "fieldName": "facilities",
+      "operator": "not-in",
+      "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
+      "multiValued": excludedFacilityGroupIds.length > 1 ? "Y" : "N"
+    })
+  }
+
+  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+    Object.entries(filters as any).map(([filter, value]: any) => {
+      if(value.length) {
+        conditions.push({
+          "ruleId": ruleId,
+          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+          "fieldName": filter,
+          "operator": type === "included" ? "in" : "not-in",
+          "fieldValue": value.length > 1 ? value.join(",") : value[0],
+          "multiValued": value.length > 1 ? "Y" : "N"
+        })
+      }
+    })
+  })
+
+  return conditions;
+}
+
+async function createRule() {
+  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_SAFETY_STOCK" });
+
+  try {
+    if(!ruleGroup.ruleGroupId) {
+      ruleGroup = await RuleService.createRuleGroup({
+        "groupTypeEnumId": "RG_SAFETY_STOCK",
+        "productStoreId": currentEComStore.value.productStoreId,
+        "statusId": "ATP_RG_ACTIVE"
+      })
+    }
+
+    const params = {
+      "ruleGroupId": ruleGroup.ruleGroupId,
+      "ruleName": formData.value.ruleName,
+      "statusId": "ATP_RULE_ACTIVE",
+      "sequenceNum": total.value ? rules.value[total.value-1].sequenceNum + 1 : 1
+    }
+
+    const rule = await RuleService.createRule(params)
+    console.log('update');
+    
+    
+    await RuleService.updateRule({
+      ...params,
+      "ruleConditions": generateRuleConditions(rule.ruleId) ? generateRuleConditions(rule.ruleId): [],
+      "ruleActions": generateRuleActions(rule.ruleId) ? generateRuleActions(rule.ruleId) : []
+    }, rule.ruleId);
+    
+    console.log('updated');
+    showToast(translate("Rule created successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
+    router.push("/safety-stock");
+  } catch(err: any) {
+    logger.error(err);
+    showToast(translate("Failed to create rule."))
+  }  
+}
 </script>
\ No newline at end of file
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index e232dfdf..8363e960 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -46,7 +46,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' })
   await store.dispatch("util/fetchConfigFacilities");
 })
 
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 3b839a69..782f9061 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -46,7 +46,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' })
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
   await store.dispatch("util/fetchConfigFacilities");
 })
 

From 361ec4be095e7b57cd8ae08058fd76e570a965b6 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 19 Apr 2024 11:38:04 +0530
Subject: [PATCH 062/250] Improved: payload for schedule Rule item (#255)

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

diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index 94083be4..cd638e65 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -69,7 +69,7 @@ async function saveSchedule() {
     const resp = await RuleService.scheduleRuleGroup(payload)
     if(!hasError(resp)) {
       showToast(translate("Service has been scheduled"))
-      await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
+      await store.dispatch('rule/fetchRules', { groupTypeEnumId: ruleGroup.value.groupTypeEnumId })
     } else {
       throw resp.data
     }

From 4a99178e58b914010e057e029e11aaa39499f0cc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 19 Apr 2024 15:09:05 +0530
Subject: [PATCH 063/250] Implemented: logic for creating a new safety stock
 rule (#255)

---
 src/components/RuleItem.vue         |   2 -
 src/views/CreateSafetyStockRule.vue |   3 -
 src/views/CreateStorePickupRule.vue | 206 +++++++++++++++++++++++++---
 src/views/StorePickup.vue           |  15 +-
 4 files changed, 192 insertions(+), 34 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 26154c5b..b9a5cb00 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -205,8 +205,6 @@ async function editSafetyStock() {
     {
       text: translate('Update'),
       handler: async (data) => {
-        console.log(data);
-        
         if(data.safetyStock) {
           const rule = JSON.parse(JSON.stringify(props.rule))
 
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 6845ee04..2c3b1d40 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -203,9 +203,6 @@ async function createRule() {
     }
 
     const rule = await RuleService.createRule(params)
-    console.log('update');
-    
-    
     await RuleService.updateRule({
       ...params,
       "ruleConditions": generateRuleConditions(rule.ruleId) ? generateRuleConditions(rule.ruleId): [],
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 791378d8..42e2bd7e 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -2,7 +2,7 @@
   <ion-page>
     <ion-header :translucent="true">
       <ion-toolbar>
-        <ion-back-button slot="start" default-href="/store-pickup" />
+        <ion-back-button slot="start" :default-href="getDefaultUrl()" />
         <ion-title>{{ translate("New store pickup rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
@@ -17,11 +17,11 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input :label="translate('Name')" />
+                <ion-input :label="translate('Name')" v-model="formData.ruleName" />
               </ion-item>
               <ion-item>
                 <ion-icon slot="start" :icon="storefrontOutline"/>
-                <ion-toggle>{{ translate("Store pickup") }}</ion-toggle>
+                <ion-toggle v-model="formData.isPickupAllowed">{{ translate("Store pickup") }}</ion-toggle>
               </ion-item>
             </div>
           </ion-card>
@@ -30,27 +30,27 @@
 
       <div class="section-header">
         <ion-segment v-model="selectedSegment">
-          <ion-segment-button value="facility">
+          <ion-segment-button value="RG_PICKUP_FACILITY">
             <ion-label>{{ translate("Facility") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="channel">
+          <ion-segment-button value="RG_PICKUP_CHANNEL">
             <ion-label>{{ translate("Channel") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
       </div>
 
-      <section v-if="selectedSegment === 'facility'">
+      <section v-if="selectedSegment === 'RG_PICKUP_FACILITY'">
         <ion-card>
           <ion-item lines="none">
             <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
+            <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
             </ion-button>
           </ion-item>
           <ion-card-content>
-            <ion-chip outline>
-              {{ "Facility group name" }}
+            <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
+              {{ group.facilityGroupName }}
               <ion-icon :icon="closeCircle"/>
             </ion-chip>
           </ion-card-content>
@@ -59,14 +59,14 @@
         <ion-card>
           <ion-item lines="none"> 
             <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
+            <ion-button fill="clear" @click="openProductFacilityGroupModal('excluded')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
             </ion-button>
           </ion-item>
           <ion-card-content>
-            <ion-chip outline>
-              {{ "Facility group name" }}
+            <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
+              {{ group.facilityGroupName }}
               <ion-icon :icon="closeCircle"/>
             </ion-chip>
           </ion-card-content>
@@ -74,13 +74,13 @@
       </section>
 
       <section v-else>
-        <ion-card >
+        <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
           <ion-card-header>
             <div>
-              <ion-card-title>{{ "Facility Name" }}</ion-card-title>
-              <ion-card-subtitle>{{ "Facility ID" }}</ion-card-subtitle>
+              <ion-card-title>{{ facility.facilityName }}</ion-card-title>
+              <ion-card-subtitle>{{ facility.facilityId }}</ion-card-subtitle>
             </div>
-            <ion-checkbox />
+            <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
           </ion-card-header>
         </ion-card>
       </section>
@@ -89,7 +89,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -97,13 +97,179 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToggle, IonToolbar } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
-import { ref } from 'vue';
+import { computed, onMounted, ref } from 'vue';
 import ProductFilters from '@/components/ProductFilters.vue';
+import { useRouter } from 'vue-router';
+import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
+import { useStore } from 'vuex';
+import { RuleService } from '@/services/RuleService';
+import { showToast } from '@/utils';
+import logger from '@/logger';
+
+const store = useStore();
+const router = useRouter();
+const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId)
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
+const appliedFilters = computed(() => store.getters["util/getAppliedFilters"])
+const rules = computed(() => store.getters["rule/getRules"]);
+const total = computed(() => store.getters["rule/getTotalRulesCount"])
+const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+
+const formData = ref({
+  ruleName: '',
+  isPickupAllowed: false,
+  selectedFacilityGroups: {
+    included: [],
+    excluded: []
+  },
+  selectedConfigFacilites: []
+}) as any;
+
+onMounted(async () => {
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
+function getDefaultUrl() {
+  return `store-pickup?groupTypeEnumId=${selectedSegment.value}`
+}
+
+async function openProductFacilityGroupModal(type: string) {
+  const modal = await modalController.create({
+    component: AddProductFacilityGroupModal,
+    componentProps: {
+      type,
+      selectedFacilityGroups: formData.value.selectedFacilityGroups
+    }
+  })
+
+  modal.onDidDismiss().then((result: any) => {
+    if(result.data?.selectedGroups?.length) {
+      formData.value.selectedFacilityGroups[type] = result.data.selectedGroups
+    }
+  })
+
+  modal.present()
+}
+
+function toggleFacilitySelection(facilityId: any) {
+  if(isFacilitySelected(facilityId)) {
+    formData.value.selectedConfigFacilites = formData.value.selectedConfigFacilites.filter((currentFacilityId: string) => currentFacilityId !== facilityId)
+  } else {
+    formData.value.selectedConfigFacilites.push(facilityId)
+  }
+}
+
+function isFacilitySelected(facilityId: any) {
+  return formData.value.selectedConfigFacilites.includes(facilityId)
+}
+
+async function createRule() {
+  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
+
+  try {
+    if(!ruleGroup.ruleGroupId) {
+      ruleGroup = await RuleService.createRuleGroup({
+        "groupTypeEnumId": selectedSegment.value,
+        "productStoreId": currentEComStore.value.productStoreId,
+        "statusId": "ATP_RG_ACTIVE"
+      })
+    }
+
+    const params = {
+      "ruleGroupId": ruleGroup.ruleGroupId,
+      "ruleName": formData.value.ruleName,
+      "statusId": "ATP_RULE_ACTIVE",
+      "sequenceNum": total.value ? rules.value[total.value-1].sequenceNum + 1 : 1
+    }
+
+    const rule = await RuleService.createRule(params)
+    await RuleService.updateRule({
+      ...params,
+      "ruleConditions": generateRuleConditions(rule.ruleId) ? generateRuleConditions(rule.ruleId): [],
+      "ruleActions": generateRuleActions(rule.ruleId) ? generateRuleActions(rule.ruleId) : []
+    }, rule.ruleId);
+
+    showToast(translate("Rule created successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
+    router.push(getDefaultUrl());
+  } catch(err: any) {
+    logger.error(err);
+    showToast(translate("Failed to create rule."))
+  }
+}
+
+function generateRuleActions(ruleId: string) {
+  return [{
+    "ruleId": ruleId,
+    "actionTypeEnumId": "ATP_ALLOW_PICKUP",
+    "fieldName": "allow-pickup",
+    "fieldValue": formData.value.isPickupAllowed ? 'Y' : 'N'
+  }]
+}
+
+function generateRuleConditions(ruleId: string) {
+  const conditions = [];
+
+  if(selectedSegment.value === 'RG_PICKUP_FACILITY') {
+    const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
+    if(includedFacilityGroupIds?.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+        "fieldName": "facilities",
+        "operator": "in",
+        "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
+        "multiValued": includedFacilityGroupIds.length > 1 ? "Y" : "N"
+      })
+    }
+
+    const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
+    if(excludedFacilityGroupIds?.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+        "fieldName": "facilities",
+        "operator": "not-in",
+        "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
+        "multiValued": excludedFacilityGroupIds.length > 1 ? "Y" : "N"
+      })
+    }
+  } else {
+    const selectedFacilites = formData.value.selectedConfigFacilites
+    if(selectedFacilites?.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
+        "fieldName": "facilities",
+        "operator": "in",
+        "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
+        "multiValued": selectedFacilites.length > 1 ? "Y" : "N"
+      })
+    }
+  }
+
+  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+    Object.entries(filters as any).map(([filter, value]: any) => {
+      if(value.length) {
+        conditions.push({
+          "ruleId": ruleId,
+          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+          "fieldName": filter,
+          "operator": type === "included" ? "in" : "not-in",
+          "fieldValue": value.length > 1 ? value.join(",") : value[0],
+          "multiValued": value.length > 1 ? "Y" : "N"
+        })
+      }
+    })
+  })
+
+  return conditions;
+}
 
-const selectedSegment = ref("facility")
 </script>
 
 <style scoped>
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 26277191..014cb076 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -8,10 +8,10 @@
 
       <ion-toolbar>
         <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()">
-          <ion-segment-button value="productAndFacility">
+          <ion-segment-button value="RG_PICKUP_FACILITY">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="productAndChannel">
+          <ion-segment-button value="RG_PICKUP_CHANNEL">
             <ion-label>{{ translate("Product and channel") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="facility">
@@ -59,27 +59,24 @@ import { useRouter } from 'vue-router';
 import { useStore } from 'vuex';
 import { computed, onMounted } from 'vue';
 
-const selectedSegment = ref("productAndFacility")
 const store = useStore();
 const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
+const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
+
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' })
   await store.dispatch("util/fetchConfigFacilities");
 })
 
 async function updateRuleGroup() {
-  if(selectedSegment.value === 'productAndChannel') {
-    await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_CHANNEL'})
-  } else {
-    await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY'})
-  }
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
 }
 
 function createStorePickup() {
-  router.replace({ path: '/create-store-pickup' })
+  router.replace({ path: '/create-store-pickup', query: { groupTypeEnumId: selectedSegment.value } })
 }
 </script>
\ No newline at end of file

From 7389a88aae79becf354c45eeb95dc9fbeb8d56c8 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 19 Apr 2024 16:36:15 +0530
Subject: [PATCH 064/250] Improved: code to update store pickup status, and
 logic to fetch rules based on groupTypeId (#255)

---
 .../AddProductFacilityGroupModal.vue          |  2 +-
 src/components/RuleItem.vue                   | 65 ++++++++++++-------
 src/services/RuleService.ts                   |  2 +-
 src/views/StorePickup.vue                     |  4 +-
 4 files changed, 46 insertions(+), 27 deletions(-)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index 5b40d68b..ed36ae20 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -6,7 +6,7 @@
           <ion-icon slot="icon-only" :icon="arrowBackOutline" />
         </ion-button>
       </ion-buttons>
-      <ion-title>{{ type === "included" ? translate("Include facility group") : translate("Exclude facility group") }}</ion-title>
+      <ion-title>{{ type === "included" ? translate("Include facility groups") : translate("Exclude facility groups") }}</ion-title>
     </ion-toolbar>
   </ion-header>
 
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index b9a5cb00..572a54d7 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -26,9 +26,9 @@
       <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
       <ion-chip slot="end" outline @click="editSafetyStock()">{{ rule.ruleActions?.length ? rule.ruleActions[0].fieldValue : '-' }}</ion-chip>
     </ion-item>
-    <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">Fixed the positioning of the security group displayed for the loggedin user.
+    <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">
       <ion-icon slot="start" :icon="storefrontOutline"/>
-      <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
+      <ion-toggle :checked="props.rule.ruleActions[0].fieldValue" @click.prevent="updateRulePickup($event)">{{ translate(selectedPage.name) }}</ion-toggle>
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
       <ion-icon slot="start" :icon="sendOutline"/>
@@ -36,7 +36,7 @@
     </ion-item>
 
     <ion-list>
-      <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'productAndChannel'">
+      <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL'">
         <ion-item-divider color="light">
           <ion-label>{{ translate("Channels") }}</ion-label>
           <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()">
@@ -80,23 +80,21 @@
         <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
       </ion-item>
 
-      <template v-if="(selectedPage.path === '/threshold' || selectedPage.path === '/safety-stock')">
-        <ion-item-divider color="light">
-          <ion-label>{{ translate("Product features") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium"  @click="openUpdateProductFiltersModal('product features', 'productFeaturesFacet', 'productFeatures')">
-            <ion-icon :icon="optionsOutline" slot="icon-only" />
-          </ion-button>
-        </ion-item-divider>
+      <ion-item-divider color="light">
+        <ion-label>{{ translate("Product features") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium"  @click="openUpdateProductFiltersModal('product features', 'productFeaturesFacet', 'productFeatures')">
+          <ion-icon :icon="optionsOutline" slot="icon-only" />
+        </ion-button>
+      </ion-item-divider>
 
-        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
-          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
-        </ion-item>
-        <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
-          <ion-icon slot="start" :icon="closeCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
-        </ion-item>
-      </template>
+      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
+        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
+      </ion-item>
+      <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
+        <ion-icon slot="start" :icon="closeCircleOutline"/>
+        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
+      </ion-item>
 
       <ion-item lines="none">
         <ion-button @click="editRuleName()" fill="clear">{{ translate("Edit name") }}</ion-button>
@@ -116,7 +114,7 @@ import { useRouter } from 'vue-router';
 import { translate } from '@/i18n';
 import { RuleService } from '@/services/RuleService';
 import { useStore } from 'vuex';
-import { showToast } from '@/utils';
+import { hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
 import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModal.vue';
@@ -240,7 +238,7 @@ async function editRuleName() {
   const alert = await alertController.create({
     header: translate("Edit name"),
     inputs: [{
-      name: "safetyStock",
+      name: "name",
       placeholder: translate("Name"),
       type: "text",
       value: props.rule.ruleName
@@ -252,9 +250,9 @@ async function editRuleName() {
     {
       text: translate('Update'),
       handler: async(data) => {
-        if(data.safetyStock) {
+        if(data.name) {
           const rule = JSON.parse(JSON.stringify(props.rule))
-          rule.ruleName = data.safetyStock
+          rule.ruleName = data.name
 
           try {
             await RuleService.updateRule(rule, props.rule.ruleId)
@@ -383,6 +381,27 @@ async function openUpdateProductFiltersModal(label: string, facetToSelect: strin
 
   modal.present()
 }
+
+async function updateRulePickup(event: any) {
+  event.stopImmediatePropagation();
+  const isChecked = !event.target.checked
+  console.log(isChecked);
+  
+  try {
+    const rule = JSON.parse(JSON.stringify(props.rule))
+    rule.ruleActions.map((action: any) => {
+      if(action.actionTypeEnumId === "ATP_ALLOW_PICKUP") action.fieldValue = isChecked
+    })
+
+    await RuleService.updateRule(rule, props.rule.ruleId)
+    showToast(translate("Rule pickup updated successfully."))
+    await store.dispatch('rule/updateRuleData', { rule })
+    event.target.checked = isChecked
+  } catch(err) {
+    logger.error(err)
+    showToast(translate("Failed to update rule pickup."))
+  }
+}
 </script>
 
 <style scoped>
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index a642a6b1..e614537e 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -69,7 +69,7 @@ const updateRule = async (payload: any, ruleId: string): Promise <any>  => {
     }) as any;
     
     if(!hasError(resp)) {
-      return Promise.resolve(resp.data)
+      return Promise.resolve(resp)
     } else {
       throw resp.data
     }
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 014cb076..968f57e0 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -25,7 +25,7 @@
       <main v-if="ruleGroup.ruleGroupId">
         <ScheduleRuleItem v-if="selectedSegment !== 'facility'" />
 
-        <section v-if="selectedSegment === 'productAndFacility' || selectedSegment === 'productAndChannel'">
+        <section v-if="selectedSegment === 'RG_PICKUP_FACILITY' || selectedSegment === 'RG_PICKUP_CHANNEL'">
           <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
         <section v-else>
@@ -65,7 +65,7 @@ const router = useRouter()
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
-const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
+const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_CHANNEL")
 
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' })

From c0898946b0ed47733b1176b23e64559128dfb4c4 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 19 Apr 2024 18:04:57 +0530
Subject: [PATCH 065/250] Improved: code to render created shipping rule (#255)

---
 src/components/RuleItem.vue      |  31 ++++-
 src/views/CreateShippingRule.vue | 205 ++++++++++++++++++++++++++++---
 src/views/Shipping.vue           |  25 ++--
 src/views/StorePickup.vue        |   2 +-
 4 files changed, 223 insertions(+), 40 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 572a54d7..2597f229 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -32,11 +32,11 @@
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
       <ion-icon slot="start" :icon="sendOutline"/>
-      <ion-toggle>{{ translate(selectedPage.name) }}</ion-toggle>
+      <ion-toggle :checked="props.rule.ruleActions[0].fieldValue" @click.prevent="updateRuleShipping($event)">{{ translate(selectedPage.name) }}</ion-toggle>
     </ion-item>
 
     <ion-list>
-      <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL'">
+      <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL' || selectedSegment === 'RG_SHIPPING_CHANNEL'">
         <ion-item-divider color="light">
           <ion-label>{{ translate("Channels") }}</ion-label>
           <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()">
@@ -364,8 +364,8 @@ async function openUpdateFacilityGroupModal() {
 }
 
 function isRuleConditionAvailable(conditionTypeEnumId: string, fieldName?: string, operator? : string) {
-  if(fieldName) return props.rule.ruleConditions?.some((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)
-  else return props.rule.ruleConditions?.some((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId) 
+  if(fieldName) return props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)?.fieldValue
+  else return props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)?.fieldValue
 }
 
 async function openUpdateProductFiltersModal(label: string, facetToSelect: string, searchfield: string) {
@@ -384,8 +384,7 @@ async function openUpdateProductFiltersModal(label: string, facetToSelect: strin
 
 async function updateRulePickup(event: any) {
   event.stopImmediatePropagation();
-  const isChecked = !event.target.checked
-  console.log(isChecked);
+  const isChecked = !event.target.checked;
   
   try {
     const rule = JSON.parse(JSON.stringify(props.rule))
@@ -402,6 +401,26 @@ async function updateRulePickup(event: any) {
     showToast(translate("Failed to update rule pickup."))
   }
 }
+
+async function updateRuleShipping(event: any) {
+  event.stopImmediatePropagation();
+  const isChecked = !event.target.checked;
+
+  try {
+    const rule = JSON.parse(JSON.stringify(props.rule))
+    rule.ruleActions.map((action: any) => {
+      if(action.actionTypeEnumId === "ATP_ALLOW_BROKERING") action.fieldValue = isChecked
+    })
+
+    await RuleService.updateRule(rule, props.rule.ruleId)
+    showToast(translate("Rule shipping updated successfully."))
+    await store.dispatch('rule/updateRuleData', { rule })
+    event.target.checked = isChecked
+  } catch(err) {
+    logger.error(err)
+    showToast(translate("Failed to update rule brokering."))
+  }
+}
 </script>
 
 <style scoped>
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 9b2d5189..07933c13 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -2,7 +2,7 @@
   <ion-page>
     <ion-header :translucent="true">
       <ion-toolbar>
-        <ion-back-button slot="start" default-href="/shipping" />
+        <ion-back-button slot="start" :default-href="getDefaultUrl()" />
         <ion-title>{{ translate("New shipping rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
@@ -17,11 +17,11 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input label="Name" />
+                <ion-input label="Name" v-model="formData.ruleName" />
               </ion-item>
               <ion-item>
                 <ion-icon slot="start" :icon="storefrontOutline"/>
-                <ion-toggle>{{ translate("Shipping") }}</ion-toggle>
+                <ion-toggle v-model="formData.isBrokeringAllowed">{{ translate("Shipping") }}</ion-toggle>
               </ion-item>
             </div>
           </ion-card>
@@ -30,27 +30,27 @@
       
       <div class="section-header">
         <ion-segment v-model="selectedSegment">
-          <ion-segment-button value="facility">
+          <ion-segment-button value="RG_SHIPPING_FACILITY">
             <ion-label>{{ translate("Facility") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="channel">
+          <ion-segment-button value="RG_SHIPPING_CHANNEL">
             <ion-label>{{ translate("Channel") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
       </div>
 
-      <section v-if="selectedSegment === 'facility'">
+      <section v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">
         <ion-card>
           <ion-item lines="none">
             <ion-label>{{ translate("Included") }}</ion-label>
-            <ion-button fill="clear">
+            <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
             </ion-button>
           </ion-item>
           <ion-card-content>
-            <ion-chip outline>
-              {{ "Facility group name" }}
+            <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
+              {{ group.facilityGroupName }}
               <ion-icon :icon="closeCircle"/>
             </ion-chip>
           </ion-card-content>
@@ -59,14 +59,14 @@
         <ion-card>
           <ion-item lines="none"> 
             <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear">
+            <ion-button fill="clear" @click="openProductFacilityGroupModal('excluded')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
             </ion-button>
           </ion-item>
           <ion-card-content>
-            <ion-chip outline>
-              {{ "Facility group name" }}
+            <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
+              {{ group.facilityGroupName }}
               <ion-icon :icon="closeCircle"/>
             </ion-chip>
           </ion-card-content>
@@ -74,13 +74,13 @@
       </section>
 
       <section v-else>
-        <ion-card >
+        <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
           <ion-card-header>
             <div>
-              <ion-card-title>{{ "Facility Name" }}</ion-card-title>
-              <ion-card-subtitle>{{ "Facility ID" }}</ion-card-subtitle>
+              <ion-card-title>{{ facility.facilityName }}</ion-card-title>
+              <ion-card-subtitle>{{ facility.facilityId }}</ion-card-subtitle>
             </div>
-            <ion-checkbox />
+            <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
           </ion-card-header>
         </ion-card>
       </section>
@@ -89,7 +89,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -97,13 +97,178 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToggle, IonToolbar } from '@ionic/vue';
-import { ref } from 'vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
+import { computed, onMounted, ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
+import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
+import { useStore } from 'vuex';
+import { RuleService } from '@/services/RuleService';
+import { showToast } from '@/utils';
+import logger from '@/logger';
+import { useRouter } from 'vue-router';
 
-const selectedSegment = ref("facility")
+const store = useStore();
+const router = useRouter();
+const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId)
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
+const appliedFilters = computed(() => store.getters["util/getAppliedFilters"])
+const rules = computed(() => store.getters["rule/getRules"]);
+const total = computed(() => store.getters["rule/getTotalRulesCount"])
+const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+
+const formData = ref({
+  ruleName: '',
+  isBrokeringAllowed: false,
+  selectedFacilityGroups: {
+    included: [],
+    excluded: []
+  },
+  selectedConfigFacilites: []
+}) as any;
+
+onMounted(async () => {
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
+function getDefaultUrl() {
+  return `shipping?groupTypeEnumId=${selectedSegment.value}`
+}
+
+async function openProductFacilityGroupModal(type: string) {
+  const modal = await modalController.create({
+    component: AddProductFacilityGroupModal,
+    componentProps: {
+      type,
+      selectedFacilityGroups: formData.value.selectedFacilityGroups
+    }
+  })
+
+  modal.onDidDismiss().then((result: any) => {
+    if(result.data?.selectedGroups?.length) {
+      formData.value.selectedFacilityGroups[type] = result.data.selectedGroups
+    }
+  })
+
+  modal.present()
+}
+
+function toggleFacilitySelection(facilityId: any) {
+  if(isFacilitySelected(facilityId)) {
+    formData.value.selectedConfigFacilites = formData.value.selectedConfigFacilites.filter((currentFacilityId: string) => currentFacilityId !== facilityId)
+  } else {
+    formData.value.selectedConfigFacilites.push(facilityId)
+  }
+}
+
+function isFacilitySelected(facilityId: any) {
+  return formData.value.selectedConfigFacilites.includes(facilityId)
+}
+
+async function createRule() {
+  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
+
+  try {
+    if(!ruleGroup.ruleGroupId) {
+      ruleGroup = await RuleService.createRuleGroup({
+        "groupTypeEnumId": selectedSegment.value,
+        "productStoreId": currentEComStore.value.productStoreId,
+        "statusId": "ATP_RG_ACTIVE"
+      })
+    }
+
+    const params = {
+      "ruleGroupId": ruleGroup.ruleGroupId,
+      "ruleName": formData.value.ruleName,
+      "statusId": "ATP_RULE_ACTIVE",
+      "sequenceNum": total.value ? rules.value[total.value-1].sequenceNum + 1 : 1
+    }
+
+    const rule = await RuleService.createRule(params)
+    await RuleService.updateRule({
+      ...params,
+      "ruleConditions": generateRuleConditions(rule.ruleId) ? generateRuleConditions(rule.ruleId): [],
+      "ruleActions": generateRuleActions(rule.ruleId) ? generateRuleActions(rule.ruleId) : []
+    }, rule.ruleId);
+
+    showToast(translate("Rule created successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
+    router.push(getDefaultUrl());
+  } catch(err: any) {
+    logger.error(err);
+    showToast(translate("Failed to create rule."))
+  }
+}
+
+function generateRuleActions(ruleId: string) {
+  return [{
+    "ruleId": ruleId,
+    "actionTypeEnumId": "ATP_ALLOW_BROKERING",
+    "fieldName": "allow-brokering",
+    "fieldValue": formData.value.isBrokeringAllowed ? 'Y' : 'N'
+  }]
+}
+
+function generateRuleConditions(ruleId: string) {
+  const conditions = [];
+
+  if(selectedSegment.value === 'RG_SHIPPING_FACILITY') {
+    const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
+    if(includedFacilityGroupIds?.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+        "fieldName": "facilityGroups",
+        "operator": "in",
+        "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
+        "multiValued": includedFacilityGroupIds.length > 1 ? "Y" : "N"
+      })
+    }
+
+    const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
+    if(excludedFacilityGroupIds?.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+        "fieldName": "facilityGroups",
+        "operator": "not-in",
+        "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
+        "multiValued": excludedFacilityGroupIds.length > 1 ? "Y" : "N"
+      })
+    }
+  } else {
+    const selectedFacilites = formData.value.selectedConfigFacilites
+    if(selectedFacilites?.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
+        "fieldName": "facilities",
+        "operator": "in",
+        "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
+        "multiValued": selectedFacilites.length > 1 ? "Y" : "N"
+      })
+    }
+  }
+
+  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+    Object.entries(filters as any).map(([filter, value]: any) => {
+      if(value.length) {
+        conditions.push({
+          "ruleId": ruleId,
+          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+          "fieldName": filter,
+          "operator": type === "included" ? "in" : "not-in",
+          "fieldValue": value.length > 1 ? value.join(",") : value[0],
+          "multiValued": value.length > 1 ? "Y" : "N"
+        })
+      }
+    })
+  })
+
+  return conditions;
+}
 </script>
 
 <style scoped>
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 0609291f..93c9966b 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -8,10 +8,10 @@
 
       <ion-toolbar>
         <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()">
-          <ion-segment-button value="productAndFacility">
+          <ion-segment-button value="RG_SHIPPING_FACILITY">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="productAndChannel">
+          <ion-segment-button value="RG_SHIPPING_CHANNEL">
             <ion-label>{{ translate("Product and channel") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="facility">
@@ -25,7 +25,7 @@
       <main v-if="ruleGroup.ruleGroupId">
         <ScheduleRuleItem v-if="selectedSegment !== 'facility'" />
 
-        <section v-if="selectedSegment === 'productAndFacility' || selectedSegment === 'productAndChannel'">
+        <section v-if="selectedSegment !== 'facility'">
           <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
         <section v-else>
@@ -35,7 +35,7 @@
       </main>
 
       <div class="empty-state" v-else>
-        <p>{{ translate("No store pickup rules found") }}</p>
+        <p>{{ translate("No shipping rules found") }}</p>
       </div>
     </ion-content>
 
@@ -59,28 +59,27 @@ import { useRouter } from 'vue-router';
 import { useStore } from 'vuex';
 import { computed, onMounted } from 'vue';
 
-const selectedSegment = ref("productAndFacility")
-
 const store = useStore();
 const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
+console.log(router.currentRoute.value);
+
+
+const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY")
+
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SHIPPING_FACILITY' })
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" })
   await store.dispatch("util/fetchConfigFacilities");
 })
 
 async function updateRuleGroup() {
-  if(selectedSegment.value === 'productAndChannel') {
-    await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_CHANNEL'})
-  } else {
-    await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY'})
-  }
+  await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
 }
 
 function createShipping() {
-  router.replace({ path: '/create-shipping' })
+  router.replace({ path: '/create-shipping', query: { groupTypeEnumId: selectedSegment.value } })
 }
 </script>
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 968f57e0..9c547e39 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -65,7 +65,7 @@ const router = useRouter()
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
-const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_CHANNEL")
+const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
 
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' })

From 483b9c62a5e93508af1e1f52c5ccd4c5be9294de Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 10:38:42 +0530
Subject: [PATCH 066/250] Improved: logic to render included and excluded
 facility groups (#255)

---
 src/components/RuleItem.vue         | 36 ++++++++++++++++-------------
 src/views/CreateSafetyStockRule.vue |  3 +--
 src/views/Shipping.vue              |  3 ---
 3 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 2597f229..ad28b838 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -60,7 +60,11 @@
         
         <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS')" lines="none">
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS") }}</ion-label>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
+        </ion-item>
+        <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS')">
+          <ion-icon slot="start" :icon="closeCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "not-in") }}</ion-label>
         </ion-item>
       </template>
 
@@ -276,26 +280,26 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
 
   if(fieldName && operator) {
     const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)
-    return condition?.fieldValue?.split(",").join(", ")
-  } else {
-    const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)
-
-    if(condition && condition.fieldValue) {
-      if(conditionTypeEnumId === 'ENTCT_ATP_FACILITIES') {
-        let facilities = condition?.fieldValue.split(",")
-        facilities = facilities.map((id: string) => {
-          let facility = configFacilities.value.find((facility: any) => facility.facilityId === id)
-          return facility ? facility.facilityName : null
-        })
-        return facilities.join(", ")
-      } else {
-        let facilityGroupIds = condition?.fieldValue.split(",")
+    if(condition && conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS') {
+      let facilityGroupIds = condition?.fieldValue.split(",")
         facilityGroupIds = facilityGroupIds.map((id: string) => {
           let group = facilityGroups.value.find((group: any) => group.facilityGroupId === id)
           return group ? group.facilityGroupName : null
         })
         return facilityGroupIds.join(", ")
-      }
+    } else {
+      return condition?.fieldValue?.split(",").join(", ")
+    }
+  } else {
+    const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)
+
+    if(condition && condition.fieldValue) {
+      let facilities = condition?.fieldValue.split(",")
+      facilities = facilities.map((id: string) => {
+        let facility = configFacilities.value.find((facility: any) => facility.facilityId === id)
+        return facility ? facility.facilityName : null
+      })
+      return facilities.join(", ")
     }
   }
 }
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 2c3b1d40..815a439b 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -208,8 +208,7 @@ async function createRule() {
       "ruleConditions": generateRuleConditions(rule.ruleId) ? generateRuleConditions(rule.ruleId): [],
       "ruleActions": generateRuleActions(rule.ruleId) ? generateRuleActions(rule.ruleId) : []
     }, rule.ruleId);
-    
-    console.log('updated');
+
     showToast(translate("Rule created successfully."))
     store.dispatch("rule/clearRuleState")
     store.dispatch("util/clearAppliedFilters")
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 93c9966b..8cefe8b8 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -65,9 +65,6 @@ const router = useRouter()
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
-console.log(router.currentRoute.value);
-
-
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY")
 
 onMounted(async() => {

From 83ee85350f07c44183889b6f6aee7ca6f825be5d Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 11:05:14 +0530
Subject: [PATCH 067/250] Implemented: centralized modal for updating facility
 groups associated to rules (#255)

---
 src/components/RuleItem.vue                 |   3 +-
 src/components/UpdateFacilityGroupModal.vue | 133 +++++++++++++-------
 src/store/index.ts                          |   2 +-
 3 files changed, 88 insertions(+), 50 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index ad28b838..529ad32e 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -359,8 +359,7 @@ async function openUpdateFacilityGroupModal() {
   const modal = await modalController.create({
     component: UpdateFacilityGroupModal,
     componentProps: {
-      rule: props.rule,
-      selectedFacilityGroupIds: getSelectedFacilityGroups()
+      rule: props.rule
     },
   })
 
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index 133e1999..cf87308b 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -2,38 +2,48 @@
   <ion-header>
     <ion-toolbar>
       <ion-buttons slot="start">
-        <ion-button @click="closeModal"> 
-          <ion-icon slot="icon-only" :icon="closeOutline" />
+        <ion-button @click="closeModal">
+          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
         </ion-button>
       </ion-buttons>
-      <ion-title>{{ translate("Select facilities") }}</ion-title>
+      <ion-title>{{ translate("Select facility groups") }}</ion-title>
     </ion-toolbar>
   </ion-header>
 
   <ion-content>
+    <ion-segment v-model="selectedSegment">
+      <ion-segment-button value="included">
+        <ion-label>{{ translate("Included") }}</ion-label>
+      </ion-segment-button>
+      <ion-segment-button value="excluded">
+        <ion-label>{{ translate("Excluded") }}</ion-label>
+      </ion-segment-button>
+    </ion-segment>
+
     <ion-list>
-      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId">
-        <ion-checkbox :checked="isSelected(group.facilityGroupId)" @ionChange="toggleFacilityGroupSelection(group)">
-          <ion-label>
-            {{ group.facilityGroupName }}
-            <p>{{ group.facilityGroupId }}</p>
-          </ion-label>
+      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId" @click="!isAlreadyApplied(group.facilityGroupId) ? updateSelectedValues(group.facilityGroupId): ''">
+        <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName }}</ion-label>
+        <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isSelected(group.facilityGroupId)">
+          {{ group.facilityGroupName }}
         </ion-checkbox>
+        <ion-note v-else slot="end" color="danger">{{ selectedSegment === 'included' ? translate("excluded") : translate("included") }}</ion-note>
       </ion-item>
     </ion-list>
 
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="saveFacilities()">
-        <ion-icon :icon="saveOutline" />  
+    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
+    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button @click="saveFilters()">
+        <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
   </ion-content>
 </template>
-  
+
 <script setup lang="ts">
+import { computed, onMounted } from "vue";
 import {
-  IonButtons,
   IonButton,
+  IonButtons,
   IonCheckbox,
   IonContent,
   IonFab,
@@ -43,78 +53,107 @@ import {
   IonItem,
   IonLabel,
   IonList,
+  IonNote,
+  IonSegment,
+  IonSegmentButton,
   IonTitle,
   IonToolbar,
   modalController
 } from "@ionic/vue";
-import { computed, defineProps, onMounted } from "vue";
-import { closeOutline, saveOutline } from "ionicons/icons";
+import { arrowBackOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
-import { translate } from "@/i18n";
 import { RuleService } from "@/services/RuleService";
+import { defineProps, ref } from "vue";
+import { translate } from "@/i18n";
 import { showToast } from "@/utils";
 import logger from "@/logger";
 
+const selectedSegment = ref("included")
+const includedFilters = ref([]) as any;
+const excludedFilters = ref([]) as any;
+
+const props = defineProps(["rule"]);
 const store = useStore();
-const props = defineProps(["rule", "selectedFacilityGroupIds"])
 
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
-let selectedFacilityGroupIds = JSON.parse(JSON.stringify(props.selectedFacilityGroupIds))
 
 onMounted(async () => {
-  await store.dispatch("util/fetchConfigFacilities");
+  console.log('enterd');
+  
+  await store.dispatch("util/fetchFacilityGroups");
+  const includedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'in')
+  if(includedCondition && includedCondition.fieldValue) includedFilters.value = includedCondition.fieldValue.split(",");
+
+  const excludedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'not-in')
+  if(excludedCondition && excludedCondition.fieldValue) excludedFilters.value = excludedCondition.fieldValue.split(",");
 })
 
-async function closeModal() {
+function closeModal() {
   modalController.dismiss({ dismissed: true });
 }
 
-async function toggleFacilityGroupSelection(updatedGroup: any) {
-  const selectedGroup = selectedFacilityGroupIds.some((groupId: any) => groupId === updatedGroup.facilityGroupId);
-  if(selectedGroup) {
-    selectedFacilityGroupIds = selectedFacilityGroupIds.filter((groupId: any) => groupId !== updatedGroup.facilityGroupId);
-  } else {
-    selectedFacilityGroupIds.push(updatedGroup.facilityGroupId);
+function updateSelectedValues(value: string) {
+  if(selectedSegment.value === 'included') {
+    if(includedFilters.value.includes(value)) includedFilters.value.splice(includedFilters.value.indexOf(value), 1)
+    else includedFilters.value.push(value)
+  } 
+  else {
+    if(excludedFilters.value.includes(value)) excludedFilters.value.splice(excludedFilters.value.indexOf(value), 1)
+    else excludedFilters.value.push(value) 
   }
 }
 
-function isSelected(currentGroupId: any) {
-  return selectedFacilityGroupIds.some((groupId: any) => groupId === currentGroupId);
+function isAlreadyApplied(value: string) {
+  if(selectedSegment.value === 'included') return excludedFilters.value.includes(value);
+  else return includedFilters.value.includes(value);
 }
 
-async function saveFacilities() {  
+function isSelected(value: string) {
+  if(selectedSegment.value === 'included') return includedFilters.value.includes(value);
+  else return excludedFilters.value.includes(value);
+}
+
+async function saveFilters() {
   const rule = JSON.parse(JSON.stringify(props.rule))
 
   if(!rule.ruleConditions) rule.ruleConditions = []
 
-  const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS")
-  if(condition) {
-    condition.fieldValue = selectedFacilityGroupIds.join(",")
+  const includeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'in')
+  if(includeCondition) {
+    includeCondition.fieldValue = includedFilters.value.join(",")
   } else {
     rule.ruleConditions.push({
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilityGroupId",
-      "operator": "in",
-      "fieldValue": selectedFacilityGroupIds.length > 1 ? selectedFacilityGroupIds.join(",") : selectedFacilityGroupIds[0],
-      "multiValued": selectedFacilityGroupIds.length > 1 ? "Y" : "N"
+      "fieldName": "facilityGroups",
+      "operator": selectedSegment.value === "included" ? "in" : "not-in",
+      "fieldValue": includedFilters.value?.length > 1 ? includedFilters.value.join(",") : includedFilters.value[0],
+      "multiValued": includedFilters.value?.length > 1 ? "Y" : "N"
+    })
+  }
+
+  const excludeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'not-in')
+  if(excludeCondition) {
+    excludeCondition.fieldValue = excludedFilters.value.join(",")
+  } else {
+    rule.ruleConditions.push({
+      "ruleId": rule.ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+      "fieldName": "facilityGroups",
+      "operator": selectedSegment.value === "included" ? "in" : "not-in",
+      "fieldValue": excludedFilters.value?.length > 1 ? excludedFilters.value.join(",") : excludedFilters.value[0],
+      "multiValued": excludedFilters.value?.length > 1 ? "Y" : "N"
     })
   }
 
   try {
     await RuleService.updateRule(rule, rule.ruleId)
     await store.dispatch('rule/updateRuleData', { rule })
-    showToast(translate("Facility groups updated successfully."))
-    modalController.dismiss();
+    showToast(translate("Facility groups updated succesfully."))
+    modalController.dismiss()
   } catch(err: any) {
     showToast(translate("Failed to update facility groups."))
-    logger.error(err)
+    logger.error(err);
   }
 }
-</script>
-
-<style scoped>
-ion-content {
-  --padding-bottom: 80px;
-}
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file
diff --git a/src/store/index.ts b/src/store/index.ts
index 60e047e0..81382037 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -19,7 +19,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: ['user', 'util'],
+    paths: ['user'],
     fetchBeforeUse: true
 })
 

From d71b4bbcd0a1f0a1b28ab8b6a402a8b454d5ba8f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 12:17:19 +0530
Subject: [PATCH 068/250] Improved: code to fetch facility groups and to render
 rule without action (#255)

---
 src/components/RuleItem.vue                 | 4 ++--
 src/components/UpdateFacilityGroupModal.vue | 2 --
 src/store/modules/util/actions.ts           | 9 +++------
 src/views/SafetyStock.vue                   | 1 +
 src/views/Shipping.vue                      | 1 +
 src/views/StorePickup.vue                   | 1 +
 src/views/Threshold.vue                     | 1 +
 7 files changed, 9 insertions(+), 10 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 529ad32e..cf455bde 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -28,11 +28,11 @@
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">
       <ion-icon slot="start" :icon="storefrontOutline"/>
-      <ion-toggle :checked="props.rule.ruleActions[0].fieldValue" @click.prevent="updateRulePickup($event)">{{ translate(selectedPage.name) }}</ion-toggle>
+      <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRulePickup($event)">{{ translate(selectedPage.name) }}</ion-toggle>
     </ion-item>
     <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
       <ion-icon slot="start" :icon="sendOutline"/>
-      <ion-toggle :checked="props.rule.ruleActions[0].fieldValue" @click.prevent="updateRuleShipping($event)">{{ translate(selectedPage.name) }}</ion-toggle>
+      <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRuleShipping($event)">{{ translate(selectedPage.name) }}</ion-toggle>
     </ion-item>
 
     <ion-list>
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index cf87308b..dc40709d 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -78,8 +78,6 @@ const store = useStore();
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 onMounted(async () => {
-  console.log('enterd');
-  
   await store.dispatch("util/fetchFacilityGroups");
   const includedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'in')
   if(includedCondition && includedCondition.fieldValue) includedFilters.value = includedCondition.fieldValue.split(",");
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 2b95d196..9e3af94b 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -12,7 +12,7 @@ const actions: ActionTree<UtilState, RootState> = {
   async fetchConfigFacilities ({ commit, state }) {
     let configFacilities = JSON.parse(JSON.stringify(state.configFacilities))
 
-    if(configFacilities.length) return;
+    if(configFacilities.length && configFacilities[0].productStoreId === store.state.user.currentEComStore.productStoreId) return;
 
     try {
       const resp = await UtilService.fetchConfigFacilities({ facilityTypeId: 'CONFIGURATION', productStoreId: store.state.user.currentEComStore.productStoreId });
@@ -29,12 +29,9 @@ const actions: ActionTree<UtilState, RootState> = {
   },
 
   async fetchFacilityGroups ({ commit, state }) {
-    // let facilityGroups = JSON.parse(JSON.stringify(state.facilityGroups))
-
-    // if(facilityGroups.length) return;
-
-    let facilityGroups = {} as any;
+    let facilityGroups = JSON.parse(JSON.stringify(state.facilityGroups))
 
+    if(facilityGroups.length && facilityGroups[0].productStoreId === store.state.user.currentEComStore.productStoreId) return;
     try {
       const resp = await UtilService.fetchFacilityGroups({ productStoreId: store.state.user.currentEComStore.productStoreId });
 
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 8363e960..43fc52e7 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -48,6 +48,7 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' })
   await store.dispatch("util/fetchConfigFacilities");
+  await store.dispatch("util/fetchFacilityGroups");
 })
 
 function createRule() {
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 8cefe8b8..32f65b3e 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -70,6 +70,7 @@ const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? ro
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" })
   await store.dispatch("util/fetchConfigFacilities");
+  await store.dispatch("util/fetchFacilityGroups");
 })
 
 async function updateRuleGroup() {
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 9c547e39..addc8925 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -70,6 +70,7 @@ const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? ro
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' })
   await store.dispatch("util/fetchConfigFacilities");
+  await store.dispatch("util/fetchFacilityGroups");
 })
 
 async function updateRuleGroup() {
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 782f9061..65da2468 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -48,6 +48,7 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 onMounted(async() => {
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
   await store.dispatch("util/fetchConfigFacilities");
+  await store.dispatch("util/fetchFacilityGroups");
 })
 
 function CreateThreshold() {

From da841f24a17404d483e0e4c708889c31c858b84c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 12:24:46 +0530
Subject: [PATCH 069/250] Improved: condition to check whether conditions are
 present or not (#255)

---
 src/components/AddProductFacilityGroupModal.vue | 1 -
 src/components/RuleItem.vue                     | 4 ++--
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index ed36ae20..69abb1c2 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -80,7 +80,6 @@ function updateselectedGroups(selectedGroup: any) {
     selectedGroups.value = selectedGroups.value.filter((group: any) => group.facilityGroupId !== selectedGroup.facilityGroupId)
   } else {
     selectedGroups.value.push(selectedGroup)
-    
   }
 }
 
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index cf455bde..28478d96 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -58,11 +58,11 @@
           </ion-button>
         </ion-item-divider>
         
-        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS')" lines="none">
+        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')" lines="none">
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
         </ion-item>
-        <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS')">
+        <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'not-in')">
           <ion-icon slot="start" :icon="closeCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "not-in") }}</ion-label>
         </ion-item>

From ac4232b23abe48b2fee0dac0a0b42851c9a1f202 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 12:33:31 +0530
Subject: [PATCH 070/250] Improved: change method name for saving facility
 group (#255)

---
 src/components/UpdateFacilityGroupModal.vue | 40 ++++++++++-----------
 src/store/index.ts                          |  2 +-
 2 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index dc40709d..0e57785a 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -32,7 +32,7 @@
 
     <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
     <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="saveFilters()">
+      <ion-fab-button @click="saveFacilityGroups()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -69,8 +69,8 @@ import { showToast } from "@/utils";
 import logger from "@/logger";
 
 const selectedSegment = ref("included")
-const includedFilters = ref([]) as any;
-const excludedFilters = ref([]) as any;
+const includedGroups = ref([]) as any;
+const excludedGroups = ref([]) as any;
 
 const props = defineProps(["rule"]);
 const store = useStore();
@@ -80,10 +80,10 @@ const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 onMounted(async () => {
   await store.dispatch("util/fetchFacilityGroups");
   const includedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'in')
-  if(includedCondition && includedCondition.fieldValue) includedFilters.value = includedCondition.fieldValue.split(",");
+  if(includedCondition && includedCondition.fieldValue) includedGroups.value = includedCondition.fieldValue.split(",");
 
   const excludedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'not-in')
-  if(excludedCondition && excludedCondition.fieldValue) excludedFilters.value = excludedCondition.fieldValue.split(",");
+  if(excludedCondition && excludedCondition.fieldValue) excludedGroups.value = excludedCondition.fieldValue.split(",");
 })
 
 function closeModal() {
@@ -92,55 +92,55 @@ function closeModal() {
 
 function updateSelectedValues(value: string) {
   if(selectedSegment.value === 'included') {
-    if(includedFilters.value.includes(value)) includedFilters.value.splice(includedFilters.value.indexOf(value), 1)
-    else includedFilters.value.push(value)
+    if(includedGroups.value.includes(value)) includedGroups.value.splice(includedGroups.value.indexOf(value), 1)
+    else includedGroups.value.push(value)
   } 
   else {
-    if(excludedFilters.value.includes(value)) excludedFilters.value.splice(excludedFilters.value.indexOf(value), 1)
-    else excludedFilters.value.push(value) 
+    if(excludedGroups.value.includes(value)) excludedGroups.value.splice(excludedGroups.value.indexOf(value), 1)
+    else excludedGroups.value.push(value) 
   }
 }
 
 function isAlreadyApplied(value: string) {
-  if(selectedSegment.value === 'included') return excludedFilters.value.includes(value);
-  else return includedFilters.value.includes(value);
+  if(selectedSegment.value === 'included') return excludedGroups.value.includes(value);
+  else return includedGroups.value.includes(value);
 }
 
 function isSelected(value: string) {
-  if(selectedSegment.value === 'included') return includedFilters.value.includes(value);
-  else return excludedFilters.value.includes(value);
+  if(selectedSegment.value === 'included') return includedGroups.value.includes(value);
+  else return excludedGroups.value.includes(value);
 }
 
-async function saveFilters() {
+async function saveFacilityGroups() {
   const rule = JSON.parse(JSON.stringify(props.rule))
 
   if(!rule.ruleConditions) rule.ruleConditions = []
 
   const includeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'in')
   if(includeCondition) {
-    includeCondition.fieldValue = includedFilters.value.join(",")
+    includeCondition.fieldValue = includedGroups.value.join(",")
   } else {
     rule.ruleConditions.push({
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
       "fieldName": "facilityGroups",
       "operator": selectedSegment.value === "included" ? "in" : "not-in",
-      "fieldValue": includedFilters.value?.length > 1 ? includedFilters.value.join(",") : includedFilters.value[0],
-      "multiValued": includedFilters.value?.length > 1 ? "Y" : "N"
+      "fieldValue": includedGroups.value?.length > 1 ? includedGroups.value.join(",") : includedGroups.value[0],
+      "multiValued": includedGroups.value?.length > 1 ? "Y" : "N"
     })
   }
 
   const excludeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'not-in')
   if(excludeCondition) {
-    excludeCondition.fieldValue = excludedFilters.value.join(",")
+    excludeCondition.fieldValue = excludedGroups.value.join(",")
   } else {
     rule.ruleConditions.push({
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
       "fieldName": "facilityGroups",
       "operator": selectedSegment.value === "included" ? "in" : "not-in",
-      "fieldValue": excludedFilters.value?.length > 1 ? excludedFilters.value.join(",") : excludedFilters.value[0],
-      "multiValued": excludedFilters.value?.length > 1 ? "Y" : "N"
+      "fieldValue": excludedGroups.value?.length > 1 ? excludedGroups.value.join(",") : excludedGroups.value[0],
+      "multiValued": excludedGroups.value?.length > 1 ? "Y" : "N"
     })
   }
 
diff --git a/src/store/index.ts b/src/store/index.ts
index 81382037..60e047e0 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -19,7 +19,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: ['user'],
+    paths: ['user', 'util'],
     fetchBeforeUse: true
 })
 

From b64ec3a8998bfb829fa4a825c3db9f47db8e14e4 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 14:44:52 +0530
Subject: [PATCH 071/250] Improved: called api's in parallel, fixed typos,
 added padding-bottom to modal instead of using ion-padding, fixed imports
 (#255)

---
 .../AddProductFacilityGroupModal.vue          | 20 +++++++++++--------
 src/components/AddProductFiltersModal.vue     | 14 ++++++++-----
 src/components/RuleGroupHistoryModal.vue      |  1 -
 src/components/RuleItem.vue                   |  2 +-
 src/components/ScheduleRuleItem.vue           |  4 ++--
 src/components/UpdateFacilityGroupModal.vue   | 14 ++++++++-----
 src/components/UpdateProductFiltersModal.vue  | 14 ++++++++-----
 src/views/CreateSafetyStockRule.vue           |  5 ++---
 src/views/SafetyStock.vue                     |  4 +---
 src/views/Shipping.vue                        |  7 ++-----
 src/views/StorePickup.vue                     |  7 ++-----
 src/views/Threshold.vue                       |  4 +---
 12 files changed, 50 insertions(+), 46 deletions(-)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index 69abb1c2..6567baf1 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -12,7 +12,7 @@
 
   <ion-content>
     <ion-list>
-      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId"  @click="updateselectedGroups(group)">
+      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId"  @click="updateSelectedGroups(group)">
         <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isAlreadySelected(group.facilityGroupId)">
           {{ group.facilityGroupName }}
@@ -21,8 +21,7 @@
       </ion-item>
     </ion-list>
 
-    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
-    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFacilityGroups()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
@@ -31,7 +30,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted } from "vue";
+import { computed, defineProps, onMounted, ref } from "vue";
 import {
   IonButton,
   IonButtons,
@@ -51,7 +50,6 @@ import {
 } from "@ionic/vue";
 import { arrowBackOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
-import { defineProps, ref } from "vue";
 import { translate } from "@/i18n";
 
 const selectedGroups = ref([]) as any;
@@ -66,14 +64,14 @@ onMounted(() => {
 })
 
 function closeModal() {
-  modalController.dismiss({ dismissed: true, selectedGroups });
+  modalController.dismiss({ dismissed: true, selectedGroups: selectedGroups.value });
 }
 
 function isAlreadySelected(id: any) {
   return selectedGroups.value.some((group: any) => group.facilityGroupId === id)
 }
 
-function updateselectedGroups(selectedGroup: any) {
+function updateSelectedGroups(selectedGroup: any) {
   const currentGroup = selectedGroups.value.find((group: any) => group.facilityGroupId === selectedGroup.facilityGroupId)
 
   if(currentGroup?.facilityGroupId) {
@@ -92,4 +90,10 @@ function saveFacilityGroups() {
   modalController.dismiss({ dismissed: true, selectedGroups: selectedGroups.value })
 }
 
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+  ion-content {
+    --padding-bottom: 80px;
+  }
+</style>
\ No newline at end of file
diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index ccc602eb..d030fd64 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -26,8 +26,7 @@
       </ion-item>
     </ion-list>
 
-    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
-    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFilters()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
@@ -40,7 +39,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted } from "vue";
+import { computed, defineProps, onMounted, ref } from "vue";
 import {
   IonButton,
   IonButtons,
@@ -64,7 +63,6 @@ import {
 import { arrowBackOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
 import { UtilService } from "@/services/UtilService";
-import { defineProps, ref } from "vue";
 import { translate } from "@/i18n";
 import { hasError } from "@/utils";
 
@@ -144,4 +142,10 @@ async function saveFilters() {
   await store.dispatch('util/updateAppliedFilters', selectedFilters)
   modalController.dismiss()
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+  ion-content {
+    --padding-bottom: 80px;
+  }
+</style>
\ No newline at end of file
diff --git a/src/components/RuleGroupHistoryModal.vue b/src/components/RuleGroupHistoryModal.vue
index 420eb8d8..1350d99c 100644
--- a/src/components/RuleGroupHistoryModal.vue
+++ b/src/components/RuleGroupHistoryModal.vue
@@ -38,7 +38,6 @@ import {
   IonTitle,
   IonToolbar,
   modalController,
-  onIonViewWillEnter,
 } from "@ionic/vue";
 import { closeOutline } from "ionicons/icons";
 import { computed, onMounted, ref } from "vue";
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 28478d96..b683d9c5 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -118,7 +118,7 @@ import { useRouter } from 'vue-router';
 import { translate } from '@/i18n';
 import { RuleService } from '@/services/RuleService';
 import { useStore } from 'vuex';
-import { hasError, showToast } from '@/utils';
+import { showToast } from '@/utils';
 import logger from '@/logger';
 import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
 import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModal.vue';
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index cd638e65..d4b8112a 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -29,11 +29,11 @@
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardTitle, IonIcon, IonItem, IonLabel, IonSelect, IonSelectOption, onIonViewDidEnter, popoverController } from '@ionic/vue';
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardTitle, IonIcon, IonItem, IonLabel, IonSelect, IonSelectOption, popoverController } from '@ionic/vue';
 import { translate } from '@/i18n';
 import { ellipsisVerticalOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import ScheduleActionsPopover from "@/components/ScheduleActionsPopover.vue";
-import { computed, ref, onMounted } from 'vue';
+import { computed } from 'vue';
 import { getDateAndTime, hasError, showToast } from '@/utils'
 import { useStore } from 'vuex';
 import logger from '@/logger';
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index 0e57785a..d7b2e585 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -30,8 +30,7 @@
       </ion-item>
     </ion-list>
 
-    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
-    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFacilityGroups()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
@@ -40,7 +39,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted } from "vue";
+import { computed, defineProps, onMounted, ref } from "vue";
 import {
   IonButton,
   IonButtons,
@@ -63,7 +62,6 @@ import {
 import { arrowBackOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
 import { RuleService } from "@/services/RuleService";
-import { defineProps, ref } from "vue";
 import { translate } from "@/i18n";
 import { showToast } from "@/utils";
 import logger from "@/logger";
@@ -154,4 +152,10 @@ async function saveFacilityGroups() {
     logger.error(err);
   }
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+  ion-content {
+    --padding-bottom: 80px;
+  }
+</style>
\ No newline at end of file
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index c082a6b0..2703b1fb 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -32,8 +32,7 @@
       </ion-item>
     </ion-list>
 
-    <!-- Added padding for better visiblity of the checkboxes beside the FAB -->
-    <ion-fab class="ion-padding" vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFilters()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
@@ -46,7 +45,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted } from "vue";
+import { defineProps, onMounted, ref } from "vue";
 import {
   IonButton,
   IonButtons,
@@ -73,7 +72,6 @@ import { arrowBackOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
 import { UtilService } from "@/services/UtilService";
 import { RuleService } from "@/services/RuleService";
-import { defineProps, ref } from "vue";
 import { translate } from "@/i18n";
 import { hasError, showToast } from "@/utils";
 import logger from "@/logger";
@@ -206,4 +204,10 @@ async function saveFilters() {
     logger.error(err);
   }
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+  ion-content {
+    --padding-bottom: 80px;
+  }
+</style>
\ No newline at end of file
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 815a439b..aab9174e 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -94,7 +94,7 @@ const store = useStore();
 
 const formData = ref({
   ruleName: '',
-  SafetyStock: '',
+  safetyStock: '',
   selectedFacilityGroups: {
     included: [],
     excluded: []
@@ -107,8 +107,7 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onMounted(async () => {
-  store.dispatch("util/clearAppliedFilters")
-  await store.dispatch("util/fetchFacilityGroups");
+  await Promise.allSettled([store.dispatch("util/clearAppliedFilters"), store.dispatch("util/fetchFacilityGroups")])
 })
 
 async function openProductFacilityGroupModal(type: string) {
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 43fc52e7..3d3a5793 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -46,9 +46,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' })
-  await store.dispatch("util/fetchConfigFacilities");
-  await store.dispatch("util/fetchFacilityGroups");
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
 })
 
 function createRule() {
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 32f65b3e..ce27ad5d 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -49,7 +49,7 @@
 
 <script setup lang="ts">
 import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar } from '@ionic/vue';
-import { ref } from 'vue';
+import { computed, onMounted, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@/i18n';
@@ -57,7 +57,6 @@ import FacilityItem from '@/components/FacilityItem.vue';
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
 import { useStore } from 'vuex';
-import { computed, onMounted } from 'vue';
 
 const store = useStore();
 const router = useRouter()
@@ -68,9 +67,7 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY")
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" })
-  await store.dispatch("util/fetchConfigFacilities");
-  await store.dispatch("util/fetchFacilityGroups");
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
 })
 
 async function updateRuleGroup() {
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index addc8925..f1711df7 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -49,7 +49,7 @@
 
 <script setup lang="ts">
 import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar } from '@ionic/vue';
-import { ref } from 'vue';
+import { computed, onMounted, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
@@ -57,7 +57,6 @@ import { translate } from '@/i18n';
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
 import { useStore } from 'vuex';
-import { computed, onMounted } from 'vue';
 
 const store = useStore();
 const router = useRouter()
@@ -68,9 +67,7 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' })
-  await store.dispatch("util/fetchConfigFacilities");
-  await store.dispatch("util/fetchFacilityGroups");
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
 })
 
 async function updateRuleGroup() {
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 65da2468..c013bc7c 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -46,9 +46,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onMounted(async() => {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' })
-  await store.dispatch("util/fetchConfigFacilities");
-  await store.dispatch("util/fetchFacilityGroups");
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
 })
 
 function CreateThreshold() {

From 11917a946a631feb0eda15e71b0ee946f5b94e74 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 14:51:02 +0530
Subject: [PATCH 072/250] Fixed: condition to send operator in case of
 condition updation to avoid mismatched saving of filters (#255)

---
 src/components/UpdateFacilityGroupModal.vue  | 4 ++--
 src/components/UpdateProductFiltersModal.vue | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index d7b2e585..42936aa9 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -122,7 +122,7 @@ async function saveFacilityGroups() {
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
       "fieldName": "facilityGroups",
-      "operator": selectedSegment.value === "included" ? "in" : "not-in",
+      "operator": "in",
       "fieldValue": includedGroups.value?.length > 1 ? includedGroups.value.join(",") : includedGroups.value[0],
       "multiValued": includedGroups.value?.length > 1 ? "Y" : "N"
     })
@@ -136,7 +136,7 @@ async function saveFacilityGroups() {
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
       "fieldName": "facilityGroups",
-      "operator": selectedSegment.value === "included" ? "in" : "not-in",
+      "operator": "not-in",
       "fieldValue": excludedGroups.value?.length > 1 ? excludedGroups.value.join(",") : excludedGroups.value[0],
       "multiValued": excludedGroups.value?.length > 1 ? "Y" : "N"
     })
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index 2703b1fb..6ff76482 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -174,7 +174,7 @@ async function saveFilters() {
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FILTER",
       "fieldName": props.searchfield,
-      "operator": selectedSegment.value === "included" ? "in" : "not-in",
+      "operator": "in",
       "fieldValue": includedFilters.value?.length > 1 ? includedFilters.value.join(",") : includedFilters.value[0],
       "multiValued": includedFilters.value?.length > 1 ? "Y" : "N"
     })
@@ -188,7 +188,7 @@ async function saveFilters() {
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FILTER",
       "fieldName": props.searchfield,
-      "operator": selectedSegment.value === "included" ? "in" : "not-in",
+      "operator": "not-in",
       "fieldValue": excludedFilters.value?.length > 1 ? excludedFilters.value.join(",") : excludedFilters.value[0],
       "multiValued": excludedFilters.value?.length > 1 ? "Y" : "N"
     })

From f1c4c823b3cbc197fcdc24a47d00366d6c3fcbb9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 15:01:59 +0530
Subject: [PATCH 073/250] Implemented: empty-state in the modals with list
 (#255)

---
 src/components/AddProductFacilityGroupModal.vue | 6 +++++-
 src/components/SelectConfigFacilitiesModal.vue  | 6 +++++-
 src/components/UpdateFacilityGroupModal.vue     | 6 +++++-
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index 6567baf1..22a81cb3 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -11,7 +11,7 @@
   </ion-header>
 
   <ion-content>
-    <ion-list>
+    <ion-list v-if="facilityGroups.length">
       <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId"  @click="updateSelectedGroups(group)">
         <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isAlreadySelected(group.facilityGroupId)">
@@ -21,6 +21,10 @@
       </ion-item>
     </ion-list>
 
+    <div class="empty-state" v-else>
+      <p>{{ translate("No record found") }}</p>
+    </div>
+
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFacilityGroups()">
         <ion-icon :icon="saveOutline" />
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index 38b18945..f66eb988 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -11,7 +11,7 @@
   </ion-header>
 
   <ion-content>
-    <ion-list>
+    <ion-list v-if="configFacilities.length">
       <ion-item v-for="facility in configFacilities" :key="facility.facilityId">
         <ion-checkbox :checked="isSelected(facility.facilityId)" @ionChange="toggleFacilitySelection(facility)">
           <ion-label>
@@ -22,6 +22,10 @@
       </ion-item>
     </ion-list>
 
+    <div class="empty-state" v-else>
+      <p>{{ translate("No record found") }}</p>
+    </div>
+
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFacilities()">
         <ion-icon :icon="saveOutline" />  
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index 42936aa9..644e17ee 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -20,7 +20,7 @@
       </ion-segment-button>
     </ion-segment>
 
-    <ion-list>
+    <ion-list v-if="facilityGroups.length">
       <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId" @click="!isAlreadyApplied(group.facilityGroupId) ? updateSelectedValues(group.facilityGroupId): ''">
         <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isSelected(group.facilityGroupId)">
@@ -30,6 +30,10 @@
       </ion-item>
     </ion-list>
 
+    <div class="empty-state" v-else>
+      <p>{{ translate("No record found") }}</p>
+    </div>
+
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFacilityGroups()">
         <ion-icon :icon="saveOutline" />

From 5bb143c70da2338b688ceea8dfbf2d9f73fd7399 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 22 Apr 2024 15:32:11 +0530
Subject: [PATCH 074/250] Implemented: validation while rule creation (#255)

---
 src/locales/en.json                 |  2 ++
 src/views/CreateSafetyStockRule.vue | 17 +++++++++++++----
 src/views/CreateShippingRule.vue    | 21 ++++++++++++++++++---
 src/views/CreateStorePickupRule.vue | 21 ++++++++++++++++++---
 src/views/CreateThresholdRule.vue   | 15 ++++++++++++++-
 5 files changed, 65 insertions(+), 11 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index dfbce0de..ea2e3bd3 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -115,6 +115,8 @@
   "Paused": "Paused",
   "Pending": "Pending",
   "Please enter a threshold value to set for these products before proceeding.": "Please enter a threshold value to set for these products before proceeding.",
+  "Please fill in all the required fields.": "Please fill in all the required fields.",
+  "Please select atleast one config facility.": "Please select atleast one config facility.",
   "Product and facility": "Product and facility",
   "Product and channel": "Product and channel",
   "Product list": "Product list",
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index aab9174e..d0676da2 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -17,10 +17,14 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input :label="translate('Name')" v-model="formData.ruleName" />
+                <ion-input v-model="formData.ruleName">
+                  <div slot="label">{{ translate("Name") }} <ion-text color="danger">*</ion-text></div>
+                </ion-input>
               </ion-item>
               <ion-item>
-                <ion-input :label="translate('Safety stock')" v-model="formData.safetyStock" />
+                <ion-input v-model="formData.safetyStock">
+                  <div slot="label">{{ translate("Safety stock") }} <ion-text color="danger">*</ion-text></div>
+                </ion-input>
               </ion-item>
             </div>
           </ion-card>
@@ -34,7 +38,7 @@
       <section>
         <ion-card>
           <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-label>{{ translate("Included") }} <ion-text color="danger">*</ion-text></ion-label>
             <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
@@ -77,7 +81,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonTitle, IonToolbar, modalController } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonText, IonTitle, IonToolbar, modalController } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
@@ -183,6 +187,11 @@ function generateRuleConditions(ruleId: string) {
 }
 
 async function createRule() {
+  if(!formData.value.ruleName || !formData.value.safetyStock || !formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please fill in all the required fields."))
+    return;
+  }
+
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_SAFETY_STOCK" });
 
   try {
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 07933c13..8e475fcb 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -17,7 +17,9 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input label="Name" v-model="formData.ruleName" />
+                <ion-input v-model="formData.ruleName">
+                  <div slot="label">{{ translate("Name") }} <ion-text color="danger">*</ion-text></div>
+                </ion-input>
               </ion-item>
               <ion-item>
                 <ion-icon slot="start" :icon="storefrontOutline"/>
@@ -42,7 +44,7 @@
       <section v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">
         <ion-card>
           <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-label>{{ translate("Included") }} <ion-text color="danger">*</ion-text></ion-label>
             <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
@@ -97,7 +99,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
 import { computed, onMounted, ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
@@ -167,6 +169,19 @@ function isFacilitySelected(facilityId: any) {
 }
 
 async function createRule() {
+  if(!formData.value.ruleName) {
+    showToast(translate("Please fill in all the required fields."))
+    return;
+  }
+
+  if( selectedSegment.value === 'RG_SHIPPING_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please fill in all the required fields."))
+    return;
+  } else if(!formData.value.selectedConfigFacilites.length) {
+    showToast(translate("Please select atleast one config facility."))
+    return;
+  }
+
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
 
   try {
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 42e2bd7e..233196ce 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -17,7 +17,9 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input :label="translate('Name')" v-model="formData.ruleName" />
+                <ion-input v-model="formData.ruleName">
+                  <div slot="label">{{ translate("Name") }} <ion-text color="danger">*</ion-text></div>
+                </ion-input>
               </ion-item>
               <ion-item>
                 <ion-icon slot="start" :icon="storefrontOutline"/>
@@ -42,7 +44,7 @@
       <section v-if="selectedSegment === 'RG_PICKUP_FACILITY'">
         <ion-card>
           <ion-item lines="none">
-            <ion-label>{{ translate("Included") }}</ion-label>
+            <ion-label>{{ translate("Included") }} <ion-text color="danger">*</ion-text></ion-label>
             <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
               {{ translate("Add") }}
               <ion-icon :icon="addCircleOutline" slot="end" />
@@ -97,7 +99,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import { computed, onMounted, ref } from 'vue';
@@ -167,6 +169,19 @@ function isFacilitySelected(facilityId: any) {
 }
 
 async function createRule() {
+  if(!formData.value.ruleName) {
+    showToast(translate("Please fill in all the required fields."))
+    return;
+  }
+
+  if( selectedSegment.value === 'RG_PICKUP_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please fill in all the required fields."))
+    return;
+  } else if(!formData.value.selectedConfigFacilites.length) {
+    showToast(translate("Please select atleast one config facility."))
+    return;
+  }
+
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
 
   try {
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index b292350a..f6bf048d 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -17,7 +17,9 @@
 
             <div class="rule-inputs ion-padding">
               <ion-item>
-                <ion-input :label="translate('Name')" v-model="formData.ruleName" />
+                <ion-input v-model="formData.ruleName">
+                  <div slot="label">{{ translate("Name") }} <ion-text color="danger">*</ion-text></div>
+                </ion-input>
               </ion-item>
               <ion-item>
                 <ion-input :label="translate('Threshold')" v-model="formData.threshold" />
@@ -69,6 +71,7 @@ import {
   IonInput,
   IonItem,
   IonPage,
+  IonText,
   IonTitle,
   IonToolbar
 } from '@ionic/vue';
@@ -154,6 +157,16 @@ function generateRuleConditions(ruleId: string) {
 }
 
 async function createThresholdRule() {
+  if(!formData.value.ruleName) {
+    showToast(translate("Please fill in all the required fields."))
+    return;
+  }
+
+  if(!formData.value.selectedConfigFacilites.length) {
+    showToast(translate("Please select atleast one config facility."))
+    return;
+  }
+
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_THRESHOLD" });
 
   try {

From 39109ac431920814c3b9bc1714d69cde485b1c9a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 23 Apr 2024 10:48:32 +0530
Subject: [PATCH 075/250] Implemented: logic to fetch inventory channels and
 config facilities (#258)

---
 .../LinkThresholdFacilitiesToGroupModal.vue   | 31 +++-------
 src/services/ChannelService.ts                | 22 +++++++
 src/store/index.ts                            |  6 +-
 src/store/modules/channel/ChannelState.ts     |  4 ++
 src/store/modules/channel/actions.ts          | 59 +++++++++++++++++++
 src/store/modules/channel/getters.ts          | 13 ++++
 src/store/modules/channel/index.ts            | 19 ++++++
 src/store/modules/channel/mutation-types.ts   |  4 ++
 src/store/modules/channel/mutations.ts        | 16 +++++
 src/views/InventoryChannels.vue               | 22 +++++--
 10 files changed, 167 insertions(+), 29 deletions(-)
 create mode 100644 src/services/ChannelService.ts
 create mode 100644 src/store/modules/channel/ChannelState.ts
 create mode 100644 src/store/modules/channel/actions.ts
 create mode 100644 src/store/modules/channel/getters.ts
 create mode 100644 src/store/modules/channel/index.ts
 create mode 100644 src/store/modules/channel/mutation-types.ts
 create mode 100644 src/store/modules/channel/mutations.ts

diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index 43ebcbaf..dda36b9b 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -11,30 +11,12 @@
   </ion-header>
 
   <ion-content>
-    <ion-searchbar />
-
-    <ion-radio-group>
-      <ion-item>
-        <ion-radio>
-          <ion-label>
-            {{ "Facility name" }}
-            <p>{{ "Facility ID" }}</p>
-          </ion-label>
-        </ion-radio>
-      </ion-item>
-      <ion-item>
+    <ion-radio-group v-if="configFacilities.length">
+      <ion-item v-for="facility in configFacilities" :key="facility.facilityId">
         <ion-radio>
           <ion-label>
-            {{ "Facility name" }}
-            <p>{{ "Facility ID" }}</p>
-          </ion-label>
-        </ion-radio>
-      </ion-item>
-      <ion-item>
-        <ion-radio>
-          <ion-label>
-            {{ "Facility name" }}
-            <p>{{ "Facility ID" }}</p>
+            {{ facility.facilityName }}
+            <p>{{ facility.facilityId }}</p>
           </ion-label>
         </ion-radio>
       </ion-item>
@@ -52,4 +34,9 @@
 import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonRadio, IonRadioGroup, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@/i18n'
+import { useStore } from "vuex";
+import { computed } from "vue";
+
+const store = useStore();
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 </script>
\ No newline at end of file
diff --git a/src/services/ChannelService.ts b/src/services/ChannelService.ts
new file mode 100644
index 00000000..a13fd515
--- /dev/null
+++ b/src/services/ChannelService.ts
@@ -0,0 +1,22 @@
+import api from '@/api';
+
+const fetchInventoryChannels = async (payload: any): Promise <any>  => {
+  return api({
+    url: 'facilityGroups',
+    method: "GET",
+    params: payload
+  });
+}
+
+const fetchGroupConfigFacilities = async (payload: any): Promise <any>  => {
+  return api({
+    url: `facilityGroups/${payload.facilityGroupId}/facilities`,
+    method: "GET",
+    params: payload
+  });
+}
+
+export const ChannelService = {
+  fetchInventoryChannels,
+  fetchGroupConfigFacilities
+}
\ No newline at end of file
diff --git a/src/store/index.ts b/src/store/index.ts
index 60e047e0..47384850 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -7,6 +7,7 @@ import createPersistedState from "vuex-persistedstate";
 import userModule from './modules/user';
 import utilModule from './modules/util';
 import ruleModule from './modules/rule';
+import channelModule from "./modules/channel"
 
 
 // TODO check how to register it from the components only
@@ -19,7 +20,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: ['user', 'util'],
+    paths: ['user'],
     fetchBeforeUse: true
 })
 
@@ -33,7 +34,8 @@ const store = createStore<RootState>({
     modules: { 
         'user': userModule,
         'util': utilModule,
-        'rule': ruleModule
+        'rule': ruleModule,
+        'channel': channelModule
     },
 })
 
diff --git a/src/store/modules/channel/ChannelState.ts b/src/store/modules/channel/ChannelState.ts
new file mode 100644
index 00000000..bd466ffa
--- /dev/null
+++ b/src/store/modules/channel/ChannelState.ts
@@ -0,0 +1,4 @@
+export default interface ChannelState {
+  inventoryChannels: any;
+  groupConfigFacilities: any;
+}
\ No newline at end of file
diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
new file mode 100644
index 00000000..1836be65
--- /dev/null
+++ b/src/store/modules/channel/actions.ts
@@ -0,0 +1,59 @@
+import { ActionTree } from 'vuex'
+import RootState from '@/store/RootState'
+import * as types from './mutation-types'
+import ChannelState from './ChannelState'
+import { ChannelService } from '@/services/ChannelService'
+import { hasError } from '@/utils'
+import logger from '@/logger'
+
+
+const actions: ActionTree<ChannelState, RootState> = {
+
+  async fetchInventoryChannels ({ commit, state, dispatch }) {
+    let resp = {} as any;
+    let inventoryChannels = JSON.parse(JSON.stringify(state.inventoryChannels))
+
+    if(inventoryChannels.length) return;
+
+    try {
+      resp = await ChannelService.fetchInventoryChannels({ facilityGroupTypeId: "CHANNEL_FAC_GROUP" });
+
+      if(!hasError(resp)) {
+        inventoryChannels = resp?.data;
+
+        inventoryChannels.map(async (channel: any) => {
+          const facilities = await dispatch('fetchGroupConfigFacilities', channel.facilityGroupId)
+          console.log('ok', facilities);
+        })
+      } else {
+        throw resp.data
+      }
+    } catch (err: any) {
+      logger.error(err)
+    }
+    commit(types.CHANNEL_INVENTORY_CHANNELS_UPDATED, inventoryChannels)
+  },
+
+  async fetchGroupConfigFacilities ({ commit, state }, facilityGroupId) {
+    let groupConfigFacilities = {} as any;
+
+    try {
+      const resp = await ChannelService.fetchGroupConfigFacilities({ facilityTypeId: 'CONFIGURATION', facilityGroupId: facilityGroupId });
+
+      if(!hasError(resp)) {
+        groupConfigFacilities = resp.data;
+      } else {
+        throw resp.data
+      }
+    } catch (err: any) {
+      logger.error(err)
+    }
+    return groupConfigFacilities
+  },
+
+  async clearChannelState({ commit }) {
+    commit(types.CHANNEL_CLEARED)
+  },
+}
+
+export default actions;
\ No newline at end of file
diff --git a/src/store/modules/channel/getters.ts b/src/store/modules/channel/getters.ts
new file mode 100644
index 00000000..f300c181
--- /dev/null
+++ b/src/store/modules/channel/getters.ts
@@ -0,0 +1,13 @@
+import { GetterTree } from 'vuex'
+import RootState from '@/store/RootState'
+import ChannelState from './ChannelState';
+
+const getters: GetterTree <ChannelState, RootState> = {
+  getInventoryChannels (state) {
+    return state.inventoryChannels
+  },
+  getGroupConfigFacilities (state) {
+    return state.groupConfigFacilities
+  }
+}
+export default getters;
\ No newline at end of file
diff --git a/src/store/modules/channel/index.ts b/src/store/modules/channel/index.ts
new file mode 100644
index 00000000..929c0a61
--- /dev/null
+++ b/src/store/modules/channel/index.ts
@@ -0,0 +1,19 @@
+import actions from './actions'
+import getters from './getters'
+import mutations from './mutations'
+import { Module } from 'vuex'
+import RootState from '@/store/RootState'
+import ChannelState from './ChannelState'
+
+const channelModule: Module<ChannelState, RootState> = {
+  namespaced: true,
+  state: {
+    inventoryChannels: [],
+    groupConfigFacilities: []
+  },
+  getters,
+  actions,
+  mutations,
+}
+
+export default channelModule;
\ No newline at end of file
diff --git a/src/store/modules/channel/mutation-types.ts b/src/store/modules/channel/mutation-types.ts
new file mode 100644
index 00000000..189d44f8
--- /dev/null
+++ b/src/store/modules/channel/mutation-types.ts
@@ -0,0 +1,4 @@
+export const SN_CHANNEL = 'channel'
+export const CHANNEL_INVENTORY_CHANNELS_UPDATED = SN_CHANNEL + '/INVENTORY_CHANNELS_UPDATED'
+export const CHANNEL_GROUP_CONFIG_FACILITIES_UPDATED = SN_CHANNEL + '/GROUP_CONFIG_FACILITIES_UPDATED'
+export const CHANNEL_CLEARED = SN_CHANNEL + "/CLEARED"
\ No newline at end of file
diff --git a/src/store/modules/channel/mutations.ts b/src/store/modules/channel/mutations.ts
new file mode 100644
index 00000000..cf3630e2
--- /dev/null
+++ b/src/store/modules/channel/mutations.ts
@@ -0,0 +1,16 @@
+import { MutationTree } from 'vuex'
+import ChannelState from './ChannelState';
+import * as types from './mutation-types'
+
+const mutations: MutationTree <ChannelState> = {
+  [types.CHANNEL_INVENTORY_CHANNELS_UPDATED] (state, payload) {
+    state.inventoryChannels = payload;
+  },
+  [types.CHANNEL_GROUP_CONFIG_FACILITIES_UPDATED] (state, payload) {
+    state.groupConfigFacilities = payload;
+  },
+  [types.CHANNEL_CLEARED](state) {
+    state.inventoryChannels = []
+  },
+}
+export default mutations;
\ No newline at end of file
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 718469b5..75f13416 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -21,12 +21,12 @@
     <ion-content>
       <main>
         <section v-if="selectedSegment === 'channels'">
-          <ion-card>
+          <ion-card v-for="channel in inventoryChannels" :key="channel.facilityGroupId">
             <ion-card-header>
               <div>
-                <ion-card-subtitle class="overline">{{ "Group ID" }}</ion-card-subtitle>
-                <ion-card-title>{{ "Group name" }}</ion-card-title>
-                <ion-card-subtitle>{{ "Group desc" }}</ion-card-subtitle>
+                <ion-card-subtitle class="overline">{{ channel.facilityGroupId }}</ion-card-subtitle>
+                <ion-card-title>{{ channel.facilityGroupName }}</ion-card-title>
+                <ion-card-subtitle>{{ channel.description }}</ion-card-subtitle>
               </div>
             </ion-card-header>
 
@@ -123,16 +123,28 @@
 
 <script setup lang="ts">
 import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, popoverController } from '@ionic/vue';
-import { ref } from 'vue';
+import { computed, onMounted, ref } from 'vue';
 import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@/i18n';
 import ShopActionsPopover from '@/components/ShopActionsPopover.vue'
 import CreateGroupModal from '@/components/CreateGroupModal.vue'
 import LinkFacilitiesToGroupModal from '@/components/LinkFacilitiesToGroupModal.vue'
 import LinkThresholdFacilitiesToGroupModal from '@/components/LinkThresholdFacilitiesToGroupModal.vue'
+import { useStore } from 'vuex';
+
+const store = useStore();
 
 const selectedSegment = ref("channels")
 
+const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
+const configFacilities = computed(() => store.getters["util/fetchConfigFacilities"])
+
+onMounted(async () => {
+  await store.dispatch("channel/fetchInventoryChannels");
+  await store.dispatch("util/fetchConfigFacilities");
+})
+
+
 async function openShopActionsPopover(event: Event) {
   const popover = await popoverController.create({
     component: ShopActionsPopover,

From 92d9337311dddabf938891ef167ba1931f105819 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 23 Apr 2024 11:00:53 +0530
Subject: [PATCH 076/250] Improved: code to avoid unnecessary method calls,
 used router.push (#255)

---
 src/views/CreateSafetyStockRule.vue | 4 ++--
 src/views/CreateShippingRule.vue    | 4 ++--
 src/views/CreateStorePickupRule.vue | 4 ++--
 src/views/SafetyStock.vue           | 8 ++++----
 src/views/Shipping.vue              | 8 ++++----
 src/views/StorePickup.vue           | 8 ++++----
 src/views/Threshold.vue             | 8 ++++----
 7 files changed, 22 insertions(+), 22 deletions(-)

diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index d0676da2..790e9389 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -213,8 +213,8 @@ async function createRule() {
     const rule = await RuleService.createRule(params)
     await RuleService.updateRule({
       ...params,
-      "ruleConditions": generateRuleConditions(rule.ruleId) ? generateRuleConditions(rule.ruleId): [],
-      "ruleActions": generateRuleActions(rule.ruleId) ? generateRuleActions(rule.ruleId) : []
+      "ruleConditions": generateRuleConditions(rule.ruleId),
+      "ruleActions": generateRuleActions(rule.ruleId)
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 8e475fcb..47bdb403 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -203,8 +203,8 @@ async function createRule() {
     const rule = await RuleService.createRule(params)
     await RuleService.updateRule({
       ...params,
-      "ruleConditions": generateRuleConditions(rule.ruleId) ? generateRuleConditions(rule.ruleId): [],
-      "ruleActions": generateRuleActions(rule.ruleId) ? generateRuleActions(rule.ruleId) : []
+      "ruleConditions": generateRuleConditions(rule.ruleId),
+      "ruleActions": generateRuleActions(rule.ruleId)
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 233196ce..1e5a9fc7 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -203,8 +203,8 @@ async function createRule() {
     const rule = await RuleService.createRule(params)
     await RuleService.updateRule({
       ...params,
-      "ruleConditions": generateRuleConditions(rule.ruleId) ? generateRuleConditions(rule.ruleId): [],
-      "ruleActions": generateRuleActions(rule.ruleId) ? generateRuleActions(rule.ruleId) : []
+      "ruleConditions": generateRuleConditions(rule.ruleId),
+      "ruleActions": generateRuleActions(rule.ruleId)
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 3d3a5793..c483c441 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -30,13 +30,13 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
 import { useRouter } from "vue-router";
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useStore } from 'vuex';
-import { computed, onMounted } from 'vue';
+import { computed } from 'vue';
 import { translate } from '@/i18n';
 
 const store = useStore();
@@ -45,11 +45,11 @@ const router = useRouter()
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
-onMounted(async() => {
+onIonViewWillEnter(async() => {
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
 })
 
 function createRule() {
-  router.replace({ path: '/create-safety-stock' })
+  router.push({ path: '/create-safety-stock' })
 }
 </script>
\ No newline at end of file
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index ce27ad5d..db90bec4 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -48,8 +48,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar } from '@ionic/vue';
-import { computed, onMounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { computed, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@/i18n';
@@ -66,7 +66,7 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY")
 
-onMounted(async() => {
+onIonViewWillEnter(async() => {
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
 })
 
@@ -75,6 +75,6 @@ async function updateRuleGroup() {
 }
 
 function createShipping() {
-  router.replace({ path: '/create-shipping', query: { groupTypeEnumId: selectedSegment.value } })
+  router.push({ path: '/create-shipping', query: { groupTypeEnumId: selectedSegment.value } })
 }
 </script>
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index f1711df7..0a448bc0 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -48,8 +48,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar } from '@ionic/vue';
-import { computed, onMounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { computed, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
@@ -66,7 +66,7 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
 
-onMounted(async() => {
+onIonViewWillEnter(async() => {
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
 })
 
@@ -75,6 +75,6 @@ async function updateRuleGroup() {
 }
 
 function createStorePickup() {
-  router.replace({ path: '/create-store-pickup', query: { groupTypeEnumId: selectedSegment.value } })
+  router.push({ path: '/create-store-pickup', query: { groupTypeEnumId: selectedSegment.value } })
 }
 </script>
\ No newline at end of file
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index c013bc7c..5f8ddb7e 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -30,12 +30,12 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
-import { computed, onMounted } from 'vue';
+import { computed } from 'vue';
 import { useStore } from 'vuex';
 import { translate } from '@/i18n';
 
@@ -45,11 +45,11 @@ const router = useRouter()
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
-onMounted(async() => {
+onIonViewWillEnter(async() => {
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
 })
 
 function CreateThreshold() {
-  router.replace({ path: '/create-threshold' })
+  router.push({ path: '/create-threshold' })
 }
 </script>

From 8ca24edf7a9c6b06c1512d97004e57c182e92e23 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 23 Apr 2024 11:26:16 +0530
Subject: [PATCH 077/250] Implemented: logic to fetch and show all the
 facilities in the link facilities to group modal (#258)

---
 src/components/LinkFacilitiesToGroupModal.vue | 40 +++++++++----------
 src/services/ChannelService.ts                |  4 +-
 src/services/UtilService.ts                   |  4 +-
 src/store/modules/channel/actions.ts          |  3 +-
 src/store/modules/util/UtilState.ts           |  3 +-
 src/store/modules/util/actions.ts             | 21 +++++++++-
 src/store/modules/util/getters.ts             |  3 ++
 src/store/modules/util/index.ts               |  1 +
 src/store/modules/util/mutation-types.ts      |  1 +
 src/store/modules/util/mutations.ts           |  3 ++
 src/views/InventoryChannels.vue               |  1 +
 11 files changed, 56 insertions(+), 28 deletions(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 9b06f4a4..39275f2d 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -11,30 +11,14 @@
   </ion-header>
 
   <ion-content>
-    <ion-searchbar />
+    <ion-searchbar v-model="queryString" @keyup.enter="getFilteredFacilities()" />
 
     <ion-list>
-      <ion-item lines="none">
+      <ion-item lines="none" v-for="facility in filteredFacilities" :key="facility.facilityId">
         <ion-checkbox>
           <ion-label>
-            {{ "facilityName" }}
-            <p>{{ "facilityId" }}</p>
-          </ion-label>
-        </ion-checkbox>
-      </ion-item>
-      <ion-item lines="none">
-        <ion-checkbox>
-          <ion-label>
-            {{ "facilityName" }}
-            <p>{{ "facilityId" }}</p>
-          </ion-label>
-        </ion-checkbox>
-      </ion-item>
-      <ion-item lines="none">
-        <ion-checkbox>
-          <ion-label>
-            {{ "facilityName" }}
-            <p>{{ "facilityId" }}</p>
+            {{ facility.facilityName }}
+            <p>{{ facility.facilityId }}</p>
           </ion-label>
         </ion-checkbox>
       </ion-item> 
@@ -52,4 +36,20 @@
 import { IonButton, IonButtons, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@/i18n'
+import { computed, onMounted, ref } from "vue";
+import { useStore } from "vuex";
+
+const store = useStore();
+const filteredFacilities = ref([]);
+const queryString = ref('');
+
+const facilities = computed(() => store.getters["util/getFacilities"])
+
+onMounted(() => {
+  filteredFacilities.value = JSON.parse(JSON.stringify(facilities.value));
+})
+
+function getFilteredFacilities() {
+  filteredFacilities.value = JSON.parse(JSON.stringify(facilities.value.filter((facility: any) => facility.facilityName.toLowerCase().includes(queryString.value.toLowerCase()))))
+}
 </script>
\ No newline at end of file
diff --git a/src/services/ChannelService.ts b/src/services/ChannelService.ts
index a13fd515..09416bc3 100644
--- a/src/services/ChannelService.ts
+++ b/src/services/ChannelService.ts
@@ -17,6 +17,6 @@ const fetchGroupConfigFacilities = async (payload: any): Promise <any>  => {
 }
 
 export const ChannelService = {
-  fetchInventoryChannels,
-  fetchGroupConfigFacilities
+  fetchGroupConfigFacilities,
+  fetchInventoryChannels
 }
\ No newline at end of file
diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
index cc5b6087..757c7406 100644
--- a/src/services/UtilService.ts
+++ b/src/services/UtilService.ts
@@ -8,7 +8,7 @@ const fetchFacets = async (payload: any): Promise<any> => {
   });
 }
 
-const fetchConfigFacilities = async (payload: any): Promise <any>  => {
+const fetchFacilities = async (payload: any): Promise <any>  => {
   return api({
     url: `productStores/${payload.productStoreId}/facilities`,
     method: "GET",
@@ -17,6 +17,6 @@ const fetchConfigFacilities = async (payload: any): Promise <any>  => {
 }
 
 export const UtilService = {
-  fetchConfigFacilities,
+  fetchFacilities,
   fetchFacets
 }
\ No newline at end of file
diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index 1836be65..535e8575 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -5,7 +5,7 @@ import ChannelState from './ChannelState'
 import { ChannelService } from '@/services/ChannelService'
 import { hasError } from '@/utils'
 import logger from '@/logger'
-
+import store from "@/store"
 
 const actions: ActionTree<ChannelState, RootState> = {
 
@@ -23,7 +23,6 @@ const actions: ActionTree<ChannelState, RootState> = {
 
         inventoryChannels.map(async (channel: any) => {
           const facilities = await dispatch('fetchGroupConfigFacilities', channel.facilityGroupId)
-          console.log('ok', facilities);
         })
       } else {
         throw resp.data
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index b1c6e0fa..58f6ae0b 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -1,4 +1,5 @@
 export default interface UtilState {
   configFacilities: any;
-  appliedFilters: any; 
+  appliedFilters: any;
+  facilities: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index c5414edc..dca903ee 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -15,7 +15,7 @@ const actions: ActionTree<UtilState, RootState> = {
     if(configFacilities.length) return;
 
     try {
-      const resp = await UtilService.fetchConfigFacilities({ facilityTypeId: 'CONFIGURATION', productStoreId: store.state.user.currentEComStore.productStoreId });
+      const resp = await UtilService.fetchFacilities({ facilityTypeId: 'CONFIGURATION', productStoreId: store.state.user.currentEComStore.productStoreId });
 
       if(!hasError(resp)) {
         configFacilities = resp.data;
@@ -28,6 +28,25 @@ const actions: ActionTree<UtilState, RootState> = {
     commit(types.UTIL_CONFIG_FACILITES_UPDATED, configFacilities)
   },
 
+  async fetchFacilities ({ commit, state }) {
+    let facilities = JSON.parse(JSON.stringify(state.facilities))
+
+    if(facilities.length) return;
+
+    try {
+      const resp = await UtilService.fetchFacilities({ productStoreId: store.state.user.currentEComStore.productStoreId });
+
+      if(!hasError(resp)) {
+        facilities = resp.data;
+      } else {
+        throw resp.data
+      }
+    } catch (err: any) {
+      logger.error(err)
+    }
+    commit(types.UTIL_FACILITES_UPDATED, facilities)
+  },
+
   async updateAppliedFilters ({ commit, state }, payload) {
     commit(types.UTIL_APPLIED_FILTERS_UPDATED, payload)
   },
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 6c38ba9a..3b77005c 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -6,6 +6,9 @@ const getters: GetterTree<UtilState, RootState> = {
   getConfigFacilities(state) {
     return state.configFacilities ? JSON.parse(JSON.stringify(state.configFacilities)) : []
   },
+  getFacilities(state) {
+    return state.facilities ? JSON.parse(JSON.stringify(state.facilities)) : []
+  },
   getAppliedFilters(state) {
     return state.appliedFilters;
   },
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 96b8d892..646943c9 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -9,6 +9,7 @@ const utilModule: Module<UtilState, RootState> = {
   namespaced: true,
   state: {
     configFacilities: [],
+    facilities: [],
     appliedFilters: {
       included: {
         tags: [],
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 106235a9..9d493514 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -1,4 +1,5 @@
 export const SN_UTIL = 'util'
 export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDATED'
+export const UTIL_FACILITES_UPDATED = SN_UTIL + '/FACILITES_UPDATED'
 export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
 export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index d1943ccc..44082141 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -9,6 +9,9 @@ const mutations: MutationTree <UtilState> = {
   [types.UTIL_APPLIED_FILTERS_UPDATED] (state, payload) {
     state.appliedFilters = payload
   },
+  [types.UTIL_FACILITES_UPDATED] (state, payload) {
+    state.facilities = payload
+  },
   [types.UTIL_CLEARED] (state) {
     state.configFacilities = [],
     state.appliedFilters = {
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 75f13416..68315c6e 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -142,6 +142,7 @@ const configFacilities = computed(() => store.getters["util/fetchConfigFacilitie
 onMounted(async () => {
   await store.dispatch("channel/fetchInventoryChannels");
   await store.dispatch("util/fetchConfigFacilities");
+  await store.dispatch("util/fetchFacilities");
 })
 
 

From fa74138f41ea849799349219aae2cd3d27776532 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 23 Apr 2024 14:40:36 +0530
Subject: [PATCH 078/250] Implemented: logic to update group name and
 description (#258)

---
 src/components/EditGroupModal.vue    | 80 ++++++++++++++++++++++++++++
 src/locales/en.json                  |  3 ++
 src/services/ChannelService.ts       | 11 +++-
 src/store/modules/channel/actions.ts | 10 ++++
 src/views/InventoryChannels.vue      | 14 ++++-
 5 files changed, 116 insertions(+), 2 deletions(-)
 create mode 100644 src/components/EditGroupModal.vue

diff --git a/src/components/EditGroupModal.vue b/src/components/EditGroupModal.vue
new file mode 100644
index 00000000..fb02296d
--- /dev/null
+++ b/src/components/EditGroupModal.vue
@@ -0,0 +1,80 @@
+<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("Edit group") }}</ion-title>
+    </ion-toolbar>
+  </ion-header>
+
+  <ion-content>
+    <ion-list>
+      <ion-item>
+        <ion-input :label="translate('Name')" labelPlacement="floating" v-model="formData.name"/>
+      </ion-item>
+      <ion-item>
+        <ion-textarea :label="translate('Description')" labelPlacement="floating" v-model="formData.description" />
+      </ion-item>
+    </ion-list>
+  </ion-content>
+
+  <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab-button :disabled="!isGroupUpdated()" @click="updateGroup()">
+      <ion-icon :icon="saveOutline" />
+    </ion-fab-button>
+  </ion-fab>
+</template>
+
+<script setup lang="ts">
+import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonList, IonTextarea, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { closeOutline, saveOutline } from "ionicons/icons";
+import { translate } from "@/i18n";
+import { defineProps, onMounted, ref } from "vue";
+import logger from "@/logger";
+import { hasError, showToast } from "@/utils";
+import { ChannelService } from '@/services/ChannelService'
+import store from "@/store";
+
+const props = defineProps(["group"])
+const formData = ref({
+  name: "",
+  description: ""
+})
+
+onMounted(() => {
+  formData.value.name = props.group.facilityGroupName
+  formData.value.description = props.group.description
+})
+
+function isGroupUpdated() {
+  return formData.value.name !== props.group.facilityGroupName || formData.value.description !== props.group.description
+}
+
+async function updateGroup() {
+  try {
+    const resp = await ChannelService.updateGroup({
+      facilityGroupId: props.group.facilityGroupId,
+      facilityGroupName: formData.value.name,
+      description: formData.value.description
+    })
+
+    if(!hasError(resp)) {
+      store.dispatch("channel/updateGroup", { facilityGroupId: props.group.facilityGroupId, facilityGroupName: formData.value.name, description: formData.value.description })
+      showToast(translate("Group updated successfully."))
+      modalController.dismiss();
+    } else {
+      throw resp.data;
+    }
+  } catch(err) {
+    showToast(translate("Failed to edit group."))
+    logger.error(err);
+  }
+}
+
+function closeModal() {
+  modalController.dismiss();
+}
+</script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index dfbce0de..a6b6f3c9 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -35,6 +35,7 @@
   "Don't skip": "Don't skip",
   "Download": "Download",
   "Download data in csv": "Download data in csv",
+  "Edit group": "Edit group",
   "Edit name": "Edit name",
   "Edit rule": "Edit rule",
   "Edit safety stock": "Edit safety stock",
@@ -56,6 +57,7 @@
   "Failed": "Failed",
   "Failed to create rule.": "Failed to create rule.",
   "Failed to disable rule group.": "Failed to disable rule group.",
+  "Failed to edit group.": "Failed to edit group.",
   "Failed to fetch rule information.": "Failed to fetch rule information.",
   "Failed to update config facilities.": "Failed to update config facilities.",
   "Failed to update product filters.": "Failed to update product filters.",
@@ -78,6 +80,7 @@
   "Inventory channels": "Inventory channels",
   "global threshold": "global threshold",
   "Group history": "Group history",
+  "Group updated successfully.": "Group updated successfully.",
   "included": "included",
   "Include": "Include {label}",
   "Info": "Info",
diff --git a/src/services/ChannelService.ts b/src/services/ChannelService.ts
index 09416bc3..219ff1ab 100644
--- a/src/services/ChannelService.ts
+++ b/src/services/ChannelService.ts
@@ -16,7 +16,16 @@ const fetchGroupConfigFacilities = async (payload: any): Promise <any>  => {
   });
 }
 
+const updateGroup = async (payload: any): Promise <any>  => {
+  return api({
+    url: `facilityGroups/${payload.facilityGroupId}`,
+    method: "PUT",
+    params: payload
+  });
+}
+
 export const ChannelService = {
   fetchGroupConfigFacilities,
-  fetchInventoryChannels
+  fetchInventoryChannels,
+  updateGroup
 }
\ No newline at end of file
diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index 535e8575..3cd6265c 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -50,6 +50,16 @@ const actions: ActionTree<ChannelState, RootState> = {
     return groupConfigFacilities
   },
 
+  async updateGroup ({ commit, state }, payload) {
+    const groups = JSON.parse(JSON.stringify(state.inventoryChannels))
+
+    const selectedGroup = groups.find((group: any) => group.facilityGroupId === payload.facilityGroupId)
+    selectedGroup.facilityGroupName = payload.facilityGroupName
+    selectedGroup.description = payload.description
+
+    commit(types.CHANNEL_INVENTORY_CHANNELS_UPDATED, groups);
+  },
+
   async clearChannelState({ commit }) {
     commit(types.CHANNEL_CLEARED)
   },
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 68315c6e..91cbb533 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -60,7 +60,7 @@
               </ion-item>
   
               <ion-item lines="none">
-                <ion-button fill="clear">{{ translate("View details") }}</ion-button>
+                <ion-button fill="clear" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
                 <ion-button color="medium" fill="clear" slot="end">
                   <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
                 </ion-button>
@@ -131,6 +131,7 @@ import CreateGroupModal from '@/components/CreateGroupModal.vue'
 import LinkFacilitiesToGroupModal from '@/components/LinkFacilitiesToGroupModal.vue'
 import LinkThresholdFacilitiesToGroupModal from '@/components/LinkThresholdFacilitiesToGroupModal.vue'
 import { useStore } from 'vuex';
+import EditGroupModal from '@/components/EditGroupModal.vue';
 
 const store = useStore();
 
@@ -156,6 +157,17 @@ async function openShopActionsPopover(event: Event) {
   return popover.present();
 }
 
+async function openEditGroupModal(group: any) {
+  const modal = await modalController.create({
+    component: EditGroupModal,
+    componentProps: {
+      group
+    },
+  })
+
+  modal.present()
+}
+
 async function openCreateGroupModal() {
   const popover = await modalController.create({
     component: CreateGroupModal

From 6ca9a06609159317eff0385cd81f2b4303ae3222 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 24 Apr 2024 10:47:18 +0530
Subject: [PATCH 079/250] Improved: code to render facility count on the group
 card, logic for association of facilities and group (#258)

---
 .../LinkThresholdFacilitiesToGroupModal.vue   | 56 +++++++++++++++++--
 src/locales/en.json                           |  2 +
 src/services/ChannelService.ts                | 13 ++++-
 src/store/modules/channel/actions.ts          | 42 +++++++-------
 src/views/InventoryChannels.vue               | 26 ++++++---
 5 files changed, 103 insertions(+), 36 deletions(-)

diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index dda36b9b..f9581f3f 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -11,9 +11,9 @@
   </ion-header>
 
   <ion-content>
-    <ion-radio-group v-if="configFacilities.length">
+    <ion-radio-group v-if="configFacilities.length" v-model="selectedValue">
       <ion-item v-for="facility in configFacilities" :key="facility.facilityId">
-        <ion-radio>
+        <ion-radio :value="facility.facilityId">
           <ion-label>
             {{ facility.facilityName }}
             <p>{{ facility.facilityId }}</p>
@@ -23,7 +23,7 @@
     </ion-radio-group>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button @click="saveFacility()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -35,8 +35,56 @@ import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, Ion
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@/i18n'
 import { useStore } from "vuex";
-import { computed } from "vue";
+import { computed, defineProps, onMounted, ref } from "vue";
+import { hasError, showToast } from "@/utils";
+import { ChannelService } from '@/services/ChannelService';
+import logger from "@/logger";
+import { DateTime } from "luxon";
+import { modalController } from "@ionic/core";
 
 const store = useStore();
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
+
+const props = defineProps(["group", "selectedConfigFacilityId"]);
+const selectedValue = ref("");
+
+onMounted(() => {
+  selectedValue.value = props.selectedConfigFacilityId?.facilityId ? JSON.parse(JSON.stringify(props.selectedConfigFacilityId.facilityId)) : '';
+})
+
+async function saveFacility() {
+  if(!selectedValue.value) {
+    showToast(translate("Please select a facility to update."))
+    return;
+  }
+  let resp = {} as any;
+  
+  try {
+    if(props.selectedConfigFacilityId?.facilityId) {
+      resp = await ChannelService.updateFacilityAssociationWithGroup({
+        facilityGroupId: props.group.facilityGroupId,
+        facilityId: props.selectedConfigFacilityId.facilityId,
+        fromDate: props.selectedConfigFacilityId.fromDate
+      });
+      if(hasError(resp)) {
+        throw resp.data;
+      }
+    }
+
+    resp = await ChannelService.updateFacilityAssociationWithGroup({
+      facilityGroupId: props.group.facilityGroupId,
+      facilityId: selectedValue.value,
+      fromDate: DateTime.now().toMillis()
+    });
+    if(!hasError(resp)) {
+      showToast(translate("Threshold facility updated successfully."))
+      modalController.dismiss();
+    } else {
+      throw resp.data;
+    }
+  } catch(err: any) {
+    logger.error(err)
+    showToast(translate("Failed to update threshold facility."))
+  }
+}
 </script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index a6b6f3c9..070c884e 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -137,6 +137,7 @@
   "Ready to create an app?": "Ready to create an app?",
   "Reorder export jobs": "Reorder export jobs",
   "reset": "reset",
+  "retail facilities": "{count} retail facilities",
   "retry": "retry",
   "Rule Configuration": "Rule Configuration",
   "Rule created successfully.": "Rule created successfully.",
@@ -224,6 +225,7 @@
   "virtual, ": "virtual, ",
   "variants": "variants",
   "Version: ": "Version: {appVersion}",
+  "warehouse": "{count} warehouse",
   "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems": "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems",
   "You do not have permission to access this page": "You do not have permission to access this page",
   "You do not have permission to access the app.": "You do not have permission to access the app."
diff --git a/src/services/ChannelService.ts b/src/services/ChannelService.ts
index 219ff1ab..b5bc224b 100644
--- a/src/services/ChannelService.ts
+++ b/src/services/ChannelService.ts
@@ -8,7 +8,7 @@ const fetchInventoryChannels = async (payload: any): Promise <any>  => {
   });
 }
 
-const fetchGroupConfigFacilities = async (payload: any): Promise <any>  => {
+const fetchGroupFacilities = async (payload: any): Promise <any>  => {
   return api({
     url: `facilityGroups/${payload.facilityGroupId}/facilities`,
     method: "GET",
@@ -24,8 +24,17 @@ const updateGroup = async (payload: any): Promise <any>  => {
   });
 }
 
+const updateFacilityAssociationWithGroup = async (payload: any): Promise <any>  => {
+  return api({
+    url: `facilityGroups/${payload.facilityGroupId}/facilities/${payload.facilityId}/association`,
+    method: "POST",
+    params: payload
+  });
+}
+
 export const ChannelService = {
-  fetchGroupConfigFacilities,
+  updateFacilityAssociationWithGroup,
+  fetchGroupFacilities,
   fetchInventoryChannels,
   updateGroup
 }
\ No newline at end of file
diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index 3cd6265c..a5eecb13 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -11,43 +11,43 @@ const actions: ActionTree<ChannelState, RootState> = {
 
   async fetchInventoryChannels ({ commit, state, dispatch }) {
     let resp = {} as any;
-    let inventoryChannels = JSON.parse(JSON.stringify(state.inventoryChannels))
-
-    if(inventoryChannels.length) return;
+    let inventoryChannels = [] as any
 
     try {
       resp = await ChannelService.fetchInventoryChannels({ facilityGroupTypeId: "CHANNEL_FAC_GROUP" });
 
       if(!hasError(resp)) {
         inventoryChannels = resp?.data;
-
-        inventoryChannels.map(async (channel: any) => {
-          const facilities = await dispatch('fetchGroupConfigFacilities', channel.facilityGroupId)
-        })
       } else {
         throw resp.data
       }
     } catch (err: any) {
       logger.error(err)
     }
+
     commit(types.CHANNEL_INVENTORY_CHANNELS_UPDATED, inventoryChannels)
+    await dispatch('fetchGroupFacilities')
   },
+  
+  async fetchGroupFacilities ({ commit, state }) {
+    const groups = JSON.parse(JSON.stringify(state.inventoryChannels))
 
-  async fetchGroupConfigFacilities ({ commit, state }, facilityGroupId) {
-    let groupConfigFacilities = {} as any;
-
-    try {
-      const resp = await ChannelService.fetchGroupConfigFacilities({ facilityTypeId: 'CONFIGURATION', facilityGroupId: facilityGroupId });
-
-      if(!hasError(resp)) {
-        groupConfigFacilities = resp.data;
-      } else {
-        throw resp.data
+    await Promise.allSettled(groups.map(async (group: any) => {
+      try {
+        const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId: group.facilityGroupId });
+  
+        if(!hasError(resp)) {
+           group.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
+           group.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
+        } else {
+          throw resp.data
+        }
+      } catch (err: any) {
+        logger.error(err)
       }
-    } catch (err: any) {
-      logger.error(err)
-    }
-    return groupConfigFacilities
+    }))
+
+    commit(types.CHANNEL_INVENTORY_CHANNELS_UPDATED, groups)
   },
 
   async updateGroup ({ commit, state }, payload) {
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 91cbb533..a6462455 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -33,10 +33,10 @@
             <ion-item lines="full">
               <ion-icon slot="start" :icon="globeOutline"/>
               <ion-label>
-                {{ "<threshold facility name>" }}
-                <p>{{ "<facilityId>" }}</p>
+                {{ channel.selectedConfigFacility?.facilityName }}
+                <p>{{ channel.selectedConfigFacility?.facilityId }}</p>
               </ion-label>
-              <ion-button slot="end" fill="clear" color="medium" @click="openLinkThresholdFacilitiesToGroupModal()">
+              <ion-button slot="end" fill="clear" color="medium" @click="openLinkThresholdFacilitiesToGroupModal(channel)">
                 <ion-icon :icon="optionsOutline" slot="icon-only" />
               </ion-button>
             </ion-item>
@@ -51,12 +51,12 @@
 
               <ion-item>
                 <ion-icon slot="start" :icon="storefrontOutline"/>
-                <ion-label>{{ "15 retail facilities" }}</ion-label>
+                <ion-label>{{ translate("retail facilities", { count: getFacilityCount(channel, "RETAIL_STORE") })}}</ion-label>
               </ion-item>
-
+              
               <ion-item lines="full">
                 <ion-icon slot="start" :icon="businessOutline"/>
-                <ion-label>{{ "1 warehouse" }}</ion-label>
+                <ion-label>{{ translate("warehouse", { count: getFacilityCount(channel, "WAREHOUSE") })}}</ion-label>
               </ion-item>
   
               <ion-item lines="none">
@@ -138,7 +138,6 @@ const store = useStore();
 const selectedSegment = ref("channels")
 
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
-const configFacilities = computed(() => store.getters["util/fetchConfigFacilities"])
 
 onMounted(async () => {
   await store.dispatch("channel/fetchInventoryChannels");
@@ -184,13 +183,22 @@ async function openLinkFacilitiesToGroupModal() {
   return popover.present();
 }
 
-async function openLinkThresholdFacilitiesToGroupModal() {
+async function openLinkThresholdFacilitiesToGroupModal(channel: any) {
   const popover = await modalController.create({
-    component: LinkThresholdFacilitiesToGroupModal
+    component: LinkThresholdFacilitiesToGroupModal,
+    componentProps: {
+      group: channel,
+      selectedConfigFacilityId: channel.selectedConfigFacility
+    }
   });
 
   return popover.present();
 }
+
+function getFacilityCount(group: any, facilityTypeId: string) {
+  return group.selectedFacilities?.length ? group.selectedFacilities.filter((facility: any) => facility.facilityTypeId === facilityTypeId).length : 0;
+}
+
 </script>
 
 <style scoped>

From f100eccd5dda7eeef0288dd5ac345ad06f2a98e0 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 24 Apr 2024 11:28:22 +0530
Subject: [PATCH 080/250] Implemented: logic to associate and dissociate
 facilities to a facility group (#258)

---
 src/components/LinkFacilitiesToGroupModal.vue | 67 +++++++++++++++++--
 .../LinkThresholdFacilitiesToGroupModal.vue   |  1 +
 src/views/InventoryChannels.vue               | 10 ++-
 3 files changed, 70 insertions(+), 8 deletions(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 39275f2d..00b28e28 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -14,8 +14,8 @@
     <ion-searchbar v-model="queryString" @keyup.enter="getFilteredFacilities()" />
 
     <ion-list>
-      <ion-item lines="none" v-for="facility in filteredFacilities" :key="facility.facilityId">
-        <ion-checkbox>
+      <ion-item lines="none" v-for="facility in filteredFacilities" :key="facility.facilityId" @click="updateSelectedFacilities(facility.facilityId)">
+        <ion-checkbox :checked="isFacilitySelected(facility.facilityId)">
           <ion-label>
             {{ facility.facilityName }}
             <p>{{ facility.facilityId }}</p>
@@ -25,7 +25,7 @@
     </ion-list>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button>
+      <ion-fab-button :disabled="!areFacilitiesUpdated()" @click="saveFacilities()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -33,23 +33,80 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonButtons, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
+import { IonButton, IonButtons, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@/i18n'
-import { computed, onMounted, ref } from "vue";
+import { computed, defineProps, onMounted, ref } from "vue";
 import { useStore } from "vuex";
+import { DateTime } from "luxon";
+import { ChannelService } from "@/services/ChannelService";
+import { showToast } from "@/utils";
 
 const store = useStore();
 const filteredFacilities = ref([]);
 const queryString = ref('');
+const selectedFacilityValues = ref([]) as any;
 
+const props = defineProps(["group", "selectedFacilities"]);
 const facilities = computed(() => store.getters["util/getFacilities"])
 
 onMounted(() => {
   filteredFacilities.value = JSON.parse(JSON.stringify(facilities.value));
+  selectedFacilityValues.value = JSON.parse(JSON.stringify(props.selectedFacilities));
 })
 
 function getFilteredFacilities() {
   filteredFacilities.value = JSON.parse(JSON.stringify(facilities.value.filter((facility: any) => facility.facilityName.toLowerCase().includes(queryString.value.toLowerCase()))))
 }
+
+function isFacilitySelected(facilityId: any) {
+  return selectedFacilityValues.value.some((facility: any) => facility.facilityId === facilityId)
+}
+
+function updateSelectedFacilities(id: string) {
+  const facility = isFacilitySelected(id)
+
+  if (facility) {
+    selectedFacilityValues.value = selectedFacilityValues.value.filter((facility: any) => facility.facilityId !== id)
+  } else {
+    selectedFacilityValues.value.push(filteredFacilities.value.find((facility: any) => facility.facilityId == id))
+  }
+}
+
+function areFacilitiesUpdated() {
+  if(props.selectedFacilities.length !== selectedFacilityValues.value.length) return true;
+
+  return selectedFacilityValues.value.some((selectedFacility: any) => !props.selectedFacilities.find((facility: any) => facility.facilityId === selectedFacility.facilityId))
+}
+
+function saveFacilities() {
+  const facilitiesToAdd = selectedFacilityValues.value.filter((selectedFacility: any) => !props.selectedFacilities.some((facility: any) => facility.facilityId === selectedFacility.facilityId))
+    const facilitiesToRemove = props.selectedFacilities.filter((facility: any) => !selectedFacilityValues.value.some((selectedFacility: any) => facility.facilityId === selectedFacility.facilityId))
+
+    const removeResponses = await Promise.allSettled(facilitiesToRemove
+      .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
+        "facilityId": facility.facilityId,
+        "facilityGroupId": props.group.facilityGroupId,
+        "fromDate": facility.fromDate,
+        "thruDate": DateTime.now().toMillis()
+      }))
+    )
+
+    const addResponses = await Promise.allSettled(facilitiesToAdd
+      .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
+        "facilityId": facility.facilityId,
+        "facilityGroupId": props.group.facilityGroupId,
+        "fromDate": DateTime.now().toMillis()
+      }))
+    )
+
+    const hasFailedResponse = [...removeResponses, ...addResponses].some((response: any) => response.status === 'rejected')
+    if (hasFailedResponse) {
+      showToast(translate("Failed to associate some facilites to group."))
+    } else {
+      showToast(translate("Facilities associated to group successfully."))
+    }
+    await store.dispatch("channel/fetchInventoryChannels");
+    modalController.dismiss()  
+}
 </script>
\ No newline at end of file
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index f9581f3f..b63d6e0f 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -86,5 +86,6 @@ async function saveFacility() {
     logger.error(err)
     showToast(translate("Failed to update threshold facility."))
   }
+  await store.dispatch("channel/fetchInventoryChannels");
 }
 </script>
\ No newline at end of file
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index a6462455..9f7c502d 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -44,7 +44,7 @@
             <ion-list>
               <ion-item-divider color="light">
                 <ion-label>{{ translate("Facilities") }}</ion-label>
-                <ion-button slot="end" fill="clear" color="medium" @click="openLinkFacilitiesToGroupModal()">
+                <ion-button slot="end" fill="clear" color="medium" @click="openLinkFacilitiesToGroupModal(channel)">
                   <ion-icon :icon="optionsOutline" slot="icon-only" />
                 </ion-button>
               </ion-item-divider>
@@ -175,9 +175,13 @@ async function openCreateGroupModal() {
   return popover.present();
 }
 
-async function openLinkFacilitiesToGroupModal() {
+async function openLinkFacilitiesToGroupModal(group: any) {
   const popover = await modalController.create({
-    component: LinkFacilitiesToGroupModal
+    component: LinkFacilitiesToGroupModal,
+    componentProps: {
+      group,
+      selectedFacilties: group.selectedFacilities
+    }
   });
 
   return popover.present();

From 83f168b9de7581427110052367110e175dfd4b7b Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 24 Apr 2024 11:29:52 +0530
Subject: [PATCH 081/250] Improved: added the missing async keyword on save
 function (#258)

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

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 00b28e28..f6ddfe51 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -79,7 +79,7 @@ function areFacilitiesUpdated() {
   return selectedFacilityValues.value.some((selectedFacility: any) => !props.selectedFacilities.find((facility: any) => facility.facilityId === selectedFacility.facilityId))
 }
 
-function saveFacilities() {
+async function saveFacilities() {
   const facilitiesToAdd = selectedFacilityValues.value.filter((selectedFacility: any) => !props.selectedFacilities.some((facility: any) => facility.facilityId === selectedFacility.facilityId))
     const facilitiesToRemove = props.selectedFacilities.filter((facility: any) => !selectedFacilityValues.value.some((selectedFacility: any) => facility.facilityId === selectedFacility.facilityId))
 

From ab094f453d689a972842068c0c80e425ab0df3d3 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 24 Apr 2024 14:59:57 +0530
Subject: [PATCH 082/250] Implemented: logic for creation of new inventory
 channels (#258)

---
 src/components/CreateGroupModal.vue           | 147 +++++++++++++++++-
 .../LinkThresholdFacilitiesToGroupModal.vue   |   3 +-
 src/locales/en.json                           |   3 +
 src/services/ChannelService.ts                |  40 ++++-
 src/utils/index.ts                            |   6 +-
 5 files changed, 190 insertions(+), 9 deletions(-)

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index f9de6824..31f9a4c5 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -13,30 +13,167 @@
   <ion-content>
     <ion-list>
       <ion-item>
-        <ion-input :label="translate('Name')" labelPlacement="floating" />
+        <ion-input labelPlacement="floating" v-model="formData.facilityGroupName" @ionBlur="formData.facilityGroupId ? null : setFacilityGroupId($event)">
+          <div slot="label">{{ translate('Name') }} <ion-text color="danger">*</ion-text></div>
+        </ion-input>
       </ion-item>
       <ion-item lines="none">
-        <ion-input :label="translate('ID')" labelPlacement="floating" :errorText="translate('Internal ID cannot be more than 20 characters.')" />
+        <ion-input :label="translate('ID')" labelPlacement="floating" ref="facilityGroupId" v-model="formData.facilityGroupId" @ionInput="validateFacilityGroupId" @ionBlur="markFacilityGroupIdTouched" :error-text="translate('Internal ID cannot be more than 20 characters.')" />
       </ion-item>
       <ion-item>
-        <ion-textarea :label="translate('Description')" labelPlacement="floating" />
+        <ion-textarea :label="translate('Description')" v-model="formData.description" labelPlacement="floating" />
+      </ion-item>
+      <ion-item lines="none">
+        <ion-label>{{ translate("Product store") }}</ion-label>
+        <ion-label slot="end">{{ eComStore.storeName }}</ion-label>
+      </ion-item>
+      <ion-item lines="none">
+        <ion-select :label="translate('Group level configurations')" v-model="selectedConfigFacilityId" interface="popover">
+          <ion-select-option value="new">{{ translate("Create new") }}</ion-select-option>
+          <ion-select-option v-for="facility in configFacilities" :key="facility.facilityId" :value="facility.facilityId" >{{ facility.facilityName }}</ion-select-option>
+        </ion-select>
       </ion-item>
     </ion-list>
   </ion-content>
 
   <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-    <ion-fab-button>
+    <ion-fab-button @click="createGroup()">
       <ion-icon :icon="checkmarkDone" />
     </ion-fab-button>
   </ion-fab>
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonList, IonTextarea, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonList, IonSelect, IonSelectOption, IonText, IonTextarea, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, checkmarkDone } from "ionicons/icons";
 import { translate } from "@/i18n";
+import { useStore } from "vuex";
+import { computed, ref } from "vue";
+import { generateInternalId, hasError, showToast } from "@/utils";
+import logger from "@/logger";
+import { ChannelService } from "@/services/ChannelService";
+import { DateTime } from "luxon";
+
+const store = useStore();
+
+const formData = ref({
+  facilityGroupName: "",
+  facilityGroupId: "",
+  description: "",
+}) as any;
+const selectedConfigFacilityId = ref("new");
+const facilityGroupId = ref("") as any;
+
+const eComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 
 function closeModal() {
   modalController.dismiss();
 }
+
+async function createGroup() {
+  if (!formData.value.facilityGroupName?.trim()) {
+    showToast(translate('Please fill all the required fields'))
+    return;
+  }
+
+  if (formData.value.facilityGroupId.length > 20) {
+    showToast(translate('Internal ID cannot be more than 20 characters.'))
+    return
+  }
+
+  // In case the user does not lose focus from the facility name input
+  // and click on create the button, we need to set the internal id manually
+  if (!formData.value.facilityGroupId) {
+    formData.value.facilityGroupId = generateInternalId(formData.value.facilityGroupName)
+  }
+
+  let resp = {} as any;
+  try {
+    // Creating a new inventory channel group.
+    resp = await ChannelService.createFacilityGroup({ ...formData.value, "facilityGroupTypeId" : "CHANNEL_FAC_GROUP" });
+    if(hasError(resp)) {
+      throw resp.data;
+    }
+
+    // Creating a new config facility or associating an existing one with the created group.
+    let selectedConfigFacility = {} as any;
+    if(selectedConfigFacilityId.value === 'new') {
+      selectedConfigFacility = {
+        facilityName: `${formData.value.facilityGroupName} CONFIG FACILITY`,
+        facilityTypeId: "CONFIGURATION",
+        parentFacilityTypeId : "VIRTUAL_FACILITY",
+      }
+
+      resp = await ChannelService.createFacility(selectedConfigFacility);
+      if(!hasError(resp)) {
+        selectedConfigFacility = {
+          ...selectedConfigFacility,
+          facilityId: resp.data.facilityId
+        }
+      } else {
+        throw resp.data;
+      }
+    } else {
+      selectedConfigFacility = configFacilities.value.find((facility: any) => facility.facilityId === selectedConfigFacilityId.value)
+    }
+
+    // Associating the config facility with the product store.
+    resp = await ChannelService.updateFacilityAssociationWithProductStore({
+      productStoreId: eComStore.value.productStoreId,
+      facilityId: selectedConfigFacility.facilityId
+    })
+    if(hasError(resp)) {
+      throw resp.data
+    }
+
+    // Associating the facility group with the product store.
+    resp = await ChannelService.updateGroupAssociationWithProductStore({
+      productStoreId: eComStore.value.productStoreId,
+      facilityGroupId: formData.value.facilityGroupId
+    })
+    if(hasError(resp)) {
+      throw resp.data
+    }
+
+
+    // Associating the config facility with the group.
+    resp = await ChannelService.updateFacilityAssociationWithGroup({
+      facilityGroupId: formData.value.facilityGroupId,
+      facilityId: selectedConfigFacility.facilityId
+    })
+    if(hasError(resp)) {
+      throw resp.data
+    }
+
+    showToast(translate("Created inventory channel successfully."));
+    await store.dispatch("channel/fetchInventoryChannels");
+    await store.dispatch("util/fetchConfigFacilities");
+    modalController.dismiss();
+  } catch (error) {
+    logger.error(error)
+    showToast(translate("Something went wrong."))
+  }
+  modalController.dismiss()
+}
+
+function setFacilityGroupId(event: any) {
+  formData.value.facilityGroupId = generateInternalId(event.target.value)
+}
+
+function validateFacilityGroupId(event: any) {
+  const value = event.target.value;
+  facilityGroupId.value.$el.classList.remove('ion-valid');
+  facilityGroupId.value.$el.classList.remove('ion-invalid');
+
+  if (value === '') return;
+
+  formData.value.facilityGroupId.length <= 20
+    ? facilityGroupId.value.$el.classList.add('ion-valid')
+    : facilityGroupId.value.$el.classList.add('ion-invalid');
+}
+
+function markFacilityGroupIdTouched() {
+  facilityGroupId.value.$el.classList.add('ion-touched');
+}
 </script>
\ No newline at end of file
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index b63d6e0f..40bec7f7 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -64,7 +64,8 @@ async function saveFacility() {
       resp = await ChannelService.updateFacilityAssociationWithGroup({
         facilityGroupId: props.group.facilityGroupId,
         facilityId: props.selectedConfigFacilityId.facilityId,
-        fromDate: props.selectedConfigFacilityId.fromDate
+        fromDate: props.selectedConfigFacilityId.fromDate,
+        thruDate: DateTime.now().toMillis()
       });
       if(hasError(resp)) {
         throw resp.data;
diff --git a/src/locales/en.json b/src/locales/en.json
index 070c884e..a2edfaea 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -24,6 +24,7 @@
   "Confirm": "Confirm",
   "Copy details": "Copy details",
   "Create group": "Create group",
+  "Create new": "Create new",
   "Create rule": "Create rule",
   "Create Rule": "Create Rule",
   "Delete": "Delete",
@@ -69,6 +70,7 @@
   "Frequency": "Frequency",
   "Go to Launchpad": "Go to Launchpad",
   "Go to OMS": "Go to OMS",
+  "Group level configurations": "Group level configurations",
   "History": "History",
   "Hourly": "Hourly",
   "Facility groups": "Facility groups",
@@ -125,6 +127,7 @@
   "Product filters updated succesfully.": "Product filters updated succesfully.",
   "Product SKU column": "Product SKU column",
   "Product Store": "Product Store",
+  "Product store": "Product store",
   "Product tags": "Product tags",
   "Products by tags": "Products by tags",
   "Products by feature": "Products by feature",
diff --git a/src/services/ChannelService.ts b/src/services/ChannelService.ts
index b5bc224b..72812a83 100644
--- a/src/services/ChannelService.ts
+++ b/src/services/ChannelService.ts
@@ -28,13 +28,49 @@ const updateFacilityAssociationWithGroup = async (payload: any): Promise <any>
   return api({
     url: `facilityGroups/${payload.facilityGroupId}/facilities/${payload.facilityId}/association`,
     method: "POST",
-    params: payload
+    data: payload
+  });
+}
+
+const updateFacilityAssociationWithProductStore = async (payload: any): Promise <any>  => {
+  return api({
+    url: `/productStores/${payload.productStoreId}/facilities/${payload.facilityId}/association`,
+    method: "POST",
+    data: payload
+  });
+}
+
+const updateGroupAssociationWithProductStore = async (payload: any): Promise <any>  => {
+  return api({
+    url: `/productStores/${payload.productStoreId}/facilityGroups/${payload.facilityGroupId}/association`,
+    method: "POST",
+    data: payload
+  });
+}
+
+const createFacilityGroup = async (payload: any): Promise <any>  => {
+  return api({
+    url: "facilityGroups",
+    method: "POST",
+    data: payload
+  });
+}
+
+const createFacility = async (payload: any): Promise <any>  => {
+  return api({
+    url: "facilities",
+    method: "POST",
+    data: payload
   });
 }
 
 export const ChannelService = {
-  updateFacilityAssociationWithGroup,
+  createFacility,
+  createFacilityGroup,
   fetchGroupFacilities,
   fetchInventoryChannels,
+  updateFacilityAssociationWithGroup,
+  updateFacilityAssociationWithProductStore,
+  updateGroupAssociationWithProductStore,
   updateGroup
 }
\ No newline at end of file
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 5327c415..ad92e492 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -35,4 +35,8 @@ function timeTillRun(endTime: any) {
   return DateTime.local().plus(timeDiff).toRelative();
 }
 
-export { getDate, getDateAndTime, getTime, hasError, showToast, timeTillRun }
\ No newline at end of file
+const generateInternalId = (name: string) => {
+  return name.trim().toUpperCase().split(' ').join('_');
+}
+
+export { generateInternalId, getDate, getDateAndTime, getTime, hasError, showToast, timeTillRun }
\ No newline at end of file

From c151f6e21a6043c45c3b64b7b0ec5fc3e7331455 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 24 Apr 2024 16:07:49 +0530
Subject: [PATCH 083/250] Improve: lines in create group modal, added
 translation entry for missing static text and optimized code (#258)

---
 src/components/CreateGroupModal.vue           | 42 ++++---------
 src/components/EditGroupModal.vue             | 20 +++---
 src/components/LinkFacilitiesToGroupModal.vue | 61 ++++++++++---------
 .../LinkThresholdFacilitiesToGroupModal.vue   | 21 ++++---
 src/locales/en.json                           | 11 +++-
 src/store/modules/channel/ChannelState.ts     |  1 -
 src/store/modules/channel/getters.ts          |  3 -
 src/store/modules/channel/index.ts            |  3 +-
 src/store/modules/channel/mutation-types.ts   |  1 -
 src/store/modules/channel/mutations.ts        |  3 -
 src/views/InventoryChannels.vue               | 18 ++----
 11 files changed, 80 insertions(+), 104 deletions(-)

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index 31f9a4c5..87a42c28 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -14,7 +14,7 @@
     <ion-list>
       <ion-item>
         <ion-input labelPlacement="floating" v-model="formData.facilityGroupName" @ionBlur="formData.facilityGroupId ? null : setFacilityGroupId($event)">
-          <div slot="label">{{ translate('Name') }} <ion-text color="danger">*</ion-text></div>
+          <div slot="label">{{ translate("Name") }} <ion-text color="danger">*</ion-text></div>
         </ion-input>
       </ion-item>
       <ion-item lines="none">
@@ -23,11 +23,11 @@
       <ion-item>
         <ion-textarea :label="translate('Description')" v-model="formData.description" labelPlacement="floating" />
       </ion-item>
-      <ion-item lines="none">
+      <ion-item>
         <ion-label>{{ translate("Product store") }}</ion-label>
         <ion-label slot="end">{{ eComStore.storeName }}</ion-label>
       </ion-item>
-      <ion-item lines="none">
+      <ion-item>
         <ion-select :label="translate('Group level configurations')" v-model="selectedConfigFacilityId" interface="popover">
           <ion-select-option value="new">{{ translate("Create new") }}</ion-select-option>
           <ion-select-option v-for="facility in configFacilities" :key="facility.facilityId" :value="facility.facilityId" >{{ facility.facilityName }}</ion-select-option>
@@ -73,12 +73,12 @@ function closeModal() {
 
 async function createGroup() {
   if (!formData.value.facilityGroupName?.trim()) {
-    showToast(translate('Please fill all the required fields'))
+    showToast(translate("Please fill all the required fields"))
     return;
   }
 
   if (formData.value.facilityGroupId.length > 20) {
-    showToast(translate('Internal ID cannot be more than 20 characters.'))
+    showToast(translate("Internal ID cannot be more than 20 characters."))
     return
   }
 
@@ -91,7 +91,7 @@ async function createGroup() {
   let resp = {} as any;
   try {
     // Creating a new inventory channel group.
-    resp = await ChannelService.createFacilityGroup({ ...formData.value, "facilityGroupTypeId" : "CHANNEL_FAC_GROUP" });
+    resp = await ChannelService.createFacilityGroup({ ...formData.value, facilityGroupTypeId : "CHANNEL_FAC_GROUP" });
     if(hasError(resp)) {
       throw resp.data;
     }
@@ -119,34 +119,18 @@ async function createGroup() {
     }
 
     // Associating the config facility with the product store.
-    resp = await ChannelService.updateFacilityAssociationWithProductStore({
-      productStoreId: eComStore.value.productStoreId,
-      facilityId: selectedConfigFacility.facilityId
-    })
-    if(hasError(resp)) {
-      throw resp.data
-    }
+    resp = await ChannelService.updateFacilityAssociationWithProductStore({productStoreId: eComStore.value.productStoreId, facilityId: selectedConfigFacility.facilityId})
+    if(hasError(resp)) throw resp.data;
 
     // Associating the facility group with the product store.
-    resp = await ChannelService.updateGroupAssociationWithProductStore({
-      productStoreId: eComStore.value.productStoreId,
-      facilityGroupId: formData.value.facilityGroupId
-    })
-    if(hasError(resp)) {
-      throw resp.data
-    }
-
+    resp = await ChannelService.updateGroupAssociationWithProductStore({productStoreId: eComStore.value.productStoreId, facilityGroupId: formData.value.facilityGroupId})
+    if(hasError(resp)) throw resp.data;
 
     // Associating the config facility with the group.
-    resp = await ChannelService.updateFacilityAssociationWithGroup({
-      facilityGroupId: formData.value.facilityGroupId,
-      facilityId: selectedConfigFacility.facilityId
-    })
-    if(hasError(resp)) {
-      throw resp.data
-    }
+    resp = await ChannelService.updateFacilityAssociationWithGroup({facilityGroupId: formData.value.facilityGroupId, facilityId: selectedConfigFacility.facilityId})
+    if(hasError(resp)) throw resp.data;
 
-    showToast(translate("Created inventory channel successfully."));
+    showToast(translate("Group has been created successfully."));
     await store.dispatch("channel/fetchInventoryChannels");
     await store.dispatch("util/fetchConfigFacilities");
     modalController.dismiss();
diff --git a/src/components/EditGroupModal.vue b/src/components/EditGroupModal.vue
index fb02296d..1c5d53d6 100644
--- a/src/components/EditGroupModal.vue
+++ b/src/components/EditGroupModal.vue
@@ -13,7 +13,7 @@
   <ion-content>
     <ion-list>
       <ion-item>
-        <ion-input :label="translate('Name')" labelPlacement="floating" v-model="formData.name"/>
+        <ion-input :label="translate('Name')" labelPlacement="floating" v-model="formData.facilityGroupName"/>
       </ion-item>
       <ion-item>
         <ion-textarea :label="translate('Description')" labelPlacement="floating" v-model="formData.description" />
@@ -38,38 +38,34 @@ import { hasError, showToast } from "@/utils";
 import { ChannelService } from '@/services/ChannelService'
 import store from "@/store";
 
-const props = defineProps(["group"])
+const props = defineProps(["group"]);
 const formData = ref({
-  name: "",
+  facilityGroupName: "",
   description: ""
 })
 
 onMounted(() => {
-  formData.value.name = props.group.facilityGroupName
+  formData.value.facilityGroupName = props.group.facilityGroupName
   formData.value.description = props.group.description
 })
 
 function isGroupUpdated() {
-  return formData.value.name !== props.group.facilityGroupName || formData.value.description !== props.group.description
+  return formData.value.facilityGroupName !== props.group.facilityGroupName || formData.value.description !== props.group.description
 }
 
 async function updateGroup() {
   try {
-    const resp = await ChannelService.updateGroup({
-      facilityGroupId: props.group.facilityGroupId,
-      facilityGroupName: formData.value.name,
-      description: formData.value.description
-    })
+    const resp = await ChannelService.updateGroup({...formData.value, facilityGroupId: props.group.facilityGroupId})
 
     if(!hasError(resp)) {
-      store.dispatch("channel/updateGroup", { facilityGroupId: props.group.facilityGroupId, facilityGroupName: formData.value.name, description: formData.value.description })
+      store.dispatch("channel/updateGroup", { facilityGroupId: props.group.facilityGroupId, ...formData.value })
       showToast(translate("Group updated successfully."))
       modalController.dismiss();
     } else {
       throw resp.data;
     }
   } catch(err) {
-    showToast(translate("Failed to edit group."))
+    showToast(translate("Failed to update group."))
     logger.error(err);
   }
 }
diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index f6ddfe51..6b46436c 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -13,7 +13,7 @@
   <ion-content>
     <ion-searchbar v-model="queryString" @keyup.enter="getFilteredFacilities()" />
 
-    <ion-list>
+    <ion-list v-if="filteredFacilities.length">
       <ion-item lines="none" v-for="facility in filteredFacilities" :key="facility.facilityId" @click="updateSelectedFacilities(facility.facilityId)">
         <ion-checkbox :checked="isFacilitySelected(facility.facilityId)">
           <ion-label>
@@ -23,6 +23,9 @@
         </ion-checkbox>
       </ion-item> 
     </ion-list>
+    <div v-else class="empty-state">
+      <p>{{ translate("No facility found.") }}</p>
+    </div> 
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button :disabled="!areFacilitiesUpdated()" @click="saveFacilities()">
@@ -66,7 +69,7 @@ function isFacilitySelected(facilityId: any) {
 function updateSelectedFacilities(id: string) {
   const facility = isFacilitySelected(id)
 
-  if (facility) {
+  if(facility) {
     selectedFacilityValues.value = selectedFacilityValues.value.filter((facility: any) => facility.facilityId !== id)
   } else {
     selectedFacilityValues.value.push(filteredFacilities.value.find((facility: any) => facility.facilityId == id))
@@ -81,32 +84,32 @@ function areFacilitiesUpdated() {
 
 async function saveFacilities() {
   const facilitiesToAdd = selectedFacilityValues.value.filter((selectedFacility: any) => !props.selectedFacilities.some((facility: any) => facility.facilityId === selectedFacility.facilityId))
-    const facilitiesToRemove = props.selectedFacilities.filter((facility: any) => !selectedFacilityValues.value.some((selectedFacility: any) => facility.facilityId === selectedFacility.facilityId))
-
-    const removeResponses = await Promise.allSettled(facilitiesToRemove
-      .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
-        "facilityId": facility.facilityId,
-        "facilityGroupId": props.group.facilityGroupId,
-        "fromDate": facility.fromDate,
-        "thruDate": DateTime.now().toMillis()
-      }))
-    )
-
-    const addResponses = await Promise.allSettled(facilitiesToAdd
-      .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
-        "facilityId": facility.facilityId,
-        "facilityGroupId": props.group.facilityGroupId,
-        "fromDate": DateTime.now().toMillis()
-      }))
-    )
-
-    const hasFailedResponse = [...removeResponses, ...addResponses].some((response: any) => response.status === 'rejected')
-    if (hasFailedResponse) {
-      showToast(translate("Failed to associate some facilites to group."))
-    } else {
-      showToast(translate("Facilities associated to group successfully."))
-    }
-    await store.dispatch("channel/fetchInventoryChannels");
-    modalController.dismiss()  
+  const facilitiesToRemove = props.selectedFacilities.filter((facility: any) => !selectedFacilityValues.value.some((selectedFacility: any) => facility.facilityId === selectedFacility.facilityId))
+
+  const removeResponses = await Promise.allSettled(facilitiesToRemove
+    .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
+      facilityId: facility.facilityId,
+      facilityGroupId: props.group.facilityGroupId,
+      fromDate: facility.fromDate,
+      thruDate: DateTime.now().toMillis()
+    }))
+  )
+
+  const addResponses = await Promise.allSettled(facilitiesToAdd
+    .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
+      facilityId: facility.facilityId,
+      facilityGroupId: props.group.facilityGroupId,
+      fromDate: DateTime.now().toMillis()
+    }))
+  )
+
+  const hasFailedResponse = [...removeResponses, ...addResponses].some((response: any) => response.status === 'rejected')
+  if(hasFailedResponse) {
+    showToast(translate("Failed to associate some facilites to group."))
+  } else {
+    showToast(translate("Facilities associated to group successfully."))
+  }
+  await store.dispatch("channel/fetchInventoryChannels");
+  modalController.dismiss()  
 }
 </script>
\ No newline at end of file
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index 40bec7f7..5468ec2b 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -11,7 +11,7 @@
   </ion-header>
 
   <ion-content>
-    <ion-radio-group v-if="configFacilities.length" v-model="selectedValue">
+    <ion-radio-group v-if="configFacilities.length" v-model="selectedFacilityId">
       <ion-item v-for="facility in configFacilities" :key="facility.facilityId">
         <ion-radio :value="facility.facilityId">
           <ion-label>
@@ -22,6 +22,10 @@
       </ion-item>
     </ion-radio-group>
 
+    <div v-else class="empty-state">
+      <p>{{ translate("No facility found.") }}</p>
+    </div> 
+
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFacility()">
         <ion-icon :icon="saveOutline" />
@@ -31,7 +35,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonRadio, IonRadioGroup, IonSearchbar, IonTitle, IonToolbar } from "@ionic/vue";
+import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonRadio, IonRadioGroup, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@/i18n'
 import { useStore } from "vuex";
@@ -40,20 +44,19 @@ import { hasError, showToast } from "@/utils";
 import { ChannelService } from '@/services/ChannelService';
 import logger from "@/logger";
 import { DateTime } from "luxon";
-import { modalController } from "@ionic/core";
 
 const store = useStore();
-const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
-
+const selectedFacilityId = ref("");
 const props = defineProps(["group", "selectedConfigFacilityId"]);
-const selectedValue = ref("");
+
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 
 onMounted(() => {
-  selectedValue.value = props.selectedConfigFacilityId?.facilityId ? JSON.parse(JSON.stringify(props.selectedConfigFacilityId.facilityId)) : '';
+  selectedFacilityId.value = props.selectedConfigFacilityId?.facilityId ? JSON.parse(JSON.stringify(props.selectedConfigFacilityId.facilityId)) : '';
 })
 
 async function saveFacility() {
-  if(!selectedValue.value) {
+  if(!selectedFacilityId.value) {
     showToast(translate("Please select a facility to update."))
     return;
   }
@@ -74,7 +77,7 @@ async function saveFacility() {
 
     resp = await ChannelService.updateFacilityAssociationWithGroup({
       facilityGroupId: props.group.facilityGroupId,
-      facilityId: selectedValue.value,
+      facilityId: selectedFacilityId.value,
       fromDate: DateTime.now().toMillis()
     });
     if(!hasError(resp)) {
diff --git a/src/locales/en.json b/src/locales/en.json
index a2edfaea..bd5b4810 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -54,11 +54,14 @@
   "Export product thresholds": "Export product thresholds",
   "Export product threshold jobs": "Export product threshold jobs",
   "Facilities": "Facilities",
+  "Facilities associated to group successfully.": "Facilities associated to group successfully.",
   "Facility": "Facility",
   "Failed": "Failed",
+  "Failed to associate some facilites to group.": "Failed to associate some facilites to group.",
   "Failed to create rule.": "Failed to create rule.",
   "Failed to disable rule group.": "Failed to disable rule group.",
-  "Failed to edit group.": "Failed to edit group.",
+  "Failed to update group.": "Failed to update group.",
+  "Failed to update threshold facility.": "Failed to update threshold facility.",
   "Failed to fetch rule information.": "Failed to fetch rule information.",
   "Failed to update config facilities.": "Failed to update config facilities.",
   "Failed to update product filters.": "Failed to update product filters.",
@@ -70,6 +73,7 @@
   "Frequency": "Frequency",
   "Go to Launchpad": "Go to Launchpad",
   "Go to OMS": "Go to OMS",
+  "Group has been created successfully.": "Group has been created successfully.",
   "Group level configurations": "Group level configurations",
   "History": "History",
   "Hourly": "Hourly",
@@ -105,6 +109,7 @@
   "New store pickup rule": "New store pickup rule",
   "New threshold rule": "New threshold rule",
   "New safety stock rule": "New safety stock rule",
+  "No facility found.": "No facility found.",
   "No job found.": "No job found.",
   "No jobs have run yet": "No jobs have run yet",
   "No jobs to update": "No jobs to update",
@@ -120,6 +125,7 @@
   "Paused": "Paused",
   "Pending": "Pending",
   "Please enter a threshold value to set for these products before proceeding.": "Please enter a threshold value to set for these products before proceeding.",
+  "Please fill all the required fields": "Please fill all the required fields",
   "Product and facility": "Product and facility",
   "Product and channel": "Product and channel",
   "Product list": "Product list",
@@ -186,7 +192,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.",
-  "Something went wrong": "Something went wrong",
+  "Something went wrong.": "Something went wrong.",
   "Something went wrong while login. Please contact administrator": "Something went wrong while login. Please contact administrator.",
   "Start with Ionic": "Start with Ionic",
   "State": "State",
@@ -211,6 +217,7 @@
   "Threshold pipeline": "Threshold pipeline",
   "Rule pipeline": "Rule pipeline",
   "Rule Pipeline": "Rule Pipeline",
+  "Threshold facility updated successfully.": "Threshold facility updated successfully.",
   "Timezone": "Timezone",
   "Time zone updated successfully": "Time zone updated successfully",
   "Type": "Type",
diff --git a/src/store/modules/channel/ChannelState.ts b/src/store/modules/channel/ChannelState.ts
index bd466ffa..ad076b61 100644
--- a/src/store/modules/channel/ChannelState.ts
+++ b/src/store/modules/channel/ChannelState.ts
@@ -1,4 +1,3 @@
 export default interface ChannelState {
   inventoryChannels: any;
-  groupConfigFacilities: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/channel/getters.ts b/src/store/modules/channel/getters.ts
index f300c181..ad2fb11b 100644
--- a/src/store/modules/channel/getters.ts
+++ b/src/store/modules/channel/getters.ts
@@ -5,9 +5,6 @@ import ChannelState from './ChannelState';
 const getters: GetterTree <ChannelState, RootState> = {
   getInventoryChannels (state) {
     return state.inventoryChannels
-  },
-  getGroupConfigFacilities (state) {
-    return state.groupConfigFacilities
   }
 }
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/channel/index.ts b/src/store/modules/channel/index.ts
index 929c0a61..b1a9e8fe 100644
--- a/src/store/modules/channel/index.ts
+++ b/src/store/modules/channel/index.ts
@@ -8,8 +8,7 @@ import ChannelState from './ChannelState'
 const channelModule: Module<ChannelState, RootState> = {
   namespaced: true,
   state: {
-    inventoryChannels: [],
-    groupConfigFacilities: []
+    inventoryChannels: []
   },
   getters,
   actions,
diff --git a/src/store/modules/channel/mutation-types.ts b/src/store/modules/channel/mutation-types.ts
index 189d44f8..21c0cf83 100644
--- a/src/store/modules/channel/mutation-types.ts
+++ b/src/store/modules/channel/mutation-types.ts
@@ -1,4 +1,3 @@
 export const SN_CHANNEL = 'channel'
 export const CHANNEL_INVENTORY_CHANNELS_UPDATED = SN_CHANNEL + '/INVENTORY_CHANNELS_UPDATED'
-export const CHANNEL_GROUP_CONFIG_FACILITIES_UPDATED = SN_CHANNEL + '/GROUP_CONFIG_FACILITIES_UPDATED'
 export const CHANNEL_CLEARED = SN_CHANNEL + "/CLEARED"
\ No newline at end of file
diff --git a/src/store/modules/channel/mutations.ts b/src/store/modules/channel/mutations.ts
index cf3630e2..e94f09ef 100644
--- a/src/store/modules/channel/mutations.ts
+++ b/src/store/modules/channel/mutations.ts
@@ -6,9 +6,6 @@ const mutations: MutationTree <ChannelState> = {
   [types.CHANNEL_INVENTORY_CHANNELS_UPDATED] (state, payload) {
     state.inventoryChannels = payload;
   },
-  [types.CHANNEL_GROUP_CONFIG_FACILITIES_UPDATED] (state, payload) {
-    state.groupConfigFacilities = payload;
-  },
   [types.CHANNEL_CLEARED](state) {
     state.inventoryChannels = []
   },
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 9f7c502d..c85ae593 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -53,7 +53,7 @@
                 <ion-icon slot="start" :icon="storefrontOutline"/>
                 <ion-label>{{ translate("retail facilities", { count: getFacilityCount(channel, "RETAIL_STORE") })}}</ion-label>
               </ion-item>
-              
+
               <ion-item lines="full">
                 <ion-icon slot="start" :icon="businessOutline"/>
                 <ion-label>{{ translate("warehouse", { count: getFacilityCount(channel, "WAREHOUSE") })}}</ion-label>
@@ -159,9 +159,7 @@ async function openShopActionsPopover(event: Event) {
 async function openEditGroupModal(group: any) {
   const modal = await modalController.create({
     component: EditGroupModal,
-    componentProps: {
-      group
-    },
+    componentProps: { group }
   })
 
   modal.present()
@@ -178,22 +176,16 @@ async function openCreateGroupModal() {
 async function openLinkFacilitiesToGroupModal(group: any) {
   const popover = await modalController.create({
     component: LinkFacilitiesToGroupModal,
-    componentProps: {
-      group,
-      selectedFacilties: group.selectedFacilities
-    }
+    componentProps: { group, selectedFacilties: group.selectedFacilities }
   });
 
   return popover.present();
 }
 
-async function openLinkThresholdFacilitiesToGroupModal(channel: any) {
+async function openLinkThresholdFacilitiesToGroupModal(group: any) {
   const popover = await modalController.create({
     component: LinkThresholdFacilitiesToGroupModal,
-    componentProps: {
-      group: channel,
-      selectedConfigFacilityId: channel.selectedConfigFacility
-    }
+    componentProps: { group: group, selectedConfigFacilityId: group.selectedConfigFacility }
   });
 
   return popover.present();

From cdf54cbad582310588287cfec9a74f607c7ca5cf Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 24 Apr 2024 16:27:49 +0530
Subject: [PATCH 084/250] Improved: fetch group facilities action to fetch
 facilities for a single group, called api's in parallel (@258)

---
 src/components/LinkFacilitiesToGroupModal.vue |  4 +-
 .../LinkThresholdFacilitiesToGroupModal.vue   |  2 +-
 src/store/modules/channel/actions.ts          | 39 ++++++++++++-------
 src/views/InventoryChannels.vue               |  9 ++---
 4 files changed, 31 insertions(+), 23 deletions(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 6b46436c..72238385 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -13,7 +13,7 @@
   <ion-content>
     <ion-searchbar v-model="queryString" @keyup.enter="getFilteredFacilities()" />
 
-    <ion-list v-if="filteredFacilities.length">
+    <ion-list v-if="filteredFacilities?.length">
       <ion-item lines="none" v-for="facility in filteredFacilities" :key="facility.facilityId" @click="updateSelectedFacilities(facility.facilityId)">
         <ion-checkbox :checked="isFacilitySelected(facility.facilityId)">
           <ion-label>
@@ -109,7 +109,7 @@ async function saveFacilities() {
   } else {
     showToast(translate("Facilities associated to group successfully."))
   }
-  await store.dispatch("channel/fetchInventoryChannels");
+  await store.dispatch("channel/fetchGroupFacilities", props.group.facilityGroupId);
   modalController.dismiss()  
 }
 </script>
\ No newline at end of file
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index 5468ec2b..bc363dae 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -90,6 +90,6 @@ async function saveFacility() {
     logger.error(err)
     showToast(translate("Failed to update threshold facility."))
   }
-  await store.dispatch("channel/fetchInventoryChannels");
+  await store.dispatch("channel/fetchGroupFacilities", props.group.facilityGroupId);
 }
 </script>
\ No newline at end of file
diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index a5eecb13..78aa0235 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -29,24 +29,35 @@ const actions: ActionTree<ChannelState, RootState> = {
     await dispatch('fetchGroupFacilities')
   },
   
-  async fetchGroupFacilities ({ commit, state }) {
+  async fetchGroupFacilities ({ commit, state }, facilityGroupId) {
     const groups = JSON.parse(JSON.stringify(state.inventoryChannels))
 
-    await Promise.allSettled(groups.map(async (group: any) => {
-      try {
-        const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId: group.facilityGroupId });
-  
-        if(!hasError(resp)) {
-           group.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
-           group.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
-        } else {
-          throw resp.data
-        }
-      } catch (err: any) {
-        logger.error(err)
+    if(facilityGroupId) {
+      const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId })
+
+      if(!hasError(resp)) {
+        const currentGroup = groups.find((group: any) => group.facilityGroupId === facilityGroupId)
+        currentGroup.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
+        currentGroup.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
+      } else {
+        throw resp.data
       }
-    }))
+    } else {
+      await Promise.allSettled(groups.map(async (group: any) => {
+        try {
+          const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId: group.facilityGroupId });
 
+          if(!hasError(resp)) {
+             group.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
+             group.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
+          } else {
+            throw resp.data
+          }
+        } catch (err: any) {
+          logger.error(err)
+        }
+      }))
+    }
     commit(types.CHANNEL_INVENTORY_CHANNELS_UPDATED, groups)
   },
 
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index c85ae593..18eaaedc 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -140,12 +140,9 @@ const selectedSegment = ref("channels")
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
 
 onMounted(async () => {
-  await store.dispatch("channel/fetchInventoryChannels");
-  await store.dispatch("util/fetchConfigFacilities");
-  await store.dispatch("util/fetchFacilities");
+  await Promise.allSettled([store.dispatch("channel/fetchInventoryChannels"), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilities")]);
 })
 
-
 async function openShopActionsPopover(event: Event) {
   const popover = await popoverController.create({
     component: ShopActionsPopover,
@@ -176,7 +173,7 @@ async function openCreateGroupModal() {
 async function openLinkFacilitiesToGroupModal(group: any) {
   const popover = await modalController.create({
     component: LinkFacilitiesToGroupModal,
-    componentProps: { group, selectedFacilties: group.selectedFacilities }
+    componentProps: { group, selectedFacilities: group.selectedFacilities }
   });
 
   return popover.present();
@@ -185,7 +182,7 @@ async function openLinkFacilitiesToGroupModal(group: any) {
 async function openLinkThresholdFacilitiesToGroupModal(group: any) {
   const popover = await modalController.create({
     component: LinkThresholdFacilitiesToGroupModal,
-    componentProps: { group: group, selectedConfigFacilityId: group.selectedConfigFacility }
+    componentProps: { group, selectedConfigFacilityId: group.selectedConfigFacility }
   });
 
   return popover.present();

From 3ccaf7550a1983494767df6c1a2cb6790f81a88d Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 24 Apr 2024 19:26:34 +0530
Subject: [PATCH 085/250] Improved: added validation on safety-stock to be
 greater than 0 (#255)

---
 src/components/RuleItem.vue         | 11 ++++++++++-
 src/locales/en.json                 |  2 ++
 src/views/CreateSafetyStockRule.vue |  5 +++++
 src/views/CreateThresholdRule.vue   |  5 +++++
 4 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index b683d9c5..e81d5f6b 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -160,6 +160,11 @@ async function editThreshold() {
       text: translate('Update'),
       handler: async(data) => {
         if(data.threshold) {
+          if(data.threshold < 0) {
+            showToast(translate("Threshold should be greater then 0."));
+            return false;
+          }
+
           const rule = JSON.parse(JSON.stringify(props.rule))
 
           if(!rule.ruleActions?.length) {
@@ -206,8 +211,12 @@ async function editSafetyStock() {
     },
     {
       text: translate('Update'),
-      handler: async (data) => {
+      handler: async (data: any) => {
         if(data.safetyStock) {
+          if(data.safetyStock < 0) {
+            showToast(translate("Safety stock should be greater then 0."));
+            return false;
+          }
           const rule = JSON.parse(JSON.stringify(props.rule))
 
           if(!rule.ruleActions?.length) {
diff --git a/src/locales/en.json b/src/locales/en.json
index ea2e3bd3..3136e86e 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -153,6 +153,7 @@
   "Service updated successfully": "Service updated successfully",
   "Results": "Results",
   "Safety stock": "Safety stock",
+  "Safety stock should be greater then 0.": "Safety stock should be greater then 0.",
   "Save": "Save",
   "Save threshold rule": "Save threshold rule",
   "Schedule new threshold": "Schedule new threshold",
@@ -203,6 +204,7 @@
   "This job schedule cannot be skipped": "This job schedule cannot be skipped",
   "threshold": "threshold",
   "Threshold": "Threshold",
+  "Threshold should be greater then 0.": "Threshold should be greater then 0.",
   "Threshold pipeline": "Threshold pipeline",
   "Rule pipeline": "Rule pipeline",
   "Rule Pipeline": "Rule Pipeline",
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 790e9389..48169093 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -192,6 +192,11 @@ async function createRule() {
     return;
   }
 
+  if(formData.value.safety < 0) {
+    showToast(translate("Safety stock should be greater then 0."));
+    return;
+  }
+
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_SAFETY_STOCK" });
 
   try {
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index f6bf048d..927bf04c 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -162,6 +162,11 @@ async function createThresholdRule() {
     return;
   }
 
+  if(formData.value.threshold < 0){
+    showToast(translate("Threshold should be greater then 0."))
+    return;
+  }
+
   if(!formData.value.selectedConfigFacilites.length) {
     showToast(translate("Please select atleast one config facility."))
     return;

From c4365677f57919a60631f435d43abd942f0112db Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 11:12:17 +0530
Subject: [PATCH 086/250] Implemented: logic to reorder the rules (#257)

---
 src/components/RuleItem.vue       | 57 +++++++++++++++++++++++++++++--
 src/store/modules/rule/actions.ts |  8 +++--
 2 files changed, 60 insertions(+), 5 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index e81d5f6b..d1d7390b 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -7,10 +7,10 @@
         <ion-card-subtitle>{{ ruleIndex+1 }}/{{ total }}</ion-card-subtitle>
       </div>
       <div>
-        <ion-button fill="clear" color="medium" class="ion-no-padding">
+        <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="!isReorderPossible('prev', ruleIndex)" @click="updateRuleOrder('prev')">
           <ion-icon :icon="chevronUpOutline" slot="icon-only" />
         </ion-button>
-        <ion-button fill="clear" color="medium" class="ion-no-padding">
+        <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="!isReorderPossible('next', ruleIndex)" @click="updateRuleOrder('next')">
           <ion-icon :icon="chevronDownOutline" slot="icon-only" />
         </ion-button>
       </div>
@@ -131,6 +131,7 @@ const props = defineProps(["selectedSegment", "rule", "ruleIndex"])
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
+const rules = computed(() => store.getters["rule/getRules"]);
 
 const selectedPage = ref({
   path: '',
@@ -227,7 +228,7 @@ async function editSafetyStock() {
               "fieldValue": data.safetyStock
             }]
           } else {
-            rule.ruleActions[0].fieldValue = data.threshold
+            rule.ruleActions[0].fieldValue = data.safetyStock
           }
 
           try {
@@ -433,6 +434,56 @@ async function updateRuleShipping(event: any) {
     showToast(translate("Failed to update rule brokering."))
   }
 }
+
+function isReorderPossible(ruleDir: string, ruleIndex: any) {
+  if(ruleDir === 'prev' && ruleIndex === 0) return false;
+  if(ruleDir === 'next' && ruleIndex === rules.value.length - 1) return false;
+
+  return true;
+}
+
+async function updateRuleOrder(ruleDir: string) {
+  const prevSeq = JSON.parse(JSON.stringify(rules.value));
+  const updatedSeq = JSON.parse(JSON.stringify(rules.value));
+  let alternateRuleIndex = '' as any;
+
+  if(ruleDir === 'prev') alternateRuleIndex = props.ruleIndex - 1
+  else alternateRuleIndex = props.ruleIndex + 1;
+  
+  [updatedSeq[props.ruleIndex], updatedSeq[alternateRuleIndex]] = [updatedSeq[alternateRuleIndex], updatedSeq[props.ruleIndex]]
+
+  let diffSeq = findRulesDiff(prevSeq, updatedSeq)
+  
+  const updatedSeqenceNum = prevSeq.map((rule: any) => rule.sequenceNum)
+  Object.keys(diffSeq).map((key: any) => {
+    diffSeq[key].sequenceNum = updatedSeqenceNum[key]
+  })
+  
+  diffSeq = Object.keys(diffSeq).map((key) => diffSeq[key])
+  
+  
+  try {
+    diffSeq.map(async (rule: any) => {
+      await RuleService.updateRule(rule, rule.ruleId);
+    })
+    await store.dispatch('rule/updateRules', { rules: updatedSeq })
+    showToast("Rules order has been updated successfully.")
+  } catch(err: any) {
+    logger.error(err);
+    showToast(translate("Failed to update rules order."))
+  }
+}
+
+function findRulesDiff(previousSeq: any, updatedSeq: any) {
+  const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
+    if (updatedSeq[key].routingRuleId === previousSeq[key].routingRuleId && updatedSeq[key].statusId === previousSeq[key].statusId && updatedSeq[key].assignmentEnumId === previousSeq[key].assignmentEnumId && updatedSeq[key].ruleName === previousSeq[key].ruleName) return diff
+    return {
+      ...diff,
+      [key]: updatedSeq[key]
+    }
+  }, {})
+  return diffSeq;
+}
 </script>
 
 <style scoped>
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index a59d78fd..afd71847 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -78,7 +78,7 @@ const actions: ActionTree<RuleState, RootState> = {
   
   updateRuleData({ commit, state }, payload) {
     const rules = JSON.parse(JSON.stringify(state.rules.list))
-
+    
     const index = rules.findIndex((rule: any) => rule.ruleId === payload.rule.ruleId);
     // If index is found, replace the object
     if (index !== -1) {
@@ -86,11 +86,15 @@ const actions: ActionTree<RuleState, RootState> = {
     }
     commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total});
   },
-
+  
   updateRuleGroup({ commit }, payload) {
     commit(types.RULE_GROUP_UPDATED, payload);
   },
 
+  updateRules({commit}, payload) {
+    commit(types.RULE_RULES_UPDATED, { list: payload.rules, total: payload.rules.length});
+  },
+
   archiveRule({ commit, state }, { rule }) {
     const rules = JSON.parse(JSON.stringify(state.rules.list))
 

From d8b60124ed8c4f7ec2cc2dd9a009e5c8ebb0ecdf Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 11:38:30 +0530
Subject: [PATCH 087/250] Improved: toast message and condition for validating
 safety stock (#255)

---
 src/components/RuleItem.vue         | 99 ++++++++++++++---------------
 src/locales/en.json                 |  4 +-
 src/views/CreateSafetyStockRule.vue |  2 +-
 src/views/CreateThresholdRule.vue   |  2 +-
 4 files changed, 52 insertions(+), 55 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index e81d5f6b..98afceb2 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -159,34 +159,32 @@ async function editThreshold() {
     {
       text: translate('Update'),
       handler: async(data) => {
-        if(data.threshold) {
-          if(data.threshold < 0) {
-            showToast(translate("Threshold should be greater then 0."));
-            return false;
-          }
-
-          const rule = JSON.parse(JSON.stringify(props.rule))
+        if(!data.threhold || data.threshold < 0) {
+          showToast(translate("Threshold should be greater than or equal to 0."));
+          return false;
+        }
 
-          if(!rule.ruleActions?.length) {
-            rule.ruleActions = [{
-              "ruleId": props.rule.ruleId,
-              "actionTypeEnumId": "ATP_SAFETY_STOCK",
-              "fieldName": "facility-safety-stock",
-              "fieldValue": data.threshold
-            }]
-          } else {
-            rule.ruleActions[0].fieldValue = data.threshold
-          }
+        const rule = JSON.parse(JSON.stringify(props.rule))
+
+        if(!rule.ruleActions?.length) {
+          rule.ruleActions = [{
+            "ruleId": props.rule.ruleId,
+            "actionTypeEnumId": "ATP_SAFETY_STOCK",
+            "fieldName": "facility-safety-stock",
+            "fieldValue": data.threshold
+          }]
+        } else {
+          rule.ruleActions[0].fieldValue = data.threshold
+        }
 
-          try {
-            await RuleService.updateRule(rule, props.rule.ruleId)
-            await store.dispatch('rule/updateRuleData', { rule })
-            showToast(translate("Threshold updated successfully."))
-            alertController.dismiss()
-          } catch(err: any) {
-            showToast(translate("Failed to update threhold."))
-            logger.error(err);
-          }
+        try {
+          await RuleService.updateRule(rule, props.rule.ruleId)
+          await store.dispatch('rule/updateRuleData', { rule })
+          showToast(translate("Threshold updated successfully."))
+          alertController.dismiss()
+        } catch(err: any) {
+          showToast(translate("Failed to update threhold."))
+          logger.error(err);
         }
       }
     }]
@@ -212,33 +210,32 @@ async function editSafetyStock() {
     {
       text: translate('Update'),
       handler: async (data: any) => {
-        if(data.safetyStock) {
-          if(data.safetyStock < 0) {
-            showToast(translate("Safety stock should be greater then 0."));
-            return false;
-          }
-          const rule = JSON.parse(JSON.stringify(props.rule))
+        if(!data.safetyStock || data.safetyStock < 0) {
+          showToast(translate("Safety stock should be greater than or equal to 0."));
+          return false;
+        }
 
-          if(!rule.ruleActions?.length) {
-            rule.ruleActions = [{
-              "ruleId": props.rule.ruleId,
-              "actionTypeEnumId": "ATP_SAFETY_STOCK",
-              "fieldName": "facility-safety-stock",
-              "fieldValue": data.safetyStock
-            }]
-          } else {
-            rule.ruleActions[0].fieldValue = data.threshold
-          }
+        const rule = JSON.parse(JSON.stringify(props.rule))
+
+        if(!rule.ruleActions?.length) {
+          rule.ruleActions = [{
+            "ruleId": props.rule.ruleId,
+            "actionTypeEnumId": "ATP_SAFETY_STOCK",
+            "fieldName": "facility-safety-stock",
+            "fieldValue": data.safetyStock
+          }]
+        } else {
+          rule.ruleActions[0].fieldValue = data.threshold
+        }
 
-          try {
-            await RuleService.updateRule(rule, props.rule.ruleId)
-            await store.dispatch('rule/updateRuleData', { rule })
-            showToast(translate("Safety stock updated successfully."))
-            alertController.dismiss()
-          } catch(err: any) {
-            showToast(translate("Failed to update safety stock."))
-            logger.error(err);
-          }
+        try {
+          await RuleService.updateRule(rule, props.rule.ruleId)
+          await store.dispatch('rule/updateRuleData', { rule })
+          showToast(translate("Safety stock updated successfully."))
+          alertController.dismiss()
+        } catch(err: any) {
+          showToast(translate("Failed to update safety stock."))
+          logger.error(err);
         }
       }
     }]
diff --git a/src/locales/en.json b/src/locales/en.json
index 3136e86e..fef89acd 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -153,7 +153,7 @@
   "Service updated successfully": "Service updated successfully",
   "Results": "Results",
   "Safety stock": "Safety stock",
-  "Safety stock should be greater then 0.": "Safety stock should be greater then 0.",
+  "Safety stock should be greater than or equal to 0.": "Safety stock should be greater than or equal to 0.",
   "Save": "Save",
   "Save threshold rule": "Save threshold rule",
   "Schedule new threshold": "Schedule new threshold",
@@ -204,7 +204,7 @@
   "This job schedule cannot be skipped": "This job schedule cannot be skipped",
   "threshold": "threshold",
   "Threshold": "Threshold",
-  "Threshold should be greater then 0.": "Threshold should be greater then 0.",
+  "Threshold should be greater than or equal to 0.": "Threshold should be greater than or equal to 0.",
   "Threshold pipeline": "Threshold pipeline",
   "Rule pipeline": "Rule pipeline",
   "Rule Pipeline": "Rule Pipeline",
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 48169093..d997bf47 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -193,7 +193,7 @@ async function createRule() {
   }
 
   if(formData.value.safety < 0) {
-    showToast(translate("Safety stock should be greater then 0."));
+    showToast(translate("Safety stock should be greater than or equal to 0."));
     return;
   }
 
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 927bf04c..9eb34528 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -163,7 +163,7 @@ async function createThresholdRule() {
   }
 
   if(formData.value.threshold < 0){
-    showToast(translate("Threshold should be greater then 0."))
+    showToast(translate("Threshold should be greater than or equal to 0."))
     return;
   }
 

From 6628fd629e36de8fe14422e99a9cd8f86070e7eb Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 11:40:59 +0530
Subject: [PATCH 088/250] Fixed: logic to update safety stock (#255)

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

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 98afceb2..4590fbe6 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -225,7 +225,7 @@ async function editSafetyStock() {
             "fieldValue": data.safetyStock
           }]
         } else {
-          rule.ruleActions[0].fieldValue = data.threshold
+          rule.ruleActions[0].fieldValue = data.safetyStock
         }
 
         try {

From ad7d9a0168ec6b237bbb0a17f2f7f742c6c03fa1 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 12:33:04 +0530
Subject: [PATCH 089/250] Improved: the spacing the code for following
 consistent structure (#257)

---
 src/components/RuleItem.vue | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index d1d7390b..19964e3a 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -449,19 +449,18 @@ async function updateRuleOrder(ruleDir: string) {
 
   if(ruleDir === 'prev') alternateRuleIndex = props.ruleIndex - 1
   else alternateRuleIndex = props.ruleIndex + 1;
-  
+
   [updatedSeq[props.ruleIndex], updatedSeq[alternateRuleIndex]] = [updatedSeq[alternateRuleIndex], updatedSeq[props.ruleIndex]]
 
   let diffSeq = findRulesDiff(prevSeq, updatedSeq)
-  
+
   const updatedSeqenceNum = prevSeq.map((rule: any) => rule.sequenceNum)
   Object.keys(diffSeq).map((key: any) => {
     diffSeq[key].sequenceNum = updatedSeqenceNum[key]
   })
-  
+
   diffSeq = Object.keys(diffSeq).map((key) => diffSeq[key])
-  
-  
+
   try {
     diffSeq.map(async (rule: any) => {
       await RuleService.updateRule(rule, rule.ruleId);

From 62ae98584c3c78793a6b0c66547fbc4f343abd64 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 14:42:30 +0530
Subject: [PATCH 090/250] Improved: added translation entries for the missing
 static text and reverted unwanted changes (#257)

---
 src/locales/en.json               | 2 ++
 src/store/modules/rule/actions.ts | 4 ++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index fef89acd..17b77583 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -57,6 +57,7 @@
   "Failed to create rule.": "Failed to create rule.",
   "Failed to disable rule group.": "Failed to disable rule group.",
   "Failed to fetch rule information.": "Failed to fetch rule information.",
+  "Failed to update rules order.": "Failed to update rules order.",
   "Failed to update config facilities.": "Failed to update config facilities.",
   "Failed to update product filters.": "Failed to update product filters.",
   "Failed to update some jobs": "Failed to update some jobs",
@@ -141,6 +142,7 @@
   "Rule created successfully.": "Rule created successfully.",
   "Rule group disabled successfully.": "Rule group disabled successfully.",
   "rule name": "rule name",
+  "Rules order has been updated successfully.": "Rules order has been updated successfully.",
   "Run now": "Run now",
   "running": "running",
   "Running": "Running",
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index afd71847..7c3e7f6d 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -78,7 +78,7 @@ const actions: ActionTree<RuleState, RootState> = {
   
   updateRuleData({ commit, state }, payload) {
     const rules = JSON.parse(JSON.stringify(state.rules.list))
-    
+
     const index = rules.findIndex((rule: any) => rule.ruleId === payload.rule.ruleId);
     // If index is found, replace the object
     if (index !== -1) {
@@ -86,7 +86,7 @@ const actions: ActionTree<RuleState, RootState> = {
     }
     commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total});
   },
-  
+
   updateRuleGroup({ commit }, payload) {
     commit(types.RULE_GROUP_UPDATED, payload);
   },

From 9340432f15ae78ea6bd475760bf8076cffa91b87 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 16:28:37 +0530
Subject: [PATCH 091/250] Implemented: searching over the facilities fetching
 logic (#258)

---
 src/components/LinkFacilitiesToGroupModal.vue | 41 ++++++++++++++-----
 src/store/modules/util/UtilState.ts           |  1 -
 src/store/modules/util/actions.ts             | 19 ---------
 src/store/modules/util/getters.ts             |  3 --
 src/store/modules/util/index.ts               |  1 -
 src/store/modules/util/mutation-types.ts      |  1 -
 src/store/modules/util/mutations.ts           |  3 --
 src/views/InventoryChannels.vue               |  2 +-
 8 files changed, 32 insertions(+), 39 deletions(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 72238385..9a6b4421 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -11,10 +11,10 @@
   </ion-header>
 
   <ion-content>
-    <ion-searchbar v-model="queryString" @keyup.enter="getFilteredFacilities()" />
+    <ion-searchbar v-model="queryString" @keyup.enter="fetchFacilities()" />
 
-    <ion-list v-if="filteredFacilities?.length">
-      <ion-item lines="none" v-for="facility in filteredFacilities" :key="facility.facilityId" @click="updateSelectedFacilities(facility.facilityId)">
+    <ion-list v-if="facilities?.length">
+      <ion-item lines="none" v-for="facility in facilities" :key="facility.facilityId" @click="updateSelectedFacilities(facility.facilityId)">
         <ion-checkbox :checked="isFacilitySelected(facility.facilityId)">
           <ion-label>
             {{ facility.facilityName }}
@@ -39,27 +39,48 @@
 import { IonButton, IonButtons, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@/i18n'
-import { computed, defineProps, onMounted, ref } from "vue";
+import { defineProps, onMounted, ref } from "vue";
 import { useStore } from "vuex";
 import { DateTime } from "luxon";
 import { ChannelService } from "@/services/ChannelService";
+import { UtilService } from "@/services/UtilService";
 import { showToast } from "@/utils";
+import { hasError } from "@/utils";
+import logger from "@/logger";
 
 const store = useStore();
-const filteredFacilities = ref([]);
 const queryString = ref('');
 const selectedFacilityValues = ref([]) as any;
 
 const props = defineProps(["group", "selectedFacilities"]);
-const facilities = computed(() => store.getters["util/getFacilities"])
+const facilities = ref([]) as any;
 
 onMounted(() => {
-  filteredFacilities.value = JSON.parse(JSON.stringify(facilities.value));
+  fetchFacilities()
   selectedFacilityValues.value = JSON.parse(JSON.stringify(props.selectedFacilities));
 })
 
-function getFilteredFacilities() {
-  filteredFacilities.value = JSON.parse(JSON.stringify(facilities.value.filter((facility: any) => facility.facilityName.toLowerCase().includes(queryString.value.toLowerCase()))))
+async function fetchFacilities () {
+  facilities.value = []
+
+  try {
+    const params = {
+      productStoreId: store.state.user.currentEComStore.productStoreId,
+      facilityName: queryString.value,
+      facilityName_op: "contains",
+      pageSize: 20
+    }
+
+    const resp = await UtilService.fetchFacilities(params);
+
+    if(!hasError(resp)) {
+      facilities.value = resp.data;
+    } else {
+      throw resp.data
+    }
+  } catch (err: any) {
+    logger.error(err)
+  }
 }
 
 function isFacilitySelected(facilityId: any) {
@@ -72,7 +93,7 @@ function updateSelectedFacilities(id: string) {
   if(facility) {
     selectedFacilityValues.value = selectedFacilityValues.value.filter((facility: any) => facility.facilityId !== id)
   } else {
-    selectedFacilityValues.value.push(filteredFacilities.value.find((facility: any) => facility.facilityId == id))
+    selectedFacilityValues.value.push(facilities.value.find((facility: any) => facility.facilityId == id))
   }
 }
 
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index 54181569..b1c800ca 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -1,6 +1,5 @@
 export default interface UtilState {
   configFacilities: any;
   appliedFilters: any;
-  facilities: any;
   facilityGroups: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index d5b904ce..955e040f 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -28,25 +28,6 @@ const actions: ActionTree<UtilState, RootState> = {
     commit(types.UTIL_CONFIG_FACILITES_UPDATED, configFacilities)
   },
 
-  async fetchFacilities ({ commit, state }) {
-    let facilities = JSON.parse(JSON.stringify(state.facilities))
-
-    if(facilities.length) return;
-
-    try {
-      const resp = await UtilService.fetchFacilities({ productStoreId: store.state.user.currentEComStore.productStoreId });
-
-      if(!hasError(resp)) {
-        facilities = resp.data;
-      } else {
-        throw resp.data
-      }
-    } catch (err: any) {
-      logger.error(err)
-    }
-    commit(types.UTIL_FACILITES_UPDATED, facilities)
-  },
-
   async fetchFacilityGroups ({ commit, state }) {
     let facilityGroups = JSON.parse(JSON.stringify(state.facilityGroups))
 
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 4d5173d5..9e228ad5 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -6,9 +6,6 @@ const getters: GetterTree<UtilState, RootState> = {
   getConfigFacilities(state) {
     return state.configFacilities ? JSON.parse(JSON.stringify(state.configFacilities)) : []
   },
-  getFacilities(state) {
-    return state.facilities ? JSON.parse(JSON.stringify(state.facilities)) : []
-  },
   getAppliedFilters(state) {
     return state.appliedFilters;
   },
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 542a468f..4a3faff5 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -9,7 +9,6 @@ const utilModule: Module<UtilState, RootState> = {
   namespaced: true,
   state: {
     configFacilities: [],
-    facilities: [],
     facilityGroups: [],
     appliedFilters: {
       included: {
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 5596e1a7..45362c81 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -1,6 +1,5 @@
 export const SN_UTIL = 'util'
 export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDATED'
-export const UTIL_FACILITES_UPDATED = SN_UTIL + '/FACILITES_UPDATED'
 export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
 export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
 export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index 9c7acc44..b483e2aa 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -9,9 +9,6 @@ const mutations: MutationTree <UtilState> = {
   [types.UTIL_APPLIED_FILTERS_UPDATED] (state, payload) {
     state.appliedFilters = payload
   },
-  [types.UTIL_FACILITES_UPDATED] (state, payload) {
-    state.facilities = payload
-  },
   [types.UTIL_FACILITY_GROUPS_UPDATED] (state, payload) {
     state.facilityGroups = payload
   },
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 18eaaedc..eb224d7a 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -140,7 +140,7 @@ const selectedSegment = ref("channels")
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
 
 onMounted(async () => {
-  await Promise.allSettled([store.dispatch("channel/fetchInventoryChannels"), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilities")]);
+  await Promise.allSettled([store.dispatch("channel/fetchInventoryChannels"), store.dispatch("util/fetchConfigFacilities")]);
 })
 
 async function openShopActionsPopover(event: Event) {

From 689630982acd758ae59cfb32f314bc5080e4d4c2 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 18:13:09 +0530
Subject: [PATCH 092/250] Improved: logic for reordering the rules (#257)

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

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 650a875b..4101e5a3 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -7,10 +7,10 @@
         <ion-card-subtitle>{{ ruleIndex+1 }}/{{ total }}</ion-card-subtitle>
       </div>
       <div>
-        <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="!isReorderPossible('prev', ruleIndex)" @click="updateRuleOrder('prev')">
+        <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === 0" @click="updateRuleOrder('prev')">
           <ion-icon :icon="chevronUpOutline" slot="icon-only" />
         </ion-button>
-        <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="!isReorderPossible('next', ruleIndex)" @click="updateRuleOrder('next')">
+        <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === rules.length - 1" @click="updateRuleOrder('next')">
           <ion-icon :icon="chevronDownOutline" slot="icon-only" />
         </ion-button>
       </div>
@@ -432,13 +432,6 @@ async function updateRuleShipping(event: any) {
   }
 }
 
-function isReorderPossible(ruleDir: string, ruleIndex: any) {
-  if(ruleDir === 'prev' && ruleIndex === 0) return false;
-  if(ruleDir === 'next' && ruleIndex === rules.value.length - 1) return false;
-
-  return true;
-}
-
 async function updateRuleOrder(ruleDir: string) {
   const prevSeq = JSON.parse(JSON.stringify(rules.value));
   const updatedSeq = JSON.parse(JSON.stringify(rules.value));
@@ -472,7 +465,7 @@ async function updateRuleOrder(ruleDir: string) {
 
 function findRulesDiff(previousSeq: any, updatedSeq: any) {
   const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
-    if (updatedSeq[key].routingRuleId === previousSeq[key].routingRuleId && updatedSeq[key].statusId === previousSeq[key].statusId && updatedSeq[key].assignmentEnumId === previousSeq[key].assignmentEnumId && updatedSeq[key].ruleName === previousSeq[key].ruleName) return diff
+    if (updatedSeq[key].ruleId === previousSeq[key].ruleId) return diff
     return {
       ...diff,
       [key]: updatedSeq[key]

From f6e96b60a598957124f9bf6a446c027bac74115c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 18:29:15 +0530
Subject: [PATCH 093/250] Improved: typo in threshold and translation of static
 text (#257)

---
 src/components/RuleItem.vue | 6 +++---
 src/locales/en.json         | 1 +
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 4101e5a3..1d12e9c4 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -160,7 +160,7 @@ async function editThreshold() {
     {
       text: translate('Update'),
       handler: async(data) => {
-        if(!data.threhold || data.threshold < 0) {
+        if(!data.threshold || data.threshold < 0) {
           showToast(translate("Threshold should be greater than or equal to 0."));
           return false;
         }
@@ -184,7 +184,7 @@ async function editThreshold() {
           showToast(translate("Threshold updated successfully."))
           alertController.dismiss()
         } catch(err: any) {
-          showToast(translate("Failed to update threhold."))
+          showToast(translate("Failed to update threshold."))
           logger.error(err);
         }
       }
@@ -456,7 +456,7 @@ async function updateRuleOrder(ruleDir: string) {
       await RuleService.updateRule(rule, rule.ruleId);
     })
     await store.dispatch('rule/updateRules', { rules: updatedSeq })
-    showToast("Rules order has been updated successfully.")
+    showToast(translate("Rules order has been updated successfully."))
   } catch(err: any) {
     logger.error(err);
     showToast(translate("Failed to update rules order."))
diff --git a/src/locales/en.json b/src/locales/en.json
index 17b77583..104a6dd4 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -61,6 +61,7 @@
   "Failed to update config facilities.": "Failed to update config facilities.",
   "Failed to update product filters.": "Failed to update product filters.",
   "Failed to update some jobs": "Failed to update some jobs",
+  "Failed to update threshold.": "Failed to update threshold.",
   "Failed to schedule service": "Failed to schedule service",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
   "features": "{type} features",

From d41637afc1359606caab1a3c9c0ce093a4f8a6a6 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 25 Apr 2024 18:40:46 +0530
Subject: [PATCH 094/250] Improved: code to disable schedule actions when not
 required (#262)

---
 src/components/ScheduleActionsPopover.vue | 2 +-
 src/components/ScheduleRuleItem.vue       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
index 5cc0b189..a5cc377b 100644
--- a/src/components/ScheduleActionsPopover.vue
+++ b/src/components/ScheduleActionsPopover.vue
@@ -10,7 +10,7 @@
         <ion-icon slot="start" :icon="flashOutline" />
         <ion-label>{{ translate("Run now") }}</ion-label>
       </ion-item>
-      <ion-item button lines="none" @click="disableRuleGroup()">
+      <ion-item button lines="none" :disabled="!ruleGroup.schedule || (ruleGroup.schedule?.paused === 'Y')" @click="disableRuleGroup()">
         <ion-icon slot="start" :icon="stopCircleOutline" color="danger" />
         <ion-label color="danger">{{ translate("Disable") }}</ion-label>
       </ion-item>
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index d4b8112a..a5ba0065 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -20,7 +20,7 @@
     </ion-item>
   
     <ion-item lines="none">
-      <ion-button fill="clear" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
+      <ion-button fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
       <ion-button color="medium" fill="clear" slot="end" @click="OpenScheduleActionsPopover($event)">
         <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
       </ion-button>

From 8a9543d63cb60f528d8a19913c18c76b6b265cb4 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 26 Apr 2024 12:42:00 +0530
Subject: [PATCH 095/250] Implemented: added functionality to facility segment
 of shipping page (#264)

---
 src/components/FacilityItem.vue          | 82 ++++++++++++++++----
 src/components/OrderLimitPopover.vue     | 97 ++++++++++++++++++++++++
 src/services/UtilService.ts              | 18 +++++
 src/store/modules/util/UtilState.ts      |  1 +
 src/store/modules/util/actions.ts        | 40 ++++++++++
 src/store/modules/util/getters.ts        |  6 ++
 src/store/modules/util/index.ts          |  4 +
 src/store/modules/util/mutation-types.ts |  3 +-
 src/store/modules/util/mutations.ts      |  4 +
 src/views/Shipping.vue                   | 80 ++++++++++++++++---
 10 files changed, 310 insertions(+), 25 deletions(-)
 create mode 100644 src/components/OrderLimitPopover.vue

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 4518684b..a4e59c7c 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -1,8 +1,8 @@
 <template>
   <ion-card v-if="selectedPage.path === '/store-pickup'">
     <ion-card-header>
-      <ion-card-subtitle class="overline">{{ "Facility ID" }}</ion-card-subtitle>
-      <ion-card-title>{{ "Facility Name" }}</ion-card-title>
+      <ion-card-subtitle class="overline">{{ facility.facilityId }}</ion-card-subtitle>
+      <ion-card-title>{{ facility.facilityName }}</ion-card-title>
     </ion-card-header>
 
     <ion-item lines="none">
@@ -13,38 +13,94 @@
 
   <ion-card v-else>
     <ion-card-header>
-      <ion-card-subtitle class="overline">{{ "Facility ID" }}</ion-card-subtitle>
-      <ion-card-title>{{ "Facility Name" }}</ion-card-title>
+      <ion-card-subtitle class="overline">{{ facility.facilityId }}</ion-card-subtitle>
+      <ion-card-title>{{ facility.facilityName }}</ion-card-title>
     </ion-card-header>
 
-    <ion-item lines="none">
-      <ion-text slot="start">10</ion-text>
-      <ion-progress-bar />
-      <ion-chip slot="end" outline>20</ion-chip>
+    <ion-item lines="none" v-if="facility.maximumOrderLimit === 0">
+      <ion-label>{{ translate("orders in fulfillment queue", {orderCount: 0}) }}</ion-label>
+      <ion-chip :outline="true" @click="changeOrderLimitPopover" color="danger" fill="outline">{{ facility.maximumOrderLimit }}</ion-chip>
     </ion-item>
-
-    <ion-item detail button lines="none">
-      <ion-label>{{ translate("View order count history") }}</ion-label>
+    <ion-item lines="none" v-else-if="facility.maximumOrderLimit">
+      <ion-text slot="start">{{ 0 }}</ion-text>
+      <ion-progress-bar :value="0 / facility.maximumOrderLimit"></ion-progress-bar>
+      <ion-chip slot="end" :outline="true" @click="changeOrderLimitPopover">{{facility.maximumOrderLimit}}</ion-chip>
     </ion-item>
+    <ion-item lines="none" v-else>
+      <ion-label>{{ translate("orders allocated today", {orderCount: 0}) }}</ion-label>
+      <ion-chip :outline="true" @click="changeOrderLimitPopover">{{ translate("Unlimited") }}</ion-chip>
+    </ion-item>      
   </ion-card>
 </template>
 
 <script setup lang="ts">
-import { IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonLabel, IonProgressBar, IonText, IonToggle } from '@ionic/vue';
-import { onMounted, ref } from 'vue';
+import { IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonLabel, IonProgressBar, IonText, IonToggle, popoverController } from '@ionic/vue';
+import { computed, defineProps, onMounted, ref } from 'vue';
 import { storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@/i18n';
+import OrderLimitPopover from '@/components/OrderLimitPopover.vue';
+import { UtilService } from '@/services/UtilService';
+import { hasError, showToast } from '@/utils';
+import logger from '@/logger';
+import { useStore } from 'vuex';
 
 const router = useRouter();
+const store = useStore();
 
 const selectedPage = ref({
   path: '',
   name: ''
 }) as any
 
+const props = defineProps(["facility"]);
+const facilities = computed(() => store.getters["util/getFacilities"]);
+
 onMounted(() => {
     selectedPage.value.path = router.currentRoute.value.path
     selectedPage.value.name = router.currentRoute.value.name
 })
+
+async function changeOrderLimitPopover(ev: Event) {
+  const popover = await popoverController.create({
+    component: OrderLimitPopover,
+    event: ev,
+    showBackdrop: false,
+    componentProps: {fulfillmentOrderLimit: props.facility.maximumOrderLimit}
+  });
+  popover.present();
+
+  const result = await popover.onDidDismiss();
+  // Note: here result.data returns 0 in some cases that's why it is compared with 'undefined'.
+  console.log(result);
+  
+  if(result.data != undefined && result.data !== props.facility.maximumOrderLimit){
+    await updateFacility(result.data)
+  }
+}
+
+async function updateFacility(maximumOrderLimit: number | string) {
+  let resp;
+
+  try {
+    resp = await UtilService.updateFacility({
+      ...props.facility,
+      maximumOrderLimit
+    })
+
+    if(!hasError(resp)) {
+      const updatedFacilities = JSON.parse(JSON.stringify(facilities.value))
+      const currentFacility = updatedFacilities.find((facility: any) => facility.facilityId === props.facility.facilityId)
+      currentFacility.maximumOrderLimit = maximumOrderLimit;
+
+      showToast(translate('Order fulfillment capacity updated successfully'))
+      await store.dispatch('util/updateFacilities', { facilities: updatedFacilities })
+    } else {
+      throw resp.data
+    }
+  } catch(err) {
+    showToast(translate('Failed to update facility'))
+    logger.error('Failed to update facility', err)
+  }
+}
 </script>
\ No newline at end of file
diff --git a/src/components/OrderLimitPopover.vue b/src/components/OrderLimitPopover.vue
new file mode 100644
index 00000000..5cd00b91
--- /dev/null
+++ b/src/components/OrderLimitPopover.vue
@@ -0,0 +1,97 @@
+<template>
+  <ion-content>
+    <ion-list>
+      <ion-list-header>
+        {{ translate("Fulfillment capacity") }}
+      </ion-list-header>
+      <ion-item button @click="updateOrderLimitType('unlimited')">
+        <ion-icon slot="end" :icon="lockOpenOutline" />
+        {{ translate("Unlimited Capacity") }}
+      </ion-item>
+      <ion-item button @click="updateOrderLimitType('no-capacity')">
+        {{ translate("No Capacity") }}
+        <ion-icon slot="end" :icon="lockClosedOutline" />
+      </ion-item>
+      <ion-item button lines="none" @click="updateOrderLimitType('custom')">
+        {{ translate("Custom") }}
+      </ion-item>
+    </ion-list>
+  </ion-content>
+</template>
+
+<script setup lang="ts">
+import {
+  IonContent,
+  IonIcon,
+  IonItem,
+  IonList,
+  IonListHeader,
+  alertController,
+  popoverController
+} from "@ionic/vue";
+import { defineProps, ref } from "vue";
+import { lockClosedOutline, lockOpenOutline } from 'ionicons/icons'
+import { translate } from '@/i18n';
+import { showToast } from '@/utils';
+
+const props = defineProps(["fulfillmentOrderLimit"]);
+const setLimit = ref(props.fulfillmentOrderLimit) as any;
+
+async function updateOrderLimitType(orderLimitType: string) {
+  let header = "Unlimited fulfillment capacity"
+  let message = "Unlimited capacity removes the fulfillment capacity limit entirely. To add a fulfillment capacity to this facility, use the custom option."
+  let showInput = false
+
+  if(orderLimitType === 'custom') {
+    header = "Custom fulfillment capacity"
+    message = ""
+    showInput = true
+  } else if (orderLimitType === 'no-capacity') {
+    setLimit.value = 0
+    header = "No fulfillment capacity"
+    message = "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. Use the \"Reject all orders\" option in the fulfillment pages to clear your facilities fulfillment queue. To add a fulfillment capacity to this facility, use the custom option."
+  } else if (orderLimitType === 'unlimited') {
+    setLimit.value = ""
+  }
+
+  showOrderLimitAlert(header, message, showInput)
+}
+
+async function showOrderLimitAlert(header: string, message: string, showInput: boolean) {
+  const alert = await alertController.create({
+    header: translate(header),
+    message: translate(message, {space: '</br></br>'}),
+    inputs: showInput ? [{
+      name: "setLimit",
+      placeholder: translate("Order fulfillment capacity"),
+      type: "number",
+      min: 0
+    }] : [],
+    buttons: [{
+      text: translate('Cancel'),
+      role: "cancel"
+    },
+    {
+      text: translate('Apply'),
+      handler: (data) => {
+        let value = setLimit.value as any;
+
+        if(data) {
+          if(data.setLimit === '') {
+            showToast(translate('Please provide a value'))
+            return false;
+          } else if(data.setLimit <= 0) {
+            showToast(translate('Provide a value greater than 0'))
+            return false;
+          } else {
+            value = data.setLimit
+          }
+        }
+
+        popoverController.dismiss(value)
+      }
+    }]
+  })
+  await alert.present()
+}
+</script>
\ No newline at end of file
diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
index a5261765..061934a9 100644
--- a/src/services/UtilService.ts
+++ b/src/services/UtilService.ts
@@ -16,6 +16,22 @@ const fetchConfigFacilities = async (payload: any): Promise <any>  => {
   });
 }
 
+const fetchFacilities = async (payload: any): Promise <any>  => {
+  return api({
+    url: `productStores/${payload.productStoreId}/facilities`,
+    method: "GET",
+    params: payload
+  });
+}
+
+const updateFacility = async (payload: any): Promise <any>  => {
+  return api({
+    url: `facilities/${payload.facilityId}`,
+    method: "PUT",
+    data: payload
+  });
+}
+
 const fetchFacilityGroups = async (payload: any): Promise <any>  => {
   return api({
     url: `productStores/${payload.productStoreId}/facilityGroups`,
@@ -25,6 +41,8 @@ const fetchFacilityGroups = async (payload: any): Promise <any>  => {
 
 export const UtilService = {
   fetchConfigFacilities,
+  fetchFacilities,
+  updateFacility,
   fetchFacilityGroups,
   fetchFacets
 }
\ No newline at end of file
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index b1c800ca..10a51842 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -2,4 +2,5 @@ export default interface UtilState {
   configFacilities: any;
   appliedFilters: any;
   facilityGroups: any;
+  facilities: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 9e3af94b..04aea181 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -57,6 +57,46 @@ const actions: ActionTree<UtilState, RootState> = {
   async clearAppliedFilters({ commit }) {
     commit(types.UTIL_APPLIED_FILTERS_CLEARED)
   },
+
+  async fetchFacilities({ commit, state }, payload) {
+    const params = {
+      parentFacilityTypeId: 'VIRTUAL_FACILITY',
+      parentFacilityTypeId_not: 'Y',
+      facilityTypeId: 'VIRTUAL_FACILITY',
+      facilityTypeId_not: 'Y',
+      productStoreId: store.state.user.currentEComStore.productStoreId,
+      pageSize: 20,
+      ...payload
+    }
+
+    const facilities = state.facilities.list ? JSON.parse(JSON.stringify(state.facilities.list)) : [];
+    let isScrollable = true, facilityList = [];
+
+    try {
+      const resp = await UtilService.fetchFacilities(params)
+
+      if(!hasError(resp)) {
+        if(payload.pageIndex && payload.pageIndex > 0) {
+          facilityList = facilities.concat(resp.data)
+        } else {
+          facilityList = resp.data
+        }
+
+        if(resp.data.length == payload.pageSize) isScrollable = true
+        else isScrollable = false
+      } else {
+        throw resp.data
+      }
+    } catch(error) {
+      logger.error(error)
+    }
+    
+    commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: facilityList.length ? facilityList : facilities, isScrollable });
+  },
+
+  async updateFacilities({ commit, state }, payload) {
+    commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: payload.facilities, isScrollable: state.facilities.isScrollable });
+  }
 }
 
 export default actions;
\ No newline at end of file
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 9e228ad5..c8903d4f 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -12,6 +12,12 @@ const getters: GetterTree<UtilState, RootState> = {
   getFacilityGroups(state) {
     return state.facilityGroups;
   },
+  getFacilities(state) {
+    return state.facilities.list ? JSON.parse(JSON.stringify(state.facilities.list)) : []
+  },
+  isFacilitiesScrollable(state) {
+    return state.facilities.isScrollable
+  },
 }
 
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 4a3faff5..7e5c2a68 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -20,6 +20,10 @@ const utilModule: Module<UtilState, RootState> = {
         productFeatures: []
       }
     },
+    facilities: {
+      list: [],
+      isScrollable: true
+    },
   },
   getters,
   actions,
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 45362c81..28de7ee0 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -3,4 +3,5 @@ export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDAT
 export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
 export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
 export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
-export const UTIL_FACILITY_GROUPS_UPDATED = SN_UTIL + '/FACILITY_GROUPS_CLEARED'
\ No newline at end of file
+export const UTIL_FACILITY_GROUPS_UPDATED = SN_UTIL + '/FACILITY_GROUPS_CLEARED'
+export const UTIL_FACILITY_LIST_UPDATED = SN_UTIL + '/FACILITY_LIST_CLEARED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index b483e2aa..3f9122bf 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -37,5 +37,9 @@ const mutations: MutationTree <UtilState> = {
       }
     }
   },
+  [types.UTIL_FACILITY_LIST_UPDATED](state, payload) {
+    state.facilities.list = payload.facilities
+    state.facilities.isScrollable = payload.isScrollable
+  },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index db90bec4..76c0ed64 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -21,22 +21,34 @@
       </ion-toolbar>
     </ion-header>
 
-    <ion-content>
-      <main v-if="ruleGroup.ruleGroupId">
-        <ScheduleRuleItem v-if="selectedSegment !== 'facility'" />
+    <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
+      <main v-if="selectedSegment !== 'facility'">
+        <ScheduleRuleItem  v-if="ruleGroup.ruleGroupId" />
 
         <section v-if="selectedSegment !== 'facility'">
           <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
-        <section v-else>
-          <FacilityItem />
-          <FacilityItem />
-        </section>
+        <div class="empty-state" v-else>
+          <p>{{ translate("No shipping rules found") }}</p>
+        </div>
       </main>
+      <main v-else>
+        <section>
+          <FacilityItem v-for="facility in facilities" :facility="facility" :key="facility.facilityId" />
+        </section>
 
-      <div class="empty-state" v-else>
-        <p>{{ translate("No shipping rules found") }}</p>
-      </div>
+      </main>
+      <ion-infinite-scroll
+        @ionInfinite="loadMoreFacilities($event)"
+        threshold="100px"
+        v-show="isScrollable"
+        ref="infiniteScrollRef"
+      >
+        <ion-infinite-scroll-content
+          loading-spinner="crescent"
+          :loading-text="translate('Loading')"
+        />
+      </ion-infinite-scroll>
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
@@ -48,7 +60,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
 import { computed, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
@@ -63,14 +75,60 @@ const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
+const facilities = computed(() => store.getters["util/getFacilities"]);
 
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY")
+const isScrollingEnabled = ref(false);
+const contentRef = ref({}) as any;
+const infiniteScrollRef = ref({}) as any;
 
 onIonViewWillEnter(async() => {
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
 })
 
+async function fetchFacilities(vSize?: any, vIndex?: any) {
+  const pageSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
+  const pageIndex = vIndex ? vIndex : 0;
+  const payload = {
+    pageSize,
+    pageIndex
+  };
+  await store.dispatch('util/fetchFacilities', payload)
+}
+
+function enableScrolling() {
+  const parentElement = contentRef.value.$el
+  const scrollEl = parentElement.shadowRoot.querySelector("main[part='scroll']")
+  let scrollHeight = scrollEl.scrollHeight, infiniteHeight = infiniteScrollRef.value.$el.offsetHeight, scrollTop = scrollEl.scrollTop, threshold = 100, height = scrollEl.offsetHeight
+  const distanceFromInfinite = scrollHeight - infiniteHeight - scrollTop - threshold - height
+  if(distanceFromInfinite < 0) {
+    isScrollingEnabled.value = false;
+  } else {
+    isScrollingEnabled.value = true;
+  }
+}
+
+async function loadMoreFacilities(event: any) {
+  // Added this check here as if added on infinite-scroll component the Loading content does not gets displayed
+  if(!(isScrollingEnabled.value && isScrollable.value)) {
+    await event.target.complete();
+  }
+  fetchFacilities(
+    undefined,
+    Math.ceil(
+      facilities.value?.length / (process.env.VUE_APP_VIEW_SIZE as any)
+    ).toString()
+  ).then(async () => {
+    await event.target.complete();
+  });
+}
+
 async function updateRuleGroup() {
+  if(selectedSegment.value === 'facility') {
+    isScrollingEnabled.value = false;
+    await fetchFacilities();
+  }
   await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
 }
 

From f3ca87e4cd8875c3085f4bea44b4e0b7ac11a332 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 26 Apr 2024 12:50:55 +0530
Subject: [PATCH 096/250] Improved: added the entry in locales for the
 translation of static text (#264)

---
 src/components/FacilityItem.vue      |  2 --
 src/components/OrderLimitPopover.vue |  2 +-
 src/locales/en.json                  | 14 ++++++++++++++
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index a4e59c7c..6c9199fe 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -72,8 +72,6 @@ async function changeOrderLimitPopover(ev: Event) {
 
   const result = await popover.onDidDismiss();
   // Note: here result.data returns 0 in some cases that's why it is compared with 'undefined'.
-  console.log(result);
-  
   if(result.data != undefined && result.data !== props.facility.maximumOrderLimit){
     await updateFacility(result.data)
   }
diff --git a/src/components/OrderLimitPopover.vue b/src/components/OrderLimitPopover.vue
index 5cd00b91..53db4520 100644
--- a/src/components/OrderLimitPopover.vue
+++ b/src/components/OrderLimitPopover.vue
@@ -49,7 +49,7 @@ async function updateOrderLimitType(orderLimitType: string) {
   } else if (orderLimitType === 'no-capacity') {
     setLimit.value = 0
     header = "No fulfillment capacity"
-    message = "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. Use the \"Reject all orders\" option in the fulfillment pages to clear your facilities fulfillment queue. To add a fulfillment capacity to this facility, use the custom option."
+    message = "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. To add a fulfillment capacity to this facility, use the custom option."
   } else if (orderLimitType === 'unlimited') {
     setLimit.value = ""
   }
diff --git a/src/locales/en.json b/src/locales/en.json
index 104a6dd4..c00c1901 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -3,6 +3,7 @@
   "add": "add",
   "Add": "Add",
   "App": "App",
+  "Apply": "Apply",
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
   "Authenticating": "Authenticating",
   "Available to Promise": "Available to Promise",
@@ -26,6 +27,8 @@
   "Create group": "Create group",
   "Create rule": "Create rule",
   "Create Rule": "Create Rule",
+  "Custom": "Custom",
+  "Custom fulfillment capacity": "Custom fulfillment capacity",
   "Delete": "Delete",
   "Description": "Description",
   "Disable": "Disable",
@@ -67,6 +70,7 @@
   "features": "{type} features",
   "Fetching time zones": "Fetching time zones",
   "Frequency": "Frequency",
+  "Fulfillment capacity": "Fulfillment capacity",
   "Go to Launchpad": "Go to Launchpad",
   "Go to OMS": "Go to OMS",
   "History": "History",
@@ -102,6 +106,9 @@
   "New store pickup rule": "New store pickup rule",
   "New threshold rule": "New threshold rule",
   "New safety stock rule": "New safety stock rule",
+  "No Capacity": "No Capacity",
+  "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. To add a fulfillment capacity to this facility, use the custom option.": "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility.{space} To add a fulfillment capacity to this facility, use the custom option.",
+  "No fulfillment capacity": "No fulfillment capacity",
   "No job found.": "No job found.",
   "No jobs have run yet": "No jobs have run yet",
   "No jobs to update": "No jobs to update",
@@ -113,6 +120,9 @@
   "OMS instance": "OMS instance",
   "Only show selected products": "Only show selected products",
   "Operator": "Operator",
+  "Order fulfillment capacity": "Order fulfillment capacity",
+  "orders allocated today": "{orderCount} orders allocated today",
+  "orders in fulfillment queue": "{orderCount} orders in fulfillment queue",
   "Password": "Password",
   "Paused": "Paused",
   "Pending": "Pending",
@@ -220,6 +230,10 @@
   "Update": "Update",
   "Update time zone": "Update time zone",
   "Update threshold rule": "Update threshold rule",
+  "Unlimited": "Unlimited",
+  "Unlimited Capacity": "Unlimited Capacity",
+  "Unlimited fulfillment capacity": "Unlimited fulfillment capacity",
+  "Unlimited capacity removes the fulfillment capacity limit entirely. To add a fulfillment capacity to this facility, use the custom option.": "Unlimited capacity removes the fulfillment capacity limit entirely. To add a fulfillment capacity to this facility, use the custom option.",
   "Upload": "Upload",
   "Upload CSV": "Upload CSV",
   "Username": "Username",

From 97ba40c13e71b6d9fd18e9a261ac94d605ed5ce7 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 26 Apr 2024 12:55:26 +0530
Subject: [PATCH 097/250] Improved: added the entry in locales for the
 translation of missing static text (#264)

---
 src/components/FacilityItem.vue | 8 ++++----
 src/locales/en.json             | 2 ++
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 6c9199fe..2a431c69 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -91,14 +91,14 @@ async function updateFacility(maximumOrderLimit: number | string) {
       const currentFacility = updatedFacilities.find((facility: any) => facility.facilityId === props.facility.facilityId)
       currentFacility.maximumOrderLimit = maximumOrderLimit;
 
-      showToast(translate('Order fulfillment capacity updated successfully'))
-      await store.dispatch('util/updateFacilities', { facilities: updatedFacilities })
+      showToast(translate("Order fulfillment capacity updated successfully"))
+      await store.dispatch("util/updateFacilities", { facilities: updatedFacilities })
     } else {
       throw resp.data
     }
   } catch(err) {
-    showToast(translate('Failed to update facility'))
-    logger.error('Failed to update facility', err)
+    showToast(translate("Failed to update facility"))
+    logger.error("Failed to update facility", err)
   }
 }
 </script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index c00c1901..58e63516 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -62,6 +62,7 @@
   "Failed to fetch rule information.": "Failed to fetch rule information.",
   "Failed to update rules order.": "Failed to update rules order.",
   "Failed to update config facilities.": "Failed to update config facilities.",
+  "Failed to update facility": "Failed to update facility",
   "Failed to update product filters.": "Failed to update product filters.",
   "Failed to update some jobs": "Failed to update some jobs",
   "Failed to update threshold.": "Failed to update threshold.",
@@ -121,6 +122,7 @@
   "Only show selected products": "Only show selected products",
   "Operator": "Operator",
   "Order fulfillment capacity": "Order fulfillment capacity",
+  "Order fulfillment capacity updated successfully": "Order fulfillment capacity updated successfully",
   "orders allocated today": "{orderCount} orders allocated today",
   "orders in fulfillment queue": "{orderCount} orders in fulfillment queue",
   "Password": "Password",

From 1c7a482757d56d87d2de59569992652efdfd38d9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 26 Apr 2024 14:52:21 +0530
Subject: [PATCH 098/250] Improved: added empty state in facility segment of
 shipping page (#264)

---
 src/views/Shipping.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 76c0ed64..1bfb0a53 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -28,15 +28,17 @@
         <section v-if="selectedSegment !== 'facility'">
           <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
-        <div class="empty-state" v-else>
+        <div v-else class="empty-state">
           <p>{{ translate("No shipping rules found") }}</p>
         </div>
       </main>
       <main v-else>
-        <section>
+        <section v-if="facilities.length">
           <FacilityItem v-for="facility in facilities" :facility="facility" :key="facility.facilityId" />
         </section>
-
+        <div v-else class="empty-state">
+          <p>{{ translate("No facility found") }}</p>
+        </div>
       </main>
       <ion-infinite-scroll
         @ionInfinite="loadMoreFacilities($event)"

From 1062a7a4fd27a725dd71c05ef0825fcd9873bb8a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 26 Apr 2024 14:55:37 +0530
Subject: [PATCH 099/250] Improved: empty state message and added it's entry in
 locales (#264)

---
 src/locales/en.json    | 1 +
 src/views/Shipping.vue | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 58e63516..43562224 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -109,6 +109,7 @@
   "New safety stock rule": "New safety stock rule",
   "No Capacity": "No Capacity",
   "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. To add a fulfillment capacity to this facility, use the custom option.": "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility.{space} To add a fulfillment capacity to this facility, use the custom option.",
+  "No facility found.": "No facility found.",
   "No fulfillment capacity": "No fulfillment capacity",
   "No job found.": "No job found.",
   "No jobs have run yet": "No jobs have run yet",
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 1bfb0a53..4d03ec11 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -37,7 +37,7 @@
           <FacilityItem v-for="facility in facilities" :facility="facility" :key="facility.facilityId" />
         </section>
         <div v-else class="empty-state">
-          <p>{{ translate("No facility found") }}</p>
+          <p>{{ translate("No facility found.") }}</p>
         </div>
       </main>
       <ion-infinite-scroll

From 4461eef626ddc2b31360157dbaa54ea3002a400b Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 10:31:36 +0530
Subject: [PATCH 100/250] Improved: added logic to display facility on store
 pickup facility segment, logic to fetch orderCount (#264)

---
 src/services/UtilService.ts       | 11 +++-
 src/store/modules/util/actions.ts | 26 ++++++++-
 src/views/Shipping.vue            |  3 +-
 src/views/StorePickup.vue         | 97 +++++++++++++++++++++++++------
 4 files changed, 117 insertions(+), 20 deletions(-)

diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
index 061934a9..21e92e97 100644
--- a/src/services/UtilService.ts
+++ b/src/services/UtilService.ts
@@ -39,10 +39,19 @@ const fetchFacilityGroups = async (payload: any): Promise <any>  => {
   });
 }
 
+const fetchFacilitiesOrderCount = async (payload: any): Promise <any>  => {
+  return api({
+    url: `facilities/orderCount`,
+    method: "GET",
+    params: payload
+  });
+}
+
 export const UtilService = {
   fetchConfigFacilities,
   fetchFacilities,
+  fetchFacilitiesOrderCount,
   updateFacility,
   fetchFacilityGroups,
-  fetchFacets
+  fetchFacets,
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 04aea181..f83c9689 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -58,7 +58,7 @@ const actions: ActionTree<UtilState, RootState> = {
     commit(types.UTIL_APPLIED_FILTERS_CLEARED)
   },
 
-  async fetchFacilities({ commit, state }, payload) {
+  async fetchFacilities({ commit, dispatch, state }, payload) {
     const params = {
       parentFacilityTypeId: 'VIRTUAL_FACILITY',
       parentFacilityTypeId_not: 'Y',
@@ -82,6 +82,13 @@ const actions: ActionTree<UtilState, RootState> = {
           facilityList = resp.data
         }
 
+        const facilityIds = resp.data.map((facility: any) => facility.facilityId)
+        const facilityCounts = await dispatch("fetchFacilitiesOrderCount", facilityIds)
+
+        facilityList.map((facility: any) => {
+          if(facilityCounts[facility.facilityId]) facility.orderCount = facilityCounts[facility.facilityId].orderCount;
+        })
+
         if(resp.data.length == payload.pageSize) isScrollable = true
         else isScrollable = false
       } else {
@@ -94,6 +101,23 @@ const actions: ActionTree<UtilState, RootState> = {
     commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: facilityList.length ? facilityList : facilities, isScrollable });
   },
 
+  async fetchFacilitiesOrderCount({ commit, state }, payload) {
+    let facilitiesData = {} as any;
+
+    try {
+      const resp = await UtilService.fetchFacilitiesOrderCount({facilityIds: payload.facilityIds})
+
+      if(!hasError(resp)) {
+        facilitiesData = resp.data
+      } else {
+        throw resp.data
+      }
+    } catch(error) {
+      logger.error(error)
+    }
+    return facilitiesData;
+  },
+
   async updateFacilities({ commit, state }, payload) {
     commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: payload.facilities, isScrollable: state.facilities.isScrollable });
   }
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 4d03ec11..f2d99bc6 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -130,8 +130,9 @@ async function updateRuleGroup() {
   if(selectedSegment.value === 'facility') {
     isScrollingEnabled.value = false;
     await fetchFacilities();
+  } else {
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
   }
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
 }
 
 function createShipping() {
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 0a448bc0..d2a81d8a 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -21,34 +21,49 @@
       </ion-toolbar>
     </ion-header>
 
-    <ion-content>
-      <main v-if="ruleGroup.ruleGroupId">
-        <ScheduleRuleItem v-if="selectedSegment !== 'facility'" />
+    <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
+      <main v-if="selectedSegment !== 'facility'">
+        <ScheduleRuleItem />
 
         <section v-if="selectedSegment === 'RG_PICKUP_FACILITY' || selectedSegment === 'RG_PICKUP_CHANNEL'">
           <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
         </section>
-        <section v-else>
-          <FacilityItem />
-          <FacilityItem />
+        <div class="empty-state" v-else>
+          <p>{{ translate("No store pickup rules found") }}</p>
+        </div>
+      </main>
+      <main v-else>
+        <section v-if="facilities.length">
+          <FacilityItem v-for="facility in facilities" :facility="facility" :key="facility.facilityId" />
         </section>
+        <div v-else class="empty-state">
+          <p>{{ translate("No facility found.") }}</p>
+        </div>
       </main>
 
-      <div class="empty-state" v-else>
-        <p>{{ translate("No store pickup rules found") }}</p>
-      </div>
-
-      <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-        <ion-fab-button @click="createStorePickup()">
-          <ion-icon :icon="addOutline" />
-        </ion-fab-button>
-      </ion-fab>
+      <ion-infinite-scroll
+        @ionInfinite="loadMoreFacilities($event)"
+        threshold="100px"
+        v-show="isScrollable"
+        ref="infiniteScrollRef"
+      >
+        <ion-infinite-scroll-content
+          loading-spinner="crescent"
+          :loading-text="translate('Loading')"
+        />
+      </ion-infinite-scroll>
     </ion-content>
+
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+      <ion-fab-button @click="createStorePickup()">
+        <ion-icon :icon="addOutline" />
+      </ion-fab-button>
+    </ion-fab>
   </ion-page>
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
 import { computed, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
@@ -63,15 +78,63 @@ const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
+const facilities = computed(() => store.getters["util/getFacilities"]);
 
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
+const isScrollingEnabled = ref(false);
+const contentRef = ref({}) as any;
+const infiniteScrollRef = ref({}) as any;
 
 onIonViewWillEnter(async() => {
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
 })
 
+
+async function fetchFacilities(vSize?: any, vIndex?: any) {
+  const pageSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
+  const pageIndex = vIndex ? vIndex : 0;
+  const payload = {
+    pageSize,
+    pageIndex
+  };
+  await store.dispatch('util/fetchFacilities', payload)
+}
+
+function enableScrolling() {
+  const parentElement = contentRef.value.$el
+  const scrollEl = parentElement.shadowRoot.querySelector("main[part='scroll']")
+  let scrollHeight = scrollEl.scrollHeight, infiniteHeight = infiniteScrollRef.value.$el.offsetHeight, scrollTop = scrollEl.scrollTop, threshold = 100, height = scrollEl.offsetHeight
+  const distanceFromInfinite = scrollHeight - infiniteHeight - scrollTop - threshold - height
+  if(distanceFromInfinite < 0) {
+    isScrollingEnabled.value = false;
+  } else {
+    isScrollingEnabled.value = true;
+  }
+}
+
+async function loadMoreFacilities(event: any) {
+  // Added this check here as if added on infinite-scroll component the Loading content does not gets displayed
+  if(!(isScrollingEnabled.value && isScrollable.value)) {
+    await event.target.complete();
+  }
+  fetchFacilities(
+    undefined,
+    Math.ceil(
+      facilities.value?.length / (process.env.VUE_APP_VIEW_SIZE as any)
+    ).toString()
+  ).then(async () => {
+    await event.target.complete();
+  });
+}
+
 async function updateRuleGroup() {
-  await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
+  if(selectedSegment.value === 'facility') {
+    isScrollingEnabled.value = false;
+    await fetchFacilities();
+  } else {
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
+  }
 }
 
 function createStorePickup() {

From 7593cf19f9d178ad12a0227b24f56479e26454e2 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 12:01:29 +0530
Subject: [PATCH 101/250] Implemented: logic to fetch and display orderCount
 for the facilities (#264)

---
 src/components/FacilityItem.vue   |  6 +++---
 src/store/modules/util/actions.ts | 34 ++++++++++++++++++++-----------
 src/views/Shipping.vue            |  3 ++-
 3 files changed, 27 insertions(+), 16 deletions(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 2a431c69..cb189677 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -18,16 +18,16 @@
     </ion-card-header>
 
     <ion-item lines="none" v-if="facility.maximumOrderLimit === 0">
-      <ion-label>{{ translate("orders in fulfillment queue", {orderCount: 0}) }}</ion-label>
+      <ion-label>{{ translate("orders in fulfillment queue", {orderCount: facility.orderCount}) }}</ion-label>
       <ion-chip :outline="true" @click="changeOrderLimitPopover" color="danger" fill="outline">{{ facility.maximumOrderLimit }}</ion-chip>
     </ion-item>
     <ion-item lines="none" v-else-if="facility.maximumOrderLimit">
-      <ion-text slot="start">{{ 0 }}</ion-text>
+      <ion-text slot="start">{{ facility.orderCount }}</ion-text>
       <ion-progress-bar :value="0 / facility.maximumOrderLimit"></ion-progress-bar>
       <ion-chip slot="end" :outline="true" @click="changeOrderLimitPopover">{{facility.maximumOrderLimit}}</ion-chip>
     </ion-item>
     <ion-item lines="none" v-else>
-      <ion-label>{{ translate("orders allocated today", {orderCount: 0}) }}</ion-label>
+      <ion-label>{{ translate("orders allocated today", {orderCount: facility.orderCount}) }}</ion-label>
       <ion-chip :outline="true" @click="changeOrderLimitPopover">{{ translate("Unlimited") }}</ion-chip>
     </ion-item>      
   </ion-card>
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index f83c9689..c2332194 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -6,6 +6,7 @@ import logger from '@/logger'
 import UtilState from './UtilState'
 import * as types from './mutation-types'
 import store from "@/store"
+import { DateTime } from 'luxon'
 
 
 const actions: ActionTree<UtilState, RootState> = {
@@ -65,8 +66,8 @@ const actions: ActionTree<UtilState, RootState> = {
       facilityTypeId: 'VIRTUAL_FACILITY',
       facilityTypeId_not: 'Y',
       productStoreId: store.state.user.currentEComStore.productStoreId,
-      pageSize: 20,
-      ...payload
+      pageSize: payload.pageSize,
+      pageIndex: payload.pageIndex
     }
 
     const facilities = state.facilities.list ? JSON.parse(JSON.stringify(state.facilities.list)) : [];
@@ -82,12 +83,15 @@ const actions: ActionTree<UtilState, RootState> = {
           facilityList = resp.data
         }
 
-        const facilityIds = resp.data.map((facility: any) => facility.facilityId)
-        const facilityCounts = await dispatch("fetchFacilitiesOrderCount", facilityIds)
+        if(payload.isOrderCountRequired) {
+          const facilityIds = resp.data.map((facility: any) => facility.facilityId)
+          const facilityCounts = await dispatch("fetchFacilitiesOrderCount", { facilityIds })
 
-        facilityList.map((facility: any) => {
-          if(facilityCounts[facility.facilityId]) facility.orderCount = facilityCounts[facility.facilityId].orderCount;
-        })
+          facilityList.map((facility: any) => {
+            if(facilityCounts[facility.facilityId]) facility.orderCount = facilityCounts[facility.facilityId]
+            else facility.orderCount = 0;
+          })
+        }
 
         if(resp.data.length == payload.pageSize) isScrollable = true
         else isScrollable = false
@@ -97,18 +101,24 @@ const actions: ActionTree<UtilState, RootState> = {
     } catch(error) {
       logger.error(error)
     }
-    
+
     commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: facilityList.length ? facilityList : facilities, isScrollable });
   },
 
-  async fetchFacilitiesOrderCount({ commit, state }, payload) {
-    let facilitiesData = {} as any;
+  async fetchFacilitiesOrderCount({ commit }, payload) {
+    const facilitiesData = {} as any;
 
     try {
-      const resp = await UtilService.fetchFacilitiesOrderCount({facilityIds: payload.facilityIds})
+      const resp = await UtilService.fetchFacilitiesOrderCount({
+        facilityId: payload.facilityIds.join(","),
+        facilityId_op: "in",
+        entryDate: DateTime.now().toFormat('yyyy-MM-dd')
+      })
 
       if(!hasError(resp)) {
-        facilitiesData = resp.data
+        resp.data.map((facility: any) => {
+          facilitiesData[facility.facilityId] = facility.lastOrderCount
+        })
       } else {
         throw resp.data
       }
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index f2d99bc6..e96437a1 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -94,7 +94,8 @@ async function fetchFacilities(vSize?: any, vIndex?: any) {
   const pageIndex = vIndex ? vIndex : 0;
   const payload = {
     pageSize,
-    pageIndex
+    pageIndex,
+    isOrderCountRequired: true
   };
   await store.dispatch('util/fetchFacilities', payload)
 }

From a35bdb260c450f7e3ecafc34892d3f61798f9987 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 12:48:54 +0530
Subject: [PATCH 102/250] Improved: code to dismiss modal by close button
 (#258)

---
 src/components/LinkFacilitiesToGroupModal.vue          | 6 +++++-
 src/components/LinkThresholdFacilitiesToGroupModal.vue | 6 +++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 9a6b4421..de621370 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -2,7 +2,7 @@
   <ion-header>
     <ion-toolbar>
       <ion-buttons slot="start">
-        <ion-button>
+        <ion-button @click="closeModal">
           <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
@@ -60,6 +60,10 @@ onMounted(() => {
   selectedFacilityValues.value = JSON.parse(JSON.stringify(props.selectedFacilities));
 })
 
+function closeModal() {
+  modalController.dismiss({ dismissed: true });
+}
+
 async function fetchFacilities () {
   facilities.value = []
 
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index bc363dae..03fc6820 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -2,7 +2,7 @@
   <ion-header>
     <ion-toolbar>
       <ion-buttons slot="start">
-        <ion-button>
+        <ion-button @click="closeModal">
           <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
@@ -55,6 +55,10 @@ onMounted(() => {
   selectedFacilityId.value = props.selectedConfigFacilityId?.facilityId ? JSON.parse(JSON.stringify(props.selectedConfigFacilityId.facilityId)) : '';
 })
 
+function closeModal() {
+  modalController.dismiss({ dismissed: true });
+}
+
 async function saveFacility() {
   if(!selectedFacilityId.value) {
     showToast(translate("Please select a facility to update."))

From 0851c006e2759402e5f44aaaffdfa9fc18143af6 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 14:56:11 +0530
Subject: [PATCH 103/250] Improved: code for making threshold value mandatory
 while creation (#266)

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

diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 9eb34528..b163744a 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -22,7 +22,9 @@
                 </ion-input>
               </ion-item>
               <ion-item>
-                <ion-input :label="translate('Threshold')" v-model="formData.threshold" />
+                <ion-input v-model="formData.threshold">
+                  <div slot="label">{{ translate("Threshold") }} <ion-text color="danger">*</ion-text></div>
+                </ion-input>
               </ion-item>
             </div>
           </ion-card>
@@ -157,7 +159,7 @@ function generateRuleConditions(ruleId: string) {
 }
 
 async function createThresholdRule() {
-  if(!formData.value.ruleName) {
+  if(!formData.value.ruleName || !formData.value.threshold) {
     showToast(translate("Please fill in all the required fields."))
     return;
   }

From 09aed9f27854b6d8097c9dfb20e6d3a901096db5 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 16:23:56 +0530
Subject: [PATCH 104/250] Improved: mutation-type entry in util state, facility
 updation logic in state and progress bar value (#264)

---
 src/components/FacilityItem.vue          | 2 +-
 src/store/modules/util/actions.ts        | 2 +-
 src/store/modules/util/mutation-types.ts | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index cb189677..5c94aac7 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -23,7 +23,7 @@
     </ion-item>
     <ion-item lines="none" v-else-if="facility.maximumOrderLimit">
       <ion-text slot="start">{{ facility.orderCount }}</ion-text>
-      <ion-progress-bar :value="0 / facility.maximumOrderLimit"></ion-progress-bar>
+      <ion-progress-bar :value="facility.orderCount / facility.maximumOrderLimit"></ion-progress-bar>
       <ion-chip slot="end" :outline="true" @click="changeOrderLimitPopover">{{facility.maximumOrderLimit}}</ion-chip>
     </ion-item>
     <ion-item lines="none" v-else>
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index c2332194..545c211d 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -102,7 +102,7 @@ const actions: ActionTree<UtilState, RootState> = {
       logger.error(error)
     }
 
-    commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: facilityList.length ? facilityList : facilities, isScrollable });
+    commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: facilityList, isScrollable });
   },
 
   async fetchFacilitiesOrderCount({ commit }, payload) {
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 28de7ee0..55c2b817 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -3,5 +3,5 @@ export const UTIL_CONFIG_FACILITES_UPDATED = SN_UTIL + '/CONFIG_FACILITIES_UPDAT
 export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
 export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
 export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
-export const UTIL_FACILITY_GROUPS_UPDATED = SN_UTIL + '/FACILITY_GROUPS_CLEARED'
-export const UTIL_FACILITY_LIST_UPDATED = SN_UTIL + '/FACILITY_LIST_CLEARED'
\ No newline at end of file
+export const UTIL_FACILITY_GROUPS_UPDATED = SN_UTIL + '/FACILITY_GROUPS_UPDATED'
+export const UTIL_FACILITY_LIST_UPDATED = SN_UTIL + '/FACILITY_LIST_UPDATED'
\ No newline at end of file

From e7150f108d1af4323a5119725ad4473e746347bd Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 16:57:03 +0530
Subject: [PATCH 105/250] Improved: logic to fetch and append order count while
 fetching facilities (#264)

---
 src/store/modules/util/actions.ts | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 545c211d..901ea973 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -77,22 +77,22 @@ const actions: ActionTree<UtilState, RootState> = {
       const resp = await UtilService.fetchFacilities(params)
 
       if(!hasError(resp)) {
-        if(payload.pageIndex && payload.pageIndex > 0) {
-          facilityList = facilities.concat(resp.data)
-        } else {
-          facilityList = resp.data
-        }
-
         if(payload.isOrderCountRequired) {
           const facilityIds = resp.data.map((facility: any) => facility.facilityId)
           const facilityCounts = await dispatch("fetchFacilitiesOrderCount", { facilityIds })
 
-          facilityList.map((facility: any) => {
+          resp.data.map((facility: any) => {
             if(facilityCounts[facility.facilityId]) facility.orderCount = facilityCounts[facility.facilityId]
             else facility.orderCount = 0;
           })
         }
 
+        if(payload.pageIndex && payload.pageIndex > 0) {
+          facilityList = facilities.concat(resp.data)
+        } else {
+          facilityList = resp.data
+        }
+
         if(resp.data.length == payload.pageSize) isScrollable = true
         else isScrollable = false
       } else {

From c6458e559ee974a84ddcb85658d9bb57b07a1514 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 17:01:57 +0530
Subject: [PATCH 106/250] Improved: added entry in main file for allowing html
 tags in translations (#264)

---
 src/main.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/main.ts b/src/main.ts
index 89a4e5bb..932ce32a 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -33,7 +33,8 @@ import store from './store'
 
 const app = createApp(App)
   .use(IonicVue, {
-    mode: 'md'
+    mode: 'md',
+    innerHTMLTemplatesEnabled: true
   })
   .use(logger, {
     level: process.env.VUE_APP_DEFAULT_LOG_LEVEL

From bdd5b490454d05bede3e6a72a88f2e72af76ac65 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 18:44:14 +0530
Subject: [PATCH 107/250] Reverted: unused import and variables from the app
 (#258)

---
 src/components/CreateGroupModal.vue | 1 -
 src/components/Menu.vue             | 2 +-
 src/views/StorePickup.vue           | 1 -
 3 files changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index 9854a174..89ebb496 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -52,7 +52,6 @@ import { computed, ref } from "vue";
 import { generateInternalId, hasError, showToast } from "@/utils";
 import logger from "@/logger";
 import { ChannelService } from "@/services/ChannelService";
-import { DateTime } from "luxon";
 
 const store = useStore();
 
diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 239ec4ed..232957c3 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -63,7 +63,7 @@
   import { computed } from "vue";
   import { useStore } from "@/store";
   import { useRouter } from "vue-router";
-  import { cloudUploadOutline, globeOutline, optionsOutline, settingsOutline, sendOutline, storefrontOutline, pulseOutline } from 'ionicons/icons';
+  import { cloudUploadOutline, globeOutline, settingsOutline, sendOutline, storefrontOutline, pulseOutline } from 'ionicons/icons';
   import { translate } from "@/i18n";
 
   const store = useStore();
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index d2a81d8a..ebd0a6bb 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -77,7 +77,6 @@ const store = useStore();
 const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
-const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
 

From 90b15998a97cf827252752f4f66e9d0b510a887e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 18:57:12 +0530
Subject: [PATCH 108/250] Improved: commented the not active button in channels
 card (#258)

---
 src/views/InventoryChannels.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index eb224d7a..fb784553 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -61,9 +61,10 @@
   
               <ion-item lines="none">
                 <ion-button fill="clear" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
-                <ion-button color="medium" fill="clear" slot="end">
+                <!-- Functionality is not defined for this button hence commented it for now. -->
+                <!-- <ion-button color="medium" fill="clear" slot="end">
                   <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
-                </ion-button>
+                </ion-button> -->
               </ion-item>
             </ion-list>
           </ion-card>

From 9d0bf6d62f99b2611c48c590e9986586d670c569 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 19:29:37 +0530
Subject: [PATCH 109/250] Improved: code to filter out expired record for
 facility group and facilities (#258)

---
 src/store/modules/channel/actions.ts | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index 78aa0235..15cbcc04 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -36,6 +36,9 @@ const actions: ActionTree<ChannelState, RootState> = {
       const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId })
 
       if(!hasError(resp)) {
+        // Currently expired records are coming also while fetching, hence filtering records with thruDate for now.
+        resp.data = resp.data.filter((facility: any) => !facility.thruDate)
+
         const currentGroup = groups.find((group: any) => group.facilityGroupId === facilityGroupId)
         currentGroup.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
         currentGroup.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
@@ -48,8 +51,11 @@ const actions: ActionTree<ChannelState, RootState> = {
           const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId: group.facilityGroupId });
 
           if(!hasError(resp)) {
-             group.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
-             group.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
+            // Currently expired records are coming also while fetching, hence filtering records with thruDate for now.
+            resp.data = resp.data.filter((facility: any) => !facility.thruDate)
+
+            group.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
+            group.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
           } else {
             throw resp.data
           }

From e4196b9c09b1149a4efa969f1636a0e822f6edb8 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 29 Apr 2024 21:08:03 +0530
Subject: [PATCH 110/250] Improved: added padding bottom in the modal and added
 default size to ion-button (#258)

---
 src/components/LinkFacilitiesToGroupModal.vue          | 8 +++++++-
 src/components/LinkThresholdFacilitiesToGroupModal.vue | 8 +++++++-
 src/views/InventoryChannels.vue                        | 2 +-
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index de621370..2b6422f1 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -137,4 +137,10 @@ async function saveFacilities() {
   await store.dispatch("channel/fetchGroupFacilities", props.group.facilityGroupId);
   modalController.dismiss()  
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+  ion-content {
+    --padding-bottom: 80px;
+  }
+</style>
\ No newline at end of file
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index 03fc6820..96336f10 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -96,4 +96,10 @@ async function saveFacility() {
   }
   await store.dispatch("channel/fetchGroupFacilities", props.group.facilityGroupId);
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+  ion-content {
+    --padding-bottom: 80px;
+  }
+</style>
\ No newline at end of file
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index fb784553..a3ed27e4 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -60,7 +60,7 @@
               </ion-item>
   
               <ion-item lines="none">
-                <ion-button fill="clear" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
+                <ion-button fill="clear" size="default" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
                 <!-- Functionality is not defined for this button hence commented it for now. -->
                 <!-- <ion-button color="medium" fill="clear" slot="end">
                   <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>

From e6fccd22c44c1cb64e9451eef3f2922e3a7a2786 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 12:16:48 +0530
Subject: [PATCH 111/250] Improved: added util module in persist state, disable
 save button if facility not updated (#258)

---
 src/components/CreateGroupModal.vue                    | 2 +-
 src/components/LinkThresholdFacilitiesToGroupModal.vue | 6 +++++-
 src/store/index.ts                                     | 2 +-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index 89ebb496..897ed3b0 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -25,7 +25,7 @@
       </ion-item>
       <ion-item>
         <ion-label>{{ translate("Product store") }}</ion-label>
-        <ion-label slot="end">{{ eComStore.storeName }}</ion-label>
+        <ion-label slot="end">{{ eComStore.storeName ? eComStore.storeName : eComStore.productStoreId }}</ion-label>
       </ion-item>
       <ion-item>
         <ion-select :label="translate('Group level configurations')" v-model="selectedConfigFacilityId" interface="popover">
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index 96336f10..13603db8 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -27,7 +27,7 @@
     </div> 
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="saveFacility()">
+      <ion-fab-button :disabled="!isFacilityUpdated()" @click="saveFacility()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -96,6 +96,10 @@ async function saveFacility() {
   }
   await store.dispatch("channel/fetchGroupFacilities", props.group.facilityGroupId);
 }
+
+function isFacilityUpdated() {
+  return props.selectedConfigFacilityId.facilityId !== selectedFacilityId.value
+}
 </script>
 
 <style scoped>
diff --git a/src/store/index.ts b/src/store/index.ts
index 47384850..a11e5fb7 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -20,7 +20,7 @@ const state: any = {
 }
 
 const persistState = createPersistedState({
-    paths: ['user'],
+    paths: ['user', 'util'],
     fetchBeforeUse: true
 })
 

From f95aa6cdb3859085fc437998a9d871bcd2395e1a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 12:19:28 +0530
Subject: [PATCH 112/250] Fixed: offSet for fetching solrFacets to allow
 pagination (#271)

---
 src/components/AddProductFiltersModal.vue    | 2 +-
 src/components/UpdateProductFiltersModal.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index d030fd64..aee860dd 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -102,7 +102,7 @@ async function getFilters(vSize?: any, vIndex?: any) {
     limit: viewSize,
     q: queryString.value,
     term: queryString.value,
-    offset: 0,
+    offset: viewSize * viewIndex,
   }
 
   const resp = await UtilService.fetchFacets(payload);
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index 6ff76482..e2dd2a0e 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -116,7 +116,7 @@ async function getFilters(vSize?: any, vIndex?: any) {
     limit: viewSize,
     q: queryString.value,
     term: queryString.value,
-    offset: 0,
+    offset: viewSize * viewIndex,
   }
 
   const resp = await UtilService.fetchFacets(payload);

From fd06bcc7775a0b231c3b5a4e7dae5ecb50b5f749 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 12:33:48 +0530
Subject: [PATCH 113/250] Improved: used closeOutline inside all the modal and
 added missing entry in translation (#273)

---
 src/components/AddProductFacilityGroupModal.vue | 4 ++--
 src/components/AddProductFiltersModal.vue       | 4 ++--
 src/components/UpdateFacilityGroupModal.vue     | 4 ++--
 src/components/UpdateProductFiltersModal.vue    | 4 ++--
 src/locales/en.json                             | 1 +
 5 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index 22a81cb3..757f4312 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button @click="closeModal">
-          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+          <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ type === "included" ? translate("Include facility groups") : translate("Exclude facility groups") }}</ion-title>
@@ -52,7 +52,7 @@ import {
   IonToolbar,
   modalController
 } from "@ionic/vue";
-import { arrowBackOutline, saveOutline } from 'ionicons/icons';
+import { closeOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
 import { translate } from "@/i18n";
 
diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index d030fd64..06981387 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button @click="closeModal">
-          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+          <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ type === "included" ? translate("Include", { label }) : translate("Exclude", { label }) }}</ion-title>
@@ -60,7 +60,7 @@ import {
   IonToolbar,
   modalController
 } from "@ionic/vue";
-import { arrowBackOutline, saveOutline } from 'ionicons/icons';
+import { closeOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
 import { UtilService } from "@/services/UtilService";
 import { translate } from "@/i18n";
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index 644e17ee..0b3233c9 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button @click="closeModal">
-          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+          <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Select facility groups") }}</ion-title>
@@ -63,7 +63,7 @@ import {
   IonToolbar,
   modalController
 } from "@ionic/vue";
-import { arrowBackOutline, saveOutline } from 'ionicons/icons';
+import { closeOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
 import { RuleService } from "@/services/RuleService";
 import { translate } from "@/i18n";
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index 6ff76482..60ed5805 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button @click="closeModal">
-          <ion-icon slot="icon-only" :icon="arrowBackOutline" />
+          <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Select", { label }) }}</ion-title>
@@ -68,7 +68,7 @@ import {
   IonToolbar,
   modalController
 } from "@ionic/vue";
-import { arrowBackOutline, saveOutline } from 'ionicons/icons';
+import { closeOutline, saveOutline } from 'ionicons/icons';
 import { useStore } from "vuex";
 import { UtilService } from "@/services/UtilService";
 import { RuleService } from "@/services/RuleService";
diff --git a/src/locales/en.json b/src/locales/en.json
index 43562224..9f1c7036 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -182,6 +182,7 @@
   "Selected products": "Selected products",
   "Select facilities": "Select facilities",
   "Select facility": "Select facility",
+  "Select facility groups": "Select facility groups",
   "Select locations": "Select locations",
   "Select the column index for the following information in the uploaded CSV": "Select the column index for the following information in the uploaded CSV",
   "Select run time": "Select run time",

From ee5cfdce946968f9804318365e9b0a4c7ed61932 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 12:55:25 +0530
Subject: [PATCH 114/250] Fixed: rules total count not updating on archiving
 rule, showed bottom line in rule card and required astrick in case of
 channels (#275)

---
 src/components/RuleItem.vue       | 2 +-
 src/store/modules/rule/actions.ts | 2 +-
 src/views/CreateThresholdRule.vue | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 1d12e9c4..0df3cd40 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -58,7 +58,7 @@
           </ion-button>
         </ion-item-divider>
         
-        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')" lines="none">
+        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')">
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
         </ion-item>
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 7c3e7f6d..f1a47216 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -102,7 +102,7 @@ const actions: ActionTree<RuleState, RootState> = {
     if (index !== -1) {
       rules.splice(index, 1);
     }
-    commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total});
+    commit(types.RULE_RULES_UPDATED, { list: rules, total: state.rules.total - 1 });
   },
 
   async clearRuleState({ commit }) {
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index b163744a..49915b21 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -31,7 +31,7 @@
         </div>
       </section>
       <div class="section-header">
-        <h1>{{ translate("Channels") }}</h1>
+        <h1>{{ translate("Channels") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 
       <section> 

From 0f6f283975d8c2c66a3eed04f309e73e6bbca596 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 14:34:48 +0530
Subject: [PATCH 115/250] Improved: added check to give queryfilter only if
 something searched and simplified imports (#258)

---
 src/components/LinkFacilitiesToGroupModal.vue | 21 +++++++++++--------
 1 file changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 2b6422f1..144fb674 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -44,8 +44,7 @@ import { useStore } from "vuex";
 import { DateTime } from "luxon";
 import { ChannelService } from "@/services/ChannelService";
 import { UtilService } from "@/services/UtilService";
-import { showToast } from "@/utils";
-import { hasError } from "@/utils";
+import { hasError, showToast } from "@/utils";
 import logger from "@/logger";
 
 const store = useStore();
@@ -68,11 +67,17 @@ async function fetchFacilities () {
   facilities.value = []
 
   try {
-    const params = {
+    let params = {
       productStoreId: store.state.user.currentEComStore.productStoreId,
-      facilityName: queryString.value,
-      facilityName_op: "contains",
       pageSize: 20
+    } as any;
+
+    if(queryString.value) {
+      params = {
+        ...params,
+        facilityName: queryString.value,
+        facilityName_op: "contains"
+      }
     }
 
     const resp = await UtilService.fetchFacilities(params);
@@ -87,14 +92,12 @@ async function fetchFacilities () {
   }
 }
 
-function isFacilitySelected(facilityId: any) {
+function isFacilitySelected(facilityId: string) {
   return selectedFacilityValues.value.some((facility: any) => facility.facilityId === facilityId)
 }
 
 function updateSelectedFacilities(id: string) {
-  const facility = isFacilitySelected(id)
-
-  if(facility) {
+  if(isFacilitySelected(id)) {
     selectedFacilityValues.value = selectedFacilityValues.value.filter((facility: any) => facility.facilityId !== id)
   } else {
     selectedFacilityValues.value.push(facilities.value.find((facility: any) => facility.facilityId == id))

From d9d742fde58a84d7787f0046ff5bd33858bc3d55 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 14:37:51 +0530
Subject: [PATCH 116/250] Improved: moved the id character limit check after
 the id generation (#258)

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

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index 897ed3b0..6b14b373 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -76,17 +76,17 @@ async function createGroup() {
     return;
   }
 
-  if (formData.value.facilityGroupId.length > 20) {
-    showToast(translate("Internal ID cannot be more than 20 characters."))
-    return
-  }
-
   // In case the user does not lose focus from the facility name input
   // and click on create the button, we need to set the internal id manually
   if (!formData.value.facilityGroupId) {
     formData.value.facilityGroupId = generateInternalId(formData.value.facilityGroupName)
   }
 
+  if (formData.value.facilityGroupId.length > 20) {
+    showToast(translate("Internal ID cannot be more than 20 characters."))
+    return
+  }
+
   let resp = {} as any;
   try {
     // Creating a new inventory channel group.

From cd6ac0199c80c959f9d35901fc33de6a454bceaa Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 14:55:50 +0530
Subject: [PATCH 117/250] Reverted: mutation for clearing channel state since
 not needed (#258)

---
 src/store/modules/channel/actions.ts        | 2 +-
 src/store/modules/channel/mutation-types.ts | 3 +--
 src/store/modules/channel/mutations.ts      | 3 ---
 3 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index 15cbcc04..753ec954 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -78,7 +78,7 @@ const actions: ActionTree<ChannelState, RootState> = {
   },
 
   async clearChannelState({ commit }) {
-    commit(types.CHANNEL_CLEARED)
+    commit(types.CHANNEL_INVENTORY_CHANNELS_UPDATED, [])
   },
 }
 
diff --git a/src/store/modules/channel/mutation-types.ts b/src/store/modules/channel/mutation-types.ts
index 21c0cf83..cfe05e1e 100644
--- a/src/store/modules/channel/mutation-types.ts
+++ b/src/store/modules/channel/mutation-types.ts
@@ -1,3 +1,2 @@
 export const SN_CHANNEL = 'channel'
-export const CHANNEL_INVENTORY_CHANNELS_UPDATED = SN_CHANNEL + '/INVENTORY_CHANNELS_UPDATED'
-export const CHANNEL_CLEARED = SN_CHANNEL + "/CLEARED"
\ No newline at end of file
+export const CHANNEL_INVENTORY_CHANNELS_UPDATED = SN_CHANNEL + '/INVENTORY_CHANNELS_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/channel/mutations.ts b/src/store/modules/channel/mutations.ts
index e94f09ef..9a376d5e 100644
--- a/src/store/modules/channel/mutations.ts
+++ b/src/store/modules/channel/mutations.ts
@@ -6,8 +6,5 @@ const mutations: MutationTree <ChannelState> = {
   [types.CHANNEL_INVENTORY_CHANNELS_UPDATED] (state, payload) {
     state.inventoryChannels = payload;
   },
-  [types.CHANNEL_CLEARED](state) {
-    state.inventoryChannels = []
-  },
 }
 export default mutations;
\ No newline at end of file

From 167766ea541e0cba4a3105c9bf71bebd28f45773 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 15:46:49 +0530
Subject: [PATCH 118/250] Implemented: loader throughout the app where ever
 needed (#270)

---
 src/components/CreateGroupModal.vue           |  4 ++++
 src/components/EditGroupModal.vue             |  5 ++++-
 src/components/FacilityItem.vue               |  8 ++++++--
 src/components/LinkFacilitiesToGroupModal.vue |  9 ++++++---
 .../LinkThresholdFacilitiesToGroupModal.vue   |  4 ++++
 src/components/RuleItem.vue                   | 19 +++++++++++++++++--
 src/components/ScheduleActionsPopover.vue     |  6 ++++++
 src/components/ScheduleRuleItem.vue           |  3 +++
 .../SelectConfigFacilitiesModal.vue           |  5 ++++-
 src/components/UpdateFacilityGroupModal.vue   |  3 +++
 src/components/UpdateProductFiltersModal.vue  |  3 +++
 src/views/CreateSafetyStockRule.vue           |  6 +++++-
 src/views/CreateShippingRule.vue              |  4 ++++
 src/views/CreateStorePickupRule.vue           |  4 ++++
 src/views/CreateThresholdRule.vue             |  6 +++++-
 src/views/InventoryChannels.vue               |  3 +++
 src/views/SafetyStock.vue                     |  3 +++
 src/views/Shipping.vue                        |  5 +++++
 src/views/StorePickup.vue                     |  5 +++++
 src/views/Threshold.vue                       |  3 +++
 20 files changed, 97 insertions(+), 11 deletions(-)

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index 6b14b373..f01a0ba6 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -52,6 +52,7 @@ import { computed, ref } from "vue";
 import { generateInternalId, hasError, showToast } from "@/utils";
 import logger from "@/logger";
 import { ChannelService } from "@/services/ChannelService";
+import emitter from "@/event-bus";
 
 const store = useStore();
 
@@ -87,6 +88,8 @@ async function createGroup() {
     return
   }
 
+  emitter.emit("presentLoader");
+
   let resp = {} as any;
   try {
     // Creating a new inventory channel group.
@@ -138,6 +141,7 @@ async function createGroup() {
     showToast(translate("Something went wrong."))
   }
   modalController.dismiss()
+  emitter.emit("dismissLoader");
 }
 
 function setFacilityGroupId(event: any) {
diff --git a/src/components/EditGroupModal.vue b/src/components/EditGroupModal.vue
index 1c5d53d6..06aa6972 100644
--- a/src/components/EditGroupModal.vue
+++ b/src/components/EditGroupModal.vue
@@ -37,6 +37,7 @@ import logger from "@/logger";
 import { hasError, showToast } from "@/utils";
 import { ChannelService } from '@/services/ChannelService'
 import store from "@/store";
+import emitter from "@/event-bus";
 
 const props = defineProps(["group"]);
 const formData = ref({
@@ -54,9 +55,10 @@ function isGroupUpdated() {
 }
 
 async function updateGroup() {
+  emitter.emit("presentLoader");
   try {
     const resp = await ChannelService.updateGroup({...formData.value, facilityGroupId: props.group.facilityGroupId})
-
+    
     if(!hasError(resp)) {
       store.dispatch("channel/updateGroup", { facilityGroupId: props.group.facilityGroupId, ...formData.value })
       showToast(translate("Group updated successfully."))
@@ -68,6 +70,7 @@ async function updateGroup() {
     showToast(translate("Failed to update group."))
     logger.error(err);
   }
+  emitter.emit("dismissLoader");
 }
 
 function closeModal() {
diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 5c94aac7..1900d700 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -44,6 +44,7 @@ import { UtilService } from '@/services/UtilService';
 import { hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import { useStore } from 'vuex';
+import emitter from '@/event-bus';
 
 const router = useRouter();
 const store = useStore();
@@ -80,17 +81,19 @@ async function changeOrderLimitPopover(ev: Event) {
 async function updateFacility(maximumOrderLimit: number | string) {
   let resp;
 
+  emitter.emit("presentLoader");
+  
   try {
     resp = await UtilService.updateFacility({
       ...props.facility,
       maximumOrderLimit
     })
-
+    
     if(!hasError(resp)) {
       const updatedFacilities = JSON.parse(JSON.stringify(facilities.value))
       const currentFacility = updatedFacilities.find((facility: any) => facility.facilityId === props.facility.facilityId)
       currentFacility.maximumOrderLimit = maximumOrderLimit;
-
+      
       showToast(translate("Order fulfillment capacity updated successfully"))
       await store.dispatch("util/updateFacilities", { facilities: updatedFacilities })
     } else {
@@ -100,5 +103,6 @@ async function updateFacility(maximumOrderLimit: number | string) {
     showToast(translate("Failed to update facility"))
     logger.error("Failed to update facility", err)
   }
+  emitter.emit("dismissLoader");
 }
 </script>
\ No newline at end of file
diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 144fb674..5c3541f9 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -46,6 +46,7 @@ import { ChannelService } from "@/services/ChannelService";
 import { UtilService } from "@/services/UtilService";
 import { hasError, showToast } from "@/utils";
 import logger from "@/logger";
+import emitter from "@/event-bus";
 
 const store = useStore();
 const queryString = ref('');
@@ -111,9 +112,10 @@ function areFacilitiesUpdated() {
 }
 
 async function saveFacilities() {
+  emitter.emit("presentLoader");
   const facilitiesToAdd = selectedFacilityValues.value.filter((selectedFacility: any) => !props.selectedFacilities.some((facility: any) => facility.facilityId === selectedFacility.facilityId))
   const facilitiesToRemove = props.selectedFacilities.filter((facility: any) => !selectedFacilityValues.value.some((selectedFacility: any) => facility.facilityId === selectedFacility.facilityId))
-
+  
   const removeResponses = await Promise.allSettled(facilitiesToRemove
     .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
       facilityId: facility.facilityId,
@@ -122,7 +124,7 @@ async function saveFacilities() {
       thruDate: DateTime.now().toMillis()
     }))
   )
-
+  
   const addResponses = await Promise.allSettled(facilitiesToAdd
     .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
       facilityId: facility.facilityId,
@@ -130,7 +132,7 @@ async function saveFacilities() {
       fromDate: DateTime.now().toMillis()
     }))
   )
-
+  
   const hasFailedResponse = [...removeResponses, ...addResponses].some((response: any) => response.status === 'rejected')
   if(hasFailedResponse) {
     showToast(translate("Failed to associate some facilites to group."))
@@ -139,6 +141,7 @@ async function saveFacilities() {
   }
   await store.dispatch("channel/fetchGroupFacilities", props.group.facilityGroupId);
   modalController.dismiss()  
+  emitter.emit("dismissLoader");
 }
 </script>
 
diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index 13603db8..a0234584 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -44,6 +44,7 @@ import { hasError, showToast } from "@/utils";
 import { ChannelService } from '@/services/ChannelService';
 import logger from "@/logger";
 import { DateTime } from "luxon";
+import emitter from "@/event-bus";
 
 const store = useStore();
 const selectedFacilityId = ref("");
@@ -66,6 +67,8 @@ async function saveFacility() {
   }
   let resp = {} as any;
   
+  emitter.emit("presentLoader");
+
   try {
     if(props.selectedConfigFacilityId?.facilityId) {
       resp = await ChannelService.updateFacilityAssociationWithGroup({
@@ -95,6 +98,7 @@ async function saveFacility() {
     showToast(translate("Failed to update threshold facility."))
   }
   await store.dispatch("channel/fetchGroupFacilities", props.group.facilityGroupId);
+  emitter.emit("dismissLoader");
 }
 
 function isFacilityUpdated() {
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 0df3cd40..43a2503b 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -123,6 +123,7 @@ import logger from '@/logger';
 import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
 import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModal.vue';
 import UpdateFacilityGroupModal from '@/components/UpdateFacilityGroupModal.vue';
+import emitter from '@/event-bus';
 
 const router = useRouter();
 const store = useStore();
@@ -165,6 +166,8 @@ async function editThreshold() {
           return false;
         }
 
+        emitter.emit("presentLoader");
+
         const rule = JSON.parse(JSON.stringify(props.rule))
 
         if(!rule.ruleActions?.length) {
@@ -187,6 +190,7 @@ async function editThreshold() {
           showToast(translate("Failed to update threshold."))
           logger.error(err);
         }
+        emitter.emit("dismissLoader");
       }
     }]
   })
@@ -216,6 +220,8 @@ async function editSafetyStock() {
           return false;
         }
 
+        emitter.emit("presentLoader");
+
         const rule = JSON.parse(JSON.stringify(props.rule))
 
         if(!rule.ruleActions?.length) {
@@ -238,6 +244,7 @@ async function editSafetyStock() {
           showToast(translate("Failed to update safety stock."))
           logger.error(err);
         }
+        emitter.emit("dismissLoader");
       }
     }]
   })
@@ -262,6 +269,7 @@ async function editRuleName() {
       text: translate('Update'),
       handler: async(data) => {
         if(data.name) {
+          emitter.emit("presentLoader");
           const rule = JSON.parse(JSON.stringify(props.rule))
           rule.ruleName = data.name
 
@@ -274,6 +282,7 @@ async function editRuleName() {
             logger.error(err)
             showToast(translate("Failed to update rule name."))
           }
+          emitter.emit("dismissLoader");
         }
       }
     }]
@@ -322,9 +331,10 @@ async function archiveRule() {
       }, {
         text: translate('Yes'),
         handler: async () => {
+          emitter.emit("presentLoader");
           const rule = JSON.parse(JSON.stringify(props.rule))
           rule.statusId = "ATP_RULE_ARCHIVED"
-
+          
           try {
             await RuleService.updateRule(rule, props.rule.ruleId)
             await store.dispatch('rule/archiveRule', { rule })
@@ -334,6 +344,7 @@ async function archiveRule() {
             showToast(translate("Failed to update threhold."))
             logger.error(err);
           }
+          emitter.emit("dismissLoader");
         }
       }]
     });
@@ -396,12 +407,13 @@ async function updateRulePickup(event: any) {
   event.stopImmediatePropagation();
   const isChecked = !event.target.checked;
   
+  emitter.emit("presentLoader");
   try {
     const rule = JSON.parse(JSON.stringify(props.rule))
     rule.ruleActions.map((action: any) => {
       if(action.actionTypeEnumId === "ATP_ALLOW_PICKUP") action.fieldValue = isChecked
     })
-
+    
     await RuleService.updateRule(rule, props.rule.ruleId)
     showToast(translate("Rule pickup updated successfully."))
     await store.dispatch('rule/updateRuleData', { rule })
@@ -410,12 +422,14 @@ async function updateRulePickup(event: any) {
     logger.error(err)
     showToast(translate("Failed to update rule pickup."))
   }
+  emitter.emit("dismissLoader");
 }
 
 async function updateRuleShipping(event: any) {
   event.stopImmediatePropagation();
   const isChecked = !event.target.checked;
 
+  emitter.emit("presentLoader");
   try {
     const rule = JSON.parse(JSON.stringify(props.rule))
     rule.ruleActions.map((action: any) => {
@@ -430,6 +444,7 @@ async function updateRuleShipping(event: any) {
     logger.error(err)
     showToast(translate("Failed to update rule brokering."))
   }
+  emitter.emit("dismissLoader");
 }
 
 async function updateRuleOrder(ruleDir: string) {
diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
index a5cc377b..864a2858 100644
--- a/src/components/ScheduleActionsPopover.vue
+++ b/src/components/ScheduleActionsPopover.vue
@@ -29,6 +29,7 @@ import { hasError, showToast } from "@/utils";
 import logger from "@/logger";
 import RuleGroupHistoryModal from '@/components/RuleGroupHistoryModal.vue';
 import { popoverController } from "@ionic/core";
+import emitter from "@/event-bus";
 
 const store = useStore();
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
@@ -40,6 +41,7 @@ async function disableRuleGroup() {
     systemMessageRemoteId: "RemoteSftp"
   }
 
+  emitter.emit("presentLoader");
   try {
     const resp = await RuleService.scheduleRuleGroup(payload)
     if(!hasError(resp)){
@@ -55,6 +57,7 @@ async function disableRuleGroup() {
     showToast(translate("Failed to disable rule group."))
     logger.error(err)
   }
+  emitter.emit("dismissLoader");
 }
 
 async function openRuleGroupHistoryModal() {
@@ -79,6 +82,7 @@ async function runNow() {
         {
           text: translate("Run now"),
           handler: async () => {
+            emitter.emit("presentLoader");
             // Checking that if we already have the job schedule before calling runNow, because if the job scheduler is not present then runNow action can't be performed
             // If the scheduler for the job is available then we will have jobName, if not then first scheduling the job in draft status just to create a routing schedule and then calling runNow action
             if(!ruleGroup.value.jobName) {
@@ -94,6 +98,7 @@ async function runNow() {
                 }
               } catch(err) {
                 logger.error(err)
+                emitter.emit("dismissLoader");
                 return;
               }
             }
@@ -110,6 +115,7 @@ async function runNow() {
               showToast(translate("Failed to schedule service"))
               logger.error(err)
             }
+            emitter.emit("dismissLoader");
           }
         }
       ]
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index a5ba0065..ee15d203 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -39,6 +39,7 @@ import { useStore } from 'vuex';
 import logger from '@/logger';
 import { RuleService } from '@/services/RuleService';
 import { DateTime } from 'luxon';
+import emitter from '@/event-bus';
 
 const store = useStore();
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
@@ -65,6 +66,7 @@ async function saveSchedule() {
     systemMessageRemoteId: "RemoteSftp"
   }
 
+  emitter.emit("presentLoader");
   try {
     const resp = await RuleService.scheduleRuleGroup(payload)
     if(!hasError(resp)) {
@@ -77,6 +79,7 @@ async function saveSchedule() {
     showToast(translate("Failed to schedule service"))
     logger.error(err)
   }
+  emitter.emit("dismissLoader");
 }
 
 function timeTillJob(time: any) {
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index f66eb988..4db9fe13 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -58,6 +58,7 @@ import { translate } from "@/i18n";
 import { RuleService } from "@/services/RuleService";
 import { showToast } from "@/utils";
 import logger from "@/logger";
+import emitter from "@/event-bus";
 
 const store = useStore();
 const props = defineProps(["rule", "selectedFacilities"])
@@ -87,8 +88,9 @@ function isSelected(currentFacilityId: any) {
 }
 
 async function saveFacilities() {  
+  emitter.emit("presentLoader");
   const rule = JSON.parse(JSON.stringify(props.rule))
-
+  
   const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
   if(condition) {
     condition.fieldValue = selectedFacilityValues.join(",")
@@ -112,6 +114,7 @@ async function saveFacilities() {
     showToast(translate("Failed to update config facilities."))
     logger.error(err)
   }
+  emitter.emit("dismissLoader");
 }
 </script>
 
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index 0b3233c9..e63fdcc3 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -69,6 +69,7 @@ import { RuleService } from "@/services/RuleService";
 import { translate } from "@/i18n";
 import { showToast } from "@/utils";
 import logger from "@/logger";
+import emitter from "@/event-bus";
 
 const selectedSegment = ref("included")
 const includedGroups = ref([]) as any;
@@ -114,6 +115,7 @@ function isSelected(value: string) {
 }
 
 async function saveFacilityGroups() {
+  emitter.emit("presentLoader");
   const rule = JSON.parse(JSON.stringify(props.rule))
 
   if(!rule.ruleConditions) rule.ruleConditions = []
@@ -155,6 +157,7 @@ async function saveFacilityGroups() {
     showToast(translate("Failed to update facility groups."))
     logger.error(err);
   }
+  emitter.emit("dismissLoader");
 }
 </script>
 
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index 60ed5805..44fb3b7a 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -75,6 +75,7 @@ import { RuleService } from "@/services/RuleService";
 import { translate } from "@/i18n";
 import { hasError, showToast } from "@/utils";
 import logger from "@/logger";
+import emitter from "@/event-bus";
 
 const queryString = ref('');
 const facetOptions = ref([]) as any;
@@ -162,6 +163,7 @@ function isSelected(value: string) {
 }
 
 async function saveFilters() {
+  emitter.emit("presentLoader");
   const rule = JSON.parse(JSON.stringify(props.rule))
 
   if(!rule.ruleConditions) rule.ruleConditions = []
@@ -203,6 +205,7 @@ async function saveFilters() {
     showToast(translate("Failed to update product filters."))
     logger.error(err);
   }
+  emitter.emit("dismissLoader");
 }
 </script>
 
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index d997bf47..c5d10db2 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -92,6 +92,7 @@ import { RuleService } from '@/services/RuleService';
 import { useRouter } from 'vue-router';
 import logger from '@/logger';
 import { showToast } from '@/utils';
+import emitter from '@/event-bus';
 
 const router = useRouter();
 const store = useStore();
@@ -199,6 +200,8 @@ async function createRule() {
 
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_SAFETY_STOCK" });
 
+  emitter.emit("presentLoader");
+
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
@@ -229,6 +232,7 @@ async function createRule() {
   } catch(err: any) {
     logger.error(err);
     showToast(translate("Failed to create rule."))
-  }  
+  }
+  emitter.emit("dismissLoader");
 }
 </script>
\ No newline at end of file
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 47bdb403..8c0aba2d 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -110,6 +110,7 @@ import { RuleService } from '@/services/RuleService';
 import { showToast } from '@/utils';
 import logger from '@/logger';
 import { useRouter } from 'vue-router';
+import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter();
@@ -184,6 +185,8 @@ async function createRule() {
 
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
 
+  emitter.emit("presentLoader");
+
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
@@ -215,6 +218,7 @@ async function createRule() {
     logger.error(err);
     showToast(translate("Failed to create rule."))
   }
+  emitter.emit("dismissLoader");
 }
 
 function generateRuleActions(ruleId: string) {
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 1e5a9fc7..c6adadf9 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -110,6 +110,7 @@ import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
 import { showToast } from '@/utils';
 import logger from '@/logger';
+import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter();
@@ -184,6 +185,8 @@ async function createRule() {
 
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
 
+  emitter.emit("presentLoader");
+
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
@@ -215,6 +218,7 @@ async function createRule() {
     logger.error(err);
     showToast(translate("Failed to create rule."))
   }
+  emitter.emit("dismissLoader");
 }
 
 function generateRuleActions(ruleId: string) {
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 49915b21..aba3b753 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -86,6 +86,7 @@ import { RuleService } from '@/services/RuleService';
 import { showToast } from '@/utils';
 import logger from '@/logger';
 import router from '@/router';
+import emitter from '@/event-bus';
 
 const store = useStore();
 const formData = ref({
@@ -176,6 +177,8 @@ async function createThresholdRule() {
 
   let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_THRESHOLD" });
 
+  emitter.emit("presentLoader");
+
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
@@ -207,7 +210,8 @@ async function createThresholdRule() {
   } catch(err: any) {
     logger.error(err);
     showToast(translate("Failed to create rule."))
-  }  
+  }
+  emitter.emit("dismissLoader");
 }
 </script>
 
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index a3ed27e4..644f4c0c 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -133,6 +133,7 @@ import LinkFacilitiesToGroupModal from '@/components/LinkFacilitiesToGroupModal.
 import LinkThresholdFacilitiesToGroupModal from '@/components/LinkThresholdFacilitiesToGroupModal.vue'
 import { useStore } from 'vuex';
 import EditGroupModal from '@/components/EditGroupModal.vue';
+import emitter from '@/event-bus';
 
 const store = useStore();
 
@@ -141,7 +142,9 @@ const selectedSegment = ref("channels")
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
 
 onMounted(async () => {
+  emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch("channel/fetchInventoryChannels"), store.dispatch("util/fetchConfigFacilities")]);
+  emitter.emit("dismissLoader");
 })
 
 async function openShopActionsPopover(event: Event) {
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index c483c441..142247a7 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -38,6 +38,7 @@ import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useStore } from 'vuex';
 import { computed } from 'vue';
 import { translate } from '@/i18n';
+import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter()
@@ -46,7 +47,9 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onIonViewWillEnter(async() => {
+  emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
+  emitter.emit("dismissLoader");
 })
 
 function createRule() {
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index e96437a1..4b255182 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -71,6 +71,7 @@ import FacilityItem from '@/components/FacilityItem.vue';
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
 import { useStore } from 'vuex';
+import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter()
@@ -86,7 +87,9 @@ const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
 onIonViewWillEnter(async() => {
+  emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  emitter.emit("dismissLoader");
 })
 
 async function fetchFacilities(vSize?: any, vIndex?: any) {
@@ -128,12 +131,14 @@ async function loadMoreFacilities(event: any) {
 }
 
 async function updateRuleGroup() {
+  emitter.emit("presentLoader");
   if(selectedSegment.value === 'facility') {
     isScrollingEnabled.value = false;
     await fetchFacilities();
   } else {
     await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
   }
+  emitter.emit("dismissLoader");
 }
 
 function createShipping() {
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index ebd0a6bb..a81fbefa 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -72,6 +72,7 @@ import { translate } from '@/i18n';
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
 import { useStore } from 'vuex';
+import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter()
@@ -86,7 +87,9 @@ const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
 onIonViewWillEnter(async() => {
+  emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  emitter.emit("dismissLoader");
 })
 
 
@@ -128,12 +131,14 @@ async function loadMoreFacilities(event: any) {
 }
 
 async function updateRuleGroup() {
+  emitter.emit("presentLoader");
   if(selectedSegment.value === 'facility') {
     isScrollingEnabled.value = false;
     await fetchFacilities();
   } else {
     await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
   }
+  emitter.emit("dismissLoader");
 }
 
 function createStorePickup() {
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 5f8ddb7e..b2a64622 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -38,6 +38,7 @@ import { useRouter } from 'vue-router';
 import { computed } from 'vue';
 import { useStore } from 'vuex';
 import { translate } from '@/i18n';
+import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter()
@@ -46,7 +47,9 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onIonViewWillEnter(async() => {
+  emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  emitter.emit("dismissLoader");
 })
 
 function CreateThreshold() {

From 7889033906b3b8d8788a977d2b935bacef7d2524 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 15:50:23 +0530
Subject: [PATCH 119/250] Reverted: unwanted spaces added to the code (#270)

---
 src/components/EditGroupModal.vue              | 2 +-
 src/components/FacilityItem.vue                | 4 ++--
 src/components/LinkFacilitiesToGroupModal.vue  | 6 +++---
 src/components/RuleItem.vue                    | 4 ++--
 src/components/SelectConfigFacilitiesModal.vue | 2 +-
 5 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/EditGroupModal.vue b/src/components/EditGroupModal.vue
index 06aa6972..d913aba8 100644
--- a/src/components/EditGroupModal.vue
+++ b/src/components/EditGroupModal.vue
@@ -58,7 +58,7 @@ async function updateGroup() {
   emitter.emit("presentLoader");
   try {
     const resp = await ChannelService.updateGroup({...formData.value, facilityGroupId: props.group.facilityGroupId})
-    
+
     if(!hasError(resp)) {
       store.dispatch("channel/updateGroup", { facilityGroupId: props.group.facilityGroupId, ...formData.value })
       showToast(translate("Group updated successfully."))
diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 1900d700..9c83f358 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -88,12 +88,12 @@ async function updateFacility(maximumOrderLimit: number | string) {
       ...props.facility,
       maximumOrderLimit
     })
-    
+
     if(!hasError(resp)) {
       const updatedFacilities = JSON.parse(JSON.stringify(facilities.value))
       const currentFacility = updatedFacilities.find((facility: any) => facility.facilityId === props.facility.facilityId)
       currentFacility.maximumOrderLimit = maximumOrderLimit;
-      
+
       showToast(translate("Order fulfillment capacity updated successfully"))
       await store.dispatch("util/updateFacilities", { facilities: updatedFacilities })
     } else {
diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 5c3541f9..e53f4510 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -115,7 +115,7 @@ async function saveFacilities() {
   emitter.emit("presentLoader");
   const facilitiesToAdd = selectedFacilityValues.value.filter((selectedFacility: any) => !props.selectedFacilities.some((facility: any) => facility.facilityId === selectedFacility.facilityId))
   const facilitiesToRemove = props.selectedFacilities.filter((facility: any) => !selectedFacilityValues.value.some((selectedFacility: any) => facility.facilityId === selectedFacility.facilityId))
-  
+
   const removeResponses = await Promise.allSettled(facilitiesToRemove
     .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
       facilityId: facility.facilityId,
@@ -124,7 +124,7 @@ async function saveFacilities() {
       thruDate: DateTime.now().toMillis()
     }))
   )
-  
+
   const addResponses = await Promise.allSettled(facilitiesToAdd
     .map(async (facility: any) => await ChannelService.updateFacilityAssociationWithGroup({
       facilityId: facility.facilityId,
@@ -132,7 +132,7 @@ async function saveFacilities() {
       fromDate: DateTime.now().toMillis()
     }))
   )
-  
+
   const hasFailedResponse = [...removeResponses, ...addResponses].some((response: any) => response.status === 'rejected')
   if(hasFailedResponse) {
     showToast(translate("Failed to associate some facilites to group."))
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 43a2503b..c2d64958 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -334,7 +334,7 @@ async function archiveRule() {
           emitter.emit("presentLoader");
           const rule = JSON.parse(JSON.stringify(props.rule))
           rule.statusId = "ATP_RULE_ARCHIVED"
-          
+
           try {
             await RuleService.updateRule(rule, props.rule.ruleId)
             await store.dispatch('rule/archiveRule', { rule })
@@ -413,7 +413,7 @@ async function updateRulePickup(event: any) {
     rule.ruleActions.map((action: any) => {
       if(action.actionTypeEnumId === "ATP_ALLOW_PICKUP") action.fieldValue = isChecked
     })
-    
+
     await RuleService.updateRule(rule, props.rule.ruleId)
     showToast(translate("Rule pickup updated successfully."))
     await store.dispatch('rule/updateRuleData', { rule })
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index 4db9fe13..e7ddba6c 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -90,7 +90,7 @@ function isSelected(currentFacilityId: any) {
 async function saveFacilities() {  
   emitter.emit("presentLoader");
   const rule = JSON.parse(JSON.stringify(props.rule))
-  
+
   const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
   if(condition) {
     condition.fieldValue = selectedFacilityValues.join(",")

From adf92f2db17229e25b4d9db61c2bd1b4c189ae89 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 16:11:14 +0530
Subject: [PATCH 120/250] Fixed: facility validation not working properly while
 store pickup and shipping rule creation (#278)

---
 src/locales/en.json                 | 1 +
 src/views/CreateShippingRule.vue    | 6 +++---
 src/views/CreateStorePickupRule.vue | 6 +++---
 3 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index b966e84f..1c343d91 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -139,6 +139,7 @@
   "Paused": "Paused",
   "Pending": "Pending",
   "Please enter a threshold value to set for these products before proceeding.": "Please enter a threshold value to set for these products before proceeding.",
+  "Please include atleast one facility group.": "Please include atleast one facility group.",
   "Please fill in all the required fields.": "Please fill in all the required fields.",
   "Please select atleast one config facility.": "Please select atleast one config facility.",
   "Product and facility": "Product and facility",
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 47bdb403..4c884730 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -174,10 +174,10 @@ async function createRule() {
     return;
   }
 
-  if( selectedSegment.value === 'RG_SHIPPING_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
-    showToast(translate("Please fill in all the required fields."))
+  if(selectedSegment.value === 'RG_SHIPPING_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please include atleast one facility group."))
     return;
-  } else if(!formData.value.selectedConfigFacilites.length) {
+  } else if(selectedSegment.value === 'RG_SHIPPING_CHANNEL' && !formData.value.selectedConfigFacilites.length) {
     showToast(translate("Please select atleast one config facility."))
     return;
   }
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 1e5a9fc7..70520f18 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -174,10 +174,10 @@ async function createRule() {
     return;
   }
 
-  if( selectedSegment.value === 'RG_PICKUP_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
-    showToast(translate("Please fill in all the required fields."))
+  if(selectedSegment.value === 'RG_PICKUP_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please include atleast one facility group."))
     return;
-  } else if(!formData.value.selectedConfigFacilites.length) {
+  } else if(selectedSegment.value === 'RG_PICKUP_CHANNEL' && !formData.value.selectedConfigFacilites.length) {
     showToast(translate("Please select atleast one config facility."))
     return;
   }

From 42e6f7937a409143fc057c8600cfb4d4e1f2e521 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 16:30:47 +0530
Subject: [PATCH 121/250] Improved: payload for not fetching virtual facilities
 (#278)

---
 src/components/LinkFacilitiesToGroupModal.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 144fb674..ca8a5ea1 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -69,7 +69,11 @@ async function fetchFacilities () {
   try {
     let params = {
       productStoreId: store.state.user.currentEComStore.productStoreId,
-      pageSize: 20
+      pageSize: 20,
+      parentFacilityTypeId: 'VIRTUAL_FACILITY',
+      parentFacilityTypeId_not: 'Y',
+      facilityTypeId: 'VIRTUAL_FACILITY',
+      facilityTypeId_not: 'Y',
     } as any;
 
     if(queryString.value) {

From e6a938463145a51fcaf71123ce389c4dfbc72c2d Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 16:39:04 +0530
Subject: [PATCH 122/250] Improved: added optional character in case no
 selected facility come (#278)

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

diff --git a/src/components/LinkThresholdFacilitiesToGroupModal.vue b/src/components/LinkThresholdFacilitiesToGroupModal.vue
index 13603db8..0f01a381 100644
--- a/src/components/LinkThresholdFacilitiesToGroupModal.vue
+++ b/src/components/LinkThresholdFacilitiesToGroupModal.vue
@@ -98,7 +98,7 @@ async function saveFacility() {
 }
 
 function isFacilityUpdated() {
-  return props.selectedConfigFacilityId.facilityId !== selectedFacilityId.value
+  return props.selectedConfigFacilityId?.facilityId !== selectedFacilityId.value
 }
 </script>
 

From e5c14333740d4d04e339ce930fa9f92fd0993cc1 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 30 Apr 2024 16:42:01 +0530
Subject: [PATCH 123/250] Improved: code to show loader before fetching
 ruleGroup (#270)

---
 src/views/CreateSafetyStockRule.vue | 4 ++--
 src/views/CreateShippingRule.vue    | 4 ++--
 src/views/CreateStorePickupRule.vue | 4 ++--
 src/views/CreateThresholdRule.vue   | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index c5d10db2..476d2423 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -198,10 +198,10 @@ async function createRule() {
     return;
   }
 
-  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_SAFETY_STOCK" });
-
   emitter.emit("presentLoader");
 
+  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_SAFETY_STOCK" });
+
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 8c0aba2d..6813df21 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -183,10 +183,10 @@ async function createRule() {
     return;
   }
 
-  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
-
   emitter.emit("presentLoader");
 
+  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
+
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index c6adadf9..787996ed 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -183,10 +183,10 @@ async function createRule() {
     return;
   }
 
-  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
-
   emitter.emit("presentLoader");
 
+  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: selectedSegment.value });
+
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index aba3b753..22e22a92 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -175,10 +175,10 @@ async function createThresholdRule() {
     return;
   }
 
-  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_THRESHOLD" });
-
   emitter.emit("presentLoader");
 
+  let ruleGroup = await store.dispatch("rule/fetchRuleGroup", { groupTypeEnumId: "RG_THRESHOLD" });
+
   try {
     if(!ruleGroup.ruleGroupId) {
       ruleGroup = await RuleService.createRuleGroup({

From 0c5a86fc520a7f96c82ccdc6b64816cc626f7c63 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 1 May 2024 11:37:07 +0530
Subject: [PATCH 124/250] Improved: flow for reordering the rules

---
 src/components/RuleItem.vue              | 225 ++++++++++++-----------
 src/store/modules/rule/RuleState.ts      |   1 +
 src/store/modules/rule/actions.ts        |   4 +
 src/store/modules/rule/getters.ts        |   3 +
 src/store/modules/rule/index.ts          |   3 +-
 src/store/modules/rule/mutation-types.ts |   1 +
 src/store/modules/rule/mutations.ts      |   3 +
 src/views/SafetyStock.vue                |  20 +-
 8 files changed, 149 insertions(+), 111 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index c2d64958..94b57b84 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -1,117 +1,126 @@
 <template>
   <ion-card>
-    <ion-card-header>
-      <div>
-        <ion-card-subtitle class="overline">{{ rule.ruleId }}</ion-card-subtitle>
-        <ion-card-title>{{ rule.ruleName }}</ion-card-title>
-        <ion-card-subtitle>{{ ruleIndex+1 }}/{{ total }}</ion-card-subtitle>
-      </div>
-      <div>
-        <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === 0" @click="updateRuleOrder('prev')">
-          <ion-icon :icon="chevronUpOutline" slot="icon-only" />
-        </ion-button>
-        <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === rules.length - 1" @click="updateRuleOrder('next')">
-          <ion-icon :icon="chevronDownOutline" slot="icon-only" />
-        </ion-button>
-      </div>
-    </ion-card-header>
-
-    <ion-item lines="full" v-if="selectedPage.path === '/threshold'">
-      <ion-icon slot="start" :icon="globeOutline"/>
-      <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
-      <ion-chip slot="end" outline @click="editThreshold()">{{ rule.ruleActions?.length ? rule.ruleActions[0]?.fieldValue : '-' }}</ion-chip>
-    </ion-item>
-    <ion-item lines="full" v-else-if="selectedPage.path === '/safety-stock'">
-      <ion-icon slot="start" :icon="pulseOutline"/>
-      <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
-      <ion-chip slot="end" outline @click="editSafetyStock()">{{ rule.ruleActions?.length ? rule.ruleActions[0].fieldValue : '-' }}</ion-chip>
-    </ion-item>
-    <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">
-      <ion-icon slot="start" :icon="storefrontOutline"/>
-      <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRulePickup($event)">{{ translate(selectedPage.name) }}</ion-toggle>
-    </ion-item>
-    <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
-      <ion-icon slot="start" :icon="sendOutline"/>
-      <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRuleShipping($event)">{{ translate(selectedPage.name) }}</ion-toggle>
-    </ion-item>
-
-    <ion-list>
-      <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL' || selectedSegment === 'RG_SHIPPING_CHANNEL'">
-        <ion-item-divider color="light">
-          <ion-label>{{ translate("Channels") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()">
-            <ion-icon :icon="optionsOutline" slot="icon-only" />
-          </ion-button>
-        </ion-item-divider>
-
-        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FACILITIES')" lines="none">
-          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FACILITIES") }}</ion-label>
-        </ion-item>
-      </template>
+    <ion-accordion-group :value="isReorderActive">
+      <ion-accordion value="false">
+        <!-- <ion-item slot="header" color="light">
+          <ion-label>First Accordion</ion-label>
+        </ion-item> -->
+        <ion-card-header slot="header">
+          <div>
+            <ion-card-subtitle class="overline">{{ rule.ruleId }}</ion-card-subtitle>
+            <ion-card-title>{{ rule.ruleName }}</ion-card-title>
+            <ion-card-subtitle>{{ ruleIndex+1 }}/{{ total }}</ion-card-subtitle>
+          </div>
+          <div>
+            <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === 0" @click="updateRuleOrder('prev')">
+              <ion-icon :icon="chevronUpOutline" slot="icon-only" />
+            </ion-button>
+            <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === rules.length - 1" @click="updateRuleOrder('next')">
+              <ion-icon :icon="chevronDownOutline" slot="icon-only" />
+            </ion-button>
+          </div>
+        </ion-card-header>
+        <div slot="content">
+          <ion-item lines="full" v-if="selectedPage.path === '/threshold'">
+            <ion-icon slot="start" :icon="globeOutline"/>
+            <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
+            <ion-chip slot="end" outline @click="editThreshold()">{{ rule.ruleActions?.length ? rule.ruleActions[0]?.fieldValue : '-' }}</ion-chip>
+          </ion-item>
+          <ion-item lines="full" v-else-if="selectedPage.path === '/safety-stock'">
+            <ion-icon slot="start" :icon="pulseOutline"/>
+            <ion-label class="ion-text-wrap">{{ translate(selectedPage.name) }}</ion-label>
+            <ion-chip slot="end" outline @click="editSafetyStock()">{{ rule.ruleActions?.length ? rule.ruleActions[0].fieldValue : '-' }}</ion-chip>
+          </ion-item>
+          <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">
+            <ion-icon slot="start" :icon="storefrontOutline"/>
+            <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRulePickup($event)">{{ translate(selectedPage.name) }}</ion-toggle>
+          </ion-item>
+          <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
+            <ion-icon slot="start" :icon="sendOutline"/>
+            <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRuleShipping($event)">{{ translate(selectedPage.name) }}</ion-toggle>
+          </ion-item>
       
-      <template v-else>
-        <ion-item-divider color="light">
-          <ion-label>{{ translate("Facility groups") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium" @click="openUpdateFacilityGroupModal()">
-            <ion-icon :icon="optionsOutline" slot="icon-only" />
-          </ion-button>
-        </ion-item-divider>
-        
-        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')">
-          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
-        </ion-item>
-        <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'not-in')">
-          <ion-icon slot="start" :icon="closeCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "not-in") }}</ion-label>
-        </ion-item>
-      </template>
-
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Product tags") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium" @click="openUpdateProductFiltersModal('tags', 'tagsFacet', 'tags')">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
-      </ion-item-divider>
-
-      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
-        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
-      </ion-item>
-      <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
-        <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
-      </ion-item>
-
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Product features") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium"  @click="openUpdateProductFiltersModal('product features', 'productFeaturesFacet', 'productFeatures')">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
-      </ion-item-divider>
-
-      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
-        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
-      </ion-item>
-      <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
-        <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
-      </ion-item>
-
-      <ion-item lines="none">
-        <ion-button @click="editRuleName()" fill="clear">{{ translate("Edit name") }}</ion-button>
-        <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
-          <ion-icon :icon="archiveOutline" slot="icon-only"/>
-        </ion-button>
-      </ion-item>
-    </ion-list>
+          <ion-list>
+            <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL' || selectedSegment === 'RG_SHIPPING_CHANNEL'">
+              <ion-item-divider color="light">
+                <ion-label>{{ translate("Channels") }}</ion-label>
+                <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()">
+                  <ion-icon :icon="optionsOutline" slot="icon-only" />
+                </ion-button>
+              </ion-item-divider>
+      
+              <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FACILITIES')" lines="none">
+                <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+                <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FACILITIES") }}</ion-label>
+              </ion-item>
+            </template>
+            
+            <template v-else>
+              <ion-item-divider color="light">
+                <ion-label>{{ translate("Facility groups") }}</ion-label>
+                <ion-button slot="end" fill="clear" color="medium" @click="openUpdateFacilityGroupModal()">
+                  <ion-icon :icon="optionsOutline" slot="icon-only" />
+                </ion-button>
+              </ion-item-divider>
+              
+              <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')">
+                <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+                <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
+              </ion-item>
+              <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'not-in')">
+                <ion-icon slot="start" :icon="closeCircleOutline"/>
+                <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "not-in") }}</ion-label>
+              </ion-item>
+            </template>
+      
+            <ion-item-divider color="light">
+              <ion-label>{{ translate("Product tags") }}</ion-label>
+              <ion-button slot="end" fill="clear" color="medium" @click="openUpdateProductFiltersModal('tags', 'tagsFacet', 'tags')">
+                <ion-icon :icon="optionsOutline" slot="icon-only" />
+              </ion-button>
+            </ion-item-divider>
+      
+            <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
+              <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+              <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
+            </ion-item>
+            <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
+              <ion-icon slot="start" :icon="closeCircleOutline"/>
+              <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
+            </ion-item>
+      
+            <ion-item-divider color="light">
+              <ion-label>{{ translate("Product features") }}</ion-label>
+              <ion-button slot="end" fill="clear" color="medium"  @click="openUpdateProductFiltersModal('product features', 'productFeaturesFacet', 'productFeatures')">
+                <ion-icon :icon="optionsOutline" slot="icon-only" />
+              </ion-button>
+            </ion-item-divider>
+      
+            <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
+              <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+              <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
+            </ion-item>
+            <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
+              <ion-icon slot="start" :icon="closeCircleOutline"/>
+              <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
+            </ion-item>
+      
+            <ion-item lines="none">
+              <ion-button @click="editRuleName()" fill="clear">{{ translate("Edit name") }}</ion-button>
+              <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
+                <ion-icon :icon="archiveOutline" slot="icon-only"/>
+              </ion-button>
+            </ion-item>
+          </ion-list>
+        </div>
+      </ion-accordion>
+      
+    </ion-accordion-group>
   </ion-card>
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController, modalController } from '@ionic/vue';
+import { IonAccordion, IonAccordionGroup, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController, modalController } from '@ionic/vue';
 import { computed, defineProps, onMounted, ref } from 'vue';
 import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
@@ -133,11 +142,13 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 const rules = computed(() => store.getters["rule/getRules"]);
+const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
 
 const selectedPage = ref({
   path: '',
   name: ''
 }) as any;
+const cardStatus = ref(props.cardStatus);
 
 onMounted(() => {
   selectedPage.value.path = router.currentRoute.value.path
diff --git a/src/store/modules/rule/RuleState.ts b/src/store/modules/rule/RuleState.ts
index eb62feae..a5902ff1 100644
--- a/src/store/modules/rule/RuleState.ts
+++ b/src/store/modules/rule/RuleState.ts
@@ -1,4 +1,5 @@
 export default interface RuleState {
   rules: any;
   ruleGroup: any;
+  isReorderActive: boolean;
 }
\ No newline at end of file
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index f1a47216..7e5f8b59 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -108,6 +108,10 @@ const actions: ActionTree<RuleState, RootState> = {
   async clearRuleState({ commit }) {
     commit(types.RULE_CLEARED)
   },
+
+  async updateIsReorderActive({ commit }, payload) {
+    commit(types.RULE_IS_REORDER_ACTIVE_UPDATED, payload)
+  },
 }
 
 export default actions;
\ No newline at end of file
diff --git a/src/store/modules/rule/getters.ts b/src/store/modules/rule/getters.ts
index 17899261..375132ad 100644
--- a/src/store/modules/rule/getters.ts
+++ b/src/store/modules/rule/getters.ts
@@ -11,6 +11,9 @@ const getters: GetterTree <RuleState, RootState> = {
   },
   getRuleGroup (state) {
     return state.ruleGroup
+  },
+  getIsReorderActive (state) {
+    return state.isReorderActive
   }
 }
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/rule/index.ts b/src/store/modules/rule/index.ts
index d3e52d6d..62315378 100644
--- a/src/store/modules/rule/index.ts
+++ b/src/store/modules/rule/index.ts
@@ -12,7 +12,8 @@ const userModule: Module<RuleState, RootState> = {
       list: [],
       total: ''
     },
-    ruleGroup: {}
+    ruleGroup: {},
+    isReorderActive: false
   },
   getters,
   actions,
diff --git a/src/store/modules/rule/mutation-types.ts b/src/store/modules/rule/mutation-types.ts
index 487424e2..2e9c626b 100644
--- a/src/store/modules/rule/mutation-types.ts
+++ b/src/store/modules/rule/mutation-types.ts
@@ -1,4 +1,5 @@
 export const SN_RULE = 'rule'
 export const RULE_RULES_UPDATED = SN_RULE + '/RULES_UPDATED'
 export const RULE_GROUP_UPDATED = SN_RULE + '/GROUP_UPDATED'
+export const RULE_IS_REORDER_ACTIVE_UPDATED = SN_RULE + '/IS_REORDER_ACTIVE_UPDATED'
 export const RULE_CLEARED = SN_RULE + "/CLEARED"
\ No newline at end of file
diff --git a/src/store/modules/rule/mutations.ts b/src/store/modules/rule/mutations.ts
index fecbe0fd..eb842602 100644
--- a/src/store/modules/rule/mutations.ts
+++ b/src/store/modules/rule/mutations.ts
@@ -10,6 +10,9 @@ const mutations: MutationTree <RuleState> = {
   [types.RULE_GROUP_UPDATED] (state, payload) {
     state.ruleGroup = payload;
   },
+  [types.RULE_IS_REORDER_ACTIVE_UPDATED] (state, payload) {
+    state.isReorderActive = payload;
+  },
   [types.RULE_CLEARED](state) {
     state.rules = {
       list: [],
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 142247a7..58b0d43b 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -4,6 +4,11 @@
       <ion-toolbar>
         <ion-menu-button slot="start" />
         <ion-title>{{ $t("Safety stock") }}</ion-title>
+        <ion-buttons slot="end">
+          <ion-button @click="updateReorderStatus()">
+            <ion-icon slot="icon-only" :icon="reorderTwoOutline" />
+          </ion-button>
+        </ion-buttons>
       </ion-toolbar>
     </ion-header>
 
@@ -30,13 +35,13 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { addOutline } from 'ionicons/icons';
+import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { addOutline, reorderTwoOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
 import { useRouter } from "vue-router";
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useStore } from 'vuex';
-import { computed } from 'vue';
+import { computed, ref } from 'vue';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
 
@@ -45,6 +50,7 @@ const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
 
 onIonViewWillEnter(async() => {
   emitter.emit("presentLoader");
@@ -52,6 +58,14 @@ onIonViewWillEnter(async() => {
   emitter.emit("dismissLoader");
 })
 
+function updateReorderStatus() {
+  if(isReorderActive.value === false) {
+    store.dispatch("rule/updateIsReorderActive", true);
+  } else {
+    store.dispatch("rule/updateIsReorderActive", false);
+  }
+}
+
 function createRule() {
   router.push({ path: '/create-safety-stock' })
 }

From 547c79180032f10b3be6a390b259f5861ef34047 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 1 May 2024 12:38:57 +0530
Subject: [PATCH 125/250] Improved: stopped the by default toggle behavior of
 ion-accordion

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

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 94b57b84..750d98ac 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -5,7 +5,7 @@
         <!-- <ion-item slot="header" color="light">
           <ion-label>First Accordion</ion-label>
         </ion-item> -->
-        <ion-card-header slot="header">
+        <ion-card-header slot="header" @click="$event.stopImmediatePropagation()">
           <div>
             <ion-card-subtitle class="overline">{{ rule.ruleId }}</ion-card-subtitle>
             <ion-card-title>{{ rule.ruleName }}</ion-card-title>

From 962794a23ae740c1b1fc473f94be4c39ae04caab Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 1 May 2024 16:34:36 +0530
Subject: [PATCH 126/250] Improved: reordering behavior to toggle using fav

---
 src/components/RuleItem.vue |  9 ++++++---
 src/views/SafetyStock.vue   | 29 +++++++++++++++++++----------
 2 files changed, 25 insertions(+), 13 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 750d98ac..8d354e7a 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -11,14 +11,17 @@
             <ion-card-title>{{ rule.ruleName }}</ion-card-title>
             <ion-card-subtitle>{{ ruleIndex+1 }}/{{ total }}</ion-card-subtitle>
           </div>
-          <div>
+          <ion-item lines=none>
+            <ion-reorder slot="end"></ion-reorder>
+          </ion-item>
+          <!-- <div>
             <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === 0" @click="updateRuleOrder('prev')">
               <ion-icon :icon="chevronUpOutline" slot="icon-only" />
             </ion-button>
             <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === rules.length - 1" @click="updateRuleOrder('next')">
               <ion-icon :icon="chevronDownOutline" slot="icon-only" />
             </ion-button>
-          </div>
+          </div> -->
         </ion-card-header>
         <div slot="content">
           <ion-item lines="full" v-if="selectedPage.path === '/threshold'">
@@ -120,7 +123,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonAccordion, IonAccordionGroup, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController, modalController } from '@ionic/vue';
+import { IonAccordion, IonAccordionGroup, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonReorder, IonToggle, alertController, modalController } from '@ionic/vue';
 import { computed, defineProps, onMounted, ref } from 'vue';
 import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 58b0d43b..cc803cfe 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -4,11 +4,6 @@
       <ion-toolbar>
         <ion-menu-button slot="start" />
         <ion-title>{{ $t("Safety stock") }}</ion-title>
-        <ion-buttons slot="end">
-          <ion-button @click="updateReorderStatus()">
-            <ion-icon slot="icon-only" :icon="reorderTwoOutline" />
-          </ion-button>
-        </ion-buttons>
       </ion-toolbar>
     </ion-header>
 
@@ -17,7 +12,9 @@
         <ScheduleRuleItem />
 
         <section>
-          <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          <ion-reorder-group :disabled="false" @ionItemReorder="handleReorder($event)">
+            <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          </ion-reorder-group>
         </section>
       </main>
 
@@ -26,8 +23,11 @@
       </div>
     </ion-content>
 
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createRule()">
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="ion-margin">
+      <ion-fab-button class="ion-margin-bottom" color="light" @click="updateReorderStatus()">
+        <ion-icon :icon="isReorderActive ? saveOutline : balloonOutline" />
+      </ion-fab-button>
+      <ion-fab-button :disabled="isReorderActive" @click="createRule()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -35,8 +35,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { addOutline, reorderTwoOutline } from 'ionicons/icons';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { addOutline, saveOutline, balloonOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
 import { useRouter } from "vue-router";
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
@@ -62,10 +62,19 @@ function updateReorderStatus() {
   if(isReorderActive.value === false) {
     store.dispatch("rule/updateIsReorderActive", true);
   } else {
+    emitter.emit("presentLoader", { message: "Saving order..." });
+  
+    setTimeout(() => {
+      emitter.emit("dismissLoader");
+    }, 3000)
     store.dispatch("rule/updateIsReorderActive", false);
   }
 }
 
+function handleReorder(event: CustomEvent) {
+  console.log(event.detail.complete(rules.value)); 
+}
+
 function createRule() {
   router.push({ path: '/create-safety-stock' })
 }

From c07c236bc3cb4a3d15e42e4004643724201d1c51 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 1 May 2024 16:53:47 +0530
Subject: [PATCH 127/250] Improved: added empty state text in the channels
 section in rule creation (#280)

---
 src/locales/en.json                 |  1 +
 src/views/CreateShippingRule.vue    | 29 +++++++++++++++++++----------
 src/views/CreateStorePickupRule.vue | 29 +++++++++++++++++++----------
 src/views/CreateThresholdRule.vue   | 10 +++++++++-
 4 files changed, 48 insertions(+), 21 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index b966e84f..467c407e 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -118,6 +118,7 @@
   "New safety stock rule": "New safety stock rule",
   "No Capacity": "No Capacity",
   "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. To add a fulfillment capacity to this facility, use the custom option.": "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility.{space} To add a fulfillment capacity to this facility, use the custom option.",
+  "No channel found for current product store.": "No channel found for current product store.",
   "No facility found.": "No facility found.",
   "No fulfillment capacity": "No fulfillment capacity",
   "No job found.": "No job found.",
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 6813df21..084d2f12 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -76,15 +76,20 @@
       </section>
 
       <section v-else>
-        <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
-          <ion-card-header>
-            <div>
-              <ion-card-title>{{ facility.facilityName }}</ion-card-title>
-              <ion-card-subtitle>{{ facility.facilityId }}</ion-card-subtitle>
-            </div>
-            <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
-          </ion-card-header>
-        </ion-card>
+        <template v-if="configFacilities.length">
+          <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
+            <ion-card-header>
+              <div>
+                <ion-card-title>{{ facility.facilityName }}</ion-card-title>
+                <ion-card-subtitle>{{ facility.facilityId }}</ion-card-subtitle>
+              </div>
+              <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
+            </ion-card-header>
+          </ion-card>
+        </template>
+        <div v-else class="empty-state">
+          <ion-note>{{ translate("No channel found for current product store.") }}</ion-note>
+        </div>
       </section>
 
       <ProductFilters />
@@ -99,7 +104,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
 import { computed, onMounted, ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
@@ -301,4 +306,8 @@ ion-card-header {
 ion-card-header > ion-checkbox {
   flex-shrink: 0;
 }
+
+.empty-state {
+  align-items: start;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 787996ed..ee392257 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -76,15 +76,20 @@
       </section>
 
       <section v-else>
-        <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
-          <ion-card-header>
-            <div>
-              <ion-card-title>{{ facility.facilityName }}</ion-card-title>
-              <ion-card-subtitle>{{ facility.facilityId }}</ion-card-subtitle>
-            </div>
-            <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
-          </ion-card-header>
-        </ion-card>
+        <template v-if="configFacilities.length">
+          <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
+            <ion-card-header>
+              <div>
+                <ion-card-title>{{ facility.facilityName }}</ion-card-title>
+                <ion-card-subtitle>{{ facility.facilityId }}</ion-card-subtitle>
+              </div>
+              <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
+            </ion-card-header>
+          </ion-card>
+        </template>
+        <div v-else class="empty-state">
+          <ion-note>{{ translate("No channel found for current product store.") }}</ion-note>
+        </div>
       </section>
 
       <ProductFilters />
@@ -99,7 +104,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import { computed, onMounted, ref } from 'vue';
@@ -302,4 +307,8 @@ ion-card-header {
 ion-card-header > ion-checkbox {
   flex-shrink: 0;
 }
+
+.empty-state {
+  align-items: start;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 22e22a92..2f80fab1 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -34,7 +34,7 @@
         <h1>{{ translate("Channels") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 
-      <section> 
+      <section v-if="configFacilities.length">
         <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
           <ion-card-header>
             <div>
@@ -45,6 +45,9 @@
           </ion-card-header>
         </ion-card>
       </section>
+      <div v-else class="empty-state">
+        <ion-note>{{ translate("No channel found for current product store.") }}</ion-note>
+      </div>
 
       <ProductFilters />
     </ion-content>
@@ -73,6 +76,7 @@ import {
   IonInput,
   IonItem,
   IonPage,
+  IonNote,
   IonText,
   IonTitle,
   IonToolbar
@@ -226,4 +230,8 @@ ion-card-header {
 ion-card-header > ion-checkbox {
   flex-shrink: 0;
 }
+
+.empty-state {
+  align-items: start;
+}
 </style>
\ No newline at end of file

From 370622e4937fdf1d891493613867a15dccdfd670 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 2 May 2024 11:13:48 +0530
Subject: [PATCH 128/250] Improved: reordering behavior in safety stock page

---
 src/components/RuleItem.vue | 62 ++-------------------------------
 src/views/SafetyStock.vue   | 69 ++++++++++++++++++++++++++++---------
 2 files changed, 55 insertions(+), 76 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 8d354e7a..e0bbfb90 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -2,26 +2,15 @@
   <ion-card>
     <ion-accordion-group :value="isReorderActive">
       <ion-accordion value="false">
-        <!-- <ion-item slot="header" color="light">
-          <ion-label>First Accordion</ion-label>
-        </ion-item> -->
         <ion-card-header slot="header" @click="$event.stopImmediatePropagation()">
           <div>
             <ion-card-subtitle class="overline">{{ rule.ruleId }}</ion-card-subtitle>
             <ion-card-title>{{ rule.ruleName }}</ion-card-title>
             <ion-card-subtitle>{{ ruleIndex+1 }}/{{ total }}</ion-card-subtitle>
           </div>
-          <ion-item lines=none>
+          <ion-item v-if="isReorderActive" lines=none>
             <ion-reorder slot="end"></ion-reorder>
           </ion-item>
-          <!-- <div>
-            <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === 0" @click="updateRuleOrder('prev')">
-              <ion-icon :icon="chevronUpOutline" slot="icon-only" />
-            </ion-button>
-            <ion-button fill="clear" color="medium" class="ion-no-padding" :disabled="ruleIndex === rules.length - 1" @click="updateRuleOrder('next')">
-              <ion-icon :icon="chevronDownOutline" slot="icon-only" />
-            </ion-button>
-          </div> -->
         </ion-card-header>
         <div slot="content">
           <ion-item lines="full" v-if="selectedPage.path === '/threshold'">
@@ -125,7 +114,7 @@
 <script setup lang="ts">
 import { IonAccordion, IonAccordionGroup, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonReorder, IonToggle, alertController, modalController } from '@ionic/vue';
 import { computed, defineProps, onMounted, ref } from 'vue';
-import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
+import { archiveOutline, checkmarkDoneCircleOutline, closeCircleOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@/i18n';
 import { RuleService } from '@/services/RuleService';
@@ -370,11 +359,6 @@ function getSelectedFacilities() {
   return (condition && condition.fieldValue) ? condition.fieldValue.split(",") : []
 }
 
-function getSelectedFacilityGroups() {
-  const condition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS")
-  return (condition && condition.fieldValue) ? condition.fieldValue.split(",") : []
-}
-
 async function openSelectConfigFacilitiesModal() {
   const modal = await modalController.create({
     component: SelectConfigFacilitiesModal,
@@ -460,48 +444,6 @@ async function updateRuleShipping(event: any) {
   }
   emitter.emit("dismissLoader");
 }
-
-async function updateRuleOrder(ruleDir: string) {
-  const prevSeq = JSON.parse(JSON.stringify(rules.value));
-  const updatedSeq = JSON.parse(JSON.stringify(rules.value));
-  let alternateRuleIndex = '' as any;
-
-  if(ruleDir === 'prev') alternateRuleIndex = props.ruleIndex - 1
-  else alternateRuleIndex = props.ruleIndex + 1;
-
-  [updatedSeq[props.ruleIndex], updatedSeq[alternateRuleIndex]] = [updatedSeq[alternateRuleIndex], updatedSeq[props.ruleIndex]]
-
-  let diffSeq = findRulesDiff(prevSeq, updatedSeq)
-
-  const updatedSeqenceNum = prevSeq.map((rule: any) => rule.sequenceNum)
-  Object.keys(diffSeq).map((key: any) => {
-    diffSeq[key].sequenceNum = updatedSeqenceNum[key]
-  })
-
-  diffSeq = Object.keys(diffSeq).map((key) => diffSeq[key])
-
-  try {
-    diffSeq.map(async (rule: any) => {
-      await RuleService.updateRule(rule, rule.ruleId);
-    })
-    await store.dispatch('rule/updateRules', { rules: updatedSeq })
-    showToast(translate("Rules order has been updated successfully."))
-  } catch(err: any) {
-    logger.error(err);
-    showToast(translate("Failed to update rules order."))
-  }
-}
-
-function findRulesDiff(previousSeq: any, updatedSeq: any) {
-  const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
-    if (updatedSeq[key].ruleId === previousSeq[key].ruleId) return diff
-    return {
-      ...diff,
-      [key]: updatedSeq[key]
-    }
-  }, {})
-  return diffSeq;
-}
 </script>
 
 <style scoped>
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index cc803cfe..cbd57863 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -12,8 +12,8 @@
         <ScheduleRuleItem />
 
         <section>
-          <ion-reorder-group :disabled="false" @ionItemReorder="handleReorder($event)">
-            <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          <ion-reorder-group :disabled="false" @ionItemReorder="doReorder($event)">
+            <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
           </ion-reorder-group>
         </section>
       </main>
@@ -24,7 +24,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="ion-margin">
-      <ion-fab-button class="ion-margin-bottom" color="light" @click="updateReorderStatus()">
+      <ion-fab-button :disabled="!rules.length" class="ion-margin-bottom" color="light" @click="isReorderActive ? saveReorder() : activateReordering()">
         <ion-icon :icon="isReorderActive ? saveOutline : balloonOutline" />
       </ion-fab-button>
       <ion-fab-button :disabled="isReorderActive" @click="createRule()">
@@ -44,6 +44,8 @@ import { useStore } from 'vuex';
 import { computed, ref } from 'vue';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
+import { RuleService } from '@/services/RuleService';
+import { showToast } from '@/utils';
 
 const store = useStore();
 const router = useRouter()
@@ -51,6 +53,7 @@ const router = useRouter()
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const reorderingRules = ref([]);
 
 onIonViewWillEnter(async() => {
   emitter.emit("presentLoader");
@@ -58,21 +61,55 @@ onIonViewWillEnter(async() => {
   emitter.emit("dismissLoader");
 })
 
-function updateReorderStatus() {
-  if(isReorderActive.value === false) {
-    store.dispatch("rule/updateIsReorderActive", true);
-  } else {
-    emitter.emit("presentLoader", { message: "Saving order..." });
-  
-    setTimeout(() => {
-      emitter.emit("dismissLoader");
-    }, 3000)
-    store.dispatch("rule/updateIsReorderActive", false);
-  }
+async function doReorder(event: CustomEvent) {
+  const previousSeq = JSON.parse(JSON.stringify(reorderingRules.value))
+
+  // returns the updated sequence after reordering
+  const updatedSeq = event.detail.complete(JSON.parse(JSON.stringify(reorderingRules.value)));
+
+  let diffSeq = findReasonsDiff(previousSeq, updatedSeq)
+
+  const updatedSeqenceNum = previousSeq.map((rejectionReason: any) => rejectionReason.sequenceNum)
+  Object.keys(diffSeq).map((key: any) => {
+    diffSeq[key].sequenceNum = updatedSeqenceNum[key]
+  })
+
+  diffSeq = Object.keys(diffSeq).map((key) => diffSeq[key])
+  reorderingRules.value = updatedSeq
+}
+
+function findReasonsDiff(previousSeq: any, updatedSeq: any) {
+  const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
+    if (updatedSeq[key].ruleId === previousSeq[key].ruleId && updatedSeq[key].sequenceNum === previousSeq[key].sequenceNum) return diff
+    return {
+      ...diff,
+      [key]: updatedSeq[key]
+    }
+  }, {})
+  return diffSeq;
+}
+
+function activateReordering() {
+  store.dispatch("rule/updateIsReorderActive", true)
+  reorderingRules.value = rules.value;
 }
 
-function handleReorder(event: CustomEvent) {
-  console.log(event.detail.complete(rules.value)); 
+async function saveReorder() {
+  emitter.emit("presentLoader", { messgae: "Saving changes.." })
+  const diffRules = reorderingRules.value.filter((reorderRule: any) => rules.value.some((rule: any) => rule.ruleId === reorderRule.ruleId && rule.sequenceNum !== reorderRule.sequenceNum))
+  const responses = await Promise.allSettled(diffRules.map(async (rule: any) => {
+    await RuleService.updateRule(rule, rule.ruleId)
+  }))
+
+  const isFailedToUpdateSomeRUle = responses.some((response) => response.status === 'rejected')
+  if(isFailedToUpdateSomeRUle) {
+    showToast(translate("Failed to update sequence for some rules."))
+  } else {
+    showToast(translate("Sequence for rules updated successfully."))
+  }
+  emitter.emit("dismissLoader");
+  await store.dispatch('rule/updateRules', { rules: reorderingRules.value })
+  store.dispatch("rule/updateIsReorderActive", false)
 }
 
 function createRule() {

From 7e7f5442bc067117ec97f7d81a38b3bc5b5047cd Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 2 May 2024 11:46:26 +0530
Subject: [PATCH 129/250] Improved: payload for fetching using pageSize and
 reverted app level check for expired records (#283)

---
 src/store/modules/channel/actions.ts | 10 ++--------
 src/store/modules/util/actions.ts    |  2 +-
 2 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index 753ec954..4446eb2f 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -33,12 +33,9 @@ const actions: ActionTree<ChannelState, RootState> = {
     const groups = JSON.parse(JSON.stringify(state.inventoryChannels))
 
     if(facilityGroupId) {
-      const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId })
+      const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId, pageSize: 100 })
 
       if(!hasError(resp)) {
-        // Currently expired records are coming also while fetching, hence filtering records with thruDate for now.
-        resp.data = resp.data.filter((facility: any) => !facility.thruDate)
-
         const currentGroup = groups.find((group: any) => group.facilityGroupId === facilityGroupId)
         currentGroup.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
         currentGroup.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
@@ -48,12 +45,9 @@ const actions: ActionTree<ChannelState, RootState> = {
     } else {
       await Promise.allSettled(groups.map(async (group: any) => {
         try {
-          const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId: group.facilityGroupId });
+          const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId: group.facilityGroupId, pageSize: 100 });
 
           if(!hasError(resp)) {
-            // Currently expired records are coming also while fetching, hence filtering records with thruDate for now.
-            resp.data = resp.data.filter((facility: any) => !facility.thruDate)
-
             group.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
             group.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
           } else {
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 4560fcde..a6c4a0cd 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -34,7 +34,7 @@ const actions: ActionTree<UtilState, RootState> = {
 
     if(facilityGroups.length && facilityGroups[0].productStoreId === store.state.user.currentEComStore.productStoreId) return;
     try {
-      const resp = await UtilService.fetchFacilityGroups({ productStoreId: store.state.user.currentEComStore.productStoreId });
+      const resp = await UtilService.fetchFacilityGroups({ productStoreId: store.state.user.currentEComStore.productStoreId, pageSize: 100 });
 
       if(!hasError(resp)) {
         facilityGroups = resp.data;

From 16113e1b5ce99a741a035ab7b9f741b4cbf3d222 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 2 May 2024 12:09:16 +0530
Subject: [PATCH 130/250] Fixed: loader not loading on page refresh (#283)

---
 src/App.vue | 12 ++++--------
 1 file changed, 4 insertions(+), 8 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index e3cd7bbc..c5f663bd 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -9,7 +9,7 @@
 
 <script setup lang="ts">
 import { IonApp, IonRouterOutlet, IonSplitPane, loadingController } from '@ionic/vue';
-import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { computed, onBeforeMount, onMounted, onUnmounted, ref } from 'vue';
 import emitter from "@/event-bus"
 import { Settings } from 'luxon'
 import Menu from '@/components/Menu.vue';
@@ -42,16 +42,12 @@ function dismissLoader() {
   }
 }
 
-onMounted(async () => {
-  loader.value = await loadingController
-    .create({
-      message: translate("Click the backdrop to dismiss."),
-      translucent: true,
-      backdropDismiss: true
-    });
+onBeforeMount(() => {
   emitter.on('presentLoader', presentLoader);
   emitter.on('dismissLoader', dismissLoader);
+})
 
+onMounted(async () => {
   // Handles case when user resumes or reloads the app
   // Luxon timezzone should be set with the user's selected timezone
   if (userProfile.value && userProfile.value.timeZone) {

From 16757de09e09c96dd88aa5fbf99cd1a428c3692f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 2 May 2024 12:48:32 +0530
Subject: [PATCH 131/250] Improved: moved general funtion to utils, added
 schedule card in accordion and updated toggle logic (#282)

---
 src/components/ScheduleRuleItem.vue | 60 ++++++++++++++++-------------
 src/locales/en.json                 |  3 ++
 src/utils/index.ts                  | 30 ++++++++++++++-
 src/views/SafetyStock.vue           | 40 +++++--------------
 4 files changed, 74 insertions(+), 59 deletions(-)

diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index ee15d203..c5e2241f 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -1,35 +1,40 @@
 <template>
-  <ion-card>
-    <ion-card-header>
-      <ion-card-title>{{ translate("Schedule") }}</ion-card-title>
-      <ion-badge :color="ruleGroup.schedule?.paused === 'Y' ? 'warning' : 'dark'">{{ ruleGroup.schedule?.paused === "Y" ? translate("Paused") : timeTillJob(ruleGroup.schedule?.nextExecutionDateTime) }}</ion-badge>
-    </ion-card-header>
+  <ion-accordion-group :value="isReorderActive">
+    <ion-accordion value="false">
+      <div slot="header" @click="$event.stopImmediatePropagation()"></div>
+      <ion-card slot="content">
+        <ion-card-header>
+          <ion-card-title>{{ translate("Schedule") }}</ion-card-title>
+          <ion-badge :color="ruleGroup.schedule?.paused === 'Y' ? 'warning' : 'dark'">{{ ruleGroup.schedule?.paused === "Y" ? translate("Paused") : timeTillJob(ruleGroup.schedule?.nextExecutionDateTime) }}</ion-badge>
+        </ion-card-header>
 
-    <ion-item>
-      <ion-icon slot="start" :icon="timeOutline"/>
-      <ion-label>{{ translate("Run time") }}</ion-label>
-      <!-- When the group is in draft status, do not display the runTime from the schedule -->
-      <ion-label slot="end">{{ ruleGroup.schedule?.paused === 'N' ? getDateAndTime(ruleGroup.schedule?.nextExecutionDateTime) : "-" }}</ion-label>
-    </ion-item>
-    <ion-item>
-      <ion-icon slot="start" :icon="timerOutline"/>
-      <!-- When the group is in draft status or the job is not present, do not display the frequency and just display the label for schedule -->
-      <ion-select :label="translate('Schedule')" interface="popover" :placeholder="translate('Select')" value="0 0 0 * * ?" :disabled="true">
-        <ion-select-option v-for="(expression, description) in cronExpressions" :key="expression" :value="expression">{{ description }}</ion-select-option>
-      </ion-select>
-    </ion-item>
-  
-    <ion-item lines="none">
-      <ion-button fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
-      <ion-button color="medium" fill="clear" slot="end" @click="OpenScheduleActionsPopover($event)">
-        <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
-      </ion-button>
-    </ion-item>
-  </ion-card>
+        <ion-item>
+          <ion-icon slot="start" :icon="timeOutline"/>
+          <ion-label>{{ translate("Run time") }}</ion-label>
+          <!-- When the group is in draft status, do not display the runTime from the schedule -->
+          <ion-label slot="end">{{ ruleGroup.schedule?.paused === 'N' ? getDateAndTime(ruleGroup.schedule?.nextExecutionDateTime) : "-" }}</ion-label>
+        </ion-item>
+        <ion-item>
+          <ion-icon slot="start" :icon="timerOutline"/>
+          <!-- When the group is in draft status or the job is not present, do not display the frequency and just display the label for schedule -->
+          <ion-select :label="translate('Schedule')" interface="popover" :placeholder="translate('Select')" value="0 0 0 * * ?" :disabled="true">
+            <ion-select-option v-for="(expression, description) in cronExpressions" :key="expression" :value="expression">{{ description }}</ion-select-option>
+          </ion-select>
+        </ion-item>
+      
+        <ion-item lines="none">
+          <ion-button fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
+          <ion-button color="medium" fill="clear" slot="end" @click="OpenScheduleActionsPopover($event)">
+            <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
+          </ion-button>
+        </ion-item>
+      </ion-card>
+    </ion-accordion>
+  </ion-accordion-group>
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardTitle, IonIcon, IonItem, IonLabel, IonSelect, IonSelectOption, popoverController } from '@ionic/vue';
+import { IonAccordion, IonAccordionGroup, IonBadge, IonButton, IonCard, IonCardHeader, IonCardTitle, IonIcon, IonItem, IonLabel, IonSelect, IonSelectOption, popoverController } from '@ionic/vue';
 import { translate } from '@/i18n';
 import { ellipsisVerticalOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import ScheduleActionsPopover from "@/components/ScheduleActionsPopover.vue";
@@ -43,6 +48,7 @@ import emitter from '@/event-bus';
 
 const store = useStore();
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
 
 const cronExpressions = JSON.parse(process.env?.VUE_APP_CRON_EXPRESSIONS as string)
 
diff --git a/src/locales/en.json b/src/locales/en.json
index b966e84f..afd77df3 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -65,6 +65,7 @@
   "Failed to disable rule group.": "Failed to disable rule group.",
   "Failed to update group.": "Failed to update group.",
   "Failed to update threshold facility.": "Failed to update threshold facility.",
+  "Failed to update sequence for some rules.": "Failed to update sequence for some rules.",
   "Failed to fetch rule information.": "Failed to fetch rule information.",
   "Failed to update rules order.": "Failed to update rules order.",
   "Failed to update config facilities.": "Failed to update config facilities.",
@@ -125,6 +126,7 @@
   "No jobs to update": "No jobs to update",
   "No previous occurrence": "No previous occurrence",
   "No rules found, redirecting to product page": "No rules found, redirecting to product page",
+  "No sequence has been changed.": "No sequence has been changed.",
   "No threshold rule found. Invalid job": "No threshold rule found. Invalid job",
   "No threshold rules found": "No threshold rules found",
   "No time zone found": "No time zone found",
@@ -198,6 +200,7 @@
   "Select the column index for the following information in the uploaded CSV": "Select the column index for the following information in the uploaded CSV",
   "Select run time": "Select run time",
   "Select store": "Select store",
+  "Sequence for rules updated successfully.": "Sequence for rules updated successfully.",
   "Service has been scheduled": "Service has been scheduled",
   "Set safety stock": "Set safety stock",
   "Settings": "Settings",
diff --git a/src/utils/index.ts b/src/utils/index.ts
index ad92e492..d8c97e4b 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -39,4 +39,32 @@ const generateInternalId = (name: string) => {
   return name.trim().toUpperCase().split(' ').join('_');
 }
 
-export { generateInternalId, getDate, getDateAndTime, getTime, hasError, showToast, timeTillRun }
\ No newline at end of file
+const doReorder = (event: CustomEvent, rules: any) => {
+  const previousSeq = JSON.parse(JSON.stringify(rules))
+
+  // returns the updated sequence after reordering
+  const updatedSeq = event.detail.complete(JSON.parse(JSON.stringify(rules)));
+
+  let diffSeq = findRulesDiff(previousSeq, updatedSeq)
+
+  const updatedSeqenceNum = previousSeq.map((rejectionReason: any) => rejectionReason.sequenceNum)
+  Object.keys(diffSeq).map((key: any) => {
+    diffSeq[key].sequenceNum = updatedSeqenceNum[key]
+  })
+
+  diffSeq = Object.keys(diffSeq).map((key) => diffSeq[key])
+  return updatedSeq
+}
+
+const findRulesDiff = (previousSeq: any, updatedSeq: any) => {
+  const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
+    if (updatedSeq[key].ruleId === previousSeq[key].ruleId && updatedSeq[key].sequenceNum === previousSeq[key].sequenceNum) return diff
+    return {
+      ...diff,
+      [key]: updatedSeq[key]
+    }
+  }, {})
+  return diffSeq;
+}
+
+export { doReorder, generateInternalId, getDate, getDateAndTime, getTime, hasError, showToast, timeTillRun }
\ No newline at end of file
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index cbd57863..d007de47 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -12,7 +12,7 @@
         <ScheduleRuleItem />
 
         <section>
-          <ion-reorder-group :disabled="false" @ionItemReorder="doReorder($event)">
+          <ion-reorder-group :disabled="false" @ionItemReorder="reorderingRules = doReorder($event, reorderingRules)">
             <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
           </ion-reorder-group>
         </section>
@@ -45,7 +45,7 @@ import { computed, ref } from 'vue';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
 import { RuleService } from '@/services/RuleService';
-import { showToast } from '@/utils';
+import { doReorder, showToast } from '@/utils';
 
 const store = useStore();
 const router = useRouter()
@@ -61,42 +61,20 @@ onIonViewWillEnter(async() => {
   emitter.emit("dismissLoader");
 })
 
-async function doReorder(event: CustomEvent) {
-  const previousSeq = JSON.parse(JSON.stringify(reorderingRules.value))
-
-  // returns the updated sequence after reordering
-  const updatedSeq = event.detail.complete(JSON.parse(JSON.stringify(reorderingRules.value)));
-
-  let diffSeq = findReasonsDiff(previousSeq, updatedSeq)
-
-  const updatedSeqenceNum = previousSeq.map((rejectionReason: any) => rejectionReason.sequenceNum)
-  Object.keys(diffSeq).map((key: any) => {
-    diffSeq[key].sequenceNum = updatedSeqenceNum[key]
-  })
-
-  diffSeq = Object.keys(diffSeq).map((key) => diffSeq[key])
-  reorderingRules.value = updatedSeq
-}
-
-function findReasonsDiff(previousSeq: any, updatedSeq: any) {
-  const diffSeq: any = Object.keys(previousSeq).reduce((diff, key) => {
-    if (updatedSeq[key].ruleId === previousSeq[key].ruleId && updatedSeq[key].sequenceNum === previousSeq[key].sequenceNum) return diff
-    return {
-      ...diff,
-      [key]: updatedSeq[key]
-    }
-  }, {})
-  return diffSeq;
-}
-
 function activateReordering() {
   store.dispatch("rule/updateIsReorderActive", true)
   reorderingRules.value = rules.value;
 }
 
 async function saveReorder() {
-  emitter.emit("presentLoader", { messgae: "Saving changes.." })
   const diffRules = reorderingRules.value.filter((reorderRule: any) => rules.value.some((rule: any) => rule.ruleId === reorderRule.ruleId && rule.sequenceNum !== reorderRule.sequenceNum))
+  if(!diffRules.length) {
+    store.dispatch("rule/updateIsReorderActive", false)
+    showToast(translate("No sequence has been changed."))
+    return;
+  }
+
+  emitter.emit("presentLoader", { messgae: "Saving changes.." })
   const responses = await Promise.allSettled(diffRules.map(async (rule: any) => {
     await RuleService.updateRule(rule, rule.ruleId)
   }))

From 8554c9d32cec2ba6ae8a3497db04dffd452dc467 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 2 May 2024 14:33:16 +0530
Subject: [PATCH 132/250] Improved: logic and flow for reordering of rules in
 threshold, safety-stock and store-pickup page (#282)

---
 src/views/Shipping.vue    | 52 +++++++++++++++++++++++++++++++++----
 src/views/StorePickup.vue | 51 ++++++++++++++++++++++++++++++++----
 src/views/Threshold.vue   | 54 ++++++++++++++++++++++++++++++++++-----
 3 files changed, 140 insertions(+), 17 deletions(-)

diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 4b255182..e04fb6f4 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -26,7 +26,9 @@
         <ScheduleRuleItem  v-if="ruleGroup.ruleGroupId" />
 
         <section v-if="selectedSegment !== 'facility'">
-          <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          <ion-reorder-group :disabled="false" @ionItemReorder="reorderingRules = doReorder($event, reorderingRules)">
+            <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          </ion-reorder-group>
         </section>
         <div v-else class="empty-state">
           <p>{{ translate("No shipping rules found") }}</p>
@@ -53,8 +55,11 @@
       </ion-infinite-scroll>
     </ion-content>
 
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createShipping()">
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="ion-margin">
+      <ion-fab-button :disabled="!rules.length" class="ion-margin-bottom" color="light" @click="isReorderActive ? saveReorder() : activateReordering()">
+        <ion-icon :icon="isReorderActive ? saveOutline : balloonOutline" />
+      </ion-fab-button>
+      <ion-fab-button :disabled="isReorderActive" @click="createShipping()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -62,9 +67,9 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
 import { computed, ref } from 'vue';
-import { addOutline } from 'ionicons/icons';
+import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@/i18n';
 import FacilityItem from '@/components/FacilityItem.vue';
@@ -72,6 +77,8 @@ import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
 import { useStore } from 'vuex';
 import emitter from '@/event-bus';
+import { RuleService } from '@/services/RuleService';
+import { doReorder, showToast } from '@/utils';
 
 const store = useStore();
 const router = useRouter()
@@ -80,6 +87,8 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
+const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const reorderingRules = ref([]);
 
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY")
 const isScrollingEnabled = ref(false);
@@ -135,12 +144,45 @@ async function updateRuleGroup() {
   if(selectedSegment.value === 'facility') {
     isScrollingEnabled.value = false;
     await fetchFacilities();
+    store.dispatch("rule/updateIsReorderActive", false)
   } else {
+    store.dispatch("rule/updateIsReorderActive", false)
+    reorderingRules.value = []
     await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
   }
   emitter.emit("dismissLoader");
 }
 
+
+function activateReordering() {
+  store.dispatch("rule/updateIsReorderActive", true)
+  reorderingRules.value = rules.value;
+}
+
+async function saveReorder() {
+  const diffRules = reorderingRules.value.filter((reorderRule: any) => rules.value.some((rule: any) => rule.ruleId === reorderRule.ruleId && rule.sequenceNum !== reorderRule.sequenceNum))
+  if(!diffRules.length) {
+    store.dispatch("rule/updateIsReorderActive", false)
+    showToast(translate("No sequence has been changed."))
+    return;
+  }
+
+  emitter.emit("presentLoader", { messgae: "Saving changes.." })
+  const responses = await Promise.allSettled(diffRules.map(async (rule: any) => {
+    await RuleService.updateRule(rule, rule.ruleId)
+  }))
+
+  const isFailedToUpdateSomeRUle = responses.some((response) => response.status === 'rejected')
+  if(isFailedToUpdateSomeRUle) {
+    showToast(translate("Failed to update sequence for some rules."))
+  } else {
+    showToast(translate("Sequence for rules updated successfully."))
+  }
+  emitter.emit("dismissLoader");
+  await store.dispatch('rule/updateRules', { rules: reorderingRules.value })
+  store.dispatch("rule/updateIsReorderActive", false)
+}
+
 function createShipping() {
   router.push({ path: '/create-shipping', query: { groupTypeEnumId: selectedSegment.value } })
 }
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index a81fbefa..a14aa7e0 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -26,7 +26,9 @@
         <ScheduleRuleItem />
 
         <section v-if="selectedSegment === 'RG_PICKUP_FACILITY' || selectedSegment === 'RG_PICKUP_CHANNEL'">
-          <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          <ion-reorder-group :disabled="false" @ionItemReorder="reorderingRules = doReorder($event, reorderingRules)">
+            <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          </ion-reorder-group>
         </section>
         <div class="empty-state" v-else>
           <p>{{ translate("No store pickup rules found") }}</p>
@@ -54,8 +56,11 @@
       </ion-infinite-scroll>
     </ion-content>
 
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createStorePickup()">
+    <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="ion-margin">
+      <ion-fab-button :disabled="!rules.length" class="ion-margin-bottom" color="light" @click="isReorderActive ? saveReorder() : activateReordering()">
+        <ion-icon :icon="isReorderActive ? saveOutline : balloonOutline" />
+      </ion-fab-button>
+      <ion-fab-button :disabled="isReorderActive" @click="createStorePickup()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -63,9 +68,9 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
 import { computed, ref } from 'vue';
-import { addOutline } from 'ionicons/icons';
+import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
 import { translate } from '@/i18n';
@@ -73,6 +78,8 @@ import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
 import { useStore } from 'vuex';
 import emitter from '@/event-bus';
+import { doReorder, showToast } from '@/utils';
+import { RuleService } from '@/services/RuleService';
 
 const store = useStore();
 const router = useRouter()
@@ -80,6 +87,8 @@ const router = useRouter()
 const rules = computed(() => store.getters["rule/getRules"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
+const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const reorderingRules = ref([]);
 
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
 const isScrollingEnabled = ref(false);
@@ -135,12 +144,44 @@ async function updateRuleGroup() {
   if(selectedSegment.value === 'facility') {
     isScrollingEnabled.value = false;
     await fetchFacilities();
+    store.dispatch("rule/updateIsReorderActive", false)
   } else {
+    store.dispatch("rule/updateIsReorderActive", false)
+    reorderingRules.value = []
     await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
   }
   emitter.emit("dismissLoader");
 }
 
+function activateReordering() {
+  store.dispatch("rule/updateIsReorderActive", true)
+  reorderingRules.value = rules.value;
+}
+
+async function saveReorder() {
+  const diffRules = reorderingRules.value.filter((reorderRule: any) => rules.value.some((rule: any) => rule.ruleId === reorderRule.ruleId && rule.sequenceNum !== reorderRule.sequenceNum))
+  if(!diffRules.length) {
+    store.dispatch("rule/updateIsReorderActive", false)
+    showToast(translate("No sequence has been changed."))
+    return;
+  }
+
+  emitter.emit("presentLoader", { messgae: "Saving changes.." })
+  const responses = await Promise.allSettled(diffRules.map(async (rule: any) => {
+    await RuleService.updateRule(rule, rule.ruleId)
+  }))
+
+  const isFailedToUpdateSomeRUle = responses.some((response) => response.status === 'rejected')
+  if(isFailedToUpdateSomeRUle) {
+    showToast(translate("Failed to update sequence for some rules."))
+  } else {
+    showToast(translate("Sequence for rules updated successfully."))
+  }
+  emitter.emit("dismissLoader");
+  await store.dispatch('rule/updateRules', { rules: reorderingRules.value })
+  store.dispatch("rule/updateIsReorderActive", false)
+}
+
 function createStorePickup() {
   router.push({ path: '/create-store-pickup', query: { groupTypeEnumId: selectedSegment.value } })
 }
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index b2a64622..3a509ce2 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -12,7 +12,9 @@
         <ScheduleRuleItem />
 
         <section>
-          <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          <ion-reorder-group :disabled="false" @ionItemReorder="reorderingRules = doReorder($event, reorderingRules)">
+            <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          </ion-reorder-group>
         </section>
       </main>
 
@@ -20,8 +22,11 @@
        <p>{{ translate("No threshold rules found") }}</p>
       </div>
 
-      <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-        <ion-fab-button @click="CreateThreshold()">
+      <ion-fab vertical="bottom" horizontal="end" slot="fixed" class="ion-margin">
+        <ion-fab-button :disabled="!rules.length" class="ion-margin-bottom" color="light" @click="isReorderActive ? saveReorder() : activateReordering()">
+          <ion-icon :icon="isReorderActive ? saveOutline : balloonOutline" />
+        </ion-fab-button>
+        <ion-fab-button :disabled="isReorderActive" @click="createRule()">
           <ion-icon :icon="addOutline" />
         </ion-fab-button>
       </ion-fab>
@@ -30,21 +35,25 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { addOutline } from 'ionicons/icons';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
-import { computed } from 'vue';
+import { computed, ref } from 'vue';
 import { useStore } from 'vuex';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
+import { RuleService } from '@/services/RuleService';
+import { doReorder, showToast } from '@/utils';
 
 const store = useStore();
 const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
+const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const reorderingRules = ref([]);
 
 onIonViewWillEnter(async() => {
   emitter.emit("presentLoader");
@@ -52,7 +61,38 @@ onIonViewWillEnter(async() => {
   emitter.emit("dismissLoader");
 })
 
-function CreateThreshold() {
+
+function activateReordering() {
+  store.dispatch("rule/updateIsReorderActive", true)
+  reorderingRules.value = rules.value;
+}
+
+async function saveReorder() {
+  const diffRules = reorderingRules.value.filter((reorderRule: any) => rules.value.some((rule: any) => rule.ruleId === reorderRule.ruleId && rule.sequenceNum !== reorderRule.sequenceNum))
+  if(!diffRules.length) {
+    store.dispatch("rule/updateIsReorderActive", false)
+    showToast(translate("No sequence has been changed."))
+    return;
+  }
+
+  emitter.emit("presentLoader", { messgae: "Saving changes.." })
+  const responses = await Promise.allSettled(diffRules.map(async (rule: any) => {
+    await RuleService.updateRule(rule, rule.ruleId)
+  }))
+
+  const isFailedToUpdateSomeRUle = responses.some((response) => response.status === 'rejected')
+  if(isFailedToUpdateSomeRUle) {
+    showToast(translate("Failed to update sequence for some rules."))
+  } else {
+    showToast(translate("Sequence for rules updated successfully."))
+  }
+  emitter.emit("dismissLoader");
+  await store.dispatch('rule/updateRules', { rules: reorderingRules.value })
+  store.dispatch("rule/updateIsReorderActive", false)
+}
+
+
+function createRule() {
   router.push({ path: '/create-threshold' })
 }
 </script>

From 3d3a834ab4264fe386fbf9694b213b50b01458d7 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 2 May 2024 14:41:10 +0530
Subject: [PATCH 133/250] Reverted: unused ref variable (#282)

---
 src/components/RuleItem.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index e0bbfb90..11e4b1d9 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -140,7 +140,6 @@ const selectedPage = ref({
   path: '',
   name: ''
 }) as any;
-const cardStatus = ref(props.cardStatus);
 
 onMounted(() => {
   selectedPage.value.path = router.currentRoute.value.path

From 3a4c05ee41e28bd899b9688193487bf3e7d6a7c8 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 2 May 2024 14:44:15 +0530
Subject: [PATCH 134/250] Improved: clear rule state mutation to set
 isReorderActive to false (#282)

---
 src/store/modules/rule/mutations.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/store/modules/rule/mutations.ts b/src/store/modules/rule/mutations.ts
index eb842602..f3395bf1 100644
--- a/src/store/modules/rule/mutations.ts
+++ b/src/store/modules/rule/mutations.ts
@@ -18,7 +18,8 @@ const mutations: MutationTree <RuleState> = {
       list: [],
       total: ''
     },
-    state.ruleGroup = {}
+    state.ruleGroup = {},
+    state.isReorderActive= false
   },
 }
 export default mutations;
\ No newline at end of file

From a88faea1e6ed2afca94d28d8e2d1bb63e47eef23 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 11:06:44 +0530
Subject: [PATCH 135/250] Improved: code to show productStoreId if storeName is
 not available (#287)

---
 src/components/Menu.vue | 4 ++--
 src/views/Settings.vue  | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 232957c3..8ed2e1b8 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -30,12 +30,12 @@
         </ion-item>
         <ion-item v-if="userProfile?.stores?.length > 1" lines="none">
           <ion-select interface="popover" :value="eComStore.productStoreId" @ionChange="setEComStore($event)">
-            <ion-select-option v-for="store in (userProfile?.stores ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName }}</ion-select-option>
+            <ion-select-option v-for="store in (userProfile?.stores ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName ? store.storeName : store.productStoreId }}</ion-select-option>
           </ion-select>
         </ion-item>
         <ion-item v-else lines="none">
           <ion-label class="ion-text-wrap">
-            {{ eComStore.storeName }}
+            {{ eComStore.storeName ? eComStore.storeName : eComStore.productStoreId }}
           </ion-label>
         </ion-item>
       </ion-toolbar>
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index 0b145213..a50b2c84 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -61,7 +61,7 @@
           </ion-card-content>
           <ion-item lines="none">
             <ion-select :label="$t('Select store')" interface="popover" :value="currentEComStore.productStoreId" @ionChange="setEComStore($event)">
-              <ion-select-option v-for="store in (userProfile ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName }}</ion-select-option>
+              <ion-select-option v-for="store in (userProfile ? userProfile.stores : [])" :key="store.productStoreId" :value="store.productStoreId" >{{ store.storeName ? store.storeName : store.productStoreId }}</ion-select-option>
             </ion-select>
           </ion-item>
         </ion-card>

From 0bae4dd3f823522724e29114dadb1ff421911a95 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 11:19:09 +0530
Subject: [PATCH 136/250] Improved: empty state management for all the rules
 page (#287)

---
 src/locales/en.json       |  3 +++
 src/views/SafetyStock.vue |  2 +-
 src/views/Shipping.vue    | 10 ++++++----
 src/views/StorePickup.vue | 11 +++++++----
 4 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index c3f09cc0..0ccd4e03 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -126,6 +126,9 @@
   "No jobs to update": "No jobs to update",
   "No previous occurrence": "No previous occurrence",
   "No rules found, redirecting to product page": "No rules found, redirecting to product page",
+  "No safety stock rules found": "No safety stock rules found",
+  "No shipping rules found": "No shipping rules found",
+  "No store pickup rules found": "No store pickup rules found",
   "No threshold rule found. Invalid job": "No threshold rule found. Invalid job",
   "No threshold rules found": "No threshold rules found",
   "No time zone found": "No time zone found",
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 142247a7..a5b2e3bb 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -17,7 +17,7 @@
       </main>
 
       <div class="empty-state" v-else>
-       <p>{{ translate("No threshold rules found") }}</p>
+       <p>{{ translate("No safety stock rules found") }}</p>
       </div>
     </ion-content>
 
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 4b255182..5afbb9f1 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -23,11 +23,13 @@
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
       <main v-if="selectedSegment !== 'facility'">
-        <ScheduleRuleItem  v-if="ruleGroup.ruleGroupId" />
+        <template v-if="ruleGroup.ruleGroupId">
+          <ScheduleRuleItem />
 
-        <section v-if="selectedSegment !== 'facility'">
-          <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
-        </section>
+          <section>
+            <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          </section>
+        </template>
         <div v-else class="empty-state">
           <p>{{ translate("No shipping rules found") }}</p>
         </div>
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index a81fbefa..77d32113 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -23,11 +23,13 @@
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
       <main v-if="selectedSegment !== 'facility'">
-        <ScheduleRuleItem />
+        <template v-if="ruleGroup.ruleGroupId">
+          <ScheduleRuleItem />
 
-        <section v-if="selectedSegment === 'RG_PICKUP_FACILITY' || selectedSegment === 'RG_PICKUP_CHANNEL'">
-          <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
-        </section>
+          <section>
+            <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
+          </section>
+        </template>
         <div class="empty-state" v-else>
           <p>{{ translate("No store pickup rules found") }}</p>
         </div>
@@ -77,6 +79,7 @@ import emitter from '@/event-bus';
 const store = useStore();
 const router = useRouter()
 
+const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const rules = computed(() => store.getters["rule/getRules"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);

From bc3821fc5acfbe5b67ee20c48e93d797a235baa0 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 11:21:22 +0530
Subject: [PATCH 137/250] Improved: added check to show scheduler card only if
 we have rules (#287)

---
 src/views/SafetyStock.vue | 2 +-
 src/views/Shipping.vue    | 2 +-
 src/views/StorePickup.vue | 2 +-
 src/views/Threshold.vue   | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index a5b2e3bb..edc02992 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -9,7 +9,7 @@
 
     <ion-content>
       <main v-if="ruleGroup.ruleGroupId">
-        <ScheduleRuleItem />
+        <ScheduleRuleItem v-if="rules.length" />
 
         <section>
           <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 5afbb9f1..f0ba126c 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -24,7 +24,7 @@
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
       <main v-if="selectedSegment !== 'facility'">
         <template v-if="ruleGroup.ruleGroupId">
-          <ScheduleRuleItem />
+          <ScheduleRuleItem v-if="rules.length" />
 
           <section>
             <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 77d32113..7d472811 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -24,7 +24,7 @@
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
       <main v-if="selectedSegment !== 'facility'">
         <template v-if="ruleGroup.ruleGroupId">
-          <ScheduleRuleItem />
+          <ScheduleRuleItem v-if="rules.length" />
 
           <section>
             <RuleItem :selectedSegment="selectedSegment" v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index b2a64622..8433daf9 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -9,7 +9,7 @@
 
     <ion-content>
       <main v-if="ruleGroup.ruleGroupId">
-        <ScheduleRuleItem />
+        <ScheduleRuleItem v-if="rules.length" />
 
         <section>
           <RuleItem v-for="(rule, ruleIndex) in rules" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />

From 339ed55037178601693949046d9db853d2178fa2 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 11:29:25 +0530
Subject: [PATCH 138/250] Improved: ui of the timezone modal and used label in
 ion-radio according to ionic 7 (#287)

---
 src/theme/variables.css     | 4 ----
 src/views/Shipping.vue      | 8 +++++++-
 src/views/StorePickup.vue   | 8 +++++++-
 src/views/TimezoneModal.vue | 8 +++-----
 4 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/theme/variables.css b/src/theme/variables.css
index 8229085d..dcc2be80 100644
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@@ -399,8 +399,4 @@ ion-content>section {
   .sort > div > :first-child{
     border-bottom: unset;
   }
-
-  ion-header {
-    display: flex;
-  }
 }
\ No newline at end of file
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index f0ba126c..2d844ae5 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -146,4 +146,10 @@ async function updateRuleGroup() {
 function createShipping() {
   router.push({ path: '/create-shipping', query: { groupTypeEnumId: selectedSegment.value } })
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+  ion-header {
+    display: flex;
+  }
+</style>
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 7d472811..bc901a61 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -147,4 +147,10 @@ async function updateRuleGroup() {
 function createStorePickup() {
   router.push({ path: '/create-store-pickup', query: { groupTypeEnumId: selectedSegment.value } })
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+  ion-header {
+    display: flex;
+  }
+</style>
\ No newline at end of file
diff --git a/src/views/TimezoneModal.vue b/src/views/TimezoneModal.vue
index fc4cb43d..6c1d2efa 100644
--- a/src/views/TimezoneModal.vue
+++ b/src/views/TimezoneModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button @click="closeModal"> 
-          <ion-icon :icon="closeOutline" />
+          <ion-icon :icon="close" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Select time zone") }}</ion-title>
@@ -29,8 +29,7 @@
       <ion-list>
         <ion-radio-group value="rd" v-model="timeZoneId">
           <ion-item :key="timeZone.id" v-for="timeZone in filteredTimeZones">
-            <ion-label>{{ timeZone.label }} ({{ timeZone.id }})</ion-label>
-            <ion-radio :value="timeZone.id" slot="start" />
+            <ion-radio :value="timeZone.id" label-placement="end" justify="start">{{ timeZone.label }} ({{ timeZone.id }})</ion-radio>
           </ion-item>
         </ion-radio-group>
       </ion-list>
@@ -54,7 +53,6 @@ import {
   IonHeader,
   IonItem,
   IonIcon,
-  IonLabel,
   IonRadioGroup,
   IonRadio,
   IonList,
@@ -65,7 +63,7 @@ import {
   modalController,
 } from "@ionic/vue";
 import { onBeforeMount, ref } from "vue";
-import { saveOutline } from "ionicons/icons";
+import { close, saveOutline } from "ionicons/icons";
 import { useStore } from "@/store";
 import { UserService } from "@/services/UserService";
 import { hasError } from "@/utils"

From c617fd8d2131dd4cff1705b367c6d486318ecf53 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 12:04:07 +0530
Subject: [PATCH 139/250] Improved: added validation to not allow .(point) or
 any special characters in threshold value (#287)

---
 src/components/RuleItem.vue         | 16 ++++++++++++++--
 src/views/CreateSafetyStockRule.vue |  6 +++++-
 src/views/CreateThresholdRule.vue   |  6 +++++-
 3 files changed, 24 insertions(+), 4 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index c2d64958..8e9382e9 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -152,7 +152,13 @@ async function editThreshold() {
       placeholder: translate("Threshold"),
       type: "number",
       value: props.rule.ruleActions?.length ? props.rule.ruleActions[0].fieldValue : 0,
-      min: 0
+      min: 0,
+      attributes: {
+        // Added check to not allow mainly .(period) and other special characters to be entered in the alert input
+        onkeydown: ($event: any) => {
+          if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test($event.key)) $event.preventDefault();
+        }
+      }
     }],
     buttons: [{
       text: translate('Cancel'),
@@ -206,7 +212,13 @@ async function editSafetyStock() {
       placeholder: translate("Safety stock"),
       type: "number",
       value: props.rule.ruleActions?.length ? props.rule.ruleActions[0].fieldValue : 0,
-      min: 0
+      min: 0,
+      attributes: {
+        // Added check to not allow mainly .(period) and other special characters to be entered in the alert input
+        onkeydown: ($event: any) => {
+          if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test($event.key)) $event.preventDefault();
+        }
+      }
     }],
     buttons: [{
       text: translate('Cancel'),
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 476d2423..c92047c6 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -22,7 +22,7 @@
                 </ion-input>
               </ion-item>
               <ion-item>
-                <ion-input v-model="formData.safetyStock">
+                <ion-input v-model="formData.safetyStock" type="number" @keydown="validateSafetyStock($event)">
                   <div slot="label">{{ translate("Safety stock") }} <ion-text color="danger">*</ion-text></div>
                 </ion-input>
               </ion-item>
@@ -235,4 +235,8 @@ async function createRule() {
   }
   emitter.emit("dismissLoader");
 }
+
+function validateSafetyStock(event: any) {
+  if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test(event.key)) event.preventDefault();
+}
 </script>
\ No newline at end of file
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 2f80fab1..f27f5fac 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -22,7 +22,7 @@
                 </ion-input>
               </ion-item>
               <ion-item>
-                <ion-input v-model="formData.threshold">
+                <ion-input v-model="formData.threshold" type="number" @keydown="validateThreshold($event)">
                   <div slot="label">{{ translate("Threshold") }} <ion-text color="danger">*</ion-text></div>
                 </ion-input>
               </ion-item>
@@ -217,6 +217,10 @@ async function createThresholdRule() {
   }
   emitter.emit("dismissLoader");
 }
+
+function validateThreshold(event: any) {
+  if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test(event.key)) event.preventDefault();
+}
 </script>
 
 <style scoped>

From ef145aa6c56bb07bd19951c58efdff9f4889f903 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 14:18:26 +0530
Subject: [PATCH 140/250] Improved: logic to associate config facilities to
 product store only if new config facility created (#287)

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

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index f01a0ba6..828dc3ed 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -113,6 +113,10 @@ async function createGroup() {
           ...selectedConfigFacility,
           facilityId: resp.data.facilityId
         }
+
+        // Associating the config facility with the product store.
+        resp = await ChannelService.updateFacilityAssociationWithProductStore({productStoreId: eComStore.value.productStoreId, facilityId: selectedConfigFacility.facilityId})
+        if(hasError(resp)) throw resp.data;
       } else {
         throw resp.data;
       }
@@ -120,10 +124,6 @@ async function createGroup() {
       selectedConfigFacility = configFacilities.value.find((facility: any) => facility.facilityId === selectedConfigFacilityId.value)
     }
 
-    // Associating the config facility with the product store.
-    resp = await ChannelService.updateFacilityAssociationWithProductStore({productStoreId: eComStore.value.productStoreId, facilityId: selectedConfigFacility.facilityId})
-    if(hasError(resp)) throw resp.data;
-
     // Associating the facility group with the product store.
     resp = await ChannelService.updateGroupAssociationWithProductStore({productStoreId: eComStore.value.productStoreId, facilityGroupId: formData.value.facilityGroupId})
     if(hasError(resp)) throw resp.data;

From bc1f044cb2666f8667e8d26982efd70a2f3d22b3 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 16:29:19 +0530
Subject: [PATCH 141/250] Improved: code to avoid space as ruleName and empty
 ruleName on update alert (#287)

---
 src/components/RuleItem.vue         | 5 ++++-
 src/locales/en.json                 | 1 +
 src/views/CreateSafetyStockRule.vue | 2 +-
 src/views/CreateShippingRule.vue    | 2 +-
 src/views/CreateStorePickupRule.vue | 2 +-
 src/views/CreateThresholdRule.vue   | 2 +-
 6 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 8e9382e9..87281539 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -271,7 +271,7 @@ async function editRuleName() {
       name: "name",
       placeholder: translate("Name"),
       type: "text",
-      value: props.rule.ruleName
+      value: props.rule.ruleName.trim()
     }],
     buttons: [{
       text: translate('Cancel'),
@@ -295,6 +295,9 @@ async function editRuleName() {
             showToast(translate("Failed to update rule name."))
           }
           emitter.emit("dismissLoader");
+        } else {
+          showToast(translate("Rule name can't be empty."))
+          return false;
         }
       }
     }]
diff --git a/src/locales/en.json b/src/locales/en.json
index 0ccd4e03..83185145 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -172,6 +172,7 @@
   "Rule created successfully.": "Rule created successfully.",
   "Rule group disabled successfully.": "Rule group disabled successfully.",
   "rule name": "rule name",
+  "Rule name can't be empty.": "Rule name can't be empty.",
   "Rules order has been updated successfully.": "Rules order has been updated successfully.",
   "Run now": "Run now",
   "running": "running",
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index c92047c6..437b3ad4 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -188,7 +188,7 @@ function generateRuleConditions(ruleId: string) {
 }
 
 async function createRule() {
-  if(!formData.value.ruleName || !formData.value.safetyStock || !formData.value.selectedFacilityGroups.included.length) {
+  if(!formData.value.ruleName.trim() || !formData.value.safetyStock || !formData.value.selectedFacilityGroups.included.length) {
     showToast(translate("Please fill in all the required fields."))
     return;
   }
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 3bbdd70c..2e0a2acf 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -175,7 +175,7 @@ function isFacilitySelected(facilityId: any) {
 }
 
 async function createRule() {
-  if(!formData.value.ruleName) {
+  if(!formData.value.ruleName.trim()) {
     showToast(translate("Please fill in all the required fields."))
     return;
   }
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index c74e449b..fda2a6a0 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -175,7 +175,7 @@ function isFacilitySelected(facilityId: any) {
 }
 
 async function createRule() {
-  if(!formData.value.ruleName) {
+  if(!formData.value.ruleName.trim()) {
     showToast(translate("Please fill in all the required fields."))
     return;
   }
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index f27f5fac..69e2f2d2 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -164,7 +164,7 @@ function generateRuleConditions(ruleId: string) {
 }
 
 async function createThresholdRule() {
-  if(!formData.value.ruleName || !formData.value.threshold) {
+  if(!formData.value.ruleName.trim() || !formData.value.threshold) {
     showToast(translate("Please fill in all the required fields."))
     return;
   }

From 50f70a7d7a5523f20b69fc7a1acdca2cb138158a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 16:56:17 +0530
Subject: [PATCH 142/250] Improved: payload for fetching job run history for
 the last 20 records (#287)

---
 src/components/RuleGroupHistoryModal.vue | 2 +-
 src/services/RuleService.ts              | 7 ++++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/RuleGroupHistoryModal.vue b/src/components/RuleGroupHistoryModal.vue
index 1350d99c..d8533792 100644
--- a/src/components/RuleGroupHistoryModal.vue
+++ b/src/components/RuleGroupHistoryModal.vue
@@ -63,7 +63,7 @@ async function fetchGroupHistory() {
   }
 
   try {
-    const resp = await RuleService.fetchRuleGroupHistory(ruleGroup.value.jobName)
+    const resp = await RuleService.fetchRuleGroupHistory({ jobName: ruleGroup.value.jobName, pageSize: 20, orderByField: "lastUpdatedStamp DESC" })
 
     if(!hasError(resp)) {
       // Sorting the history based on startTime, as we does not get the records in sorted order from api
diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index e614537e..6da3491c 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -111,10 +111,11 @@ const scheduleRuleGroup = async (payload: any): Promise<any> => {
   });
 }
 
-const fetchRuleGroupHistory = async (jobName: string): Promise<any> => {
+const fetchRuleGroupHistory = async (payload: any): Promise<any> => {
   return api({
-    url: `serviceJobRuns/${jobName}`,
-    method: "GET"
+    url: `serviceJobRuns/${payload.jobName}`,
+    method: "GET",
+    params: payload
   });
 }
 

From 251e7f6a2f91b26ae47027d96038ef685cc90472 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 6 May 2024 19:10:24 +0530
Subject: [PATCH 143/250] Improved: check for empty rule name using trim (#287)

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

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 87281539..ac063ba8 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -280,7 +280,7 @@ async function editRuleName() {
     {
       text: translate('Update'),
       handler: async(data) => {
-        if(data.name) {
+        if(data.name.trim()) {
           emitter.emit("presentLoader");
           const rule = JSON.parse(JSON.stringify(props.rule))
           rule.ruleName = data.name

From 9b04ccddee4d9aff1d59aa10ee89f21c3232b702 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 11:02:50 +0530
Subject: [PATCH 144/250] Improved: logic to allow user unselect facility group
 removed from product store (#289)

---
 src/components/RuleItem.vue                 |  4 ++--
 src/components/UpdateFacilityGroupModal.vue | 19 +++++++++++++++----
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index c2d64958..aa0ac4c0 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -300,7 +300,7 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
       let facilityGroupIds = condition?.fieldValue.split(",")
         facilityGroupIds = facilityGroupIds.map((id: string) => {
           let group = facilityGroups.value.find((group: any) => group.facilityGroupId === id)
-          return group ? group.facilityGroupName : null
+          return group ? group.facilityGroupName : id
         })
         return facilityGroupIds.join(", ")
     } else {
@@ -313,7 +313,7 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
       let facilities = condition?.fieldValue.split(",")
       facilities = facilities.map((id: string) => {
         let facility = configFacilities.value.find((facility: any) => facility.facilityId === id)
-        return facility ? facility.facilityName : null
+        return facility ? facility.facilityName : id
       })
       return facilities.join(", ")
     }
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index e63fdcc3..e6fd4df3 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -20,11 +20,11 @@
       </ion-segment-button>
     </ion-segment>
 
-    <ion-list v-if="facilityGroups.length">
-      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId" @click="!isAlreadyApplied(group.facilityGroupId) ? updateSelectedValues(group.facilityGroupId): ''">
-        <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName }}</ion-label>
+    <ion-list v-if="facilityGroupValues.length">
+      <ion-item v-for="group in facilityGroupValues" :key="group.facilityGroupId" @click="!isAlreadyApplied(group.facilityGroupId) ? updateSelectedValues(group.facilityGroupId): ''">
+        <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isSelected(group.facilityGroupId)">
-          {{ group.facilityGroupName }}
+          {{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}
         </ion-checkbox>
         <ion-note v-else slot="end" color="danger">{{ selectedSegment === 'included' ? translate("excluded") : translate("included") }}</ion-note>
       </ion-item>
@@ -74,6 +74,7 @@ import emitter from "@/event-bus";
 const selectedSegment = ref("included")
 const includedGroups = ref([]) as any;
 const excludedGroups = ref([]) as any;
+const facilityGroupValues = ref([]) as any;
 
 const props = defineProps(["rule"]);
 const store = useStore();
@@ -87,6 +88,16 @@ onMounted(async () => {
 
   const excludedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'not-in')
   if(excludedCondition && excludedCondition.fieldValue) excludedGroups.value = excludedCondition.fieldValue.split(",");
+
+  facilityGroupValues.value = JSON.parse(JSON.stringify(facilityGroups.value));
+
+  includedGroups.value.map((id: any) => {
+    if(!facilityGroups.value.find((group: any) => group.facilityGroupId === id)) facilityGroupValues.value.unshift({ facilityGroupId: id });
+  })
+
+  excludedGroups.value.map((id: any) => {
+    if(!facilityGroups.value.find((group: any) => group.facilityGroupId === id)) facilityGroupValues.value.unshift({ facilityGroupId: id })
+  })
 })
 
 function closeModal() {

From fd1012f64033d76334e65a8649583b1308eef391 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 12:23:17 +0530
Subject: [PATCH 145/250] Fixed: selected segment redirection issue on rule
 creation (#291)

---
 src/views/Shipping.vue    | 3 ++-
 src/views/StorePickup.vue | 4 +++-
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 4b255182..c93d60f2 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -81,13 +81,14 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
 
-const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY")
+const selectedSegment = ref("") as any;
 const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
 onIonViewWillEnter(async() => {
   emitter.emit("presentLoader");
+  selectedSegment.value = router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY";
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
 })
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index a81fbefa..2403b16a 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -81,13 +81,15 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
 
-const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
+const selectedSegment = ref("") as any;
+
 const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
 onIonViewWillEnter(async() => {
   emitter.emit("presentLoader");
+  selectedSegment.value = router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY";
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
 })

From 6d11968bac1acf33a38ad3a4ee50853a4ae1bf5d Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 12:41:49 +0530
Subject: [PATCH 146/250] Improved: code to empty data variable on leaving
 create rule page (#291)

---
 src/views/CreateSafetyStockRule.vue | 13 ++++++++++++-
 src/views/CreateShippingRule.vue    | 14 +++++++++++++-
 src/views/CreateStorePickupRule.vue | 14 +++++++++++++-
 src/views/CreateThresholdRule.vue   | 11 ++++++++++-
 4 files changed, 48 insertions(+), 4 deletions(-)

diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 476d2423..b168f4f0 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -81,7 +81,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonText, IonTitle, IonToolbar, modalController } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonText, IonTitle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
@@ -115,6 +115,17 @@ onMounted(async () => {
   await Promise.allSettled([store.dispatch("util/clearAppliedFilters"), store.dispatch("util/fetchFacilityGroups")])
 })
 
+onIonViewWillLeave(() => {
+  formData.value = {
+    ruleName: '',
+    safetyStock: '',
+    selectedFacilityGroups: {
+      included: [],
+      excluded: []
+    }
+  }
+})
+
 async function openProductFacilityGroupModal(type: string) {
   const modal = await modalController.create({
     component: AddProductFacilityGroupModal,
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 3bbdd70c..c0ad90e7 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -104,7 +104,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
 import { computed, onMounted, ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
@@ -140,6 +140,18 @@ onMounted(async () => {
   await store.dispatch("util/fetchConfigFacilities");
 })
 
+onIonViewWillLeave(() => {
+  formData.value = {
+    ruleName: '',
+    isBrokeringAllowed: false,
+    selectedFacilityGroups: {
+      included: [],
+      excluded: []
+    },
+    selectedConfigFacilites: []
+  }
+})
+
 function getDefaultUrl() {
   return `shipping?groupTypeEnumId=${selectedSegment.value}`
 }
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index c74e449b..ec1d1536 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -104,7 +104,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import { computed, onMounted, ref } from 'vue';
@@ -140,6 +140,18 @@ onMounted(async () => {
   await store.dispatch("util/fetchConfigFacilities");
 })
 
+onIonViewWillLeave(() => {
+  formData.value = {
+    ruleName: '',
+    isPickupAllowed: false,
+    selectedFacilityGroups: {
+      included: [],
+      excluded: []
+    },
+    selectedConfigFacilites: []
+  }
+})
+
 function getDefaultUrl() {
   return `store-pickup?groupTypeEnumId=${selectedSegment.value}`
 }
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 2f80fab1..83e9e620 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -79,7 +79,8 @@ import {
   IonNote,
   IonText,
   IonTitle,
-  IonToolbar
+  IonToolbar,
+  onIonViewWillLeave
 } from '@ionic/vue';
 import { saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
@@ -99,6 +100,14 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 
+onIonViewWillLeave(() => {
+  formData.value = {
+    ruleName: '',
+    threshold: '',
+    selectedConfigFacilites: []
+  }
+})
+
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
 const rules = computed(() => store.getters["rule/getRules"]);

From aaa2d17828ecc604a0a2b727cf1fb08a43ad91d7 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 15:02:15 +0530
Subject: [PATCH 147/250] Fixed: removeing facility groups using the close icon
 in chip and new config facilities not fetched (#291)

---
 src/components/AddProductFiltersModal.vue | 2 +-
 src/locales/en.json                       | 2 ++
 src/store/modules/util/actions.ts         | 4 +---
 src/views/CreateSafetyStockRule.vue       | 8 ++++++--
 src/views/CreateShippingRule.vue          | 8 ++++++--
 src/views/CreateStorePickupRule.vue       | 7 +++++--
 6 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index 17cbc1f6..44a0415a 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -8,7 +8,7 @@
       </ion-buttons>
       <ion-title>{{ type === "included" ? translate("Include", { label }) : translate("Exclude", { label }) }}</ion-title>
       <ion-buttons slot="end">
-        <ion-button fill="clear" color="danger" @click="selectedValues = []">{{ translate("Clear All") }}</ion-button>
+        <ion-button fill="clear" color="danger" :disabled="!facetOptions.length" @click="selectedValues = []">{{ translate("Clear All") }}</ion-button>
       </ion-buttons>
     </ion-toolbar>
   </ion-header>
diff --git a/src/locales/en.json b/src/locales/en.json
index c3f09cc0..7ab6308f 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -54,6 +54,7 @@
   "excluded": "excluded",
   "Excluded": "Excluded",
   "Exclude": "Exclude {label}",
+  "Exclude facility groups": "Exclude facility groups",
   "Export product thresholds": "Export product thresholds",
   "Export product threshold jobs": "Export product threshold jobs",
   "Facilities": "Facilities",
@@ -88,6 +89,7 @@
   "Filter stores": "Filter stores",
   "ID": "ID",
   "Import product thresholds": "Import product thresholds",
+  "Include facility groups": "Included facility groups",
   "Included": "Included",
   "Internal ID cannot be more than 20 characters.": "Internal ID cannot be more than 20 characters.",
   "Inventory channels": "Inventory channels",
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index a6c4a0cd..dd3ed198 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -11,9 +11,7 @@ import { DateTime } from 'luxon'
 
 const actions: ActionTree<UtilState, RootState> = {
   async fetchConfigFacilities ({ commit, state }) {
-    let configFacilities = JSON.parse(JSON.stringify(state.configFacilities))
-
-    if(configFacilities.length && configFacilities[0].productStoreId === store.state.user.currentEComStore.productStoreId) return;
+    let configFacilities = [];
 
     try {
       const resp = await UtilService.fetchFacilities({ facilityTypeId: 'CONFIGURATION', productStoreId: store.state.user.currentEComStore.productStoreId });
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index b168f4f0..71f78205 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -47,7 +47,7 @@
           <ion-card-content>
             <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
               {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle"/>
+              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
             </ion-chip>
           </ion-card-content>
         </ion-card>
@@ -63,7 +63,7 @@
           <ion-card-content>
             <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
               {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle"/>
+              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
             </ion-chip>
           </ion-card-content>
         </ion-card>
@@ -246,4 +246,8 @@ async function createRule() {
   }
   emitter.emit("dismissLoader");
 }
+
+function removeFacilityGroups(facilityGroupId: any, type: string) {
+  formData.value.selectedFacilityGroups[type] = formData.value.selectedFacilityGroups[type].filter((group: any) => group.facilityGroupId !== facilityGroupId)
+}
 </script>
\ No newline at end of file
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index c0ad90e7..118c6f20 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -53,7 +53,7 @@
           <ion-card-content>
             <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
               {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle"/>
+              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
             </ion-chip>
           </ion-card-content>
         </ion-card>
@@ -69,7 +69,7 @@
           <ion-card-content>
             <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
               {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle"/>
+              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
             </ion-chip>
           </ion-card-content>
         </ion-card>
@@ -305,6 +305,10 @@ function generateRuleConditions(ruleId: string) {
 
   return conditions;
 }
+
+function removeFacilityGroups(facilityGroupId: any, type: string) {
+  formData.value.selectedFacilityGroups[type] = formData.value.selectedFacilityGroups[type].filter((group: any) => group.facilityGroupId !== facilityGroupId)
+}
 </script>
 
 <style scoped>
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index ec1d1536..a3b64e65 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -53,7 +53,7 @@
           <ion-card-content>
             <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
               {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle"/>
+              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
             </ion-chip>
           </ion-card-content>
         </ion-card>
@@ -69,7 +69,7 @@
           <ion-card-content>
             <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
               {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle"/>
+              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
             </ion-chip>
           </ion-card-content>
         </ion-card>
@@ -306,6 +306,9 @@ function generateRuleConditions(ruleId: string) {
   return conditions;
 }
 
+function removeFacilityGroups(facilityGroupId: any, type: string) {
+  formData.value.selectedFacilityGroups[type] = formData.value.selectedFacilityGroups[type].filter((group: any) => group.facilityGroupId !== facilityGroupId)
+}
 </script>
 
 <style scoped>

From 5090942124c43d3b76181435cb8700866c8e5757 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 15:20:29 +0530
Subject: [PATCH 148/250] Improved: title for create and edit group modal
 (#291)

---
 src/components/CreateGroupModal.vue | 2 +-
 src/components/EditGroupModal.vue   | 2 +-
 src/locales/en.json                 | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index f01a0ba6..358679d5 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -6,7 +6,7 @@
           <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
-      <ion-title>{{ translate("Create group") }}</ion-title>
+      <ion-title>{{ translate("Create channel group") }}</ion-title>
     </ion-toolbar>
   </ion-header>
 
diff --git a/src/components/EditGroupModal.vue b/src/components/EditGroupModal.vue
index d913aba8..966536fd 100644
--- a/src/components/EditGroupModal.vue
+++ b/src/components/EditGroupModal.vue
@@ -6,7 +6,7 @@
           <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
-      <ion-title>{{ translate("Edit group") }}</ion-title>
+      <ion-title>{{ translate("Edit channel group") }}</ion-title>
     </ion-toolbar>
   </ion-header>
 
diff --git a/src/locales/en.json b/src/locales/en.json
index 7ab6308f..9a96a8af 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -24,7 +24,7 @@
   "Config facilities updated successfully.": "Config facilities updated successfully.",
   "Confirm": "Confirm",
   "Copy details": "Copy details",
-  "Create group": "Create group",
+  "Create channel group": "Create channel group",
   "Create new": "Create new",
   "Create rule": "Create rule",
   "Create Rule": "Create Rule",
@@ -39,7 +39,7 @@
   "Don't skip": "Don't skip",
   "Download": "Download",
   "Download data in csv": "Download data in csv",
-  "Edit group": "Edit group",
+  "Edit channel group": "Edit channel group",
   "Edit name": "Edit name",
   "Edit rule": "Edit rule",
   "Edit safety stock": "Edit safety stock",

From 8b47e3177eb9ac1e88191f97d70828f4f693b5da Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 15:48:56 +0530
Subject: [PATCH 149/250] Implemented: clear all button in all the select modal
 (#291)

---
 .../AddProductFacilityGroupModal.vue          |  3 +++
 src/components/AddProductFiltersModal.vue     |  2 +-
 .../SelectConfigFacilitiesModal.vue           | 21 +++++++++++--------
 src/components/UpdateFacilityGroupModal.vue   |  3 +++
 src/components/UpdateProductFiltersModal.vue  |  3 +++
 src/locales/en.json                           |  1 +
 6 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index 757f4312..15b5586e 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -7,6 +7,9 @@
         </ion-button>
       </ion-buttons>
       <ion-title>{{ type === "included" ? translate("Include facility groups") : translate("Exclude facility groups") }}</ion-title>
+      <ion-buttons slot="end">
+        <ion-button fill="clear" color="danger" :disabled="!selectedGroups.length" @click="selectedGroups = []">{{ translate("Clear All") }}</ion-button>
+      </ion-buttons>
     </ion-toolbar>
   </ion-header>
 
diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index 44a0415a..13519cc1 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -8,7 +8,7 @@
       </ion-buttons>
       <ion-title>{{ type === "included" ? translate("Include", { label }) : translate("Exclude", { label }) }}</ion-title>
       <ion-buttons slot="end">
-        <ion-button fill="clear" color="danger" :disabled="!facetOptions.length" @click="selectedValues = []">{{ translate("Clear All") }}</ion-button>
+        <ion-button fill="clear" color="danger" :disabled="!facetOptions.length || !selectedValues.length" @click="selectedValues = []">{{ translate("Clear All") }}</ion-button>
       </ion-buttons>
     </ion-toolbar>
   </ion-header>
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index e7ddba6c..7522dba1 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -7,6 +7,9 @@
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Select facilities") }}</ion-title>
+      <ion-buttons slot="end">
+        <ion-button fill="clear" color="danger" :disabled="!selectedFacilityValues.length" @click="selectedFacilityValues = []">{{ translate("Clear All") }}</ion-button>
+      </ion-buttons>
     </ion-toolbar>
   </ion-header>
 
@@ -51,7 +54,7 @@ import {
   IonToolbar,
   modalController
 } from "@ionic/vue";
-import { computed, defineProps, onMounted } from "vue";
+import { computed, defineProps, onMounted, ref } from "vue";
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { useStore } from "vuex";
 import { translate } from "@/i18n";
@@ -64,7 +67,7 @@ const store = useStore();
 const props = defineProps(["rule", "selectedFacilities"])
 
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
-let selectedFacilityValues = JSON.parse(JSON.stringify(props.selectedFacilities))
+const selectedFacilityValues = ref(JSON.parse(JSON.stringify(props.selectedFacilities)));
 
 onMounted(async () => {
   await store.dispatch("util/fetchConfigFacilities");
@@ -75,16 +78,16 @@ async function closeModal() {
 }
 
 async function toggleFacilitySelection(updatedFacility: any) {
-  const selectedFacility = selectedFacilityValues.some((facilityId: any) => facilityId === updatedFacility.facilityId);
+  const selectedFacility = selectedFacilityValues.value.some((facilityId: any) => facilityId === updatedFacility.facilityId);
   if (selectedFacility) {
-    selectedFacilityValues = selectedFacilityValues.filter((facilityId: any) => facilityId !== updatedFacility.facilityId);
+    selectedFacilityValues.value = selectedFacilityValues.value.filter((facilityId: any) => facilityId !== updatedFacility.facilityId);
   } else {
-    selectedFacilityValues.push(updatedFacility.facilityId);
+    selectedFacilityValues.value.push(updatedFacility.facilityId);
   }
 }
 
 function isSelected(currentFacilityId: any) {
-  return selectedFacilityValues.some((facilityId: any) => facilityId === currentFacilityId);
+  return selectedFacilityValues.value.some((facilityId: any) => facilityId === currentFacilityId);
 }
 
 async function saveFacilities() {  
@@ -93,15 +96,15 @@ async function saveFacilities() {
 
   const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
   if(condition) {
-    condition.fieldValue = selectedFacilityValues.join(",")
+    condition.fieldValue = selectedFacilityValues.value.join(",")
   } else {
     rule.ruleConditions.push({
       "ruleId": rule.ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
       "fieldName": "facilities",
       "operator": "in",
-      "fieldValue": selectedFacilityValues.length > 1 ? selectedFacilityValues.join(",") : selectedFacilityValues[0],
-      "multiValued": selectedFacilityValues.length > 1 ? "Y" : "N"
+      "fieldValue": selectedFacilityValues.value.length > 1 ? selectedFacilityValues.value.join(",") : selectedFacilityValues.value[0],
+      "multiValued": selectedFacilityValues.value.length > 1 ? "Y" : "N"
     })
   }
 
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index e63fdcc3..10db3c0c 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -7,6 +7,9 @@
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Select facility groups") }}</ion-title>
+      <ion-buttons slot="end">
+        <ion-button fill="clear" color="danger" :disabled="selectedSegment === 'included' ? !includedGroups.length : !excludedGroups.length" @click="selectedSegment === 'included' ? includedGroups = [] : excludedGroups = []">{{ translate("Clear All") }}</ion-button>
+      </ion-buttons>
     </ion-toolbar>
   </ion-header>
 
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index b18f22af..e8edd72e 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -7,6 +7,9 @@
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Select", { label }) }}</ion-title>
+      <ion-buttons slot="end">
+        <ion-button fill="clear" color="danger" :disabled="!facetOptions.length || (selectedSegment === 'included' ? !includedFilters.length : !excludedFilters.length)" @click="selectedSegment === 'included' ? includedFilters = [] : excludedFilters = []">{{ translate("Clear All") }}</ion-button>
+      </ion-buttons>
     </ion-toolbar>
   </ion-header>
 
diff --git a/src/locales/en.json b/src/locales/en.json
index 9a96a8af..08640257 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -39,6 +39,7 @@
   "Don't skip": "Don't skip",
   "Download": "Download",
   "Download data in csv": "Download data in csv",
+  "Edit group": "Edit group",
   "Edit channel group": "Edit channel group",
   "Edit name": "Edit name",
   "Edit rule": "Edit rule",

From 4d314a40e0673e79aba82e421453d1c0a6de7956 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 16:15:19 +0530
Subject: [PATCH 150/250] Implemented: empty state in product filters modal
 (#291)

---
 src/components/AddProductFiltersModal.vue    | 20 ++++++++++++++++++--
 src/components/UpdateProductFiltersModal.vue | 18 +++++++++++++++++-
 src/locales/en.json                          |  3 +++
 3 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index 13519cc1..729402ec 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -16,7 +16,13 @@
   <ion-content>
     <ion-searchbar :placeholder="translate('Search', { label })" v-model="queryString" @keyup.enter="search()"/>
 
-    <ion-list>
+    <div class="empty-state" v-if="isLoading">
+      <ion-item lines="none">
+        <ion-spinner name="crescent" slot="start" />
+        {{ translate("Fetching", { label }) }}
+      </ion-item>
+    </div>
+    <ion-list v-else-if="facetOptions.length">
       <ion-item v-for="option in facetOptions" :key="option.id"  @click="updateSelectedValues(option.id)">
         <ion-label v-if="isAlreadyApplied(option.id)">{{ option.label }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="selectedValues.includes(option.id)">
@@ -25,6 +31,12 @@
         <ion-note v-else slot="end" color="danger">{{ type === 'included' ? translate("excluded") : translate("included") }}</ion-note>
       </ion-item>
     </ion-list>
+    <div class="empty-state" v-else-if="!queryString">
+      <p>{{ translate("Search for to find results", { label }) }}</p>
+    </div>
+    <div class="empty-state" v-else>
+      <p>{{ translate("No result found for", { label: queryString }) }}</p>
+    </div>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFilters()">
@@ -56,6 +68,7 @@ import {
   IonList,
   IonNote,
   IonSearchbar,
+  IonSpinner,
   IonTitle,
   IonToolbar,
   modalController
@@ -70,6 +83,7 @@ const queryString = ref('');
 const facetOptions = ref([]) as any;
 const isScrollable = ref(true);
 const selectedValues = ref([]) as any;
+let isLoading = ref(false)
 
 const props = defineProps(["label", "facetToSelect", "searchfield", "type"]);
 const store = useStore();
@@ -89,9 +103,10 @@ function search() {
 }
 
 async function getFilters(vSize?: any, vIndex?: any) {
+  isLoading.value = true;
   const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
   const viewIndex = vIndex ? vIndex : 0;
-
+  
   const payload = {
     facetToSelect: props.facetToSelect,
     docType: 'PRODUCT',
@@ -115,6 +130,7 @@ async function getFilters(vSize?: any, vIndex?: any) {
     facetOptions.value = [];
     isScrollable.value = false;
   }
+  isLoading.value = false;
 }
 
 async function loadMoreFilters(event: any){
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index e8edd72e..be83c517 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -25,7 +25,13 @@
       </ion-segment-button>
     </ion-segment>
 
-    <ion-list>
+    <div class="empty-state" v-if="isLoading">
+      <ion-item lines="none">
+        <ion-spinner name="crescent" slot="start" />
+        {{ translate("Fetching", { label }) }}
+      </ion-item>
+    </div>
+    <ion-list v-else-if="facetOptions.length">
       <ion-item v-for="option in facetOptions" :key="option.id"  @click="!isAlreadyApplied(option.id) ? updateSelectedValues(option.id): ''">
         <ion-label v-if="isAlreadyApplied(option.id)">{{ option.label }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="isSelected(option.id)">
@@ -34,6 +40,12 @@
         <ion-note v-else slot="end" color="danger">{{ selectedSegment === 'included' ? translate("excluded") : translate("included") }}</ion-note>
       </ion-item>
     </ion-list>
+    <div class="empty-state" v-else-if="!queryString">
+      <p>{{ translate("Search for to find results", { label }) }}</p>
+    </div>
+    <div class="empty-state" v-else>
+      <p>{{ translate("No result found for", { label: queryString }) }}</p>
+    </div>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="saveFilters()">
@@ -67,6 +79,7 @@ import {
   IonSearchbar,
   IonSegment,
   IonSegmentButton,
+  IonSpinner,
   IonTitle,
   IonToolbar,
   modalController
@@ -86,6 +99,7 @@ const isScrollable = ref(true);
 const selectedSegment = ref("included")
 const includedFilters = ref([]) as any;
 const excludedFilters = ref([]) as any;
+const isLoading = ref(false);
 
 const props = defineProps(["label", "facetToSelect", "searchfield", "rule"]);
 const store = useStore();
@@ -107,6 +121,7 @@ function search() {
 }
 
 async function getFilters(vSize?: any, vIndex?: any) {
+  isLoading.value = true;
   const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
   const viewIndex = vIndex ? vIndex : 0;
 
@@ -133,6 +148,7 @@ async function getFilters(vSize?: any, vIndex?: any) {
     facetOptions.value = [];
     isScrollable.value = false;
   }
+  isLoading.value = false;
 }
 
 async function loadMoreFilters(event: any){
diff --git a/src/locales/en.json b/src/locales/en.json
index 08640257..449e6a2f 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -77,6 +77,7 @@
   "Failed to schedule service": "Failed to schedule service",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
   "features": "{type} features",
+  "Fetching": "Fetching {label}",
   "Fetching time zones": "Fetching time zones",
   "Frequency": "Frequency",
   "Fulfillment capacity": "Fulfillment capacity",
@@ -128,6 +129,7 @@
   "No jobs have run yet": "No jobs have run yet",
   "No jobs to update": "No jobs to update",
   "No previous occurrence": "No previous occurrence",
+  "No result found for": "No result found for {label}",
   "No rules found, redirecting to product page": "No rules found, redirecting to product page",
   "No threshold rule found. Invalid job": "No threshold rule found. Invalid job",
   "No threshold rules found": "No threshold rules found",
@@ -192,6 +194,7 @@
   "Schedule Job": "Schedule Job",
   "Search orders": "Search orders",
   "Search": "Search {label}",
+  "Search for to find results": "Search for {label} to find results",
   "Select": "Select {label}",
   "Select all variants": "Select all variants",
   "Select CSV": "Select CSV",

From 7a292076c0ce06a1e2fb4ae5ea817c512d89b4ba Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 16:22:54 +0530
Subject: [PATCH 151/250] Fixed: facility group not updating in case of no
 group selected (#291)

---
 src/views/CreateSafetyStockRule.vue | 2 +-
 src/views/CreateShippingRule.vue    | 2 +-
 src/views/CreateStorePickupRule.vue | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 71f78205..fdb97744 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -136,7 +136,7 @@ async function openProductFacilityGroupModal(type: string) {
   })
 
   modal.onDidDismiss().then((result: any) => {
-    if(result.data?.selectedGroups?.length) {
+    if(result.data?.selectedGroups) {
       formData.value.selectedFacilityGroups[type] = result.data.selectedGroups
     }
   })
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 118c6f20..ac38429d 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -166,7 +166,7 @@ async function openProductFacilityGroupModal(type: string) {
   })
 
   modal.onDidDismiss().then((result: any) => {
-    if(result.data?.selectedGroups?.length) {
+    if(result.data?.selectedGroups) {
       formData.value.selectedFacilityGroups[type] = result.data.selectedGroups
     }
   })
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index a3b64e65..82097122 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -166,7 +166,7 @@ async function openProductFacilityGroupModal(type: string) {
   })
 
   modal.onDidDismiss().then((result: any) => {
-    if(result.data?.selectedGroups?.length) {
+    if(result.data?.selectedGroups) {
       formData.value.selectedFacilityGroups[type] = result.data.selectedGroups
     }
   })

From 578b92a49fb7b92582ead0d08fa18ba4140d804c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 18:15:47 +0530
Subject: [PATCH 152/250] git status

---
 src/store/modules/channel/actions.ts | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index 4446eb2f..2ccdb2bc 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -38,7 +38,7 @@ const actions: ActionTree<ChannelState, RootState> = {
       if(!hasError(resp)) {
         const currentGroup = groups.find((group: any) => group.facilityGroupId === facilityGroupId)
         currentGroup.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
-        currentGroup.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
+        currentGroup.selectedFacilities = await resp.data.filter((facility: any) => facility.parentFacilityTypeId !== "VIRTUAL_FACILITY" && facility.facilityTypeId !== "VIRTUAL_FACILITY")
       } else {
         throw resp.data
       }
@@ -46,10 +46,9 @@ const actions: ActionTree<ChannelState, RootState> = {
       await Promise.allSettled(groups.map(async (group: any) => {
         try {
           const resp = await ChannelService.fetchGroupFacilities({ facilityGroupId: group.facilityGroupId, pageSize: 100 });
-
           if(!hasError(resp)) {
             group.selectedConfigFacility = await resp.data.find((facility: any) => facility.facilityTypeId === "CONFIGURATION")
-            group.selectedFacilities = await resp.data.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "WAREHOUSE")
+            group.selectedFacilities = await resp.data.filter((facility: any) => (facility.parentFacilityTypeId !== "VIRTUAL_FACILITY" && facility.facilityTypeId !== "VIRTUAL_FACILITY"))
           } else {
             throw resp.data
           }

From 1b02ec52546c0903c823bcff8433d62085ef988a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 18:26:40 +0530
Subject: [PATCH 153/250] Improved: added maxlength to the description of group
 while creation and updation (#291)

---
 src/components/CreateGroupModal.vue | 2 +-
 src/components/EditGroupModal.vue   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index 358679d5..e8331212 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -21,7 +21,7 @@
         <ion-input :label="translate('ID')" labelPlacement="floating" ref="facilityGroupId" v-model="formData.facilityGroupId" @ionInput="validateFacilityGroupId" @ionBlur="markFacilityGroupIdTouched" :error-text="translate('Internal ID cannot be more than 20 characters.')" />
       </ion-item>
       <ion-item>
-        <ion-textarea :label="translate('Description')" v-model="formData.description" labelPlacement="floating" />
+        <ion-textarea :label="translate('Description')" v-model="formData.description" labelPlacement="floating" :maxlength="255" />
       </ion-item>
       <ion-item>
         <ion-label>{{ translate("Product store") }}</ion-label>
diff --git a/src/components/EditGroupModal.vue b/src/components/EditGroupModal.vue
index 966536fd..9c54a249 100644
--- a/src/components/EditGroupModal.vue
+++ b/src/components/EditGroupModal.vue
@@ -16,7 +16,7 @@
         <ion-input :label="translate('Name')" labelPlacement="floating" v-model="formData.facilityGroupName"/>
       </ion-item>
       <ion-item>
-        <ion-textarea :label="translate('Description')" labelPlacement="floating" v-model="formData.description" />
+        <ion-textarea :label="translate('Description')" labelPlacement="floating" v-model="formData.description" :maxlength="255" />
       </ion-item>
     </ion-list>
   </ion-content>

From 85bb382739b55da56df4ebb9b38a3a2d9d491ad7 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 7 May 2024 19:39:51 +0530
Subject: [PATCH 154/250] Implemented: added functionality to the store
 selector in menu footer (#291)

---
 src/components/Menu.vue             |  2 ++
 src/components/RuleItem.vue         |  2 +-
 src/components/ScheduleRuleItem.vue |  2 +-
 src/views/SafetyStock.vue           | 13 +++++++++++--
 src/views/Shipping.vue              | 13 +++++++++++--
 src/views/StorePickup.vue           | 14 +++++++++++---
 src/views/Threshold.vue             | 15 ++++++++++++---
 7 files changed, 49 insertions(+), 12 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 232957c3..106c93b9 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -65,6 +65,7 @@
   import { useRouter } from "vue-router";
   import { cloudUploadOutline, globeOutline, settingsOutline, sendOutline, storefrontOutline, pulseOutline } from 'ionicons/icons';
   import { translate } from "@/i18n";
+  import emitter from "@/event-bus";
 
   const store = useStore();
   const router = useRouter();
@@ -125,6 +126,7 @@
       store.dispatch("user/setEcomStore", {
         "productStoreId": event.detail.value
       })
+      emitter.emit("productStoreOrConfigChanged")
     }
   }
   </script>
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index c2d64958..81cf308f 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -101,7 +101,7 @@
       </ion-item>
 
       <ion-item lines="none">
-        <ion-button @click="editRuleName()" fill="clear">{{ translate("Edit name") }}</ion-button>
+        <ion-button @click="editRuleName()" size="default" fill="clear">{{ translate("Edit name") }}</ion-button>
         <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
           <ion-icon :icon="archiveOutline" slot="icon-only"/>
         </ion-button>
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index ee15d203..88c78ffb 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -20,7 +20,7 @@
     </ion-item>
   
     <ion-item lines="none">
-      <ion-button fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
+      <ion-button fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" size="default" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
       <ion-button color="medium" fill="clear" slot="end" @click="OpenScheduleActionsPopover($event)">
         <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
       </ion-button>
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 142247a7..ca953566 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -36,7 +36,7 @@ import RuleItem from '@/components/RuleItem.vue';
 import { useRouter } from "vue-router";
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useStore } from 'vuex';
-import { computed } from 'vue';
+import { computed, onUnmounted } from 'vue';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
 
@@ -47,10 +47,19 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onIonViewWillEnter(async() => {
+  fetchRules();
+  emitter.on("productStoreOrConfigChanged", fetchRules);
+})
+
+onUnmounted(() => {
+  emitter.off("productStoreOrConfigChanged", fetchRules);
+})
+
+async function fetchRules() {
   emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
   emitter.emit("dismissLoader");
-})
+}
 
 function createRule() {
   router.push({ path: '/create-safety-stock' })
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index c93d60f2..9ea6aae7 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -63,7 +63,7 @@
 
 <script setup lang="ts">
 import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { computed, ref } from 'vue';
+import { computed, onUnmounted, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@/i18n';
@@ -87,11 +87,20 @@ const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
 onIonViewWillEnter(async() => {
+  fetchRules();
+  emitter.on("productStoreOrConfigChanged", fetchRules);
+})
+
+onUnmounted(() => {
+  emitter.off("productStoreOrConfigChanged", fetchRules);
+})
+
+async function fetchRules() {
   emitter.emit("presentLoader");
   selectedSegment.value = router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY";
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
-})
+}
 
 async function fetchFacilities(vSize?: any, vIndex?: any) {
   const pageSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 2403b16a..14ccd482 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -64,7 +64,7 @@
 
 <script setup lang="ts">
 import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { computed, ref } from 'vue';
+import { computed, onUnmounted, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
@@ -88,12 +88,20 @@ const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
 onIonViewWillEnter(async() => {
+  fetchRules();
+  emitter.on("productStoreOrConfigChanged", fetchRules);
+})
+
+onUnmounted(() => {
+  emitter.off("productStoreOrConfigChanged", fetchRules);
+})
+
+async function fetchRules() {
   emitter.emit("presentLoader");
   selectedSegment.value = router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY";
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
-})
-
+}
 
 async function fetchFacilities(vSize?: any, vIndex?: any) {
   const pageSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index b2a64622..f9fab85b 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -35,7 +35,7 @@ import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
-import { computed } from 'vue';
+import { computed, onUnmounted } from 'vue';
 import { useStore } from 'vuex';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
@@ -47,10 +47,19 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
 onIonViewWillEnter(async() => {
+  fetchRules();
+  emitter.on("productStoreOrConfigChanged", fetchRules);
+})
+
+onUnmounted(() => {
+  emitter.off("productStoreOrConfigChanged", fetchRules);
+})
+
+async function fetchRules() {
   emitter.emit("presentLoader");
-  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
   emitter.emit("dismissLoader");
-})
+}
 
 function CreateThreshold() {
   router.push({ path: '/create-threshold' })

From 4756e42461ffaa2f7a896db602c203f7db218937 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 8 May 2024 09:43:29 +0530
Subject: [PATCH 155/250] Improved: regex for threshold validation to avoid
 entering e in the threshold value (#287)

---
 src/components/RuleItem.vue         | 4 ++--
 src/views/CreateSafetyStockRule.vue | 2 +-
 src/views/CreateThresholdRule.vue   | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index ac063ba8..18c5dbd4 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -156,7 +156,7 @@ async function editThreshold() {
       attributes: {
         // Added check to not allow mainly .(period) and other special characters to be entered in the alert input
         onkeydown: ($event: any) => {
-          if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test($event.key)) $event.preventDefault();
+          if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test($event.key)) $event.preventDefault();
         }
       }
     }],
@@ -216,7 +216,7 @@ async function editSafetyStock() {
       attributes: {
         // Added check to not allow mainly .(period) and other special characters to be entered in the alert input
         onkeydown: ($event: any) => {
-          if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test($event.key)) $event.preventDefault();
+          if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test($event.key)) $event.preventDefault();
         }
       }
     }],
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 437b3ad4..1038bc7f 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -237,6 +237,6 @@ async function createRule() {
 }
 
 function validateSafetyStock(event: any) {
-  if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test(event.key)) event.preventDefault();
+  if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test(event.key)) event.preventDefault();
 }
 </script>
\ No newline at end of file
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 69e2f2d2..63ad5951 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -219,7 +219,7 @@ async function createThresholdRule() {
 }
 
 function validateThreshold(event: any) {
-  if(/[`!@#$%^&*()_+\-=\\|,.<>?~]/.test(event.key)) event.preventDefault();
+  if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test(event.key)) event.preventDefault();
 }
 </script>
 

From 96aca2bb104a5aa828f7418c419d5925a253bbb8 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 8 May 2024 11:59:22 +0530
Subject: [PATCH 156/250] Improved: added support for login using full oms url
 (#297)

---
 src/api/index.ts            | 2 +-
 src/services/UserService.ts | 6 ++++--
 2 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/api/index.ts b/src/api/index.ts
index dbe7b402..5cee9a38 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -86,7 +86,7 @@ const api = async (customConfig: any) => {
   }
 
   const baseURL = store.getters["user/getInstanceUrl"];
-  if (baseURL) config.baseURL = `https://${baseURL}.hotwax.io/rest/s1/available-to-promise/`;
+  if (baseURL) config.baseURL = baseURL.startsWith('http') ? baseURL.includes('/rest/s1/available-to-promise') ? baseURL : `${baseURL}rest/s1/available-to-promise/` : `https://${baseURL}.hotwax.io/rest/s1/available-to-promise/`;
   if(customConfig.cache) config.adapter = axiosCache.adapter;
   const networkStatus =  await OfflineHelper.getNetworkStatus();
   if (customConfig.queue && !networkStatus.connected) {
diff --git a/src/services/UserService.ts b/src/services/UserService.ts
index 065d50cb..f52014d4 100644
--- a/src/services/UserService.ts
+++ b/src/services/UserService.ts
@@ -26,7 +26,8 @@ const login = async (username: string, password: string): Promise <any> => {
 }
 
 const getUserProfile = async (token: any): Promise<any> => {
-  const baseURL = store.getters["user/getBaseUrl"];
+  const url = store.getters["user/getBaseUrl"];
+  const baseURL = url.startsWith('http') ? url.includes('/rest/s1/available-to-promise') ? url : `${url}/rest/s1/available-to-promise/` : `https://${url}.hotwax.io/rest/s1/available-to-promise/`;
   try {
     const resp = await client({
       url: "user/profile",
@@ -62,7 +63,8 @@ const setUserTimeZone = async (payload: any): Promise <any>  => {
 
 const getEComStores = async (token: any): Promise<any> => {
   try {
-    const baseURL = store.getters["user/getBaseUrl"];
+    const url = store.getters["user/getBaseUrl"];
+    const baseURL = url.startsWith('http') ? url.includes('/rest/s1/available-to-promise') ? url : `${url}/rest/s1/available-to-promise/` : `https://${url}.hotwax.io/rest/s1/available-to-promise/`;
     const resp = await client({
       url: "user/productStore",
       method: "GET",

From 5d2f524c197da07d51173892cc5551704efc5135 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 8 May 2024 12:20:20 +0530
Subject: [PATCH 157/250] Improved: logic to fetch ruleActions and
 ruleConditions while fetching the rules for a group (#299)

---
 src/services/RuleService.ts       | 21 +--------------------
 src/store/modules/rule/actions.ts | 17 ++---------------
 2 files changed, 3 insertions(+), 35 deletions(-)

diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index e614537e..0bce9bca 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -12,7 +12,7 @@ const fetchRuleGroup = async (payload: any): Promise <any>  => {
 
 const fetchRules = async (payload: any): Promise <any>  => {
   return api({
-    url: `ruleGroups/${payload.ruleGroupId}/rules`,
+    url: `decisionRules`,
     method: "GET",
     params: payload
   });
@@ -78,24 +78,6 @@ const updateRule = async (payload: any, ruleId: string): Promise <any>  => {
   }
 }
 
-const fetchRulesActionsAndConditions = async (ruleId: any): Promise <any>  => {
-  try {
-    const resp = await api({
-      url: `decisionRules/${ruleId}`,
-      method: "GET"
-    }) as any;
-
-    if(!hasError(resp)) {
-      return Promise.resolve(resp.data)
-    } else {
-      throw resp.data
-    }
-  } catch(err: any) {
-    logger.error(err)
-    return Promise.reject("Failed to fetch rule information.");
-  }
-}
-
 const fetchRuleScheduleInformation = async (ruleGroupId: string): Promise<any> => {
   return api({
     url: `ruleGroups/${ruleGroupId}/schedule`,
@@ -131,7 +113,6 @@ export const RuleService = {
   fetchRuleGroup,
   fetchRuleGroupHistory,
   fetchRules,
-  fetchRulesActionsAndConditions,
   fetchRuleScheduleInformation,
   runNow,
   scheduleRuleGroup,
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index f1a47216..7d922cfc 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -36,7 +36,7 @@ const actions: ActionTree<RuleState, RootState> = {
   },
 
   async fetchRules({ commit, dispatch }, payload) {
-    const rules = [] as any;
+    let rules = [] as any;
 
     try {
       const ruleGroup = await dispatch('fetchRuleGroup', payload)
@@ -53,20 +53,7 @@ const actions: ActionTree<RuleState, RootState> = {
       })
 
       if(!hasError(resp)) {
-        const responses = await Promise.allSettled(
-          resp.data.map((rule: any) => RuleService.fetchRulesActionsAndConditions(rule.ruleId))
-        )
-
-        const hasFailedResponse = responses.some((response: any) => hasError(response.value))
-        if (hasFailedResponse) {
-          logger.error('Failed to fetch some rules')
-        }
-
-        responses.map((response: any) => {
-          if(response.status === 'fulfilled') {
-            rules.push(response.value)
-          }
-        })
+        rules = resp.data;
       } else {
         throw resp.data
       }

From f27e90b5b594473ccaeb2faa459fef5263101378 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 8 May 2024 12:51:15 +0530
Subject: [PATCH 158/250] Improved: added fetching spinner in link facilities
 to group modal (#291)

---
 src/components/LinkFacilitiesToGroupModal.vue | 13 +++++++++++--
 src/locales/en.json                           |  1 +
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/LinkFacilitiesToGroupModal.vue b/src/components/LinkFacilitiesToGroupModal.vue
index 1a141ef2..97ca109a 100644
--- a/src/components/LinkFacilitiesToGroupModal.vue
+++ b/src/components/LinkFacilitiesToGroupModal.vue
@@ -13,7 +13,13 @@
   <ion-content>
     <ion-searchbar v-model="queryString" @keyup.enter="fetchFacilities()" />
 
-    <ion-list v-if="facilities?.length">
+    <div class="empty-state" v-if="isLoading">
+      <ion-item lines="none">
+        <ion-spinner name="crescent" slot="start" />
+        {{ translate("Fetching facilities") }}
+      </ion-item>
+    </div>
+    <ion-list v-else-if="facilities?.length">
       <ion-item lines="none" v-for="facility in facilities" :key="facility.facilityId" @click="updateSelectedFacilities(facility.facilityId)">
         <ion-checkbox :checked="isFacilitySelected(facility.facilityId)">
           <ion-label>
@@ -36,7 +42,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonButtons, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { IonButton, IonButtons, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonSearchbar, IonSpinner, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from '@/i18n'
 import { defineProps, onMounted, ref } from "vue";
@@ -51,6 +57,7 @@ import emitter from "@/event-bus";
 const store = useStore();
 const queryString = ref('');
 const selectedFacilityValues = ref([]) as any;
+const isLoading = ref(false);
 
 const props = defineProps(["group", "selectedFacilities"]);
 const facilities = ref([]) as any;
@@ -65,6 +72,7 @@ function closeModal() {
 }
 
 async function fetchFacilities () {
+  isLoading.value = true;
   facilities.value = []
 
   try {
@@ -95,6 +103,7 @@ async function fetchFacilities () {
   } catch (err: any) {
     logger.error(err)
   }
+  isLoading.value = false;
 }
 
 function isFacilitySelected(facilityId: string) {
diff --git a/src/locales/en.json b/src/locales/en.json
index 449e6a2f..acb44982 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -78,6 +78,7 @@
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
   "features": "{type} features",
   "Fetching": "Fetching {label}",
+  "Fetching facilities": "Fetching facilities",
   "Fetching time zones": "Fetching time zones",
   "Frequency": "Frequency",
   "Fulfillment capacity": "Fulfillment capacity",

From 5d389b184ee60ce8cb08a9998f30e8298e1cc162 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 8 May 2024 14:30:18 +0530
Subject: [PATCH 159/250] Improved: added comment for the reason why the
 disable check is added in clear all button (#291)

---
 src/components/AddProductFacilityGroupModal.vue | 1 +
 src/components/AddProductFiltersModal.vue       | 1 +
 src/components/SelectConfigFacilitiesModal.vue  | 1 +
 src/components/UpdateFacilityGroupModal.vue     | 1 +
 src/components/UpdateProductFiltersModal.vue    | 1 +
 5 files changed, 5 insertions(+)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index 15b5586e..a4db8fc1 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -8,6 +8,7 @@
       </ion-buttons>
       <ion-title>{{ type === "included" ? translate("Include facility groups") : translate("Exclude facility groups") }}</ion-title>
       <ion-buttons slot="end">
+        <!-- Clear button should be disabled till no group is selected -->
         <ion-button fill="clear" color="danger" :disabled="!selectedGroups.length" @click="selectedGroups = []">{{ translate("Clear All") }}</ion-button>
       </ion-buttons>
     </ion-toolbar>
diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index 729402ec..516ec0ea 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -8,6 +8,7 @@
       </ion-buttons>
       <ion-title>{{ type === "included" ? translate("Include", { label }) : translate("Exclude", { label }) }}</ion-title>
       <ion-buttons slot="end">
+        <!-- Clear all button should be disabled if no facetOptions are available to select or if no filter is selected. -->
         <ion-button fill="clear" color="danger" :disabled="!facetOptions.length || !selectedValues.length" @click="selectedValues = []">{{ translate("Clear All") }}</ion-button>
       </ion-buttons>
     </ion-toolbar>
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index 7522dba1..82b4efbd 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -8,6 +8,7 @@
       </ion-buttons>
       <ion-title>{{ translate("Select facilities") }}</ion-title>
       <ion-buttons slot="end">
+        <!-- Added check to disabled clear all button if not facility is selected. -->
         <ion-button fill="clear" color="danger" :disabled="!selectedFacilityValues.length" @click="selectedFacilityValues = []">{{ translate("Clear All") }}</ion-button>
       </ion-buttons>
     </ion-toolbar>
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index 10db3c0c..fd82fbb8 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -8,6 +8,7 @@
       </ion-buttons>
       <ion-title>{{ translate("Select facility groups") }}</ion-title>
       <ion-buttons slot="end">
+        <!-- Added check to disable clear all button if not group is selected for current segment. -->
         <ion-button fill="clear" color="danger" :disabled="selectedSegment === 'included' ? !includedGroups.length : !excludedGroups.length" @click="selectedSegment === 'included' ? includedGroups = [] : excludedGroups = []">{{ translate("Clear All") }}</ion-button>
       </ion-buttons>
     </ion-toolbar>
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index be83c517..c55a3cd5 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -8,6 +8,7 @@
       </ion-buttons>
       <ion-title>{{ translate("Select", { label }) }}</ion-title>
       <ion-buttons slot="end">
+        <!-- Added check to disable clear button if no facetOptions are available to select or if no filter is selected for the current segment. -->
         <ion-button fill="clear" color="danger" :disabled="!facetOptions.length || (selectedSegment === 'included' ? !includedFilters.length : !excludedFilters.length)" @click="selectedSegment === 'included' ? includedFilters = [] : excludedFilters = []">{{ translate("Clear All") }}</ion-button>
       </ion-buttons>
     </ion-toolbar>

From 46c4895d7b9d3f827bfa1e88441355abc473e466 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 8 May 2024 15:31:15 +0530
Subject: [PATCH 160/250] Fixed: added missing / form the baseUrl check while
 login (#299)

---
 src/api/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/api/index.ts b/src/api/index.ts
index 5cee9a38..cfd50c46 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -86,7 +86,7 @@ const api = async (customConfig: any) => {
   }
 
   const baseURL = store.getters["user/getInstanceUrl"];
-  if (baseURL) config.baseURL = baseURL.startsWith('http') ? baseURL.includes('/rest/s1/available-to-promise') ? baseURL : `${baseURL}rest/s1/available-to-promise/` : `https://${baseURL}.hotwax.io/rest/s1/available-to-promise/`;
+  if (baseURL) config.baseURL = baseURL.startsWith('http') ? baseURL.includes('/rest/s1/available-to-promise') ? baseURL : `${baseURL}/rest/s1/available-to-promise/` : `https://${baseURL}.hotwax.io/rest/s1/available-to-promise/`;
   if(customConfig.cache) config.adapter = axiosCache.adapter;
   const networkStatus =  await OfflineHelper.getNetworkStatus();
   if (customConfig.queue && !networkStatus.connected) {

From a9b94cf82136fe0fbdc86a9dca6edd361c7378eb Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 8 May 2024 16:42:34 +0530
Subject: [PATCH 161/250] Improved: set multivalued to always 'Y' and fetching
 ruleGroup with active status (#299)

---
 src/components/SelectConfigFacilitiesModal.vue | 2 +-
 src/components/UpdateFacilityGroupModal.vue    | 4 ++--
 src/components/UpdateProductFiltersModal.vue   | 4 ++--
 src/store/modules/rule/actions.ts              | 2 +-
 src/views/CreateSafetyStockRule.vue            | 6 +++---
 src/views/CreateShippingRule.vue               | 8 ++++----
 src/views/CreateStorePickupRule.vue            | 8 ++++----
 src/views/CreateThresholdRule.vue              | 4 ++--
 8 files changed, 19 insertions(+), 19 deletions(-)

diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
index e7ddba6c..a3ef0b1c 100644
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ b/src/components/SelectConfigFacilitiesModal.vue
@@ -101,7 +101,7 @@ async function saveFacilities() {
       "fieldName": "facilities",
       "operator": "in",
       "fieldValue": selectedFacilityValues.length > 1 ? selectedFacilityValues.join(",") : selectedFacilityValues[0],
-      "multiValued": selectedFacilityValues.length > 1 ? "Y" : "N"
+      "multiValued": "Y"
     })
   }
 
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
index e63fdcc3..acac7a62 100644
--- a/src/components/UpdateFacilityGroupModal.vue
+++ b/src/components/UpdateFacilityGroupModal.vue
@@ -130,7 +130,7 @@ async function saveFacilityGroups() {
       "fieldName": "facilityGroups",
       "operator": "in",
       "fieldValue": includedGroups.value?.length > 1 ? includedGroups.value.join(",") : includedGroups.value[0],
-      "multiValued": includedGroups.value?.length > 1 ? "Y" : "N"
+      "multiValued": "Y"
     })
   }
 
@@ -144,7 +144,7 @@ async function saveFacilityGroups() {
       "fieldName": "facilityGroups",
       "operator": "not-in",
       "fieldValue": excludedGroups.value?.length > 1 ? excludedGroups.value.join(",") : excludedGroups.value[0],
-      "multiValued": excludedGroups.value?.length > 1 ? "Y" : "N"
+      "multiValued": "Y"
     })
   }
 
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
index b18f22af..c2f74cb4 100644
--- a/src/components/UpdateProductFiltersModal.vue
+++ b/src/components/UpdateProductFiltersModal.vue
@@ -178,7 +178,7 @@ async function saveFilters() {
       "fieldName": props.searchfield,
       "operator": "in",
       "fieldValue": includedFilters.value?.length > 1 ? includedFilters.value.join(",") : includedFilters.value[0],
-      "multiValued": includedFilters.value?.length > 1 ? "Y" : "N"
+      "multiValued": "Y"
     })
   }
 
@@ -192,7 +192,7 @@ async function saveFilters() {
       "fieldName": props.searchfield,
       "operator": "not-in",
       "fieldValue": excludedFilters.value?.length > 1 ? excludedFilters.value.join(",") : excludedFilters.value[0],
-      "multiValued": excludedFilters.value?.length > 1 ? "Y" : "N"
+      "multiValued": "Y"
     })
   }
 
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 7d922cfc..22715a56 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -15,7 +15,7 @@ const actions: ActionTree<RuleState, RootState> = {
     let resp;
 
     try {
-      resp = await RuleService.fetchRuleGroup({ ...payload, productStoreId: productStore.productStoreId })
+      resp = await RuleService.fetchRuleGroup({ ...payload, productStoreId: productStore.productStoreId, statusId: "ATP_RG_ACTIVE" })
 
       if(!hasError(resp) && resp.data.length) {
         ruleGroup = resp.data[0]
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 476d2423..2be6c0c3 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -153,7 +153,7 @@ function generateRuleConditions(ruleId: string) {
       "fieldName": "facilities",
       "operator": "in",
       "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
-      "multiValued": includedFacilityGroupIds.length > 1 ? "Y" : "N"
+      "multiValued": "Y"
     })
   }
 
@@ -165,7 +165,7 @@ function generateRuleConditions(ruleId: string) {
       "fieldName": "facilities",
       "operator": "not-in",
       "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
-      "multiValued": excludedFacilityGroupIds.length > 1 ? "Y" : "N"
+      "multiValued": "Y"
     })
   }
 
@@ -178,7 +178,7 @@ function generateRuleConditions(ruleId: string) {
           "fieldName": filter,
           "operator": type === "included" ? "in" : "not-in",
           "fieldValue": value.length > 1 ? value.join(",") : value[0],
-          "multiValued": value.length > 1 ? "Y" : "N"
+          "multiValued": "Y"
         })
       }
     })
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 3bbdd70c..42a7a0fc 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -247,7 +247,7 @@ function generateRuleConditions(ruleId: string) {
         "fieldName": "facilityGroups",
         "operator": "in",
         "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
-        "multiValued": includedFacilityGroupIds.length > 1 ? "Y" : "N"
+        "multiValued": "Y"
       })
     }
 
@@ -259,7 +259,7 @@ function generateRuleConditions(ruleId: string) {
         "fieldName": "facilityGroups",
         "operator": "not-in",
         "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
-        "multiValued": excludedFacilityGroupIds.length > 1 ? "Y" : "N"
+        "multiValued": "Y"
       })
     }
   } else {
@@ -271,7 +271,7 @@ function generateRuleConditions(ruleId: string) {
         "fieldName": "facilities",
         "operator": "in",
         "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
-        "multiValued": selectedFacilites.length > 1 ? "Y" : "N"
+        "multiValued": "Y"
       })
     }
   }
@@ -285,7 +285,7 @@ function generateRuleConditions(ruleId: string) {
           "fieldName": filter,
           "operator": type === "included" ? "in" : "not-in",
           "fieldValue": value.length > 1 ? value.join(",") : value[0],
-          "multiValued": value.length > 1 ? "Y" : "N"
+          "multiValued": "Y"
         })
       }
     })
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index c74e449b..55d25b38 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -247,7 +247,7 @@ function generateRuleConditions(ruleId: string) {
         "fieldName": "facilities",
         "operator": "in",
         "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
-        "multiValued": includedFacilityGroupIds.length > 1 ? "Y" : "N"
+        "multiValued": "Y"
       })
     }
 
@@ -259,7 +259,7 @@ function generateRuleConditions(ruleId: string) {
         "fieldName": "facilities",
         "operator": "not-in",
         "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
-        "multiValued": excludedFacilityGroupIds.length > 1 ? "Y" : "N"
+        "multiValued": "Y"
       })
     }
   } else {
@@ -271,7 +271,7 @@ function generateRuleConditions(ruleId: string) {
         "fieldName": "facilities",
         "operator": "in",
         "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
-        "multiValued": selectedFacilites.length > 1 ? "Y" : "N"
+        "multiValued": "Y"
       })
     }
   }
@@ -285,7 +285,7 @@ function generateRuleConditions(ruleId: string) {
           "fieldName": filter,
           "operator": type === "included" ? "in" : "not-in",
           "fieldValue": value.length > 1 ? value.join(",") : value[0],
-          "multiValued": value.length > 1 ? "Y" : "N"
+          "multiValued": "Y"
         })
       }
     })
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 2f80fab1..32cc3365 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -141,7 +141,7 @@ function generateRuleConditions(ruleId: string) {
       "fieldName": "facilities",
       "operator": "in",
       "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
-      "multiValued": selectedFacilites.length > 1 ? "Y" : "N"
+      "multiValued": "Y"
     })
   }
 
@@ -154,7 +154,7 @@ function generateRuleConditions(ruleId: string) {
           "fieldName": filter,
           "operator": type === "included" ? "in" : "not-in",
           "fieldValue": value.length > 1 ? value.join(",") : value[0],
-          "multiValued": value.length > 1 ? "Y" : "N"
+          "multiValued": "Y"
         })
       }
     })

From 526d55c3c01115af983bf544b7ec9e39d6c14143 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 8 May 2024 17:02:24 +0530
Subject: [PATCH 162/250] Fixed: missing systemMessageRemoteId while scheduling
 a ruleGroup on runNow action

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

diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
index 864a2858..739fcbd3 100644
--- a/src/components/ScheduleActionsPopover.vue
+++ b/src/components/ScheduleActionsPopover.vue
@@ -89,6 +89,8 @@ async function runNow() {
               const payload = {
                 ruleGroupId: ruleGroup.value.ruleGroupId,
                 paused: "Y",  // passing Y as we just need to configure the scheduler and do not need to schedule it in active state
+                // Hardcoding for now, need to fetch system message remote id for the ftp server config.
+                systemMessageRemoteId: "RemoteSftp"
               }
 
               try {

From d6640fbea3616725d36ae678ccd7ffa389bd5edb Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 9 May 2024 11:38:28 +0530
Subject: [PATCH 163/250] Improved: code to fetch inventory channels based on
 selected product store (#302)

---
 src/services/ChannelService.ts       | 2 +-
 src/store/modules/channel/actions.ts | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/services/ChannelService.ts b/src/services/ChannelService.ts
index 72812a83..da4b9500 100644
--- a/src/services/ChannelService.ts
+++ b/src/services/ChannelService.ts
@@ -2,7 +2,7 @@ import api from '@/api';
 
 const fetchInventoryChannels = async (payload: any): Promise <any>  => {
   return api({
-    url: 'facilityGroups',
+    url: `productStores/${payload.productStoreId}/facilityGroups`,
     method: "GET",
     params: payload
   });
diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index 4446eb2f..84c10e07 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -14,7 +14,7 @@ const actions: ActionTree<ChannelState, RootState> = {
     let inventoryChannels = [] as any
 
     try {
-      resp = await ChannelService.fetchInventoryChannels({ facilityGroupTypeId: "CHANNEL_FAC_GROUP" });
+      resp = await ChannelService.fetchInventoryChannels({ facilityGroupTypeId: "CHANNEL_FAC_GROUP", productStoreId: store.state.user.currentEComStore.productStoreId });
 
       if(!hasError(resp)) {
         inventoryChannels = resp?.data;

From 776952e4e1c8391cab8f210cf51623413285bcb1 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 9 May 2024 11:43:26 +0530
Subject: [PATCH 164/250] Improved: added empty state in the inventory channels
 page (#302)

---
 src/locales/en.json             |  1 +
 src/views/InventoryChannels.vue | 92 ++++++++++++++++++---------------
 2 files changed, 50 insertions(+), 43 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index c3f09cc0..f99efaae 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -121,6 +121,7 @@
   "No channel found for current product store.": "No channel found for current product store.",
   "No facility found.": "No facility found.",
   "No fulfillment capacity": "No fulfillment capacity",
+  "No inventory channel found.": "No inventory channel found.",
   "No job found.": "No job found.",
   "No jobs have run yet": "No jobs have run yet",
   "No jobs to update": "No jobs to update",
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 644f4c0c..a2872996 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -21,53 +21,59 @@
     <ion-content>
       <main>
         <section v-if="selectedSegment === 'channels'">
-          <ion-card v-for="channel in inventoryChannels" :key="channel.facilityGroupId">
-            <ion-card-header>
-              <div>
-                <ion-card-subtitle class="overline">{{ channel.facilityGroupId }}</ion-card-subtitle>
-                <ion-card-title>{{ channel.facilityGroupName }}</ion-card-title>
-                <ion-card-subtitle>{{ channel.description }}</ion-card-subtitle>
-              </div>
-            </ion-card-header>
-
-            <ion-item lines="full">
-              <ion-icon slot="start" :icon="globeOutline"/>
-              <ion-label>
-                {{ channel.selectedConfigFacility?.facilityName }}
-                <p>{{ channel.selectedConfigFacility?.facilityId }}</p>
-              </ion-label>
-              <ion-button slot="end" fill="clear" color="medium" @click="openLinkThresholdFacilitiesToGroupModal(channel)">
-                <ion-icon :icon="optionsOutline" slot="icon-only" />
-              </ion-button>
-            </ion-item>
-
-            <ion-list>
-              <ion-item-divider color="light">
-                <ion-label>{{ translate("Facilities") }}</ion-label>
-                <ion-button slot="end" fill="clear" color="medium" @click="openLinkFacilitiesToGroupModal(channel)">
+          <template v-if="inventoryChannels.length">
+            <ion-card v-for="channel in inventoryChannels" :key="channel.facilityGroupId">
+              <ion-card-header>
+                <div>
+                  <ion-card-subtitle class="overline">{{ channel.facilityGroupId }}</ion-card-subtitle>
+                  <ion-card-title>{{ channel.facilityGroupName }}</ion-card-title>
+                  <ion-card-subtitle>{{ channel.description }}</ion-card-subtitle>
+                </div>
+              </ion-card-header>
+  
+              <ion-item lines="full">
+                <ion-icon slot="start" :icon="globeOutline"/>
+                <ion-label>
+                  {{ channel.selectedConfigFacility?.facilityName }}
+                  <p>{{ channel.selectedConfigFacility?.facilityId }}</p>
+                </ion-label>
+                <ion-button slot="end" fill="clear" color="medium" @click="openLinkThresholdFacilitiesToGroupModal(channel)">
                   <ion-icon :icon="optionsOutline" slot="icon-only" />
                 </ion-button>
-              </ion-item-divider>
-
-              <ion-item>
-                <ion-icon slot="start" :icon="storefrontOutline"/>
-                <ion-label>{{ translate("retail facilities", { count: getFacilityCount(channel, "RETAIL_STORE") })}}</ion-label>
-              </ion-item>
-
-              <ion-item lines="full">
-                <ion-icon slot="start" :icon="businessOutline"/>
-                <ion-label>{{ translate("warehouse", { count: getFacilityCount(channel, "WAREHOUSE") })}}</ion-label>
               </ion-item>
   
-              <ion-item lines="none">
-                <ion-button fill="clear" size="default" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
-                <!-- Functionality is not defined for this button hence commented it for now. -->
-                <!-- <ion-button color="medium" fill="clear" slot="end">
-                  <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
-                </ion-button> -->
-              </ion-item>
-            </ion-list>
-          </ion-card>
+              <ion-list>
+                <ion-item-divider color="light">
+                  <ion-label>{{ translate("Facilities") }}</ion-label>
+                  <ion-button slot="end" fill="clear" color="medium" @click="openLinkFacilitiesToGroupModal(channel)">
+                    <ion-icon :icon="optionsOutline" slot="icon-only" />
+                  </ion-button>
+                </ion-item-divider>
+  
+                <ion-item>
+                  <ion-icon slot="start" :icon="storefrontOutline"/>
+                  <ion-label>{{ translate("retail facilities", { count: getFacilityCount(channel, "RETAIL_STORE") })}}</ion-label>
+                </ion-item>
+  
+                <ion-item lines="full">
+                  <ion-icon slot="start" :icon="businessOutline"/>
+                  <ion-label>{{ translate("warehouse", { count: getFacilityCount(channel, "WAREHOUSE") })}}</ion-label>
+                </ion-item>
+    
+                <ion-item lines="none">
+                  <ion-button fill="clear" size="default" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
+                  <!-- Functionality is not defined for this button hence commented it for now. -->
+                  <!-- <ion-button color="medium" fill="clear" slot="end">
+                    <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
+                  </ion-button> -->
+                </ion-item>
+              </ion-list>
+            </ion-card>
+          </template>
+
+          <div class="empty-state" v-else>
+            <p>{{ translate("No inventory channel found.") }}</p>
+          </div>
         </section>
  
         <section v-else-if="selectedSegment === 'publish'">

From 9be9a53fdb21b480ebbbb186fe5a634852cd4361 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 9 May 2024 11:53:07 +0530
Subject: [PATCH 165/250] Improved: code to refetch inventory channels on
 product store change using menu footer (#291)

---
 src/views/InventoryChannels.vue | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 644f4c0c..f8d183dc 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -124,7 +124,7 @@
 
 <script setup lang="ts">
 import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, popoverController } from '@ionic/vue';
-import { computed, onMounted, ref } from 'vue';
+import { computed, onMounted, onUnmounted, ref } from 'vue';
 import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@/i18n';
 import ShopActionsPopover from '@/components/ShopActionsPopover.vue'
@@ -141,11 +141,19 @@ const selectedSegment = ref("channels")
 
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
 
-onMounted(async () => {
+onMounted(async() => {
+  emitter.on("productStoreOrConfigChanged", fetchInventoryChannels);
+})
+
+onUnmounted(() => {
+  emitter.off("productStoreOrConfigChanged", fetchInventoryChannels);
+})
+
+async function fetchInventoryChannels() {
   emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch("channel/fetchInventoryChannels"), store.dispatch("util/fetchConfigFacilities")]);
   emitter.emit("dismissLoader");
-})
+}
 
 async function openShopActionsPopover(event: Event) {
   const popover = await popoverController.create({

From fbda1aa974d679faa446ab653a4dc34025a798db Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 9 May 2024 19:18:24 +0530
Subject: [PATCH 166/250] Reverted: close icon to closeOutline icon in
 timezoneModal (#287)

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

diff --git a/src/views/TimezoneModal.vue b/src/views/TimezoneModal.vue
index 6c1d2efa..e2af545f 100644
--- a/src/views/TimezoneModal.vue
+++ b/src/views/TimezoneModal.vue
@@ -3,7 +3,7 @@
     <ion-toolbar>
       <ion-buttons slot="start">
         <ion-button @click="closeModal"> 
-          <ion-icon :icon="close" />
+          <ion-icon :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
       <ion-title>{{ translate("Select time zone") }}</ion-title>
@@ -63,7 +63,7 @@ import {
   modalController,
 } from "@ionic/vue";
 import { onBeforeMount, ref } from "vue";
-import { close, saveOutline } from "ionicons/icons";
+import { closeOutline, saveOutline } from "ionicons/icons";
 import { useStore } from "@/store";
 import { UserService } from "@/services/UserService";
 import { hasError } from "@/utils"

From 7d117832cfb6e5a3453c037beba4e8efe4be0a4a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 9 May 2024 19:52:02 +0530
Subject: [PATCH 167/250] Improved: getterName for reorderActive status, fixed
 missing quotes and parameter name (#282)

---
 src/components/RuleItem.vue              | 4 ++--
 src/components/ScheduleRuleItem.vue      | 2 +-
 src/store/modules/rule/actions.ts        | 2 +-
 src/store/modules/rule/getters.ts        | 2 +-
 src/store/modules/rule/mutation-types.ts | 2 +-
 src/store/modules/rule/mutations.ts      | 2 +-
 src/utils/index.ts                       | 2 +-
 src/views/SafetyStock.vue                | 2 +-
 src/views/Shipping.vue                   | 2 +-
 src/views/StorePickup.vue                | 2 +-
 src/views/Threshold.vue                  | 2 +-
 11 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 11e4b1d9..d24fcb0b 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -8,7 +8,7 @@
             <ion-card-title>{{ rule.ruleName }}</ion-card-title>
             <ion-card-subtitle>{{ ruleIndex+1 }}/{{ total }}</ion-card-subtitle>
           </div>
-          <ion-item v-if="isReorderActive" lines=none>
+          <ion-item v-if="isReorderActive" lines="none">
             <ion-reorder slot="end"></ion-reorder>
           </ion-item>
         </ion-card-header>
@@ -134,7 +134,7 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 const rules = computed(() => store.getters["rule/getRules"]);
-const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 
 const selectedPage = ref({
   path: '',
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index c5e2241f..83cb1227 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -48,7 +48,7 @@ import emitter from '@/event-bus';
 
 const store = useStore();
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
-const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 
 const cronExpressions = JSON.parse(process.env?.VUE_APP_CRON_EXPRESSIONS as string)
 
diff --git a/src/store/modules/rule/actions.ts b/src/store/modules/rule/actions.ts
index 7e5f8b59..0e0395a7 100644
--- a/src/store/modules/rule/actions.ts
+++ b/src/store/modules/rule/actions.ts
@@ -110,7 +110,7 @@ const actions: ActionTree<RuleState, RootState> = {
   },
 
   async updateIsReorderActive({ commit }, payload) {
-    commit(types.RULE_IS_REORDER_ACTIVE_UPDATED, payload)
+    commit(types.RULE_REORDER_ACTIVE_UPDATED, payload)
   },
 }
 
diff --git a/src/store/modules/rule/getters.ts b/src/store/modules/rule/getters.ts
index 375132ad..818858f4 100644
--- a/src/store/modules/rule/getters.ts
+++ b/src/store/modules/rule/getters.ts
@@ -12,7 +12,7 @@ const getters: GetterTree <RuleState, RootState> = {
   getRuleGroup (state) {
     return state.ruleGroup
   },
-  getIsReorderActive (state) {
+  isReorderActive (state) {
     return state.isReorderActive
   }
 }
diff --git a/src/store/modules/rule/mutation-types.ts b/src/store/modules/rule/mutation-types.ts
index 2e9c626b..10dd7d65 100644
--- a/src/store/modules/rule/mutation-types.ts
+++ b/src/store/modules/rule/mutation-types.ts
@@ -1,5 +1,5 @@
 export const SN_RULE = 'rule'
 export const RULE_RULES_UPDATED = SN_RULE + '/RULES_UPDATED'
 export const RULE_GROUP_UPDATED = SN_RULE + '/GROUP_UPDATED'
-export const RULE_IS_REORDER_ACTIVE_UPDATED = SN_RULE + '/IS_REORDER_ACTIVE_UPDATED'
+export const RULE_REORDER_ACTIVE_UPDATED = SN_RULE + '/REORDER_ACTIVE_UPDATED'
 export const RULE_CLEARED = SN_RULE + "/CLEARED"
\ No newline at end of file
diff --git a/src/store/modules/rule/mutations.ts b/src/store/modules/rule/mutations.ts
index f3395bf1..49cbfc23 100644
--- a/src/store/modules/rule/mutations.ts
+++ b/src/store/modules/rule/mutations.ts
@@ -10,7 +10,7 @@ const mutations: MutationTree <RuleState> = {
   [types.RULE_GROUP_UPDATED] (state, payload) {
     state.ruleGroup = payload;
   },
-  [types.RULE_IS_REORDER_ACTIVE_UPDATED] (state, payload) {
+  [types.RULE_REORDER_ACTIVE_UPDATED] (state, payload) {
     state.isReorderActive = payload;
   },
   [types.RULE_CLEARED](state) {
diff --git a/src/utils/index.ts b/src/utils/index.ts
index d8c97e4b..65cde066 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -47,7 +47,7 @@ const doReorder = (event: CustomEvent, rules: any) => {
 
   let diffSeq = findRulesDiff(previousSeq, updatedSeq)
 
-  const updatedSeqenceNum = previousSeq.map((rejectionReason: any) => rejectionReason.sequenceNum)
+  const updatedSeqenceNum = previousSeq.map((rule: any) => rule.sequenceNum)
   Object.keys(diffSeq).map((key: any) => {
     diffSeq[key].sequenceNum = updatedSeqenceNum[key]
   })
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index d007de47..e48e4f85 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -52,7 +52,7 @@ const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
-const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 const reorderingRules = ref([]);
 
 onIonViewWillEnter(async() => {
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index e04fb6f4..fadc3510 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -87,7 +87,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
-const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 const reorderingRules = ref([]);
 
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY")
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index a14aa7e0..dae10ea3 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -87,7 +87,7 @@ const router = useRouter()
 const rules = computed(() => store.getters["rule/getRules"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
-const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 const reorderingRules = ref([]);
 
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY")
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 3a509ce2..79606ffd 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -52,7 +52,7 @@ const router = useRouter()
 
 const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
-const isReorderActive = computed(() => store.getters["rule/getIsReorderActive"]);
+const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 const reorderingRules = ref([]);
 
 onIonViewWillEnter(async() => {

From 16777057474310579b77cdb03988f2c51fe9fff1 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 10 May 2024 10:38:34 +0530
Subject: [PATCH 168/250] Fixed: ion-segment not coming in line with page title
 in inventory-channnels page (#305)

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

diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 385f865f..6e929b63 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -219,4 +219,8 @@ ion-card-header {
   justify-content: space-between;
   align-items: center;
 }
+
+ion-header {
+  display: flex;
+}
 </style>
\ No newline at end of file

From 4ce9e86e29b2f2ee0c739052cad850d824f12f9a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 10 May 2024 10:58:27 +0530
Subject: [PATCH 169/250] Fixed: inventory channels not fetching on page
 refresh (#305)

---
 src/views/InventoryChannels.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 6e929b63..b31cecb4 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -148,6 +148,7 @@ const selectedSegment = ref("channels")
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
 
 onMounted(async() => {
+  fetchInventoryChannels()
   emitter.on("productStoreOrConfigChanged", fetchInventoryChannels);
 })
 

From b11fe1a7f7b148008b3d1d16a38599bd5cd26d12 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 10 May 2024 14:50:28 +0530
Subject: [PATCH 170/250] Fixed: backspace not working on threshold value input
 (#291)

---
 src/components/RuleItem.vue         | 2 +-
 src/views/CreateSafetyStockRule.vue | 2 +-
 src/views/CreateThresholdRule.vue   | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 9d891a46..7c78e88d 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -216,7 +216,7 @@ async function editSafetyStock() {
       attributes: {
         // Added check to not allow mainly .(period) and other special characters to be entered in the alert input
         onkeydown: ($event: any) => {
-          if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test($event.key)) $event.preventDefault();
+          if(/[`!@#$%^&*()_+\-=\\|,.<>?~e]/.test($event.key) && event.key !== 'Backspace') $event.preventDefault();
         }
       }
     }],
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index a231add3..73914281 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -248,7 +248,7 @@ async function createRule() {
 }
 
 function validateSafetyStock(event: any) {
-  if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test(event.key)) event.preventDefault();
+  if(/[`!@#$%^&*()_+\-=\\|,.<>?~e]/.test(event.key) && event.key !== 'Backspace') event.preventDefault();
 }
 
 function removeFacilityGroups(facilityGroupId: any, type: string) {
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 921df91f..821ef6e1 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -228,7 +228,7 @@ async function createThresholdRule() {
 }
 
 function validateThreshold(event: any) {
-  if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test(event.key)) event.preventDefault();
+  if(/[`!@#$%^&*()_+\-=\\|,.<>?~e]/.test(event.key) && event.key !== 'Backspace') event.preventDefault();
 }
 </script>
 

From a77548e2fb3fe804cc0eaa571377126bb7634e84 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 10 May 2024 15:10:32 +0530
Subject: [PATCH 171/250] Improved: css for the ion-segment in header (#305)

---
 src/theme/variables.css         |  4 ++++
 src/views/InventoryChannels.vue | 10 ++--------
 src/views/Shipping.vue          | 12 ++----------
 src/views/StorePickup.vue       | 12 ++----------
 4 files changed, 10 insertions(+), 28 deletions(-)

diff --git a/src/theme/variables.css b/src/theme/variables.css
index dcc2be80..080360a6 100644
--- a/src/theme/variables.css
+++ b/src/theme/variables.css
@@ -344,6 +344,10 @@ ion-content>section {
   text-align: center; 
 }
 
+ion-toolbar > ion-segment {
+  width: unset;
+}
+
 @media (min-width: 700px) {
   main {
     max-width: 375px;
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index b31cecb4..69944c65 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -3,11 +3,9 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-menu-button slot="start" />
-        <ion-title>{{ translate("Inventory channels") }}</ion-title>
-      </ion-toolbar>
+        <ion-title slot="start">{{ translate("Inventory channels") }}</ion-title>
 
-      <ion-toolbar>
-        <ion-segment v-model="selectedSegment">
+        <ion-segment v-model="selectedSegment" slot="end">
           <ion-segment-button value="channels">
             <ion-label>{{ translate("Channels") }}</ion-label>
           </ion-segment-button>
@@ -220,8 +218,4 @@ ion-card-header {
   justify-content: space-between;
   align-items: center;
 }
-
-ion-header {
-  display: flex;
-}
 </style>
\ No newline at end of file
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 063cee9c..1e9e0e89 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -4,10 +4,8 @@
       <ion-toolbar>
         <ion-menu-button slot="start" />
         <ion-title>{{ translate("Shipping") }}</ion-title>
-      </ion-toolbar>
 
-      <ion-toolbar>
-        <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()">
+        <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()" slot="end">
           <ion-segment-button value="RG_SHIPPING_FACILITY">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
@@ -156,10 +154,4 @@ async function updateRuleGroup() {
 function createShipping() {
   router.push({ path: '/create-shipping', query: { groupTypeEnumId: selectedSegment.value } })
 }
-</script>
-
-<style scoped>
-  ion-header {
-    display: flex;
-  }
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index fa048048..bd2ffa35 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -4,10 +4,8 @@
       <ion-toolbar>
         <ion-menu-button slot="start" />
         <ion-title>{{ translate("Store pickup") }}</ion-title>
-      </ion-toolbar>
 
-      <ion-toolbar>
-        <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()">
+        <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()" slot="end">
           <ion-segment-button value="RG_PICKUP_FACILITY">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
@@ -157,10 +155,4 @@ async function updateRuleGroup() {
 function createStorePickup() {
   router.push({ path: '/create-store-pickup', query: { groupTypeEnumId: selectedSegment.value } })
 }
-</script>
-
-<style scoped>
-  ion-header {
-    display: flex;
-  }
-</style>
\ No newline at end of file
+</script>
\ No newline at end of file

From bf6bddef2b26710164dfe8ac84aeb51a9254ce2d Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 13 May 2024 12:12:00 +0530
Subject: [PATCH 172/250] Improved: creation and updation logic for the
 threshold rule(#308)

---
 src/components/RuleItem.vue       |  18 ++-
 src/router/index.ts               |  28 +++++
 src/views/CreateThresholdRule.vue | 179 ++++++++++++++++++++++--------
 3 files changed, 177 insertions(+), 48 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 7c78e88d..b4e48dde 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -101,7 +101,8 @@
       </ion-item>
 
       <ion-item lines="none">
-        <ion-button @click="editRuleName()" size="default" fill="clear">{{ translate("Edit name") }}</ion-button>
+        <!-- <ion-button @click="editRuleName()" size="default" fill="clear">{{ translate("Edit name") }}</ion-button> -->
+        <ion-button @click="editRule()" size="default" fill="clear">{{ translate("Edit rule") }}</ion-button>
         <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
           <ion-icon :icon="archiveOutline" slot="icon-only"/>
         </ion-button>
@@ -503,6 +504,21 @@ function findRulesDiff(previousSeq: any, updatedSeq: any) {
   }, {})
   return diffSeq;
 }
+
+function editRule() {
+  let path = ""
+  if(selectedPage.value.path === "/threshold") {
+    path = `update-threshold/${props.rule.ruleId}`
+  } else if(selectedPage.value.path === "/safety-stock") {
+    path = `update-safety-stock/${props.rule.ruleId}`
+  } else if(selectedPage.value.path === "/store-pickup") {
+    path = `update-store-pickup/${props.rule.ruleId}`
+  } else if(selectedPage.value.path === "/shipping") {
+    path = `update-shipping/${props.rule.ruleId}`
+  }
+
+  router.push(path);
+}
 </script>
 
 <style scoped>
diff --git a/src/router/index.ts b/src/router/index.ts
index 06975b11..cecd130e 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -98,6 +98,34 @@ const routes: Array<RouteRecordRaw> = [
     component: CreateShippingRule,
     beforeEnter: authGuard
   },
+  {
+    path: '/update-threshold/:ruleId',
+    name: 'Update threshold',
+    component: CreateThresholdRule,
+    beforeEnter: authGuard,
+    props: true
+  },
+  {
+    path: '/update-safety-stock/:ruleId',
+    name: 'Update safety stock',
+    component: CreateSafetyStockRule,
+    beforeEnter: authGuard,
+    props: true
+  },
+  {
+    path: '/update-store-pickup/:ruleId',
+    name: 'Update store pickup',
+    component: CreateStorePickupRule,
+    beforeEnter: authGuard,
+    props: true
+  },
+  {
+    path: '/update-shipping/:ruleId',
+    name: 'Update shipping',
+    component: CreateShippingRule,
+    beforeEnter: authGuard,
+    props: true
+  },
   {
     path: '/login',
     name: 'DxpLogin',
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 821ef6e1..8a2dc82a 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/threshold" />
-        <ion-title>{{ translate("New threshold rule") }}</ion-title>
+        <ion-title>{{ currentRule.ruleId ? translate("Update threshold rule") : translate("New threshold rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
@@ -53,7 +53,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createThresholdRule()">
+      <ion-fab-button @click="currentRule.ruleId? updateRule() : createThresholdRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -80,15 +80,16 @@ import {
   IonText,
   IonTitle,
   IonToolbar,
-  onIonViewWillLeave
+  onIonViewWillLeave,
+onIonViewWillEnter
 } from '@ionic/vue';
 import { saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
-import { computed, onMounted, ref } from 'vue';
+import { computed, defineProps, onMounted, ref } from 'vue';
 import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
-import { showToast } from '@/utils';
+import { hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import router from '@/router';
 import emitter from '@/event-bus';
@@ -99,6 +100,9 @@ const formData = ref({
   threshold: '',
   selectedConfigFacilites: []
 }) as any;
+const currentRule = ref({}) as any;
+
+const props = defineProps(["ruleId"]);
 
 onIonViewWillLeave(() => {
   formData.value = {
@@ -106,6 +110,7 @@ onIonViewWillLeave(() => {
     threshold: '',
     selectedConfigFacilites: []
   }
+  store.dispatch("util/clearAppliedFilters")
 })
 
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
@@ -114,8 +119,41 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
-onMounted(async () => {
+onIonViewWillEnter(async () => {
   await store.dispatch("util/fetchConfigFacilities");
+  if(props.ruleId) {
+    try {
+      const resp = await RuleService.fetchRules({ ruleId: props.ruleId })
+
+      if(!hasError(resp)) {
+        currentRule.value = resp.data[0];
+
+        formData.value.ruleName = currentRule.value.ruleName;
+        formData.value.threshold = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
+
+        const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
+        formData.value.selectedConfigFacilites = facilityCondition.fieldValue?.split(",");
+
+        const currentAppliedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
+        currentRule.value.ruleConditions.map((condition: any) => {
+          if(condition.conditionTypeEnumId === "ENTCT_ATP_FILTER") {
+            if(condition.operator === "in") {
+              currentAppliedFilters["included"][condition.fieldName] = condition.fieldValue.split(",")
+            } else {
+              currentAppliedFilters["excluded"][condition.fieldName] = condition.fieldValue.split(",")
+            }
+          }
+        })
+        await store.dispatch('util/updateAppliedFilters', currentAppliedFilters)
+
+        console.log(generateRuleConditions(props.ruleId))
+      } else {
+        throw resp.data
+      }
+    } catch(err: any) {
+      logger.error(err);
+    }
+  }
 })
 
 function toggleFacilitySelection(facilityId: any) {
@@ -131,62 +169,75 @@ function isFacilitySelected(facilityId: any) {
 }
 
 function generateRuleActions(ruleId: string) {
+  if(currentRule.value.ruleId) {
+    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "ATP_THRESHOLD")
+    if(ruleAction) {
+      ruleAction.fieldValue = formData.value.threshold ? formData.value.threshold : 0;
+      return [ruleAction];
+    }
+  }
+
   return [{
     "ruleId": ruleId,
     "actionTypeEnumId": "ATP_THRESHOLD",
     "fieldName": "facility-safety-stock",
-    "fieldValue": formData.value.threshold
+    "fieldValue": formData.value.threhold ? formData.value.threhold : 0
   }]
 }
 
 function generateRuleConditions(ruleId: string) {
-  const conditions = [];
-  
-  const selectedFacilites = formData.value.selectedConfigFacilites
-  if(selectedFacilites?.length) {
-    conditions.push({
-      "ruleId": ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
-      "fieldName": "facilities",
-      "operator": "in",
-      "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
-      "multiValued": "Y"
-    })
-  }
+  if(currentRule.value.ruleId) {
+    const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
 
-  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-    Object.entries(filters as any).map(([filter, value]: any) => {
-      if(value.length) {
-        conditions.push({
-          "ruleId": ruleId,
-          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-          "fieldName": filter,
-          "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.length > 1 ? value.join(",") : value[0],
-          "multiValued": "Y"
-        })
-      }
+    const facilityCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES");
+    if(facilityCondition) facilityCondition.fieldValue = formData.value.selectedConfigFacilites.join(",");
+
+    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+      Object.entries(filters as any).map(([filter, value]: any) => {
+        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.operator === (type === "included" ? "in" : "not-in"))
+        if(condition) {
+          condition.fieldValue = value.join(",")
+        }
+      })
     })
-  })
 
-  return conditions;
-}
+    return ruleConditions;
+  } else {
+    const conditions = [];
 
-async function createThresholdRule() {
-  if(!formData.value.ruleName.trim() || !formData.value.threshold) {
-    showToast(translate("Please fill in all the required fields."))
-    return;
-  }
+    const selectedFacilites = formData.value.selectedConfigFacilites
+    if(selectedFacilites?.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
+        "fieldName": "facilities",
+        "operator": "in",
+        "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
+        "multiValued": "Y"
+      })
+    }
 
-  if(formData.value.threshold < 0){
-    showToast(translate("Threshold should be greater than or equal to 0."))
-    return;
-  }
+    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+      Object.entries(filters as any).map(([filter, value]: any) => {
+        if(value.length) {
+          conditions.push({
+            "ruleId": ruleId,
+            "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+            "fieldName": filter,
+            "operator": type === "included" ? "in" : "not-in",
+            "fieldValue": value.length ? value.join(",") : "",
+            "multiValued": "Y"
+          })
+        }
+      })
+    })
 
-  if(!formData.value.selectedConfigFacilites.length) {
-    showToast(translate("Please select atleast one config facility."))
-    return;
+    return conditions;
   }
+}
+
+async function createThresholdRule() {
+  validateRule();
 
   emitter.emit("presentLoader");
 
@@ -227,6 +278,40 @@ async function createThresholdRule() {
   emitter.emit("dismissLoader");
 }
 
+async function updateRule() {
+  validateRule()
+  
+  try {
+    await RuleService.updateRule({
+      ...currentRule.value,
+      "ruleName": formData.value.ruleName,
+      "ruleConditions": generateRuleConditions(props.ruleId),
+      "ruleActions": generateRuleActions(props.ruleId)
+    }, props.ruleId);
+    showToast(translate("Rule updated successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
+    router.push("/threshold");
+  } catch(err: any) {
+    logger.error(err);
+  }
+}
+
+function validateRule() {
+  if(!formData.value.ruleName.trim() || !formData.value.threshold) {
+    showToast(translate("Please fill in all the required fields."))
+    return;
+  }
+  if(formData.value.threshold < 0){
+    showToast(translate("Threshold should be greater than or equal to 0."))
+    return;
+  }
+  if(!formData.value.selectedConfigFacilites.length) {
+    showToast(translate("Please select atleast one config facility."))
+    return;
+  }
+}
+
 function validateThreshold(event: any) {
   if(/[`!@#$%^&*()_+\-=\\|,.<>?~e]/.test(event.key) && event.key !== 'Backspace') event.preventDefault();
 }

From 806caa68f96f97a3b58d7ee4f628e97404f872af Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 13 May 2024 12:40:01 +0530
Subject: [PATCH 173/250] Improved: logic to not use persisted facilityGroups
 (#310)

---
 src/store/modules/util/actions.ts | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index dd3ed198..97a09e3a 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -10,7 +10,7 @@ import { DateTime } from 'luxon'
 
 
 const actions: ActionTree<UtilState, RootState> = {
-  async fetchConfigFacilities ({ commit, state }) {
+  async fetchConfigFacilities ({ commit }) {
     let configFacilities = [];
 
     try {
@@ -27,10 +27,9 @@ const actions: ActionTree<UtilState, RootState> = {
     commit(types.UTIL_CONFIG_FACILITES_UPDATED, configFacilities)
   },
 
-  async fetchFacilityGroups ({ commit, state }) {
-    let facilityGroups = JSON.parse(JSON.stringify(state.facilityGroups))
+  async fetchFacilityGroups ({ commit }) {
+    let facilityGroups = {};
 
-    if(facilityGroups.length && facilityGroups[0].productStoreId === store.state.user.currentEComStore.productStoreId) return;
     try {
       const resp = await UtilService.fetchFacilityGroups({ productStoreId: store.state.user.currentEComStore.productStoreId, pageSize: 100 });
 

From 3cb61b88a78e42fda4a8298cde9a7f54c72f7d8b Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 13 May 2024 12:46:02 +0530
Subject: [PATCH 174/250] Improved: empty state messages for consistency (#287)

---
 src/locales/en.json       | 8 ++++----
 src/views/SafetyStock.vue | 2 +-
 src/views/Shipping.vue    | 2 +-
 src/views/StorePickup.vue | 2 +-
 src/views/Threshold.vue   | 2 +-
 5 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 6736b0db..b0cac602 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -133,11 +133,11 @@
   "No previous occurrence": "No previous occurrence",
   "No result found for": "No result found for {label}",
   "No rules found, redirecting to product page": "No rules found, redirecting to product page",
-  "No safety stock rules found": "No safety stock rules found",
-  "No shipping rules found": "No shipping rules found",
-  "No store pickup rules found": "No store pickup rules found",
+  "No safety stock rule found.": "No safety stock rule found.",
+  "No shipping rule found.": "No shipping rules found.",
+  "No store pickup rule found.": "No store pickup rule found.",
   "No threshold rule found. Invalid job": "No threshold rule found. Invalid job",
-  "No threshold rules found": "No threshold rules found",
+  "No threshold rule found.": "No threshold rule found.",
   "No time zone found": "No time zone found",
   "OMS instance": "OMS instance",
   "Only show selected products": "Only show selected products",
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 9aa25a13..798660b9 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -17,7 +17,7 @@
       </main>
 
       <div class="empty-state" v-else>
-       <p>{{ translate("No safety stock rules found") }}</p>
+       <p>{{ translate("No safety stock rule found.") }}</p>
       </div>
     </ion-content>
 
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 1e9e0e89..702a366a 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -29,7 +29,7 @@
           </section>
         </template>
         <div v-else class="empty-state">
-          <p>{{ translate("No shipping rules found") }}</p>
+          <p>{{ translate("No shipping rule found.") }}</p>
         </div>
       </main>
       <main v-else>
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index bd2ffa35..8b641063 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -29,7 +29,7 @@
           </section>
         </template>
         <div class="empty-state" v-else>
-          <p>{{ translate("No store pickup rules found") }}</p>
+          <p>{{ translate("No store pickup rule found.") }}</p>
         </div>
       </main>
       <main v-else>
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index b644c7d6..9135394d 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -17,7 +17,7 @@
       </main>
 
       <div class="empty-state" v-else>
-       <p>{{ translate("No threshold rules found") }}</p>
+       <p>{{ translate("No threshold rule found.") }}</p>
       </div>
 
       <ion-fab vertical="bottom" horizontal="end" slot="fixed">

From ba61ad1c518acf4053c57e2ed989ba23bb0abb42 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 13 May 2024 14:45:41 +0530
Subject: [PATCH 175/250] Improved: logic for updating threshold rule (#308)

---
 src/views/CreateThresholdRule.vue | 91 +++++++++++++++----------------
 1 file changed, 45 insertions(+), 46 deletions(-)

diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 8a2dc82a..555e589a 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -138,15 +138,14 @@ onIonViewWillEnter(async () => {
         currentRule.value.ruleConditions.map((condition: any) => {
           if(condition.conditionTypeEnumId === "ENTCT_ATP_FILTER") {
             if(condition.operator === "in") {
-              currentAppliedFilters["included"][condition.fieldName] = condition.fieldValue.split(",")
+              currentAppliedFilters["included"][condition.fieldName] = condition.fieldValue ? condition.fieldValue.split(",") : []
             } else {
-              currentAppliedFilters["excluded"][condition.fieldName] = condition.fieldValue.split(",")
+              currentAppliedFilters["excluded"][condition.fieldName] = condition.fieldValue ? condition.fieldValue.split(",") : []
             }
           }
         })
-        await store.dispatch('util/updateAppliedFilters', currentAppliedFilters)
 
-        console.log(generateRuleConditions(props.ruleId))
+        await store.dispatch('util/updateAppliedFilters', currentAppliedFilters)
       } else {
         throw resp.data
       }
@@ -181,7 +180,7 @@ function generateRuleActions(ruleId: string) {
     "ruleId": ruleId,
     "actionTypeEnumId": "ATP_THRESHOLD",
     "fieldName": "facility-safety-stock",
-    "fieldValue": formData.value.threhold ? formData.value.threhold : 0
+    "fieldValue": formData.value.threshold ? formData.value.threshold : 0
   }]
 }
 
@@ -194,7 +193,7 @@ function generateRuleConditions(ruleId: string) {
 
     Object.entries(appliedFilters.value).map(([type, filters]: any) => {
       Object.entries(filters as any).map(([filter, value]: any) => {
-        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.operator === (type === "included" ? "in" : "not-in"))
+        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
         if(condition) {
           condition.fieldValue = value.join(",")
         }
@@ -206,29 +205,25 @@ function generateRuleConditions(ruleId: string) {
     const conditions = [];
 
     const selectedFacilites = formData.value.selectedConfigFacilites
-    if(selectedFacilites?.length) {
-      conditions.push({
-        "ruleId": ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
-        "fieldName": "facilities",
-        "operator": "in",
-        "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
-        "multiValued": "Y"
-      })
-    }
+    conditions.push({
+      "ruleId": ruleId,
+      "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
+      "fieldName": "facilities",
+      "operator": "in",
+      "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
+      "multiValued": "Y"
+    })
 
     Object.entries(appliedFilters.value).map(([type, filters]: any) => {
       Object.entries(filters as any).map(([filter, value]: any) => {
-        if(value.length) {
-          conditions.push({
-            "ruleId": ruleId,
-            "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-            "fieldName": filter,
-            "operator": type === "included" ? "in" : "not-in",
-            "fieldValue": value.length ? value.join(",") : "",
-            "multiValued": "Y"
-          })
-        }
+        conditions.push({
+          "ruleId": ruleId,
+          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+          "fieldName": filter,
+          "operator": type === "included" ? "in" : "not-in",
+          "fieldValue": value.length ? value.join(",") : "",
+          "multiValued": "Y"
+        })
       })
     })
 
@@ -237,7 +232,7 @@ function generateRuleConditions(ruleId: string) {
 }
 
 async function createThresholdRule() {
-  validateRule();
+  if(!isRuleValid()) return;
 
   emitter.emit("presentLoader");
 
@@ -279,37 +274,41 @@ async function createThresholdRule() {
 }
 
 async function updateRule() {
-  validateRule()
+  if(!isRuleValid()) return;
+
+  console.log(generateRuleConditions(props.ruleId));
   
-  try {
-    await RuleService.updateRule({
-      ...currentRule.value,
-      "ruleName": formData.value.ruleName,
-      "ruleConditions": generateRuleConditions(props.ruleId),
-      "ruleActions": generateRuleActions(props.ruleId)
-    }, props.ruleId);
-    showToast(translate("Rule updated successfully."))
-    store.dispatch("rule/clearRuleState")
-    store.dispatch("util/clearAppliedFilters")
-    router.push("/threshold");
-  } catch(err: any) {
-    logger.error(err);
-  }
+  
+  // try {
+  //   await RuleService.updateRule({
+  //     ...currentRule.value,
+  //     "ruleName": formData.value.ruleName,
+  //     "ruleConditions": generateRuleConditions(props.ruleId),
+  //     "ruleActions": generateRuleActions(props.ruleId)
+  //   }, props.ruleId);
+  //   showToast(translate("Rule updated successfully."))
+  //   store.dispatch("rule/clearRuleState")
+  //   store.dispatch("util/clearAppliedFilters")
+  //   router.push("/threshold");
+  // } catch(err: any) {
+  //   logger.error(err);
+  // }
 }
 
-function validateRule() {
+function isRuleValid() {
   if(!formData.value.ruleName.trim() || !formData.value.threshold) {
     showToast(translate("Please fill in all the required fields."))
-    return;
+    return false;
   }
   if(formData.value.threshold < 0){
     showToast(translate("Threshold should be greater than or equal to 0."))
-    return;
+    return false;
   }
   if(!formData.value.selectedConfigFacilites.length) {
     showToast(translate("Please select atleast one config facility."))
-    return;
+    return false;
   }
+  return true
 }
 
 function validateThreshold(event: any) {

From 84523f090db7eb87d44d998ee0c2e7124d8e0c6a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 13 May 2024 15:47:55 +0530
Subject: [PATCH 176/250] Improved: logic for updating threshold rule (#308)

---
 src/locales/en.json               |  1 +
 src/views/CreateThresholdRule.vue | 35 ++++++++++++++-----------------
 2 files changed, 17 insertions(+), 19 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 6736b0db..22b06a3c 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -180,6 +180,7 @@
   "Rule group disabled successfully.": "Rule group disabled successfully.",
   "rule name": "rule name",
   "Rule name can't be empty.": "Rule name can't be empty.",
+  "Rule updated successfully.": "Rule updated successfully.",
   "Rules order has been updated successfully.": "Rules order has been updated successfully.",
   "Run now": "Run now",
   "running": "running",
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 555e589a..58c62d29 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -189,13 +189,13 @@ function generateRuleConditions(ruleId: string) {
     const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
 
     const facilityCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES");
-    if(facilityCondition) facilityCondition.fieldValue = formData.value.selectedConfigFacilites.join(",");
+    if(facilityCondition) facilityCondition["fieldValue"] = formData.value.selectedConfigFacilites.join(",");
 
     Object.entries(appliedFilters.value).map(([type, filters]: any) => {
       Object.entries(filters as any).map(([filter, value]: any) => {
         const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
         if(condition) {
-          condition.fieldValue = value.join(",")
+          condition["fieldValue"] = value.length ? value.join(",") : ""
         }
       })
     })
@@ -276,23 +276,20 @@ async function createThresholdRule() {
 async function updateRule() {
   if(!isRuleValid()) return;
 
-  console.log(generateRuleConditions(props.ruleId));
-  
-  
-  // try {
-  //   await RuleService.updateRule({
-  //     ...currentRule.value,
-  //     "ruleName": formData.value.ruleName,
-  //     "ruleConditions": generateRuleConditions(props.ruleId),
-  //     "ruleActions": generateRuleActions(props.ruleId)
-  //   }, props.ruleId);
-  //   showToast(translate("Rule updated successfully."))
-  //   store.dispatch("rule/clearRuleState")
-  //   store.dispatch("util/clearAppliedFilters")
-  //   router.push("/threshold");
-  // } catch(err: any) {
-  //   logger.error(err);
-  // }
+  try {
+    await RuleService.updateRule({
+      ...currentRule.value,
+      "ruleName": formData.value.ruleName,
+      "ruleConditions": generateRuleConditions(props.ruleId),
+      "ruleActions": generateRuleActions(props.ruleId)
+    }, props.ruleId);
+    showToast(translate("Rule updated successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
+    router.push("/threshold");
+  } catch(err: any) {
+    logger.error(err);
+  }
 }
 
 function isRuleValid() {

From 920cb70834c6a520ed50dd9d3566cdbf62212cbc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 13 May 2024 16:47:18 +0530
Subject: [PATCH 177/250] Improved: logic for updating safety-stock rule (#308)

---
 src/locales/en.json                 |   1 +
 src/views/CreateSafetyStockRule.vue | 160 ++++++++++++++++++++++------
 src/views/CreateThresholdRule.vue   |   1 -
 3 files changed, 127 insertions(+), 35 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 22b06a3c..d29ec930 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -265,6 +265,7 @@
   "Unlimited Capacity": "Unlimited Capacity",
   "Unlimited fulfillment capacity": "Unlimited fulfillment capacity",
   "Unlimited capacity removes the fulfillment capacity limit entirely. To add a fulfillment capacity to this facility, use the custom option.": "Unlimited capacity removes the fulfillment capacity limit entirely. To add a fulfillment capacity to this facility, use the custom option.",
+  "Update safety stock rule": "Update safety stock rule",
   "Upload": "Upload",
   "Upload CSV": "Upload CSV",
   "Username": "Username",
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 73914281..b9f07677 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/safety-stock" />
-        <ion-title>{{ translate("New safety stock rule") }}</ion-title>
+        <ion-title>{{ currentRule.ruleId ? translate("Update safety stock rule") : translate("New safety stock rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
@@ -73,7 +73,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createRule()">
+      <ion-fab-button @click="currentRule.ruleId ? updateRule() : createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -81,17 +81,17 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonText, IonTitle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonText, IonTitle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
-import { computed, onMounted, ref } from 'vue';
+import { computed, defineProps, ref } from 'vue';
 import { useStore } from 'vuex';
 import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
 import { RuleService } from '@/services/RuleService';
 import { useRouter } from 'vue-router';
 import logger from '@/logger';
-import { showToast } from '@/utils';
+import { hasError, showToast } from '@/utils';
 import emitter from '@/event-bus';
 
 const router = useRouter();
@@ -105,14 +105,55 @@ const formData = ref({
     excluded: []
   }
 }) as any;
+const currentRule = ref({}) as any;
+const props = defineProps(["ruleId"]);
 
 const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
 const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
-onMounted(async () => {
-  await Promise.allSettled([store.dispatch("util/clearAppliedFilters"), store.dispatch("util/fetchFacilityGroups")])
+onIonViewWillEnter(async () => {
+  await store.dispatch("util/fetchFacilityGroups");
+
+  if(props.ruleId) {
+    try {
+      const resp = await RuleService.fetchRules({ ruleId: props.ruleId })
+
+      if(!hasError(resp)) {
+        currentRule.value = resp.data[0];
+
+        formData.value.ruleName = currentRule.value.ruleName;
+        formData.value.safetyStock = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
+
+        const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
+        const includedGroupIds = includedGroups.fieldValue ? includedGroups.fieldValue.split(",") : []
+        formData.value.selectedFacilityGroups.included = facilityGroups.value.filter((group: any) => includedGroupIds.includes(group.facilityGroupId));
+        
+        const excludedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in")
+        const excludedGroupIds = excludedGroups.fieldValue ? excludedGroups.fieldValue.split(",") : []
+        formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
+
+        const currentAppliedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
+        currentRule.value.ruleConditions.map((condition: any) => {
+          if(condition.conditionTypeEnumId === "ENTCT_ATP_FILTER") {
+            if(condition.operator === "in") {
+              currentAppliedFilters["included"][condition.fieldName] = condition.fieldValue ? condition.fieldValue.split(",") : []
+            } else {
+              currentAppliedFilters["excluded"][condition.fieldName] = condition.fieldValue ? condition.fieldValue.split(",") : []
+            }
+          }
+        })
+
+        await store.dispatch('util/updateAppliedFilters', currentAppliedFilters)
+      } else {
+        throw resp.data
+      }
+    } catch(err: any) {
+      logger.error(err);
+    }
+  }
 })
 
 onIonViewWillLeave(() => {
@@ -124,6 +165,7 @@ onIonViewWillLeave(() => {
       excluded: []
     }
   }
+  store.dispatch("util/clearAppliedFilters")
 })
 
 async function openProductFacilityGroupModal(type: string) {
@@ -145,6 +187,14 @@ async function openProductFacilityGroupModal(type: string) {
 }
 
 function generateRuleActions(ruleId: string) {
+  if(currentRule.value.ruleId) {
+    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "ATP_SAFETY_STOCK")
+    if(ruleAction) {
+      ruleAction.fieldValue = formData.value.safetyStock ? formData.value.safetyStock : 0;
+      return [ruleAction];
+    }
+  }
+
   return [{
     "ruleId": ruleId,
     "actionTypeEnumId": "ATP_SAFETY_STOCK",
@@ -154,60 +204,69 @@ function generateRuleActions(ruleId: string) {
 }
 
 function generateRuleConditions(ruleId: string) {
-  const conditions = [];
+  if(currentRule.value.ruleId) {
+    const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
+
+    const includedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in");
+    const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId);
+    if(includedFacilityGroupIds.length) includedCondition["fieldValue"] = includedFacilityGroupIds.join(",")
 
-  const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
-  if(includedFacilityGroupIds?.length) {
+    const excludedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in");
+    const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId);
+    if(excludedFacilityGroupIds.length) excludedCondition["fieldValue"] = excludedFacilityGroupIds.join(",")
+
+    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+      Object.entries(filters as any).map(([filter, value]: any) => {
+        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
+        if(condition) {
+          condition["fieldValue"] = value.length ? value.join(",") : ""
+        }
+      })
+    })
+
+    return ruleConditions;
+  } else {
+    const conditions = [];
+
+    const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
     conditions.push({
       "ruleId": ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilities",
+      "fieldName": "facilityGroups",
       "operator": "in",
-      "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
+      "fieldValue": includedFacilityGroupIds ? includedFacilityGroupIds.join(",") : "",
       "multiValued": "Y"
     })
-  }
 
-  const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
-  if(excludedFacilityGroupIds?.length) {
+    const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
     conditions.push({
       "ruleId": ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilities",
+      "fieldName": "facilityGroups",
       "operator": "not-in",
-      "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
+      "fieldValue": excludedFacilityGroupIds.length ? excludedFacilityGroupIds.join(",") : "",
       "multiValued": "Y"
     })
-  }
 
-  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-    Object.entries(filters as any).map(([filter, value]: any) => {
-      if(value.length) {
+    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+      Object.entries(filters as any).map(([filter, value]: any) => {
         conditions.push({
           "ruleId": ruleId,
           "conditionTypeEnumId": "ENTCT_ATP_FILTER",
           "fieldName": filter,
           "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.length > 1 ? value.join(",") : value[0],
+          "fieldValue": value.length ? value.join(",") : "",
           "multiValued": "Y"
         })
-      }
+      })
     })
-  })
 
-  return conditions;
+    return conditions;
+  }
 }
 
 async function createRule() {
-  if(!formData.value.ruleName.trim() || !formData.value.safetyStock || !formData.value.selectedFacilityGroups.included.length) {
-    showToast(translate("Please fill in all the required fields."))
-    return;
-  }
-
-  if(formData.value.safety < 0) {
-    showToast(translate("Safety stock should be greater than or equal to 0."));
-    return;
-  }
+  if(!isRuleValid()) return;
 
   emitter.emit("presentLoader");
 
@@ -247,6 +306,39 @@ async function createRule() {
   emitter.emit("dismissLoader");
 }
 
+async function updateRule() {
+  if(!isRuleValid()) return;
+
+  try {
+    await RuleService.updateRule({
+      ...currentRule.value,
+      "ruleName": formData.value.ruleName,
+      "ruleConditions": generateRuleConditions(props.ruleId),
+      "ruleActions": generateRuleActions(props.ruleId)
+    }, props.ruleId);
+    showToast(translate("Rule updated successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
+    router.push("/safety-stock");
+  } catch(err: any) {
+    logger.error(err);
+  }
+}
+
+function isRuleValid() {
+  if(!formData.value.ruleName.trim() || !formData.value.safetyStock || !formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please fill in all the required fields."))
+    return false;
+  }
+
+  if(formData.value.safety < 0) {
+    showToast(translate("Safety stock should be greater than or equal to 0."));
+    return false;
+  }
+
+  return true
+}
+
 function validateSafetyStock(event: any) {
   if(/[`!@#$%^&*()_+\-=\\|,.<>?~e]/.test(event.key) && event.key !== 'Backspace') event.preventDefault();
 }
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 58c62d29..8d82850a 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -101,7 +101,6 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 const currentRule = ref({}) as any;
-
 const props = defineProps(["ruleId"]);
 
 onIonViewWillLeave(() => {

From 1eaeaf5b42d56fd12e089dac672a435a8494a5e4 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 10:54:47 +0530
Subject: [PATCH 178/250] Improved: logic for updating store pickup rule (#308)

---
 src/components/RuleItem.vue         |   6 +-
 src/views/CreateStorePickupRule.vue | 186 ++++++++++++++++++++++------
 2 files changed, 150 insertions(+), 42 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index b4e48dde..5acf48c4 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -517,7 +517,11 @@ function editRule() {
     path = `update-shipping/${props.rule.ruleId}`
   }
 
-  router.push(path);
+  if(props.selectedSegment) {
+    router.push({ path, query: { groupTypeEnumId: props.selectedSegment } });
+  } else {
+    router.push(path)
+  }
 }
 </script>
 
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index fe3595ea..d2515caa 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" :default-href="getDefaultUrl()" />
-        <ion-title>{{ translate("New store pickup rule") }}</ion-title>
+        <ion-title>{{ currentRule.ruleId ? translate("Update store pickup rule") : translate("New store pickup rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
@@ -30,7 +30,7 @@
         </div>
       </section>
 
-      <div class="section-header">
+      <div class="section-header" v-if="!currentRule.ruleId">
         <ion-segment v-model="selectedSegment">
           <ion-segment-button value="RG_PICKUP_FACILITY">
             <ion-label>{{ translate("Facility") }}</ion-label>
@@ -39,6 +39,10 @@
             <ion-label>{{ translate("Channel") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
+      </div else>
+      <div  class="section-header">
+        <h1 v-if="selectedSegment === 'RG_PICKUP_FACILITY'">{{ translate("Facility") }}</h1>
+        <h1 v-else>{{ translate("Channel") }}</h1>
       </div>
 
       <section v-if="selectedSegment === 'RG_PICKUP_FACILITY'">
@@ -96,7 +100,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createRule()">
+      <ion-fab-button @click="currentRule.ruleId ? updateRule() : createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -104,27 +108,32 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
-import { computed, onMounted, ref } from 'vue';
+import { computed, defineProps, ref } from 'vue';
 import ProductFilters from '@/components/ProductFilters.vue';
 import { useRouter } from 'vue-router';
 import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
 import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
-import { showToast } from '@/utils';
+import { hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter();
+
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId)
+const currentRule = ref({}) as any;
+const props = defineProps(["ruleId"]);
+
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const appliedFilters = computed(() => store.getters["util/getAppliedFilters"])
 const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 const formData = ref({
   ruleName: '',
@@ -136,8 +145,49 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 
-onMounted(async () => {
+onIonViewWillEnter(async () => {
   await store.dispatch("util/fetchConfigFacilities");
+  if(props.ruleId) {
+    try {
+      const resp = await RuleService.fetchRules({ ruleId: props.ruleId })
+
+      if(!hasError(resp)) {
+        currentRule.value = resp.data[0];
+
+        formData.value.ruleName = currentRule.value.ruleName;
+        formData.value.isPickupAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
+
+        if(selectedSegment.value === 'RG_PICKUP_FACILITY') {
+          const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
+          const includedGroupIds = includedGroups.fieldValue ? includedGroups.fieldValue.split(",") : []
+          formData.value.selectedFacilityGroups.included = facilityGroups.value.filter((group: any) => includedGroupIds.includes(group.facilityGroupId));
+          
+          const excludedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in")
+          const excludedGroupIds = excludedGroups.fieldValue ? excludedGroups.fieldValue.split(",") : []
+          formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
+        } else {
+          const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
+          formData.value.selectedConfigFacilites = facilityCondition.fieldValue?.split(",");
+        }
+        
+        const currentAppliedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
+        currentRule.value.ruleConditions.map((condition: any) => {
+          if(condition.conditionTypeEnumId === "ENTCT_ATP_FILTER") {
+            if(condition.operator === "in") {
+              currentAppliedFilters["included"][condition.fieldName] = condition.fieldValue ? condition.fieldValue.split(",") : []
+            } else {
+              currentAppliedFilters["excluded"][condition.fieldName] = condition.fieldValue ? condition.fieldValue.split(",") : []
+            }
+          }
+        })
+        await store.dispatch('util/updateAppliedFilters', currentAppliedFilters)
+      } else {
+        throw resp.data
+      }
+    } catch(err: any) {
+      logger.error(err);
+    }
+  }
 })
 
 onIonViewWillLeave(() => {
@@ -150,6 +200,7 @@ onIonViewWillLeave(() => {
     },
     selectedConfigFacilites: []
   }
+  store.dispatch("util/clearAppliedFilters")
 })
 
 function getDefaultUrl() {
@@ -187,18 +238,7 @@ function isFacilitySelected(facilityId: any) {
 }
 
 async function createRule() {
-  if(!formData.value.ruleName.trim()) {
-    showToast(translate("Please fill in all the required fields."))
-    return;
-  }
-
-  if(selectedSegment.value === 'RG_PICKUP_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
-    showToast(translate("Please include atleast one facility group."))
-    return;
-  } else if(selectedSegment.value === 'RG_PICKUP_CHANNEL' && !formData.value.selectedConfigFacilites.length) {
-    showToast(translate("Please select atleast one config facility."))
-    return;
-  }
+  if(!isRuleValid()) return;
 
   emitter.emit("presentLoader");
 
@@ -239,6 +279,14 @@ async function createRule() {
 }
 
 function generateRuleActions(ruleId: string) {
+  if(currentRule.value.ruleId) {
+    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "A")
+    if(ruleAction) {
+      ruleAction.fieldValue = formData.value.isPickupAllowed ? 'Y' : 'N';
+      return [ruleAction];
+    }
+  }
+
   return [{
     "ruleId": ruleId,
     "actionTypeEnumId": "ATP_ALLOW_PICKUP",
@@ -248,62 +296,118 @@ function generateRuleActions(ruleId: string) {
 }
 
 function generateRuleConditions(ruleId: string) {
-  const conditions = [];
+  if(currentRule.value.ruleId) {
+    const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
+
+    if(selectedSegment.value === 'RG_PICKUP_FACILITY') {
+      const includedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in");
+      const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId);
+      if(includedFacilityGroupIds.length) includedCondition["fieldValue"] = includedFacilityGroupIds.join(",")
+  
+      const excludedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in");
+      const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId);
+      if(excludedFacilityGroupIds.length) excludedCondition["fieldValue"] = excludedFacilityGroupIds.join(",")
+    } else {
+      const facilityCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES");
+      if(facilityCondition) facilityCondition["fieldValue"] = formData.value.selectedConfigFacilites.join(",");
+    }
+
+    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+      Object.entries(filters as any).map(([filter, value]: any) => {
+        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
+        if(condition) {
+          condition["fieldValue"] = value.length ? value.join(",") : ""
+        }
+      })
+    })
+
+    return ruleConditions;
+  } else {
+    const conditions = [];
 
-  if(selectedSegment.value === 'RG_PICKUP_FACILITY') {
-    const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
-    if(includedFacilityGroupIds?.length) {
+    if(selectedSegment.value === 'RG_PICKUP_FACILITY') {
+      const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
         "fieldName": "facilities",
         "operator": "in",
-        "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
+        "fieldValue": includedFacilityGroupIds.length ? includedFacilityGroupIds.join(",") : "",
         "multiValued": "Y"
       })
-    }
 
-    const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
-    if(excludedFacilityGroupIds?.length) {
+      const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
         "fieldName": "facilities",
         "operator": "not-in",
-        "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
+        "fieldValue": excludedFacilityGroupIds.length ? excludedFacilityGroupIds.join(",") : "",
         "multiValued": "Y"
       })
-    }
-  } else {
-    const selectedFacilites = formData.value.selectedConfigFacilites
-    if(selectedFacilites?.length) {
+    } else {
+      const selectedFacilites = formData.value.selectedConfigFacilites
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
         "fieldName": "facilities",
         "operator": "in",
-        "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
+        "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
         "multiValued": "Y"
       })
     }
-  }
 
-  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-    Object.entries(filters as any).map(([filter, value]: any) => {
-      if(value.length) {
+    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+      Object.entries(filters as any).map(([filter, value]: any) => {
         conditions.push({
           "ruleId": ruleId,
           "conditionTypeEnumId": "ENTCT_ATP_FILTER",
           "fieldName": filter,
           "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.length > 1 ? value.join(",") : value[0],
+          "fieldValue": value.length ? value.join(",") : "",
           "multiValued": "Y"
         })
-      }
+      })
     })
-  })
 
-  return conditions;
+    return conditions;
+  }
+}
+
+async function updateRule() {
+  if(!isRuleValid()) return;
+
+  try {
+    await RuleService.updateRule({
+      ...currentRule.value,
+      "ruleName": formData.value.ruleName,
+      "ruleConditions": generateRuleConditions(props.ruleId),
+      "ruleActions": generateRuleActions(props.ruleId)
+    }, props.ruleId);
+    showToast(translate("Rule updated successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
+    router.push("/safety-stock");
+  } catch(err: any) {
+    logger.error(err);
+  }
+}
+
+function isRuleValid() {
+  if(!formData.value.ruleName.trim()) {
+    showToast(translate("Please fill in all the required fields."))
+    return false;
+  }
+
+  if(selectedSegment.value === 'RG_PICKUP_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please include atleast one facility group."))
+    return false;
+  } else if(selectedSegment.value === 'RG_PICKUP_CHANNEL' && !formData.value.selectedConfigFacilites.length) {
+    showToast(translate("Please select atleast one config facility."))
+    return false;
+  }
+
+  return true;
 }
 
 function removeFacilityGroups(facilityGroupId: any, type: string) {

From 3b67c6a2dd7e31a8f20162d9fc4e6436f9802b95 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 11:29:37 +0530
Subject: [PATCH 179/250] Implemented: logic to update rules using create page
 for shipping page (#308)

---
 src/locales/en.json                 |   2 +
 src/views/CreateShippingRule.vue    | 187 +++++++++++++++++++++-------
 src/views/CreateStorePickupRule.vue |  14 ++-
 3 files changed, 155 insertions(+), 48 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index d29ec930..e4f8687d 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -259,6 +259,8 @@
   "Unable to schedule service.": "Unable to schedule service.",
   "Unable to update threshold rule.": "Unable to update threshold rule.",
   "Update": "Update",
+  "Update shipping rule": "Update shipping rule",
+  "Update store pickup rule": "Update store pickup rule",
   "Update time zone": "Update time zone",
   "Update threshold rule": "Update threshold rule",
   "Unlimited": "Unlimited",
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index e623c97f..c28f8d2e 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" :default-href="getDefaultUrl()" />
-        <ion-title>{{ translate("New shipping rule") }}</ion-title>
+        <ion-title>{{ currentRule.ruleId ? translate("Update shipping rule") : translate("New shipping rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
@@ -30,7 +30,7 @@
         </div>
       </section>
       
-      <div class="section-header">
+      <div v-if="!currentRule.ruleId" class="section-header">
         <ion-segment v-model="selectedSegment">
           <ion-segment-button value="RG_SHIPPING_FACILITY">
             <ion-label>{{ translate("Facility") }}</ion-label>
@@ -40,6 +40,10 @@
           </ion-segment-button>
         </ion-segment>
       </div>
+      <div v-else class="section-header">
+        <h1 v-if="selectedSegment === 'RG_PICKUP_FACILITY'">{{ translate("Facility") }}</h1>
+        <h1 v-else>{{ translate("Channel") }}</h1>
+      </div>
 
       <section v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">
         <ion-card>
@@ -96,7 +100,7 @@
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createRule()">
+      <ion-fab-button @click="currentRule.ruleId ? updateRule() : createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -104,27 +108,32 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
-import { computed, onMounted, ref } from 'vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
+import { computed, defineProps, ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
 import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
 import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
-import { showToast } from '@/utils';
+import { hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import { useRouter } from 'vue-router';
 import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter();
+
+const props = defineProps(["ruleId"]);
 const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId)
+const currentRule = ref({}) as any;
+
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const appliedFilters = computed(() => store.getters["util/getAppliedFilters"])
 const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 const formData = ref({
   ruleName: '',
@@ -136,8 +145,49 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 
-onMounted(async () => {
+onIonViewWillEnter(async () => {
   await store.dispatch("util/fetchConfigFacilities");
+  if(props.ruleId) {
+    try {
+      const resp = await RuleService.fetchRules({ ruleId: props.ruleId })
+
+      if(!hasError(resp)) {
+        currentRule.value = resp.data[0];
+
+        formData.value.ruleName = currentRule.value.ruleName;
+        formData.value.isBrokeringAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
+
+        if(selectedSegment.value === "RG_SHIPPING_FACILITY") {
+          const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
+          const includedGroupIds = includedGroups.fieldValue ? includedGroups.fieldValue.split(",") : []
+          formData.value.selectedFacilityGroups.included = facilityGroups.value.filter((group: any) => includedGroupIds.includes(group.facilityGroupId));
+
+          const excludedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in")
+          const excludedGroupIds = excludedGroups.fieldValue ? excludedGroups.fieldValue.split(",") : []
+          formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
+        } else if(selectedSegment.value === "RG_SHIPPING_CHANNEL") {
+          const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
+          formData.value.selectedConfigFacilites = facilityCondition.fieldValue?.split(",");
+        }
+
+        const currentAppliedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
+        currentRule.value.ruleConditions.map((condition: any) => {
+          if(condition.conditionTypeEnumId === "ENTCT_ATP_FILTER") {
+            if(condition.operator === "in") {
+              currentAppliedFilters["included"][condition.fieldName] = condition.fieldValue ? condition.fieldValue.split(",") : []
+            } else {
+              currentAppliedFilters["excluded"][condition.fieldName] = condition.fieldValue ? condition.fieldValue.split(",") : []
+            }
+          }
+        })
+        await store.dispatch('util/updateAppliedFilters', currentAppliedFilters)
+      } else {
+        throw resp.data
+      }
+    } catch(err: any) {
+      logger.error(err);
+    }
+  }
 })
 
 onIonViewWillLeave(() => {
@@ -150,10 +200,11 @@ onIonViewWillLeave(() => {
     },
     selectedConfigFacilites: []
   }
+  store.dispatch("util/clearAppliedFilters")
 })
 
 function getDefaultUrl() {
-  return `shipping?groupTypeEnumId=${selectedSegment.value}`
+  return `/shipping?groupTypeEnumId=${selectedSegment.value}`
 }
 
 async function openProductFacilityGroupModal(type: string) {
@@ -187,18 +238,6 @@ function isFacilitySelected(facilityId: any) {
 }
 
 async function createRule() {
-  if(!formData.value.ruleName.trim()) {
-    showToast(translate("Please fill in all the required fields."))
-    return;
-  }
-
-  if(selectedSegment.value === 'RG_SHIPPING_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
-    showToast(translate("Please include atleast one facility group."))
-    return;
-  } else if(selectedSegment.value === 'RG_SHIPPING_CHANNEL' && !formData.value.selectedConfigFacilites.length) {
-    showToast(translate("Please select atleast one config facility."))
-    return;
-  }
 
   emitter.emit("presentLoader");
 
@@ -239,6 +278,14 @@ async function createRule() {
 }
 
 function generateRuleActions(ruleId: string) {
+  if(currentRule.value.ruleId) {
+    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "ATP_ALLOW_BROKERING")
+    if(ruleAction) {
+      ruleAction.fieldValue = formData.value.isBrokeringAllowed ? 'Y' : 'N';
+      return [ruleAction];
+    }
+  }
+
   return [{
     "ruleId": ruleId,
     "actionTypeEnumId": "ATP_ALLOW_BROKERING",
@@ -248,62 +295,118 @@ function generateRuleActions(ruleId: string) {
 }
 
 function generateRuleConditions(ruleId: string) {
-  const conditions = [];
+  if(currentRule.value.ruleId) {
+    const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
+
+    if(selectedSegment.value === 'RG_SHIPPING_FACILITY') {
+      const includedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in");
+      const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId);
+      if(includedFacilityGroupIds.length) includedCondition["fieldValue"] = includedFacilityGroupIds.join(",")
+  
+      const excludedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in");
+      const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId);
+      if(excludedFacilityGroupIds.length) excludedCondition["fieldValue"] = excludedFacilityGroupIds.join(",")
+    } else {
+      const facilityCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES");
+      if(facilityCondition) facilityCondition["fieldValue"] = formData.value.selectedConfigFacilites.join(",");
+    }
+
+    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+      Object.entries(filters as any).map(([filter, value]: any) => {
+        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
+        if(condition) {
+          condition["fieldValue"] = value.length ? value.join(",") : ""
+        }
+      })
+    })
+
+    return ruleConditions;
+  } else {
+    const conditions = [];
 
-  if(selectedSegment.value === 'RG_SHIPPING_FACILITY') {
-    const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
-    if(includedFacilityGroupIds?.length) {
+    if(selectedSegment.value === 'RG_SHIPPING_FACILITY') {
+      const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
         "fieldName": "facilityGroups",
         "operator": "in",
-        "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
+        "fieldValue": includedFacilityGroupIds.length ? includedFacilityGroupIds.join(",") : "",
         "multiValued": "Y"
       })
-    }
 
-    const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
-    if(excludedFacilityGroupIds?.length) {
+      const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
         "fieldName": "facilityGroups",
         "operator": "not-in",
-        "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
+        "fieldValue": excludedFacilityGroupIds.length ? excludedFacilityGroupIds.join(",") : "",
         "multiValued": "Y"
       })
-    }
-  } else {
-    const selectedFacilites = formData.value.selectedConfigFacilites
-    if(selectedFacilites?.length) {
+    } else {
+      const selectedFacilites = formData.value.selectedConfigFacilites
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
         "fieldName": "facilities",
         "operator": "in",
-        "fieldValue": selectedFacilites.length > 1 ? selectedFacilites.join(",") : selectedFacilites[0],
+        "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
         "multiValued": "Y"
       })
     }
-  }
 
-  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-    Object.entries(filters as any).map(([filter, value]: any) => {
-      if(value.length) {
+    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+      Object.entries(filters as any).map(([filter, value]: any) => {
         conditions.push({
           "ruleId": ruleId,
           "conditionTypeEnumId": "ENTCT_ATP_FILTER",
           "fieldName": filter,
           "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.length > 1 ? value.join(",") : value[0],
+          "fieldValue": value.length ? value.join(",") : "",
           "multiValued": "Y"
         })
-      }
+      })
     })
-  })
 
-  return conditions;
+    return conditions;
+  }
+}
+
+async function updateRule() {
+  if(!isRuleValid()) return;
+
+  try {
+    await RuleService.updateRule({
+      ...currentRule.value,
+      "ruleName": formData.value.ruleName,
+      "ruleConditions": generateRuleConditions(props.ruleId),
+      "ruleActions": generateRuleActions(props.ruleId)
+    }, props.ruleId);
+    showToast(translate("Rule updated successfully."))
+    store.dispatch("rule/clearRuleState")
+    store.dispatch("util/clearAppliedFilters")
+    router.push(getDefaultUrl());
+  } catch(err: any) {
+    logger.error(err);
+  }
+}
+
+function isRuleValid() {
+  if(!formData.value.ruleName.trim()) {
+    showToast(translate("Please fill in all the required fields."))
+    return false;
+  }
+
+  if(selectedSegment.value === 'RG_SHIPPING_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please include atleast one facility group."))
+    return false;
+  } else if(selectedSegment.value === 'RG_SHIPPING_CHANNEL' && !formData.value.selectedConfigFacilites.length) {
+    showToast(translate("Please select atleast one config facility."))
+    return false;
+  }
+
+  return true;
 }
 
 function removeFacilityGroups(facilityGroupId: any, type: string) {
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index d2515caa..caf52f8a 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -40,7 +40,7 @@
           </ion-segment-button>
         </ion-segment>
       </div else>
-      <div  class="section-header">
+      <div v-else class="section-header">
         <h1 v-if="selectedSegment === 'RG_PICKUP_FACILITY'">{{ translate("Facility") }}</h1>
         <h1 v-else>{{ translate("Channel") }}</h1>
       </div>
@@ -157,7 +157,7 @@ onIonViewWillEnter(async () => {
         formData.value.ruleName = currentRule.value.ruleName;
         formData.value.isPickupAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
 
-        if(selectedSegment.value === 'RG_PICKUP_FACILITY') {
+        if(selectedSegment.value === "RG_PICKUP_FACILITY") {
           const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
           const includedGroupIds = includedGroups.fieldValue ? includedGroups.fieldValue.split(",") : []
           formData.value.selectedFacilityGroups.included = facilityGroups.value.filter((group: any) => includedGroupIds.includes(group.facilityGroupId));
@@ -165,7 +165,7 @@ onIonViewWillEnter(async () => {
           const excludedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in")
           const excludedGroupIds = excludedGroups.fieldValue ? excludedGroups.fieldValue.split(",") : []
           formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
-        } else {
+        } else if(selectedSegment.value === "RG_PICKUP_CHANNEL") {
           const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
           formData.value.selectedConfigFacilites = facilityCondition.fieldValue?.split(",");
         }
@@ -204,7 +204,9 @@ onIonViewWillLeave(() => {
 })
 
 function getDefaultUrl() {
-  return `store-pickup?groupTypeEnumId=${selectedSegment.value}`
+  console.log('enterd', selectedSegment.value);
+  
+  return `/store-pickup?groupTypeEnumId=${selectedSegment.value}`
 }
 
 async function openProductFacilityGroupModal(type: string) {
@@ -280,7 +282,7 @@ async function createRule() {
 
 function generateRuleActions(ruleId: string) {
   if(currentRule.value.ruleId) {
-    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "A")
+    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "ATP_ALLOW_PICKUP")
     if(ruleAction) {
       ruleAction.fieldValue = formData.value.isPickupAllowed ? 'Y' : 'N';
       return [ruleAction];
@@ -387,7 +389,7 @@ async function updateRule() {
     showToast(translate("Rule updated successfully."))
     store.dispatch("rule/clearRuleState")
     store.dispatch("util/clearAppliedFilters")
-    router.push("/safety-stock");
+    router.push(getDefaultUrl());
   } catch(err: any) {
     logger.error(err);
   }

From 7f753828747c014f87ce96425e234508c060711f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 11:57:09 +0530
Subject: [PATCH 180/250] Improved: create rule page since we are using that
 for updating rule (#308)

---
 src/components/Menu.vue                       |   8 +-
 src/components/RuleItem.vue                   |  61 -----
 .../SelectConfigFacilitiesModal.vue           | 129 ----------
 src/components/UpdateFacilityGroupModal.vue   | 183 --------------
 src/components/UpdateProductFiltersModal.vue  | 236 ------------------
 src/locales/en.json                           |  12 +-
 src/router/index.ts                           |  24 +-
 ...le.vue => CreateUpdateSafetyStockRule.vue} |   0
 ...gRule.vue => CreateUpdateShippingRule.vue} |   0
 ...le.vue => CreateUpdateStorePickupRule.vue} |   2 -
 ...Rule.vue => CreateUpdateThresholdRule.vue} |   2 +-
 11 files changed, 18 insertions(+), 639 deletions(-)
 delete mode 100644 src/components/SelectConfigFacilitiesModal.vue
 delete mode 100644 src/components/UpdateFacilityGroupModal.vue
 delete mode 100644 src/components/UpdateProductFiltersModal.vue
 rename src/views/{CreateSafetyStockRule.vue => CreateUpdateSafetyStockRule.vue} (100%)
 rename src/views/{CreateShippingRule.vue => CreateUpdateShippingRule.vue} (100%)
 rename src/views/{CreateStorePickupRule.vue => CreateUpdateStorePickupRule.vue} (99%)
 rename src/views/{CreateThresholdRule.vue => CreateUpdateThresholdRule.vue} (99%)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index d40fe4ed..5d6b25a9 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -73,28 +73,28 @@
         {
           title: "Threshold",
           url: "/threshold",
-          childRoutes: ["/create-threshold"],
+          childRoutes: ["/create-threshold", "/update-threshold/"],
           iosIcon: globeOutline,
           mdIcon: globeOutline
         },
         {
           title: "Safety stock",
           url: "/safety-stock",
-          childRoutes: ["/create-safety-stock"],
+          childRoutes: ["/create-safety-stock", "/update-safety-stock/"],
           iosIcon: pulseOutline,
           mdIcon: pulseOutline
         },
         {
           title: "Store pickup",
           url: "/store-pickup",
-          childRoutes: ["/create-store-pickup"],
+          childRoutes: ["/create-store-pickup", "update-store-pickup/"],
           iosIcon: storefrontOutline,
           mdIcon: storefrontOutline
         },
         {
           title: "Shipping",
           url: "/shipping",
-          childRoutes: ["/create-shipping"],
+          childRoutes: ["/create-shipping", "/update-shipping/"],
           iosIcon: sendOutline,
           mdIcon: sendOutline
         },
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 5acf48c4..32f12cc9 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -39,9 +39,6 @@
       <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL' || selectedSegment === 'RG_SHIPPING_CHANNEL'">
         <ion-item-divider color="light">
           <ion-label>{{ translate("Channels") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()">
-            <ion-icon :icon="optionsOutline" slot="icon-only" />
-          </ion-button>
         </ion-item-divider>
 
         <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FACILITIES')" lines="none">
@@ -53,9 +50,6 @@
       <template v-else>
         <ion-item-divider color="light">
           <ion-label>{{ translate("Facility groups") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium" @click="openUpdateFacilityGroupModal()">
-            <ion-icon :icon="optionsOutline" slot="icon-only" />
-          </ion-button>
         </ion-item-divider>
         
         <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')">
@@ -70,9 +64,6 @@
 
       <ion-item-divider color="light">
         <ion-label>{{ translate("Product tags") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium" @click="openUpdateProductFiltersModal('tags', 'tagsFacet', 'tags')">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
       </ion-item-divider>
 
       <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
@@ -86,9 +77,6 @@
 
       <ion-item-divider color="light">
         <ion-label>{{ translate("Product features") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium"  @click="openUpdateProductFiltersModal('product features', 'productFeaturesFacet', 'productFeatures')">
-          <ion-icon :icon="optionsOutline" slot="icon-only" />
-        </ion-button>
       </ion-item-divider>
 
       <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
@@ -122,8 +110,6 @@ import { useStore } from 'vuex';
 import { showToast } from '@/utils';
 import logger from '@/logger';
 import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
-import UpdateProductFiltersModal from '@/components/UpdateProductFiltersModal.vue';
-import UpdateFacilityGroupModal from '@/components/UpdateFacilityGroupModal.vue';
 import emitter from '@/event-bus';
 
 const router = useRouter();
@@ -367,58 +353,11 @@ async function archiveRule() {
   return alert.present();
 }
 
-function getSelectedFacilities() {
-  const condition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
-  return (condition && condition.fieldValue) ? condition.fieldValue.split(",") : []
-}
-
-function getSelectedFacilityGroups() {
-  const condition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS")
-  return (condition && condition.fieldValue) ? condition.fieldValue.split(",") : []
-}
-
-async function openSelectConfigFacilitiesModal() {
-  const modal = await modalController.create({
-    component: SelectConfigFacilitiesModal,
-    componentProps: {
-      selectedFacilities: getSelectedFacilities(),
-      rule: props.rule
-    },
-  })
-
-  modal.present()
-}
-
-async function openUpdateFacilityGroupModal() {
-  const modal = await modalController.create({
-    component: UpdateFacilityGroupModal,
-    componentProps: {
-      rule: props.rule
-    },
-  })
-
-  modal.present()
-}
-
 function isRuleConditionAvailable(conditionTypeEnumId: string, fieldName?: string, operator? : string) {
   if(fieldName) return props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)?.fieldValue
   else return props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)?.fieldValue
 }
 
-async function openUpdateProductFiltersModal(label: string, facetToSelect: string, searchfield: string) {
-  const modal = await modalController.create({
-    component: UpdateProductFiltersModal,
-    componentProps: {
-      label,
-      facetToSelect,
-      searchfield,
-      rule: props.rule
-    },
-  })
-
-  modal.present()
-}
-
 async function updateRulePickup(event: any) {
   event.stopImmediatePropagation();
   const isChecked = !event.target.checked;
diff --git a/src/components/SelectConfigFacilitiesModal.vue b/src/components/SelectConfigFacilitiesModal.vue
deleted file mode 100644
index 9f2e0bbf..00000000
--- a/src/components/SelectConfigFacilitiesModal.vue
+++ /dev/null
@@ -1,129 +0,0 @@
-<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("Select facilities") }}</ion-title>
-      <ion-buttons slot="end">
-        <!-- Added check to disabled clear all button if not facility is selected. -->
-        <ion-button fill="clear" color="danger" :disabled="!selectedFacilityValues.length" @click="selectedFacilityValues = []">{{ translate("Clear All") }}</ion-button>
-      </ion-buttons>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <ion-list v-if="configFacilities.length">
-      <ion-item v-for="facility in configFacilities" :key="facility.facilityId">
-        <ion-checkbox :checked="isSelected(facility.facilityId)" @ionChange="toggleFacilitySelection(facility)">
-          <ion-label>
-            {{ facility.facilityName }}
-            <p>{{ facility.facilityId }}</p>
-          </ion-label>
-        </ion-checkbox>
-      </ion-item>
-    </ion-list>
-
-    <div class="empty-state" v-else>
-      <p>{{ translate("No record found") }}</p>
-    </div>
-
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="saveFacilities()">
-        <ion-icon :icon="saveOutline" />  
-      </ion-fab-button>
-    </ion-fab>
-  </ion-content>
-</template>
-  
-<script setup lang="ts">
-import {
-  IonButtons,
-  IonButton,
-  IonCheckbox,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from "@ionic/vue";
-import { computed, defineProps, onMounted, ref } from "vue";
-import { closeOutline, saveOutline } from "ionicons/icons";
-import { useStore } from "vuex";
-import { translate } from "@/i18n";
-import { RuleService } from "@/services/RuleService";
-import { showToast } from "@/utils";
-import logger from "@/logger";
-import emitter from "@/event-bus";
-
-const store = useStore();
-const props = defineProps(["rule", "selectedFacilities"])
-
-const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
-const selectedFacilityValues = ref(JSON.parse(JSON.stringify(props.selectedFacilities)));
-
-onMounted(async () => {
-  await store.dispatch("util/fetchConfigFacilities");
-})
-
-async function closeModal() {
-  modalController.dismiss({ dismissed: true });
-}
-
-async function toggleFacilitySelection(updatedFacility: any) {
-  const selectedFacility = selectedFacilityValues.value.some((facilityId: any) => facilityId === updatedFacility.facilityId);
-  if (selectedFacility) {
-    selectedFacilityValues.value = selectedFacilityValues.value.filter((facilityId: any) => facilityId !== updatedFacility.facilityId);
-  } else {
-    selectedFacilityValues.value.push(updatedFacility.facilityId);
-  }
-}
-
-function isSelected(currentFacilityId: any) {
-  return selectedFacilityValues.value.some((facilityId: any) => facilityId === currentFacilityId);
-}
-
-async function saveFacilities() {  
-  emitter.emit("presentLoader");
-  const rule = JSON.parse(JSON.stringify(props.rule))
-
-  const condition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
-  if(condition) {
-    condition.fieldValue = selectedFacilityValues.value.join(",")
-  } else {
-    rule.ruleConditions.push({
-      "ruleId": rule.ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
-      "fieldName": "facilities",
-      "operator": "in",
-      "fieldValue": selectedFacilityValues.value.length > 1 ? selectedFacilityValues.value.join(",") : selectedFacilityValues.value[0],
-      "multiValued": "Y"
-    })
-  }
-
-  try {
-    await RuleService.updateRule(rule, rule.ruleId)
-    await store.dispatch('rule/updateRuleData', { rule })
-    showToast(translate("Config facilities updated successfully."))
-    modalController.dismiss();
-  } catch(err: any) {
-    showToast(translate("Failed to update config facilities."))
-    logger.error(err)
-  }
-  emitter.emit("dismissLoader");
-}
-</script>
-
-<style scoped>
-ion-content {
-  --padding-bottom: 80px;
-}
-</style>
\ No newline at end of file
diff --git a/src/components/UpdateFacilityGroupModal.vue b/src/components/UpdateFacilityGroupModal.vue
deleted file mode 100644
index 756bf7dd..00000000
--- a/src/components/UpdateFacilityGroupModal.vue
+++ /dev/null
@@ -1,183 +0,0 @@
-<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("Select facility groups") }}</ion-title>
-      <ion-buttons slot="end">
-        <!-- Added check to disable clear all button if not group is selected for current segment. -->
-        <ion-button fill="clear" color="danger" :disabled="selectedSegment === 'included' ? !includedGroups.length : !excludedGroups.length" @click="selectedSegment === 'included' ? includedGroups = [] : excludedGroups = []">{{ translate("Clear All") }}</ion-button>
-      </ion-buttons>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <ion-segment v-model="selectedSegment">
-      <ion-segment-button value="included">
-        <ion-label>{{ translate("Included") }}</ion-label>
-      </ion-segment-button>
-      <ion-segment-button value="excluded">
-        <ion-label>{{ translate("Excluded") }}</ion-label>
-      </ion-segment-button>
-    </ion-segment>
-
-    <ion-list v-if="facilityGroupValues.length">
-      <ion-item v-for="group in facilityGroupValues" :key="group.facilityGroupId" @click="!isAlreadyApplied(group.facilityGroupId) ? updateSelectedValues(group.facilityGroupId): ''">
-        <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}</ion-label>
-        <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isSelected(group.facilityGroupId)">
-          {{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}
-        </ion-checkbox>
-        <ion-note v-else slot="end" color="danger">{{ selectedSegment === 'included' ? translate("excluded") : translate("included") }}</ion-note>
-      </ion-item>
-    </ion-list>
-
-    <div class="empty-state" v-else>
-      <p>{{ translate("No record found") }}</p>
-    </div>
-
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="saveFacilityGroups()">
-        <ion-icon :icon="saveOutline" />
-      </ion-fab-button>
-    </ion-fab>
-  </ion-content>
-</template>
-
-<script setup lang="ts">
-import { computed, defineProps, onMounted, ref } from "vue";
-import {
-  IonButton,
-  IonButtons,
-  IonCheckbox,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonNote,
-  IonSegment,
-  IonSegmentButton,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from "@ionic/vue";
-import { closeOutline, saveOutline } from 'ionicons/icons';
-import { useStore } from "vuex";
-import { RuleService } from "@/services/RuleService";
-import { translate } from "@/i18n";
-import { showToast } from "@/utils";
-import logger from "@/logger";
-import emitter from "@/event-bus";
-
-const selectedSegment = ref("included")
-const includedGroups = ref([]) as any;
-const excludedGroups = ref([]) as any;
-const facilityGroupValues = ref([]) as any;
-
-const props = defineProps(["rule"]);
-const store = useStore();
-
-const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
-
-onMounted(async () => {
-  await store.dispatch("util/fetchFacilityGroups");
-  const includedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'in')
-  if(includedCondition && includedCondition.fieldValue) includedGroups.value = includedCondition.fieldValue.split(",");
-
-  const excludedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'not-in')
-  if(excludedCondition && excludedCondition.fieldValue) excludedGroups.value = excludedCondition.fieldValue.split(",");
-
-  facilityGroupValues.value = JSON.parse(JSON.stringify(facilityGroups.value));
-
-  includedGroups.value.map((id: any) => {
-    if(!facilityGroups.value.find((group: any) => group.facilityGroupId === id)) facilityGroupValues.value.unshift({ facilityGroupId: id });
-  })
-
-  excludedGroups.value.map((id: any) => {
-    if(!facilityGroups.value.find((group: any) => group.facilityGroupId === id)) facilityGroupValues.value.unshift({ facilityGroupId: id })
-  })
-})
-
-function closeModal() {
-  modalController.dismiss({ dismissed: true });
-}
-
-function updateSelectedValues(value: string) {
-  if(selectedSegment.value === 'included') {
-    if(includedGroups.value.includes(value)) includedGroups.value.splice(includedGroups.value.indexOf(value), 1)
-    else includedGroups.value.push(value)
-  } 
-  else {
-    if(excludedGroups.value.includes(value)) excludedGroups.value.splice(excludedGroups.value.indexOf(value), 1)
-    else excludedGroups.value.push(value) 
-  }
-}
-
-function isAlreadyApplied(value: string) {
-  if(selectedSegment.value === 'included') return excludedGroups.value.includes(value);
-  else return includedGroups.value.includes(value);
-}
-
-function isSelected(value: string) {
-  if(selectedSegment.value === 'included') return includedGroups.value.includes(value);
-  else return excludedGroups.value.includes(value);
-}
-
-async function saveFacilityGroups() {
-  emitter.emit("presentLoader");
-  const rule = JSON.parse(JSON.stringify(props.rule))
-
-  if(!rule.ruleConditions) rule.ruleConditions = []
-
-  const includeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'in')
-  if(includeCondition) {
-    includeCondition.fieldValue = includedGroups.value.join(",")
-  } else {
-    rule.ruleConditions.push({
-      "ruleId": rule.ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilityGroups",
-      "operator": "in",
-      "fieldValue": includedGroups.value?.length > 1 ? includedGroups.value.join(",") : includedGroups.value[0],
-      "multiValued": "Y"
-    })
-  }
-
-  const excludeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS' && condition.fieldName === 'facilityGroups' && condition.operator === 'not-in')
-  if(excludeCondition) {
-    excludeCondition.fieldValue = excludedGroups.value.join(",")
-  } else {
-    rule.ruleConditions.push({
-      "ruleId": rule.ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilityGroups",
-      "operator": "not-in",
-      "fieldValue": excludedGroups.value?.length > 1 ? excludedGroups.value.join(",") : excludedGroups.value[0],
-      "multiValued": "Y"
-    })
-  }
-
-  try {
-    await RuleService.updateRule(rule, rule.ruleId)
-    await store.dispatch('rule/updateRuleData', { rule })
-    showToast(translate("Facility groups updated succesfully."))
-    modalController.dismiss()
-  } catch(err: any) {
-    showToast(translate("Failed to update facility groups."))
-    logger.error(err);
-  }
-  emitter.emit("dismissLoader");
-}
-</script>
-
-<style scoped>
-  ion-content {
-    --padding-bottom: 80px;
-  }
-</style>
\ No newline at end of file
diff --git a/src/components/UpdateProductFiltersModal.vue b/src/components/UpdateProductFiltersModal.vue
deleted file mode 100644
index 9cd1d759..00000000
--- a/src/components/UpdateProductFiltersModal.vue
+++ /dev/null
@@ -1,236 +0,0 @@
-<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("Select", { label }) }}</ion-title>
-      <ion-buttons slot="end">
-        <!-- Added check to disable clear button if no facetOptions are available to select or if no filter is selected for the current segment. -->
-        <ion-button fill="clear" color="danger" :disabled="!facetOptions.length || (selectedSegment === 'included' ? !includedFilters.length : !excludedFilters.length)" @click="selectedSegment === 'included' ? includedFilters = [] : excludedFilters = []">{{ translate("Clear All") }}</ion-button>
-      </ion-buttons>
-    </ion-toolbar>
-  </ion-header>
-
-  <ion-content>
-    <ion-searchbar :placeholder="translate('Search', { label })" v-model="queryString" @keyup.enter="search()"/>
-
-    <ion-segment v-model="selectedSegment">
-      <ion-segment-button value="included">
-        <ion-label>{{ translate("Included") }}</ion-label>
-      </ion-segment-button>
-      <ion-segment-button value="excluded">
-        <ion-label>{{ translate("Excluded") }}</ion-label>
-      </ion-segment-button>
-    </ion-segment>
-
-    <div class="empty-state" v-if="isLoading">
-      <ion-item lines="none">
-        <ion-spinner name="crescent" slot="start" />
-        {{ translate("Fetching", { label }) }}
-      </ion-item>
-    </div>
-    <ion-list v-else-if="facetOptions.length">
-      <ion-item v-for="option in facetOptions" :key="option.id"  @click="!isAlreadyApplied(option.id) ? updateSelectedValues(option.id): ''">
-        <ion-label v-if="isAlreadyApplied(option.id)">{{ option.label }}</ion-label>
-        <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="isSelected(option.id)">
-          {{ option.label }}
-        </ion-checkbox>
-        <ion-note v-else slot="end" color="danger">{{ selectedSegment === 'included' ? translate("excluded") : translate("included") }}</ion-note>
-      </ion-item>
-    </ion-list>
-    <div class="empty-state" v-else-if="!queryString">
-      <p>{{ translate("Search for to find results", { label }) }}</p>
-    </div>
-    <div class="empty-state" v-else>
-      <p>{{ translate("No result found for", { label: queryString }) }}</p>
-    </div>
-
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="saveFilters()">
-        <ion-icon :icon="saveOutline" />
-      </ion-fab-button>
-    </ion-fab>
-
-    <ion-infinite-scroll @ionInfinite="loadMoreFilters($event)" threshold="100px" :disabled="!isScrollable">
-      <ion-infinite-scroll-content loading-spinner="crescent" :loading-text="translate('Loading')"/>
-    </ion-infinite-scroll>
-  </ion-content>
-</template>
-
-<script setup lang="ts">
-import { defineProps, onMounted, ref } from "vue";
-import {
-  IonButton,
-  IonButtons,
-  IonCheckbox,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonInfiniteScroll,
-  IonInfiniteScrollContent,
-  IonItem,
-  IonLabel,
-  IonList,
-  IonNote,
-  IonSearchbar,
-  IonSegment,
-  IonSegmentButton,
-  IonSpinner,
-  IonTitle,
-  IonToolbar,
-  modalController
-} from "@ionic/vue";
-import { closeOutline, saveOutline } from 'ionicons/icons';
-import { useStore } from "vuex";
-import { UtilService } from "@/services/UtilService";
-import { RuleService } from "@/services/RuleService";
-import { translate } from "@/i18n";
-import { hasError, showToast } from "@/utils";
-import logger from "@/logger";
-import emitter from "@/event-bus";
-
-const queryString = ref('');
-const facetOptions = ref([]) as any;
-const isScrollable = ref(true);
-const selectedSegment = ref("included")
-const includedFilters = ref([]) as any;
-const excludedFilters = ref([]) as any;
-const isLoading = ref(false);
-
-const props = defineProps(["label", "facetToSelect", "searchfield", "rule"]);
-const store = useStore();
-
-onMounted(() => {
-  const includedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
-  if(includedCondition && includedCondition.fieldValue) includedFilters.value = includedCondition.fieldValue.split(",");
-
-  const excludedCondition = props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
-  if(excludedCondition && excludedCondition.fieldValue) excludedFilters.value = excludedCondition.fieldValue.split(",");
-})
-
-function closeModal() {
-  modalController.dismiss({ dismissed: true });
-}
-
-function search() {
-  getFilters();
-}
-
-async function getFilters(vSize?: any, vIndex?: any) {
-  isLoading.value = true;
-  const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
-  const viewIndex = vIndex ? vIndex : 0;
-
-  const payload = {
-    facetToSelect: props.facetToSelect,
-    docType: 'PRODUCT',
-    coreName: 'enterpriseSearch',
-    searchfield: props.searchfield,
-    jsonQuery: '{"query":"*:*","filter":["docType:PRODUCT"]}',
-    noConditionFind: 'N',
-    limit: viewSize,
-    q: queryString.value,
-    term: queryString.value,
-    offset: viewSize * viewIndex,
-  }
-
-  const resp = await UtilService.fetchFacets(payload);
-  if(!hasError(resp)) {
-    const results = resp.data.facetResponse.response
-    facetOptions.value = viewIndex === 0 ? results : [...facetOptions.value , ...results];
-    isScrollable.value = (facetOptions.value.length % process.env.VUE_APP_VIEW_SIZE) === 0;
-
-  } else {
-    facetOptions.value = [];
-    isScrollable.value = false;
-  }
-  isLoading.value = false;
-}
-
-async function loadMoreFilters(event: any){
-  getFilters(
-    undefined,
-    Math.ceil(facetOptions.value.length / process.env.VUE_APP_VIEW_SIZE).toString() 
-  ).then(() => {
-    event.target.complete();
-  })
-}
-
-function updateSelectedValues(value: string) {
-  if(selectedSegment.value === 'included') {
-    if(includedFilters.value.includes(value)) includedFilters.value.splice(includedFilters.value.indexOf(value), 1)
-    else includedFilters.value.push(value)
-  } 
-  else {
-    if(excludedFilters.value.includes(value)) excludedFilters.value.splice(excludedFilters.value.indexOf(value), 1)
-    else excludedFilters.value.push(value) 
-  }
-}
-
-function isAlreadyApplied(value: string) {
-  if(selectedSegment.value === 'included') return excludedFilters.value.includes(value);
-  else return includedFilters.value.includes(value);
-}
-
-function isSelected(value: string) {
-  if(selectedSegment.value === 'included') return includedFilters.value.includes(value);
-  else return excludedFilters.value.includes(value);
-}
-
-async function saveFilters() {
-  emitter.emit("presentLoader");
-  const rule = JSON.parse(JSON.stringify(props.rule))
-
-  if(!rule.ruleConditions) rule.ruleConditions = []
-
-  const includeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'in')
-  if(includeCondition) {
-    includeCondition.fieldValue = includedFilters.value.join(",")
-  } else {
-    rule.ruleConditions.push({
-      "ruleId": rule.ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-      "fieldName": props.searchfield,
-      "operator": "in",
-      "fieldValue": includedFilters.value?.length > 1 ? includedFilters.value.join(",") : includedFilters.value[0],
-      "multiValued": "Y"
-    })
-  }
-
-  const excludeCondition = rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === 'ENTCT_ATP_FILTER' && condition.fieldName === props.searchfield && condition.operator === 'not-in')
-  if(excludeCondition) {
-    excludeCondition.fieldValue = excludedFilters.value.join(",")
-  } else {
-    rule.ruleConditions.push({
-      "ruleId": rule.ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-      "fieldName": props.searchfield,
-      "operator": "not-in",
-      "fieldValue": excludedFilters.value?.length > 1 ? excludedFilters.value.join(",") : excludedFilters.value[0],
-      "multiValued": "Y"
-    })
-  }
-
-  try {
-    await RuleService.updateRule(rule, rule.ruleId)
-    await store.dispatch('rule/updateRuleData', { rule })
-    showToast(translate("Product filters updated succesfully."))
-    modalController.dismiss()
-  } catch(err: any) {
-    showToast(translate("Failed to update product filters."))
-    logger.error(err);
-  }
-  emitter.emit("dismissLoader");
-}
-</script>
-
-<style scoped>
-  ion-content {
-    --padding-bottom: 80px;
-  }
-</style>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index e4f8687d..6857d212 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -21,7 +21,6 @@
   "Click the backdrop to dismiss.": "Click the backdrop to dismiss.",
   "Color": "Color",
   "Configuration missing": "Configuration missing",
-  "Config facilities updated successfully.": "Config facilities updated successfully.",
   "Confirm": "Confirm",
   "Copy details": "Copy details",
   "Create channel group": "Create channel group",
@@ -69,15 +68,12 @@
   "Failed to update threshold facility.": "Failed to update threshold facility.",
   "Failed to fetch rule information.": "Failed to fetch rule information.",
   "Failed to update rules order.": "Failed to update rules order.",
-  "Failed to update config facilities.": "Failed to update config facilities.",
   "Failed to update facility": "Failed to update facility",
-  "Failed to update product filters.": "Failed to update product filters.",
   "Failed to update some jobs": "Failed to update some jobs",
   "Failed to update threshold.": "Failed to update threshold.",
   "Failed to schedule service": "Failed to schedule service",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
   "features": "{type} features",
-  "Fetching": "Fetching {label}",
   "Fetching facilities": "Fetching facilities",
   "Fetching time zones": "Fetching time zones",
   "Frequency": "Frequency",
@@ -131,7 +127,6 @@
   "No jobs have run yet": "No jobs have run yet",
   "No jobs to update": "No jobs to update",
   "No previous occurrence": "No previous occurrence",
-  "No result found for": "No result found for {label}",
   "No rules found, redirecting to product page": "No rules found, redirecting to product page",
   "No safety stock rules found": "No safety stock rules found",
   "No shipping rules found": "No shipping rules found",
@@ -157,7 +152,6 @@
   "Product and channel": "Product and channel",
   "Product list": "Product list",
   "Product features": "Product features",
-  "Product filters updated succesfully.": "Product filters updated succesfully.",
   "Product SKU column": "Product SKU column",
   "Product Store": "Product Store",
   "Product store": "Product store",
@@ -200,15 +194,11 @@
   "Schedule new threshold": "Schedule new threshold",
   "Schedule Job": "Schedule Job",
   "Search orders": "Search orders",
-  "Search": "Search {label}",
-  "Search for to find results": "Search for {label} to find results",
-  "Select": "Select {label}",
+  "Select": "Select",
   "Select all variants": "Select all variants",
   "Select CSV": "Select CSV",
   "Selected products": "Selected products",
-  "Select facilities": "Select facilities",
   "Select facility": "Select facility",
-  "Select facility groups": "Select facility groups",
   "Select locations": "Select locations",
   "Select the column index for the following information in the uploaded CSV": "Select the column index for the following information in the uploaded CSV",
   "Select run time": "Select run time",
diff --git a/src/router/index.ts b/src/router/index.ts
index cecd130e..a744bf4a 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -8,10 +8,10 @@ import SafetyStock from '@/views/SafetyStock.vue'
 import StorePickup from '@/views/StorePickup.vue'
 import Shipping from '@/views/Shipping.vue'
 import InventoryChannels from '@/views/InventoryChannels.vue'
-import CreateThresholdRule from '@/views/CreateThresholdRule.vue';
-import CreateSafetyStockRule from '@/views/CreateSafetyStockRule.vue'
-import CreateStorePickupRule from '@/views/CreateStorePickupRule.vue'
-import CreateShippingRule from '@/views/CreateShippingRule.vue'
+import CreateUpdateThresholdRule from '@/views/CreateUpdateThresholdRule.vue';
+import CreateUpdateSafetyStockRule from '@/views/CreateUpdateSafetyStockRule.vue'
+import CreateUpdateStorePickupRule from '@/views/CreateUpdateStorePickupRule.vue'
+import CreateUpdateShippingRule from '@/views/CreateUpdateShippingRule.vue'
 
 
 import 'vue-router'
@@ -77,52 +77,52 @@ const routes: Array<RouteRecordRaw> = [
   {
     path: '/create-threshold',
     name: 'Create threshold',
-    component: CreateThresholdRule,
+    component: CreateUpdateThresholdRule,
     beforeEnter: authGuard
   },
   {
     path: '/create-safety-stock',
     name: 'Create safety stock',
-    component: CreateSafetyStockRule,
+    component: CreateUpdateSafetyStockRule,
     beforeEnter: authGuard
   },
   {
     path: '/create-store-pickup',
     name: 'Create store pickup',
-    component: CreateStorePickupRule,
+    component: CreateUpdateStorePickupRule,
     beforeEnter: authGuard
   },
   {
     path: '/create-shipping',
     name: 'Create shipping',
-    component: CreateShippingRule,
+    component: CreateUpdateShippingRule,
     beforeEnter: authGuard
   },
   {
     path: '/update-threshold/:ruleId',
     name: 'Update threshold',
-    component: CreateThresholdRule,
+    component: CreateUpdateThresholdRule,
     beforeEnter: authGuard,
     props: true
   },
   {
     path: '/update-safety-stock/:ruleId',
     name: 'Update safety stock',
-    component: CreateSafetyStockRule,
+    component: CreateUpdateSafetyStockRule,
     beforeEnter: authGuard,
     props: true
   },
   {
     path: '/update-store-pickup/:ruleId',
     name: 'Update store pickup',
-    component: CreateStorePickupRule,
+    component: CreateUpdateStorePickupRule,
     beforeEnter: authGuard,
     props: true
   },
   {
     path: '/update-shipping/:ruleId',
     name: 'Update shipping',
-    component: CreateShippingRule,
+    component: CreateUpdateShippingRule,
     beforeEnter: authGuard,
     props: true
   },
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
similarity index 100%
rename from src/views/CreateSafetyStockRule.vue
rename to src/views/CreateUpdateSafetyStockRule.vue
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
similarity index 100%
rename from src/views/CreateShippingRule.vue
rename to src/views/CreateUpdateShippingRule.vue
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
similarity index 99%
rename from src/views/CreateStorePickupRule.vue
rename to src/views/CreateUpdateStorePickupRule.vue
index caf52f8a..c5044c86 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -204,8 +204,6 @@ onIonViewWillLeave(() => {
 })
 
 function getDefaultUrl() {
-  console.log('enterd', selectedSegment.value);
-  
   return `/store-pickup?groupTypeEnumId=${selectedSegment.value}`
 }
 
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
similarity index 99%
rename from src/views/CreateThresholdRule.vue
rename to src/views/CreateUpdateThresholdRule.vue
index 8d82850a..b2d0e247 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -163,7 +163,7 @@ function toggleFacilitySelection(facilityId: any) {
 }
 
 function isFacilitySelected(facilityId: any) {
-  return formData.value.selectedConfigFacilites.includes(facilityId)
+  return formData.value.selectedConfigFacilites?.includes(facilityId)
 }
 
 function generateRuleActions(ruleId: string) {

From 22cd3ca53d901a73473250aea005f58c54d779b1 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 12:03:07 +0530
Subject: [PATCH 181/250] Improved: added the missing translation entry for the
 static texts (#308)

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

diff --git a/src/locales/en.json b/src/locales/en.json
index 6857d212..959d618f 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -74,6 +74,7 @@
   "Failed to schedule service": "Failed to schedule service",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
   "features": "{type} features",
+  "Fetching": "Fetching {label}",
   "Fetching facilities": "Fetching facilities",
   "Fetching time zones": "Fetching time zones",
   "Frequency": "Frequency",
@@ -127,6 +128,7 @@
   "No jobs have run yet": "No jobs have run yet",
   "No jobs to update": "No jobs to update",
   "No previous occurrence": "No previous occurrence",
+  "No result found for": "No result found for {label}",
   "No rules found, redirecting to product page": "No rules found, redirecting to product page",
   "No safety stock rules found": "No safety stock rules found",
   "No shipping rules found": "No shipping rules found",
@@ -193,6 +195,8 @@
   "Save threshold rule": "Save threshold rule",
   "Schedule new threshold": "Schedule new threshold",
   "Schedule Job": "Schedule Job",
+  "Search": "Search {label}",
+  "Search for to find results": "Search for {label} to find results",
   "Search orders": "Search orders",
   "Select": "Select",
   "Select all variants": "Select all variants",

From 032cc40b7aa432b03c6f358ec5917eb8fd1e5e86 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 12:17:52 +0530
Subject: [PATCH 182/250] Reverted: update rule name method as not used, and
 unused code (#308)

---
 src/components/RuleItem.vue             | 48 ++-----------------------
 src/locales/en.json                     |  4 +--
 src/views/CreateUpdateThresholdRule.vue | 25 ++-----------
 3 files changed, 6 insertions(+), 71 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 32f12cc9..b8f8214c 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -89,7 +89,6 @@
       </ion-item>
 
       <ion-item lines="none">
-        <!-- <ion-button @click="editRuleName()" size="default" fill="clear">{{ translate("Edit name") }}</ion-button> -->
         <ion-button @click="editRule()" size="default" fill="clear">{{ translate("Edit rule") }}</ion-button>
         <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
           <ion-icon :icon="archiveOutline" slot="icon-only"/>
@@ -100,16 +99,15 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController, modalController } from '@ionic/vue';
+import { IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController } from '@ionic/vue';
 import { computed, defineProps, onMounted, ref } from 'vue';
-import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, optionsOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
+import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@/i18n';
 import { RuleService } from '@/services/RuleService';
 import { useStore } from 'vuex';
 import { showToast } from '@/utils';
 import logger from '@/logger';
-import SelectConfigFacilitiesModal from '@/components/SelectConfigFacilitiesModal.vue';
 import emitter from '@/event-bus';
 
 const router = useRouter();
@@ -251,48 +249,6 @@ async function editSafetyStock() {
   await alert.present()
 }
 
-async function editRuleName() {
-  const alert = await alertController.create({
-    header: translate("Edit name"),
-    inputs: [{
-      name: "name",
-      placeholder: translate("Name"),
-      type: "text",
-      value: props.rule.ruleName.trim()
-    }],
-    buttons: [{
-      text: translate('Cancel'),
-      role: "cancel"
-    },
-    {
-      text: translate('Update'),
-      handler: async(data) => {
-        if(data.name.trim()) {
-          emitter.emit("presentLoader");
-          const rule = JSON.parse(JSON.stringify(props.rule))
-          rule.ruleName = data.name
-
-          try {
-            await RuleService.updateRule(rule, props.rule.ruleId)
-            showToast(translate("Rule name updated successfully."))
-            await store.dispatch('rule/updateRuleData', { rule })
-            alertController.dismiss()
-          } catch(err: any) {
-            logger.error(err)
-            showToast(translate("Failed to update rule name."))
-          }
-          emitter.emit("dismissLoader");
-        } else {
-          showToast(translate("Rule name can't be empty."))
-          return false;
-        }
-      }
-    }]
-  })
-
-  await alert.present()
-}
-
 function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, operator? : string) {
   if(!props.rule.ruleConditions) return;
 
diff --git a/src/locales/en.json b/src/locales/en.json
index 959d618f..6f2f87f0 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -195,10 +195,10 @@
   "Save threshold rule": "Save threshold rule",
   "Schedule new threshold": "Schedule new threshold",
   "Schedule Job": "Schedule Job",
+  "Search orders": "Search orders",
   "Search": "Search {label}",
   "Search for to find results": "Search for {label} to find results",
-  "Search orders": "Search orders",
-  "Select": "Select",
+  "Select": "Select {label}",
   "Select all variants": "Select all variants",
   "Select CSV": "Select CSV",
   "Selected products": "Selected products",
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index b2d0e247..43ad5b59 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -61,32 +61,11 @@
 </template>
 
 <script setup lang="ts">
-import {
-  IonBackButton,
-  IonCard,
-  IonCardHeader,
-  IonCardSubtitle,
-  IonCardTitle,
-  IonCheckbox,
-  IonContent,
-  IonFab,
-  IonFabButton,
-  IonHeader,
-  IonIcon,
-  IonInput,
-  IonItem,
-  IonPage,
-  IonNote,
-  IonText,
-  IonTitle,
-  IonToolbar,
-  onIonViewWillLeave,
-onIonViewWillEnter
-} from '@ionic/vue';
+import { IonBackButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonPage, IonNote, IonText, IonTitle, IonToolbar, onIonViewWillLeave, onIonViewWillEnter } from '@ionic/vue';
 import { saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
-import { computed, defineProps, onMounted, ref } from 'vue';
+import { computed, defineProps, ref } from 'vue';
 import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
 import { hasError, showToast } from '@/utils';

From 231dd02ae540ba8ee017b6956957d0be234aa7c8 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 12:47:01 +0530
Subject: [PATCH 183/250] Improved: styling of the rule card (#317)

---
 src/components/RuleItem.vue | 111 ++++++++++++++++++------------------
 1 file changed, 57 insertions(+), 54 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 7c78e88d..f2b39188 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -35,78 +35,76 @@
       <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRuleShipping($event)">{{ translate(selectedPage.name) }}</ion-toggle>
     </ion-item>
 
-    <ion-list>
-      <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL' || selectedSegment === 'RG_SHIPPING_CHANNEL'">
-        <ion-item-divider color="light">
-          <ion-label>{{ translate("Channels") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()">
-            <ion-icon :icon="optionsOutline" slot="icon-only" />
-          </ion-button>
-        </ion-item-divider>
-
-        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FACILITIES')" lines="none">
-          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FACILITIES") }}</ion-label>
-        </ion-item>
-      </template>
-      
-      <template v-else>
-        <ion-item-divider color="light">
-          <ion-label>{{ translate("Facility groups") }}</ion-label>
-          <ion-button slot="end" fill="clear" color="medium" @click="openUpdateFacilityGroupModal()">
-            <ion-icon :icon="optionsOutline" slot="icon-only" />
-          </ion-button>
-        </ion-item-divider>
-        
-        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')">
-          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
-        </ion-item>
-        <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'not-in')">
-          <ion-icon slot="start" :icon="closeCircleOutline"/>
-          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "not-in") }}</ion-label>
-        </ion-item>
-      </template>
-
+    <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL' || selectedSegment === 'RG_SHIPPING_CHANNEL'">
       <ion-item-divider color="light">
-        <ion-label>{{ translate("Product tags") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium" @click="openUpdateProductFiltersModal('tags', 'tagsFacet', 'tags')">
+        <ion-label>{{ translate("Channels") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium" @click="openSelectConfigFacilitiesModal()">
           <ion-icon :icon="optionsOutline" slot="icon-only" />
         </ion-button>
       </ion-item-divider>
 
-      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
+      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FACILITIES')" lines="none">
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
-      </ion-item>
-      <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
-        <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FACILITIES") }}</ion-label>
       </ion-item>
+    </template>
 
+    <template v-else>
       <ion-item-divider color="light">
-        <ion-label>{{ translate("Product features") }}</ion-label>
-        <ion-button slot="end" fill="clear" color="medium"  @click="openUpdateProductFiltersModal('product features', 'productFeaturesFacet', 'productFeatures')">
+        <ion-label>{{ translate("Facility groups") }}</ion-label>
+        <ion-button slot="end" fill="clear" color="medium" @click="openUpdateFacilityGroupModal()">
           <ion-icon :icon="optionsOutline" slot="icon-only" />
         </ion-button>
       </ion-item-divider>
 
-      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
+      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')">
         <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
       </ion-item>
-      <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
+      <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'not-in')">
         <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
+        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "not-in") }}</ion-label>
       </ion-item>
+    </template>
+
+    <ion-item-divider color="light">
+      <ion-label>{{ translate("Product tags") }}</ion-label>
+      <ion-button slot="end" fill="clear" color="medium" @click="openUpdateProductFiltersModal('tags', 'tagsFacet', 'tags')">
+        <ion-icon :icon="optionsOutline" slot="icon-only" />
+      </ion-button>
+    </ion-item-divider>
+
+    <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
+      <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+      <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
+    </ion-item>
+    <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
+      <ion-icon slot="start" :icon="closeCircleOutline"/>
+      <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
+    </ion-item>
 
-      <ion-item lines="none">
-        <ion-button @click="editRuleName()" size="default" fill="clear">{{ translate("Edit name") }}</ion-button>
-        <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
-          <ion-icon :icon="archiveOutline" slot="icon-only"/>
-        </ion-button>
-      </ion-item>
-    </ion-list>
+    <ion-item-divider color="light">
+      <ion-label>{{ translate("Product features") }}</ion-label>
+      <ion-button slot="end" fill="clear" color="medium"  @click="openUpdateProductFiltersModal('product features', 'productFeaturesFacet', 'productFeatures')">
+        <ion-icon :icon="optionsOutline" slot="icon-only" />
+      </ion-button>
+    </ion-item-divider>
+
+    <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
+      <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+      <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
+    </ion-item>
+    <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
+      <ion-icon slot="start" :icon="closeCircleOutline"/>
+      <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
+    </ion-item>
+
+    <div class="actions">
+      <ion-button @click="editRuleName()" size="default" fill="clear">{{ translate("Edit name") }}</ion-button>
+      <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
+        <ion-icon :icon="archiveOutline" slot="icon-only"/>
+      </ion-button>
+    </div>
   </ion-card>
 </template>
 
@@ -512,4 +510,9 @@ ion-card-header {
   justify-content: space-between;
   align-items: center;
 }
+
+.actions {
+  display: flex;
+  justify-content: space-between;
+}
 </style>
\ No newline at end of file

From 21c57eb2dd1541d2fadf68d92f707c331a924b32 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 12:56:46 +0530
Subject: [PATCH 184/250] Improved: logic to get count of facilities associated
 with a group (#291)

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

diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 69944c65..4dde0ef3 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -50,7 +50,7 @@
   
                 <ion-item>
                   <ion-icon slot="start" :icon="storefrontOutline"/>
-                  <ion-label>{{ translate("retail facilities", { count: getFacilityCount(channel, "RETAIL_STORE") })}}</ion-label>
+                  <ion-label>{{ translate("retail facilities", { count: getFacilityCount(channel, "STORE") })}}</ion-label>
                 </ion-item>
   
                 <ion-item lines="full">
@@ -206,7 +206,11 @@ async function openLinkThresholdFacilitiesToGroupModal(group: any) {
 }
 
 function getFacilityCount(group: any, facilityTypeId: string) {
-  return group.selectedFacilities?.length ? group.selectedFacilities.filter((facility: any) => facility.facilityTypeId === facilityTypeId).length : 0;
+  if(facilityTypeId === 'STORE') {
+    return group.selectedFacilities?.length ? group.selectedFacilities.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "OUTLET_STORE").length : 0;
+  } else {
+    return group.selectedFacilities?.length ? group.selectedFacilities.filter((facility: any) => facility.facilityTypeId === "WAREHOUSE" || facility.facilityTypeId === "OUTLET_WAREHOUSE").length : 0;
+  }
 }
 
 </script>

From a7c7dad6a4cc64548e6a94e6852e7e9de094d4ea Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 14:29:01 +0530
Subject: [PATCH 185/250] Fixed: product filters persisting issue on rule
 creation pages (#313)

---
 src/views/CreateSafetyStockRule.vue | 3 ++-
 src/views/CreateShippingRule.vue    | 1 +
 src/views/CreateStorePickupRule.vue | 1 +
 src/views/CreateThresholdRule.vue   | 1 +
 4 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 73914281..2045356d 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -112,7 +112,7 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onMounted(async () => {
-  await Promise.allSettled([store.dispatch("util/clearAppliedFilters"), store.dispatch("util/fetchFacilityGroups")])
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups")])
 })
 
 onIonViewWillLeave(() => {
@@ -124,6 +124,7 @@ onIonViewWillLeave(() => {
       excluded: []
     }
   }
+  store.dispatch("util/clearAppliedFilters")
 })
 
 async function openProductFacilityGroupModal(type: string) {
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index e623c97f..69afe129 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -150,6 +150,7 @@ onIonViewWillLeave(() => {
     },
     selectedConfigFacilites: []
   }
+  store.dispatch("util/clearAppliedFilters")
 })
 
 function getDefaultUrl() {
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index fe3595ea..d21111ff 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -150,6 +150,7 @@ onIonViewWillLeave(() => {
     },
     selectedConfigFacilites: []
   }
+  store.dispatch("util/clearAppliedFilters")
 })
 
 function getDefaultUrl() {
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index 821ef6e1..a2c8f3bd 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -106,6 +106,7 @@ onIonViewWillLeave(() => {
     threshold: '',
     selectedConfigFacilites: []
   }
+  store.dispatch("util/clearAppliedFilters")
 })
 
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])

From 234a1ebb1e15a161311ec3318feb890e5448c536 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 15:01:54 +0530
Subject: [PATCH 186/250] Improved: logic to fetch rules for the specific page
 only (#313)

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

diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index bd2ffa35..f50fc1c4 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -100,7 +100,7 @@ onUnmounted(() => {
 async function fetchRules() {
   emitter.emit("presentLoader");
   selectedSegment.value = router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY";
-  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
 }
 

From 21d73822de4f7e64e42304cc24684f068eba8e30 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 15:31:18 +0530
Subject: [PATCH 187/250] Improved: added empty state for the ruleGroup history
 modal (#313)

---
 src/components/RuleGroupHistoryModal.vue | 9 +++++++--
 src/locales/en.json                      | 3 ++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/RuleGroupHistoryModal.vue b/src/components/RuleGroupHistoryModal.vue
index d8533792..71221685 100644
--- a/src/components/RuleGroupHistoryModal.vue
+++ b/src/components/RuleGroupHistoryModal.vue
@@ -6,12 +6,12 @@
           <ion-icon slot="icon-only" :icon="closeOutline" />
         </ion-button>
       </ion-buttons>
-      <ion-title>{{ translate("Group history") }}</ion-title>
+      <ion-title>{{ translate("Execution history") }}</ion-title>
     </ion-toolbar>
   </ion-header>
   
   <ion-content>
-    <ion-list>
+    <ion-list v-if="groupHistory.length">
       <ion-item v-for="history in groupHistory" :key="history.jobRunId">
         <ion-label>
           <h3>{{ getTime(history.startTime) }}</h3>
@@ -20,6 +20,9 @@
         <ion-badge color="dark" v-if="history.endTime">{{ timeTillRun(history.endTime) }}</ion-badge>
       </ion-item>
     </ion-list>
+    <div class="empty-state" v-else>
+      <p>{{ translate("No available history for rule.", { name: router.currentRoute.value.name?.toString().toLowerCase() }) }}</p>
+    </div>
   </ion-content>
 </template>
 
@@ -45,7 +48,9 @@ import { getDate, getTime, timeTillRun, hasError } from "@/utils";
 import { useStore } from "vuex";
 import { RuleService } from "@/services/RuleService";
 import logger from "@/logger";
+import { useRouter } from "vue-router";
 
+const router = useRouter();
 const store = useStore();
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 
diff --git a/src/locales/en.json b/src/locales/en.json
index 6736b0db..e92bdea6 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -56,6 +56,7 @@
   "Excluded": "Excluded",
   "Exclude": "Exclude {label}",
   "Exclude facility groups": "Exclude facility groups",
+  "Execution history": "Execution history",
   "Export product thresholds": "Export product thresholds",
   "Export product threshold jobs": "Export product threshold jobs",
   "Facilities": "Facilities",
@@ -97,7 +98,6 @@
   "Internal ID cannot be more than 20 characters.": "Internal ID cannot be more than 20 characters.",
   "Inventory channels": "Inventory channels",
   "global threshold": "global threshold",
-  "Group history": "Group history",
   "Group updated successfully.": "Group updated successfully.",
   "included": "included",
   "Include": "Include {label}",
@@ -121,6 +121,7 @@
   "New store pickup rule": "New store pickup rule",
   "New threshold rule": "New threshold rule",
   "New safety stock rule": "New safety stock rule",
+  "No available history for rule.": "No available history for {name} rule.",
   "No Capacity": "No Capacity",
   "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. To add a fulfillment capacity to this facility, use the custom option.": "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility.{space} To add a fulfillment capacity to this facility, use the custom option.",
   "No channel found for current product store.": "No channel found for current product store.",

From 70eecc7d885501bc2b1f21ee65d98cf3fb1a3d7d Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 18:52:55 +0530
Subject: [PATCH 188/250] Improved: used state for segment selection and 
 removed segment selection from create rule page (#313)

---
 src/store/modules/util/UtilState.ts      |  1 +
 src/store/modules/util/actions.ts        |  4 ++++
 src/store/modules/util/getters.ts        |  3 +++
 src/store/modules/util/index.ts          |  1 +
 src/store/modules/util/mutation-types.ts |  3 ++-
 src/store/modules/util/mutations.ts      |  3 +++
 src/views/CreateShippingRule.vue         | 22 ++++++-------------
 src/views/CreateStorePickupRule.vue      | 22 ++++++-------------
 src/views/InventoryChannels.vue          | 16 ++++++++------
 src/views/Shipping.vue                   | 22 ++++++++++---------
 src/views/StorePickup.vue                | 27 ++++++++++++------------
 11 files changed, 62 insertions(+), 62 deletions(-)

diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index 10a51842..a2c9e444 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -3,4 +3,5 @@ export default interface UtilState {
   appliedFilters: any;
   facilityGroups: any;
   facilities: any;
+  selectedSegment: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index dd3ed198..dd95ab49 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -128,6 +128,10 @@ const actions: ActionTree<UtilState, RootState> = {
 
   async updateFacilities({ commit, state }, payload) {
     commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: payload.facilities, isScrollable: state.facilities.isScrollable });
+  },
+
+  async updateSelectedSegment({ commit }, payload) {
+    commit(types.UTIL_SELECTED_SEGMENT_UPDATED , payload);
   }
 }
 
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index c8903d4f..8c27a37c 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -18,6 +18,9 @@ const getters: GetterTree<UtilState, RootState> = {
   isFacilitiesScrollable(state) {
     return state.facilities.isScrollable
   },
+  getSelectedSegment(state) {
+    return state.selectedSegment
+  },
 }
 
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 7e5c2a68..7f601ebf 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -24,6 +24,7 @@ const utilModule: Module<UtilState, RootState> = {
       list: [],
       isScrollable: true
     },
+    selectedSegment: ""
   },
   getters,
   actions,
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 55c2b817..9137d328 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -4,4 +4,5 @@ export const UTIL_APPLIED_FILTERS_UPDATED = SN_UTIL + '/APPLIED_FILTERS_UPDATED'
 export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
 export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
 export const UTIL_FACILITY_GROUPS_UPDATED = SN_UTIL + '/FACILITY_GROUPS_UPDATED'
-export const UTIL_FACILITY_LIST_UPDATED = SN_UTIL + '/FACILITY_LIST_UPDATED'
\ No newline at end of file
+export const UTIL_FACILITY_LIST_UPDATED = SN_UTIL + '/FACILITY_LIST_UPDATED'
+export const UTIL_SELECTED_SEGMENT_UPDATED = SN_UTIL + '/SELECTED_SEGMENT_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index 3f9122bf..68c8f834 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -41,5 +41,8 @@ const mutations: MutationTree <UtilState> = {
     state.facilities.list = payload.facilities
     state.facilities.isScrollable = payload.isScrollable
   },
+  [types.UTIL_SELECTED_SEGMENT_UPDATED](state, payload) {
+    state.selectedSegment = payload
+  },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 69afe129..11854581 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -2,7 +2,7 @@
   <ion-page>
     <ion-header :translucent="true">
       <ion-toolbar>
-        <ion-back-button slot="start" :default-href="getDefaultUrl()" />
+        <ion-back-button slot="start" default-href="/shipping" />
         <ion-title>{{ translate("New shipping rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
@@ -29,16 +29,10 @@
           </ion-card>
         </div>
       </section>
-      
+
       <div class="section-header">
-        <ion-segment v-model="selectedSegment">
-          <ion-segment-button value="RG_SHIPPING_FACILITY">
-            <ion-label>{{ translate("Facility") }}</ion-label>
-          </ion-segment-button>
-          <ion-segment-button value="RG_SHIPPING_CHANNEL">
-            <ion-label>{{ translate("Channel") }}</ion-label>
-          </ion-segment-button>
-        </ion-segment>
+        <h1 v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">{{ translate("Facilities") }}</h1>
+        <h1 v-else-if="selectedSegment === 'RG_SHIPPING_CHANNEL'">{{ translate("Channels") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 
       <section v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">
@@ -104,7 +98,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
 import { computed, onMounted, ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
@@ -153,10 +147,6 @@ onIonViewWillLeave(() => {
   store.dispatch("util/clearAppliedFilters")
 })
 
-function getDefaultUrl() {
-  return `shipping?groupTypeEnumId=${selectedSegment.value}`
-}
-
 async function openProductFacilityGroupModal(type: string) {
   const modal = await modalController.create({
     component: AddProductFacilityGroupModal,
@@ -231,7 +221,7 @@ async function createRule() {
     showToast(translate("Rule created successfully."))
     store.dispatch("rule/clearRuleState")
     store.dispatch("util/clearAppliedFilters")
-    router.push(getDefaultUrl());
+    router.push("/shipping");
   } catch(err: any) {
     logger.error(err);
     showToast(translate("Failed to create rule."))
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index d21111ff..02acd708 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -2,7 +2,7 @@
   <ion-page>
     <ion-header :translucent="true">
       <ion-toolbar>
-        <ion-back-button slot="start" :default-href="getDefaultUrl()" />
+        <ion-back-button slot="start" default-href="/store-pickup" />
         <ion-title>{{ translate("New store pickup rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
@@ -31,14 +31,8 @@
       </section>
 
       <div class="section-header">
-        <ion-segment v-model="selectedSegment">
-          <ion-segment-button value="RG_PICKUP_FACILITY">
-            <ion-label>{{ translate("Facility") }}</ion-label>
-          </ion-segment-button>
-          <ion-segment-button value="RG_PICKUP_CHANNEL">
-            <ion-label>{{ translate("Channel") }}</ion-label>
-          </ion-segment-button>
-        </ion-segment>
+        <h1 v-if="selectedSegment === 'RG_PICKUP_FACILITY'">{{ translate("Facilities") }}</h1>
+        <h1 v-else-if="selectedSegment === 'RG_PICKUP_CHANNEL'">{{ translate("Channels") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 
       <section v-if="selectedSegment === 'RG_PICKUP_FACILITY'">
@@ -104,7 +98,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonSegment, IonSegmentButton, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import { computed, onMounted, ref } from 'vue';
@@ -119,12 +113,12 @@ import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter();
-const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId)
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const appliedFilters = computed(() => store.getters["util/getAppliedFilters"])
 const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const selectedSegment = computed(() => store.getters["util/getSelectedSegment"]);
 
 const formData = ref({
   ruleName: '',
@@ -153,10 +147,6 @@ onIonViewWillLeave(() => {
   store.dispatch("util/clearAppliedFilters")
 })
 
-function getDefaultUrl() {
-  return `store-pickup?groupTypeEnumId=${selectedSegment.value}`
-}
-
 async function openProductFacilityGroupModal(type: string) {
   const modal = await modalController.create({
     component: AddProductFacilityGroupModal,
@@ -231,7 +221,7 @@ async function createRule() {
     showToast(translate("Rule created successfully."))
     store.dispatch("rule/clearRuleState")
     store.dispatch("util/clearAppliedFilters")
-    router.push(getDefaultUrl());
+    router.push("/store-pickup");
   } catch(err: any) {
     logger.error(err);
     showToast(translate("Failed to create rule."))
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 69944c65..00100567 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -5,7 +5,7 @@
         <ion-menu-button slot="start" />
         <ion-title slot="start">{{ translate("Inventory channels") }}</ion-title>
 
-        <ion-segment v-model="selectedSegment" slot="end">
+        <ion-segment :value="selectedSegment" @ionChange="updateSegment($event)" slot="end">
           <ion-segment-button value="channels">
             <ion-label>{{ translate("Channels") }}</ion-label>
           </ion-segment-button>
@@ -118,7 +118,7 @@
       </main>
     </ion-content>
 
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab v-if="selectedSegment === 'channels'" vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="openCreateGroupModal()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
@@ -127,8 +127,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, popoverController } from '@ionic/vue';
-import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, onIonViewDidEnter, popoverController } from '@ionic/vue';
+import { computed, onMounted, onUnmounted } from 'vue';
 import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@/i18n';
 import ShopActionsPopover from '@/components/ShopActionsPopover.vue'
@@ -141,9 +141,8 @@ import emitter from '@/event-bus';
 
 const store = useStore();
 
-const selectedSegment = ref("channels")
-
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
+const selectedSegment = computed(() => store.getters["util/getSelectedSegment"])
 
 onMounted(async() => {
   fetchInventoryChannels()
@@ -156,6 +155,7 @@ onUnmounted(() => {
 
 async function fetchInventoryChannels() {
   emitter.emit("presentLoader");
+  if(!selectedSegment.value || (selectedSegment.value !== 'channels' && selectedSegment.value !== 'publish')) store.dispatch("util/updateSelectedSegment", "channels");
   await Promise.allSettled([store.dispatch("channel/fetchInventoryChannels"), store.dispatch("util/fetchConfigFacilities")]);
   emitter.emit("dismissLoader");
 }
@@ -209,6 +209,10 @@ function getFacilityCount(group: any, facilityTypeId: string) {
   return group.selectedFacilities?.length ? group.selectedFacilities.filter((facility: any) => facility.facilityTypeId === facilityTypeId).length : 0;
 }
 
+function updateSegment(event: any) {
+  store.dispatch("util/updateSelectedSegment", event.detail.value);
+}
+
 </script>
 
 <style scoped>
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 1e9e0e89..c4b061dc 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -5,14 +5,14 @@
         <ion-menu-button slot="start" />
         <ion-title>{{ translate("Shipping") }}</ion-title>
 
-        <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()" slot="end">
+        <ion-segment :value="selectedSegment" @ionChange="updateSegment($event)" slot="end">
           <ion-segment-button value="RG_SHIPPING_FACILITY">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="RG_SHIPPING_CHANNEL">
             <ion-label>{{ translate("Product and channel") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="facility">
+          <ion-segment-button value="SHIPPING_FACILITY">
             <ion-label>{{ translate("Facility") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
@@ -53,7 +53,7 @@
       </ion-infinite-scroll>
     </ion-content>
 
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab v-if="selectedSegment !== 'SHIPPING_FACILITY'" vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="createShipping()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
@@ -62,8 +62,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { computed, onUnmounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewDidEnter, onIonViewWillLeave } from '@ionic/vue';
+import { computed, onMounted, onUnmounted, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@/i18n';
@@ -80,13 +80,13 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
+const selectedSegment = computed(() => store.getters["util/getSelectedSegment"]);
 
-const selectedSegment = ref("") as any;
 const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
-onIonViewWillEnter(async() => {
+onMounted(async() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
@@ -97,7 +97,7 @@ onUnmounted(() => {
 
 async function fetchRules() {
   emitter.emit("presentLoader");
-  selectedSegment.value = router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY";
+  if(!selectedSegment.value || (selectedSegment.value !== 'RG_SHIPPING_FACILITY' && selectedSegment.value !== 'RG_SHIPPING_CHANNEL' && selectedSegment.value !== 'SHIPPING_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_SHIPPING_FACILITY");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
 }
@@ -140,7 +140,9 @@ async function loadMoreFacilities(event: any) {
   });
 }
 
-async function updateRuleGroup() {
+async function updateSegment(event: any) {
+  store.dispatch("util/updateSelectedSegment", event.detail.value);
+
   emitter.emit("presentLoader");
   if(selectedSegment.value === 'facility') {
     isScrollingEnabled.value = false;
@@ -152,6 +154,6 @@ async function updateRuleGroup() {
 }
 
 function createShipping() {
-  router.push({ path: '/create-shipping', query: { groupTypeEnumId: selectedSegment.value } })
+  router.push("create-shipping");
 }
 </script>
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index f50fc1c4..19f8bc29 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -5,14 +5,14 @@
         <ion-menu-button slot="start" />
         <ion-title>{{ translate("Store pickup") }}</ion-title>
 
-        <ion-segment v-model="selectedSegment" @ionChange="updateRuleGroup()" slot="end">
+        <ion-segment :value="selectedSegment" @ionChange="updateSegment($event)" slot="end">
           <ion-segment-button value="RG_PICKUP_FACILITY">
             <ion-label>{{ translate("Product and facility") }}</ion-label>
           </ion-segment-button>
           <ion-segment-button value="RG_PICKUP_CHANNEL">
             <ion-label>{{ translate("Product and channel") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="facility">
+          <ion-segment-button value="PICKUP_FACILITY">
             <ion-label>{{ translate("Facility") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
@@ -54,7 +54,7 @@
       </ion-infinite-scroll>
     </ion-content>
 
-    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
+    <ion-fab v-if="selectedSegment !== 'PICKUP_FACILITY'" vertical="bottom" horizontal="end" slot="fixed">
       <ion-fab-button @click="createStorePickup()">
         <ion-icon :icon="addOutline" />
       </ion-fab-button>
@@ -63,8 +63,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { computed, onUnmounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillLeave, onIonViewDidEnter } from '@ionic/vue';
+import { computed, onMounted, onUnmounted, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
@@ -81,14 +81,13 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const rules = computed(() => store.getters["rule/getRules"]);
 const isScrollable = computed(() => store.getters["util/isFacilitiesScrollable"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
-
-const selectedSegment = ref("") as any;
+const selectedSegment = computed(() => store.getters["util/getSelectedSegment"]);
 
 const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
-onIonViewWillEnter(async() => {
+onMounted(() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
@@ -99,8 +98,8 @@ onUnmounted(() => {
 
 async function fetchRules() {
   emitter.emit("presentLoader");
-  selectedSegment.value = router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_PICKUP_FACILITY";
-  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : 'RG_PICKUP_FACILITY' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  if(!selectedSegment.value || (selectedSegment.value !== 'RG_PICKUP_FACILITY' && selectedSegment.value !== 'RG_PICKUP_CHANNEL' && selectedSegment.value !== 'PICKUP_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_PICKUP_FACILITY");
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value}), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
 }
 
@@ -141,18 +140,20 @@ async function loadMoreFacilities(event: any) {
   });
 }
 
-async function updateRuleGroup() {
+async function updateSegment(event: any) {
+  store.dispatch("util/updateSelectedSegment", event.detail.value);
+
   emitter.emit("presentLoader");
   if(selectedSegment.value === 'facility') {
     isScrollingEnabled.value = false;
     await fetchFacilities();
   } else {
-    await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value })
   }
   emitter.emit("dismissLoader");
 }
 
 function createStorePickup() {
-  router.push({ path: '/create-store-pickup', query: { groupTypeEnumId: selectedSegment.value } })
+  router.push("create-store-pickup")
 }
 </script>
\ No newline at end of file

From eb35110510d10278fd2dcb7edabd190a17038710 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 18:57:53 +0530
Subject: [PATCH 189/250] Improved: improved check for facility segment in
 store pickup and shipping page (#313)

---
 src/views/Shipping.vue    | 2 +-
 src/views/StorePickup.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index c4b061dc..b5b42cb6 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -20,7 +20,7 @@
     </ion-header>
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
-      <main v-if="selectedSegment !== 'facility'">
+      <main v-if="selectedSegment !== 'SHIPPING_FACILITY'">
         <template v-if="ruleGroup.ruleGroupId">
           <ScheduleRuleItem v-if="rules.length" />
 
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 19f8bc29..5c763682 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -20,7 +20,7 @@
     </ion-header>
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
-      <main v-if="selectedSegment !== 'facility'">
+      <main v-if="selectedSegment !== 'PICKUP_FACILITY'">
         <template v-if="ruleGroup.ruleGroupId">
           <ScheduleRuleItem v-if="rules.length" />
 

From 3f861478cb885e84bc17aa6badd3bc64c2a3df24 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 19:14:40 +0530
Subject: [PATCH 190/250] Improved: view entry hook to fetch rules (#313)

---
 src/views/CreateShippingRule.vue | 2 +-
 src/views/InventoryChannels.vue  | 6 +++---
 src/views/Shipping.vue           | 8 ++++----
 src/views/StorePickup.vue        | 6 +++---
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 11854581..bcce87bd 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -113,12 +113,12 @@ import emitter from '@/event-bus';
 
 const store = useStore();
 const router = useRouter();
-const selectedSegment = ref(router.currentRoute.value.query.groupTypeEnumId)
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const appliedFilters = computed(() => store.getters["util/getAppliedFilters"])
 const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const selectedSegment = computed(() => store.getters["util/getSelectedSegment"])
 
 const formData = ref({
   ruleName: '',
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 00100567..48c36a92 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -127,8 +127,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, onIonViewDidEnter, popoverController } from '@ionic/vue';
-import { computed, onMounted, onUnmounted } from 'vue';
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, onIonViewWillEnter, popoverController } from '@ionic/vue';
+import { computed, onUnmounted } from 'vue';
 import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@/i18n';
 import ShopActionsPopover from '@/components/ShopActionsPopover.vue'
@@ -144,7 +144,7 @@ const store = useStore();
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
 const selectedSegment = computed(() => store.getters["util/getSelectedSegment"])
 
-onMounted(async() => {
+onIonViewWillEnter(async() => {
   fetchInventoryChannels()
   emitter.on("productStoreOrConfigChanged", fetchInventoryChannels);
 })
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index b5b42cb6..34884a66 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -62,8 +62,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewDidEnter, onIonViewWillLeave } from '@ionic/vue';
-import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { computed, onUnmounted, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@/i18n';
@@ -86,7 +86,7 @@ const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
-onMounted(async() => {
+onIonViewWillEnter(async() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
@@ -98,7 +98,7 @@ onUnmounted(() => {
 async function fetchRules() {
   emitter.emit("presentLoader");
   if(!selectedSegment.value || (selectedSegment.value !== 'RG_SHIPPING_FACILITY' && selectedSegment.value !== 'RG_SHIPPING_CHANNEL' && selectedSegment.value !== 'SHIPPING_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_SHIPPING_FACILITY");
-  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: router.currentRoute.value.query.groupTypeEnumId ? router.currentRoute.value.query.groupTypeEnumId : "RG_SHIPPING_FACILITY" }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
 }
 
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 5c763682..6405f4da 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -63,8 +63,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillLeave, onIonViewDidEnter } from '@ionic/vue';
-import { computed, onMounted, onUnmounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { computed, onUnmounted, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
@@ -87,7 +87,7 @@ const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
-onMounted(() => {
+onIonViewWillEnter(() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })

From 5f6d48e5170f1272c5f71b12816d14c5846aa7e7 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 14 May 2024 19:31:20 +0530
Subject: [PATCH 191/250] Improved: fieldName in case of store pickup create
 rule, showing groupId if groupName not found (#313)

---
 src/components/AddProductFacilityGroupModal.vue | 2 +-
 src/components/RuleItem.vue                     | 4 ++--
 src/views/CreateStorePickupRule.vue             | 4 ++--
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index a4db8fc1..07785bf3 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -19,7 +19,7 @@
       <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId"  @click="updateSelectedGroups(group)">
         <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isAlreadySelected(group.facilityGroupId)">
-          {{ group.facilityGroupName }}
+          {{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}
         </ion-checkbox>
         <ion-note v-else slot="end" color="danger">{{ type === 'included' ? translate("excluded") : translate("included") }}</ion-note>
       </ion-item>
diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 7c78e88d..b94ab502 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -315,7 +315,7 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
       let facilityGroupIds = condition?.fieldValue.split(",")
         facilityGroupIds = facilityGroupIds.map((id: string) => {
           let group = facilityGroups.value.find((group: any) => group.facilityGroupId === id)
-          return group ? group.facilityGroupName : id
+          return group?.facilityGroupName ? group.facilityGroupName : id
         })
         return facilityGroupIds.join(", ")
     } else {
@@ -328,7 +328,7 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
       let facilities = condition?.fieldValue.split(",")
       facilities = facilities.map((id: string) => {
         let facility = configFacilities.value.find((facility: any) => facility.facilityId === id)
-        return facility ? facility.facilityName : id
+        return facility?.facilityName ? facility.facilityName : id
       })
       return facilities.join(", ")
     }
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 02acd708..839b03b2 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -247,7 +247,7 @@ function generateRuleConditions(ruleId: string) {
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-        "fieldName": "facilities",
+        "fieldName": "facilityGroups",
         "operator": "in",
         "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
         "multiValued": "Y"
@@ -259,7 +259,7 @@ function generateRuleConditions(ruleId: string) {
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-        "fieldName": "facilities",
+        "fieldName": "facilityGroups",
         "operator": "not-in",
         "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
         "multiValued": "Y"

From fcdefb7a4af6150b9a909dada707b1bdbe11c2ed Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 15 May 2024 11:06:17 +0530
Subject: [PATCH 192/250] Implemented: empty state in case of no channels or
 facility groups are present for selection in create rule page (#313)

---
 src/locales/en.json                 |  3 +-
 src/store/modules/util/actions.ts   |  3 +-
 src/views/CreateSafetyStockRule.vue | 16 +++++-
 src/views/CreateShippingRule.vue    | 87 ++++++++++++++++-------------
 src/views/CreateStorePickupRule.vue | 86 +++++++++++++++-------------
 src/views/CreateThresholdRule.vue   |  4 +-
 6 files changed, 111 insertions(+), 88 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index e92bdea6..13c077cc 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -124,8 +124,9 @@
   "No available history for rule.": "No available history for {name} rule.",
   "No Capacity": "No Capacity",
   "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. To add a fulfillment capacity to this facility, use the custom option.": "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility.{space} To add a fulfillment capacity to this facility, use the custom option.",
-  "No channel found for current product store.": "No channel found for current product store.",
+  "No channel found for selected product store. Either change the product store or associate channels with the product store.": "No channel found for selected product store. Either change the product store or associate channels with the product store.",
   "No facility found.": "No facility found.",
+  "No facility group found for selected product store. Either change the product store or associate facility groups with the product store.": "No facility group found for selected product store. Either change the product store or associate facility groups with the product store.",
   "No fulfillment capacity": "No fulfillment capacity",
   "No inventory channel found.": "No inventory channel found.",
   "No job found.": "No job found.",
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index dd95ab49..c2dd105f 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -28,9 +28,8 @@ const actions: ActionTree<UtilState, RootState> = {
   },
 
   async fetchFacilityGroups ({ commit, state }) {
-    let facilityGroups = JSON.parse(JSON.stringify(state.facilityGroups))
+    let facilityGroups = {};
 
-    if(facilityGroups.length && facilityGroups[0].productStoreId === store.state.user.currentEComStore.productStoreId) return;
     try {
       const resp = await UtilService.fetchFacilityGroups({ productStoreId: store.state.user.currentEComStore.productStoreId, pageSize: 100 });
 
diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 2045356d..c09e771f 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -35,7 +35,7 @@
         <h1>{{ translate("Facilities") }}</h1>
       </div>
 
-      <section>
+      <section v-if="facilityGroups.length">
         <ion-card>
           <ion-item lines="none">
             <ion-label>{{ translate("Included") }} <ion-text color="danger">*</ion-text></ion-label>
@@ -68,12 +68,15 @@
           </ion-card-content>
         </ion-card>
       </section>
+      <div v-else class="empty-state">
+        <ion-note>{{ translate("No facility group found for selected product store. Either change the product store or associate facility groups with the product store.") }}</ion-note>
+      </div>
 
       <ProductFilters />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createRule()">
+      <ion-fab-button :disabled="!facilityGroups.length" @click="createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -110,6 +113,7 @@ const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
 const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 onMounted(async () => {
   await Promise.allSettled([store.dispatch("util/fetchFacilityGroups")])
@@ -255,4 +259,10 @@ function validateSafetyStock(event: any) {
 function removeFacilityGroups(facilityGroupId: any, type: string) {
   formData.value.selectedFacilityGroups[type] = formData.value.selectedFacilityGroups[type].filter((group: any) => group.facilityGroupId !== facilityGroupId)
 }
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+.empty-state {
+  align-items: start;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index bcce87bd..605b0a30 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -35,42 +35,48 @@
         <h1 v-else-if="selectedSegment === 'RG_SHIPPING_CHANNEL'">{{ translate("Channels") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 
-      <section v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }} <ion-text color="danger">*</ion-text></ion-label>
-            <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
-              {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear" @click="openProductFacilityGroupModal('excluded')">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
-              {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
+      <template v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">
+        <section v-if="facilityGroups.length">
 
-      <section v-else>
-        <template v-if="configFacilities.length">
+          <ion-card>
+            <ion-item lines="none">
+              <ion-label>{{ translate("Included") }} <ion-text color="danger">*</ion-text></ion-label>
+              <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
+                {{ translate("Add") }}
+                <ion-icon :icon="addCircleOutline" slot="end" />
+              </ion-button>
+            </ion-item>
+            <ion-card-content>
+              <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
+                {{ group.facilityGroupName }}
+                <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
+              </ion-chip>
+            </ion-card-content>
+          </ion-card>
+  
+          <ion-card>
+            <ion-item lines="none"> 
+              <ion-label>{{ translate("Excluded") }}</ion-label>
+              <ion-button fill="clear" @click="openProductFacilityGroupModal('excluded')">
+                {{ translate("Add") }}
+                <ion-icon :icon="addCircleOutline" slot="end" />
+              </ion-button>
+            </ion-item>
+            <ion-card-content>
+              <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
+                {{ group.facilityGroupName }}
+                <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
+              </ion-chip>
+            </ion-card-content>
+          </ion-card>
+        </section>
+        <div v-else class="empty-state">
+          <ion-note>{{ translate("No facility group found for selected product store. Either change the product store or associate facility groups with the product store.") }}</ion-note>
+        </div>
+      </template>
+
+      <template v-else>
+        <section v-if="configFacilities.length">
           <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
             <ion-card-header>
               <div>
@@ -80,17 +86,17 @@
               <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
             </ion-card-header>
           </ion-card>
-        </template>
+        </section>
         <div v-else class="empty-state">
-          <ion-note>{{ translate("No channel found for current product store.") }}</ion-note>
+          <ion-note>{{ translate("No channel found for selected product store. Either change the product store or associate channels with the product store.") }}</ion-note>
         </div>
-      </section>
+      </template>
 
       <ProductFilters />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createRule()">
+      <ion-fab-button :disabled="selectedSegment === 'RG_SHIPPING_FACILITY' ? !facilityGroups.length : !configFacilities.length" @click="createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -119,6 +125,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 const selectedSegment = computed(() => store.getters["util/getSelectedSegment"])
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 const formData = ref({
   ruleName: '',
@@ -131,7 +138,7 @@ const formData = ref({
 }) as any;
 
 onMounted(async () => {
-  await store.dispatch("util/fetchConfigFacilities");
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
 })
 
 onIonViewWillLeave(() => {
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 839b03b2..a7740062 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -35,42 +35,47 @@
         <h1 v-else-if="selectedSegment === 'RG_PICKUP_CHANNEL'">{{ translate("Channels") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 
-      <section v-if="selectedSegment === 'RG_PICKUP_FACILITY'">
-        <ion-card>
-          <ion-item lines="none">
-            <ion-label>{{ translate("Included") }} <ion-text color="danger">*</ion-text></ion-label>
-            <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
-              {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-
-        <ion-card>
-          <ion-item lines="none"> 
-            <ion-label>{{ translate("Excluded") }}</ion-label>
-            <ion-button fill="clear" @click="openProductFacilityGroupModal('excluded')">
-              {{ translate("Add") }}
-              <ion-icon :icon="addCircleOutline" slot="end" />
-            </ion-button>
-          </ion-item>
-          <ion-card-content>
-            <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
-              {{ group.facilityGroupName }}
-              <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
-            </ion-chip>
-          </ion-card-content>
-        </ion-card>
-      </section>
+      <template v-if="selectedSegment === 'RG_PICKUP_FACILITY'">
+        <section v-if="facilityGroups.length">
+          <ion-card>
+            <ion-item lines="none">
+              <ion-label>{{ translate("Included") }} <ion-text color="danger">*</ion-text></ion-label>
+              <ion-button fill="clear" @click="openProductFacilityGroupModal('included')">
+                {{ translate("Add") }}
+                <ion-icon :icon="addCircleOutline" slot="end" />
+              </ion-button>
+            </ion-item>
+            <ion-card-content>
+              <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
+                {{ group.facilityGroupName }}
+                <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
+              </ion-chip>
+            </ion-card-content>
+          </ion-card>
+  
+          <ion-card>
+            <ion-item lines="none"> 
+              <ion-label>{{ translate("Excluded") }}</ion-label>
+              <ion-button fill="clear" @click="openProductFacilityGroupModal('excluded')">
+                {{ translate("Add") }}
+                <ion-icon :icon="addCircleOutline" slot="end" />
+              </ion-button>
+            </ion-item>
+            <ion-card-content>
+              <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
+                {{ group.facilityGroupName }}
+                <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
+              </ion-chip>
+            </ion-card-content>
+          </ion-card>
+        </section>
+        <div v-else class="empty-state">
+          <ion-note>{{ translate("No facility group found for selected product store. Either change the product store or associate facility groups with the product store.") }}</ion-note>
+        </div>
+      </template>
 
-      <section v-else>
-        <template v-if="configFacilities.length">
+      <template v-else>
+        <section v-if="configFacilities.length">
           <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
             <ion-card-header>
               <div>
@@ -80,17 +85,17 @@
               <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />
             </ion-card-header>
           </ion-card>
-        </template>
+        </section>
         <div v-else class="empty-state">
-          <ion-note>{{ translate("No channel found for current product store.") }}</ion-note>
+          <ion-note>{{ translate("No channel found for selected product store. Either change the product store or associate channels with the product store.") }}</ion-note>
         </div>
-      </section>
+      </template>
 
       <ProductFilters />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createRule()">
+      <ion-fab-button :disabled="selectedSegment === 'RG_PICKUP_FACILITY' ? !facilityGroups.length : !configFacilities.length" @click="createRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>
@@ -119,6 +124,7 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 const selectedSegment = computed(() => store.getters["util/getSelectedSegment"]);
+const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 const formData = ref({
   ruleName: '',
@@ -131,7 +137,7 @@ const formData = ref({
 }) as any;
 
 onMounted(async () => {
-  await store.dispatch("util/fetchConfigFacilities");
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
 })
 
 onIonViewWillLeave(() => {
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index a2c8f3bd..a73e9939 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -46,14 +46,14 @@
         </ion-card>
       </section>
       <div v-else class="empty-state">
-        <ion-note>{{ translate("No channel found for current product store.") }}</ion-note>
+        <ion-note>{{ translate("No channel found for selected product store. Either change the product store or associate channels with the product store.") }}</ion-note>
       </div>
 
       <ProductFilters />
     </ion-content>
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
-      <ion-fab-button @click="createThresholdRule()">
+      <ion-fab-button :disabled="!configFacilities.length" @click="createThresholdRule()">
         <ion-icon :icon="saveOutline" />
       </ion-fab-button>
     </ion-fab>

From acd2b8dc8271b872a44dc71881d6316365855ec9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 15 May 2024 11:44:30 +0530
Subject: [PATCH 193/250] Improved: logic for store selector from menu footer
 while on create rule page and fixed store selector emitter not unmounting
 (#313)

---
 src/views/CreateSafetyStockRule.vue | 20 ++++++++++++++++----
 src/views/CreateShippingRule.vue    | 21 +++++++++++++++++----
 src/views/CreateStorePickupRule.vue | 21 +++++++++++++++++----
 src/views/CreateThresholdRule.vue   | 28 +++++++++++++++++++---------
 src/views/InventoryChannels.vue     |  6 +++---
 src/views/SafetyStock.vue           |  6 +++---
 src/views/Shipping.vue              |  6 +++---
 src/views/StorePickup.vue           |  8 ++++----
 src/views/Threshold.vue             |  6 +++---
 9 files changed, 85 insertions(+), 37 deletions(-)

diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index c09e771f..3de491d1 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -84,11 +84,11 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonText, IonTitle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonPage, IonText, IonTitle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
-import { computed, onMounted, ref } from 'vue';
+import { computed, ref } from 'vue';
 import { useStore } from 'vuex';
 import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
 import { RuleService } from '@/services/RuleService';
@@ -115,8 +115,9 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
-onMounted(async () => {
-  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups")])
+onIonViewWillEnter(async() => {
+  fetchStoreConfig();
+  emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
 })
 
 onIonViewWillLeave(() => {
@@ -129,8 +130,19 @@ onIonViewWillLeave(() => {
     }
   }
   store.dispatch("util/clearAppliedFilters")
+  emitter.off("productStoreOrConfigChanged", fetchStoreConfig);
 })
 
+async function fetchStoreConfig() {
+  emitter.emit("presentLoader");
+  await store.dispatch("util/fetchFacilityGroups")
+  formData.value.selectedFacilityGroups = {
+    included: [],
+    excluded: []
+  }
+  emitter.emit("dismissLoader");
+}
+
 async function openProductFacilityGroupModal(type: string) {
   const modal = await modalController.create({
     component: AddProductFacilityGroupModal,
diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 605b0a30..408b55d6 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -104,8 +104,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
-import { computed, onMounted, ref } from 'vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
+import { computed, ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
@@ -137,8 +137,9 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 
-onMounted(async () => {
-  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
+onIonViewWillEnter(async() => {
+  fetchStoreConfig();
+  emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
 })
 
 onIonViewWillLeave(() => {
@@ -152,8 +153,20 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
+  emitter.off("productStoreOrConfigChanged", fetchStoreConfig);
 })
 
+async function fetchStoreConfig() {
+  emitter.emit("presentLoader");
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
+  formData.value.selectedFacilityGroups = {
+    included: [],
+    excluded: []
+  }
+  formData.value.selectedConfigFacilites = []
+  emitter.emit("dismissLoader");
+}
+
 async function openProductFacilityGroupModal(type: string) {
   const modal = await modalController.create({
     component: AddProductFacilityGroupModal,
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index a7740062..2a5a5a58 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -103,10 +103,10 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
-import { computed, onMounted, ref } from 'vue';
+import { computed, ref } from 'vue';
 import ProductFilters from '@/components/ProductFilters.vue';
 import { useRouter } from 'vue-router';
 import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
@@ -136,8 +136,9 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 
-onMounted(async () => {
-  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
+onIonViewWillEnter(async() => {
+  fetchStoreConfig();
+  emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
 })
 
 onIonViewWillLeave(() => {
@@ -151,8 +152,20 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
+  emitter.off("productStoreOrConfigChanged", fetchStoreConfig);
 })
 
+async function fetchStoreConfig() {
+  emitter.emit("presentLoader");
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
+  formData.value.selectedFacilityGroups = {
+    included: [],
+    excluded: []
+  }
+  formData.value.selectedConfigFacilites = []
+  emitter.emit("dismissLoader");
+}
+
 async function openProductFacilityGroupModal(type: string) {
   const modal = await modalController.create({
     component: AddProductFacilityGroupModal,
diff --git a/src/views/CreateThresholdRule.vue b/src/views/CreateThresholdRule.vue
index a73e9939..a0c8ab7d 100644
--- a/src/views/CreateThresholdRule.vue
+++ b/src/views/CreateThresholdRule.vue
@@ -80,12 +80,13 @@ import {
   IonText,
   IonTitle,
   IonToolbar,
+  onIonViewWillEnter,
   onIonViewWillLeave
 } from '@ionic/vue';
 import { saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
-import { computed, onMounted, ref } from 'vue';
+import { computed, ref } from 'vue';
 import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
 import { showToast } from '@/utils';
@@ -100,6 +101,17 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 
+const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
+const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
+const rules = computed(() => store.getters["rule/getRules"]);
+const total = computed(() => store.getters["rule/getTotalRulesCount"])
+const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
+
+onIonViewWillEnter(async() => {
+  fetchStoreConfig();
+  emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
+})
+
 onIonViewWillLeave(() => {
   formData.value = {
     ruleName: '',
@@ -107,17 +119,15 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
+  emitter.off("productStoreOrConfigChanged", fetchStoreConfig);
 })
 
-const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
-const appliedFilters = computed(() => store.getters["util/getAppliedFilters"]);
-const rules = computed(() => store.getters["rule/getRules"]);
-const total = computed(() => store.getters["rule/getTotalRulesCount"])
-const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
-
-onMounted(async () => {
+async function fetchStoreConfig() {
+  emitter.emit("presentLoader");
   await store.dispatch("util/fetchConfigFacilities");
-})
+  formData.value.selectedConfigFacilites = [];
+  emitter.emit("dismissLoader");
+}
 
 function toggleFacilitySelection(facilityId: any) {
   if(isFacilitySelected(facilityId)) {
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 48c36a92..4ec8770f 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -127,8 +127,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, onIonViewWillEnter, popoverController } from '@ionic/vue';
-import { computed, onUnmounted } from 'vue';
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave, popoverController } from '@ionic/vue';
+import { computed } from 'vue';
 import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@/i18n';
 import ShopActionsPopover from '@/components/ShopActionsPopover.vue'
@@ -149,7 +149,7 @@ onIonViewWillEnter(async() => {
   emitter.on("productStoreOrConfigChanged", fetchInventoryChannels);
 })
 
-onUnmounted(() => {
+onIonViewWillLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchInventoryChannels);
 })
 
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 9aa25a13..45e77cab 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -30,13 +30,13 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
 import { useRouter } from "vue-router";
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useStore } from 'vuex';
-import { computed, onUnmounted } from 'vue';
+import { computed } from 'vue';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
 
@@ -51,7 +51,7 @@ onIonViewWillEnter(async() => {
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
 
-onUnmounted(() => {
+onIonViewWillLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchRules);
 })
 
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 34884a66..c1822408 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -62,8 +62,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { computed, onUnmounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
+import { computed, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@/i18n';
@@ -91,7 +91,7 @@ onIonViewWillEnter(async() => {
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
 
-onUnmounted(() => {
+onIonViewWillLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchRules);
 })
 
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 6405f4da..a510df42 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -63,8 +63,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { computed, onUnmounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
+import { computed, ref } from 'vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
@@ -87,12 +87,12 @@ const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
-onIonViewWillEnter(() => {
+onIonViewWillEnter(async() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
 
-onUnmounted(() => {
+onIonViewWillLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchRules);
 })
 
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index b644c7d6..a3bcef8f 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -30,12 +30,12 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonTitle, IonToolbar, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
 import { addOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
-import { computed, onUnmounted } from 'vue';
+import { computed } from 'vue';
 import { useStore } from 'vuex';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
@@ -51,7 +51,7 @@ onIonViewWillEnter(async() => {
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
 
-onUnmounted(() => {
+onIonViewWillLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchRules);
 })
 

From 15fff79d36b7c89a7428586398442bfe8e42af29 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 15 May 2024 11:49:31 +0530
Subject: [PATCH 194/250] Improved: fieldName for safety stock rule creation
 for group condition (#313)

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

diff --git a/src/views/CreateSafetyStockRule.vue b/src/views/CreateSafetyStockRule.vue
index 3de491d1..7e6b7593 100644
--- a/src/views/CreateSafetyStockRule.vue
+++ b/src/views/CreateSafetyStockRule.vue
@@ -178,7 +178,7 @@ function generateRuleConditions(ruleId: string) {
     conditions.push({
       "ruleId": ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilities",
+      "fieldName": "facilityGroups",
       "operator": "in",
       "fieldValue": includedFacilityGroupIds.length > 1 ? includedFacilityGroupIds.join(",") : includedFacilityGroupIds[0],
       "multiValued": "Y"
@@ -190,7 +190,7 @@ function generateRuleConditions(ruleId: string) {
     conditions.push({
       "ruleId": ruleId,
       "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilities",
+      "fieldName": "facilityGroups",
       "operator": "not-in",
       "fieldValue": excludedFacilityGroupIds.length > 1 ? excludedFacilityGroupIds.join(",") : excludedFacilityGroupIds[0],
       "multiValued": "Y"

From 5ac8d42b9927992bd1dbdb8380a02d53e6a35329 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 15 May 2024 12:02:31 +0530
Subject: [PATCH 195/250] Improved: added danger astrick for the facilities
 section header (#313)

---
 src/views/CreateShippingRule.vue    | 2 +-
 src/views/CreateStorePickupRule.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/CreateShippingRule.vue b/src/views/CreateShippingRule.vue
index 408b55d6..4496cc95 100644
--- a/src/views/CreateShippingRule.vue
+++ b/src/views/CreateShippingRule.vue
@@ -31,7 +31,7 @@
       </section>
 
       <div class="section-header">
-        <h1 v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">{{ translate("Facilities") }}</h1>
+        <h1 v-if="selectedSegment === 'RG_SHIPPING_FACILITY'">{{ translate("Facilities") }} <ion-text color="danger">*</ion-text></h1>
         <h1 v-else-if="selectedSegment === 'RG_SHIPPING_CHANNEL'">{{ translate("Channels") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 
diff --git a/src/views/CreateStorePickupRule.vue b/src/views/CreateStorePickupRule.vue
index 2a5a5a58..dc9ff33a 100644
--- a/src/views/CreateStorePickupRule.vue
+++ b/src/views/CreateStorePickupRule.vue
@@ -31,7 +31,7 @@
       </section>
 
       <div class="section-header">
-        <h1 v-if="selectedSegment === 'RG_PICKUP_FACILITY'">{{ translate("Facilities") }}</h1>
+        <h1 v-if="selectedSegment === 'RG_PICKUP_FACILITY'">{{ translate("Facilities") }} <ion-text color="danger">*</ion-text></h1>
         <h1 v-else-if="selectedSegment === 'RG_PICKUP_CHANNEL'">{{ translate("Channels") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 

From d828b4247d2c2d41131ebc9cdfc7a22e730eaa6a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 15 May 2024 15:54:31 +0530
Subject: [PATCH 196/250] Improved: disabled click event over list item if the
 item is already applied in another type (#320)

---
 src/components/AddProductFacilityGroupModal.vue | 2 +-
 src/components/AddProductFiltersModal.vue       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/AddProductFacilityGroupModal.vue b/src/components/AddProductFacilityGroupModal.vue
index a4db8fc1..57c6665b 100644
--- a/src/components/AddProductFacilityGroupModal.vue
+++ b/src/components/AddProductFacilityGroupModal.vue
@@ -16,7 +16,7 @@
 
   <ion-content>
     <ion-list v-if="facilityGroups.length">
-      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId"  @click="updateSelectedGroups(group)">
+      <ion-item v-for="group in facilityGroups" :key="group.facilityGroupId"  @click="!isAlreadyApplied(group.facilityGroupId) ? updateSelectedGroups(group) : null">
         <ion-label v-if="isAlreadyApplied(group.facilityGroupId)">{{ group.facilityGroupName }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(group.facilityGroupId)" :checked="isAlreadySelected(group.facilityGroupId)">
           {{ group.facilityGroupName }}
diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index 516ec0ea..37b7bcc9 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -24,7 +24,7 @@
       </ion-item>
     </div>
     <ion-list v-else-if="facetOptions.length">
-      <ion-item v-for="option in facetOptions" :key="option.id"  @click="updateSelectedValues(option.id)">
+      <ion-item v-for="option in facetOptions" :key="option.id"  @click="!isAlreadyApplied(option.id) ? updateSelectedValues(option.id) : null">
         <ion-label v-if="isAlreadyApplied(option.id)">{{ option.label }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="selectedValues.includes(option.id)">
           {{ option.label }}

From fb156939043571e1cbca3b3c8c2d7c146f8999c3 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 15 May 2024 18:58:12 +0530
Subject: [PATCH 197/250] Improved: logic for fetching facility count (#291)

---
 src/views/InventoryChannels.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 4dde0ef3..b9d8bf7d 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -205,11 +205,13 @@ async function openLinkThresholdFacilitiesToGroupModal(group: any) {
   return popover.present();
 }
 
-function getFacilityCount(group: any, facilityTypeId: string) {
+function getFacilityCount(channel: any, facilityTypeId: string) {
+  if(!channel.selectedFacilities?.length) return 0;
+
   if(facilityTypeId === 'STORE') {
-    return group.selectedFacilities?.length ? group.selectedFacilities.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "OUTLET_STORE").length : 0;
+    return channel.selectedFacilities.filter((facility: any) => facility.facilityTypeId === "RETAIL_STORE" || facility.facilityTypeId === "OUTLET_STORE").length;
   } else {
-    return group.selectedFacilities?.length ? group.selectedFacilities.filter((facility: any) => facility.facilityTypeId === "WAREHOUSE" || facility.facilityTypeId === "OUTLET_WAREHOUSE").length : 0;
+    return channel.selectedFacilities.filter((facility: any) => facility.facilityTypeId === "WAREHOUSE" || facility.facilityTypeId === "OUTLET_WAREHOUSE").length;
   }
 }
 

From c733c8262cf72c3356d182ba2b65791536e8bf1c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 16 May 2024 10:53:21 +0530
Subject: [PATCH 198/250] Improved: logic to not call api when hitting update
 without chaning threshold value (#313)

---
 src/components/RuleItem.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index b94ab502..be94517c 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -156,7 +156,7 @@ async function editThreshold() {
       attributes: {
         // Added check to not allow mainly .(period) and other special characters to be entered in the alert input
         onkeydown: ($event: any) => {
-          if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test($event.key)) $event.preventDefault();
+          if(/[`!@#$%^&*()_+\-=\\|,.<>?~^e]/.test($event.key) && event.key !== 'Backspace') $event.preventDefault();
         }
       }
     }],
@@ -172,6 +172,8 @@ async function editThreshold() {
           return false;
         }
 
+        if(data.threshold === props.rule.ruleActions[0].fieldValue) return;
+
         emitter.emit("presentLoader");
 
         const rule = JSON.parse(JSON.stringify(props.rule))
@@ -232,6 +234,8 @@ async function editSafetyStock() {
           return false;
         }
 
+        if(data.safetyStock === props.rule.ruleActions[0].fieldValue) return;
+
         emitter.emit("presentLoader");
 
         const rule = JSON.parse(JSON.stringify(props.rule))

From c2f83198504f24fcb69c984d8099035c8cb282c0 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 16 May 2024 10:56:46 +0530
Subject: [PATCH 199/250] Improved: added slot to the ion-title in storePickup
 and shipping page (#313)

---
 src/views/Shipping.vue    | 2 +-
 src/views/StorePickup.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index b049aaf1..ce36f835 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-menu-button slot="start" />
-        <ion-title>{{ translate("Shipping") }}</ion-title>
+        <ion-title slot="start">{{ translate("Shipping") }}</ion-title>
 
         <ion-segment :value="selectedSegment" @ionChange="updateSegment($event)" slot="end">
           <ion-segment-button value="RG_SHIPPING_FACILITY">
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index ce0d82c6..c8348355 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-menu-button slot="start" />
-        <ion-title>{{ translate("Store pickup") }}</ion-title>
+        <ion-title slot="start">{{ translate("Store pickup") }}</ion-title>
 
         <ion-segment :value="selectedSegment" @ionChange="updateSegment($event)" slot="end">
           <ion-segment-button value="RG_PICKUP_FACILITY">

From 06aaf7465001bba10516d59a74dec174f30b1345 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 16 May 2024 11:31:18 +0530
Subject: [PATCH 200/250] Fixed: ionfinite scrolling rerendering the list
 (#313)

---
 src/components/AddProductFiltersModal.vue | 12 +-----------
 1 file changed, 1 insertion(+), 11 deletions(-)

diff --git a/src/components/AddProductFiltersModal.vue b/src/components/AddProductFiltersModal.vue
index 37b7bcc9..e030119f 100644
--- a/src/components/AddProductFiltersModal.vue
+++ b/src/components/AddProductFiltersModal.vue
@@ -17,13 +17,7 @@
   <ion-content>
     <ion-searchbar :placeholder="translate('Search', { label })" v-model="queryString" @keyup.enter="search()"/>
 
-    <div class="empty-state" v-if="isLoading">
-      <ion-item lines="none">
-        <ion-spinner name="crescent" slot="start" />
-        {{ translate("Fetching", { label }) }}
-      </ion-item>
-    </div>
-    <ion-list v-else-if="facetOptions.length">
+    <ion-list v-if="facetOptions.length">
       <ion-item v-for="option in facetOptions" :key="option.id"  @click="!isAlreadyApplied(option.id) ? updateSelectedValues(option.id) : null">
         <ion-label v-if="isAlreadyApplied(option.id)">{{ option.label }}</ion-label>
         <ion-checkbox v-if="!isAlreadyApplied(option.id)" :checked="selectedValues.includes(option.id)">
@@ -69,7 +63,6 @@ import {
   IonList,
   IonNote,
   IonSearchbar,
-  IonSpinner,
   IonTitle,
   IonToolbar,
   modalController
@@ -84,7 +77,6 @@ const queryString = ref('');
 const facetOptions = ref([]) as any;
 const isScrollable = ref(true);
 const selectedValues = ref([]) as any;
-let isLoading = ref(false)
 
 const props = defineProps(["label", "facetToSelect", "searchfield", "type"]);
 const store = useStore();
@@ -104,7 +96,6 @@ function search() {
 }
 
 async function getFilters(vSize?: any, vIndex?: any) {
-  isLoading.value = true;
   const viewSize = vSize ? vSize : process.env.VUE_APP_VIEW_SIZE;
   const viewIndex = vIndex ? vIndex : 0;
   
@@ -131,7 +122,6 @@ async function getFilters(vSize?: any, vIndex?: any) {
     facetOptions.value = [];
     isScrollable.value = false;
   }
-  isLoading.value = false;
 }
 
 async function loadMoreFilters(event: any){

From 5acd19996e0c8738ee29f46d99349c806b54cb77 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 16 May 2024 12:35:15 +0530
Subject: [PATCH 201/250] Improved: logic to show empty state message in case
 no filters are selected (#308)

---
 src/components/RuleItem.vue               | 66 ++++++++++++++---------
 src/locales/en.json                       |  2 +
 src/views/CreateUpdateStorePickupRule.vue |  2 +-
 3 files changed, 44 insertions(+), 26 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index b8f8214c..fe7a324b 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -41,7 +41,7 @@
           <ion-label>{{ translate("Channels") }}</ion-label>
         </ion-item-divider>
 
-        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FACILITIES')" lines="none">
+        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FACILITIES')" lines="full">
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FACILITIES") }}</ion-label>
         </ion-item>
@@ -56,37 +56,49 @@
           <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
         </ion-item>
-        <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'not-in')">
+        <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'not-in')">
           <ion-icon slot="start" :icon="closeCircleOutline"/>
           <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "not-in") }}</ion-label>
         </ion-item>
       </template>
 
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Product tags") }}</ion-label>
-      </ion-item-divider>
+      <template v-if="areProductFiltersSelected()">
+        <ion-item-divider color="light">
+          <ion-label>{{ translate("Product tags") }}</ion-label>
+        </ion-item-divider>
 
-      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
-        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
-      </ion-item>
-      <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
-        <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
-      </ion-item>
+        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
+          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
+        </ion-item>
+        <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
+          <ion-icon slot="start" :icon="closeCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
+        </ion-item>
 
-      <ion-item-divider color="light">
-        <ion-label>{{ translate("Product features") }}</ion-label>
-      </ion-item-divider>
+        <ion-item-divider color="light">
+          <ion-label>{{ translate("Product features") }}</ion-label>
+        </ion-item-divider>
 
-      <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
-        <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
-      </ion-item>
-      <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
-        <ion-icon slot="start" :icon="closeCircleOutline"/>
-        <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
-      </ion-item>
+        <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
+          <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
+        </ion-item>
+        <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
+          <ion-icon slot="start" :icon="closeCircleOutline"/>
+          <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "not-in") }}</ion-label>
+        </ion-item>
+      </template>
+      <template v-else>
+        <ion-item-divider color="light">
+          <ion-label>{{ translate("Products") }}</ion-label>
+        </ion-item-divider>
+
+        <ion-item lines="full">
+          <ion-icon slot="start" :icon="shirtOutline"/>
+          <ion-label class="ion-text-wrap">{{ translate("All products selected.") }}</ion-label>
+        </ion-item>
+      </template>
 
       <ion-item lines="none">
         <ion-button @click="editRule()" size="default" fill="clear">{{ translate("Edit rule") }}</ion-button>
@@ -101,7 +113,7 @@
 <script setup lang="ts">
 import { IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonChip, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonToggle, alertController } from '@ionic/vue';
 import { computed, defineProps, onMounted, ref } from 'vue';
-import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, pulseOutline, sendOutline, storefrontOutline } from 'ionicons/icons';
+import { archiveOutline, checkmarkDoneCircleOutline, chevronDownOutline, chevronUpOutline, closeCircleOutline, globeOutline, pulseOutline, sendOutline, shirtOutline, storefrontOutline } from 'ionicons/icons';
 import { useRouter } from 'vue-router';
 import { translate } from '@/i18n';
 import { RuleService } from '@/services/RuleService';
@@ -314,6 +326,10 @@ function isRuleConditionAvailable(conditionTypeEnumId: string, fieldName?: strin
   else return props.rule.ruleConditions?.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId)?.fieldValue
 }
 
+function areProductFiltersSelected() {
+  return props.rule.ruleConditions.some((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldValue);
+}
+
 async function updateRulePickup(event: any) {
   event.stopImmediatePropagation();
   const isChecked = !event.target.checked;
diff --git a/src/locales/en.json b/src/locales/en.json
index 6f2f87f0..5e6cb3ec 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -2,6 +2,7 @@
   "A store repesents a company or a unique catalog of products. If your OMS is connected to multiple eCommerce stores sellling different collections of products, you may have multiple Product Stores set up in HotWax Commerce.": "A store repesents a company or a unique catalog of products. If your OMS is connected to multiple eCommerce stores sellling different collections of products, you may have multiple Product Stores set up in HotWax Commerce.",
   "add": "add",
   "Add": "Add",
+  "All products selected.": "All products selected.",
   "App": "App",
   "Apply": "Apply",
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
@@ -150,6 +151,7 @@
   "Please include atleast one facility group.": "Please include atleast one facility group.",
   "Please fill in all the required fields.": "Please fill in all the required fields.",
   "Please select atleast one config facility.": "Please select atleast one config facility.",
+  "Products": "Products",
   "Product and facility": "Product and facility",
   "Product and channel": "Product and channel",
   "Product list": "Product list",
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index c5044c86..58ac9578 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -39,7 +39,7 @@
             <ion-label>{{ translate("Channel") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
-      </div else>
+      </div>
       <div v-else class="section-header">
         <h1 v-if="selectedSegment === 'RG_PICKUP_FACILITY'">{{ translate("Facility") }}</h1>
         <h1 v-else>{{ translate("Channel") }}</h1>

From 7b14a25eb57499f3b43e483c702430b0194de98b Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 16 May 2024 18:29:44 +0530
Subject: [PATCH 202/250] Reverted: unwanted optional condition in ternary
 operator (#308)

---
 src/views/CreateUpdateSafetyStockRule.vue | 2 +-
 src/views/CreateUpdateShippingRule.vue    | 2 +-
 src/views/CreateUpdateStorePickupRule.vue | 2 +-
 src/views/CreateUpdateThresholdRule.vue   | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index b9f07677..9fea0d5f 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -125,7 +125,7 @@ onIonViewWillEnter(async () => {
         currentRule.value = resp.data[0];
 
         formData.value.ruleName = currentRule.value.ruleName;
-        formData.value.safetyStock = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
+        formData.value.safetyStock = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0].fieldValue : ''
 
         const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
         const includedGroupIds = includedGroups.fieldValue ? includedGroups.fieldValue.split(",") : []
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index c28f8d2e..2a5a59b4 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -155,7 +155,7 @@ onIonViewWillEnter(async () => {
         currentRule.value = resp.data[0];
 
         formData.value.ruleName = currentRule.value.ruleName;
-        formData.value.isBrokeringAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
+        formData.value.isBrokeringAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0].fieldValue : ''
 
         if(selectedSegment.value === "RG_SHIPPING_FACILITY") {
           const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 58ac9578..8a6ace07 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -155,7 +155,7 @@ onIonViewWillEnter(async () => {
         currentRule.value = resp.data[0];
 
         formData.value.ruleName = currentRule.value.ruleName;
-        formData.value.isPickupAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
+        formData.value.isPickupAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0].fieldValue : ''
 
         if(selectedSegment.value === "RG_PICKUP_FACILITY") {
           const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index 43ad5b59..458e2d26 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -107,7 +107,7 @@ onIonViewWillEnter(async () => {
         currentRule.value = resp.data[0];
 
         formData.value.ruleName = currentRule.value.ruleName;
-        formData.value.threshold = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0]?.fieldValue : ''
+        formData.value.threshold = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0].fieldValue : ''
 
         const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
         formData.value.selectedConfigFacilites = facilityCondition.fieldValue?.split(",");

From 8fbb1fede061b5f8bfedb5a495f91701d486b2d4 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 17 May 2024 10:39:11 +0530
Subject: [PATCH 203/250] Improved: method names, code for optimal solution
 (#282)

---
 src/components/ScheduleRuleItem.vue |  4 ++--
 src/views/SafetyStock.vue           | 10 +++++++---
 src/views/Shipping.vue              | 10 +++++++---
 src/views/StorePickup.vue           | 13 +++++++++----
 src/views/Threshold.vue             |  9 ++++++---
 5 files changed, 31 insertions(+), 15 deletions(-)

diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index 83cb1227..f58c4938 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -24,7 +24,7 @@
       
         <ion-item lines="none">
           <ion-button fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
-          <ion-button color="medium" fill="clear" slot="end" @click="OpenScheduleActionsPopover($event)">
+          <ion-button color="medium" fill="clear" slot="end" @click="openScheduleActionsPopover($event)">
             <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
           </ion-button>
         </ion-item>
@@ -52,7 +52,7 @@ const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 
 const cronExpressions = JSON.parse(process.env?.VUE_APP_CRON_EXPRESSIONS as string)
 
-async function OpenScheduleActionsPopover(event: Event) {
+async function openScheduleActionsPopover(event: Event) {
   const popover = await popoverController.create({
     component: ScheduleActionsPopover,
     showBackdrop: false,
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 421c6609..259b469e 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -12,7 +12,7 @@
         <ScheduleRuleItem v-if="rules.length" />
 
         <section>
-          <ion-reorder-group :disabled="false" @ionItemReorder="reorderingRules = doReorder($event, reorderingRules)">
+          <ion-reorder-group :disabled="false" @ionItemReorder="updateReorderingRules($event)">
             <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
           </ion-reorder-group>
         </section>
@@ -88,8 +88,8 @@ async function saveReorder() {
     await RuleService.updateRule(rule, rule.ruleId)
   }))
 
-  const isFailedToUpdateSomeRUle = responses.some((response) => response.status === 'rejected')
-  if(isFailedToUpdateSomeRUle) {
+  const isFailedToUpdateSomeRule = responses.some((response) => response.status === 'rejected')
+  if(isFailedToUpdateSomeRule) {
     showToast(translate("Failed to update sequence for some rules."))
   } else {
     showToast(translate("Sequence for rules updated successfully."))
@@ -99,6 +99,10 @@ async function saveReorder() {
   store.dispatch("rule/updateIsReorderActive", false)
 }
 
+function updateReorderingRules(event: any) {
+  reorderingRules.value = doReorder(event, reorderingRules.value)
+}
+
 function createRule() {
   router.push({ path: '/create-safety-stock' })
 }
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 55e0bef1..823a5c44 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -25,7 +25,7 @@
           <ScheduleRuleItem v-if="rules.length" />
 
           <section>
-            <ion-reorder-group :disabled="false" @ionItemReorder="reorderingRules = doReorder($event, reorderingRules)">
+            <ion-reorder-group :disabled="false" @ionItemReorder="updateReorderingRules($event)">
               <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
             </ion-reorder-group>
           </section>
@@ -182,8 +182,8 @@ async function saveReorder() {
     await RuleService.updateRule(rule, rule.ruleId)
   }))
 
-  const isFailedToUpdateSomeRUle = responses.some((response) => response.status === 'rejected')
-  if(isFailedToUpdateSomeRUle) {
+  const isFailedToUpdateSomeRule = responses.some((response) => response.status === 'rejected')
+  if(isFailedToUpdateSomeRule) {
     showToast(translate("Failed to update sequence for some rules."))
   } else {
     showToast(translate("Sequence for rules updated successfully."))
@@ -193,6 +193,10 @@ async function saveReorder() {
   store.dispatch("rule/updateIsReorderActive", false)
 }
 
+function updateReorderingRules(event: any) {
+  reorderingRules.value = doReorder(event, reorderingRules.value)
+}
+
 function createShipping() {
   router.push({ path: '/create-shipping', query: { groupTypeEnumId: selectedSegment.value } })
 }
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index f63ae69e..167babb3 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -25,9 +25,10 @@
           <ScheduleRuleItem v-if="rules.length" />
 
           <section>
-            <ion-reorder-group :disabled="false" @ionItemReorder="reorderingRules = doReorder($event, reorderingRules)">
+            <ion-reorder-group :disabled="false" @ionItemReorder="updateReorderingRules($event)">
               <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
-            </ion-reorder-group></section>
+            </ion-reorder-group>
+          </section>
         </template>
         <div class="empty-state" v-else>
           <p>{{ translate("No store pickup rule found.") }}</p>
@@ -181,8 +182,8 @@ async function saveReorder() {
     await RuleService.updateRule(rule, rule.ruleId)
   }))
 
-  const isFailedToUpdateSomeRUle = responses.some((response) => response.status === 'rejected')
-  if(isFailedToUpdateSomeRUle) {
+  const isFailedToUpdateSomeRule = responses.some((response) => response.status === 'rejected')
+  if(isFailedToUpdateSomeRule) {
     showToast(translate("Failed to update sequence for some rules."))
   } else {
     showToast(translate("Sequence for rules updated successfully."))
@@ -192,6 +193,10 @@ async function saveReorder() {
   store.dispatch("rule/updateIsReorderActive", false)
 }
 
+function updateReorderingRules(event: any) {
+  reorderingRules.value = doReorder(event, reorderingRules.value)
+}
+
 function createStorePickup() {
   router.push({ path: '/create-store-pickup', query: { groupTypeEnumId: selectedSegment.value } })
 }
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 2b41eda9..ac3b5643 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -12,7 +12,7 @@
         <ScheduleRuleItem v-if="rules.length" />
 
         <section>
-          <ion-reorder-group :disabled="false" @ionItemReorder="reorderingRules = doReorder($event, reorderingRules)">
+          <ion-reorder-group :disabled="false" @ionItemReorder="updateReorderingRules($event)">
             <RuleItem v-for="(rule, ruleIndex) in (isReorderActive ? reorderingRules : rules)" :rule="rule" :ruleIndex="ruleIndex" :key="rule.ruleId" />
           </ion-reorder-group>
         </section>
@@ -89,8 +89,8 @@ async function saveReorder() {
     await RuleService.updateRule(rule, rule.ruleId)
   }))
 
-  const isFailedToUpdateSomeRUle = responses.some((response) => response.status === 'rejected')
-  if(isFailedToUpdateSomeRUle) {
+  const isFailedToUpdateSomeRule = responses.some((response) => response.status === 'rejected')
+  if(isFailedToUpdateSomeRule) {
     showToast(translate("Failed to update sequence for some rules."))
   } else {
     showToast(translate("Sequence for rules updated successfully."))
@@ -100,6 +100,9 @@ async function saveReorder() {
   store.dispatch("rule/updateIsReorderActive", false)
 }
 
+function updateReorderingRules(event: any) {
+  reorderingRules.value = doReorder(event, reorderingRules.value)
+}
 
 function createRule() {
   router.push({ path: '/create-threshold' })

From 631ac6d0e4ecb91e26cae142ed503a604b6a7c3a Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 17 May 2024 10:59:45 +0530
Subject: [PATCH 204/250] Improved: deactiving reordering when changing page
 (#282)

---
 src/views/SafetyStock.vue | 7 ++++---
 src/views/Shipping.vue    | 7 ++++---
 src/views/StorePickup.vue | 7 ++++---
 src/views/Threshold.vue   | 7 ++++---
 4 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 259b469e..319ac6a4 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -35,13 +35,13 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewWillEnter } from '@ionic/vue';
 import { addOutline, saveOutline, balloonOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
 import { useRouter } from "vue-router";
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useStore } from 'vuex';
-import { computed, onUnmounted, ref } from 'vue';
+import { computed, ref } from 'vue';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
 import { RuleService } from '@/services/RuleService';
@@ -60,8 +60,9 @@ onIonViewWillEnter(async() => {
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
 
-onUnmounted(() => {
+onIonViewDidLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchRules);
+  store.dispatch("rule/updateIsReorderActive", false)
 })
 
 async function fetchRules() {
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 823a5c44..f7e7a332 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -67,8 +67,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { computed, onUnmounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewWillEnter } from '@ionic/vue';
+import { computed, ref } from 'vue';
 import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import { translate } from '@/i18n';
@@ -100,8 +100,9 @@ onIonViewWillEnter(async() => {
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
 
-onUnmounted(() => {
+onIonViewDidLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchRules);
+  store.dispatch("rule/updateIsReorderActive", false)
 })
 
 async function fetchRules() {
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 167babb3..fe78d4d1 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -68,8 +68,8 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
-import { computed, onUnmounted, ref } from 'vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewWillEnter } from '@ionic/vue';
+import { computed, ref } from 'vue';
 import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import FacilityItem from '@/components/FacilityItem.vue'
@@ -102,8 +102,9 @@ onIonViewWillEnter(async() => {
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
 
-onUnmounted(() => {
+onIonViewDidLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchRules);
+  store.dispatch("rule/updateIsReorderActive", false)
 })
 
 async function fetchRules() {
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index ac3b5643..068ae58e 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -35,12 +35,12 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewWillEnter } from '@ionic/vue';
 import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
 import { useRouter } from 'vue-router';
-import { computed, onUnmounted, ref } from 'vue';
+import { computed, ref } from 'vue';
 import { useStore } from 'vuex';
 import { translate } from '@/i18n';
 import emitter from '@/event-bus';
@@ -60,8 +60,9 @@ onIonViewWillEnter(async() => {
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
 
-onUnmounted(() => {
+onIonViewDidLeave(() => {
   emitter.off("productStoreOrConfigChanged", fetchRules);
+  store.dispatch("rule/updateIsReorderActive", false)
 })
 
 async function fetchRules() {

From 7aa24bf8a734eb9a18d2371ff38b791ca278e321 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 17 May 2024 19:25:15 +0530
Subject: [PATCH 205/250] Improved: rule item card to use selectedsegment from
 state and logic to show group id when name not available on create rule page
 (#323)

---
 src/components/RuleItem.vue               | 7 ++++---
 src/views/CreateUpdateSafetyStockRule.vue | 4 ++--
 src/views/CreateUpdateShippingRule.vue    | 6 +++---
 3 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index dba80a9e..9ac704aa 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -123,12 +123,13 @@ import emitter from '@/event-bus';
 const router = useRouter();
 const store = useStore();
 
-const props = defineProps(["selectedSegment", "rule", "ruleIndex"])
+const props = defineProps(["rule", "ruleIndex"])
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const configFacilities = computed(() => store.getters["util/getConfigFacilities"])
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 const rules = computed(() => store.getters["rule/getRules"]);
 const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
+const selectedSegment = computed(() => store.getters["util/getSelectedSegment"])
 
 const selectedPage = ref({
   path: '',
@@ -389,8 +390,8 @@ function editRule() {
     path = `update-shipping/${props.rule.ruleId}`
   }
 
-  if(props.selectedSegment) {
-    router.push({ path, query: { groupTypeEnumId: props.selectedSegment } });
+  if(selectedSegment.value) {
+    router.push({ path, query: { groupTypeEnumId: selectedSegment.value } });
   } else {
     router.push(path)
   }
diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index 7f4e6a98..2458d1a1 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -46,7 +46,7 @@
           </ion-item>
           <ion-card-content>
             <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
-              {{ group.facilityGroupName }}
+              {{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}
               <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
             </ion-chip>
           </ion-card-content>
@@ -62,7 +62,7 @@
           </ion-item>
           <ion-card-content>
             <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
-              {{ group.facilityGroupName }}
+              {{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}
               <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
             </ion-chip>
           </ion-card-content>
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index 744233af..cef53cd4 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -48,7 +48,7 @@
             </ion-item>
             <ion-card-content>
               <ion-chip outline v-for="group in formData.selectedFacilityGroups['included']" :key="group.facilityGroupId">
-                {{ group.facilityGroupName }}
+                {{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}
                 <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'included')" />
               </ion-chip>
             </ion-card-content>
@@ -64,7 +64,7 @@
             </ion-item>
             <ion-card-content>
               <ion-chip outline v-for="group in formData.selectedFacilityGroups['excluded']" :key="group.facilityGroupId">
-                {{ group.facilityGroupName }}
+                {{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}
                 <ion-icon :icon="closeCircle" @click="removeFacilityGroups(group.facilityGroupId, 'excluded')" />
               </ion-chip>
             </ion-card-content>
@@ -80,7 +80,7 @@
           <ion-card v-for="facility in configFacilities" :key="facility.facilityId" @click="toggleFacilitySelection(facility.facilityId)" button>
             <ion-card-header>
               <div>
-                <ion-card-title>{{ facility.facilityName }}</ion-card-title>
+                <ion-card-title>{{ facility.facilityName ? facility.facilityName : facility.facilityId }}</ion-card-title>
                 <ion-card-subtitle>{{ facility.facilityId }}</ion-card-subtitle>
               </div>
               <ion-checkbox :checked="isFacilitySelected(facility.facilityId)" />

From 83f06688b45088643cb229c3521b6291f3149627 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 20 May 2024 10:40:16 +0530
Subject: [PATCH 206/250] Improved: made channel group name mandatory in edit
 group modal (#325)

---
 src/components/CreateGroupModal.vue |  2 +-
 src/components/EditGroupModal.vue   | 11 +++++++++--
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index 2ce1c33a..eaa74ef0 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -73,7 +73,7 @@ function closeModal() {
 
 async function createGroup() {
   if (!formData.value.facilityGroupName?.trim()) {
-    showToast(translate("Please fill in all the required fields"))
+    showToast(translate("Please fill in all the required fields."))
     return;
   }
 
diff --git a/src/components/EditGroupModal.vue b/src/components/EditGroupModal.vue
index 9c54a249..9fdf1175 100644
--- a/src/components/EditGroupModal.vue
+++ b/src/components/EditGroupModal.vue
@@ -13,7 +13,9 @@
   <ion-content>
     <ion-list>
       <ion-item>
-        <ion-input :label="translate('Name')" labelPlacement="floating" v-model="formData.facilityGroupName"/>
+        <ion-input labelPlacement="floating" v-model="formData.facilityGroupName">
+          <div slot="label">{{ translate("Name") }} <ion-text color="danger">*</ion-text></div>
+        </ion-input>
       </ion-item>
       <ion-item>
         <ion-textarea :label="translate('Description')" labelPlacement="floating" v-model="formData.description" :maxlength="255" />
@@ -29,7 +31,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonList, IonTextarea, IonTitle, IonToolbar, modalController } from "@ionic/vue";
+import { IonButton, IonButtons, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonList, IonText, IonTextarea, IonTitle, IonToolbar, modalController } from "@ionic/vue";
 import { closeOutline, saveOutline } from "ionicons/icons";
 import { translate } from "@/i18n";
 import { defineProps, onMounted, ref } from "vue";
@@ -55,6 +57,11 @@ function isGroupUpdated() {
 }
 
 async function updateGroup() {
+  if (!formData.value.facilityGroupName?.trim()) {
+    showToast(translate("Please fill in all the required fields."))
+    return;
+  }
+
   emitter.emit("presentLoader");
   try {
     const resp = await ChannelService.updateGroup({...formData.value, facilityGroupId: props.group.facilityGroupId})

From 6d8f9179c3de061b252d51e47918d7a88c403a07 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 20 May 2024 12:26:41 +0530
Subject: [PATCH 207/250] Improved: hidden or disabled not functional segments
 (#325)

---
 src/views/InventoryChannels.vue | 3 ++-
 src/views/StorePickup.vue       | 6 ++++--
 2 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index ff04eb6b..36a7e508 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -9,7 +9,8 @@
           <ion-segment-button value="channels">
             <ion-label>{{ translate("Channels") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="publish">
+          <!-- Todo: add functionality to the Publish segment -->
+          <ion-segment-button value="publish" disabled>
             <ion-label>{{ translate("Publish") }}</ion-label>
           </ion-segment-button>
         </ion-segment>
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 3885a665..296be80a 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -12,9 +12,11 @@
           <ion-segment-button value="RG_PICKUP_CHANNEL">
             <ion-label>{{ translate("Product and channel") }}</ion-label>
           </ion-segment-button>
-          <ion-segment-button value="PICKUP_FACILITY">
+          <!-- Hidden Facility segment for now as it is not functionality -->
+          <!-- Todo: add functionality to the Facility segment -->
+          <!-- <ion-segment-button value="PICKUP_FACILITY">
             <ion-label>{{ translate("Facility") }}</ion-label>
-          </ion-segment-button>
+          </ion-segment-button> -->
         </ion-segment>
       </ion-toolbar>
     </ion-header>

From e9e3031cb19a2f0f2234afa350664b6ce5483977 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 20 May 2024 14:33:17 +0530
Subject: [PATCH 208/250] Fixed: facilities not fetching again on page resfresh
 (#325)

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

diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index c23b3eae..2a905cb4 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -109,6 +109,7 @@ async function fetchRules() {
   emitter.emit("presentLoader");
   if(!selectedSegment.value || (selectedSegment.value !== 'RG_SHIPPING_FACILITY' && selectedSegment.value !== 'RG_SHIPPING_CHANNEL' && selectedSegment.value !== 'SHIPPING_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_SHIPPING_FACILITY");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  if(selectedSegment.value === 'SHIPPING_FACILITY') fetchFacilities();
   emitter.emit("dismissLoader");
 }
 
@@ -154,7 +155,7 @@ async function updateSegment(event: any) {
   store.dispatch("util/updateSelectedSegment", event.detail.value);
 
   emitter.emit("presentLoader");
-  if(selectedSegment.value === 'facility') {
+  if(selectedSegment.value === 'SHIPPING_FACILITY') {
     isScrollingEnabled.value = false;
     await fetchFacilities();
     store.dispatch("rule/updateIsReorderActive", false)

From 057a79d4bd2db45cc01598183b4cc76282e4bfa9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 20 May 2024 14:40:50 +0530
Subject: [PATCH 209/250] Improved: maxorder limit custom alert to prefilled
 existing value (#325)

---
 src/components/OrderLimitPopover.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/OrderLimitPopover.vue b/src/components/OrderLimitPopover.vue
index 53db4520..7b299f8b 100644
--- a/src/components/OrderLimitPopover.vue
+++ b/src/components/OrderLimitPopover.vue
@@ -65,6 +65,7 @@ async function showOrderLimitAlert(header: string, message: string, showInput: b
       name: "setLimit",
       placeholder: translate("Order fulfillment capacity"),
       type: "number",
+      value: props.fulfillmentOrderLimit,
       min: 0
     }] : [],
     buttons: [{

From 201e6c48a618f4583761f4de48a7984077a8f9fe Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 20 May 2024 19:26:48 +0530
Subject: [PATCH 210/250] Improved: logic to close reordering features when
 refetching rules (#325)

---
 src/views/SafetyStock.vue | 1 +
 src/views/Shipping.vue    | 1 +
 src/views/StorePickup.vue | 1 +
 src/views/Threshold.vue   | 1 +
 4 files changed, 4 insertions(+)

diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 319ac6a4..3d8bd7ce 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -67,6 +67,7 @@ onIonViewDidLeave(() => {
 
 async function fetchRules() {
   emitter.emit("presentLoader");
+  store.dispatch("rule/updateIsReorderActive", false)
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
   emitter.emit("dismissLoader");
 }
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 2a905cb4..6766570a 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -107,6 +107,7 @@ onIonViewDidLeave(() => {
 
 async function fetchRules() {
   emitter.emit("presentLoader");
+  store.dispatch("rule/updateIsReorderActive", false)
   if(!selectedSegment.value || (selectedSegment.value !== 'RG_SHIPPING_FACILITY' && selectedSegment.value !== 'RG_SHIPPING_CHANNEL' && selectedSegment.value !== 'SHIPPING_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_SHIPPING_FACILITY");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   if(selectedSegment.value === 'SHIPPING_FACILITY') fetchFacilities();
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 296be80a..094cb7db 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -110,6 +110,7 @@ onIonViewDidLeave(() => {
 
 async function fetchRules() {
   emitter.emit("presentLoader");
+  store.dispatch("rule/updateIsReorderActive", false)
   if(!selectedSegment.value || (selectedSegment.value !== 'RG_PICKUP_FACILITY' && selectedSegment.value !== 'RG_PICKUP_CHANNEL' && selectedSegment.value !== 'PICKUP_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_PICKUP_FACILITY");
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value}), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 068ae58e..d73ea094 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -67,6 +67,7 @@ onIonViewDidLeave(() => {
 
 async function fetchRules() {
   emitter.emit("presentLoader");
+  store.dispatch("rule/updateIsReorderActive", false)
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
   emitter.emit("dismissLoader");
 }

From 6ff41a6e8c8e76f2ac4c43a6f9d5e0a7dc47c4d3 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 22 May 2024 10:32:48 +0530
Subject: [PATCH 211/250] Improved: hooks for entering rule page view (#313)

---
 src/views/InventoryChannels.vue | 4 ++--
 src/views/SafetyStock.vue       | 4 ++--
 src/views/Shipping.vue          | 4 ++--
 src/views/StorePickup.vue       | 4 ++--
 src/views/Threshold.vue         | 4 ++--
 5 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 36a7e508..ebd7b3ba 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -128,7 +128,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave, popoverController } from '@ionic/vue';
+import { IonBadge, IonButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonItem, IonItemDivider, IonLabel, IonList, IonMenuButton, IonPage, IonSegment, IonSegmentButton, IonSelect, IonSelectOption, IonTitle, IonToolbar, modalController, onIonViewDidEnter, onIonViewWillLeave, popoverController } from '@ionic/vue';
 import { computed } from 'vue';
 import { addOutline, albumsOutline, businessOutline, ellipsisVerticalOutline, globeOutline, optionsOutline, storefrontOutline, timeOutline, timerOutline } from 'ionicons/icons';
 import { translate } from '@/i18n';
@@ -145,7 +145,7 @@ const store = useStore();
 const inventoryChannels = computed(() => store.getters["channel/getInventoryChannels"])
 const selectedSegment = computed(() => store.getters["util/getSelectedSegment"])
 
-onIonViewWillEnter(async() => {
+onIonViewDidEnter(async() => {
   fetchInventoryChannels()
   emitter.on("productStoreOrConfigChanged", fetchInventoryChannels);
 })
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 3d8bd7ce..b96ddf90 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -35,7 +35,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewDidEnter } from '@ionic/vue';
 import { addOutline, saveOutline, balloonOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue';
 import { useRouter } from "vue-router";
@@ -55,7 +55,7 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 const reorderingRules = ref([]);
 
-onIonViewWillEnter(async() => {
+onIonViewDidEnter(async() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 6766570a..1b8b2796 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -67,7 +67,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewDidEnter } from '@ionic/vue';
 import { computed, ref } from 'vue';
 import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
@@ -95,7 +95,7 @@ const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
-onIonViewWillEnter(async() => {
+onIonViewDidEnter(async() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 094cb7db..4c96fb33 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -70,7 +70,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInfiniteScroll, IonInfiniteScrollContent, IonLabel, IonMenuButton, IonPage, IonReorderGroup, IonSegment, IonSegmentButton, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewDidEnter } from '@ionic/vue';
 import { computed, ref } from 'vue';
 import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
@@ -98,7 +98,7 @@ const isScrollingEnabled = ref(false);
 const contentRef = ref({}) as any;
 const infiniteScrollRef = ref({}) as any;
 
-onIonViewWillEnter(async() => {
+onIonViewDidEnter(async() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index d73ea094..89635218 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -35,7 +35,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewWillEnter } from '@ionic/vue';
+import { IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonMenuButton, IonPage, IonReorderGroup, IonTitle, IonToolbar, onIonViewDidLeave, onIonViewDidEnter } from '@ionic/vue';
 import { addOutline, balloonOutline, saveOutline } from 'ionicons/icons';
 import RuleItem from '@/components/RuleItem.vue'
 import ScheduleRuleItem from '@/components/ScheduleRuleItem.vue';
@@ -55,7 +55,7 @@ const ruleGroup = computed(() => store.getters["rule/getRuleGroup"]);
 const isReorderActive = computed(() => store.getters["rule/isReorderActive"]);
 const reorderingRules = ref([]);
 
-onIonViewWillEnter(async() => {
+onIonViewDidEnter(async() => {
   fetchRules();
   emitter.on("productStoreOrConfigChanged", fetchRules);
 })

From 08bdb9f5d12ed570dd1d280852896dad22d39269 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 22 May 2024 12:54:14 +0530
Subject: [PATCH 212/250] Improved: logic to dismiss popover on alert opening
 (#313)

---
 src/components/OrderLimitPopover.vue      | 1 +
 src/components/ScheduleActionsPopover.vue | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/OrderLimitPopover.vue b/src/components/OrderLimitPopover.vue
index 7b299f8b..8cb4ffd0 100644
--- a/src/components/OrderLimitPopover.vue
+++ b/src/components/OrderLimitPopover.vue
@@ -94,5 +94,6 @@ async function showOrderLimitAlert(header: string, message: string, showInput: b
     }]
   })
   await alert.present()
+  popoverController.dismiss();
 }
 </script>
\ No newline at end of file
diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
index 739fcbd3..427d6f91 100644
--- a/src/components/ScheduleActionsPopover.vue
+++ b/src/components/ScheduleActionsPopover.vue
@@ -123,6 +123,7 @@ async function runNow() {
       ]
     });
 
-  return scheduleAlert.present();
+  await scheduleAlert.present();
+  popoverController.dismiss()
 }
 </script> 
\ No newline at end of file

From 9f6c5f1ec73a865628083cbe2a407952aa404e4c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 22 May 2024 14:43:25 +0530
Subject: [PATCH 213/250] Improved: added min value to threshold/safetyStock
 input and update alert message for not channel/facility selection (#313)

---
 src/locales/en.json                       |  4 ++--
 src/views/CreateUpdateSafetyStockRule.vue | 13 +++++++++----
 src/views/CreateUpdateShippingRule.vue    |  4 ++--
 src/views/CreateUpdateStorePickupRule.vue |  4 ++--
 src/views/CreateUpdateThresholdRule.vue   |  4 ++--
 5 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 63cef6f0..157101a1 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -152,9 +152,9 @@
   "Paused": "Paused",
   "Pending": "Pending",
   "Please enter a threshold value to set for these products before proceeding.": "Please enter a threshold value to set for these products before proceeding.",
-  "Please include atleast one facility group.": "Please include atleast one facility group.",
+  "Please include atleast one facility.": "Please include atleast one facility.",
   "Please fill in all the required fields.": "Please fill in all the required fields.",
-  "Please select atleast one config facility.": "Please select atleast one config facility.",
+  "Please select atleast one channel.": "Please select atleast one channel.",
   "Products": "Products",
   "Product and facility": "Product and facility",
   "Product and channel": "Product and channel",
diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index 2458d1a1..50c2d6b1 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -22,7 +22,7 @@
                 </ion-input>
               </ion-item>
               <ion-item>
-                <ion-input v-model="formData.safetyStock" type="number" @keydown="validateSafetyStock($event)">
+                <ion-input v-model="formData.safetyStock" type="number" min="0" @keydown="validateSafetyStock($event)">
                   <div slot="label">{{ translate("Safety stock") }} <ion-text color="danger">*</ion-text></div>
                 </ion-input>
               </ion-item>
@@ -32,7 +32,7 @@
       </section>
 
       <div class="section-header">
-        <h1>{{ translate("Facilities") }}</h1>
+        <h1>{{ translate("Facilities") }} <ion-text color="danger">*</ion-text></h1>
       </div>
 
       <section v-if="facilityGroups.length">
@@ -341,16 +341,21 @@ async function updateRule() {
 }
 
 function isRuleValid() {
-  if(!formData.value.ruleName.trim() || !formData.value.safetyStock || !formData.value.selectedFacilityGroups.included.length) {
+  if(!formData.value.ruleName.trim() || !formData.value.safetyStock) {
     showToast(translate("Please fill in all the required fields."))
     return false;
   }
 
-  if(formData.value.safety < 0) {
+  if(formData.value.safetyStock < 0) {
     showToast(translate("Safety stock should be greater than or equal to 0."));
     return false;
   }
 
+  if(!formData.value.selectedFacilityGroups.included.length) {
+    showToast(translate("Please include atleast one facility."))
+    return false;
+  }
+
   return true
 }
 
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index cef53cd4..d06d50a6 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -404,10 +404,10 @@ function isRuleValid() {
   }
 
   if(selectedSegment.value === 'RG_SHIPPING_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
-    showToast(translate("Please include atleast one facility group."))
+    showToast(translate("Please include atleast one facility."))
     return false;
   } else if(selectedSegment.value === 'RG_SHIPPING_CHANNEL' && !formData.value.selectedConfigFacilites.length) {
-    showToast(translate("Please select atleast one config facility."))
+    showToast(translate("Please select atleast one channel."))
     return false;
   }
 
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 2282ccdf..89c4cbe3 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -405,10 +405,10 @@ function isRuleValid() {
   }
 
   if(selectedSegment.value === 'RG_PICKUP_FACILITY' && !formData.value.selectedFacilityGroups.included.length) {
-    showToast(translate("Please include atleast one facility group."))
+    showToast(translate("Please include atleast one facility."))
     return false;
   } else if(selectedSegment.value === 'RG_PICKUP_CHANNEL' && !formData.value.selectedConfigFacilites.length) {
-    showToast(translate("Please select atleast one config facility."))
+    showToast(translate("Please select atleast one channel."))
     return false;
   }
 
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index 8f454bfe..07c4868a 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -22,7 +22,7 @@
                 </ion-input>
               </ion-item>
               <ion-item>
-                <ion-input v-model="formData.threshold" type="number" @keydown="validateThreshold($event)">
+                <ion-input v-model="formData.threshold" type="number" min="0" @keydown="validateThreshold($event)">
                   <div slot="label">{{ translate("Threshold") }} <ion-text color="danger">*</ion-text></div>
                 </ion-input>
               </ion-item>
@@ -290,7 +290,7 @@ function isRuleValid() {
     return false;
   }
   if(!formData.value.selectedConfigFacilites.length) {
-    showToast(translate("Please select atleast one config facility."))
+    showToast(translate("Please select atleast one channel."))
     return false;
   }
   return true

From 139695ed259a177f816d6ea9d1d63880c5d3fd41 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 22 May 2024 15:05:48 +0530
Subject: [PATCH 214/250] Improved: added rule validation check while shipping
 rule creation (#313)

---
 src/views/CreateUpdateShippingRule.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index d06d50a6..ed37e015 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -243,6 +243,7 @@ function isFacilitySelected(facilityId: any) {
 }
 
 async function createRule() {
+  if(!isRuleValid()) return;
 
   emitter.emit("presentLoader");
 

From b4436d5bd479a067905823a07ce02fbbb0610c8c Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 07:03:09 +0530
Subject: [PATCH 215/250] Improved: fixed the empty state message in rule pages
 (#287)

---
 src/views/SafetyStock.vue | 2 +-
 src/views/Shipping.vue    | 2 +-
 src/views/StorePickup.vue | 2 +-
 src/views/Threshold.vue   | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 3d8bd7ce..14e55bcf 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -8,7 +8,7 @@
     </ion-header>
 
     <ion-content>
-      <main v-if="ruleGroup.ruleGroupId">
+      <main v-if="ruleGroup.ruleGroupId && rules.length">
         <ScheduleRuleItem v-if="rules.length" />
 
         <section>
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 6766570a..be05a438 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -21,7 +21,7 @@
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
       <main v-if="selectedSegment !== 'SHIPPING_FACILITY'">
-        <template v-if="ruleGroup.ruleGroupId">
+        <template v-if="ruleGroup.ruleGroupId && rules.length">
           <ScheduleRuleItem v-if="rules.length" />
 
           <section>
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 094cb7db..4b9af8d4 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -23,7 +23,7 @@
 
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
       <main v-if="selectedSegment !== 'PICKUP_FACILITY'">
-        <template v-if="ruleGroup.ruleGroupId">
+        <template v-if="ruleGroup.ruleGroupId && rules.length">
           <ScheduleRuleItem v-if="rules.length" />
 
           <section>
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index d73ea094..2d2470a0 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -8,7 +8,7 @@
     </ion-header>
 
     <ion-content>
-      <main v-if="ruleGroup.ruleGroupId">
+      <main v-if="ruleGroup.ruleGroupId && rules.length">
         <ScheduleRuleItem v-if="rules.length" />
 
         <section>

From f0c60554fa3ae02bc9a2878de4c58dbc9b5177f9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 07:18:15 +0530
Subject: [PATCH 216/250] Fixed: card actions size for consistency all over the
 app (#291)

---
 src/components/ScheduleRuleItem.vue | 11 ++++++++---
 src/views/InventoryChannels.vue     |  9 +++++++--
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index f58c4938..de7b0d2e 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -22,12 +22,12 @@
           </ion-select>
         </ion-item>
       
-        <ion-item lines="none">
-          <ion-button fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
+        <div class="actions">
+          <ion-button size="default" fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
           <ion-button color="medium" fill="clear" slot="end" @click="openScheduleActionsPopover($event)">
             <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
           </ion-button>
-        </ion-item>
+        </div>
       </ion-card>
     </ion-accordion>
   </ion-accordion-group>
@@ -105,4 +105,9 @@ ion-card-header {
   justify-content: space-between;
   align-items: center;
 }
+
+.actions {
+  display: flex;
+  justify-content: space-between;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 36a7e508..814a95c7 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -59,13 +59,13 @@
                   <ion-label>{{ translate("warehouse", { count: getFacilityCount(channel, "WAREHOUSE") })}}</ion-label>
                 </ion-item>
     
-                <ion-item lines="none">
+                <div class="actions">
                   <ion-button fill="clear" size="default" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
                   <!-- Functionality is not defined for this button hence commented it for now. -->
                   <!-- <ion-button color="medium" fill="clear" slot="end">
                     <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
                   </ion-button> -->
-                </ion-item>
+                </div>
               </ion-list>
             </ion-card>
           </template>
@@ -229,4 +229,9 @@ ion-card-header {
   justify-content: space-between;
   align-items: center;
 }
+
+.actions {
+  display: flex;
+  justify-content: space-between;
+}
 </style>
\ No newline at end of file

From e03b036d3cf9fcff794893098e220bc44e603153 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 09:31:30 +0530
Subject: [PATCH 217/250] Improved: updated the title in case of updating rule
 (#291)

---
 src/locales/en.json                       | 8 ++++----
 src/views/CreateUpdateSafetyStockRule.vue | 2 +-
 src/views/CreateUpdateShippingRule.vue    | 2 +-
 src/views/CreateUpdateStorePickupRule.vue | 2 +-
 src/views/CreateUpdateThresholdRule.vue   | 2 +-
 5 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/locales/en.json b/src/locales/en.json
index 63cef6f0..66d23bc2 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -260,15 +260,15 @@
   "Unable to schedule service.": "Unable to schedule service.",
   "Unable to update threshold rule.": "Unable to update threshold rule.",
   "Update": "Update",
-  "Update shipping rule": "Update shipping rule",
-  "Update store pickup rule": "Update store pickup rule",
+  "Edit shipping rule": "Edit shipping rule",
+  "Edit store pickup rule": "Edit store pickup rule",
   "Update time zone": "Update time zone",
-  "Update threshold rule": "Update threshold rule",
+  "Edit threshold rule": "Edit threshold rule",
   "Unlimited": "Unlimited",
   "Unlimited Capacity": "Unlimited Capacity",
   "Unlimited fulfillment capacity": "Unlimited fulfillment capacity",
   "Unlimited capacity removes the fulfillment capacity limit entirely. To add a fulfillment capacity to this facility, use the custom option.": "Unlimited capacity removes the fulfillment capacity limit entirely. To add a fulfillment capacity to this facility, use the custom option.",
-  "Update safety stock rule": "Update safety stock rule",
+  "Edit safety stock rule": "Edit safety stock rule",
   "Upload": "Upload",
   "Upload CSV": "Upload CSV",
   "Username": "Username",
diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index 2458d1a1..53fc12e6 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/safety-stock" />
-        <ion-title>{{ currentRule.ruleId ? translate("Update safety stock rule") : translate("New safety stock rule") }}</ion-title>
+        <ion-title>{{ currentRule.ruleId ? translate("Edit safety stock rule") : translate("New safety stock rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index cef53cd4..5596fa72 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/shipping" />
-        <ion-title>{{ currentRule.ruleId ? translate("Update shipping rule") : translate("New shipping rule") }}</ion-title>
+        <ion-title>{{ currentRule.ruleId ? translate("Edit shipping rule") : translate("New shipping rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 2282ccdf..1ec8929b 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/store-pickup" />
-        <ion-title>{{ currentRule.ruleId ? translate("Update store pickup rule") : translate("New store pickup rule") }}</ion-title>
+        <ion-title>{{ currentRule.ruleId ? translate("Edit store pickup rule") : translate("New store pickup rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index 8f454bfe..1a166511 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/threshold" />
-        <ion-title>{{ currentRule.ruleId ? translate("Update threshold rule") : translate("New threshold rule") }}</ion-title>
+        <ion-title>{{ currentRule.ruleId ? translate("Edit threshold rule") : translate("New threshold rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     

From e5559646b00334b8e5b8c27faf6cc4c3812b80eb Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 10:46:27 +0530
Subject: [PATCH 218/250] Reverted: check for rules length as not
 required(#287)

---
 src/views/SafetyStock.vue | 2 +-
 src/views/Shipping.vue    | 2 +-
 src/views/StorePickup.vue | 2 +-
 src/views/Threshold.vue   | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index 14e55bcf..4eb4918b 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -9,7 +9,7 @@
 
     <ion-content>
       <main v-if="ruleGroup.ruleGroupId && rules.length">
-        <ScheduleRuleItem v-if="rules.length" />
+        <ScheduleRuleItem />
 
         <section>
           <ion-reorder-group :disabled="false" @ionItemReorder="updateReorderingRules($event)">
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index be05a438..a60a8f87 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -22,7 +22,7 @@
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
       <main v-if="selectedSegment !== 'SHIPPING_FACILITY'">
         <template v-if="ruleGroup.ruleGroupId && rules.length">
-          <ScheduleRuleItem v-if="rules.length" />
+          <ScheduleRuleItem />
 
           <section>
             <ion-reorder-group :disabled="false" @ionItemReorder="updateReorderingRules($event)">
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 4b9af8d4..b81a5b3d 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -24,7 +24,7 @@
     <ion-content ref="contentRef" :scroll-events="true" @ionScroll="enableScrolling()">
       <main v-if="selectedSegment !== 'PICKUP_FACILITY'">
         <template v-if="ruleGroup.ruleGroupId && rules.length">
-          <ScheduleRuleItem v-if="rules.length" />
+          <ScheduleRuleItem />
 
           <section>
             <ion-reorder-group :disabled="false" @ionItemReorder="updateReorderingRules($event)">
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 2d2470a0..749fa5eb 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -9,7 +9,7 @@
 
     <ion-content>
       <main v-if="ruleGroup.ruleGroupId && rules.length">
-        <ScheduleRuleItem v-if="rules.length" />
+        <ScheduleRuleItem />
 
         <section>
           <ion-reorder-group :disabled="false" @ionItemReorder="updateReorderingRules($event)">

From 6e6e9ad1b20f468bb88c25c41a8c8b89a0230fb3 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 12:32:16 +0530
Subject: [PATCH 219/250] Improved: logic to delete clear filters and update
 ruleconditions in threshold page (#328)

---
 src/services/RuleService.ts             |  9 +++++
 src/views/CreateUpdateThresholdRule.vue | 49 ++++++++++++++++++++++++-
 2 files changed, 56 insertions(+), 2 deletions(-)

diff --git a/src/services/RuleService.ts b/src/services/RuleService.ts
index 4fc47676..377048dc 100644
--- a/src/services/RuleService.ts
+++ b/src/services/RuleService.ts
@@ -108,9 +108,18 @@ const runNow = async (ruleGroupId: any): Promise<any> => {
   });
 }
 
+const deleteCondition = async (payload: any): Promise<any> => {
+  return api({
+    url: `decisionRules/${payload.ruleId}/conditions`,
+    method: "delete",
+    data: payload
+  });
+}
+
 export const RuleService = {
   createRule,
   createRuleGroup,
+  deleteCondition,
   fetchRuleGroup,
   fetchRuleGroupHistory,
   fetchRules,
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index 8f454bfe..8a76e658 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -173,6 +173,37 @@ function generateRuleActions(ruleId: string) {
 }
 
 function generateRuleConditions(ruleId: string) {
+  const conditions = [];
+
+  const selectedFacilites = formData.value.selectedConfigFacilites
+  conditions.push({
+    "ruleId": ruleId,
+    "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
+    "fieldName": "facilities",
+    "operator": "in",
+    "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
+    "multiValued": "Y"
+  })
+
+  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
+    Object.entries(filters as any).map(([filter, value]: any) => {
+      if(value.length) {
+        conditions.push({
+          "ruleId": ruleId,
+          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+          "fieldName": filter,
+          "operator": type === "included" ? "in" : "not-in",
+          "fieldValue": value.join(","),
+          "multiValued": "Y"
+        })
+      }
+    })
+  })
+
+  return conditions;
+}
+
+/* function generateRuleConditions(ruleId: string) {
   if(currentRule.value.ruleId) {
     const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
 
@@ -217,7 +248,7 @@ function generateRuleConditions(ruleId: string) {
 
     return conditions;
   }
-}
+} */
 
 async function createThresholdRule() {
   if(!isRuleValid()) return;
@@ -264,14 +295,28 @@ async function createThresholdRule() {
 async function updateRule() {
   if(!isRuleValid()) return;
 
+  const currentRuleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
+  const updatedRuleConditions = generateRuleConditions(props.ruleId);
+  const conditionsToRemove = currentRuleConditions.filter((condition: any) => !updatedRuleConditions.some((updatedCondition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator))
+
+  updatedRuleConditions.map((updatedCondition: any) => {
+    const current = currentRuleConditions.find((condition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator);
+    if(current) updatedCondition["conditionSeqId"] = current.conditionSeqId;
+  })
+
   try {
     await RuleService.updateRule({
       ...currentRule.value,
       "ruleName": formData.value.ruleName,
-      "ruleConditions": generateRuleConditions(props.ruleId),
+      "ruleConditions": updatedRuleConditions,
       "ruleActions": generateRuleActions(props.ruleId)
     }, props.ruleId);
     showToast(translate("Rule updated successfully."))
+
+    const removeResponses = await Promise.allSettled(conditionsToRemove.map(async (condition: any) => await RuleService.deleteCondition({ ...condition, ruleId: props.ruleId})));
+    const hasFailedResponse = removeResponses.some((response: any) => response.status === 'rejected');
+    if(hasFailedResponse) logger.error("Failed to delete some rule conditions.")
+
     store.dispatch("rule/clearRuleState")
     store.dispatch("util/clearAppliedFilters")
     router.push("/threshold");

From dfc79f816e4d3f6f069450ed46b40d0d72b6c034 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 14:34:02 +0530
Subject: [PATCH 220/250] Improved: added page size while fetching rules (#313)

---
 src/components/ScheduleRuleItem.vue  | 2 +-
 src/store/modules/channel/actions.ts | 2 +-
 src/views/SafetyStock.vue            | 2 +-
 src/views/Shipping.vue               | 4 ++--
 src/views/StorePickup.vue            | 4 ++--
 src/views/Threshold.vue              | 2 +-
 6 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index f58c4938..9420bee0 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -77,7 +77,7 @@ async function saveSchedule() {
     const resp = await RuleService.scheduleRuleGroup(payload)
     if(!hasError(resp)) {
       showToast(translate("Service has been scheduled"))
-      await store.dispatch('rule/fetchRules', { groupTypeEnumId: ruleGroup.value.groupTypeEnumId })
+      await store.dispatch('rule/fetchRules', { groupTypeEnumId: ruleGroup.value.groupTypeEnumId, pageSize: 50 })
     } else {
       throw resp.data
     }
diff --git a/src/store/modules/channel/actions.ts b/src/store/modules/channel/actions.ts
index f86ec0b0..eaf97009 100644
--- a/src/store/modules/channel/actions.ts
+++ b/src/store/modules/channel/actions.ts
@@ -14,7 +14,7 @@ const actions: ActionTree<ChannelState, RootState> = {
     let inventoryChannels = [] as any
 
     try {
-      resp = await ChannelService.fetchInventoryChannels({ facilityGroupTypeId: "CHANNEL_FAC_GROUP", productStoreId: store.state.user.currentEComStore.productStoreId });
+      resp = await ChannelService.fetchInventoryChannels({ facilityGroupTypeId: "CHANNEL_FAC_GROUP", productStoreId: store.state.user.currentEComStore.productStoreId, pageSize: 50 });
 
       if(!hasError(resp)) {
         inventoryChannels = resp?.data;
diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index b96ddf90..c9a7a6f8 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -68,7 +68,7 @@ onIonViewDidLeave(() => {
 async function fetchRules() {
   emitter.emit("presentLoader");
   store.dispatch("rule/updateIsReorderActive", false)
-  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK', pageSize: 50 }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
   emitter.emit("dismissLoader");
 }
 
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 1b8b2796..97177c31 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -109,7 +109,7 @@ async function fetchRules() {
   emitter.emit("presentLoader");
   store.dispatch("rule/updateIsReorderActive", false)
   if(!selectedSegment.value || (selectedSegment.value !== 'RG_SHIPPING_FACILITY' && selectedSegment.value !== 'RG_SHIPPING_CHANNEL' && selectedSegment.value !== 'SHIPPING_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_SHIPPING_FACILITY");
-  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value, pageSize: 50 }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   if(selectedSegment.value === 'SHIPPING_FACILITY') fetchFacilities();
   emitter.emit("dismissLoader");
 }
@@ -163,7 +163,7 @@ async function updateSegment(event: any) {
   } else {
     store.dispatch("rule/updateIsReorderActive", false)
     reorderingRules.value = []
-    await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value, pageSize: 50 })
   }
   emitter.emit("dismissLoader");
 }
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 4c96fb33..e3d6811b 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -112,7 +112,7 @@ async function fetchRules() {
   emitter.emit("presentLoader");
   store.dispatch("rule/updateIsReorderActive", false)
   if(!selectedSegment.value || (selectedSegment.value !== 'RG_PICKUP_FACILITY' && selectedSegment.value !== 'RG_PICKUP_CHANNEL' && selectedSegment.value !== 'PICKUP_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_PICKUP_FACILITY");
-  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value}), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value, pageSize: 50 }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
 }
 
@@ -164,7 +164,7 @@ async function updateSegment(event: any) {
   } else {
     store.dispatch("rule/updateIsReorderActive", false)
     reorderingRules.value = []
-    await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value})
+    await store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value, pageSize: 50 })
   }
   emitter.emit("dismissLoader");
 }
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 89635218..4e88d8bc 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -68,7 +68,7 @@ onIonViewDidLeave(() => {
 async function fetchRules() {
   emitter.emit("presentLoader");
   store.dispatch("rule/updateIsReorderActive", false)
-  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD' }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
+  await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD', pageSize: 50 }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
   emitter.emit("dismissLoader");
 }
 

From 8170efc9af990bf29e3d702976b0ec37ffd2dcdd Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 14:46:11 +0530
Subject: [PATCH 221/250] Improved: infinite scroller active in case of rules
 page and selected segment reseting on threshold/safetyStock page (#313)

---
 src/views/SafetyStock.vue | 1 +
 src/views/Shipping.vue    | 2 +-
 src/views/StorePickup.vue | 2 +-
 src/views/Threshold.vue   | 1 +
 4 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/views/SafetyStock.vue b/src/views/SafetyStock.vue
index c9a7a6f8..5af1d6e7 100644
--- a/src/views/SafetyStock.vue
+++ b/src/views/SafetyStock.vue
@@ -67,6 +67,7 @@ onIonViewDidLeave(() => {
 
 async function fetchRules() {
   emitter.emit("presentLoader");
+  store.dispatch("util/updateSelectedSegment", "");
   store.dispatch("rule/updateIsReorderActive", false)
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_SAFETY_STOCK', pageSize: 50 }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
   emitter.emit("dismissLoader");
diff --git a/src/views/Shipping.vue b/src/views/Shipping.vue
index 97177c31..9940281e 100644
--- a/src/views/Shipping.vue
+++ b/src/views/Shipping.vue
@@ -45,7 +45,7 @@
       <ion-infinite-scroll
         @ionInfinite="loadMoreFacilities($event)"
         threshold="100px"
-        v-show="isScrollable"
+        v-show="selectedSegment === 'SHIPPING_FACILITY' && isScrollable"
         ref="infiniteScrollRef"
       >
         <ion-infinite-scroll-content
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index e3d6811b..8670f082 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -48,7 +48,7 @@
       <ion-infinite-scroll
         @ionInfinite="loadMoreFacilities($event)"
         threshold="100px"
-        v-show="isScrollable"
+        v-show="selectedSegment === 'PICKUP_FACILITY' && isScrollable"
         ref="infiniteScrollRef"
       >
         <ion-infinite-scroll-content
diff --git a/src/views/Threshold.vue b/src/views/Threshold.vue
index 4e88d8bc..811a25d5 100644
--- a/src/views/Threshold.vue
+++ b/src/views/Threshold.vue
@@ -67,6 +67,7 @@ onIonViewDidLeave(() => {
 
 async function fetchRules() {
   emitter.emit("presentLoader");
+  store.dispatch("util/updateSelectedSegment", "");
   store.dispatch("rule/updateIsReorderActive", false)
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: 'RG_THRESHOLD', pageSize: 50 }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")]);
   emitter.emit("dismissLoader");

From 768d4ebaf154399a5e28750173ad9864ee8e1654 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 15:46:47 +0530
Subject: [PATCH 222/250] Improved: added generateRuleActions method in the
 utils and used in threshold app (#328)

---
 src/utils/index.ts                      |  67 ++++++++++++++-
 src/views/CreateUpdateThresholdRule.vue | 105 ++----------------------
 2 files changed, 71 insertions(+), 101 deletions(-)

diff --git a/src/utils/index.ts b/src/utils/index.ts
index 65cde066..2c220d6d 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -67,4 +67,69 @@ const findRulesDiff = (previousSeq: any, updatedSeq: any) => {
   return diffSeq;
 }
 
-export { doReorder, generateInternalId, getDate, getDateAndTime, getTime, hasError, showToast, timeTillRun }
\ No newline at end of file
+const generateRuleActions = (ruleId: string, actionTypeEnumId: string, actionValue: any, isConditionExists: boolean, ruleActions: any) => {
+  if(isConditionExists) {
+    const ruleAction = ruleActions.find((action: any) => action.actionTypeEnumId === actionTypeEnumId)
+    if(ruleAction) {
+      if(actionTypeEnumId === "ATP_THRESHOLD" || actionTypeEnumId === "ATP_SAFETY_STOCK") {
+        ruleAction.fieldValue = actionValue ? actionValue : 0;
+      } else {
+        ruleAction.fieldValue = actionValue ? "Y" : "N"
+      }
+      return [ruleAction];
+    }
+  }
+
+  let condition;
+  if(actionTypeEnumId === "ATP_THRESHOLD" || actionTypeEnumId === "ATP_SAFETY_STOCK") {
+    condition = [{
+      ruleId,
+      actionTypeEnumId,
+      "fieldName": "facility-safety-stock",
+      "fieldValue": actionValue ? actionValue : 0
+    }]
+  } else {
+    condition = [{
+      ruleId,
+      actionTypeEnumId,
+      "fieldName": actionTypeEnumId === "ATP_ALLOW_PICKUP" ? "allow-pickup" : "allow-brokering",
+      "fieldValue": actionValue ? "Y" : "N"
+    }]
+  }
+  return condition
+}
+
+const generateRuleConditions = (ruleId: string, conditionTypeEnumId: string, appliedFilters: any, selectedFac: any) => {
+  const conditions = [];
+
+  if(conditionTypeEnumId === "ENTCT_ATP_FACILITIES") {
+    conditions.push({
+      "ruleId": ruleId,
+      conditionTypeEnumId,
+      "fieldName": "facilities",
+      "operator": "in",
+      "fieldValue": selectedFac.length ? selectedFac.join(",") : "",
+      "multiValued": "Y"
+    })
+  }
+
+  Object.entries(appliedFilters).map(([type, filters]: any) => {
+    Object.entries(filters as any).map(([filter, value]: any) => {
+      if(value.length) {
+        conditions.push({
+          "ruleId": ruleId,
+          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
+          "fieldName": filter,
+          "operator": type === "included" ? "in" : "not-in",
+          "fieldValue": value.join(","),
+          "multiValued": "Y"
+        })
+      }
+    })
+  })
+
+  return conditions;
+}
+
+
+export { doReorder, generateInternalId, generateRuleActions, generateRuleConditions, getDate, getDateAndTime, getTime, hasError, showToast, timeTillRun }
\ No newline at end of file
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index 8a76e658..56799bd6 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -68,7 +68,7 @@ import ProductFilters from '@/components/ProductFilters.vue';
 import { computed, defineProps, ref } from 'vue';
 import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
-import { hasError, showToast } from '@/utils';
+import { generateRuleActions, generateRuleConditions, hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import router from '@/router';
 import emitter from '@/event-bus';
@@ -155,101 +155,6 @@ function isFacilitySelected(facilityId: any) {
   return formData.value.selectedConfigFacilites?.includes(facilityId)
 }
 
-function generateRuleActions(ruleId: string) {
-  if(currentRule.value.ruleId) {
-    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "ATP_THRESHOLD")
-    if(ruleAction) {
-      ruleAction.fieldValue = formData.value.threshold ? formData.value.threshold : 0;
-      return [ruleAction];
-    }
-  }
-
-  return [{
-    "ruleId": ruleId,
-    "actionTypeEnumId": "ATP_THRESHOLD",
-    "fieldName": "facility-safety-stock",
-    "fieldValue": formData.value.threshold ? formData.value.threshold : 0
-  }]
-}
-
-function generateRuleConditions(ruleId: string) {
-  const conditions = [];
-
-  const selectedFacilites = formData.value.selectedConfigFacilites
-  conditions.push({
-    "ruleId": ruleId,
-    "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
-    "fieldName": "facilities",
-    "operator": "in",
-    "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
-    "multiValued": "Y"
-  })
-
-  Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-    Object.entries(filters as any).map(([filter, value]: any) => {
-      if(value.length) {
-        conditions.push({
-          "ruleId": ruleId,
-          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-          "fieldName": filter,
-          "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.join(","),
-          "multiValued": "Y"
-        })
-      }
-    })
-  })
-
-  return conditions;
-}
-
-/* function generateRuleConditions(ruleId: string) {
-  if(currentRule.value.ruleId) {
-    const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
-
-    const facilityCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES");
-    if(facilityCondition) facilityCondition["fieldValue"] = formData.value.selectedConfigFacilites.join(",");
-
-    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-      Object.entries(filters as any).map(([filter, value]: any) => {
-        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
-        if(condition) {
-          condition["fieldValue"] = value.length ? value.join(",") : ""
-        }
-      })
-    })
-
-    return ruleConditions;
-  } else {
-    const conditions = [];
-
-    const selectedFacilites = formData.value.selectedConfigFacilites
-    conditions.push({
-      "ruleId": ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
-      "fieldName": "facilities",
-      "operator": "in",
-      "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
-      "multiValued": "Y"
-    })
-
-    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-      Object.entries(filters as any).map(([filter, value]: any) => {
-        conditions.push({
-          "ruleId": ruleId,
-          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-          "fieldName": filter,
-          "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.length ? value.join(",") : "",
-          "multiValued": "Y"
-        })
-      })
-    })
-
-    return conditions;
-  }
-} */
-
 async function createThresholdRule() {
   if(!isRuleValid()) return;
 
@@ -277,8 +182,8 @@ async function createThresholdRule() {
 
     await RuleService.updateRule({
       ...params,
-      "ruleConditions": generateRuleConditions(rule.ruleId),
-      "ruleActions": generateRuleActions(rule.ruleId)
+      "ruleConditions": generateRuleConditions(rule.ruleId, "ENTCT_ATP_FACILITIES", appliedFilters.value, formData.value.selectedConfigFacilites),
+      "ruleActions": generateRuleActions(rule.ruleId, "ATP_THRESHOLD", formData.value.threshold, false, [])
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
@@ -296,7 +201,7 @@ async function updateRule() {
   if(!isRuleValid()) return;
 
   const currentRuleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
-  const updatedRuleConditions = generateRuleConditions(props.ruleId);
+  const updatedRuleConditions = generateRuleConditions(props.ruleId, "ENTCT_ATP_FACILITIES", appliedFilters.value, formData.value.selectedConfigFacilites);
   const conditionsToRemove = currentRuleConditions.filter((condition: any) => !updatedRuleConditions.some((updatedCondition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator))
 
   updatedRuleConditions.map((updatedCondition: any) => {
@@ -309,7 +214,7 @@ async function updateRule() {
       ...currentRule.value,
       "ruleName": formData.value.ruleName,
       "ruleConditions": updatedRuleConditions,
-      "ruleActions": generateRuleActions(props.ruleId)
+      "ruleActions": generateRuleActions(props.ruleId, "ATP_THRESHOLD", formData.value.threshold, true, currentRule.value.ruleActions)
     }, props.ruleId);
     showToast(translate("Rule updated successfully."))
 

From 1812fe213c7dbb4676e413d8398922ac0b9099b0 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 16:28:59 +0530
Subject: [PATCH 223/250] Improved: safetyStock page to use util functions to
 generate rule actions and conditions (#328)

---
 src/components/RuleItem.vue               |   1 +
 src/utils/index.ts                        |  29 ++++++
 src/views/CreateUpdateSafetyStockRule.vue | 105 +++++-----------------
 3 files changed, 50 insertions(+), 85 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 9ac704aa..84d1661f 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -271,6 +271,7 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
   if(fieldName && operator) {
     const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)
     if(condition && conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS') {
+      
       let facilityGroupIds = condition?.fieldValue.split(",")
         facilityGroupIds = facilityGroupIds.map((id: string) => {
           let group = facilityGroups.value.find((group: any) => group.facilityGroupId === id)
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 2c220d6d..556369a7 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -103,6 +103,8 @@ const generateRuleConditions = (ruleId: string, conditionTypeEnumId: string, app
   const conditions = [];
 
   if(conditionTypeEnumId === "ENTCT_ATP_FACILITIES") {
+    console.log('entered');
+    
     conditions.push({
       "ruleId": ruleId,
       conditionTypeEnumId,
@@ -111,6 +113,33 @@ const generateRuleConditions = (ruleId: string, conditionTypeEnumId: string, app
       "fieldValue": selectedFac.length ? selectedFac.join(",") : "",
       "multiValued": "Y"
     })
+  } else {
+    const includedFacilityGroupIds = selectedFac.included.map((group: any) => group.facilityGroupId)  
+    console.log(includedFacilityGroupIds);
+    
+    if(includedFacilityGroupIds.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+        "fieldName": "facilityGroups",
+        "operator": "in",
+        "fieldValue": includedFacilityGroupIds.join(","),
+        "multiValued": "Y"
+      })
+    }
+    
+    const excludedFacilityGroupIds = selectedFac.excluded.map((group: any) => group.facilityGroupId)
+    console.log(excludedFacilityGroupIds);
+    if(excludedFacilityGroupIds.length) {
+      conditions.push({
+        "ruleId": ruleId,
+        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
+        "fieldName": "facilityGroups",
+        "operator": "not-in",
+        "fieldValue": excludedFacilityGroupIds.join(","),
+        "multiValued": "Y"
+      })
+    }
   }
 
   Object.entries(appliedFilters).map(([type, filters]: any) => {
diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index 2458d1a1..fdbb8773 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -94,7 +94,7 @@ import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupMo
 import { RuleService } from '@/services/RuleService';
 import { useRouter } from 'vue-router';
 import logger from '@/logger';
-import { hasError, showToast } from '@/utils';
+import { generateRuleActions, generateRuleConditions, hasError, showToast } from '@/utils';
 import emitter from '@/event-bus';
 
 const router = useRouter();
@@ -201,85 +201,6 @@ async function openProductFacilityGroupModal(type: string) {
   modal.present()
 }
 
-function generateRuleActions(ruleId: string) {
-  if(currentRule.value.ruleId) {
-    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "ATP_SAFETY_STOCK")
-    if(ruleAction) {
-      ruleAction.fieldValue = formData.value.safetyStock ? formData.value.safetyStock : 0;
-      return [ruleAction];
-    }
-  }
-
-  return [{
-    "ruleId": ruleId,
-    "actionTypeEnumId": "ATP_SAFETY_STOCK",
-    "fieldName": "facility-safety-stock",
-    "fieldValue": formData.value.safetyStock
-  }]
-}
-
-function generateRuleConditions(ruleId: string) {
-  if(currentRule.value.ruleId) {
-    const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
-
-    const includedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in");
-    const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId);
-    if(includedFacilityGroupIds.length) includedCondition["fieldValue"] = includedFacilityGroupIds.join(",")
-
-    const excludedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in");
-    const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId);
-    if(excludedFacilityGroupIds.length) excludedCondition["fieldValue"] = excludedFacilityGroupIds.join(",")
-
-    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-      Object.entries(filters as any).map(([filter, value]: any) => {
-        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
-        if(condition) {
-          condition["fieldValue"] = value.length ? value.join(",") : ""
-        }
-      })
-    })
-
-    return ruleConditions;
-  } else {
-    const conditions = [];
-
-    const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
-    conditions.push({
-      "ruleId": ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilityGroups",
-      "operator": "in",
-      "fieldValue": includedFacilityGroupIds ? includedFacilityGroupIds.join(",") : "",
-      "multiValued": "Y"
-    })
-
-    const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
-    conditions.push({
-      "ruleId": ruleId,
-      "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-      "fieldName": "facilityGroups",
-      "operator": "not-in",
-      "fieldValue": excludedFacilityGroupIds.length ? excludedFacilityGroupIds.join(",") : "",
-      "multiValued": "Y"
-    })
-
-    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-      Object.entries(filters as any).map(([filter, value]: any) => {
-        conditions.push({
-          "ruleId": ruleId,
-          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-          "fieldName": filter,
-          "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.length ? value.join(",") : "",
-          "multiValued": "Y"
-        })
-      })
-    })
-
-    return conditions;
-  }
-}
-
 async function createRule() {
   if(!isRuleValid()) return;
 
@@ -306,8 +227,8 @@ async function createRule() {
     const rule = await RuleService.createRule(params)
     await RuleService.updateRule({
       ...params,
-      "ruleConditions": generateRuleConditions(rule.ruleId),
-      "ruleActions": generateRuleActions(rule.ruleId)
+      "ruleConditions": generateRuleConditions(rule.ruleId, "ENTCT_ATP_FAC_GROUPS", appliedFilters.value, formData.value.selectedFacilityGroups),
+      "ruleActions": generateRuleActions(rule.ruleId, "ATP_SAFETY_STOCK", formData.value.safetyStock, false, [])
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
@@ -324,14 +245,28 @@ async function createRule() {
 async function updateRule() {
   if(!isRuleValid()) return;
 
+  const currentRuleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
+  const updatedRuleConditions = generateRuleConditions(props.ruleId, "ENTCT_ATP_FAC_GROUPS", appliedFilters.value, formData.value.selectedFacilityGroups);
+  const conditionsToRemove = currentRuleConditions.filter((condition: any) => !updatedRuleConditions.some((updatedCondition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator))
+
+  updatedRuleConditions.map((updatedCondition: any) => {
+    const current = currentRuleConditions.find((condition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator);
+    if(current) updatedCondition["conditionSeqId"] = current.conditionSeqId;
+  })
+
   try {
     await RuleService.updateRule({
       ...currentRule.value,
       "ruleName": formData.value.ruleName,
-      "ruleConditions": generateRuleConditions(props.ruleId),
-      "ruleActions": generateRuleActions(props.ruleId)
+      "ruleConditions": updatedRuleConditions,
+      "ruleActions": generateRuleActions(props.ruleId, "ATP_SAFETY_STOCK", formData.value.safetyStock, true, currentRule.value.ruleActions)
     }, props.ruleId);
     showToast(translate("Rule updated successfully."))
+
+    const removeResponses = await Promise.allSettled(conditionsToRemove.map(async (condition: any) => await RuleService.deleteCondition({ ...condition, ruleId: props.ruleId})));
+    const hasFailedResponse = removeResponses.some((response: any) => response.status === 'rejected');
+    if(hasFailedResponse) logger.error("Failed to delete some rule conditions.")
+
     store.dispatch("rule/clearRuleState")
     store.dispatch("util/clearAppliedFilters")
     router.push("/safety-stock");
@@ -346,7 +281,7 @@ function isRuleValid() {
     return false;
   }
 
-  if(formData.value.safety < 0) {
+  if(formData.value.safetyStock < 0) {
     showToast(translate("Safety stock should be greater than or equal to 0."));
     return false;
   }

From 52317d1b8edded6b3c9babcffa144d18101dc2ff Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 17:03:32 +0530
Subject: [PATCH 224/250] Improved: logic to generate and update rule
 conditions and actions (#328)

---
 src/components/RuleItem.vue               |   4 +-
 src/views/CreateUpdateShippingRule.vue    | 124 ++++-----------------
 src/views/CreateUpdateStorePickupRule.vue | 125 ++++------------------
 3 files changed, 45 insertions(+), 208 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 84d1661f..97c1cf27 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -25,11 +25,11 @@
           </ion-item>
           <ion-item lines="full" v-else-if="selectedPage.path === '/store-pickup'">
             <ion-icon slot="start" :icon="storefrontOutline"/>
-            <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRulePickup($event)">{{ translate(selectedPage.name) }}</ion-toggle>
+            <ion-toggle :checked="props.rule.ruleActions[0].fieldValue === 'Y' ? true : false" @click.prevent="updateRulePickup($event)">{{ translate(selectedPage.name) }}</ion-toggle>
           </ion-item>
           <ion-item lines="full" v-else-if="selectedPage.path === '/shipping'">
             <ion-icon slot="start" :icon="sendOutline"/>
-            <ion-toggle :checked="props.rule.ruleActions ? props.rule.ruleActions[0].fieldValue : false" @click.prevent="updateRuleShipping($event)">{{ translate(selectedPage.name) }}</ion-toggle>
+            <ion-toggle :checked="props.rule.ruleActions[0].fieldValue === 'Y' ? true : false" @click.prevent="updateRuleShipping($event)">{{ translate(selectedPage.name) }}</ion-toggle>
           </ion-item>
 
           <template v-if="selectedPage.path === '/threshold' || selectedSegment === 'RG_PICKUP_CHANNEL' || selectedSegment === 'RG_SHIPPING_CHANNEL'">
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index cef53cd4..ed608c05 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -112,7 +112,7 @@ import ProductFilters from '@/components/ProductFilters.vue';
 import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
 import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
-import { hasError, showToast } from '@/utils';
+import { generateRuleActions, generateRuleConditions, hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import { useRouter } from 'vue-router';
 import emitter from '@/event-bus';
@@ -156,11 +156,11 @@ onIonViewWillEnter(async () => {
 
         if(selectedSegment.value === "RG_SHIPPING_FACILITY") {
           const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
-          const includedGroupIds = includedGroups.fieldValue ? includedGroups.fieldValue.split(",") : []
+          const includedGroupIds = includedGroups?.fieldValue ? includedGroups.fieldValue.split(",") : []
           formData.value.selectedFacilityGroups.included = facilityGroups.value.filter((group: any) => includedGroupIds.includes(group.facilityGroupId));
 
           const excludedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in")
-          const excludedGroupIds = excludedGroups.fieldValue ? excludedGroups.fieldValue.split(",") : []
+          const excludedGroupIds = excludedGroups?.fieldValue ? excludedGroups.fieldValue.split(",") : []
           formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
         } else if(selectedSegment.value === "RG_SHIPPING_CHANNEL") {
           const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
@@ -267,8 +267,8 @@ async function createRule() {
     const rule = await RuleService.createRule(params)
     await RuleService.updateRule({
       ...params,
-      "ruleConditions": generateRuleConditions(rule.ruleId),
-      "ruleActions": generateRuleActions(rule.ruleId)
+      "ruleConditions": generateRuleConditions(rule.ruleId, selectedSegment.value === 'RG_SHIPPING_FACILITY' ? "ENTCT_ATP_FAC_GROUPS" : "ENTCT_ATP_FACILITIES", appliedFilters.value, selectedSegment.value === 'RG_SHIPPING_FACILITY' ? formData.value.selectedFacilityGroups : formData.value.selectedConfigFacilites),
+      "ruleActions": generateRuleActions(rule.ruleId, "ATP_ALLOW_BROKERING", formData.value.isBrokeringAllowed, false, [])
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
@@ -282,113 +282,31 @@ async function createRule() {
   emitter.emit("dismissLoader");
 }
 
-function generateRuleActions(ruleId: string) {
-  if(currentRule.value.ruleId) {
-    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "ATP_ALLOW_BROKERING")
-    if(ruleAction) {
-      ruleAction.fieldValue = formData.value.isBrokeringAllowed ? 'Y' : 'N';
-      return [ruleAction];
-    }
-  }
-
-  return [{
-    "ruleId": ruleId,
-    "actionTypeEnumId": "ATP_ALLOW_BROKERING",
-    "fieldName": "allow-brokering",
-    "fieldValue": formData.value.isBrokeringAllowed ? 'Y' : 'N'
-  }]
-}
-
-function generateRuleConditions(ruleId: string) {
-  if(currentRule.value.ruleId) {
-    const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
-
-    if(selectedSegment.value === 'RG_SHIPPING_FACILITY') {
-      const includedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in");
-      const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId);
-      if(includedFacilityGroupIds.length) includedCondition["fieldValue"] = includedFacilityGroupIds.join(",")
-  
-      const excludedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in");
-      const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId);
-      if(excludedFacilityGroupIds.length) excludedCondition["fieldValue"] = excludedFacilityGroupIds.join(",")
-    } else {
-      const facilityCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES");
-      if(facilityCondition) facilityCondition["fieldValue"] = formData.value.selectedConfigFacilites.join(",");
-    }
-
-    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-      Object.entries(filters as any).map(([filter, value]: any) => {
-        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
-        if(condition) {
-          condition["fieldValue"] = value.length ? value.join(",") : ""
-        }
-      })
-    })
-
-    return ruleConditions;
-  } else {
-    const conditions = [];
-
-    if(selectedSegment.value === 'RG_SHIPPING_FACILITY') {
-      const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
-      conditions.push({
-        "ruleId": ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-        "fieldName": "facilityGroups",
-        "operator": "in",
-        "fieldValue": includedFacilityGroupIds.length ? includedFacilityGroupIds.join(",") : "",
-        "multiValued": "Y"
-      })
-
-      const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
-      conditions.push({
-        "ruleId": ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-        "fieldName": "facilityGroups",
-        "operator": "not-in",
-        "fieldValue": excludedFacilityGroupIds.length ? excludedFacilityGroupIds.join(",") : "",
-        "multiValued": "Y"
-      })
-    } else {
-      const selectedFacilites = formData.value.selectedConfigFacilites
-      conditions.push({
-        "ruleId": ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
-        "fieldName": "facilities",
-        "operator": "in",
-        "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
-        "multiValued": "Y"
-      })
-    }
-
-    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-      Object.entries(filters as any).map(([filter, value]: any) => {
-        conditions.push({
-          "ruleId": ruleId,
-          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-          "fieldName": filter,
-          "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.length ? value.join(",") : "",
-          "multiValued": "Y"
-        })
-      })
-    })
-
-    return conditions;
-  }
-}
-
 async function updateRule() {
   if(!isRuleValid()) return;
 
+  const currentRuleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
+  const updatedRuleConditions = generateRuleConditions(props.ruleId, selectedSegment.value === 'RG_SHIPPING_FACILITY' ? "ENTCT_ATP_FAC_GROUPS" : "ENTCT_ATP_FACILITIES", appliedFilters.value, selectedSegment.value === 'RG_SHIPPING_FACILITY' ? formData.value.selectedFacilityGroups : formData.value.selectedConfigFacilites);
+  const conditionsToRemove = currentRuleConditions.filter((condition: any) => !updatedRuleConditions.some((updatedCondition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator))
+
+  updatedRuleConditions.map((updatedCondition: any) => {
+    const current = currentRuleConditions.find((condition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator);
+    if(current) updatedCondition["conditionSeqId"] = current.conditionSeqId;
+  })
+
   try {
     await RuleService.updateRule({
       ...currentRule.value,
       "ruleName": formData.value.ruleName,
-      "ruleConditions": generateRuleConditions(props.ruleId),
-      "ruleActions": generateRuleActions(props.ruleId)
+      "ruleConditions": updatedRuleConditions,
+      "ruleActions": generateRuleActions(props.ruleId, "ATP_ALLOW_BROKERING", formData.value.isBrokeringAllowed, true, currentRule.value.ruleActions)
     }, props.ruleId);
     showToast(translate("Rule updated successfully."))
+
+    const removeResponses = await Promise.allSettled(conditionsToRemove.map(async (condition: any) => await RuleService.deleteCondition({ ...condition, ruleId: props.ruleId})));
+    const hasFailedResponse = removeResponses.some((response: any) => response.status === 'rejected');
+    if(hasFailedResponse) logger.error("Failed to delete some rule conditions.")
+
     store.dispatch("rule/clearRuleState")
     store.dispatch("util/clearAppliedFilters")
     router.push('/shipping');
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 2282ccdf..897113c2 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -112,7 +112,7 @@ import { useRouter } from 'vue-router';
 import AddProductFacilityGroupModal from '@/components/AddProductFacilityGroupModal.vue';
 import { useStore } from 'vuex';
 import { RuleService } from '@/services/RuleService';
-import { hasError, showToast } from '@/utils';
+import { generateRuleActions, generateRuleConditions, hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import emitter from '@/event-bus';
 
@@ -156,11 +156,12 @@ onIonViewWillEnter(async () => {
 
         if(selectedSegment.value === "RG_PICKUP_FACILITY") {
           const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
-          const includedGroupIds = includedGroups.fieldValue ? includedGroups.fieldValue.split(",") : []
+          const includedGroupIds = includedGroups?.fieldValue ? includedGroups.fieldValue.split(",") : []
           formData.value.selectedFacilityGroups.included = facilityGroups.value.filter((group: any) => includedGroupIds.includes(group.facilityGroupId));
           
+          
           const excludedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in")
-          const excludedGroupIds = excludedGroups.fieldValue ? excludedGroups.fieldValue.split(",") : []
+          const excludedGroupIds = excludedGroups?.fieldValue ? excludedGroups.fieldValue.split(",") : []
           formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
         } else if(selectedSegment.value === "RG_PICKUP_CHANNEL") {
           const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
@@ -268,8 +269,8 @@ async function createRule() {
     const rule = await RuleService.createRule(params)
     await RuleService.updateRule({
       ...params,
-      "ruleConditions": generateRuleConditions(rule.ruleId),
-      "ruleActions": generateRuleActions(rule.ruleId)
+      "ruleConditions": generateRuleConditions(rule.ruleId, selectedSegment.value === 'RG_PICKUP_FACILITY' ? "ENTCT_ATP_FAC_GROUPS" : "ENTCT_ATP_FACILITIES", appliedFilters.value, selectedSegment.value === 'RG_PICKUP_FACILITY' ? formData.value.selectedFacilityGroups : formData.value.selectedConfigFacilites),
+      "ruleActions": generateRuleActions(rule.ruleId, "ATP_ALLOW_PICKUP", formData.value.isPickupAllowed, false, [])
     }, rule.ruleId);
 
     showToast(translate("Rule created successfully."))
@@ -283,113 +284,31 @@ async function createRule() {
   emitter.emit("dismissLoader");
 }
 
-function generateRuleActions(ruleId: string) {
-  if(currentRule.value.ruleId) {
-    const ruleAction = currentRule.value.ruleActions.find((action: any) => action.actionTypeEnumId === "ATP_ALLOW_PICKUP")
-    if(ruleAction) {
-      ruleAction.fieldValue = formData.value.isPickupAllowed ? 'Y' : 'N';
-      return [ruleAction];
-    }
-  }
-
-  return [{
-    "ruleId": ruleId,
-    "actionTypeEnumId": "ATP_ALLOW_PICKUP",
-    "fieldName": "allow-pickup",
-    "fieldValue": formData.value.isPickupAllowed ? 'Y' : 'N'
-  }]
-}
-
-function generateRuleConditions(ruleId: string) {
-  if(currentRule.value.ruleId) {
-    const ruleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
-
-    if(selectedSegment.value === 'RG_PICKUP_FACILITY') {
-      const includedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in");
-      const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId);
-      if(includedFacilityGroupIds.length) includedCondition["fieldValue"] = includedFacilityGroupIds.join(",")
-  
-      const excludedCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in");
-      const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId);
-      if(excludedFacilityGroupIds.length) excludedCondition["fieldValue"] = excludedFacilityGroupIds.join(",")
-    } else {
-      const facilityCondition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES");
-      if(facilityCondition) facilityCondition["fieldValue"] = formData.value.selectedConfigFacilites.join(",");
-    }
-
-    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-      Object.entries(filters as any).map(([filter, value]: any) => {
-        const condition = ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FILTER" && condition.fieldName === filter && condition.operator === (type === "included" ? "in" : "not-in"))
-        if(condition) {
-          condition["fieldValue"] = value.length ? value.join(",") : ""
-        }
-      })
-    })
-
-    return ruleConditions;
-  } else {
-    const conditions = [];
-
-    if(selectedSegment.value === 'RG_PICKUP_FACILITY') {
-      const includedFacilityGroupIds = formData.value.selectedFacilityGroups.included.map((group: any) => group.facilityGroupId)  
-      conditions.push({
-        "ruleId": ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-        "fieldName": "facilityGroups",
-        "operator": "in",
-        "fieldValue": includedFacilityGroupIds.length ? includedFacilityGroupIds.join(",") : "",
-        "multiValued": "Y"
-      })
-
-      const excludedFacilityGroupIds = formData.value.selectedFacilityGroups.excluded.map((group: any) => group.facilityGroupId)
-      conditions.push({
-        "ruleId": ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-        "fieldName": "facilityGroups",
-        "operator": "not-in",
-        "fieldValue": excludedFacilityGroupIds.length ? excludedFacilityGroupIds.join(",") : "",
-        "multiValued": "Y"
-      })
-    } else {
-      const selectedFacilites = formData.value.selectedConfigFacilites
-      conditions.push({
-        "ruleId": ruleId,
-        "conditionTypeEnumId": "ENTCT_ATP_FACILITIES",
-        "fieldName": "facilities",
-        "operator": "in",
-        "fieldValue": selectedFacilites.length ? selectedFacilites.join(",") : "",
-        "multiValued": "Y"
-      })
-    }
-
-    Object.entries(appliedFilters.value).map(([type, filters]: any) => {
-      Object.entries(filters as any).map(([filter, value]: any) => {
-        conditions.push({
-          "ruleId": ruleId,
-          "conditionTypeEnumId": "ENTCT_ATP_FILTER",
-          "fieldName": filter,
-          "operator": type === "included" ? "in" : "not-in",
-          "fieldValue": value.length ? value.join(",") : "",
-          "multiValued": "Y"
-        })
-      })
-    })
-
-    return conditions;
-  }
-}
-
 async function updateRule() {
   if(!isRuleValid()) return;
 
+  const currentRuleConditions = JSON.parse(JSON.stringify(currentRule.value.ruleConditions));
+  const updatedRuleConditions = generateRuleConditions(props.ruleId, selectedSegment.value === 'RG_PICKUP_FACILITY' ? "ENTCT_ATP_FAC_GROUPS" : "ENTCT_ATP_FACILITIES", appliedFilters.value, selectedSegment.value === 'RG_PICKUP_FACILITY' ? formData.value.selectedFacilityGroups : formData.value.selectedConfigFacilites);
+  const conditionsToRemove = currentRuleConditions.filter((condition: any) => !updatedRuleConditions.some((updatedCondition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator))
+
+  updatedRuleConditions.map((updatedCondition: any) => {
+    const current = currentRuleConditions.find((condition: any) => condition.conditionTypeEnumId === updatedCondition.conditionTypeEnumId && condition.fieldName === updatedCondition.fieldName && condition.operator === updatedCondition.operator);
+    if(current) updatedCondition["conditionSeqId"] = current.conditionSeqId;
+  })
+
   try {
     await RuleService.updateRule({
       ...currentRule.value,
       "ruleName": formData.value.ruleName,
-      "ruleConditions": generateRuleConditions(props.ruleId),
-      "ruleActions": generateRuleActions(props.ruleId)
+      "ruleConditions": updatedRuleConditions,
+      "ruleActions": generateRuleActions(props.ruleId, "ATP_ALLOW_PICKUP", formData.value.isPickupAllowed, true, currentRule.value.ruleActions)
     }, props.ruleId);
     showToast(translate("Rule updated successfully."))
+
+    const removeResponses = await Promise.allSettled(conditionsToRemove.map(async (condition: any) => await RuleService.deleteCondition({ ...condition, ruleId: props.ruleId})));
+    const hasFailedResponse = removeResponses.some((response: any) => response.status === 'rejected');
+    if(hasFailedResponse) logger.error("Failed to delete some rule conditions.")
+
     store.dispatch("rule/clearRuleState")
     store.dispatch("util/clearAppliedFilters")
     router.push('/store-pickup');

From 2271a29f1384017e043720777a9f43174bca0700 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 18:13:08 +0530
Subject: [PATCH 225/250] Improved: hide item divider for the product filters
 if not available(#328)

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

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 97c1cf27..c4af588e 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -59,7 +59,7 @@
           </template>
 
           <template v-if="areProductFiltersSelected()">
-            <ion-item-divider color="light">
+            <ion-item-divider color="light" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in') || isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
               <ion-label>{{ translate("Product tags") }}</ion-label>
             </ion-item-divider>
 
@@ -72,7 +72,7 @@
               <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
             </ion-item>
 
-            <ion-item-divider color="light">
+            <ion-item-divider color="light" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in') || isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in')">
               <ion-label>{{ translate("Product features") }}</ion-label>
             </ion-item-divider>
 

From bba3020055ebe3c50366529a697d6867212e6b6f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 18:32:15 +0530
Subject: [PATCH 226/250] Reverted: size default attribute from the button
 (#291)

---
 src/components/RuleItem.vue         | 2 +-
 src/components/ScheduleRuleItem.vue | 2 +-
 src/views/InventoryChannels.vue     | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 9ac704aa..289d1e94 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -97,7 +97,7 @@
           </template>
 
           <div class="actions">
-            <ion-button @click="editRule()" size="default" fill="clear">{{ translate("Edit rule") }}</ion-button>
+            <ion-button @click="editRule()" fill="clear">{{ translate("Edit rule") }}</ion-button>
             <ion-button @click="archiveRule()" color="medium" fill="clear" slot="end">
               <ion-icon :icon="archiveOutline" slot="icon-only"/>
             </ion-button>
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index de7b0d2e..a35fafda 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -23,7 +23,7 @@
         </ion-item>
       
         <div class="actions">
-          <ion-button size="default" fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
+          <ion-button fill="clear" :disabled="ruleGroup.schedule?.paused === 'N'" @click="saveSchedule()">{{ translate("Schedule") }}</ion-button>
           <ion-button color="medium" fill="clear" slot="end" @click="openScheduleActionsPopover($event)">
             <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>
           </ion-button>
diff --git a/src/views/InventoryChannels.vue b/src/views/InventoryChannels.vue
index 814a95c7..be207239 100644
--- a/src/views/InventoryChannels.vue
+++ b/src/views/InventoryChannels.vue
@@ -60,7 +60,7 @@
                 </ion-item>
     
                 <div class="actions">
-                  <ion-button fill="clear" size="default" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
+                  <ion-button fill="clear" @click="openEditGroupModal(channel)">{{ translate("Edit group") }}</ion-button>
                   <!-- Functionality is not defined for this button hence commented it for now. -->
                   <!-- <ion-button color="medium" fill="clear" slot="end">
                     <ion-icon :icon="ellipsisVerticalOutline" slot="icon-only"/>

From 69ff0977116c55fdbd6f9a32fed436b66ea84082 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 18:39:49 +0530
Subject: [PATCH 227/250] Improved: added validation for the create shipping
 rule (#328)

---
 src/views/CreateUpdateShippingRule.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index ed608c05..a7b90ef9 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -243,6 +243,7 @@ function isFacilitySelected(facilityId: any) {
 }
 
 async function createRule() {
+  if(!isRuleValid()) return;
 
   emitter.emit("presentLoader");
 

From 3838fc463c5416d41ec86a65e5762ac13893227e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 19:01:32 +0530
Subject: [PATCH 228/250] Improved: fieldName for rule conditions and removed
 unused console (#328)

---
 src/components/RuleItem.vue |  9 ++++-----
 src/utils/index.ts          | 11 +++--------
 2 files changed, 7 insertions(+), 13 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index c4af588e..30a36a56 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -48,13 +48,13 @@
               <ion-label>{{ translate("Facility groups") }}</ion-label>
             </ion-item-divider>
             
-            <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'in')">
+            <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroupId', 'in')">
               <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
-              <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "in") }}</ion-label>
+              <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroupId", "in") }}</ion-label>
             </ion-item>
-            <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroups', 'not-in')">
+            <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FAC_GROUPS', 'facilityGroupId', 'not-in')">
               <ion-icon slot="start" :icon="closeCircleOutline"/>
-              <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroups", "not-in") }}</ion-label>
+              <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FAC_GROUPS", "facilityGroupId", "not-in") }}</ion-label>
             </ion-item>
           </template>
 
@@ -271,7 +271,6 @@ function getRuleConditions(conditionTypeEnumId: string, fieldName?: string, oper
   if(fieldName && operator) {
     const condition = props.rule.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === conditionTypeEnumId && condition.fieldName === fieldName && condition.operator === operator)
     if(condition && conditionTypeEnumId === 'ENTCT_ATP_FAC_GROUPS') {
-      
       let facilityGroupIds = condition?.fieldValue.split(",")
         facilityGroupIds = facilityGroupIds.map((id: string) => {
           let group = facilityGroups.value.find((group: any) => group.facilityGroupId === id)
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 556369a7..cf388fd4 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -103,25 +103,21 @@ const generateRuleConditions = (ruleId: string, conditionTypeEnumId: string, app
   const conditions = [];
 
   if(conditionTypeEnumId === "ENTCT_ATP_FACILITIES") {
-    console.log('entered');
-    
     conditions.push({
       "ruleId": ruleId,
       conditionTypeEnumId,
-      "fieldName": "facilities",
+      "fieldName": "facilityId",
       "operator": "in",
       "fieldValue": selectedFac.length ? selectedFac.join(",") : "",
       "multiValued": "Y"
     })
   } else {
     const includedFacilityGroupIds = selectedFac.included.map((group: any) => group.facilityGroupId)  
-    console.log(includedFacilityGroupIds);
-    
     if(includedFacilityGroupIds.length) {
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-        "fieldName": "facilityGroups",
+        "fieldName": "facilityGroupId",
         "operator": "in",
         "fieldValue": includedFacilityGroupIds.join(","),
         "multiValued": "Y"
@@ -129,12 +125,11 @@ const generateRuleConditions = (ruleId: string, conditionTypeEnumId: string, app
     }
     
     const excludedFacilityGroupIds = selectedFac.excluded.map((group: any) => group.facilityGroupId)
-    console.log(excludedFacilityGroupIds);
     if(excludedFacilityGroupIds.length) {
       conditions.push({
         "ruleId": ruleId,
         "conditionTypeEnumId": "ENTCT_ATP_FAC_GROUPS",
-        "fieldName": "facilityGroups",
+        "fieldName": "facilityGroupId",
         "operator": "not-in",
         "fieldValue": excludedFacilityGroupIds.join(","),
         "multiValued": "Y"

From 2166769622b7b8badaf40827053c3e30dc24ef1e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Thu, 23 May 2024 19:10:48 +0530
Subject: [PATCH 229/250] Fixed: store pickup and shipping toggle issue (#328)

---
 src/components/RuleItem.vue               | 4 ++--
 src/views/CreateUpdateShippingRule.vue    | 2 +-
 src/views/CreateUpdateStorePickupRule.vue | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index 30a36a56..1ffa3f1d 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -342,7 +342,7 @@ async function updateRulePickup(event: any) {
   try {
     const rule = JSON.parse(JSON.stringify(props.rule))
     rule.ruleActions.map((action: any) => {
-      if(action.actionTypeEnumId === "ATP_ALLOW_PICKUP") action.fieldValue = isChecked
+      if(action.actionTypeEnumId === "ATP_ALLOW_PICKUP") action.fieldValue = isChecked ? "Y" : "N"
     })
 
     await RuleService.updateRule(rule, props.rule.ruleId)
@@ -364,7 +364,7 @@ async function updateRuleShipping(event: any) {
   try {
     const rule = JSON.parse(JSON.stringify(props.rule))
     rule.ruleActions.map((action: any) => {
-      if(action.actionTypeEnumId === "ATP_ALLOW_BROKERING") action.fieldValue = isChecked
+      if(action.actionTypeEnumId === "ATP_ALLOW_BROKERING") action.fieldValue = isChecked ? "Y" : "N"
     })
 
     await RuleService.updateRule(rule, props.rule.ruleId)
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index a7b90ef9..d4fb53e7 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -152,7 +152,7 @@ onIonViewWillEnter(async () => {
         currentRule.value = resp.data[0];
 
         formData.value.ruleName = currentRule.value.ruleName;
-        formData.value.isBrokeringAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0].fieldValue : ''
+        formData.value.isBrokeringAllowed = currentRule.value.ruleActions[0]?.fieldValue === "Y" ? true : false;
 
         if(selectedSegment.value === "RG_SHIPPING_FACILITY") {
           const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 897113c2..45bb7c3c 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -152,7 +152,7 @@ onIonViewWillEnter(async () => {
         currentRule.value = resp.data[0];
 
         formData.value.ruleName = currentRule.value.ruleName;
-        formData.value.isPickupAllowed = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0].fieldValue : ''
+        formData.value.isPickupAllowed = currentRule.value.ruleActions[0]?.fieldValue === "Y" ? true : false;
 
         if(selectedSegment.value === "RG_PICKUP_FACILITY") {
           const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")

From 4ba4a53113356f445efe85b02ab3bb8bd96170e9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 24 May 2024 08:14:33 +0530
Subject: [PATCH 230/250] Improved: logic for prefilling current rule data in
 case of updateRule (#328)

---
 src/views/CreateUpdateSafetyStockRule.vue | 12 ++++++------
 src/views/CreateUpdateShippingRule.vue    | 10 +++++-----
 src/views/CreateUpdateStorePickupRule.vue | 13 ++++++-------
 src/views/CreateUpdateThresholdRule.vue   | 10 +++++-----
 4 files changed, 22 insertions(+), 23 deletions(-)

diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index fdbb8773..30f4678d 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -84,7 +84,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardTitle, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToolbar, modalController, onIonViewDidEnter  , onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
@@ -117,8 +117,8 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
-onIonViewWillEnter(async () => {
-  fetchStoreConfig();
+onIonViewDidEnter(async () => {
+  await fetchStoreConfig();
   emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
 
   if(props.ruleId) {
@@ -132,11 +132,11 @@ onIonViewWillEnter(async () => {
         formData.value.safetyStock = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0].fieldValue : ''
 
         const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
-        const includedGroupIds = includedGroups.fieldValue ? includedGroups.fieldValue.split(",") : []
+        const includedGroupIds = includedGroups?.fieldValue ? includedGroups.fieldValue.split(",") : []
         formData.value.selectedFacilityGroups.included = facilityGroups.value.filter((group: any) => includedGroupIds.includes(group.facilityGroupId));
         
         const excludedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in")
-        const excludedGroupIds = excludedGroups.fieldValue ? excludedGroups.fieldValue.split(",") : []
+        const excludedGroupIds = excludedGroups?.fieldValue ? excludedGroups.fieldValue.split(",") : []
         formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
 
         const currentAppliedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
@@ -175,11 +175,11 @@ onIonViewWillLeave(() => {
 
 async function fetchStoreConfig() {
   emitter.emit("presentLoader");
-  await store.dispatch("util/fetchFacilityGroups")
   formData.value.selectedFacilityGroups = {
     included: [],
     excluded: []
   }
+  await store.dispatch("util/fetchFacilityGroups")
   emitter.emit("dismissLoader");
 }
 
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index d4fb53e7..e832058e 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -104,7 +104,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewDidEnter, onIonViewWillLeave } from '@ionic/vue';
 import { computed, defineProps, ref } from 'vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
@@ -141,8 +141,8 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 
-onIonViewWillEnter(async () => {
-  fetchStoreConfig();
+onIonViewDidEnter(async () => {
+  await fetchStoreConfig();
   emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
   if(props.ruleId) {
     try {
@@ -164,7 +164,7 @@ onIonViewWillEnter(async () => {
           formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
         } else if(selectedSegment.value === "RG_SHIPPING_CHANNEL") {
           const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
-          formData.value.selectedConfigFacilites = facilityCondition.fieldValue?.split(",");
+          formData.value.selectedConfigFacilites = facilityCondition?.fieldValue ?  facilityCondition.fieldValue.split(",") : [];
         }
 
         const currentAppliedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
@@ -203,12 +203,12 @@ onIonViewWillLeave(() => {
 
 async function fetchStoreConfig() {
   emitter.emit("presentLoader");
-  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
   formData.value.selectedFacilityGroups = {
     included: [],
     excluded: []
   }
   formData.value.selectedConfigFacilites = []
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
   emitter.emit("dismissLoader");
 }
 
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 45bb7c3c..542e210d 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -103,7 +103,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewWillEnter, onIonViewWillLeave } from '@ionic/vue';
+import { IonBackButton, IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonChip, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonLabel, IonNote, IonPage, IonText, IonTitle, IonToggle, IonToolbar, modalController, onIonViewDidEnter, onIonViewWillLeave } from '@ionic/vue';
 import { addCircleOutline, closeCircle, saveOutline, storefrontOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import { computed, defineProps, ref } from 'vue';
@@ -140,8 +140,8 @@ const formData = ref({
   selectedConfigFacilites: []
 }) as any;
 
-onIonViewWillEnter(async () => {
-  fetchStoreConfig();
+onIonViewDidEnter(async () => {
+  await fetchStoreConfig();
   emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
 
   if(props.ruleId) {
@@ -158,14 +158,13 @@ onIonViewWillEnter(async () => {
           const includedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "in")
           const includedGroupIds = includedGroups?.fieldValue ? includedGroups.fieldValue.split(",") : []
           formData.value.selectedFacilityGroups.included = facilityGroups.value.filter((group: any) => includedGroupIds.includes(group.facilityGroupId));
-          
-          
+
           const excludedGroups = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FAC_GROUPS" && condition.operator === "not-in")
           const excludedGroupIds = excludedGroups?.fieldValue ? excludedGroups.fieldValue.split(",") : []
           formData.value.selectedFacilityGroups.excluded = facilityGroups.value.filter((group: any) => excludedGroupIds.includes(group.facilityGroupId));
         } else if(selectedSegment.value === "RG_PICKUP_CHANNEL") {
           const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
-          formData.value.selectedConfigFacilites = facilityCondition.fieldValue?.split(",");
+          formData.value.selectedConfigFacilites = facilityCondition?.fieldValue ? facilityCondition.fieldValue.split(",") : [];
         }
         
         const currentAppliedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
@@ -204,12 +203,12 @@ onIonViewWillLeave(() => {
 
 async function fetchStoreConfig() {
   emitter.emit("presentLoader");
-  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
   formData.value.selectedFacilityGroups = {
     included: [],
     excluded: []
   }
   formData.value.selectedConfigFacilites = []
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
   emitter.emit("dismissLoader");
 }
 
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index 56799bd6..d11a61fe 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -61,7 +61,7 @@
 </template>
 
 <script setup lang="ts">
-import { IonBackButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonPage, IonNote, IonText, IonTitle, IonToolbar, onIonViewWillLeave, onIonViewWillEnter } from '@ionic/vue';
+import { IonBackButton, IonCard, IonCardHeader, IonCardSubtitle, IonCardTitle, IonCheckbox, IonContent, IonFab, IonFabButton, IonHeader, IonIcon, IonInput, IonItem, IonPage, IonNote, IonText, IonTitle, IonToolbar, onIonViewWillLeave, onIonViewDidEnter } from '@ionic/vue';
 import { saveOutline } from 'ionicons/icons'
 import { translate } from "@/i18n";
 import ProductFilters from '@/components/ProductFilters.vue';
@@ -88,8 +88,8 @@ const rules = computed(() => store.getters["rule/getRules"]);
 const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
-onIonViewWillEnter(async () => {
-  fetchStoreConfig();
+onIonViewDidEnter(async () => {
+  await fetchStoreConfig();
   emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
 
   if(props.ruleId) {
@@ -103,7 +103,7 @@ onIonViewWillEnter(async () => {
         formData.value.threshold = currentRule.value.ruleActions[0]?.fieldValue ? currentRule.value.ruleActions[0].fieldValue : ''
 
         const facilityCondition = currentRule.value.ruleConditions.find((condition: any) => condition.conditionTypeEnumId === "ENTCT_ATP_FACILITIES")
-        formData.value.selectedConfigFacilites = facilityCondition.fieldValue?.split(",");
+        formData.value.selectedConfigFacilites = facilityCondition?.fieldValue ? facilityCondition.fieldValue?.split(",") : [];
 
         const currentAppliedFilters = JSON.parse(JSON.stringify(appliedFilters.value))
         currentRule.value.ruleConditions.map((condition: any) => {
@@ -138,8 +138,8 @@ onIonViewWillLeave(() => {
 
 async function fetchStoreConfig() {
   emitter.emit("presentLoader");
-  await store.dispatch("util/fetchConfigFacilities");
   formData.value.selectedConfigFacilites = [];
+  await store.dispatch("util/fetchConfigFacilities");
   emitter.emit("dismissLoader");
 }
 

From 9c47b69088ba28d61353e4394f935e47242fbae4 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 24 May 2024 11:58:38 +0530
Subject: [PATCH 231/250] Improved: added alert before changing product store
 from create/update store page (#328)

---
 src/components/Menu.vue                   | 43 +++++++++++++++++++----
 src/locales/en.json                       | 10 ++++--
 src/views/CreateUpdateSafetyStockRule.vue | 18 ++++------
 src/views/CreateUpdateShippingRule.vue    | 19 ++++------
 src/views/CreateUpdateStorePickupRule.vue | 19 ++++------
 src/views/CreateUpdateThresholdRule.vue   | 15 ++++----
 6 files changed, 72 insertions(+), 52 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 5d6b25a9..20067494 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -66,6 +66,7 @@
   import { cloudUploadOutline, globeOutline, settingsOutline, sendOutline, storefrontOutline, pulseOutline } from 'ionicons/icons';
   import { translate } from "@/i18n";
   import emitter from "@/event-bus";
+  import { alertController, SelectCustomEvent } from "@ionic/core";
 
   const store = useStore();
   const router = useRouter();
@@ -121,15 +122,45 @@
     return appPages.findIndex((screen) => screen.url === path || screen.childRoutes?.includes(path) || screen.childRoutes?.some((route) => path.includes(route)));
   });
 
-  function setEComStore(event: CustomEvent) {
+  async function setEComStore(event: SelectCustomEvent) {
+    const createUpdateRoute = ["/create-threshold", "/update-threshold/", "/create-safety-stock", "/update-safety-stock/", "/create-store-pickup", "update-store-pickup/", "/create-shipping", "/update-shipping/"]
+    const path = router.currentRoute.value.path;
     if(userProfile.value?.stores) {
-      store.dispatch("user/setEcomStore", {
-        "productStoreId": event.detail.value
-      })
-      emitter.emit("productStoreOrConfigChanged")
+      if(createUpdateRoute.some((route) => path.includes(route))) {
+        const alert = await alertController.create({
+          header: translate("Leave page"),
+          message: translate("Any page made on this page will be lost. You will not be able to reverse this action."),
+          buttons: [
+            {
+              text: translate("No"),
+              role: "cancel",
+              handler: async () => {
+                // Reverting the selected ecomStore in ion-select if user select no to change product store.
+                event.target.value = eComStore.value.productStoreId
+              }
+            },
+            {
+              text: translate("Yes"),
+              handler: async () => {
+                await store.dispatch("user/setEcomStore", {
+                  "productStoreId": event.detail.value
+                })
+                emitter.emit("productStoreOrConfigChanged")
+              }
+            }
+          ]
+        })
+
+        alert.present();
+      } else {
+        store.dispatch("user/setEcomStore", {
+          "productStoreId": event.detail.value
+        })
+        emitter.emit("productStoreOrConfigChanged")
+      }
     }
   }
-  </script>
+</script>
   
   <style scoped>
   ion-menu.md ion-item.selected ion-icon {
diff --git a/src/locales/en.json b/src/locales/en.json
index 63cef6f0..9707e076 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -3,6 +3,7 @@
   "add": "add",
   "Add": "Add",
   "All products selected.": "All products selected.",
+  "Any page made on this page will be lost. You will not be able to reverse this action.": "Any page made on this page will be lost. You will not be able to reverse this action.",
   "App": "App",
   "Apply": "Apply",
   "Are you sure you want to change the time zone to?": "Are you sure you want to change the time zone to?",
@@ -105,6 +106,7 @@
   "Jobs sequence updated successfully": "Jobs sequence updated successfully",
   "Keep editing": "Keep editing",
   "Last run": "Last run",
+  "Leave page": "Leave page",
   "Link facilities": "Link facilities",
   "Link threshold": "Link threshold",
   "Loading": "Loading",
@@ -120,6 +122,7 @@
   "New store pickup rule": "New store pickup rule",
   "New threshold rule": "New threshold rule",
   "New safety stock rule": "New safety stock rule",
+  "No": "No",
   "No available history for rule.": "No available history for {name} rule.",
   "No Capacity": "No Capacity",
   "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility. To add a fulfillment capacity to this facility, use the custom option.": "No capacity sets the fulfillment capacity to 0, preventing any new orders from being allocated to this facility.{space} To add a fulfillment capacity to this facility, use the custom option.",
@@ -135,9 +138,9 @@
   "No result found for": "No result found for {label}",
   "No rules found, redirecting to product page": "No rules found, redirecting to product page",
   "No sequence has been changed.": "No sequence has been changed.",
-  "No safety stock rules found.": "No safety stock rules found.",
-  "No shipping rules found.": "No shipping rules found.",
-  "No store pickup rules found.": "No store pickup rules found.",
+  "No safety stock rule found.": "No safety stock rule found.",
+  "No shipping rule found.": "No shipping rule found.",
+  "No store pickup rule found.": "No store pickup rule found.",
   "No threshold rule found. Invalid job": "No threshold rule found. Invalid job",
   "No threshold rule found.": "No threshold rule found.",
   "No time zone found": "No time zone found",
@@ -278,6 +281,7 @@
   "variants": "variants",
   "Version: ": "Version: {appVersion}",
   "warehouse": "{count} warehouse",
+  "Yes": "Yes",
   "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems": "You can also download the products, locations and safety stock you selected in a CSV to upload in other systems",
   "You do not have permission to access this page": "You do not have permission to access this page",
   "You do not have permission to access the app.": "You do not have permission to access the app."
diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index 30f4678d..e0eefb46 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -118,8 +118,10 @@ const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 onIonViewDidEnter(async () => {
-  await fetchStoreConfig();
-  emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
+  emitter.emit("presentLoader");
+  await store.dispatch("util/fetchFacilityGroups")
+  emitter.emit("dismissLoader");
+  emitter.on("productStoreOrConfigChanged", revertRedirect);
 
   if(props.ruleId) {
     try {
@@ -170,17 +172,11 @@ onIonViewWillLeave(() => {
     }
   }
   store.dispatch("util/clearAppliedFilters")
-  emitter.off("productStoreOrConfigChanged", fetchStoreConfig);
+  emitter.off("productStoreOrConfigChanged", revertRedirect);
 })
 
-async function fetchStoreConfig() {
-  emitter.emit("presentLoader");
-  formData.value.selectedFacilityGroups = {
-    included: [],
-    excluded: []
-  }
-  await store.dispatch("util/fetchFacilityGroups")
-  emitter.emit("dismissLoader");
+async function revertRedirect() {
+  router.push("/safety-stock");
 }
 
 async function openProductFacilityGroupModal(type: string) {
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index e832058e..d3298c6b 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -142,8 +142,10 @@ const formData = ref({
 }) as any;
 
 onIonViewDidEnter(async () => {
-  await fetchStoreConfig();
-  emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
+  emitter.emit("presentLoader");
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
+  emitter.emit("dismissLoader");
+  emitter.on("productStoreOrConfigChanged", revertRedirect);
   if(props.ruleId) {
     try {
       const resp = await RuleService.fetchRules({ ruleId: props.ruleId })
@@ -198,18 +200,11 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
-  emitter.off("productStoreOrConfigChanged", fetchStoreConfig);
+  emitter.off("productStoreOrConfigChanged", revertRedirect);
 })
 
-async function fetchStoreConfig() {
-  emitter.emit("presentLoader");
-  formData.value.selectedFacilityGroups = {
-    included: [],
-    excluded: []
-  }
-  formData.value.selectedConfigFacilites = []
-  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
-  emitter.emit("dismissLoader");
+async function revertRedirect() {
+  router.push("/shipping")
 }
 
 async function openProductFacilityGroupModal(type: string) {
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 542e210d..9e5de0d4 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -141,8 +141,10 @@ const formData = ref({
 }) as any;
 
 onIonViewDidEnter(async () => {
-  await fetchStoreConfig();
-  emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
+  emitter.emit("presentLoader");
+  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
+  emitter.emit("dismissLoader");
+  emitter.on("productStoreOrConfigChanged", revertRedirect);
 
   if(props.ruleId) {
     try {
@@ -198,18 +200,11 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
-  emitter.off("productStoreOrConfigChanged", fetchStoreConfig);
+  emitter.off("productStoreOrConfigChanged", revertRedirect);
 })
 
-async function fetchStoreConfig() {
-  emitter.emit("presentLoader");
-  formData.value.selectedFacilityGroups = {
-    included: [],
-    excluded: []
-  }
-  formData.value.selectedConfigFacilites = []
-  await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
-  emitter.emit("dismissLoader");
+async function revertRedirect() {
+  router.push("/store-pickup");
 }
 
 async function openProductFacilityGroupModal(type: string) {
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index d11a61fe..3bf1122e 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -89,8 +89,10 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onIonViewDidEnter(async () => {
-  await fetchStoreConfig();
-  emitter.on("productStoreOrConfigChanged", fetchStoreConfig);
+  emitter.emit("presentLoader");
+  await store.dispatch("util/fetchConfigFacilities");
+  emitter.emit("dismissLoader");
+  emitter.on("productStoreOrConfigChanged", revertRedirect);
 
   if(props.ruleId) {
     try {
@@ -133,14 +135,11 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
-  emitter.off("productStoreOrConfigChanged", fetchStoreConfig);
+  emitter.off("productStoreOrConfigChanged", revertRedirect);
 })
 
-async function fetchStoreConfig() {
-  emitter.emit("presentLoader");
-  formData.value.selectedConfigFacilites = [];
-  await store.dispatch("util/fetchConfigFacilities");
-  emitter.emit("dismissLoader");
+async function revertRedirect() {
+  router.push("/threshold")
 }
 
 function toggleFacilitySelection(facilityId: any) {

From 031347afb95bc933a640f97322381e82087de47f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 24 May 2024 12:07:52 +0530
Subject: [PATCH 232/250] Improved: emitter loading while opeing create/update
 rule page (#328)

---
 src/views/CreateUpdateSafetyStockRule.vue | 6 +++---
 src/views/CreateUpdateShippingRule.vue    | 4 ++--
 src/views/CreateUpdateStorePickupRule.vue | 8 ++++----
 src/views/CreateUpdateThresholdRule.vue   | 4 ++--
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index e0eefb46..a2ef8be1 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -118,11 +118,10 @@ const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 onIonViewDidEnter(async () => {
+  emitter.on("productStoreOrConfigChanged", revertRedirect);
   emitter.emit("presentLoader");
   await store.dispatch("util/fetchFacilityGroups")
-  emitter.emit("dismissLoader");
-  emitter.on("productStoreOrConfigChanged", revertRedirect);
-
+  
   if(props.ruleId) {
     try {
       const resp = await RuleService.fetchRules({ ruleId: props.ruleId })
@@ -160,6 +159,7 @@ onIonViewDidEnter(async () => {
       logger.error(err);
     }
   }
+  emitter.emit("dismissLoader");
 })
 
 onIonViewWillLeave(() => {
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index d3298c6b..d8fc021b 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -142,10 +142,9 @@ const formData = ref({
 }) as any;
 
 onIonViewDidEnter(async () => {
+  emitter.on("productStoreOrConfigChanged", revertRedirect);
   emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
-  emitter.emit("dismissLoader");
-  emitter.on("productStoreOrConfigChanged", revertRedirect);
   if(props.ruleId) {
     try {
       const resp = await RuleService.fetchRules({ ruleId: props.ruleId })
@@ -187,6 +186,7 @@ onIonViewDidEnter(async () => {
       logger.error(err);
     }
   }
+  emitter.emit("dismissLoader");
 })
 
 onIonViewWillLeave(() => {
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 9e5de0d4..00da1795 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -141,15 +141,14 @@ const formData = ref({
 }) as any;
 
 onIonViewDidEnter(async () => {
+  emitter.on("productStoreOrConfigChanged", revertRedirect);
   emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
-  emitter.emit("dismissLoader");
-  emitter.on("productStoreOrConfigChanged", revertRedirect);
-
+  
   if(props.ruleId) {
     try {
       const resp = await RuleService.fetchRules({ ruleId: props.ruleId })
-
+      
       if(!hasError(resp)) {
         currentRule.value = resp.data[0];
 
@@ -187,6 +186,7 @@ onIonViewDidEnter(async () => {
       logger.error(err);
     }
   }
+  emitter.emit("dismissLoader");
 })
 
 onIonViewWillLeave(() => {
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index 3bf1122e..0c206bd8 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -89,10 +89,9 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onIonViewDidEnter(async () => {
+  emitter.on("productStoreOrConfigChanged", revertRedirect);
   emitter.emit("presentLoader");
   await store.dispatch("util/fetchConfigFacilities");
-  emitter.emit("dismissLoader");
-  emitter.on("productStoreOrConfigChanged", revertRedirect);
 
   if(props.ruleId) {
     try {
@@ -126,6 +125,7 @@ onIonViewDidEnter(async () => {
       logger.error(err);
     }
   }
+  emitter.emit("dismissLoader");
 })
 
 onIonViewWillLeave(() => {

From 5294aec5448320c0f9afdb4b5c66588fa86af7cf Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 24 May 2024 15:06:50 +0530
Subject: [PATCH 233/250] Improved: code to import from ionic/vue instead of
 ionic/core(#328)

---
 src/components/Menu.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 20067494..afbb0f40 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -59,6 +59,8 @@
     IonSelectOption,
     IonTitle,
     IonToolbar,
+    alertController,
+    SelectCustomEvent
   } from "@ionic/vue";
   import { computed } from "vue";
   import { useStore } from "@/store";
@@ -66,7 +68,6 @@
   import { cloudUploadOutline, globeOutline, settingsOutline, sendOutline, storefrontOutline, pulseOutline } from 'ionicons/icons';
   import { translate } from "@/i18n";
   import emitter from "@/event-bus";
-  import { alertController, SelectCustomEvent } from "@ionic/core";
 
   const store = useStore();
   const router = useRouter();

From 69bdc6463d0341710b74ecc15b29f56a0f2371f0 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 24 May 2024 15:40:13 +0530
Subject: [PATCH 234/250] Improved: method name for redirecting back to rules
 list page (#328)

---
 src/views/CreateUpdateSafetyStockRule.vue | 6 +++---
 src/views/CreateUpdateShippingRule.vue    | 6 +++---
 src/views/CreateUpdateStorePickupRule.vue | 6 +++---
 src/views/CreateUpdateThresholdRule.vue   | 6 +++---
 4 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index da4b5977..94a8b2e2 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -118,7 +118,7 @@ const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"
 const facilityGroups = computed(() => store.getters["util/getFacilityGroups"])
 
 onIonViewDidEnter(async () => {
-  emitter.on("productStoreOrConfigChanged", revertRedirect);
+  emitter.on("productStoreOrConfigChanged", redirectLink);
   emitter.emit("presentLoader");
   await store.dispatch("util/fetchFacilityGroups")
   
@@ -172,10 +172,10 @@ onIonViewWillLeave(() => {
     }
   }
   store.dispatch("util/clearAppliedFilters")
-  emitter.off("productStoreOrConfigChanged", revertRedirect);
+  emitter.off("productStoreOrConfigChanged", redirectLink);
 })
 
-async function revertRedirect() {
+async function redirectLink() {
   router.push("/safety-stock");
 }
 
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index 8b0c3b5e..16e5f3eb 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -142,7 +142,7 @@ const formData = ref({
 }) as any;
 
 onIonViewDidEnter(async () => {
-  emitter.on("productStoreOrConfigChanged", revertRedirect);
+  emitter.on("productStoreOrConfigChanged", redirectLink);
   emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
   if(props.ruleId) {
@@ -200,10 +200,10 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
-  emitter.off("productStoreOrConfigChanged", revertRedirect);
+  emitter.off("productStoreOrConfigChanged", redirectLink);
 })
 
-async function revertRedirect() {
+async function redirectLink() {
   router.push("/shipping")
 }
 
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 4e6e01a4..92ca785f 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -141,7 +141,7 @@ const formData = ref({
 }) as any;
 
 onIonViewDidEnter(async () => {
-  emitter.on("productStoreOrConfigChanged", revertRedirect);
+  emitter.on("productStoreOrConfigChanged", redirectLink);
   emitter.emit("presentLoader");
   await Promise.allSettled([store.dispatch("util/fetchFacilityGroups"), store.dispatch("util/fetchConfigFacilities")]);
   
@@ -200,10 +200,10 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
-  emitter.off("productStoreOrConfigChanged", revertRedirect);
+  emitter.off("productStoreOrConfigChanged", redirectLink);
 })
 
-async function revertRedirect() {
+async function redirectLink() {
   router.push("/store-pickup");
 }
 
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index f2f7bd14..855e2901 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -89,7 +89,7 @@ const total = computed(() => store.getters["rule/getTotalRulesCount"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
 
 onIonViewDidEnter(async () => {
-  emitter.on("productStoreOrConfigChanged", revertRedirect);
+  emitter.on("productStoreOrConfigChanged", redirectLink);
   emitter.emit("presentLoader");
   await store.dispatch("util/fetchConfigFacilities");
 
@@ -135,10 +135,10 @@ onIonViewWillLeave(() => {
     selectedConfigFacilites: []
   }
   store.dispatch("util/clearAppliedFilters")
-  emitter.off("productStoreOrConfigChanged", revertRedirect);
+  emitter.off("productStoreOrConfigChanged", redirectLink);
 })
 
-async function revertRedirect() {
+async function redirectLink() {
   router.push("/threshold")
 }
 

From f886e12bd85d8f54d5c8c7249dcc72664dcad63f Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Fri, 24 May 2024 16:11:29 +0530
Subject: [PATCH 235/250] Fixed: lines bottom in rule card and schedule card
 (#328)

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

diff --git a/src/components/RuleItem.vue b/src/components/RuleItem.vue
index b38e79c5..8dd93f6e 100644
--- a/src/components/RuleItem.vue
+++ b/src/components/RuleItem.vue
@@ -63,11 +63,11 @@
               <ion-label>{{ translate("Product tags") }}</ion-label>
             </ion-item-divider>
 
-            <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')">
+            <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'in')" :lines="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in') ? '' : 'full'">
               <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
               <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "in") }}</ion-label>
             </ion-item>
-            <ion-item lines="none" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
+            <ion-item lines="full" v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'tags', 'not-in')">
               <ion-icon slot="start" :icon="closeCircleOutline"/>
               <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "tags", "not-in") }}</ion-label>
             </ion-item>
@@ -76,7 +76,7 @@
               <ion-label>{{ translate("Product features") }}</ion-label>
             </ion-item-divider>
 
-            <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')">
+            <ion-item v-if="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'in')" :lines="isRuleConditionAvailable('ENTCT_ATP_FILTER', 'productFeatures', 'not-in') ? '' : 'full'">
               <ion-icon slot="start" :icon="checkmarkDoneCircleOutline"/>
               <ion-label class="ion-text-wrap">{{ getRuleConditions("ENTCT_ATP_FILTER", "productFeatures", "in") }}</ion-label>
             </ion-item>
diff --git a/src/components/ScheduleRuleItem.vue b/src/components/ScheduleRuleItem.vue
index a74b8bc4..dea1d598 100644
--- a/src/components/ScheduleRuleItem.vue
+++ b/src/components/ScheduleRuleItem.vue
@@ -14,7 +14,7 @@
           <!-- When the group is in draft status, do not display the runTime from the schedule -->
           <ion-label slot="end">{{ ruleGroup.schedule?.paused === 'N' ? getDateAndTime(ruleGroup.schedule?.nextExecutionDateTime) : "-" }}</ion-label>
         </ion-item>
-        <ion-item>
+        <ion-item lines="full">
           <ion-icon slot="start" :icon="timerOutline"/>
           <!-- When the group is in draft status or the job is not present, do not display the frequency and just display the label for schedule -->
           <ion-select :label="translate('Schedule')" interface="popover" :placeholder="translate('Select')" value="0 0 0 * * ?" :disabled="true">

From fea06b2bff6f8773ff536b34dcbe1a12d89a3668 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 27 May 2024 09:42:08 +0530
Subject: [PATCH 236/250] Fixed: orderLimit popover dismissing issue, ruleGroup
 history fetching issue (#328)

---
 src/components/OrderLimitPopover.vue      | 3 +--
 src/components/RuleGroupHistoryModal.vue  | 4 +++-
 src/components/ScheduleActionsPopover.vue | 1 +
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/OrderLimitPopover.vue b/src/components/OrderLimitPopover.vue
index 8cb4ffd0..759bffe3 100644
--- a/src/components/OrderLimitPopover.vue
+++ b/src/components/OrderLimitPopover.vue
@@ -93,7 +93,6 @@ async function showOrderLimitAlert(header: string, message: string, showInput: b
       }
     }]
   })
-  await alert.present()
-  popoverController.dismiss();
+  alert.present()
 }
 </script>
\ No newline at end of file
diff --git a/src/components/RuleGroupHistoryModal.vue b/src/components/RuleGroupHistoryModal.vue
index 71221685..76cb725a 100644
--- a/src/components/RuleGroupHistoryModal.vue
+++ b/src/components/RuleGroupHistoryModal.vue
@@ -12,13 +12,15 @@
   
   <ion-content>
     <ion-list v-if="groupHistory.length">
-      <ion-item v-for="history in groupHistory" :key="history.jobRunId">
+    <template v-for="history in groupHistory" :key="history.jobRunId">
+      <ion-item v-if="history.endTime">
         <ion-label>
           <h3>{{ getTime(history.startTime) }}</h3>
           <p>{{ getDate(history.startTime) }}</p>
         </ion-label>
         <ion-badge color="dark" v-if="history.endTime">{{ timeTillRun(history.endTime) }}</ion-badge>
       </ion-item>
+    </template>
     </ion-list>
     <div class="empty-state" v-else>
       <p>{{ translate("No available history for rule.", { name: router.currentRoute.value.name?.toString().toLowerCase() }) }}</p>
diff --git a/src/components/ScheduleActionsPopover.vue b/src/components/ScheduleActionsPopover.vue
index 427d6f91..af3fc547 100644
--- a/src/components/ScheduleActionsPopover.vue
+++ b/src/components/ScheduleActionsPopover.vue
@@ -109,6 +109,7 @@ async function runNow() {
               const resp = await RuleService.runNow(ruleGroup.value.ruleGroupId)
               if(!hasError(resp) && resp.data.jobRunId) {
                 showToast(translate("Service has been scheduled"))
+                await store.dispatch('rule/fetchRules', { groupTypeEnumId: ruleGroup.value.groupTypeEnumId, pageSize: 50 })
                 popoverController.dismiss();
               } else {
                 throw resp.data

From b2c323c4f5f4ab79b4ad0af32a051d0489c22f24 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 27 May 2024 10:52:30 +0530
Subject: [PATCH 237/250] Improved: logic to fetch pickup facility groups
 (#264)

---
 src/services/UtilService.ts              | 13 +++++++-
 src/store/modules/util/UtilState.ts      |  1 +
 src/store/modules/util/actions.ts        | 39 ++++++++++++++++++++++++
 src/store/modules/util/getters.ts        |  3 ++
 src/store/modules/util/index.ts          |  3 +-
 src/store/modules/util/mutation-types.ts |  3 +-
 src/store/modules/util/mutations.ts      |  3 ++
 src/views/StorePickup.vue                |  9 +++---
 8 files changed, 66 insertions(+), 8 deletions(-)

diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
index e66e3c19..01dea3e9 100644
--- a/src/services/UtilService.ts
+++ b/src/services/UtilService.ts
@@ -27,7 +27,8 @@ const updateFacility = async (payload: any): Promise <any>  => {
 const fetchFacilityGroups = async (payload: any): Promise <any>  => {
   return api({
     url: `productStores/${payload.productStoreId}/facilityGroups`,
-    method: "GET"
+    method: "GET",
+    params: payload
   });
 }
 
@@ -39,10 +40,20 @@ const fetchFacilitiesOrderCount = async (payload: any): Promise <any>  => {
   });
 }
 
+const fetchPickupGroupFacilities = async (payload: any): Promise <any>  => {
+  return api({
+    url: `facilityGroups/${payload.facilityGroupId}/facilities`,
+    method: "GET",
+    params: payload
+  });
+}
+
+
 export const UtilService = {
   fetchFacilities,
   fetchFacilitiesOrderCount,
   updateFacility,
   fetchFacilityGroups,
   fetchFacets,
+  fetchPickupGroupFacilities
 }
\ No newline at end of file
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index a2c9e444..61964b2c 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -4,4 +4,5 @@ export default interface UtilState {
   facilityGroups: any;
   facilities: any;
   selectedSegment: any;
+  pickupGroups: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 4f35c074..46ad3659 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -125,6 +125,45 @@ const actions: ActionTree<UtilState, RootState> = {
     return facilitiesData;
   },
 
+  async fetchPickupGroups({ commit }) {
+    let groups = [] as any;
+
+    try {
+      const resp = await UtilService.fetchFacilityGroups({ facilityGroupTypeId: 'PICKUP', productStoreId: store.state.user.currentEComStore.productStoreId, pageSize: 100 })
+
+      if(!hasError(resp)) {
+        groups = resp.data;
+        console.log(resp.data);
+        
+      } else {
+        throw resp.data
+      }
+    } catch(error) {
+      logger.error(error)
+    }
+    commit(types.UTIL_PICKUP_GROUPS_UPDATED , groups);
+  },
+
+  async fetchPickGroupFacilities({ commit, state }) {
+    let pickupGroupFacilities = {} as any;
+    const pickupGroups = state.pickupGroups.length ? JSON.parse(JSON.stringify(state.pickupGroups)) : [];
+
+    try {
+      const resp = await UtilService.fetchPickupGroupFacilities({ facilityGroupId:  , pageSize: 100 })
+
+      if(!hasError(resp)) {
+        groups = resp.data;
+        console.log(resp.data);
+        
+      } else {
+        throw resp.data
+      }
+    } catch(error) {
+      logger.error(error)
+    }
+    commit(types.UTIL_PICKUP_GROUPS_UPDATED , groups);
+  },
+
   async updateFacilities({ commit, state }, payload) {
     commit(types.UTIL_FACILITY_LIST_UPDATED , { facilities: payload.facilities, isScrollable: state.facilities.isScrollable });
   },
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 8c27a37c..91125705 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -21,6 +21,9 @@ const getters: GetterTree<UtilState, RootState> = {
   getSelectedSegment(state) {
     return state.selectedSegment
   },
+  getPickupGroups(state) {
+    return state.pickupGroups
+  },
 }
 
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index 7f601ebf..c0463795 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -24,7 +24,8 @@ const utilModule: Module<UtilState, RootState> = {
       list: [],
       isScrollable: true
     },
-    selectedSegment: ""
+    selectedSegment: "",
+    pickupGroups: []
   },
   getters,
   actions,
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 9137d328..7e426231 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -5,4 +5,5 @@ export const UTIL_CLEARED = SN_UTIL + '/CLEARED'
 export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
 export const UTIL_FACILITY_GROUPS_UPDATED = SN_UTIL + '/FACILITY_GROUPS_UPDATED'
 export const UTIL_FACILITY_LIST_UPDATED = SN_UTIL + '/FACILITY_LIST_UPDATED'
-export const UTIL_SELECTED_SEGMENT_UPDATED = SN_UTIL + '/SELECTED_SEGMENT_UPDATED'
\ No newline at end of file
+export const UTIL_SELECTED_SEGMENT_UPDATED = SN_UTIL + '/SELECTED_SEGMENT_UPDATED'
+export const UTIL_PICKUP_GROUPS_UPDATED = SN_UTIL + '/PICKUP_GROUPS_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index 68c8f834..306418c5 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -44,5 +44,8 @@ const mutations: MutationTree <UtilState> = {
   [types.UTIL_SELECTED_SEGMENT_UPDATED](state, payload) {
     state.selectedSegment = payload
   },
+  [types.UTIL_PICKUP_GROUPS_UPDATED](state, payload) {
+    state.pickupGroups = payload
+  },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index f99e3b00..99bbdb43 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -12,11 +12,9 @@
           <ion-segment-button value="RG_PICKUP_CHANNEL">
             <ion-label>{{ translate("Product and channel") }}</ion-label>
           </ion-segment-button>
-          <!-- Hidden Facility segment for now as it is not functionality -->
-          <!-- Todo: add functionality to the Facility segment -->
-          <!-- <ion-segment-button value="PICKUP_FACILITY">
+          <ion-segment-button value="PICKUP_FACILITY">
             <ion-label>{{ translate("Facility") }}</ion-label>
-          </ion-segment-button> -->
+          </ion-segment-button>
         </ion-segment>
       </ion-toolbar>
     </ion-header>
@@ -157,10 +155,11 @@ async function updateSegment(event: any) {
   store.dispatch("util/updateSelectedSegment", event.detail.value);
 
   emitter.emit("presentLoader");
-  if(selectedSegment.value === 'facility') {
+  if(selectedSegment.value === 'PICKUP_FACILITY') {
     isScrollingEnabled.value = false;
     await fetchFacilities();
     store.dispatch("rule/updateIsReorderActive", false)
+    store.dispatch("util/fetchPickupGroups")
   } else {
     store.dispatch("rule/updateIsReorderActive", false)
     reorderingRules.value = []

From f2b8decf671f4cbd10880c60e61c1d1fe1315450 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 27 May 2024 10:54:42 +0530
Subject: [PATCH 238/250] Improved: check for showing title in case of edit
 rule page, improved check for history startTime (#328)

---
 src/components/RuleGroupHistoryModal.vue  | 2 +-
 src/views/CreateUpdateSafetyStockRule.vue | 2 +-
 src/views/CreateUpdateShippingRule.vue    | 2 +-
 src/views/CreateUpdateStorePickupRule.vue | 2 +-
 src/views/CreateUpdateThresholdRule.vue   | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/RuleGroupHistoryModal.vue b/src/components/RuleGroupHistoryModal.vue
index 76cb725a..292a38da 100644
--- a/src/components/RuleGroupHistoryModal.vue
+++ b/src/components/RuleGroupHistoryModal.vue
@@ -13,7 +13,7 @@
   <ion-content>
     <ion-list v-if="groupHistory.length">
     <template v-for="history in groupHistory" :key="history.jobRunId">
-      <ion-item v-if="history.endTime">
+      <ion-item v-if="history.startTime">
         <ion-label>
           <h3>{{ getTime(history.startTime) }}</h3>
           <p>{{ getDate(history.startTime) }}</p>
diff --git a/src/views/CreateUpdateSafetyStockRule.vue b/src/views/CreateUpdateSafetyStockRule.vue
index 94a8b2e2..3721d6d7 100644
--- a/src/views/CreateUpdateSafetyStockRule.vue
+++ b/src/views/CreateUpdateSafetyStockRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/safety-stock" />
-        <ion-title>{{ currentRule.ruleId ? translate("Edit safety stock rule") : translate("New safety stock rule") }}</ion-title>
+        <ion-title>{{ ruleId ? translate("Edit safety stock rule") : translate("New safety stock rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
diff --git a/src/views/CreateUpdateShippingRule.vue b/src/views/CreateUpdateShippingRule.vue
index 16e5f3eb..ef8c6130 100644
--- a/src/views/CreateUpdateShippingRule.vue
+++ b/src/views/CreateUpdateShippingRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/shipping" />
-        <ion-title>{{ currentRule.ruleId ? translate("Edit shipping rule") : translate("New shipping rule") }}</ion-title>
+        <ion-title>{{ ruleId ? translate("Edit shipping rule") : translate("New shipping rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
diff --git a/src/views/CreateUpdateStorePickupRule.vue b/src/views/CreateUpdateStorePickupRule.vue
index 92ca785f..ea5d1952 100644
--- a/src/views/CreateUpdateStorePickupRule.vue
+++ b/src/views/CreateUpdateStorePickupRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/store-pickup" />
-        <ion-title>{{ currentRule.ruleId ? translate("Edit store pickup rule") : translate("New store pickup rule") }}</ion-title>
+        <ion-title>{{ ruleId ? translate("Edit store pickup rule") : translate("New store pickup rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     
diff --git a/src/views/CreateUpdateThresholdRule.vue b/src/views/CreateUpdateThresholdRule.vue
index 855e2901..04275cd5 100644
--- a/src/views/CreateUpdateThresholdRule.vue
+++ b/src/views/CreateUpdateThresholdRule.vue
@@ -3,7 +3,7 @@
     <ion-header :translucent="true">
       <ion-toolbar>
         <ion-back-button slot="start" default-href="/threshold" />
-        <ion-title>{{ currentRule.ruleId ? translate("Edit threshold rule") : translate("New threshold rule") }}</ion-title>
+        <ion-title>{{ ruleId ? translate("Edit threshold rule") : translate("New threshold rule") }}</ion-title>
       </ion-toolbar>
     </ion-header>
     

From bf37a77bb3bce013791b6d5404e26d7e9bb0211e Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 27 May 2024 12:27:44 +0530
Subject: [PATCH 239/250] Implementd: logic for updating association of a
 facilty to the pick group (#264)

---
 src/components/FacilityItem.vue          | 55 +++++++++++++++++++++++-
 src/locales/en.json                      |  3 +-
 src/services/UtilService.ts              | 10 ++++-
 src/store/modules/util/UtilState.ts      |  1 +
 src/store/modules/util/actions.ts        | 33 +++++++++-----
 src/store/modules/util/getters.ts        |  3 ++
 src/store/modules/util/index.ts          |  3 +-
 src/store/modules/util/mutation-types.ts |  3 +-
 src/store/modules/util/mutations.ts      |  3 ++
 src/views/StorePickup.vue                |  4 ++
 10 files changed, 102 insertions(+), 16 deletions(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 9c83f358..d7a0d68f 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -5,9 +5,9 @@
       <ion-card-title>{{ facility.facilityName }}</ion-card-title>
     </ion-card-header>
 
-    <ion-item lines="none">
+    <ion-item lines="none" v-for="group in pickupGroups" :key="group.facilityGroupId">
       <ion-icon :icon="storefrontOutline" slot="start" />
-      <ion-toggle>{{ translate("Store pickup") }}</ion-toggle>
+      <ion-toggle :checked="isPickupAllowed(group)" @click.prevent="updatePickupAllowed($event, group)">{{ group.facilityGroupName }}</ion-toggle>
     </ion-item>
   </ion-card>
 
@@ -45,6 +45,7 @@ import { hasError, showToast } from '@/utils';
 import logger from '@/logger';
 import { useStore } from 'vuex';
 import emitter from '@/event-bus';
+import { DateTime } from 'luxon';
 
 const router = useRouter();
 const store = useStore();
@@ -56,6 +57,8 @@ const selectedPage = ref({
 
 const props = defineProps(["facility"]);
 const facilities = computed(() => store.getters["util/getFacilities"]);
+const pickupGroups = computed(() => store.getters["util/getPickupGroups"]);
+const pickupGroupFacilities = computed(() => store.getters["util/getPickupGroupFacilities"]);
 
 onMounted(() => {
     selectedPage.value.path = router.currentRoute.value.path
@@ -105,4 +108,52 @@ async function updateFacility(maximumOrderLimit: number | string) {
   }
   emitter.emit("dismissLoader");
 }
+
+function isPickupAllowed(group: any) {
+  const facilities = pickupGroupFacilities.value[group.facilityGroupId]
+  return facilities.find((facility: any) => facility.facilityId === props.facility.facilityId);
+}
+
+async function updatePickupAllowed(event: Event, group: any) {
+  event.stopImmediatePropagation();
+
+  let payload = {} as any;
+  const isPickupActive = isPickupAllowed(group);
+
+  if(isPickupAllowed(group)) {
+    console.log('allowed');
+    const facilities = pickupGroupFacilities.value[group.facilityGroupId]
+    payload = facilities.find((facility: any) => facility.facilityId === props.facility.facilityId)
+    payload = {
+      ...payload,
+      thruDate: DateTime.now().toMillis()
+    }
+  } else {
+    payload = {
+      facilityId: props.facility.facilityId,
+      facilityGroupId: group.facilityGroupId,
+      fromDate: DateTime.now().toMillis()
+    }
+  }
+
+  try {
+    const resp = await UtilService.updateFacilityAssociationWithPickupGroup(payload)
+    if(!hasError(resp)) {
+      const facilitiesByPickupGroup = JSON.parse(JSON.stringify(pickupGroupFacilities.value));
+      if(isPickupActive) {
+        facilitiesByPickupGroup[group.facilityGroupId] = facilitiesByPickupGroup[group.facilityGroupId].filter((record: any) => record.facilityId !== props.facility.facilityId);
+      } else {
+        facilitiesByPickupGroup[group.facilityGroupId].push(payload)
+      }
+      store.dispatch("util/updatePickupGroupFacilities", facilitiesByPickupGroup);
+      showToast(translate("Facility association updated successfully with pickup group."))
+    } else {
+      throw resp.data;
+    }
+  } catch(error: any) {
+    logger.error(error);
+    showToast(translate("Failed to update facility association with pickup group."));
+  }
+  
+}
 </script>
\ No newline at end of file
diff --git a/src/locales/en.json b/src/locales/en.json
index 6a5ee2ae..99d43ee3 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -63,6 +63,7 @@
   "Facilities": "Facilities",
   "Facilities associated to group successfully.": "Facilities associated to group successfully.",
   "Facility": "Facility",
+  "Facility association updated successfully with pickup group.": "Facility association updated successfully with pickup group.",
   "Failed": "Failed",
   "Failed to associate some facilites to group.": "Failed to associate some facilites to group.",
   "Failed to create rule.": "Failed to create rule.",
@@ -77,6 +78,7 @@
   "Failed to update threshold.": "Failed to update threshold.",
   "Failed to schedule service": "Failed to schedule service",
   "Failed to schedule service, hence other jobs are not updated": "Failed to schedule service, hence other jobs are not updated",
+  "Failed to update facility association with pickup group.": "Failed to update facility association with pickup group.",
   "features": "{type} features",
   "Fetching": "Fetching {label}",
   "Fetching facilities": "Fetching facilities",
@@ -266,7 +268,6 @@
   "Edit shipping rule": "Edit shipping rule",
   "Edit store pickup rule": "Edit store pickup rule",
   "Update time zone": "Update time zone",
-  "Edit threshold rule": "Edit threshold rule",
   "Unlimited": "Unlimited",
   "Unlimited Capacity": "Unlimited Capacity",
   "Unlimited fulfillment capacity": "Unlimited fulfillment capacity",
diff --git a/src/services/UtilService.ts b/src/services/UtilService.ts
index 01dea3e9..7389a24c 100644
--- a/src/services/UtilService.ts
+++ b/src/services/UtilService.ts
@@ -48,6 +48,13 @@ const fetchPickupGroupFacilities = async (payload: any): Promise <any>  => {
   });
 }
 
+const updateFacilityAssociationWithPickupGroup = async (payload: any): Promise <any>  => {
+  return api({
+    url: `facilityGroups/${payload.facilityGroupId}/facilities/${payload.facilityId}/association`,
+    method: "POST",
+    data: payload
+  });
+}
 
 export const UtilService = {
   fetchFacilities,
@@ -55,5 +62,6 @@ export const UtilService = {
   updateFacility,
   fetchFacilityGroups,
   fetchFacets,
-  fetchPickupGroupFacilities
+  fetchPickupGroupFacilities,
+  updateFacilityAssociationWithPickupGroup
 }
\ No newline at end of file
diff --git a/src/store/modules/util/UtilState.ts b/src/store/modules/util/UtilState.ts
index 61964b2c..1716b899 100644
--- a/src/store/modules/util/UtilState.ts
+++ b/src/store/modules/util/UtilState.ts
@@ -5,4 +5,5 @@ export default interface UtilState {
   facilities: any;
   selectedSegment: any;
   pickupGroups: any;
+  pickupGroupFacilities: any;
 }
\ No newline at end of file
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 46ad3659..1803e4c5 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -125,16 +125,19 @@ const actions: ActionTree<UtilState, RootState> = {
     return facilitiesData;
   },
 
-  async fetchPickupGroups({ commit }) {
+  async fetchPickupGroups({ commit, dispatch }) {
     let groups = [] as any;
+    const pickGroupFacilities = {} as any;
 
     try {
       const resp = await UtilService.fetchFacilityGroups({ facilityGroupTypeId: 'PICKUP', productStoreId: store.state.user.currentEComStore.productStoreId, pageSize: 100 })
 
       if(!hasError(resp)) {
         groups = resp.data;
-        console.log(resp.data);
-        
+        await Promise.allSettled(groups.map(async (group: any) => {
+          const facilities = await dispatch("fetchPickGroupFacilities", group.facilityGroupId)
+          pickGroupFacilities[group.facilityGroupId] = facilities
+        }))
       } else {
         throw resp.data
       }
@@ -142,18 +145,24 @@ const actions: ActionTree<UtilState, RootState> = {
       logger.error(error)
     }
     commit(types.UTIL_PICKUP_GROUPS_UPDATED , groups);
+    commit(types.UTIL_PICKUP_GROUP_FACILITIES , pickGroupFacilities);
   },
 
-  async fetchPickGroupFacilities({ commit, state }) {
-    let pickupGroupFacilities = {} as any;
-    const pickupGroups = state.pickupGroups.length ? JSON.parse(JSON.stringify(state.pickupGroups)) : [];
+  async fetchPickGroupFacilities({ commit }, facilityGroupId) {
+    let pickupGroupFacilities = [] as any;
 
     try {
-      const resp = await UtilService.fetchPickupGroupFacilities({ facilityGroupId:  , pageSize: 100 })
+      const resp = await UtilService.fetchPickupGroupFacilities({ 
+        facilityGroupId,
+        pageSize: 100,
+        parentFacilityTypeId: 'VIRTUAL_FACILITY',
+        parentFacilityTypeId_not: 'Y',
+        facilityTypeId: 'VIRTUAL_FACILITY',
+        facilityTypeId_not: 'Y',
+      })
 
       if(!hasError(resp)) {
-        groups = resp.data;
-        console.log(resp.data);
+        pickupGroupFacilities = resp.data;
         
       } else {
         throw resp.data
@@ -161,7 +170,11 @@ const actions: ActionTree<UtilState, RootState> = {
     } catch(error) {
       logger.error(error)
     }
-    commit(types.UTIL_PICKUP_GROUPS_UPDATED , groups);
+    return pickupGroupFacilities;
+  },
+
+  async updatePickupGroupFacilities({ commit }, payload) {
+    commit(types.UTIL_PICKUP_GROUP_FACILITIES , payload);
   },
 
   async updateFacilities({ commit, state }, payload) {
diff --git a/src/store/modules/util/getters.ts b/src/store/modules/util/getters.ts
index 91125705..9ec8c000 100644
--- a/src/store/modules/util/getters.ts
+++ b/src/store/modules/util/getters.ts
@@ -24,6 +24,9 @@ const getters: GetterTree<UtilState, RootState> = {
   getPickupGroups(state) {
     return state.pickupGroups
   },
+  getPickupGroupFacilities(state) {
+    return state.pickupGroupFacilities
+  },
 }
 
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/util/index.ts b/src/store/modules/util/index.ts
index c0463795..c88207ec 100644
--- a/src/store/modules/util/index.ts
+++ b/src/store/modules/util/index.ts
@@ -25,7 +25,8 @@ const utilModule: Module<UtilState, RootState> = {
       isScrollable: true
     },
     selectedSegment: "",
-    pickupGroups: []
+    pickupGroups: [],
+    pickupGroupFacilities: {}
   },
   getters,
   actions,
diff --git a/src/store/modules/util/mutation-types.ts b/src/store/modules/util/mutation-types.ts
index 7e426231..a4a05217 100644
--- a/src/store/modules/util/mutation-types.ts
+++ b/src/store/modules/util/mutation-types.ts
@@ -6,4 +6,5 @@ export const UTIL_APPLIED_FILTERS_CLEARED = SN_UTIL + '/APPLIED_FILTERS_CLEARED'
 export const UTIL_FACILITY_GROUPS_UPDATED = SN_UTIL + '/FACILITY_GROUPS_UPDATED'
 export const UTIL_FACILITY_LIST_UPDATED = SN_UTIL + '/FACILITY_LIST_UPDATED'
 export const UTIL_SELECTED_SEGMENT_UPDATED = SN_UTIL + '/SELECTED_SEGMENT_UPDATED'
-export const UTIL_PICKUP_GROUPS_UPDATED = SN_UTIL + '/PICKUP_GROUPS_UPDATED'
\ No newline at end of file
+export const UTIL_PICKUP_GROUPS_UPDATED = SN_UTIL + '/PICKUP_GROUPS_UPDATED'
+export const UTIL_PICKUP_GROUP_FACILITIES = SN_UTIL + '/PICKUP_GROUP_FACILITIES_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/util/mutations.ts b/src/store/modules/util/mutations.ts
index 306418c5..1e645f4b 100644
--- a/src/store/modules/util/mutations.ts
+++ b/src/store/modules/util/mutations.ts
@@ -47,5 +47,8 @@ const mutations: MutationTree <UtilState> = {
   [types.UTIL_PICKUP_GROUPS_UPDATED](state, payload) {
     state.pickupGroups = payload
   },
+  [types.UTIL_PICKUP_GROUP_FACILITIES](state, payload) {
+    state.pickupGroupFacilities = payload
+  },
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/StorePickup.vue b/src/views/StorePickup.vue
index 99bbdb43..7b1bdf9c 100644
--- a/src/views/StorePickup.vue
+++ b/src/views/StorePickup.vue
@@ -110,6 +110,10 @@ async function fetchRules() {
   emitter.emit("presentLoader");
   store.dispatch("rule/updateIsReorderActive", false)
   if(!selectedSegment.value || (selectedSegment.value !== 'RG_PICKUP_FACILITY' && selectedSegment.value !== 'RG_PICKUP_CHANNEL' && selectedSegment.value !== 'PICKUP_FACILITY')) store.dispatch("util/updateSelectedSegment", "RG_PICKUP_FACILITY");
+  if(selectedSegment.value === 'PICKUP_FACILITY') {
+    await fetchFacilities();
+    store.dispatch("util/fetchPickupGroups")
+  }
   await Promise.allSettled([store.dispatch('rule/fetchRules', { groupTypeEnumId: selectedSegment.value, pageSize: 50 }), store.dispatch("util/fetchConfigFacilities"), store.dispatch("util/fetchFacilityGroups")])
   emitter.emit("dismissLoader");
 }

From 09da40e4080f2c69360ac2ac721cb47f44a847cc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 27 May 2024 12:29:53 +0530
Subject: [PATCH 240/250] Reverted: unused console statement (#264)

---
 src/components/FacilityItem.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index d7a0d68f..913ee37d 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -121,7 +121,6 @@ async function updatePickupAllowed(event: Event, group: any) {
   const isPickupActive = isPickupAllowed(group);
 
   if(isPickupAllowed(group)) {
-    console.log('allowed');
     const facilities = pickupGroupFacilities.value[group.facilityGroupId]
     payload = facilities.find((facility: any) => facility.facilityId === props.facility.facilityId)
     payload = {

From ddf3f31a2f31b1f06c0b1961108d405e3a030309 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 27 May 2024 12:41:56 +0530
Subject: [PATCH 241/250] Improved: indentation of the code in history modal
 (#328)

---
 src/components/RuleGroupHistoryModal.vue | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/components/RuleGroupHistoryModal.vue b/src/components/RuleGroupHistoryModal.vue
index 292a38da..00ca3c35 100644
--- a/src/components/RuleGroupHistoryModal.vue
+++ b/src/components/RuleGroupHistoryModal.vue
@@ -12,15 +12,15 @@
   
   <ion-content>
     <ion-list v-if="groupHistory.length">
-    <template v-for="history in groupHistory" :key="history.jobRunId">
-      <ion-item v-if="history.startTime">
-        <ion-label>
-          <h3>{{ getTime(history.startTime) }}</h3>
-          <p>{{ getDate(history.startTime) }}</p>
-        </ion-label>
-        <ion-badge color="dark" v-if="history.endTime">{{ timeTillRun(history.endTime) }}</ion-badge>
-      </ion-item>
-    </template>
+      <template v-for="history in groupHistory" :key="history.jobRunId">
+        <ion-item v-if="history.startTime">
+          <ion-label>
+            <h3>{{ getTime(history.startTime) }}</h3>
+            <p>{{ getDate(history.startTime) }}</p>
+          </ion-label>
+          <ion-badge color="dark" v-if="history.endTime">{{ timeTillRun(history.endTime) }}</ion-badge>
+        </ion-item>
+      </template>
     </ion-list>
     <div class="empty-state" v-else>
       <p>{{ translate("No available history for rule.", { name: router.currentRoute.value.name?.toString().toLowerCase() }) }}</p>

From ee6ff54839cf176f41bb850c4cf5d3dd0e49a111 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 27 May 2024 12:54:44 +0530
Subject: [PATCH 242/250] Improved: error handling in case of failure in
 fetching facilities for pickup group(#264)

---
 src/components/FacilityItem.vue   | 2 +-
 src/store/modules/util/actions.ts | 7 ++++++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 913ee37d..6ed76d90 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -7,7 +7,7 @@
 
     <ion-item lines="none" v-for="group in pickupGroups" :key="group.facilityGroupId">
       <ion-icon :icon="storefrontOutline" slot="start" />
-      <ion-toggle :checked="isPickupAllowed(group)" @click.prevent="updatePickupAllowed($event, group)">{{ group.facilityGroupName }}</ion-toggle>
+      <ion-toggle :checked="isPickupAllowed(group)" @click.prevent="updatePickupAllowed($event, group)">{{ group.facilityGroupName ? group.facilityGroupName : group.facilityGroupId }}</ion-toggle>
     </ion-item>
   </ion-card>
 
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 1803e4c5..896ee429 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -134,10 +134,15 @@ const actions: ActionTree<UtilState, RootState> = {
 
       if(!hasError(resp)) {
         groups = resp.data;
-        await Promise.allSettled(groups.map(async (group: any) => {
+        const responses = await Promise.allSettled(groups.map(async (group: any) => {
           const facilities = await dispatch("fetchPickGroupFacilities", group.facilityGroupId)
           pickGroupFacilities[group.facilityGroupId] = facilities
         }))
+
+        const hasFailedResponse = responses.some((response: any) => response.status === 'rejected')
+        if (hasFailedResponse) {
+          logger.error("Failed to fetch facilities for some pickup group.")
+        }
       } else {
         throw resp.data
       }

From 29619863695c44e495aa72fcae24d017ffbe8523 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Mon, 27 May 2024 18:50:34 +0530
Subject: [PATCH 243/250] Improved: logic for checking updating pickup status
 (#264)

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

diff --git a/src/components/FacilityItem.vue b/src/components/FacilityItem.vue
index 6ed76d90..2e227597 100644
--- a/src/components/FacilityItem.vue
+++ b/src/components/FacilityItem.vue
@@ -120,7 +120,7 @@ async function updatePickupAllowed(event: Event, group: any) {
   let payload = {} as any;
   const isPickupActive = isPickupAllowed(group);
 
-  if(isPickupAllowed(group)) {
+  if(isPickupActive) {
     const facilities = pickupGroupFacilities.value[group.facilityGroupId]
     payload = facilities.find((facility: any) => facility.facilityId === props.facility.facilityId)
     payload = {

From 1b988300309438bd60c06f4f62e4bb76cb7b3b9b Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 28 May 2024 14:49:40 +0530
Subject: [PATCH 244/250] Implemented: support for sso from launchpad (#337)

---
 .env.example                             |    2 +-
 package-lock.json                        | 1056 +++++++++++++++++++++-
 package.json                             |    2 +
 src/App.vue                              |   23 +-
 src/adapter/index.ts                     |   15 +
 src/api/index.ts                         |    5 +-
 src/main.ts                              |   14 +-
 src/router/index.ts                      |   25 +-
 src/services/UserService.ts              |   24 +-
 src/store/modules/user/UserState.ts      |   10 +-
 src/store/modules/user/actions.ts        |   48 +-
 src/store/modules/user/getters.ts        |    9 +-
 src/store/modules/user/index.ts          |    6 +-
 src/store/modules/user/mutation-types.ts |    3 +-
 src/store/modules/user/mutations.ts      |    3 +
 src/views/Settings.vue                   |   19 +-
 16 files changed, 1183 insertions(+), 81 deletions(-)
 create mode 100644 src/adapter/index.ts

diff --git a/.env.example b/.env.example
index aa97581d..cfcf6146 100644
--- a/.env.example
+++ b/.env.example
@@ -9,5 +9,5 @@ VUE_APP_PERMISSION_ID=
 VUE_APP_ALIAS={}
 VUE_APP_DEFAULT_ALIAS=""
 VUE_APP_DEFAULT_LOG_LEVEL="error"
-VUE_APP_LOGIN_URL="http://launchpad.hotwax.io/login"
 VUE_APP_CRON_EXPRESSIONS={"Every 5 minutes":"0 */5 * ? * *","Every 15 minutes":"0 */15 * ? * *","Every 30 minutes":"0 */30 * ? * *","Hourly":"0 0 * ? * *","Every six hours":"0 0 */6 ? * *","Every day at midnight":"0 0 0 * * ?"}
+VUE_APP_LOGIN_URL="https://launchpad.hotwax.io/login"
diff --git a/package-lock.json b/package-lock.json
index a1423f96..cbe375f7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,6 +15,8 @@
         "@casl/vue": "^2.2.0",
         "@hotwax/app-version-info": "^1.0.0",
         "@hotwax/apps-theme": "^1.2.6",
+        "@hotwax/dxp-components": "^1.13.0",
+        "@hotwax/oms-api": "^1.14.0",
         "@ionic/core": "7.6.0",
         "@ionic/vue": "7.6.0",
         "@ionic/vue-router": "7.6.0",
@@ -2110,6 +2112,725 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/@fastify/busboy": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/@fastify/busboy/-/busboy-2.1.1.tgz",
+      "integrity": "sha512-vBZP4NlzfOlerQTnba4aqZoMhE/a9HY7HRqoOPaETQcSQuWEIyZMHGfVu6w9wGtGK5fED5qRs2DteVCjOH60sA==",
+      "engines": {
+        "node": ">=14"
+      }
+    },
+    "node_modules/@firebase/analytics": {
+      "version": "0.10.4",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics/-/analytics-0.10.4.tgz",
+      "integrity": "sha512-OJEl/8Oye/k+vJ1zV/1L6eGpc1XzAj+WG2TPznJ7PszL7sOFLBXkL9IjHfOCGDGpXeO3btozy/cYUqv4zgNeHg==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/installations": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/analytics-compat": {
+      "version": "0.2.10",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics-compat/-/analytics-compat-0.2.10.tgz",
+      "integrity": "sha512-ia68RcLQLLMFWrM10JfmFod7eJGwqr4/uyrtzHpTDnxGX/6gNCBTOuxdAbyWIqXI5XmcMQdz9hDijGKOHgDfPw==",
+      "dependencies": {
+        "@firebase/analytics": "0.10.4",
+        "@firebase/analytics-types": "0.8.2",
+        "@firebase/component": "0.6.7",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/analytics-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/analytics-types": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics-types/-/analytics-types-0.8.2.tgz",
+      "integrity": "sha512-EnzNNLh+9/sJsimsA/FGqzakmrAUKLeJvjRHlg8df1f97NLUlFidk9600y0ZgWOp3CAxn6Hjtk+08tixlUOWyw=="
+    },
+    "node_modules/@firebase/analytics/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/app": {
+      "version": "0.10.5",
+      "resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.10.5.tgz",
+      "integrity": "sha512-iY/fNot+hWPk9sTX8aHMqlcX9ynRvpGkskWAdUZ2eQQdLo8d1hSFYcYNwPv0Q/frGMasw8udKWMcFOEpC9fG8g==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@firebase/app-check": {
+      "version": "0.8.4",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check/-/app-check-0.8.4.tgz",
+      "integrity": "sha512-2tjRDaxcM5G7BEpytiDcIl+NovV99q8yEqRMKDbn4J4i/XjjuThuB4S+4PkmTnZiCbdLXQiBhkVxNlUDcfog5Q==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/app-check-compat": {
+      "version": "0.3.11",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-compat/-/app-check-compat-0.3.11.tgz",
+      "integrity": "sha512-t01zaH3RJpKEey0nGduz3Is+uSz7Sj4U5nwOV6lWb+86s5xtxpIvBJzu/lKxJfYyfZ29eJwpdjEgT1/lm4iQyA==",
+      "dependencies": {
+        "@firebase/app-check": "0.8.4",
+        "@firebase/app-check-types": "0.5.2",
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/app-check-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/app-check-interop-types": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-interop-types/-/app-check-interop-types-0.3.2.tgz",
+      "integrity": "sha512-LMs47Vinv2HBMZi49C09dJxp0QT5LwDzFaVGf/+ITHe3BlIhUiLNttkATSXplc89A2lAaeTqjgqVkiRfUGyQiQ=="
+    },
+    "node_modules/@firebase/app-check-types": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-types/-/app-check-types-0.5.2.tgz",
+      "integrity": "sha512-FSOEzTzL5bLUbD2co3Zut46iyPWML6xc4x+78TeaXMSuJap5QObfb+rVvZJtla3asN4RwU7elaQaduP+HFizDA=="
+    },
+    "node_modules/@firebase/app-check/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/app-compat": {
+      "version": "0.2.35",
+      "resolved": "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.2.35.tgz",
+      "integrity": "sha512-vgay/WRjeH0r97/Q6L6df2CMx7oyNFDsE5yPQ9oR1G+zx2eT0s8vNNh0WlKqQxUEWaOLRnXhQ8gy7uu0cBgTRg==",
+      "dependencies": {
+        "@firebase/app": "0.10.5",
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@firebase/app-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/app-types": {
+      "version": "0.9.2",
+      "resolved": "https://registry.npmjs.org/@firebase/app-types/-/app-types-0.9.2.tgz",
+      "integrity": "sha512-oMEZ1TDlBz479lmABwWsWjzHwheQKiAgnuKxE0pz0IXCVx7/rtlkx1fQ6GfgK24WCrxDKMplZrT50Kh04iMbXQ=="
+    },
+    "node_modules/@firebase/app/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/auth": {
+      "version": "1.7.4",
+      "resolved": "https://registry.npmjs.org/@firebase/auth/-/auth-1.7.4.tgz",
+      "integrity": "sha512-d2Fw17s5QesojwebrA903el20Li9/YGgkoOGJjagM4I1qAT36APa/FcZ+OX86KxbYKCtQKTMqraU8pxG7C2JWA==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0",
+        "undici": "5.28.4"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x",
+        "@react-native-async-storage/async-storage": "^1.18.1"
+      },
+      "peerDependenciesMeta": {
+        "@react-native-async-storage/async-storage": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@firebase/auth-compat": {
+      "version": "0.5.9",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-compat/-/auth-compat-0.5.9.tgz",
+      "integrity": "sha512-RX8Zh/3zz2CsVbmYfgHkfUm4fAEPCl+KHVIImNygV5jTGDF6oKOhBIpf4Yigclyu8ESQKZ4elyN0MBYm9/7zGw==",
+      "dependencies": {
+        "@firebase/auth": "1.7.4",
+        "@firebase/auth-types": "0.12.2",
+        "@firebase/component": "0.6.7",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0",
+        "undici": "5.28.4"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/auth-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/auth-interop-types": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-interop-types/-/auth-interop-types-0.2.3.tgz",
+      "integrity": "sha512-Fc9wuJGgxoxQeavybiuwgyi+0rssr76b+nHpj+eGhXFYAdudMWyfBHvFL/I5fEHniUM/UQdFzi9VXJK2iZF7FQ=="
+    },
+    "node_modules/@firebase/auth-types": {
+      "version": "0.12.2",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-types/-/auth-types-0.12.2.tgz",
+      "integrity": "sha512-qsEBaRMoGvHO10unlDJhaKSuPn4pyoTtlQuP1ghZfzB6rNQPuhp/N/DcFZxm9i4v0SogjCbf9reWupwIvfmH6w==",
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@firebase/auth/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/component": {
+      "version": "0.6.7",
+      "resolved": "https://registry.npmjs.org/@firebase/component/-/component-0.6.7.tgz",
+      "integrity": "sha512-baH1AA5zxfaz4O8w0vDwETByrKTQqB5CDjRls79Sa4eAGAoERw4Tnung7XbMl3jbJ4B/dmmtsMrdki0KikwDYA==",
+      "dependencies": {
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@firebase/component/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/database": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/@firebase/database/-/database-1.0.5.tgz",
+      "integrity": "sha512-cAfwBqMQuW6HbhwI3Cb/gDqZg7aR0OmaJ85WUxlnoYW2Tm4eR0hFl5FEijI3/gYPUiUcUPQvTkGV222VkT7KPw==",
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.2",
+        "@firebase/auth-interop-types": "0.2.3",
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "faye-websocket": "0.11.4",
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@firebase/database-compat": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/@firebase/database-compat/-/database-compat-1.0.5.tgz",
+      "integrity": "sha512-NDSMaDjQ+TZEMDMmzJwlTL05kh1+0Y84C+kVMaOmNOzRGRM7VHi29I6YUhCetXH+/b1Wh4ZZRyp1CuWkd8s6hg==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/database": "1.0.5",
+        "@firebase/database-types": "1.0.3",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@firebase/database-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/database-types": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@firebase/database-types/-/database-types-1.0.3.tgz",
+      "integrity": "sha512-39V/Riv2R3O/aUjYKh0xypj7NTNXNAK1bcgY5Kx+hdQPRS/aPTS8/5c0CGFYKgVuFbYlnlnhrCTYsh2uNhGwzA==",
+      "dependencies": {
+        "@firebase/app-types": "0.9.2",
+        "@firebase/util": "1.9.6"
+      }
+    },
+    "node_modules/@firebase/database/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/firestore": {
+      "version": "4.6.3",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-4.6.3.tgz",
+      "integrity": "sha512-d/+N2iUsiJ/Dc7fApdpdmmTXzwuTCromsdA1lKwYfZtMIOd1fI881NSLwK2wV4I38wkLnvfKJUV6WpU1f3/ONg==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "@firebase/webchannel-wrapper": "1.0.0",
+        "@grpc/grpc-js": "~1.9.0",
+        "@grpc/proto-loader": "^0.7.8",
+        "tslib": "^2.1.0",
+        "undici": "5.28.4"
+      },
+      "engines": {
+        "node": ">=10.10.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/firestore-compat": {
+      "version": "0.3.32",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore-compat/-/firestore-compat-0.3.32.tgz",
+      "integrity": "sha512-at71mwK7a/mUXH0OgyY0+gUzedm/EUydDFYSFsBoO8DYowZ23Mgd6P4Rzq/Ll3zI/3xJN7LGe7Qp4iE/V/3Arg==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/firestore": "4.6.3",
+        "@firebase/firestore-types": "3.0.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/firestore-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/firestore-types": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore-types/-/firestore-types-3.0.2.tgz",
+      "integrity": "sha512-wp1A+t5rI2Qc/2q7r2ZpjUXkRVPtGMd6zCLsiWurjsQpqPgFin3AhNibKcIzoF2rnToNa/XYtyWXuifjOOwDgg==",
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@firebase/firestore/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/functions": {
+      "version": "0.11.5",
+      "resolved": "https://registry.npmjs.org/@firebase/functions/-/functions-0.11.5.tgz",
+      "integrity": "sha512-qrHJ+l62mZiU5UZiVi84t/iLXZlhRuSvBQsa2qvNLgPsEWR7wdpWhRmVdB7AU8ndkSHJjGlMICqrVnz47sgU7Q==",
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.2",
+        "@firebase/auth-interop-types": "0.2.3",
+        "@firebase/component": "0.6.7",
+        "@firebase/messaging-interop-types": "0.2.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0",
+        "undici": "5.28.4"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/functions-compat": {
+      "version": "0.3.11",
+      "resolved": "https://registry.npmjs.org/@firebase/functions-compat/-/functions-compat-0.3.11.tgz",
+      "integrity": "sha512-Qn+ts/M6Lj2/6i1cp5V5TRR+Hi9kyXyHbo+w9GguINJ87zxrCe6ulx3TI5AGQkoQa8YFHUhT3DMGmLFiJjWTSQ==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/functions": "0.11.5",
+        "@firebase/functions-types": "0.6.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/functions-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/functions-types": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/@firebase/functions-types/-/functions-types-0.6.2.tgz",
+      "integrity": "sha512-0KiJ9lZ28nS2iJJvimpY4nNccV21rkQyor5Iheu/nq8aKXJqtJdeSlZDspjPSBBiHRzo7/GMUttegnsEITqR+w=="
+    },
+    "node_modules/@firebase/functions/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/installations": {
+      "version": "0.6.7",
+      "resolved": "https://registry.npmjs.org/@firebase/installations/-/installations-0.6.7.tgz",
+      "integrity": "sha512-i6iGoXRu5mX4rTsiMSSKrgh9pSEzD4hwBEzRh5kEhOTr8xN/wvQcCPZDSMVYKwM2XyCPBLVq0JzjyerwL0Rihg==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/util": "1.9.6",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/installations-compat": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/@firebase/installations-compat/-/installations-compat-0.2.7.tgz",
+      "integrity": "sha512-RPcbD+3nqHbnhVjIOpWK2H5qzZ8pAAAScceiWph0VNTqpKyPQ5tDcp4V5fS0ELpfgsHYvroMLDKfeHxpfvm8cw==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/installations": "0.6.7",
+        "@firebase/installations-types": "0.5.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/installations-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/installations-types": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/@firebase/installations-types/-/installations-types-0.5.2.tgz",
+      "integrity": "sha512-que84TqGRZJpJKHBlF2pkvc1YcXrtEDOVGiDjovP/a3s6W4nlbohGXEsBJo0JCeeg/UG9A+DEZVDUV9GpklUzA==",
+      "peerDependencies": {
+        "@firebase/app-types": "0.x"
+      }
+    },
+    "node_modules/@firebase/installations/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/logger": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/@firebase/logger/-/logger-0.4.2.tgz",
+      "integrity": "sha512-Q1VuA5M1Gjqrwom6I6NUU4lQXdo9IAQieXlujeHZWvRt1b7qQ0KwBaNAjgxG27jgF9/mUwsNmO8ptBCGVYhB0A==",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@firebase/logger/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/messaging": {
+      "version": "0.12.9",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging/-/messaging-0.12.9.tgz",
+      "integrity": "sha512-IH+JJmzbFGZXV3+TDyKdqqKPVfKRqBBg2BfYYOy7cm7J+SwV+uJMe8EnDKYeQLEQhtpwciPfJ3qQXJs2lbxDTw==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/installations": "0.6.7",
+        "@firebase/messaging-interop-types": "0.2.2",
+        "@firebase/util": "1.9.6",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/messaging-compat": {
+      "version": "0.2.9",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging-compat/-/messaging-compat-0.2.9.tgz",
+      "integrity": "sha512-5jN6wyhwPgBH02zOtmmoOeyfsmoD7ty48D1m0vVPsFg55RqN2Z3Q9gkZ5GmPklFPjTPLcxB1ObcHOZvThTkm7g==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/messaging": "0.12.9",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/messaging-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/messaging-interop-types": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging-interop-types/-/messaging-interop-types-0.2.2.tgz",
+      "integrity": "sha512-l68HXbuD2PPzDUOFb3aG+nZj5KA3INcPwlocwLZOzPp9rFM9yeuI9YLl6DQfguTX5eAGxO0doTR+rDLDvQb5tA=="
+    },
+    "node_modules/@firebase/messaging/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/performance": {
+      "version": "0.6.7",
+      "resolved": "https://registry.npmjs.org/@firebase/performance/-/performance-0.6.7.tgz",
+      "integrity": "sha512-d+Q4ltjdJZqjzcdms5i0UC9KLYX7vKGcygZ+7zHA/Xk+bAbMD2CPU0nWTnlNFWifZWIcXZ/2mAMvaGMW3lypUA==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/installations": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/performance-compat": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/@firebase/performance-compat/-/performance-compat-0.2.7.tgz",
+      "integrity": "sha512-cb8ge/5iTstxfIGW+iiY+7l3FtN8gobNh9JSQNZgLC9xmcfBYWEs8IeEWMI6S8T+At0oHc3lv+b2kpRMUWr8zQ==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/performance": "0.6.7",
+        "@firebase/performance-types": "0.2.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/performance-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/performance-types": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/@firebase/performance-types/-/performance-types-0.2.2.tgz",
+      "integrity": "sha512-gVq0/lAClVH5STrIdKnHnCo2UcPLjJlDUoEB/tB4KM+hAeHUxWKnpT0nemUPvxZ5nbdY/pybeyMe8Cs29gEcHA=="
+    },
+    "node_modules/@firebase/performance/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/remote-config": {
+      "version": "0.4.7",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config/-/remote-config-0.4.7.tgz",
+      "integrity": "sha512-5oPNrPFLsbsjpq0lUEIXoDF2eJK7vAbyXe/DEuZQxnwJlfR7aQbtUlEkRgQWcicXpyDmAmDLo7q7lDbCYa6CpA==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/installations": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/remote-config-compat": {
+      "version": "0.2.7",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config-compat/-/remote-config-compat-0.2.7.tgz",
+      "integrity": "sha512-Fq0oneQ4SluLnfr5/HfzRS1TZf1ANj1rWbCCW3+oC98An3nE+sCdp+FSuHsEVNwgMg4Tkwx9Oom2lkKeU+Vn+w==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/remote-config": "0.4.7",
+        "@firebase/remote-config-types": "0.3.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/remote-config-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/remote-config-types": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config-types/-/remote-config-types-0.3.2.tgz",
+      "integrity": "sha512-0BC4+Ud7y2aPTyhXJTMTFfrGGLqdYXrUB9sJVAB8NiqJswDTc4/2qrE/yfUbnQJhbSi6ZaTTBKyG3n1nplssaA=="
+    },
+    "node_modules/@firebase/remote-config/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/storage": {
+      "version": "0.12.5",
+      "resolved": "https://registry.npmjs.org/@firebase/storage/-/storage-0.12.5.tgz",
+      "integrity": "sha512-nGWBOGFNr10j0LA4NJ3/Yh3us/lb0Q1xSIKZ38N6FcS+vY54nqJ7k3zE3PENregHC8+8txRow++A568G3v8hOA==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0",
+        "undici": "5.28.4"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/storage-compat": {
+      "version": "0.3.8",
+      "resolved": "https://registry.npmjs.org/@firebase/storage-compat/-/storage-compat-0.3.8.tgz",
+      "integrity": "sha512-qDfY9kMb6Ch2hZb40sBjDQ8YPxbjGOxuT+gU1Z0iIVSSpSX0f4YpGJCypUXiA0T11n6InCXB+T/Dknh2yxVTkg==",
+      "dependencies": {
+        "@firebase/component": "0.6.7",
+        "@firebase/storage": "0.12.5",
+        "@firebase/storage-types": "0.8.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/storage-compat/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/storage-types": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/@firebase/storage-types/-/storage-types-0.8.2.tgz",
+      "integrity": "sha512-0vWu99rdey0g53lA7IShoA2Lol1jfnPovzLDUBuon65K7uKG9G+L5uO05brD9pMw+l4HRFw23ah3GwTGpEav6g==",
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@firebase/storage/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/util": {
+      "version": "1.9.6",
+      "resolved": "https://registry.npmjs.org/@firebase/util/-/util-1.9.6.tgz",
+      "integrity": "sha512-IBr1MZbp4d5MjBCXL3TW1dK/PDXX4yOGbiwRNh1oAbE/+ci5Uuvy9KIrsFYY80as1I0iOaD5oOMA9Q8j4TJWcw==",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/@firebase/util/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/vertexai-preview": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/@firebase/vertexai-preview/-/vertexai-preview-0.0.2.tgz",
+      "integrity": "sha512-NOOL63kFQRq45ioi5P+hlqj/4LNmvn1URhGjQdvyV54c1Irvoq26aW861PRRLjrSMIeNeiLtCLD5pe+ediepAg==",
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.2",
+        "@firebase/component": "0.6.7",
+        "@firebase/logger": "0.4.2",
+        "@firebase/util": "1.9.6",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x",
+        "@firebase/app-types": "0.x"
+      }
+    },
+    "node_modules/@firebase/vertexai-preview/node_modules/tslib": {
+      "version": "2.6.2",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
+      "integrity": "sha512-AEYxH93jGFPn/a2iVAwW87VuUIkR1FVUKB77NwMF7nBTDkDrrT/Hpt/IrCJ0QXhW27jTBDcf5ZY7w6RiqTMw2Q=="
+    },
+    "node_modules/@firebase/webchannel-wrapper": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/@firebase/webchannel-wrapper/-/webchannel-wrapper-1.0.0.tgz",
+      "integrity": "sha512-zuWxyfXNbsKbm96HhXzainONPFqRcoZblQ++e9cAIGUuHfl2cFSBzW01jtesqWG/lqaUyX3H8O1y9oWboGNQBA=="
+    },
+    "node_modules/@grpc/grpc-js": {
+      "version": "1.9.14",
+      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.14.tgz",
+      "integrity": "sha512-nOpuzZ2G3IuMFN+UPPpKrC6NsLmWsTqSsm66IRfnBt1D4pwTqE27lmbpcPM+l2Ua4gE7PfjRHI6uedAy7hoXUw==",
+      "dependencies": {
+        "@grpc/proto-loader": "^0.7.8",
+        "@types/node": ">=12.12.47"
+      },
+      "engines": {
+        "node": "^8.13.0 || >=10.10.0"
+      }
+    },
+    "node_modules/@grpc/proto-loader": {
+      "version": "0.7.13",
+      "resolved": "https://registry.npmjs.org/@grpc/proto-loader/-/proto-loader-0.7.13.tgz",
+      "integrity": "sha512-AiXO/bfe9bmxBjxxtYxFAXGZvMaN5s8kO+jBHAJCON8rJoB5YS/D6X7ZNc6XQkuHNmyl4CYaMI1fJ/Gn27RGGw==",
+      "dependencies": {
+        "lodash.camelcase": "^4.3.0",
+        "long": "^5.0.0",
+        "protobufjs": "^7.2.5",
+        "yargs": "^17.7.2"
+      },
+      "bin": {
+        "proto-loader-gen-types": "build/bin/proto-loader-gen-types.js"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/yargs": {
+      "version": "17.7.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.1.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/@hapi/hoek": {
       "version": "9.3.0",
       "resolved": "https://registry.npmjs.org/@hapi/hoek/-/hoek-9.3.0.tgz",
@@ -2135,6 +2856,105 @@
       "resolved": "https://registry.npmjs.org/@hotwax/apps-theme/-/apps-theme-1.2.6.tgz",
       "integrity": "sha512-zpUjGoY7LBlKeiP0V7tonrmoey8HQ5THQmyixQ+IDtrjmEJNBjynW/Ef3gC0FUNNPuVqxWPZdT5CVgaETLGTwg=="
     },
+    "node_modules/@hotwax/dxp-components": {
+      "version": "1.14.0",
+      "resolved": "https://registry.npmjs.org/@hotwax/dxp-components/-/dxp-components-1.14.0.tgz",
+      "integrity": "sha512-dLQ/pBH1BjC3RjSC6K254YM4IP1HUWttkPYY3IMtiLy0B0XrjCz8eGBHsG6DtNm7An9CJ9Dn9krz6/i1nzcRmA==",
+      "dependencies": {
+        "@hotwax/oms-api": "^1.8.1",
+        "@ionic/core": "^7.6.0",
+        "@ionic/vue": "^7.6.0",
+        "firebase": "^10.3.1",
+        "luxon": "^3.3.0",
+        "pinia": "2.0.36",
+        "pinia-plugin-persistedstate": "^3.1.0",
+        "register-service-worker": "^1.7.2",
+        "vue": "^3.3.4",
+        "vue-i18n": "^9.2.2"
+      }
+    },
+    "node_modules/@hotwax/dxp-components/node_modules/@intlify/core-base": {
+      "version": "9.13.1",
+      "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.13.1.tgz",
+      "integrity": "sha512-+bcQRkJO9pcX8d0gel9ZNfrzU22sZFSA0WVhfXrf5jdJOS24a+Bp8pozuS9sBI9Hk/tGz83pgKfmqcn/Ci7/8w==",
+      "dependencies": {
+        "@intlify/message-compiler": "9.13.1",
+        "@intlify/shared": "9.13.1"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@hotwax/dxp-components/node_modules/@intlify/message-compiler": {
+      "version": "9.13.1",
+      "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.13.1.tgz",
+      "integrity": "sha512-SKsVa4ajYGBVm7sHMXd5qX70O2XXjm55zdZB3VeMFCvQyvLew/dLvq3MqnaIsTMF1VkkOb9Ttr6tHcMlyPDL9w==",
+      "dependencies": {
+        "@intlify/shared": "9.13.1",
+        "source-map-js": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@hotwax/dxp-components/node_modules/@intlify/shared": {
+      "version": "9.13.1",
+      "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.13.1.tgz",
+      "integrity": "sha512-u3b6BKGhE6j/JeRU6C/RL2FgyJfy6LakbtfeVF8fJXURpZZTzfh3e05J0bu0XPw447Q6/WUp3C4ajv4TMS4YsQ==",
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      }
+    },
+    "node_modules/@hotwax/dxp-components/node_modules/luxon": {
+      "version": "3.4.4",
+      "resolved": "https://registry.npmjs.org/luxon/-/luxon-3.4.4.tgz",
+      "integrity": "sha512-zobTr7akeGHnv7eBOXcRgMeCP6+uyYsczwmeRCauvpvaAltgNyTbLH/+VaEAPUeWBT+1GuNmz4wC/6jtQzbbVA==",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@hotwax/dxp-components/node_modules/vue-i18n": {
+      "version": "9.13.1",
+      "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.13.1.tgz",
+      "integrity": "sha512-mh0GIxx0wPtPlcB1q4k277y0iKgo25xmDPWioVVYanjPufDBpvu5ySTjP5wOrSvlYQ2m1xI+CFhGdauv/61uQg==",
+      "dependencies": {
+        "@intlify/core-base": "9.13.1",
+        "@intlify/shared": "9.13.1",
+        "@vue/devtools-api": "^6.5.0"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/kazupon"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.0"
+      }
+    },
+    "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==",
+      "dependencies": {
+        "@types/node-json-transform": "^1.0.0",
+        "axios": "^0.21.1",
+        "axios-cache-adapter": "^2.7.3",
+        "deepmerge": "^4.3.0",
+        "http-status-codes": "^2.2.0",
+        "node-json-transform": "^1.1.2",
+        "qs": "^6.11.0"
+      }
+    },
     "node_modules/@humanwhocodes/config-array": {
       "version": "0.5.0",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.5.0.tgz",
@@ -2591,6 +3411,60 @@
       "integrity": "sha512-j7P6Rgr3mmtdkeDGTe0E/aYyWEWVtc5yFXtHCRHs28/jptDEWfaVOc5T7cblqy1XKPPfCxJc/8DwQ5YgLOZOVQ==",
       "dev": true
     },
+    "node_modules/@protobufjs/aspromise": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/aspromise/-/aspromise-1.1.2.tgz",
+      "integrity": "sha512-j+gKExEuLmKwvz3OgROXtrJ2UG2x8Ch2YZUxahh+s1F2HZ+wAceUNLkvy6zKCPVRkU++ZWQrdxsUeQXmcg4uoQ=="
+    },
+    "node_modules/@protobufjs/base64": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/base64/-/base64-1.1.2.tgz",
+      "integrity": "sha512-AZkcAA5vnN/v4PDqKyMR5lx7hZttPDgClv83E//FMNhR2TMcLUhfRUBHCmSl0oi9zMgDDqRUJkSxO3wm85+XLg=="
+    },
+    "node_modules/@protobufjs/codegen": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/@protobufjs/codegen/-/codegen-2.0.4.tgz",
+      "integrity": "sha512-YyFaikqM5sH0ziFZCN3xDC7zeGaB/d0IUb9CATugHWbd1FRFwWwt4ld4OYMPWu5a3Xe01mGAULCdqhMlPl29Jg=="
+    },
+    "node_modules/@protobufjs/eventemitter": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@protobufjs/eventemitter/-/eventemitter-1.1.0.tgz",
+      "integrity": "sha512-j9ednRT81vYJ9OfVuXG6ERSTdEL1xVsNgqpkxMsbIabzSo3goCjDIveeGv5d03om39ML71RdmrGNjG5SReBP/Q=="
+    },
+    "node_modules/@protobufjs/fetch": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@protobufjs/fetch/-/fetch-1.1.0.tgz",
+      "integrity": "sha512-lljVXpqXebpsijW71PZaCYeIcE5on1w5DlQy5WH6GLbFryLUrBD4932W/E2BSpfRJWseIL4v/KPgBFxDOIdKpQ==",
+      "dependencies": {
+        "@protobufjs/aspromise": "^1.1.1",
+        "@protobufjs/inquire": "^1.1.0"
+      }
+    },
+    "node_modules/@protobufjs/float": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/float/-/float-1.0.2.tgz",
+      "integrity": "sha512-Ddb+kVXlXst9d+R9PfTIxh1EdNkgoRe5tOX6t01f1lYWOvJnSPDBlG241QLzcyPdoNTsblLUdujGSE4RzrTZGQ=="
+    },
+    "node_modules/@protobufjs/inquire": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@protobufjs/inquire/-/inquire-1.1.0.tgz",
+      "integrity": "sha512-kdSefcPdruJiFMVSbn801t4vFK7KB/5gd2fYvrxhuJYg8ILrmn9SKSX2tZdV6V+ksulWqS7aXjBcRXl3wHoD9Q=="
+    },
+    "node_modules/@protobufjs/path": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/path/-/path-1.1.2.tgz",
+      "integrity": "sha512-6JOcJ5Tm08dOHAbdR3GrvP+yUUfkjG5ePsHYczMFLq3ZmMkAD98cDgcT2iA1lJ9NVwFd4tH/iSSoe44YWkltEA=="
+    },
+    "node_modules/@protobufjs/pool": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@protobufjs/pool/-/pool-1.1.0.tgz",
+      "integrity": "sha512-0kELaGSIDBKvcgS4zkjz1PeddatrjYcmMWOlAuAPwAeccUrPHdUqo/J6LiymHHEiJT5NrF1UVwxY14f+fy4WQw=="
+    },
+    "node_modules/@protobufjs/utf8": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@protobufjs/utf8/-/utf8-1.1.0.tgz",
+      "integrity": "sha512-Vvn3zZrhQZkkBE8LSuW3em98c0FwgO4nxzv6OdSxPKJIEKY2bGbHn+mhGIPerzI4twdxaP8/0+06HBpwf345Lw=="
+    },
     "node_modules/@rollup/plugin-babel": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -2975,8 +3849,7 @@
     "node_modules/@types/node": {
       "version": "14.18.63",
       "resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.63.tgz",
-      "integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ==",
-      "dev": true
+      "integrity": "sha512-fAtCfv4jJg+ExtXhvCkCqUKZ+4ok/JQk01qDKhL5BDDoS3AxKXhV5/MAVUZyQnSEd2GT92fkgZl0pz0Q0AzcIQ=="
     },
     "node_modules/@types/node-forge": {
       "version": "1.3.11",
@@ -2987,6 +3860,11 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/node-json-transform": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@types/node-json-transform/-/node-json-transform-1.0.2.tgz",
+      "integrity": "sha512-gOq49i42EmHRKPTTD4cXru3MAFoDADqzUxzAweKtZZBmLJuAK0GsJHNX4HKdvZ/JJHf+F4TYgnvb7Ge0NlQiGw=="
+    },
     "node_modules/@types/normalize-package-data": {
       "version": "2.4.4",
       "resolved": "https://registry.npmjs.org/@types/normalize-package-data/-/normalize-package-data-2.4.4.tgz",
@@ -4729,7 +5607,6 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
       "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -7291,8 +8168,7 @@
     "node_modules/emoji-regex": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
-      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
-      "dev": true
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
     },
     "node_modules/emojis-list": {
       "version": "3.0.0",
@@ -7517,7 +8393,6 @@
       "version": "3.1.2",
       "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz",
       "integrity": "sha512-ErCHMCae19vR8vQGe50xIsVomy19rg6gFu3+r3jkEO46suLMWBksvVyoGgQV+jOfl84ZSOSlmv6Gxa89PmTGmA==",
-      "dev": true,
       "engines": {
         "node": ">=6"
       }
@@ -8502,7 +9377,6 @@
       "version": "0.11.4",
       "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz",
       "integrity": "sha512-CzbClwlXAuiRQAlUyfqPgvPoNKTckTPGfwZV4ZdAhVcP2lh9KUxJg2b5GkE7XbjKQ3YJnQ9z6D9ntLAlB+tP8g==",
-      "dev": true,
       "dependencies": {
         "websocket-driver": ">=0.5.1"
       },
@@ -8651,6 +9525,40 @@
         "node": ">=8"
       }
     },
+    "node_modules/firebase": {
+      "version": "10.12.2",
+      "resolved": "https://registry.npmjs.org/firebase/-/firebase-10.12.2.tgz",
+      "integrity": "sha512-ZxEdtSvP1I9su1yf32D8TIdgxtPgxwr6z3jYAR1TXS/t+fVfpoPc/N1/N2bxOco9mNjUoc+od34v5Fn4GeKs6Q==",
+      "dependencies": {
+        "@firebase/analytics": "0.10.4",
+        "@firebase/analytics-compat": "0.2.10",
+        "@firebase/app": "0.10.5",
+        "@firebase/app-check": "0.8.4",
+        "@firebase/app-check-compat": "0.3.11",
+        "@firebase/app-compat": "0.2.35",
+        "@firebase/app-types": "0.9.2",
+        "@firebase/auth": "1.7.4",
+        "@firebase/auth-compat": "0.5.9",
+        "@firebase/database": "1.0.5",
+        "@firebase/database-compat": "1.0.5",
+        "@firebase/firestore": "4.6.3",
+        "@firebase/firestore-compat": "0.3.32",
+        "@firebase/functions": "0.11.5",
+        "@firebase/functions-compat": "0.3.11",
+        "@firebase/installations": "0.6.7",
+        "@firebase/installations-compat": "0.2.7",
+        "@firebase/messaging": "0.12.9",
+        "@firebase/messaging-compat": "0.2.9",
+        "@firebase/performance": "0.6.7",
+        "@firebase/performance-compat": "0.2.7",
+        "@firebase/remote-config": "0.4.7",
+        "@firebase/remote-config-compat": "0.2.7",
+        "@firebase/storage": "0.12.5",
+        "@firebase/storage-compat": "0.3.8",
+        "@firebase/util": "1.9.6",
+        "@firebase/vertexai-preview": "0.0.2"
+      }
+    },
     "node_modules/flat": {
       "version": "5.0.2",
       "resolved": "https://registry.npmjs.org/flat/-/flat-5.0.2.tgz",
@@ -9077,7 +9985,6 @@
       "version": "2.0.5",
       "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
       "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
-      "dev": true,
       "engines": {
         "node": "6.* || 8.* || >= 10.*"
       }
@@ -9601,8 +10508,7 @@
     "node_modules/http-parser-js": {
       "version": "0.5.8",
       "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.8.tgz",
-      "integrity": "sha512-SGeBX54F94Wgu5RH3X5jsDtf4eHyRogWX1XGT3b4HuW3tQPM4AaBzoUji/4AAJNXCEOWZ5O0DgZmJw1947gD5Q==",
-      "dev": true
+      "integrity": "sha512-SGeBX54F94Wgu5RH3X5jsDtf4eHyRogWX1XGT3b4HuW3tQPM4AaBzoUji/4AAJNXCEOWZ5O0DgZmJw1947gD5Q=="
     },
     "node_modules/http-proxy": {
       "version": "1.18.1",
@@ -9697,8 +10603,7 @@
     "node_modules/idb": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/idb/-/idb-7.1.1.tgz",
-      "integrity": "sha512-gchesWBzyvGHRO9W8tzUWFDycow5gwjvFKfyV9FF32Y7F50yZMp7mP+T2mJIWFx49zicqyC4uefHM17o6xKIVQ==",
-      "dev": true
+      "integrity": "sha512-gchesWBzyvGHRO9W8tzUWFDycow5gwjvFKfyV9FF32Y7F50yZMp7mP+T2mJIWFx49zicqyC4uefHM17o6xKIVQ=="
     },
     "node_modules/ieee754": {
       "version": "1.2.1",
@@ -10135,7 +11040,6 @@
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
       "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
-      "dev": true,
       "engines": {
         "node": ">=8"
       }
@@ -11058,8 +11962,12 @@
     "node_modules/lodash": {
       "version": "4.17.21",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
-      "dev": true
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+    },
+    "node_modules/lodash.camelcase": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
+      "integrity": "sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA=="
     },
     "node_modules/lodash.debounce": {
       "version": "4.0.8",
@@ -11316,6 +12224,11 @@
         "node": ">=8"
       }
     },
+    "node_modules/long": {
+      "version": "5.2.3",
+      "resolved": "https://registry.npmjs.org/long/-/long-5.2.3.tgz",
+      "integrity": "sha512-lcHwpNoggQTObv5apGNCTdJrO69eHOZMi4BNC+rTLER8iHAqGrUVeLh/irVIM7zTw2bOXA8T6uNPeujwOLg/2Q=="
+    },
     "node_modules/lower-case": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz",
@@ -11798,6 +12711,14 @@
         "node": ">= 6.13.0"
       }
     },
+    "node_modules/node-json-transform": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/node-json-transform/-/node-json-transform-1.1.2.tgz",
+      "integrity": "sha512-Y3twjldHF1htCiCu6elGwQDdNp5PD54U66waWa2XNKh+g2lXSnWo3nq9SZnZOV3odFAqkM/roiNZx078RE2new==",
+      "dependencies": {
+        "lodash": "^4.17.15"
+      }
+    },
     "node_modules/node-releases": {
       "version": "2.0.14",
       "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
@@ -12409,6 +13330,64 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/pinia": {
+      "version": "2.0.36",
+      "resolved": "https://registry.npmjs.org/pinia/-/pinia-2.0.36.tgz",
+      "integrity": "sha512-4UKApwjlmJH+VuHKgA+zQMddcCb3ezYnyewQ9NVrsDqZ/j9dMv5+rh+1r48whKNdpFkZAWVxhBp5ewYaYX9JcQ==",
+      "dependencies": {
+        "@vue/devtools-api": "^6.5.0",
+        "vue-demi": "*"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/posva"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.4.0",
+        "typescript": ">=4.4.4",
+        "vue": "^2.6.14 || ^3.2.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        },
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/pinia-plugin-persistedstate": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/pinia-plugin-persistedstate/-/pinia-plugin-persistedstate-3.2.1.tgz",
+      "integrity": "sha512-MK++8LRUsGF7r45PjBFES82ISnPzyO6IZx3CH5vyPseFLZCk1g2kgx6l/nW8pEBKxxd4do0P6bJw+mUSZIEZUQ==",
+      "peerDependencies": {
+        "pinia": "^2.0.0"
+      }
+    },
+    "node_modules/pinia/node_modules/vue-demi": {
+      "version": "0.14.7",
+      "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.7.tgz",
+      "integrity": "sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==",
+      "hasInstallScript": true,
+      "bin": {
+        "vue-demi-fix": "bin/vue-demi-fix.js",
+        "vue-demi-switch": "bin/vue-demi-switch.js"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      },
+      "peerDependencies": {
+        "@vue/composition-api": "^1.0.0-rc.1",
+        "vue": "^3.0.0-0 || ^2.6.0"
+      },
+      "peerDependenciesMeta": {
+        "@vue/composition-api": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/pkg-dir": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-4.2.0.tgz",
@@ -13270,6 +14249,29 @@
       "integrity": "sha512-vtK/94akxsTMhe0/cbfpR+syPuszcuwhqVjJq26CuNDgFGj682oRBXOP5MJpv2r7JtE8MsiepGIqvvOTBwn2vA==",
       "dev": true
     },
+    "node_modules/protobufjs": {
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.3.0.tgz",
+      "integrity": "sha512-YWD03n3shzV9ImZRX3ccbjqLxj7NokGN0V/ESiBV5xWqrommYHYiihuIyavq03pWSGqlyvYUFmfoMKd+1rPA/g==",
+      "hasInstallScript": true,
+      "dependencies": {
+        "@protobufjs/aspromise": "^1.1.2",
+        "@protobufjs/base64": "^1.1.2",
+        "@protobufjs/codegen": "^2.0.4",
+        "@protobufjs/eventemitter": "^1.1.0",
+        "@protobufjs/fetch": "^1.1.0",
+        "@protobufjs/float": "^1.0.2",
+        "@protobufjs/inquire": "^1.1.0",
+        "@protobufjs/path": "^1.1.2",
+        "@protobufjs/pool": "^1.1.0",
+        "@protobufjs/utf8": "^1.1.0",
+        "@types/node": ">=13.7.0",
+        "long": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
     "node_modules/proxy-addr": {
       "version": "2.0.7",
       "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
@@ -13625,7 +14627,6 @@
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
       "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
-      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -13871,7 +14872,6 @@
       "version": "5.2.1",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
       "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
-      "dev": true,
       "funding": [
         {
           "type": "github",
@@ -14483,7 +15483,6 @@
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
       "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
-      "dev": true,
       "dependencies": {
         "emoji-regex": "^8.0.0",
         "is-fullwidth-code-point": "^3.0.0",
@@ -14601,7 +15600,6 @@
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
       "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
-      "dev": true,
       "dependencies": {
         "ansi-regex": "^5.0.1"
       },
@@ -15442,6 +16440,17 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/undici": {
+      "version": "5.28.4",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-5.28.4.tgz",
+      "integrity": "sha512-72RFADWFqKmUb2hmmvNODKL3p9hcB6Gt2DOQMis1SEBaV6a4MH8soBvzg+95CYhCKPFedut2JY9bMfrDl9D23g==",
+      "dependencies": {
+        "@fastify/busboy": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=14.0"
+      }
+    },
     "node_modules/unicode-canonical-property-names-ecmascript": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-2.0.0.tgz",
@@ -16831,7 +17840,6 @@
       "version": "0.7.4",
       "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz",
       "integrity": "sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==",
-      "dev": true,
       "dependencies": {
         "http-parser-js": ">=0.5.1",
         "safe-buffer": ">=5.1.0",
@@ -16845,7 +17853,6 @@
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
       "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
-      "dev": true,
       "engines": {
         "node": ">=0.8.0"
       }
@@ -17264,7 +18271,6 @@
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
       "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
-      "dev": true,
       "dependencies": {
         "ansi-styles": "^4.0.0",
         "string-width": "^4.1.0",
@@ -17332,7 +18338,6 @@
       "version": "4.3.0",
       "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
       "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
       "dependencies": {
         "color-convert": "^2.0.1"
       },
@@ -17347,7 +18352,6 @@
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
       "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-      "dev": true,
       "dependencies": {
         "color-name": "~1.1.4"
       },
@@ -17358,8 +18362,7 @@
     "node_modules/wrap-ansi/node_modules/color-name": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-      "dev": true
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
     },
     "node_modules/wrappy": {
       "version": "1.0.2",
@@ -17423,7 +18426,6 @@
       "version": "5.0.8",
       "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
       "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
-      "dev": true,
       "engines": {
         "node": ">=10"
       }
diff --git a/package.json b/package.json
index 6c988b83..294f1847 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,8 @@
     "@casl/vue": "^2.2.0",
     "@hotwax/app-version-info": "^1.0.0",
     "@hotwax/apps-theme": "^1.2.6",
+    "@hotwax/dxp-components": "^1.13.0",
+    "@hotwax/oms-api": "^1.14.0",
     "@ionic/core": "7.6.0",
     "@ionic/vue": "7.6.0",
     "@ionic/vue-router": "7.6.0",
diff --git a/src/App.vue b/src/App.vue
index c5f663bd..399a16d9 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -15,10 +15,29 @@ import { Settings } from 'luxon'
 import Menu from '@/components/Menu.vue';
 import store from "./store";
 import { translate } from './i18n';
+import { initialise, resetConfig } from '@/adapter'
 
 
-const loader = ref(null) as any
 const userProfile = computed(() => store.getters["user/getUserProfile"])
+const userToken = computed(() => store.getters["user/getUserToken"])
+const instanceUrl = computed(() => store.getters["user/getInstanceUrl"])
+
+const loader = ref(null) as any
+const maxAge = process.env.VUE_APP_CACHE_MAX_AGE ? parseInt(process.env.VUE_APP_CACHE_MAX_AGE) : 0
+
+initialise({
+  token: userToken.value,
+  instanceUrl: instanceUrl.value,
+  cacheMaxAge: maxAge,
+  events: {
+    responseError: () => {
+      setTimeout(() => dismissLoader(), 100);
+    },
+    queueTask: (payload: any) => {
+      emitter.emit("queueTask", payload);
+    }
+  }
+})
 
 async function presentLoader(options = { message: '', backdropDismiss: true }) {
   // When having a custom message remove already existing loader
@@ -58,6 +77,8 @@ onMounted(async () => {
 onUnmounted(() => {
   emitter.off("presentLoader", presentLoader);
   emitter.off("dismissLoader", dismissLoader);
+
+  resetConfig()
 })
 </script>
 <style>
diff --git a/src/adapter/index.ts b/src/adapter/index.ts
new file mode 100644
index 00000000..fdb8d301
--- /dev/null
+++ b/src/adapter/index.ts
@@ -0,0 +1,15 @@
+import { api, client, getConfig, getProductIdentificationPref, getUserFacilities, initialise, logout, resetConfig, setProductIdentificationPref, updateInstanceUrl, updateToken } from '@hotwax/oms-api'
+
+export {
+  api,
+  client,
+  getConfig,
+  getProductIdentificationPref,
+  getUserFacilities,
+  initialise,
+  logout,
+  resetConfig,
+  setProductIdentificationPref,
+  updateInstanceUrl,
+  updateToken
+}
\ No newline at end of file
diff --git a/src/api/index.ts b/src/api/index.ts
index cfd50c46..84939cfe 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -4,7 +4,6 @@ import OfflineHelper from "@/offline-helper"
 import emitter from "@/event-bus"
 import store from "@/store";
 import { StatusCodes } from "http-status-codes";
-import router from "@/router"
 
 axios.interceptors.request.use((config: any) => {
   // TODO: pass csrf token
@@ -46,7 +45,9 @@ axios.interceptors.response.use(function (response: any) {
     const { status } = error.response;
     if (status === StatusCodes.UNAUTHORIZED) {
       store.dispatch("user/logout");
-      router.push("/login")
+      const redirectUrl = window.location.origin + '/login';
+      // Explicitly passing isLoggedOut as in case of maarg apps we need to call the logout api in launchpad
+      window.location.href = `${process.env.VUE_APP_LOGIN_URL}?redirectUrl=${redirectUrl}&isLoggedOut=true`;
     }
   }
   // Any status codes that falls outside the range of 2xx cause this function to trigger
diff --git a/src/main.ts b/src/main.ts
index 932ce32a..0dd02aa1 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -29,6 +29,9 @@ import './theme/variables.css';
 
 import i18n from './i18n'
 import store from './store'
+import { dxpComponents } from "@hotwax/dxp-components"
+import { login, logout, loader } from "@/user-utils";
+import { getConfig, initialise } from '@/adapter';
 
 
 const app = createApp(App)
@@ -41,7 +44,16 @@ const app = createApp(App)
   })
   .use(router)
   .use(i18n)
-  .use(store);
+  .use(store)
+  .use(dxpComponents, {
+    defaultImgUrl: require("@/assets/images/defaultImage.png"),
+    login,
+    logout,
+    loader,
+    appLoginUrl: process.env.VUE_APP_LOGIN_URL as string,
+    getConfig,
+    initialise
+  });
 
 // Filters are removed in Vue 3 and global filter introduced https://v3.vuejs.org/guide/migration/filters.html#global-filters
 app.config.globalProperties.$filters = {
diff --git a/src/router/index.ts b/src/router/index.ts
index a744bf4a..5b9e6b21 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -12,7 +12,8 @@ import CreateUpdateThresholdRule from '@/views/CreateUpdateThresholdRule.vue';
 import CreateUpdateSafetyStockRule from '@/views/CreateUpdateSafetyStockRule.vue'
 import CreateUpdateStorePickupRule from '@/views/CreateUpdateStorePickupRule.vue'
 import CreateUpdateShippingRule from '@/views/CreateUpdateShippingRule.vue'
-
+import { DxpLogin, useAuthStore } from '@hotwax/dxp-components';
+import { loader } from '@/user-utils';
 
 import 'vue-router'
 
@@ -24,19 +25,23 @@ declare module 'vue-router' {
 }
 
 const authGuard = async (to: any, from: any, next: any) => {
-  if (store.getters["user/isAuthenticated"]) {
-    next()
-  } else {
-    next("/login")
+  const authStore = useAuthStore()
+  if (!authStore.isAuthenticated || !store.getters['user/isAuthenticated']) {
+    await loader.present('Authenticating')
+    // TODO use authenticate() when support is there
+    const redirectUrl = window.location.origin + '/login'
+    window.location.href = `${process.env.VUE_APP_LOGIN_URL}?redirectUrl=${redirectUrl}`
+    loader.dismiss()
   }
+  next()
 };
 
 const loginGuard = (to: any, from: any, next: any) => {
-  if (!store.getters["user/isAuthenticated"]) {
-    next()
-  } else {
-    next("/")
+  const authStore = useAuthStore()
+  if (authStore.isAuthenticated && !to.query?.token && !to.query?.oms) {
+    next('/')
   }
+  next();
 };
 
 const routes: Array<RouteRecordRaw> = [
@@ -129,7 +134,7 @@ const routes: Array<RouteRecordRaw> = [
   {
     path: '/login',
     name: 'DxpLogin',
-    component: Login,
+    component: DxpLogin,
     beforeEnter: loginGuard
   },
   {
diff --git a/src/services/UserService.ts b/src/services/UserService.ts
index f52014d4..8911333d 100644
--- a/src/services/UserService.ts
+++ b/src/services/UserService.ts
@@ -2,27 +2,33 @@ import api, {client} from '@/api';
 import store from "@/store";
 import { hasError } from "@/utils";
 
-const login = async (username: string, password: string): Promise <any> => {
-  let token = ""
+const login = async (token: string): Promise <any> => {
+  const url = store.getters["user/getBaseUrl"]
+  const baseURL = url.startsWith('http') ? url.includes('/rest/s1/available-to-promise') ? url : `${url}/rest/s1/available-to-promise/` : `https://${url}.hotwax.io/rest/s1/available-to-promise/`;
+  let api_key = ""
+
   try {
-    const resp = await api({
+    const resp = await client({
       url: "login", 
       method: "post",
-      data: {
-        username,
-        password
+      baseURL,
+      params: {
+        token
+      },
+      headers: {
+        "Content-Type": "application/json"
       }
     }) as any;
 
-    if(!hasError(resp) && resp.data.token) {
-      token = resp.data.token
+    if(!hasError(resp) && (resp.data.api_key || resp.data.token)) {
+      api_key = resp.data.api_key || resp.data.token
     } else {
       throw "Sorry, login failed. Please try again";
     }
   } catch(err) {
     return Promise.reject("Sorry, login failed. Please try again");
   }
-  return Promise.resolve(token)
+  return Promise.resolve(api_key)
 }
 
 const getUserProfile = async (token: any): Promise<any> => {
diff --git a/src/store/modules/user/UserState.ts b/src/store/modules/user/UserState.ts
index afbd45ce..09c3bb26 100644
--- a/src/store/modules/user/UserState.ts
+++ b/src/store/modules/user/UserState.ts
@@ -1,6 +1,10 @@
 export default interface UserState {
+  token: string;
+  current: object | null;
+  instanceUrl: string;
+  currentEComStore: object;
+  omsRedirectionInfo: {
+    url: string;
     token: string;
-    current: object | null;
-    instanceUrl: string;
-    currentEComStore: object;
+  }
 }
\ No newline at end of file
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 9bf3eef5..8109ebe3 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -8,6 +8,8 @@ import { translate } from '@/i18n'
 import logger from "@/logger";
 import emitter from '@/event-bus'
 import { Settings } from "luxon"
+import { useAuthStore } from '@hotwax/dxp-components'
+import { resetConfig } from '@/adapter'
 
 
 const actions: ActionTree<UserState, RootState> = {
@@ -15,30 +17,33 @@ const actions: ActionTree<UserState, RootState> = {
   /**
  * Login user and return token
  */
-  async login ({ commit }, { username, password }) {
+  async login ({ commit, dispatch }, payload) {
     try {
-      if(!username.length || !password.length) {
-        return Promise.reject('')
-      }
-
-      emitter.emit("presentLoader", { message: "Logging in...", backdropDismiss: false })
       // TODO: implement support for permission check
-      const token = await UserService.login(username, password)
 
-      const userProfile = await UserService.getUserProfile(token);
+      // TODO: oms here is of ofbiz we need to check how to get the maarg url from here as we need to hit all apis on maarg
+      const { token, oms, omsRedirectionUrl } = payload;
+      dispatch("setUserInstanceUrl", oms);
 
+      emitter.emit("presentLoader", { message: "Logging in...", backdropDismiss: false })
+      const api_key = await UserService.login(token)
+      
+      const userProfile = await UserService.getUserProfile(api_key);
+      
       // TODO: fetch only associated product stores for user, currently api does not support this
-      userProfile.stores = await UserService.getEComStores(token);
-
+      userProfile.stores = await UserService.getEComStores(api_key);
+      
       if (userProfile.timeZone) {
         Settings.defaultZone = userProfile.timeZone;
       }
 
-      commit(types.USER_TOKEN_CHANGED, { newToken: token })
+      if(omsRedirectionUrl && token) {
+        dispatch("setOmsRedirectionInfo", { url: omsRedirectionUrl, token })
+      }
+      commit(types.USER_TOKEN_CHANGED, { newToken: api_key })
       emitter.emit("dismissLoader")
       commit(types.USER_INFO_UPDATED, userProfile);
       commit(types.USER_CURRENT_ECOM_STORE_UPDATED, userProfile.stores.length ? userProfile.stores[0] : {});
-      return Promise.resolve({ token })
     } catch (err: any) {
       emitter.emit("dismissLoader")
       showToast(translate(err));
@@ -50,11 +55,24 @@ const actions: ActionTree<UserState, RootState> = {
   /**
    * Logout user
    */
-  async logout ({ commit }) {
+  async logout ({ commit, dispatch }) {
+    console.log('logout');
+    
+    emitter.emit('presentLoader', { message: 'Logging out', backdropDismiss: false })
+
+    const authStore = useAuthStore()
+
     // TODO add any other tasks if need
     commit(types.USER_END_SESSION)
     this.dispatch("rule/clearRuleState")
     this.dispatch("util/clearUtilState")
+    dispatch("setOmsRedirectionInfo", { url: "", token: "" })
+    resetConfig();
+
+    // reset plugin state on logout
+    authStore.$reset()
+
+    emitter.emit('dismissLoader')
   },
 
   
@@ -77,6 +95,10 @@ const actions: ActionTree<UserState, RootState> = {
     commit(types.USER_INSTANCE_URL_UPDATED, payload)
   },
 
+  setOmsRedirectionInfo({ commit }, payload) {
+    commit(types.USER_OMS_REDIRECTION_INFO_UPDATED, payload)
+  },
+
   setEcomStore({ commit, state }, payload) {
     let productStore = payload.productStore;
     if(!productStore) {
diff --git a/src/store/modules/user/getters.ts b/src/store/modules/user/getters.ts
index 849c7826..28d3ca92 100644
--- a/src/store/modules/user/getters.ts
+++ b/src/store/modules/user/getters.ts
@@ -4,8 +4,7 @@ import RootState from '@/store/RootState'
 
 const getters: GetterTree <UserState, RootState> = {
     getBaseUrl (state) {
-        let baseURL = process.env.VUE_APP_BASE_URL;
-        if (!baseURL) baseURL = state.instanceUrl;
+        const baseURL = state.instanceUrl;
         return baseURL.startsWith('http') ? baseURL : `https://${baseURL}.hotwax.io/rest/s1/available-to-promise/`;
     },
     isAuthenticated (state) {
@@ -21,11 +20,13 @@ const getters: GetterTree <UserState, RootState> = {
         return state.current
     },
     getInstanceUrl (state) {
-        const baseUrl = process.env.VUE_APP_BASE_URL;
-        return baseUrl ? baseUrl : state.instanceUrl;
+        return state.instanceUrl;
     },
     getCurrentEComStore(state) {
         return state.currentEComStore
     },
+    getOmsRedirectionInfo(state) {
+        return state.omsRedirectionInfo;
+    }
 }
 export default getters;
\ No newline at end of file
diff --git a/src/store/modules/user/index.ts b/src/store/modules/user/index.ts
index 1d2cbb56..17796957 100644
--- a/src/store/modules/user/index.ts
+++ b/src/store/modules/user/index.ts
@@ -11,7 +11,11 @@ const userModule: Module<UserState, RootState> = {
       token: '',
       current: {},
       instanceUrl: '',
-      currentEComStore: {}
+      currentEComStore: {},
+      omsRedirectionInfo: {
+        url: "",
+        token: ""
+      }
     },
     getters,
     actions,
diff --git a/src/store/modules/user/mutation-types.ts b/src/store/modules/user/mutation-types.ts
index e7c812f4..1558a8c9 100644
--- a/src/store/modules/user/mutation-types.ts
+++ b/src/store/modules/user/mutation-types.ts
@@ -3,4 +3,5 @@ export const USER_TOKEN_CHANGED = SN_USER + '/TOKEN_CHANGED'
 export const USER_END_SESSION = SN_USER + '/END_SESSION'
 export const USER_INFO_UPDATED = SN_USER + '/INFO_UPDATED'
 export const USER_INSTANCE_URL_UPDATED = SN_USER + '/INSTANCE_URL_UPDATED'
-export const USER_CURRENT_ECOM_STORE_UPDATED = SN_USER + '/CURRENT_ECOM_STORE_UPDATED'
\ No newline at end of file
+export const USER_CURRENT_ECOM_STORE_UPDATED = SN_USER + '/CURRENT_ECOM_STORE_UPDATED'
+export const USER_OMS_REDIRECTION_INFO_UPDATED = SN_USER + '/OMS_REDIRECTION_INFO_UPDATED'
\ No newline at end of file
diff --git a/src/store/modules/user/mutations.ts b/src/store/modules/user/mutations.ts
index 1813dcb0..b19cffc9 100644
--- a/src/store/modules/user/mutations.ts
+++ b/src/store/modules/user/mutations.ts
@@ -20,5 +20,8 @@ const mutations: MutationTree <UserState> = {
     [types.USER_CURRENT_ECOM_STORE_UPDATED] (state, payload) {
         state.currentEComStore = payload;
     },
+    [types.USER_OMS_REDIRECTION_INFO_UPDATED](state, payload) {
+    state.omsRedirectionInfo = payload;
+    }
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index a50b2c84..0596f30e 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -23,6 +23,10 @@
             </ion-card-header>
           </ion-item>
           <ion-button color="danger" @click="logout()">{{ translate("Logout") }}</ion-button>
+          <ion-button fill="outline" @click="goToLaunchpad()">
+            {{ translate("Go to Launchpad") }}
+            <ion-icon slot="end" :icon="openOutline" />
+          </ion-button>
         </ion-card>
       </div>
       <div class="section-header">
@@ -41,7 +45,7 @@
           <ion-card-content>
             {{ translate('This is the name of the OMS you are connected to right now. Make sure that you are connected to the right instance before proceeding.') }}
           </ion-card-content>
-          <ion-button @click="goToOms()" fill="clear">
+          <ion-button :disabled="!omsRedirectionInfo.token || !omsRedirectionInfo.url" @click="goToOms(omsRedirectionInfo.token, omsRedirectionInfo.url)" fill="clear">
             {{ translate('Go to OMS') }}
             <ion-icon slot="end" :icon="openOutline" />
           </ion-button>
@@ -106,17 +110,16 @@ import TimeZoneModal from '@/views/TimezoneModal.vue';
 import Image from '@/components/Image.vue'
 import { DateTime } from "luxon";
 import { translate } from '@/i18n';
-
+import { goToOms } from "@hotwax/dxp-components";
 
 const store = useStore()
-const router = useRouter()
 const appVersion = ref("")
 const appInfo = (process.env.VUE_APP_VERSION_INFO ? JSON.parse(process.env.VUE_APP_VERSION_INFO) : {}) as any
 
 const userProfile = computed(() => store.getters["user/getUserProfile"])
 const currentEComStore = computed(() => store.getters["user/getCurrentEComStore"])
-const token = computed(() => store.getters["user/getUserToken"])
 const oms = computed(() => store.getters["user/getInstanceUrl"])
+const omsRedirectionInfo = computed(() => store.getters["user/getOmsRedirectionInfo"])
 
 onMounted(() => {
   appVersion.value = appInfo.branch ? (appInfo.branch + "-" + appInfo.revision) : appInfo.tag;
@@ -140,7 +143,8 @@ async function changeTimeZone() {
 
 function logout() {
   store.dispatch("user/logout").then(() => {
-    router.push("/login");
+    const redirectUrl = window.location.origin + '/login'
+    window.location.href = `${process.env.VUE_APP_LOGIN_URL}?isLoggedOut=true&redirectUrl=${redirectUrl}`
   })
 }
 
@@ -148,9 +152,8 @@ function getDateTime(time: any) {
   return time ? DateTime.fromMillis(time).toLocaleString(DateTime.DATETIME_MED) : "";
 }
 
-function goToOms() {
-  const link = (oms.value.startsWith('http') ? oms.value.replace(/\/api\/?|\/$/, "") : `https://${oms.value}.hotwax.io`) + `/qapps?token=${token.value}`
-  window.open(link, '_blank', 'noopener, noreferrer')
+function goToLaunchpad() {
+  window.location.href = `${process.env.VUE_APP_LOGIN_URL}`
 }
 </script>
 

From d125bd66cf81a8a6d6f1e0beac7464b5c81a49bc Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Tue, 28 May 2024 15:25:47 +0530
Subject: [PATCH 245/250] Reverted: loader on logout action to avoid loader not
 disabling issue while login (#337)

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

diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 8109ebe3..853d2347 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -56,10 +56,6 @@ const actions: ActionTree<UserState, RootState> = {
    * Logout user
    */
   async logout ({ commit, dispatch }) {
-    console.log('logout');
-    
-    emitter.emit('presentLoader', { message: 'Logging out', backdropDismiss: false })
-
     const authStore = useAuthStore()
 
     // TODO add any other tasks if need
@@ -71,8 +67,6 @@ const actions: ActionTree<UserState, RootState> = {
 
     // reset plugin state on logout
     authStore.$reset()
-
-    emitter.emit('dismissLoader')
   },
 
   

From cb76baa8c3419d8467c7a361d6ee3f9cf659f636 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 29 May 2024 10:26:28 +0530
Subject: [PATCH 246/250] Improved: removed app Login page, removed unnecessary
 todo and improved indentation (#337)

---
 src/router/index.ts                 |  1 -
 src/store/modules/user/actions.ts   |  1 -
 src/store/modules/user/mutations.ts |  2 +-
 src/views/Login.vue                 | 75 -----------------------------
 4 files changed, 1 insertion(+), 78 deletions(-)
 delete mode 100644 src/views/Login.vue

diff --git a/src/router/index.ts b/src/router/index.ts
index 5b9e6b21..1daf0e5c 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -2,7 +2,6 @@ import { createRouter, createWebHistory } from '@ionic/vue-router';
 import { RouteRecordRaw } from 'vue-router';
 import Settings from "@/views/Settings.vue"
 import store from '@/store'
-import Login from '@/views/Login.vue'
 import Threshold from '@/views/Threshold.vue'
 import SafetyStock from '@/views/SafetyStock.vue'
 import StorePickup from '@/views/StorePickup.vue'
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 853d2347..54d6ce80 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -21,7 +21,6 @@ const actions: ActionTree<UserState, RootState> = {
     try {
       // TODO: implement support for permission check
 
-      // TODO: oms here is of ofbiz we need to check how to get the maarg url from here as we need to hit all apis on maarg
       const { token, oms, omsRedirectionUrl } = payload;
       dispatch("setUserInstanceUrl", oms);
 
diff --git a/src/store/modules/user/mutations.ts b/src/store/modules/user/mutations.ts
index b19cffc9..11f12a80 100644
--- a/src/store/modules/user/mutations.ts
+++ b/src/store/modules/user/mutations.ts
@@ -21,7 +21,7 @@ const mutations: MutationTree <UserState> = {
         state.currentEComStore = payload;
     },
     [types.USER_OMS_REDIRECTION_INFO_UPDATED](state, payload) {
-    state.omsRedirectionInfo = payload;
+        state.omsRedirectionInfo = payload;
     }
 }
 export default mutations;
\ No newline at end of file
diff --git a/src/views/Login.vue b/src/views/Login.vue
deleted file mode 100644
index 7902054f..00000000
--- a/src/views/Login.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<template>
-  <ion-page>
-    <ion-content>
-      <div class="flex">
-        <form class="login-container" @keyup.enter="login(form)" @submit.prevent>
-          <Logo />
-
-          <ion-item lines="full">
-            <ion-input :label="translate('OMS')" label-placement="fixed" name="instanceUrl" v-model="instanceUrl" id="instanceUrl" type="text" required />
-          </ion-item>
-          <ion-item lines="full">
-            <ion-input :label="translate('Username')" label-placement="fixed" name="username" v-model="username" id="username" type="text" required />
-          </ion-item>
-          <ion-item lines="none">
-            <ion-input :label="translate('Password')" label-placement="fixed" name="password" v-model="password" id="password" type="password" required />
-          </ion-item>
-
-          <div class="ion-padding">
-            <ion-button type="submit" color="primary" fill="outline" expand="block" @click="login(form)">{{ translate("Login") }}</ion-button>
-          </div>
-        </form>
-      </div>
-    </ion-content>
-  </ion-page>
-</template>
-
-<script setup lang="ts">
-import { 
-  IonButton,
-  IonContent,
-  IonInput,
-  IonItem,
-  IonPage
-} from "@ionic/vue";
-import { computed, onMounted, ref } from "vue";
-import { useRouter } from "vue-router";
-import store from "@/store";
-import Logo from "@/components/Logo.vue";
-import { translate } from "@/i18n"
-
-const username = ref("")
-const password = ref("")
-const instanceUrl = ref("")
-const router = useRouter();
-
-const currentInstanceUrlSaved = computed(() => store.getters["user/getInstanceUrl"])
-
-onMounted(() => {
-  instanceUrl.value = currentInstanceUrlSaved.value;
-})
-
-function login() {
-  store.dispatch("user/setUserInstanceUrl", instanceUrl.value.trim())
-  store.dispatch("user/login", { username: username.value.trim(), password: password.value }).then((data: any) => {
-    if (data.token) {
-      username.value = ""
-      password.value = ""
-      router.push("/")
-    }
-  }).catch(err => err)
-}
-</script>
-
-<style scoped>
-.login-container {
-  width: 375px;
-}
-
-.flex {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-}
-</style>

From 4d5465c56cfdcbc24ed518537d61826c86c4f1b9 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 29 May 2024 11:14:49 +0530
Subject: [PATCH 247/250] Improved: showing channel group creation error
 dynamically from server (#333)

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

diff --git a/src/components/CreateGroupModal.vue b/src/components/CreateGroupModal.vue
index eaa74ef0..b273cb77 100644
--- a/src/components/CreateGroupModal.vue
+++ b/src/components/CreateGroupModal.vue
@@ -136,9 +136,9 @@ async function createGroup() {
     await store.dispatch("channel/fetchInventoryChannels");
     await store.dispatch("util/fetchConfigFacilities");
     modalController.dismiss();
-  } catch (error) {
+  } catch (error: any) {
     logger.error(error)
-    showToast(translate("Something went wrong."))
+    showToast(error.response?.data?.errors ? error.response.data.errors : translate("Failed to create channel group."))
   }
   modalController.dismiss()
   emitter.emit("dismissLoader");

From 247dcef7dbde78d8654e2d71b6d046995f6bbd98 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 29 May 2024 11:18:37 +0530
Subject: [PATCH 248/250] Improved: added entry for firebase for atp app (#333)

---
 .firebaserc | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/.firebaserc b/.firebaserc
index 4ae76f8c..7db6a654 100644
--- a/.firebaserc
+++ b/.firebaserc
@@ -1,23 +1,23 @@
 {
   "projects": {
-    "default": "hotwax-digital-commerce",
+    "default": "hotwax-digital-commerce-uat",
     "production": "digital-commerce-71eb8"
   },
   "targets": {
     "hotwax-digital-commerce": {
       "hosting": {
         "dev": [
-          "dev-threshold-management"
+          "hotwax-atp-dev"
         ],
         "uat": [
-          "threshold-management-uat"
+          "hotwax-atp-uat"
         ]
       }
     },
     "digital-commerce-71eb8": {
       "hosting": {
         "prod": [
-          "threshold-management"
+          "hotwax-atp"
         ]
       }
     }

From 274aa6c63382dfb71939c547f5f68f2d767fec32 Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 29 May 2024 11:22:48 +0530
Subject: [PATCH 249/250] Improved: added entry in locales for the missing
 static text (#333)

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

diff --git a/src/locales/en.json b/src/locales/en.json
index 99d43ee3..359959c0 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -67,6 +67,7 @@
   "Failed": "Failed",
   "Failed to associate some facilites to group.": "Failed to associate some facilites to group.",
   "Failed to create rule.": "Failed to create rule.",
+  "Failed to create channel group.": "Failed to create channel group.",
   "Failed to disable rule group.": "Failed to disable rule group.",
   "Failed to update group.": "Failed to update group.",
   "Failed to update threshold facility.": "Failed to update threshold facility.",

From 7e2390bba808ec0337c18dcf2ff371353b7a93ce Mon Sep 17 00:00:00 2001
From: amansinghbais <singh11amanbais@gmail.com>
Date: Wed, 29 May 2024 11:31:43 +0530
Subject: [PATCH 250/250] Improved: entry for firebase configuration (#333)

---
 .firebaserc | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.firebaserc b/.firebaserc
index 7db6a654..3796fa5d 100644
--- a/.firebaserc
+++ b/.firebaserc
@@ -4,7 +4,7 @@
     "production": "digital-commerce-71eb8"
   },
   "targets": {
-    "hotwax-digital-commerce": {
+    "hotwax-digital-commerce-uat": {
       "hosting": {
         "dev": [
           "hotwax-atp-dev"