@myparcel-dev/pdk-admin 1.14.1 → 2.0.0

package/src/components/OrderBox/ShipmentOptionsBox.spec.ts

@@ -0,0 +1,109 @@
+// @vitest-environment happy-dom
+
+import {computed, defineComponent, h} from 'vue';
+import {afterEach, beforeEach, describe, expect, it, vi} from 'vitest';
+import {config, mount} from '@vue/test-utils';
+import {AdminAction, OrderMode} from '../../data';
+import {useOrderData} from '../../composables/orders/useOrderData';
+import {useOrderMode} from '../../composables/context/useOrderMode';
+import {ORDER_VIEW_IN_BACKOFFICE_ID} from '../../actions';
+import {mockOrderData} from '../../__tests__/utils/mockOrderData';
+import {getActionIds} from '../../__tests__/utils/getActionIds';
+import {doComponentTestSetup, doComponentTestTeardown} from '../../__tests__';
+import ShipmentOptionsBox from './ShipmentOptionsBox.vue';
+
+vi.mock('../../composables/context/useOrderMode', () => ({
+  useOrderMode: vi.fn(),
+}));
+
+vi.mock('../../composables/orders/useOrderData', () => ({
+  useOrderData: vi.fn(),
+}));
+
+vi.mock('../../composables/language/useLanguage', () => ({
+  useLanguage: vi.fn(() => ({
+    translate: (key: string) => key,
+  })),
+}));
+
+const mockedUseOrderMode = vi.mocked(useOrderMode);
+const mockedUseOrderData = vi.mocked(useOrderData);
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+const PdkConceptBoxWrapperStub = defineComponent({
+  name: 'PdkConceptBoxWrapper',
+  props: {actions: Array, loading: Boolean},
+  render() {
+    return h('div', this.$slots.default?.());
+  },
+});
+
+const getBoxActionIds = (wrapper: ReturnType<typeof mount>) => getActionIds(wrapper, PdkConceptBoxWrapperStub);
+
+describe('ShipmentOptionsBox', () => {
+  beforeEach(() => {
+    doComponentTestSetup();
+    config.global.stubs.PdkConceptBoxWrapper = PdkConceptBoxWrapperStub as any;
+  });
+
+  afterEach(() => {
+    doComponentTestTeardown();
+  });
+
+  it('shows update, export-to-shipments, print, and export-print in Shipments mode', () => {
+    mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.Shipments));
+    mockOrderData(mockedUseOrderData);
+    const wrapper = mount(ShipmentOptionsBox);
+    const ids = getBoxActionIds(wrapper);
+
+    expect(ids).toContain(AdminAction.OrdersUpdate);
+    expect(ids).toContain(AdminAction.OrdersExport);
+    expect(ids).toContain(AdminAction.OrdersPrint);
+    expect(ids).toContain(AdminAction.OrdersExportPrint);
+    expect(ids).not.toContain(ORDER_VIEW_IN_BACKOFFICE_ID);
+  });
+
+  it('shows update and export in OrderV1 mode (not exported)', () => {
+    mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV1));
+    mockOrderData(mockedUseOrderData);
+    const wrapper = mount(ShipmentOptionsBox);
+    const ids = getBoxActionIds(wrapper);
+
+    expect(ids).toContain(AdminAction.OrdersUpdate);
+    expect(ids).toContain(AdminAction.OrdersExport);
+    expect(ids).not.toContain(AdminAction.OrdersPrint);
+    expect(ids).not.toContain(AdminAction.OrdersExportPrint);
+  });
+
+  it('shows backoffice link in OrderV1 mode when exported', () => {
+    mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV1));
+    mockOrderData(mockedUseOrderData, {exported: true});
+    const wrapper = mount(ShipmentOptionsBox);
+    const ids = getBoxActionIds(wrapper);
+
+    expect(ids).toEqual([ORDER_VIEW_IN_BACKOFFICE_ID]);
+  });
+
+  it('shows update plus the shipment-export action set in OrderV2 mode (hybrid)', () => {
+    mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV2));
+    mockOrderData(mockedUseOrderData);
+    const wrapper = mount(ShipmentOptionsBox);
+    const ids = getBoxActionIds(wrapper);
+
+    expect(ids).toContain(AdminAction.OrdersUpdate);
+    expect(ids).toContain(AdminAction.OrdersExport);
+    expect(ids).toContain(AdminAction.OrdersPrint);
+    expect(ids).toContain(AdminAction.OrdersExportPrint);
+  });
+
+  it('does not show the V1 backoffice link in OrderV2 mode, even if order has exported flag', () => {
+    mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV2));
+    mockOrderData(mockedUseOrderData, {exported: true});
+    const wrapper = mount(ShipmentOptionsBox);
+    const ids = getBoxActionIds(wrapper);
+
+    expect(ids).not.toContain(ORDER_VIEW_IN_BACKOFFICE_ID);
+    // Hybrid actions still appear regardless of the exported flag.
+    expect(ids).toContain(AdminAction.OrdersExport);
+  });
+});

package/src/components/OrderBox/ShipmentOptionsBox.vue

@@ -23,8 +23,7 @@
 
       <PdkRow>
         <PdkCol>
-          <NotificationContainer
-            :category="NotificationCategory.Action" />
+          <NotificationContainer :category="NotificationCategory.Action" />
         </PdkCol>
       </PdkRow>
     </template>
@@ -35,40 +34,25 @@
 import {computed, toValue} from 'vue';
 import {ShipmentOptionsForm} from '../common';
 import {instantiateActions} from '../../services';
-import {AdminIcon, NotificationCategory} from '../../data';
-import {useLanguage, useOrderData, usePluginSettings} from '../../composables';
-import {
-  orderExportAction,
-  orderExportToShipmentsAction,
-  ordersExportPrintShipmentsAction,
-  ordersPrintAction,
-  ordersUpdateAction,
-  orderViewInBackofficeAction,
-} from '../../actions';
+import {AdminIcon, NotificationCategory, OrderMode} from '../../data';
+import {useLanguage, useOrderData, useOrderMode} from '../../composables';
 import {NotificationContainer} from '../../components';
+import {BOX_MODE_ACTIONS, ordersUpdateAction, orderViewInBackofficeAction} from '../../actions';
 
 const {order: data, loading} = useOrderData();
 
 const {translate} = useLanguage();
-const pluginSettings = usePluginSettings();
+const orderMode = useOrderMode();
 
-const {orderMode} = pluginSettings.order;
-
-const isExported = computed(() => pluginSettings.order.orderMode && toValue(data)?.exported);
+const isExported = computed(() => orderMode.value === OrderMode.OrderV1 && toValue(data)?.exported);
 
 const actions = computed(() => {
   if (isExported.value) {
     return instantiateActions(orderViewInBackofficeAction);
   }
 
-  return instantiateActions(
-    [
-      ordersUpdateAction,
-      ...(orderMode
-        ? [orderExportAction]
-        : [orderExportToShipmentsAction, ordersPrintAction, ordersExportPrintShipmentsAction]),
-    ],
-    {orderIds: toValue(data)?.externalIdentifier},
-  );
+  return instantiateActions([ordersUpdateAction, ...BOX_MODE_ACTIONS[orderMode.value]], {
+    orderIds: toValue(data)?.externalIdentifier,
+  });
 });
 </script>

package/src/components/OrderListItem/OrderModeOrderListItem.spec.ts

@@ -0,0 +1,125 @@
+// @vitest-environment happy-dom
+
+import {computed, defineComponent, h} from 'vue';
+import {afterEach, beforeEach, describe, expect, it, vi} from 'vitest';
+import {config, mount} from '@vue/test-utils';
+import {AdminAction, OrderMode} from '../../data';
+import {useOrderMode} from '../../composables/context/useOrderMode';
+import {useOrderData} from '../../composables/orders/useOrderData';
+import {ORDER_VIEW_IN_BACKOFFICE_ID} from '../../actions';
+import {mockOrderData} from '../../__tests__/utils/mockOrderData';
+import {doComponentTestSetup, doComponentTestTeardown} from '../../__tests__';
+import OrderModeOrderListItem from './OrderModeOrderListItem.vue';
+
+vi.mock('../../composables/orders/useOrderData', () => ({
+  useOrderData: vi.fn(),
+}));
+
+vi.mock('../../composables/context/useOrderMode', () => ({
+  useOrderMode: vi.fn(),
+}));
+
+const mockedUseOrderData = vi.mocked(useOrderData);
+const mockedUseOrderMode = vi.mocked(useOrderMode);
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+const ShipmentLabelStub = defineComponent({
+  name: 'ShipmentLabel',
+  props: {shipmentId: Number},
+  render() {
+    return h('div', {class: 'shipment-label'}, `Shipment #${this.shipmentId}`);
+  },
+});
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+const PdkLinkStub = defineComponent({
+  name: 'PdkLink',
+  props: {action: {type: Object, required: true}},
+  render() {
+    return h('a', {'data-action-id': (this.action as {id?: string})?.id}, 'PdkLink');
+  },
+});
+
+describe('OrderModeOrderListItem', () => {
+  beforeEach(() => {
+    doComponentTestSetup();
+    config.global.stubs.ShipmentLabel = ShipmentLabelStub as any;
+    config.global.stubs.PdkLink = PdkLinkStub as any;
+  });
+
+  afterEach(() => {
+    doComponentTestTeardown();
+  });
+
+  describe('OrderV1 mode', () => {
+    beforeEach(() => {
+      mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV1));
+    });
+
+    it('shows edit and export actions when the order is not exported', () => {
+      mockOrderData(mockedUseOrderData);
+      const wrapper = mount(OrderModeOrderListItem);
+      const html = wrapper.html();
+
+      expect(html).toContain(AdminAction.OrdersEdit);
+      expect(html).toContain(AdminAction.OrdersExport);
+      expect(html).not.toContain(ORDER_VIEW_IN_BACKOFFICE_ID);
+    });
+
+    it('shows only the backoffice link when the order is exported', () => {
+      mockOrderData(mockedUseOrderData, {exported: true});
+      const wrapper = mount(OrderModeOrderListItem);
+      const pdkLink = wrapper.findComponent(PdkLinkStub);
+      const html = wrapper.html();
+
+      expect(pdkLink.exists()).toBe(true);
+      expect(html).toContain(`data-action-id="${ORDER_VIEW_IN_BACKOFFICE_ID}"`);
+      expect(html).not.toContain(AdminAction.OrdersEdit);
+      expect(html).not.toContain(AdminAction.OrdersExport);
+    });
+  });
+
+  describe('OrderV2 mode', () => {
+    beforeEach(() => {
+      mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV2));
+    });
+
+    it('shows the edit action and the shipment-export action (hybrid)', () => {
+      mockOrderData(mockedUseOrderData);
+      const wrapper = mount(OrderModeOrderListItem);
+      const html = wrapper.html();
+
+      expect(html).toContain(AdminAction.OrdersEdit);
+      expect(html).toContain(AdminAction.OrdersExport);
+    });
+
+    it('does not show the V1 backoffice link, even when the order is exported', () => {
+      mockOrderData(mockedUseOrderData, {exported: true});
+      const wrapper = mount(OrderModeOrderListItem);
+      const html = wrapper.html();
+
+      expect(html).not.toContain(ORDER_VIEW_IN_BACKOFFICE_ID);
+    });
+  });
+
+  describe('structural rendering', () => {
+    beforeEach(() => {
+      mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV2));
+    });
+
+    it('shows DeliveryOptionsExcerpt when there are no shipments', () => {
+      mockOrderData(mockedUseOrderData, {shipments: []});
+      const wrapper = mount(OrderModeOrderListItem);
+
+      expect(wrapper.findComponent({name: 'DeliveryOptionsExcerpt'}).exists()).toBe(true);
+    });
+
+    it('renders a ShipmentLabel for each shipment', () => {
+      mockOrderData(mockedUseOrderData, {shipments: [{id: 1}, {id: 2}, {id: 3}]});
+      const wrapper = mount(OrderModeOrderListItem);
+      const labels = wrapper.findAllComponents(ShipmentLabelStub);
+
+      expect(labels).toHaveLength(3);
+    });
+  });
+});

package/src/components/OrderListItem/OrderModeOrderListItem.vue

@@ -7,7 +7,7 @@
     :shipment-id="shipment.id" />
 
   <PdkButtonGroup v-test="[$.type.__name, order?.externalIdentifier]">
-    <template v-if="order?.exported">
+    <template v-if="orderMode === OrderMode.OrderV1 && order?.exported">
       <PdkLink :action="showExportedOrderAction" />
     </template>
 
@@ -27,11 +27,13 @@ import {computed, toValue} from 'vue';
 import {Size} from '@myparcel-dev/pdk-common';
 import {ActionButton, DeliveryOptionsExcerpt} from '../common';
 import {instantiateAction, instantiateActions} from '../../services';
-import {useOrderData} from '../../composables';
-import {orderExportAction, ordersEditAction, orderViewInBackofficeAction} from '../../actions';
+import {useOrderData, useOrderMode} from '../../composables';
+import {OrderMode} from '../../data';
+import {LIST_ITEM_MODE_ACTIONS, orderViewInBackofficeAction} from '../../actions';
 import ShipmentLabel from './ShipmentLabel.vue';
 
 const {query, order} = useOrderData();
+const orderMode = useOrderMode();
 
 const data = computed(() => toValue(query.data));
 
@@ -39,7 +41,9 @@ const shipments = computed(() => toValue(data)?.shipments ?? []);
 
 const showExportedOrderAction = instantiateAction(orderViewInBackofficeAction);
 
-const orderActions = instantiateActions([ordersEditAction, orderExportAction], {
-  orderIds: order.value?.externalIdentifier,
-});
+const orderActions = computed(() =>
+  instantiateActions(LIST_ITEM_MODE_ACTIONS[orderMode.value], {
+    orderIds: order.value?.externalIdentifier,
+  }),
+);
 </script>

package/src/components/PluginSettings/PluginSettingsForms.vue

@@ -14,12 +14,13 @@ import {AdminContextKey} from '@myparcel-dev/pdk-common';
 import {TabNavigation} from '../common';
 import {type TabDefinition} from '../../types';
 import {createActionContext} from '../../services';
-import {createPluginSettingsTabs} from '../../forms';
+import {createPluginSettingsTabs, filterPluginSettingsView} from '../../forms';
 import {type AdminAction} from '../../data';
-import {useAdminConfig, useStoreContextQuery} from '../../composables';
+import {useAdminConfig, useOrderMode, useStoreContextQuery} from '../../composables';
 import {pluginSettingsUpdateAction} from '../../actions';
 
 const config = useAdminConfig();
+const orderMode = useOrderMode();
 
 const dynamicContextQuery = useStoreContextQuery();
 const pluginSettingsContextQuery = useStoreContextQuery(AdminContextKey.PluginSettingsView);
@@ -37,14 +38,16 @@ watch(
       return;
     }
 
-    const pluginSettingsView = toValue(pluginSettingsContextQuery.data);
+    const rawPluginSettingsView = toValue(pluginSettingsContextQuery.data);
     const dynamicContext = toValue(dynamicContextQuery.data);
 
-    if (!pluginSettingsView || !dynamicContext?.pluginSettings) {
+    if (!rawPluginSettingsView || !dynamicContext?.pluginSettings) {
       tabs.value = [];
       return;
     }
 
+    const pluginSettingsView = filterPluginSettingsView(rawPluginSettingsView, orderMode.value);
+
     tabs.value = createPluginSettingsTabs(pluginSettingsView, {
       pluginSettings: dynamicContext.pluginSettings,
       actionContext,

package/src/components/common/DeliveryOptionsExcerptCarrierName.vue

@@ -8,14 +8,14 @@
 
 <script lang="ts" setup>
 import {computed, toRefs, toValue} from 'vue';
-import {type Carrier} from '@myparcel-dev/pdk-common';
+import {type CarrierModel} from '@myparcel-dev/pdk-common';
 import {useFetchCarrier} from '../../sdk';
 import CarrierLogo from './CarrierLogo.vue';
 
-const props = defineProps<{carrier: Carrier.ModelCarrier}>();
+const props = defineProps<{carrier: CarrierModel}>();
 const propRefs = toRefs(props);
 
-const carriersQuery = useFetchCarrier(propRefs.carrier.value.name);
+const carriersQuery = useFetchCarrier(propRefs.carrier.value.carrier);
 
 const carrierData = computed(() => toValue(carriersQuery.data));
 </script>

package/src/components/modals/ShipmentOptionsModal.spec.ts

@@ -0,0 +1,79 @@
+// @vitest-environment happy-dom
+
+import {computed, defineComponent, h} from 'vue';
+import {afterEach, beforeEach, describe, expect, it, vi} from 'vitest';
+import {config, mount} from '@vue/test-utils';
+import {AdminAction, OrderMode} from '../../data';
+import {useOrderMode} from '../../composables/context/useOrderMode';
+import {getActionIds} from '../../__tests__/utils/getActionIds';
+import {doComponentTestSetup, doComponentTestTeardown} from '../../__tests__';
+import ShipmentOptionsModal from './ShipmentOptionsModal.vue';
+
+vi.mock('../../composables/context/useOrderMode', () => ({
+  useOrderMode: vi.fn(),
+}));
+
+vi.mock('../../composables/orders/useOrdersData', () => ({
+  useOrdersData: vi.fn(() => []),
+}));
+
+const mockedUseOrderMode = vi.mocked(useOrderMode);
+
+const MODAL_CLOSE_ID = 'modal_close';
+
+// eslint-disable-next-line @typescript-eslint/naming-convention
+const PdkModalStub = defineComponent({
+  name: 'PdkModal',
+  props: {actions: Array, modalKey: String, title: String},
+  render() {
+    return h('div');
+  },
+});
+
+const getModalActionIds = (wrapper: ReturnType<typeof mount>) => getActionIds(wrapper, PdkModalStub);
+
+describe('ShipmentOptionsModal', () => {
+  beforeEach(() => {
+    doComponentTestSetup();
+    config.global.stubs.PdkModal = PdkModalStub as any;
+  });
+
+  afterEach(() => {
+    doComponentTestTeardown();
+  });
+
+  it('shows close, update, export-to-shipments, and export-print in Shipments mode', () => {
+    mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.Shipments));
+    const wrapper = mount(ShipmentOptionsModal);
+    const ids = getModalActionIds(wrapper);
+
+    expect(ids).toContain(MODAL_CLOSE_ID);
+    expect(ids).toContain(AdminAction.OrdersUpdate);
+    expect(ids).toContain(AdminAction.OrdersExport);
+    expect(ids).toContain(AdminAction.OrdersExportPrint);
+  });
+
+  it('shows close, update, and export in OrderV1 mode', () => {
+    mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV1));
+    const wrapper = mount(ShipmentOptionsModal);
+    const ids = getModalActionIds(wrapper);
+
+    expect(ids).toContain(MODAL_CLOSE_ID);
+    expect(ids).toContain(AdminAction.OrdersUpdate);
+    expect(ids).toContain(AdminAction.OrdersExport);
+    expect(ids).not.toContain(AdminAction.OrdersExportPrint);
+  });
+
+  it('shows close, update, export and export-print in OrderV2 mode (hybrid)', () => {
+    mockedUseOrderMode.mockReturnValue(computed(() => OrderMode.OrderV2));
+    const wrapper = mount(ShipmentOptionsModal);
+    const ids = getModalActionIds(wrapper);
+
+    expect(ids).toContain(MODAL_CLOSE_ID);
+    expect(ids).toContain(AdminAction.OrdersUpdate);
+    expect(ids).toContain(AdminAction.OrdersExport);
+    expect(ids).toContain(AdminAction.OrdersExportPrint);
+    // Standalone print is intentionally absent from the modal in both Shipments and V2.
+    expect(ids).not.toContain(AdminAction.OrdersPrint);
+  });
+});

package/src/components/modals/ShipmentOptionsModal.vue

@@ -15,14 +15,8 @@
 import {computed, defineAsyncComponent, toValue} from 'vue';
 import {instantiateActions} from '../../services';
 import {AdminModalKey} from '../../data';
-import {useOrdersData, usePluginSettings} from '../../composables';
-import {
-  modalCloseAction,
-  orderExportAction,
-  orderExportToShipmentsAction,
-  ordersExportPrintShipmentsAction,
-  ordersUpdateAction,
-} from '../../actions';
+import {useOrderMode, useOrdersData} from '../../composables';
+import {modalCloseAction, MODAL_MODE_ACTIONS, ordersUpdateAction} from '../../actions';
 
 /**
  * Shipment options modal. Opened by clicking the "Create" button in the "Labels" column in the orders list.
@@ -31,9 +25,7 @@ import {
 // eslint-disable-next-line @typescript-eslint/naming-convention
 const ShipmentOptionsModalForm = defineAsyncComponent(() => import('./ShipmentOptionsModalForm.vue'));
 
-const pluginSettings = usePluginSettings();
-
-const {orderMode} = pluginSettings.order;
+const orderMode = useOrderMode();
 
 const ordersData = computed(() => useOrdersData());
 
@@ -42,15 +34,6 @@ const orderIds = computed(() => toValue(ordersData).map((data) => toValue(data.o
 const actions = computed(() => {
   const disabled = toValue(ordersData).some((data) => toValue(data.query.isLoading));
 
-  const actions = [
-    modalCloseAction,
-    ordersUpdateAction,
-    ...(orderMode ? [orderExportAction] : [orderExportToShipmentsAction, ordersExportPrintShipmentsAction]),
-  ];
-
-  // TODO: figure out why this throws an error in build
-  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-  // @ts-ignore
-  return instantiateActions(actions, {disabled});
+  return instantiateActions([modalCloseAction, ordersUpdateAction, ...MODAL_MODE_ACTIONS[orderMode.value]], {disabled});
 });
 </script>

package/src/composables/components/useToggleInputContext.ts

@@ -22,8 +22,8 @@ export const useToggleInputContext: UseToggleInputContext = (props, emit) => {
   });
 
   // When the model is changed manually, like from another element, the toggle is updated
-  watch(model, (model) => {
-    toggleModel.value = triStateToBoolean(model);
+  watch(model, (modelVal) => {
+    toggleModel.value = triStateToBoolean(modelVal);
   });
 
   return {

package/src/composables/components/useTriStateInputContext.ts

@@ -99,12 +99,12 @@ export const useTriStateInputContext: UseTriStateInputContext = (props, emit) =>
   });
 
   // When the model is changed manually, like from another element, the toggle is updated if inherit is disabled.
-  watch(model, (model) => {
+  watch(model, (modelVal) => {
     if (inheritModel.value) {
       return;
     }
 
-    toggleModel.value = triStateToBoolean(model);
+    toggleModel.value = triStateToBoolean(modelVal);
   });
 
   return {

package/src/composables/context/index.ts

@@ -4,4 +4,5 @@ export * from './useGlobalContext';
 export * from './useInstanceContext';
 export * from './useModalContext';
 export * from './useModalOrder';
+export * from './useOrderMode';
 export * from './usePluginSettings';

package/src/composables/context/useOrderMode.spec.ts

@@ -0,0 +1,75 @@
+import {describe, expect, it, vi} from 'vitest';
+import {OrderMode, SubscriptionFeature} from '../../data';
+import {useOrderMode} from './useOrderMode';
+import {useContext} from './useContext';
+
+vi.mock('./useContext', () => ({
+  useContext: vi.fn(),
+}));
+
+const mockedUseContext = vi.mocked(useContext);
+
+const mockAccount = (subscriptionFeatures: string[], effectiveOrderMode?: unknown) => {
+  mockedUseContext.mockReturnValue({account: {subscriptionFeatures, effectiveOrderMode}} as any);
+};
+
+describe('useOrderMode', () => {
+  it('returns OrderV2 when both ORDER_MANAGEMENT and LEGACY_ORDER_MANAGEMENT are present', () => {
+    mockAccount([SubscriptionFeature.OrderManagement, SubscriptionFeature.LegacyOrderManagement]);
+    expect(useOrderMode().value).toBe(OrderMode.OrderV2);
+  });
+
+  it('returns OrderV2 when only ORDER_MANAGEMENT is present', () => {
+    mockAccount([SubscriptionFeature.OrderManagement]);
+    expect(useOrderMode().value).toBe(OrderMode.OrderV2);
+  });
+
+  it('returns OrderV1 when only LEGACY_ORDER_MANAGEMENT is present', () => {
+    mockAccount([SubscriptionFeature.LegacyOrderManagement]);
+    expect(useOrderMode().value).toBe(OrderMode.OrderV1);
+  });
+
+  it('returns Shipments when no order management features are present', () => {
+    mockAccount([]);
+    expect(useOrderMode().value).toBe(OrderMode.Shipments);
+  });
+
+  it('returns Shipments when subscriptionFeatures contains unrelated features', () => {
+    mockAccount(['SOME_OTHER_FEATURE', 'ANOTHER_FEATURE']);
+    expect(useOrderMode().value).toBe(OrderMode.Shipments);
+  });
+
+  it('returns Shipments when subscriptionFeatures is undefined', () => {
+    mockedUseContext.mockReturnValue({account: {}} as any);
+    expect(useOrderMode().value).toBe(OrderMode.Shipments);
+  });
+
+  it('returns Shipments when account is undefined', () => {
+    mockedUseContext.mockReturnValue({} as any);
+    expect(useOrderMode().value).toBe(OrderMode.Shipments);
+  });
+
+  it('prefers a PHP-supplied effectiveOrderMode of 2 (V2) over the feature derivation', () => {
+    // Feature would resolve to Shipments here; effectiveOrderMode overrides it.
+    mockAccount([], 2);
+    expect(useOrderMode().value).toBe(OrderMode.OrderV2);
+  });
+
+  it('prefers a PHP-supplied effectiveOrderMode of 1 (V1) over the feature derivation', () => {
+    // Feature would resolve to OrderV2; effectiveOrderMode overrides to V1.
+    mockAccount([SubscriptionFeature.OrderManagement], 1);
+    expect(useOrderMode().value).toBe(OrderMode.OrderV1);
+  });
+
+  it('prefers a PHP-supplied effectiveOrderMode of 0 (Shipments) over the feature derivation', () => {
+    // Feature would resolve to OrderV2; effectiveOrderMode downgrades to Shipments
+    // (the shape INT-1590 will produce).
+    mockAccount([SubscriptionFeature.OrderManagement], 0);
+    expect(useOrderMode().value).toBe(OrderMode.Shipments);
+  });
+
+  it('falls back to feature derivation when effectiveOrderMode is not a known numeric mode', () => {
+    mockAccount([SubscriptionFeature.LegacyOrderManagement], 'unexpected-string');
+    expect(useOrderMode().value).toBe(OrderMode.OrderV1);
+  });
+});

package/src/composables/context/useOrderMode.ts

@@ -0,0 +1,26 @@
+import {type ComputedRef, computed} from 'vue';
+import {type OrderMode, orderModeFromContextValue, resolveOrderMode} from '../../data';
+import {useContext} from './useContext';
+
+/**
+ * Resolve the order mode the admin UI should adapt to.
+ *
+ * Prefers the pre-computed `effectiveOrderMode` emitted by the PDK admin context
+ * (so any business rules applied on the PHP side — e.g. INT-1590's
+ * sales-channel-conditional downgrade — naturally flow through). Falls back to
+ * resolving from the raw IAM subscription features when the context does not
+ * (yet) carry that value, which keeps older PDK versions working.
+ */
+export const useOrderMode = (): ComputedRef<OrderMode> => {
+  const context = useContext();
+
+  return computed(() => {
+    // `effectiveOrderMode` is forward-looking — the PHP context generator may not
+    // emit it yet. Cast locally rather than augmenting the generated type.
+    const effective = orderModeFromContextValue(
+      (context.account as {effectiveOrderMode?: unknown} | undefined)?.effectiveOrderMode,
+    );
+
+    return effective ?? resolveOrderMode(context.account?.subscriptionFeatures ?? []);
+  });
+};

package/src/composables/language/useLanguage.spec.ts

@@ -21,8 +21,8 @@ describe('useLanguage', () => {
   beforeAll(() => {
     mockDefaultTranslations.mockReturnValue({
       my_translation: 'My translation',
-      my_translation_with_replacement: 'My translation with replacement: {platform.backofficeUrl}',
-      translation_with_custom_replacer: '{platform.name} said {word}',
+      my_translation_with_replacement: 'My translation with replacement: {proposition.backofficeUrl}',
+      translation_with_custom_replacer: '{proposition.name} said {word}',
     });
   });