fix(admin): fix shipment options modals not changing context

apps/admin/src/components/OrderBox/ShipmentOptionsBox.vue

@@ -15,7 +15,9 @@
             {{ translate('notification_order_exported') }}
           </template>
 
-          <ShipmentOptionsForm v-else />
+          <ShipmentOptionsForm
+            v-else
+            :order="data?.externalIdentifier" />
         </PdkCol>
       </PdkRow>
     </template>

apps/admin/src/components/common/ShipmentOptionsForm.vue

@@ -5,12 +5,18 @@
 </template>
 
 <script lang="ts" setup>
+import {computed} from 'vue';
 import {get, isDef} from '@vueuse/core';
 import {MagicForm} from '@myparcel/vue-form-builder';
+import {type OneOrMore} from '@myparcel/ts-utils';
 import {createShipmentOptionsForm} from '../../forms';
 import {useOrdersData} from '../../composables';
 
-const queries = useOrdersData();
+const props = defineProps<{order: OneOrMore<string>}>();
 
-const shipmentOptionsForm = createShipmentOptionsForm(queries.map((data) => get(data.order)).filter(isDef));
+const shipmentOptionsForm = computed(() => {
+  const queries = useOrdersData(props.order);
+
+  return createShipmentOptionsForm(queries.map((data) => get(data.order)).filter(isDef));
+});
 </script>

apps/admin/src/components/modals/ShipmentOptionsModal.vue

@@ -4,15 +4,17 @@
     :actions="actions"
     :modal-key="AdminModalKey.ShipmentOptions"
     title="shipment_options_title">
-    <ShipmentOptionsModalForm />
+    <component
+      :is="ShipmentOptionsModalForm"
+      :key="JSON.stringify(orderIds)"
+      v-bind="{order: orderIds}" />
   </PdkModal>
 </template>
 
 <script lang="ts" setup>
 import {computed, defineAsyncComponent} from 'vue';
 import {get} from '@vueuse/core';
 import {AdminModalKey} from '../../types';
-import {useQueryStore} from '../../stores';
 import {instantiateActions} from '../../services';
 import {useOrdersData, usePluginSettings} from '../../composables';
 import {
@@ -31,16 +33,15 @@ import {
 const ShipmentOptionsModalForm = defineAsyncComponent(() => import('./ShipmentOptionsModalForm.vue'));
 
 const pluginSettings = usePluginSettings();
-const queryStore = useQueryStore();
 
 const {orderMode} = pluginSettings.order;
 
-queryStore.registerOrderQueries();
+const ordersData = computed(() => useOrdersData());
 
-const ordersData = useOrdersData();
+const orderIds = computed(() => get(ordersData).map((data) => get(data.order)?.externalIdentifier));
 
 const actions = computed(() => {
-  const disabled = ordersData.some((data) => get(data.query.isLoading));
+  const disabled = get(ordersData).some((data) => get(data.query.isLoading));
 
   const actions = [
     modalCloseAction,

apps/admin/src/components/modals/ShipmentOptionsModalForm.vue

@@ -1,12 +1,22 @@
 <template>
   <ShipmentOptionsForm
-    v-if="queries.some((data) => data.order)"
-    v-test="$.type.__name" />
+    v-if="orderIds.length"
+    v-test="$.type.__name"
+    :order="orderIds" />
 </template>
 
 <script setup lang="ts">
+import {computed} from 'vue';
+import {get} from '@vueuse/core';
+import {type OneOrMore} from '@myparcel/ts-utils';
 import ShipmentOptionsForm from '../common/ShipmentOptionsForm.vue';
 import {useOrdersData} from '../../composables';
 
-const queries = useOrdersData();
+const props = defineProps<{order: OneOrMore<string>}>();
+
+const orderIds = computed(() => {
+  return useOrdersData(props.order)
+    .filter((data) => get(data.order))
+    .map((data) => get(data.order)?.externalIdentifier);
+});
 </script>