@mframework/layer-commerce 0.0.3

package/app/composables/useProductRecommended/useProductRecommended.ts

@@ -0,0 +1,43 @@
+import { toRefs } from '@vueuse/shared';
+import { computed } from 'vue';
+import type { Ref } from 'vue';
+import type { Maybe, SfProduct } from '../_types';
+import { useAsyncData, useState } from 'nuxt/app';
+import type {
+  UseProductRecommendedReturn,
+  UseProductRecommendedState,
+  FetchProductRecommended,
+} from './types';
+import { getCommerceClient } from '../../utils/client';
+import { useHandleError } from '../useHandleError';
+
+/**
+ * Composable for getting recommended products data
+ * @param {string} slug Product slug
+ */
+export const useProductRecommended: UseProductRecommendedReturn = (slug) => {
+  const state = useState<UseProductRecommendedState>(`useProductRecommended-${slug}`, () => ({
+    data: null,
+    loading: false,
+  }));
+
+  /** Function for fetching product recommended data
+   * @param {string} slug Product slug
+   * @example
+   * fetchProductRecommended('product-slug');
+   */
+  const fetchProductRecommended: FetchProductRecommended = async (slug) => {
+    state.value.loading = true;
+    const client = getCommerceClient();
+    const { data, error } = await useAsyncData(() => client.listProducts?.());
+    useHandleError(error.value);
+    state.value.data = data.value as unknown as Maybe<SfProduct[]>;
+    state.value.loading = false;
+    return computed(() => state.value.data) as unknown as Ref<Maybe<SfProduct[]>>;
+  };
+
+  return {
+    fetchProductRecommended,
+    ...toRefs(state.value),
+  };
+};

package/app/composables/useProductReviews/__tests__/productReviews.mock.ts

@@ -0,0 +1,20 @@
+import type { SfProductReview } from '../_types';
+
+export const mockProductReviews: SfProductReview[] = [
+  {
+    id: '1',
+    text: "I recently purchased a pair of sneakers and I am thoroughly impressed with their quality and comfort. The design is sleek and modern, and the shoes are available in a variety of colors to suit anyone's style preferences. The upper is made of a breathable and durable material that allows my feet to stay cool and dry during long walks or runs. The sole is also very comfortable and provides great support for my feet, making it easy for me to wear them all day without experiencing any discomfort or fatigue. Overall, I highly recommend these sneakers to anyone in the market for a comfortable and stylish shoe that can handle any activity. They are definitely worth the investment!",
+    reviewer: 'John Doe',
+    rating: 5,
+    title: 'Great product!',
+    createdAt: '2022-04-28T12:00:00.000Z',
+  },
+  {
+    id: '2',
+    text: "I recently purchased a pair of sneakers and I am thoroughly impressed with their quality and comfort. The design is sleek and modern, and the shoes are available in a variety of colors to suit anyone's style preferences. The upper is made of a breathable and durable material that allows my feet to stay cool and dry during long walks or runs. The sole is also very comfortable and provides great support for my feet, making it easy for me to wear them all day without experiencing any discomfort or fatigue. Overall, I highly recommend these sneakers to anyone in the market for a comfortable and stylish shoe that can handle any activity. They are definitely worth the investment!",
+    reviewer: 'John Doe',
+    rating: 5,
+    title: 'Great product!',
+    createdAt: '2022-03-01T09:30:00.000Z',
+  },
+];

package/app/composables/useProductReviews/__tests__/useProductReviews.spec.ts

@@ -0,0 +1,22 @@
+import { vi } from 'vitest';
+import { useProductReviews } from '~/composables/useProductReviews';
+import { mockProductReviews } from './productReviews.mock';
+
+vi.mock('@mframework/sdk', () => ({
+  sdk: {
+    commerce: {
+      getProductReviews: vi.fn(() => mockProductReviews),
+    },
+  },
+}));
+
+describe('useProductReview', () => {
+  it('should return product reviews', async () => {
+    const slug = 'athletic-mens-walking-sneakers';
+    const { data, fetchProductReviews } = useProductReviews(slug);
+
+    await fetchProductReviews(slug);
+
+    expect(data.value).toEqual(mockProductReviews);
+  });
+});

package/app/composables/useProductReviews/index.ts

@@ -0,0 +1,2 @@
+export * from './useProductReviews';
+export * from './types';

package/app/composables/useProductReviews/types.ts

@@ -0,0 +1,17 @@
+import type { Ref } from 'vue';
+import type { SfProductReview, Maybe } from '../_types';
+
+export interface UseProductReviewsState {
+  data: Maybe<SfProductReview[]>;
+  loading: boolean;
+}
+
+export type FetchProductReviews = (slug: string) => Promise<Ref<Maybe<SfProductReview[]>>>;
+
+export interface UseProductReviewsReturn {
+  data: Readonly<Ref<UseProductReviewsState['data']>>;
+  loading: Readonly<Ref<boolean>>;
+  fetchProductReviews: FetchProductReviews;
+}
+
+export type UseProductReviews = (slug: string) => UseProductReviewsReturn;

package/app/composables/useProductReviews/useProductReviews.ts

@@ -0,0 +1,46 @@
+import { toRefs } from '@vueuse/shared';
+import { computed } from 'vue';
+import type { Ref } from 'vue';
+import type { Maybe, SfProductReview } from '../_types';
+import type {
+  UseProductReviews,
+  UseProductReviewsState,
+  FetchProductReviews,
+} from './types';
+import { getCommerceClient } from '../../utils/client';
+import { useAsyncData, useState } from 'nuxt/app';
+import { useHandleError } from '../useHandleError';
+
+/**
+ * @description Composable managing product reviews data
+ * @param {string} slug Product slug
+ * @returns {@link UseProductReturn}
+ * @example
+ * const { data, loading, fetchProductReviews } = useProductReviews('product-slug');
+ */
+export const useProductReviews: UseProductReviews = (slug) => {
+  const state = useState<UseProductReviewsState>(`useProductReviews-${slug}`, () => ({
+    data: null,
+    loading: false,
+  }));
+
+  /** Function for fetching product reviews data
+   * @param {string} slug Product slug
+   * @example
+   * fetchProductReviews('product-slug');
+   */
+  const fetchProductReviews: FetchProductReviews = async (slug) => {
+    state.value.loading = true;
+    const client = getCommerceClient();
+      const { data, error } = await useAsyncData(() => client.listProductReviews?.(slug) ?? client.listReviews?.(slug));
+    useHandleError(error.value);
+    state.value.data = data.value as unknown as Maybe<SfProductReview[]>;
+    state.value.loading = false;
+    return computed(() => state.value.data) as unknown as Ref<Maybe<SfProductReview[]>>;
+  };
+
+  return {
+    fetchProductReviews,
+    ...toRefs(state.value),
+  };
+};

package/app/composables/useProducts/__tests__/useProducts.spec.ts

@@ -0,0 +1,11 @@
+import { useProducts } from '../useProducts';
+
+describe('useProducts', () => {
+  it('should return products', async () => {
+    const { fetchProducts, data } = useProducts();
+
+    await fetchProducts();
+
+    expect(data.value).not.toBeUndefined();
+  });
+});

package/app/composables/useProducts/types.ts

@@ -0,0 +1,22 @@
+import { Ref } from 'vue'
+import type { Product } from '../_types'
+import type { Maybe } from '../_types'
+
+export type GetProducts = {
+  items: Product[]
+  total?: number
+}
+
+export interface UseProductsState {
+  data: GetProducts | null
+  loading: boolean
+}
+
+export type FetchProducts = () => Promise<Ref<Maybe<GetProducts>>>
+export interface UseProducts {
+  data: Readonly<Ref<UseProductsState['data']>>
+  loading: Readonly<Ref<boolean>>
+  fetchProducts: FetchProducts
+}
+
+export type UseProductsReturn = () => UseProducts

package/app/composables/useProducts/useProducts.ts

@@ -0,0 +1,41 @@
+import { toRefs } from '@vueuse/shared';
+import { computed } from 'vue';
+import type { Ref } from 'vue';
+import { FetchProducts, UseProductsReturn, UseProductsState } from './types';
+import { getCommerceClient } from '../../utils/client';
+import { useAsyncData, useState } from 'nuxt/app';
+import { useHandleError } from '../useHandleError';
+import type { Maybe } from '../_types';
+
+/**
+ * @description Composable for managing products.
+ * @returns {@link UseProducts}
+ * @example
+ * const { data, loading, fetchProducts } = useProducts();
+ */
+export const useProducts: UseProductsReturn = () => {
+  const state = useState<UseProductsState>('products', () => ({
+    data: null,
+    loading: false,
+  }));
+
+  /**
+   * @description Function for fetching products.
+   * @example
+   * getProducts();
+   */
+  const fetchProducts: FetchProducts = async () => {
+    state.value.loading = true;
+    const client = getCommerceClient();
+    const { data, error } = await useAsyncData(() => client.listProducts?.());
+    useHandleError(error.value);
+    state.value.data = data.value as unknown as UseProductsState['data'];
+    state.value.loading = false;
+    return computed(() => state.value.data) as unknown as Ref<UseProductsState['data']>;
+  };
+
+  return {
+    fetchProducts,
+    ...toRefs(state.value),
+  };
+};

package/app/composables/useTax.ts

@@ -0,0 +1,27 @@
+import { getCommerceClient } from '../utils/client'
+
+export function useTax() {
+  const client = getCommerceClient()
+
+  async function calculateTax(quoteId: string) {
+    try {
+      // Use adapter if available
+      if (client && typeof client.calculateTax === 'function') {
+        return await client.calculateTax(quoteId)
+      }
+
+      // Fallback to Magento tax calculation
+      const url = `${process.env.COMMERCE_API_URL}${encodeURIComponent(quoteId)}`
+      const res = await fetch(url)
+      if (!res.ok) throw new Error('Tax calculation failed')
+      return res.json()
+    } catch (e) {
+      console.error('Tax calculation error', e)
+      throw e
+    }
+  }
+
+  return { calculateTax }
+}
+
+export default useTax

package/app/composables/validationRules/index.ts

@@ -0,0 +1 @@
+export * from "./password";

package/app/composables/validationRules/password.feature

@@ -0,0 +1,67 @@
+Feature: Password validation rule
+
+  Scenario Outline: New password can't be too easy (<newPassword>)
+    Given the <newPassword> as password
+    When the method is called
+    Then a false should be returned
+
+    Examples:
+
+      | newPassword         |
+      | 12345               |
+      | password            |
+      | password1           |
+      | Password1           |
+      | Password@           |
+      | Password123567890   |
+
+  Scenario Outline: New password must be complex enough (<newPassword>)
+    Given the <newPassword> as password
+    When the method is called
+    Then a true should be returned
+
+    Examples:
+
+      | newPassword         |
+      | Password1!3         |
+      | L0ngEnough$         |
+      | L0ngEnough@         |
+      | L0ngEnough#         |
+      | L0ngEnough%         |
+      | L0ngEnough^         |
+      | L0ngEnough*         |
+      | L0ngEnough(         |
+      | L0ngEnough)         |
+      | L0ngEnough:         |
+      | L0ngEnough;         |
+      | L0ngEnough,         |
+      | L0ngEnough.         |
+
+  Scenario Outline: New password can't have some special signs (<newPassword>)
+    Given the <newPassword> as password
+    When the method is called
+    Then a false should be returned
+
+    Examples:
+
+      | newPassword         |
+      | L0ngEnough&         |
+      | L0ngEnough[         |
+      | L0ngEnough]         |
+      | L0ngEnough"         |
+      | L0ngEnough'         |
+      | L0ngEnough/         |
+      | L0ngEnough>         |
+      | L0ngEnough<         |
+
+  Scenario: New password match with confirmation
+    Given the password is "Password1!"
+    And the confirmation is "Password1!"
+    When the method is called
+    Then a true should be returned
+
+  Scenario: New password mismatch with confirmation
+    Given the password is "Password1!"
+    And the confirmation is "Password1"
+    When the method is called
+    Then a false should be returned

package/app/composables/validationRules/password.test.ts

@@ -0,0 +1,89 @@
+import { expect } from "vitest";
+import type { DefineStepFunction } from "jest-cucumber";
+import { defineFeature, loadFeature } from "jest-cucumber";
+import { validatePassword } from "./password";
+
+const feature = loadFeature("./password.feature", { loadRelativePath: true });
+
+defineFeature(feature, (test) => {
+  let password: string;
+  let confirmation: string;
+  let output: boolean;
+
+  function whenTheMethodIsCalled(when: DefineStepFunction) {
+    when("the method is called", () => {
+      output = validatePassword(password, confirmation);
+    });
+  }
+
+  test("New password can't be too easy (<newPassword>)", ({ given, when, then }) => {
+    given(/^the (.*) as password$/, (givenPassword) => {
+      password = givenPassword;
+      confirmation = givenPassword;
+    });
+
+    whenTheMethodIsCalled(when);
+
+    then("a false should be returned", () => {
+      expect(output).toBe(false);
+    });
+  });
+
+  test("New password must be complex enough (<newPassword>)", ({ given, when, then }) => {
+    given(/^the (.*) as password$/, (givenPassword) => {
+      password = givenPassword;
+      confirmation = givenPassword;
+    });
+
+    whenTheMethodIsCalled(when);
+
+    then("a true should be returned", () => {
+      expect(output).toBe(true);
+    });
+  });
+
+  test("New password can't have some special signs (<newPassword>)", ({ given, when, then }) => {
+    given(/^the (.*) as password$/, (givenPassword) => {
+      password = givenPassword;
+      confirmation = givenPassword;
+    });
+
+    whenTheMethodIsCalled(when);
+
+    then("a false should be returned", () => {
+      expect(output).toBe(false);
+    });
+  });
+
+  test("New password match with confirmation", ({ given, and, when, then }) => {
+    given(/^the password is (.*)$/, (givenPassword) => {
+      password = givenPassword;
+    });
+
+    and(/^the confirmation is (.*)$/, (givenConfirmation) => {
+      confirmation = givenConfirmation;
+    });
+
+    whenTheMethodIsCalled(when);
+
+    then("a true should be returned", () => {
+      expect(output).toBe(true);
+    });
+  });
+
+  test("New password mismatch with confirmation", ({ given, and, when, then }) => {
+    given(/^the password is (.*)$/, (givenPassword) => {
+      password = givenPassword;
+    });
+
+    and(/^the confirmation is (.*)$/, (givenConfirmation) => {
+      confirmation = givenConfirmation;
+    });
+
+    whenTheMethodIsCalled(when);
+
+    then("a false should be returned", () => {
+      expect(output).toBe(false);
+    });
+  });
+});

package/app/composables/validationRules/password.ts

@@ -0,0 +1,25 @@
+/* eslint-disable sonarjs/prefer-single-boolean-return */
+/* eslint-disable max-statements */
+export function validatePassword(firstInput: string, confirmationInput: string): boolean {
+  if (firstInput !== confirmationInput) {
+    return false;
+  }
+
+  if (firstInput.length < 8) {
+    return false;
+  }
+
+  if (/[A-Z]+/.test(firstInput) === false) {
+    return false;
+  }
+
+  if (/\d+/.test(firstInput) === false) {
+    return false;
+  }
+
+  if (/[!#$%()*,.:;@^]+/.test(firstInput) === false) {
+    return false;
+  }
+
+  return true;
+}