From de8f22667ec72a4808ec325b3b528ca7418b735c Mon Sep 17 00:00:00 2001
From: k2maan <ketuman333@gmail.com>
Date: Thu, 22 Dec 2022 16:40:34 +0530
Subject: [PATCH 1/5] Implemented UI and logic to show configs and stores
 (#85zrgqc2a)

---
 src/components/Menu.vue | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index d9b72095..f49ddec1 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -35,13 +35,21 @@
           <ion-note slot="end">{{ userProfile?.userTimeZone }}</ion-note>
         </ion-item>
         <ion-item lines="none">
-          <ion-select interface="popover" :value="eComStore.productStoreId" @ionChange="setEComStore($event)">
+          <ion-select v-if="userProfile?.stores.length > 2" 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-label v-else class="ion-text-wrap">
+            {{ currentEComStore.storeName }}
+          </ion-label>
         </ion-item>
         <ion-item lines="none">
-          <ion-label class="ion-text-wrap">
-            <p>{{ currentShopifyConfig.name ? currentShopifyConfig.name : currentShopifyConfig.shopifyConfigName }}</p>
+          <ion-select v-if="shopifyConfigs.length > 1 && userProfile?.stores.length <= 2" interface="popover" :value="currentShopifyConfig?.shopifyConfigId" @ionChange="('sad')">
+            <ion-select-option v-for="shopifyConfig in shopifyConfigs" :key="shopifyConfig.shopifyConfigId" :value="shopifyConfig.shopifyConfigId" >{{ shopifyConfig.name ? shopifyConfig.name : shopifyConfig.shopifyConfigName }}</ion-select-option>
+          </ion-select>
+          <ion-label v-else class="ion-text-wrap">
+           <p>
+             {{ currentShopifyConfig.name ? currentShopifyConfig.name : currentShopifyConfig.shopifyConfigName }}
+           </p> 
           </ion-label>
         </ion-item>
       </ion-toolbar>
@@ -104,7 +112,9 @@ export default defineComponent({
       eComStore: 'user/getCurrentEComStore',
       instanceUrl: 'user/getInstanceUrl',
       userProfile: 'user/getUserProfile',
-      currentShopifyConfig: 'user/getCurrentShopifyConfig'
+      currentShopifyConfig: 'user/getCurrentShopifyConfig',
+      currentEComStore: 'user/getCurrentEComStore',
+      shopifyConfigs: 'user/getShopifyConfigs',
     })
   },
   methods: {

From 6ade144718daae7b477d302398d3440ad5f55765 Mon Sep 17 00:00:00 2001
From: k2maan <ketuman333@gmail.com>
Date: Mon, 26 Dec 2022 12:16:30 +0530
Subject: [PATCH 2/5] Implemented event emitting for config and function for
 switching configs (#85zrgqc2a)

---
 src/components/Menu.vue   | 8 ++++++--
 src/views/InitialLoad.vue | 4 ++--
 src/views/Inventory.vue   | 4 ++--
 src/views/Orders.vue      | 4 ++--
 src/views/Pipeline.vue    | 4 ++--
 src/views/PreOrder.vue    | 4 ++--
 src/views/Product.vue     | 4 ++--
 7 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index f49ddec1..4137037c 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -43,7 +43,7 @@
           </ion-label>
         </ion-item>
         <ion-item lines="none">
-          <ion-select v-if="shopifyConfigs.length > 1 && userProfile?.stores.length <= 2" interface="popover" :value="currentShopifyConfig?.shopifyConfigId" @ionChange="('sad')">
+          <ion-select v-if="shopifyConfigs.length > 1 && userProfile?.stores.length <= 2" interface="popover" :value="currentShopifyConfig?.shopifyConfigId" @ionChange="setShopifyConfig($event)">
             <ion-select-option v-for="shopifyConfig in shopifyConfigs" :key="shopifyConfig.shopifyConfigId" :value="shopifyConfig.shopifyConfigId" >{{ shopifyConfig.name ? shopifyConfig.name : shopifyConfig.shopifyConfigName }}</ion-select-option>
           </ion-select>
           <ion-label v-else class="ion-text-wrap">
@@ -121,9 +121,13 @@ export default defineComponent({
     async setEComStore(event: CustomEvent) {
       if(this.userProfile) {
         await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
-        emitter.emit("productStoreChanged")
+        emitter.emit("productStoreOrConfigChanged")
       }
     },
+    async setShopifyConfig(event: CustomEvent){
+      await this.store.dispatch('user/setCurrentShopifyConfig', { 'shopifyConfigId': event.detail.value });
+      emitter.emit("productStoreOrConfigChanged")
+    },
   },
   watch:{
     $route (to) {
diff --git a/src/views/InitialLoad.vue b/src/views/InitialLoad.vue
index f14b1696..a4c42b73 100644
--- a/src/views/InitialLoad.vue
+++ b/src/views/InitialLoad.vue
@@ -117,10 +117,10 @@ export default defineComponent({
   },
   mounted() {
     this.fetchJobs();
-    emitter.on("productStoreChanged", this.fetchJobs);
+    emitter.on("productStoreOrConfigChanged", this.fetchJobs);
   },
   unmounted() {
-    emitter.off("productStoreChanged", this.fetchJobs);
+    emitter.off("productStoreOrConfigChanged", this.fetchJobs);
   },
   computed: {
     ...mapGetters({
diff --git a/src/views/Inventory.vue b/src/views/Inventory.vue
index f554f97b..0cc0d83e 100644
--- a/src/views/Inventory.vue
+++ b/src/views/Inventory.vue
@@ -182,11 +182,11 @@ export default defineComponent({
   },
   mounted () {
     this.fetchJobs();
-    emitter.on("productStoreChanged", this.fetchJobs);
+    emitter.on("productStoreOrConfigChanged", this.fetchJobs);
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
   },
   unmounted() {
-    emitter.off("productStoreChanged", this.fetchJobs);
+    emitter.off("productStoreOrConfigChanged", this.fetchJobs);
     emitter.off('viewJobConfiguration', this.viewJobConfiguration)
   },
   setup() {
diff --git a/src/views/Orders.vue b/src/views/Orders.vue
index b2403918..9b038afe 100644
--- a/src/views/Orders.vue
+++ b/src/views/Orders.vue
@@ -497,11 +497,11 @@ export default defineComponent({
   },
   mounted () {
     this.fetchJobs();
-    emitter.on("productStoreChanged", this.fetchJobs);
+    emitter.on("productStoreOrConfigChanged", this.fetchJobs);
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
   },
   unmounted() {
-    emitter.off("productStoreChanged", this.fetchJobs);
+    emitter.off("productStoreOrConfigChanged", this.fetchJobs);
     emitter.off('viewJobConfiguration', this.viewJobConfiguration)
   },
   setup() {
diff --git a/src/views/Pipeline.vue b/src/views/Pipeline.vue
index a98faf17..4cc1f268 100644
--- a/src/views/Pipeline.vue
+++ b/src/views/Pipeline.vue
@@ -589,11 +589,11 @@ export default defineComponent({
     await this.store.dispatch('job/updateCurrentJob', { job: {} });
   },
   mounted(){
-    emitter.on("productStoreChanged", this.refreshJobs);
+    emitter.on("productStoreOrConfigChanged", this.refreshJobs);
     emitter.on("pinnedJobsUpdated", (this as any).updateSelectedPinnedJob);
   },
   unmounted(){
-    emitter.off("productStoreChanged", this.refreshJobs);
+    emitter.off("productStoreOrConfigChanged", this.refreshJobs);
     emitter.off('jobUpdated', this.updateJobs);
     emitter.off("pinnedJobsUpdated", (this as any).updateSelectedPinnedJob);
   },
diff --git a/src/views/PreOrder.vue b/src/views/PreOrder.vue
index 4bfecf67..6a5ee909 100644
--- a/src/views/PreOrder.vue
+++ b/src/views/PreOrder.vue
@@ -322,12 +322,12 @@ export default defineComponent({
   },
   mounted () {
     this.fetchJobs();
-    emitter.on("productStoreChanged", this.fetchJobs);
+    emitter.on("productStoreOrConfigChanged", this.fetchJobs);
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
   },
   unmounted() {
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
-    emitter.off("productStoreChanged", this.fetchJobs);
+    emitter.off("productStoreOrConfigChanged", this.fetchJobs);
   },
   setup() {
     const store = useStore();
diff --git a/src/views/Product.vue b/src/views/Product.vue
index dbdf1e68..2fbeef5a 100644
--- a/src/views/Product.vue
+++ b/src/views/Product.vue
@@ -128,12 +128,12 @@ export default defineComponent({
   },
   mounted () {
     this.fetchJobs();
-    emitter.on("productStoreChanged", this.fetchJobs);
+    emitter.on("productStoreOrConfigChanged", this.fetchJobs);
     this.store.dispatch('webhook/fetchWebhooks')
     emitter.on('viewJobConfiguration', this.viewJobConfiguration)
   },
   unmounted() {
-    emitter.off("productStoreChanged", this.fetchJobs);
+    emitter.off("productStoreOrConfigChanged", this.fetchJobs);
     emitter.off('viewJobConfiguration', this.viewJobConfiguration)
   },
   methods: {

From 3f3d266546857283f0d72737ef9db26db4110c1c Mon Sep 17 00:00:00 2001
From: k2maan <ketuman333@gmail.com>
Date: Mon, 26 Dec 2022 16:01:20 +0530
Subject: [PATCH 3/5] Refactored UI by wrapping elements inside ion-item and 
 fixed padding issue happening on login (mounting the page) (#85zrgqc2a)

---
 src/components/Menu.vue | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 4137037c..91b8fcc0 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -34,19 +34,23 @@
           </ion-label>
           <ion-note slot="end">{{ userProfile?.userTimeZone }}</ion-note>
         </ion-item>
-        <ion-item lines="none">
-          <ion-select v-if="userProfile?.stores.length > 2" interface="popover" :value="eComStore.productStoreId" @ionChange="setEComStore($event)">
+        <ion-item v-if="userProfile?.stores.length > 2" 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-label v-else class="ion-text-wrap">
+        </ion-item>
+        <ion-item v-else lines="none">
+          <ion-label class="ion-text-wrap">
             {{ currentEComStore.storeName }}
           </ion-label>
         </ion-item>
-        <ion-item lines="none">
-          <ion-select v-if="shopifyConfigs.length > 1 && userProfile?.stores.length <= 2" interface="popover" :value="currentShopifyConfig?.shopifyConfigId" @ionChange="setShopifyConfig($event)">
+        <ion-item v-if="shopifyConfigs.length > 1 && userProfile?.stores.length < 3" lines="none">
+          <ion-select interface="popover" :value="currentShopifyConfig?.shopifyConfigId" @ionChange="setShopifyConfig($event)">
             <ion-select-option v-for="shopifyConfig in shopifyConfigs" :key="shopifyConfig.shopifyConfigId" :value="shopifyConfig.shopifyConfigId" >{{ shopifyConfig.name ? shopifyConfig.name : shopifyConfig.shopifyConfigName }}</ion-select-option>
           </ion-select>
-          <ion-label v-else class="ion-text-wrap">
+        </ion-item>
+        <ion-item v-else lines="none">
+          <ion-label class="ion-text-wrap">
            <p>
              {{ currentShopifyConfig.name ? currentShopifyConfig.name : currentShopifyConfig.shopifyConfigName }}
            </p> 

From 9ceaa1160d88b09cf87bd7e177b6d2428d5d51dd Mon Sep 17 00:00:00 2001
From: k2maan <ketuman333@gmail.com>
Date: Mon, 26 Dec 2022 18:53:24 +0530
Subject: [PATCH 4/5] Refactored code by removing the check for userProfile
 before setting the ecomstore (#85zrgqc2a)

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

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index 91b8fcc0..d69980e5 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -34,8 +34,8 @@
           </ion-label>
           <ion-note slot="end">{{ userProfile?.userTimeZone }}</ion-note>
         </ion-item>
-        <ion-item v-if="userProfile?.stores.length > 2" lines="none">
-          <ion-select  interface="popover" :value="eComStore.productStoreId" @ionChange="setEComStore($event)">
+        <ion-item v-if="userProfile?.stores?.length > 2" 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>
@@ -51,9 +51,7 @@
         </ion-item>
         <ion-item v-else lines="none">
           <ion-label class="ion-text-wrap">
-           <p>
-             {{ currentShopifyConfig.name ? currentShopifyConfig.name : currentShopifyConfig.shopifyConfigName }}
-           </p> 
+           <p>{{ currentShopifyConfig.name ? currentShopifyConfig.name : currentShopifyConfig.shopifyConfigName }}</p> 
           </ion-label>
         </ion-item>
       </ion-toolbar>
@@ -123,10 +121,8 @@ export default defineComponent({
   },
   methods: {
     async setEComStore(event: CustomEvent) {
-      if(this.userProfile) {
-        await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
-        emitter.emit("productStoreOrConfigChanged")
-      }
+      await this.store.dispatch('user/setEcomStore', { 'productStoreId': event.detail.value })
+      emitter.emit("productStoreOrConfigChanged")
     },
     async setShopifyConfig(event: CustomEvent){
       await this.store.dispatch('user/setCurrentShopifyConfig', { 'shopifyConfigId': event.detail.value });

From 446bebe00f681cd173f5493b6945696f9b92f3a6 Mon Sep 17 00:00:00 2001
From: k2maan <ketuman333@gmail.com>
Date: Wed, 28 Dec 2022 15:20:26 +0530
Subject: [PATCH 5/5] Added comments for conditons to show store and config
 options (#85zrgqc2a)

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

diff --git a/src/components/Menu.vue b/src/components/Menu.vue
index d69980e5..e50ea13b 100644
--- a/src/components/Menu.vue
+++ b/src/components/Menu.vue
@@ -34,6 +34,7 @@
           </ion-label>
           <ion-note slot="end">{{ userProfile?.userTimeZone }}</ion-note>
         </ion-item>
+        <!-- showing product stores only when there are multiple options to choose from. -->
         <ion-item v-if="userProfile?.stores?.length > 2" 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>
@@ -44,6 +45,9 @@
             {{ currentEComStore.storeName }}
           </ion-label>
         </ion-item>
+        <!-- similarly, showing shopify configs only when there are multiple options to choose from 
+        but if both product store and config have multiple options, then only option to choose
+        product store will be visible -->
         <ion-item v-if="shopifyConfigs.length > 1 && userProfile?.stores.length < 3" lines="none">
           <ion-select interface="popover" :value="currentShopifyConfig?.shopifyConfigId" @ionChange="setShopifyConfig($event)">
             <ion-select-option v-for="shopifyConfig in shopifyConfigs" :key="shopifyConfig.shopifyConfigId" :value="shopifyConfig.shopifyConfigId" >{{ shopifyConfig.name ? shopifyConfig.name : shopifyConfig.shopifyConfigName }}</ion-select-option>