CASH-688

handle two async call simultaneous in case of single service type that cause availability indicators.

src/layouts/service-location/shop-question/shop-question.vue

@@ -225,6 +225,15 @@ export default {
 
             return index;
         },
+        async handleUpdate(selectedShopIndex = null) {
+            this.resetAnswers();
+            if (selectedShopIndex >= 3) {
+                await this.getNextShopsFromList(selectedShopIndex + 1);
+            } else {
+                await this.getNextShopsFromList();
+                await nextTick();
+            }
+        },
     },
     watch: {
         selectedAppointmentType: {
@@ -233,27 +242,16 @@ export default {
             //           nothing to do with this component. We could mitigate this by showing / hiding this component with v-if but that messes
             //           up the component initialization on page load.
             async handler() {
-                await nextTick();
-                this.resetAnswers();
-                this.getNextShopsFromList();
+                this.handleUpdate();
             },
         },
         shopProviders: {
             async handler(newValue) {
-                this.resetAnswers();
-
-                await nextTick();
                 const selectedShopIndex = this.getSelectedProviderIndex(
                     newValue,
                     this.selectedProviderNumber
                 );
-
-                if (selectedShopIndex >= 3) {
-                    await this.getNextShopsFromList(selectedShopIndex + 1);
-                } else {
-                    await this.getNextShopsFromList();
-                    await nextTick();
-                }
+                this.handleUpdate(selectedShopIndex);
             },
         },
     },