@meeovi/layer-commerce 1.0.10 → 1.0.13

package/app/components/shop/checkout/cart/ProductItem.vue

@@ -0,0 +1,56 @@
+<script setup lang="ts">
+import { ref, computed, watch } from 'vue';
+import { useVendureMutation } from '../../../composables/useVendureMutation';
+import adjustOrderLineMutation from '#graphql/app/commerce/mutations/adjustOrderLine.gql';
+import removeOrderLineMutation from '#graphql/app/commerce/mutations/removeOrderLine.gql';
+
+const props = defineProps({
+  cartItem: { type: Object, required: true },
+  maxQty: { type: Number, default: 100 },
+});
+
+const { mutate: adjustOrderLine } = useVendureMutation(adjustOrderLineMutation);
+const { mutate: removeOrderLine } = useVendureMutation(removeOrderLineMutation);
+
+const quantity = ref(props.cartItem.quantity);
+const isRemovable = computed(() => true);
+const itemTotalPrice = computed(() => props.cartItem.linePriceWithTax);
+
+const updateQuantity = async (qty: number) => {
+  if (qty !== props.cartItem.quantity) {
+    await adjustOrderLine({ orderLineId: props.cartItem.id, quantity: qty });
+  }
+};
+
+const removeCartItem = async () => {
+  await removeOrderLine({ orderLineId: props.cartItem.id });
+};
+
+watch(quantity, (val) => {
+  updateQuantity(val);
+});
+</script>
+
+<template>
+  <div v-if="cartItem.productVariant" class="mr-4 h-24 w-24 shrink-0 overflow-hidden rounded-md border border-secondary-200">
+    <img :src="cartItem.productVariant.featuredAsset?.preview" :alt="cartItem.productVariant.name" class="h-full w-full object-cover object-center" />
+  </div>
+  <div class="flex flex-1 flex-col text-left">
+    <div>
+      <div class="flex flex-col lg:flex-row justify-between text-base font-medium text-secondary-900">
+        <h3 class="text-base cursor-pointer pr-2">
+          {{ cartItem.productVariant.name }}
+        </h3>
+        <span v-if="itemTotalPrice">{{ itemTotalPrice }}</span>
+      </div>
+    </div>
+    <div v-if="cartItem.productVariant.stockOnHand" class="flex flex-1 items-end justify-between text-sm">
+      <input v-model="quantity" type="number" :min="1" :max="maxQty" name="quantity" aria-label="Cart item quantity" class="w-18 mt-1 inline-block py-2 px-3 border border-secondary-300 bg-white rounded-md shadow-sm" />
+      <div class="flex">
+        <button v-if="isRemovable" type="button" class="font-medium text-dark bg-transparent" @click="removeCartItem">
+          Remove
+        </button>
+      </div>
+    </div>
+  </div>
+</template>

package/app/components/shop/checkout/cart/PromotionItem.vue

@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import { ref, computed } from 'vue';
+import { useVendureMutation } from '../../../composables/useVendureMutation';
+import adjustOrderLineMutation from '#graphql/app/commerce/mutations/adjustOrderLine.gql';
+import removeOrderLineMutation from '#graphql/app/commerce/mutations/removeOrderLine.gql';
+
+const props = defineProps({
+  cartItem: { type: Object, required: true },
+  maxQty: { type: Number, default: 100 },
+});
+
+const { mutate: adjustOrderLine } = useVendureMutation(adjustOrderLineMutation);
+const { mutate: removeOrderLine } = useVendureMutation(removeOrderLineMutation);
+
+const quantity = ref(props.cartItem.quantity);
+const isRemovable = computed(() => true); // Vendure: all lines can be removed
+const itemTotalPrice = computed(() => props.cartItem.linePriceWithTax);
+
+const updateQuantity = async (qty: number) => {
+  if (qty !== props.cartItem.quantity) {
+    await adjustOrderLine({ orderLineId: props.cartItem.id, quantity: qty });
+  }
+};
+
+const removeItem = async () => {
+  await removeOrderLine({ orderLineId: props.cartItem.id });
+};
+</script>
+<template>
+  <div class="mr-4 w-24 shrink-0 overflow-hidden">
+    <div class="w-26 i-carbon-tag text-3xl"></div>
+  </div>
+  <div class="flex flex-1 flex-col">
+    <div>
+      <div class="flex flex-col lg:flex-row justify-between text-base font-medium text-secondary-900">
+        <h3 class="text-base" data-testid="cart-promotion-name">
+          {{ cartItem.productVariant.name }}
+          <span class="bg-green-100 text-green-800 text-xs font-medium mr-2 px-2.5 py-0.5 rounded-full dark:bg-green-900 dark:text-green-300">
+            Promotion
+          </span>
+        </h3>
+        <span v-if="itemTotalPrice">{{ itemTotalPrice }}</span>
+      </div>
+    </div>
+    <div class="flex flex-1 items-end justify-end text-sm">
+      <div class="flex">
+        <button v-if="isRemovable" type="button" class="font-medium text-dark bg-transparent" @click="removeItem">
+          Remove
+        </button>
+      </div>
+    </div>
+  </div>
+</template>

package/app/composables/_types.ts

@@ -0,0 +1,18 @@
+export type Maybe<T> = T | null | undefined;
+
+// Re-export or alias common legacy names expected by the composables
+// Fallback permissive types for isolated builds
+export type SfProduct = any;
+export type Product = any;
+export type SfCart = any;
+export type Cart = any;
+
+// No direct equivalents in @meeovi/commerce yet — use permissive any types
+export type SfCustomer = any;
+export type SfAddress = any;
+export type SfProductReview = any;
+export type SfShippingMethods = any;
+export type SfAttribute = any;
+
+// Export additional useful types from the commerce package if needed
+export type Category = any;

package/app/composables/adapters/abstract/productAdapter.ts

@@ -0,0 +1,7 @@
+import { Product } from "../../domain/product"
+
+export interface ProductAdapter {
+  list(): Promise<Product[]>
+  get(id: string): Promise<Product | null>
+  search(query: string): Promise<Product[]>
+}

package/app/composables/cart/registry.ts

@@ -0,0 +1,20 @@
+import { CartProvider } from "./types"
+
+const providers: Record<string, CartProvider> = {}
+
+export function registerCartProvider(name: string, provider: CartProvider) {
+  providers[name] = provider
+}
+
+export function getCartProvider(name: string) {
+  const provider = providers[name]
+  if (!provider) throw new Error(`Cart provider "${name}" not found`)
+  return provider
+}
+
+// Runtime helper for adapter packages to register themselves when the
+// app boots. Adapter packages can import this and call it from their
+// plugin entry to wire into the commerce cart provider registry.
+export function registerCartProviderRuntime(name: string, provider: CartProvider) {
+  registerCartProvider(name, provider)
+}

package/app/composables/cart/types.ts

@@ -0,0 +1,18 @@
+export interface CartItem {
+  id: string
+  quantity: number
+  product: any
+}
+
+export interface Cart {
+  id: string
+  items: CartItem[]
+  total: number
+}
+
+export interface CartProvider {
+  getCart(): Promise<Cart>
+  addItem(productId: string, quantity?: number): Promise<Cart>
+  removeItem(productId: string): Promise<Cart>
+  clearCart(): Promise<Cart>
+}

package/app/composables/cart/useCart.ts

@@ -0,0 +1,15 @@
+import { getCartProvider } from './registry'
+import { useRuntimeConfig } from '#imports'
+
+export function useCart() {
+  const config = useRuntimeConfig()
+  const providerName = config.public.cartProvider || 'directus'
+  const provider = getCartProvider(providerName)
+
+  return {
+    getCart: provider.getCart,
+    addItem: provider.addItem,
+    removeItem: provider.removeItem,
+    clearCart: provider.clearCart
+  }
+}

package/app/composables/config.ts

@@ -0,0 +1,19 @@
+export interface CommerceConfig {
+  productProvider: string
+  cartProvider: string
+  categoryProvider: string
+}
+
+let config: CommerceConfig = {
+  productProvider: 'directus',
+  cartProvider: 'directus',
+  categoryProvider: 'directus'
+}
+
+export function setCommerceConfig(newConfig: Partial<CommerceConfig>) {
+  config = { ...config, ...newConfig }
+}
+
+export function getCommerceConfig() {
+  return config
+}

package/app/composables/defs/apiDefinitions.ts

@@ -0,0 +1,55 @@
+import type { DefineAddCustomFields, NormalizersConstraint } from "./types";
+import type { UnifiedMethods } from "../methods";
+
+export type DefineApi<TContext = Record<string, unknown>> = {
+  [TKey in keyof UnifiedMethods]: (
+    fn: (
+      context: TContext,
+      ...args: Parameters<UnifiedMethods[TKey]>
+    ) => ReturnType<UnifiedMethods[TKey]>,
+  ) => (
+    context: TContext,
+    ...args: Parameters<UnifiedMethods[TKey]>
+  ) => ReturnType<UnifiedMethods[TKey]>;
+};
+
+export function getApiDefinitions<TContext = Record<string, unknown>>(): DefineApi<TContext> {
+  return {
+    getCategories: (fn) => fn,
+    getCategory: (fn) => fn,
+    getCart: (fn) => fn,
+    addCartLineItem: (fn) => fn,
+    updateCartLineItem: (fn) => fn,
+    removeCartLineItem: (fn) => fn,
+    applyCouponToCart: (fn) => fn,
+    removeCouponFromCart: (fn) => fn,
+    setCustomerEmail: (fn) => fn,
+    setCartAddress: (fn) => fn,
+    getAvailableShippingMethods: (fn) => fn,
+    setShippingMethod: (fn) => fn,
+    registerCustomer: (fn) => fn,
+    loginCustomer: (fn) => fn,
+    getCustomer: (fn) => fn,
+    logoutCustomer: (fn) => fn,
+    updateCustomer: (fn) => fn,
+    changeCustomerPassword: (fn) => fn,
+    searchProducts: (fn) => fn,
+    getProducts: (fn) => fn,
+    getProductDetails: (fn) => fn,
+    getProductReviews: (fn) => fn,
+    createCustomerAddress: (fn) => fn,
+    getCustomerAddresses: (fn) => fn,
+    updateCustomerAddress: (fn) => fn,
+    deleteCustomerAddress: (fn) => fn,
+    getCurrencies: (fn) => fn,
+    getOrders: (fn) => fn,
+    getOrderDetails: (fn) => fn,
+    placeOrder: (fn) => fn,
+  };
+}
+
+export function defineAddCustomFieldsFactory<TNormalizers extends NormalizersConstraint>() {
+  return <TInput extends DefineAddCustomFields<TNormalizers>>(input: TInput) => {
+    return input;
+  };
+}

package/app/composables/defs/extension.feature

@@ -0,0 +1,40 @@
+Feature: Unified Extension
+
+  Scenario: Overriding normalizer
+    Given one of the normalizers is overridden
+    When extension is created
+    And the normalizer is called
+    Then the overridden normalizer should be called
+    And remaining normalizers should be unchanged
+
+  Scenario: Add custom fields array with a single element
+    Given a custom field is added to one of the normalizers
+    When extension is created
+    And the normalizer is called
+    Then the custom field should be present in the $custom object
+    And remaining normalizers should be unchanged
+
+  Scenario: Add custom fields array with multiple elements
+    Given multiple elements of the addCustomFields array override the same normalizer
+    When extension is created
+    And the normalizer is called
+    Then all custom fields should be present in the $custom object
+
+  Scenario: Nested custom fields
+    Given multiple elements of the addCustomFields array override the same normalizer
+    And custom fields are objects
+    When extension is created
+    And the normalizer is called
+    Then objects should be merged into the $custom object
+
+  Scenario: Adding the same custom fields more than once
+    Given multiple elements of the addCustomFields array add the same custom field
+    When extension is created
+    And the normalizer is called
+    Then the custom field should have value based on the last element of the addCustomFields array
+
+  Scenario: Overriding api method
+    Given one of the api methods is overridden
+    When extension is created
+    And the api method is called
+    Then the overridden api method should be called

package/app/composables/defs/extension.mocks.ts

@@ -0,0 +1,39 @@
+interface RawMoney {
+  amount: number;
+  formattedAmount: string;
+  decimalPlaces: number;
+}
+
+interface RawProduct {
+  id: string;
+  name: string;
+}
+
+type NormalizerContext = any;
+
+export const normalizers = {
+  normalizeMoney: (rawMoney: RawMoney, ctx: NormalizerContext) => ({
+    amount: rawMoney.amount,
+    currency: ctx.currency,
+  }),
+  normalizeProductCatalogItem: (rawProduct: RawProduct) => ({
+    id: rawProduct.id,
+    name: rawProduct.name,
+  }),
+};
+
+export const rawMoneyMock: RawMoney = {
+  amount: 10,
+  formattedAmount: "10.00",
+  decimalPlaces: 2,
+};
+
+export const methods = {
+  getSuccess() {
+    return Promise.resolve({ ok: true });
+  },
+};
+
+export const getAdditionalNormalizerContext = () => ({
+  sku: "123",
+});

package/app/composables/defs/extension.test.ts

@@ -0,0 +1,280 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import type { DefineStepFunction } from "jest-cucumber";
+import { defineFeature, loadFeature } from "jest-cucumber";
+import { beforeEach, expect } from "vitest";
+import { unifiedExtensionFactory } from "./extension";
+import {
+  getAdditionalNormalizerContext,
+  methods,
+  normalizers,
+  rawMoneyMock,
+} from "./extension.mocks";
+import type { DefineAddCustomFields } from "./types";
+
+const feature = loadFeature("./extension.feature", {
+  loadRelativePath: true,
+});
+
+defineFeature(feature, (test) => {
+  let overrideNormalizers: Partial<typeof normalizers>;
+  let addCustomFields: [
+    DefineAddCustomFields<typeof normalizers>,
+    ...DefineAddCustomFields<typeof normalizers>[],
+  ];
+  let overrideApiMethods: Partial<typeof methods>;
+  const createUnifiedExtension = unifiedExtensionFactory<typeof methods, typeof normalizers, any>({
+    normalizers,
+    extendApiMethods: methods,
+    getAdditionalNormalizerContext,
+  });
+  let extension: ReturnType<typeof createUnifiedExtension>;
+
+  beforeEach(() => {
+    overrideNormalizers = {};
+    addCustomFields = [{}];
+    overrideApiMethods = {};
+  });
+
+  function whenTheExtensionIsCreated(when: DefineStepFunction) {
+    when("extension is created", () => {
+      extension = createUnifiedExtension({
+        normalizers: {
+          override: overrideNormalizers,
+          addCustomFields,
+        },
+        methods: {
+          override: overrideApiMethods,
+        },
+        config: {},
+      });
+    });
+  }
+
+  test("Overriding normalizer", ({ given, when, and, then }) => {
+    let result: any;
+
+    given("one of the normalizers is overridden", () => {
+      overrideNormalizers = {
+        normalizeMoney(rawMoney) {
+          return {
+            amount: rawMoney.amount,
+            currency: "USD",
+          };
+        },
+      };
+    });
+
+    whenTheExtensionIsCreated(when);
+
+    and("the normalizer is called", () => {
+      result = extension.normalizers.normalizeMoney(rawMoneyMock, { currency: "PLN" });
+    });
+
+    then("the overridden normalizer should be called", () => {
+      expect(result).toMatchInlineSnapshot(`
+        {
+          "amount": 10,
+          "currency": "USD",
+        }
+      `);
+    });
+
+    and("remaining normalizers should be unchanged", () => {
+      expect(extension.normalizers.normalizeProductCatalogItem).toBeDefined();
+    });
+  });
+  test("Add custom fields array with a single element", ({ given, when, and, then }) => {
+    let result: any;
+
+    given("a custom field is added to one of the normalizers", () => {
+      addCustomFields = [
+        {
+          normalizeMoney: ({ formattedAmount }) => ({
+            formattedAmount,
+          }),
+        },
+      ];
+    });
+
+    whenTheExtensionIsCreated(when);
+
+    and("the normalizer is called", () => {
+      result = extension.normalizers.normalizeMoney(rawMoneyMock, { currency: "PLN" });
+    });
+
+    then("the custom field should be present in the $custom object", () => {
+      expect(result).toMatchInlineSnapshot(`
+        {
+          "$custom": {
+            "formattedAmount": "10.00",
+          },
+          "amount": 10,
+          "currency": "PLN",
+        }
+      `);
+    });
+
+    and("remaining normalizers should be unchanged", () => {
+      expect(extension.normalizers.normalizeProductCatalogItem).toBeDefined();
+    });
+  });
+  test("Add custom fields array with multiple elements", ({ given, when, and, then }) => {
+    given("multiple elements of the addCustomFields array override the same normalizer", () => {
+      addCustomFields = [
+        {
+          normalizeMoney: ({ formattedAmount }) => ({
+            formattedAmount,
+          }),
+        },
+        {
+          normalizeMoney: ({ decimalPlaces }) => ({
+            decimalPlaces,
+          }),
+        },
+      ];
+    });
+
+    whenTheExtensionIsCreated(when);
+
+    and("the normalizer is called", () => {
+      extension.normalizers.normalizeMoney(rawMoneyMock, { currency: "PLN" });
+    });
+
+    then("all custom fields should be present in the $custom object", () => {
+      expect(extension.normalizers.normalizeMoney(rawMoneyMock, { currency: "PLN" }))
+        .toMatchInlineSnapshot(`
+          {
+            "$custom": {
+              "decimalPlaces": 2,
+              "formattedAmount": "10.00",
+            },
+            "amount": 10,
+            "currency": "PLN",
+          }
+        `);
+    });
+  });
+  test("Nested custom fields", ({ given, and, when, then }) => {
+    let result: any;
+
+    given("multiple elements of the addCustomFields array override the same normalizer", () => {
+      addCustomFields = [
+        {
+          normalizeMoney: () => ({
+            nested: {
+              nested_field1: "value1",
+              nestedLvl2: {
+                nestedLvl2_field1: "value1",
+              },
+            },
+          }),
+        },
+        {
+          normalizeMoney: () => ({
+            nested: {
+              nested_field2: "value2",
+            },
+            nested2: {
+              nested2_field1: "value3",
+            },
+          }),
+        },
+      ];
+    });
+
+    and("custom fields are objects", () => {});
+
+    whenTheExtensionIsCreated(when);
+
+    and("the normalizer is called", () => {
+      result = extension.normalizers.normalizeMoney(rawMoneyMock, { currency: "PLN" });
+    });
+
+    then("objects should be merged into the $custom object", () => {
+      expect(result).toMatchInlineSnapshot(`
+        {
+          "$custom": {
+            "nested": {
+              "nestedLvl2": {
+                "nestedLvl2_field1": "value1",
+              },
+              "nested_field1": "value1",
+              "nested_field2": "value2",
+            },
+            "nested2": {
+              "nested2_field1": "value3",
+            },
+          },
+          "amount": 10,
+          "currency": "PLN",
+        }
+      `);
+    });
+  });
+
+  test("Adding the same custom fields more than once", ({ given, when, and, then }) => {
+    let result: any;
+
+    given("multiple elements of the addCustomFields array add the same custom field", () => {
+      addCustomFields = [
+        {
+          normalizeMoney: ({ formattedAmount, decimalPlaces }) => ({
+            formattedAmount,
+            decimalPlaces,
+          }),
+        },
+        {
+          normalizeMoney: () => ({
+            formattedAmount: "overridden",
+          }),
+        },
+      ];
+    });
+
+    whenTheExtensionIsCreated(when);
+
+    and("the normalizer is called", () => {
+      result = extension.normalizers.normalizeMoney(rawMoneyMock, { currency: "PLN" });
+    });
+
+    then(
+      "the custom field should have value based on the last element of the addCustomFields array",
+      () => {
+        expect(result).toMatchInlineSnapshot(`
+          {
+            "$custom": {
+              "decimalPlaces": 2,
+              "formattedAmount": "overridden",
+            },
+            "amount": 10,
+            "currency": "PLN",
+          }
+        `);
+      },
+    );
+  });
+
+  test("Overriding api method", ({ given, when, and, then }) => {
+    let result: any;
+
+    given("one of the api methods is overridden", () => {
+      overrideApiMethods = {
+        getSuccess: () => Promise.resolve({ ok: false }),
+      };
+    });
+
+    whenTheExtensionIsCreated(when);
+
+    and("the api method is called", async () => {
+      result = await extension.extendApiMethods.getSuccess();
+    });
+
+    then("the overridden api method should be called", () => {
+      expect(result).toMatchInlineSnapshot(`
+        {
+          "ok": false,
+        }
+      `);
+    });
+  });
+});