@evenicanpm/storefront-core 1.0.3 → 1.0.5

package/tsconfig.json

@@ -22,7 +22,8 @@
       "@/schemas/*": ["src/api-manager/schemas/*"],
       "@/services/*": ["src/api-manager/services/*"],
       "@/hooks/*": ["src/hooks/*"],
-      "@config": ["src/config"]
+      "@config": ["src/config"],
+      "@messages/*": ["../../../../storefront/messages/*"]
     }
   },
   "include": ["src"]

package/typedoc.js

@@ -1,5 +1,5 @@
 module.exports = {
-  entryPoints: ["./src/components/product-dimensions/components/*.tsx"],
+  entryPoints: ["./src/components-v2/**/compound/*.tsx"],
   out: "docs",
   theme: "default",
   name: "e4 ui",
@@ -7,4 +7,6 @@ module.exports = {
   mergeModulesRenameDefaults: true, // NEW option of TypeDoc added by this plugin
   mergeModulesMergeMode: "module", // NEW option of TypeDoc added by this plugin
   excludeInternal: true,
+  skipErrorChecking: true,
+  tsconfig: "docs.tsconfig.json",
 };

package/src/api-manager/lib/get-graphql-client.test.ts

@@ -1,106 +0,0 @@
-//import { describe, it, expect, vi, beforeEach } from "vitest";
-import { getServerSession } from "next-auth/next";
-import { cookies } from "next/headers";
-import getGraphQLClient from "./get-graphql-client";
-
-// TODO: FIX THESE TESTS
-//
-//const mockSetHeaders = vi.fn();
-// const mockGraphQLClientInstance = { setHeaders: mockSetHeaders };
-
-/*
-vi.mock("graphql-request", () => ({
-  GraphQLClient: vi.fn(() => mockGraphQLClientInstance),
-}));
-
-vi.mock("@/api-manager/datasources/e4/graphqlRequestSdk", () => ({
-  getSdk: vi.fn(() => "mockSDK"),
-}));
-
-vi.mock("next-auth/next", () => ({
-  getServerSession: vi.fn(),
-}));
-
-vi.mock("@a/api/auth/[...nextauth]/auth-options", () => ({
-  default: {},
-}));
-
-vi.mock("next/headers", () => ({
-  cookies: vi.fn(),
-}));
-
-describe("getGraphQLClient", () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  it("initializes GraphQL client without authentication", async () => {
-    (cookies as unknown as vi.Mock).mockReturnValue({
-      get: vi.fn().mockReturnValue(null),
-    });
-
-    const sdk = await getGraphQLClient();
-
-    expect(mockSetHeaders).toHaveBeenCalledWith({
-      "client-name": "storefront",
-      "client-version": "0.1.0",
-      "Content-Type": "application/json",
-      Accept: "application/json",
-    });
-    expect(sdk).toBe("mockSDK");
-  });
-
-  it("includes storefront session cookie if available", async () => {
-    (cookies as unknown as vi.Mock).mockReturnValue({
-      get: vi.fn().mockReturnValue({ value: "mockSessionCookie" }),
-    });
-
-    const sdk = await getGraphQLClient();
-
-    expect(mockSetHeaders).toHaveBeenCalledWith(
-      expect.objectContaining({
-        Cookie: "storefront=mockSessionCookie",
-      }),
-    );
-    expect(sdk).toBe("mockSDK");
-  });
-
-  it("includes authorization token when withAuth is true", async () => {
-    (cookies as unknown as vi.Mock).mockReturnValue({
-      get: vi.fn().mockReturnValue(null),
-    });
-
-    (getServerSession as vi.Mock).mockResolvedValue({
-      accessToken: "mockAccessToken",
-    });
-
-    const sdk = await getGraphQLClient(true);
-
-    expect(getServerSession).toHaveBeenCalled();
-    expect(mockSetHeaders).toHaveBeenCalledWith(
-      expect.objectContaining({
-        Authorization: "Bearer mockAccessToken",
-      }),
-    );
-    expect(sdk).toBe("mockSDK");
-  });
-
-  it("does not include authorization token if session is missing", async () => {
-    (cookies as unknown as vi.Mock).mockReturnValue({
-      get: vi.fn().mockReturnValue(null),
-    });
-
-    (getServerSession as vi.Mock).mockResolvedValue(null);
-
-    const sdk = await getGraphQLClient(true);
-
-    expect(getServerSession).toHaveBeenCalled();
-    expect(mockSetHeaders).not.toHaveBeenCalledWith(
-      expect.objectContaining({
-        Authorization: expect.any(String),
-      }),
-    );
-    expect(sdk).toBe("mockSDK");
-  });
-});
-*/

package/src/cms/blocks/Components/HeroCarousel/index.tsx

@@ -1,42 +0,0 @@
-// Template: Market1
-// This component works best with cutout product images
-import React from "react";
-import { Box, Container } from "@mui/material";
-
-// GLOBAL CUSTOM COMPONENTS
-import { Carousel } from "@evenicanpm/storefront-core/src/components-v2/carousel/index";
-import CarouselCard1 from "@evenicanpm/storefront-core/src/components-v2/carousel-cards/carousel-card-1/index";
-
-import { getImageUrl } from "@/cms/endpoints";
-import { HeroCarouselBlock, Slide } from "../../interfaces";
-
-export default function HeroCarousel(data: HeroCarouselBlock) {
-  return (
-    <Box sx={{ backgroundColor: "white" }}>
-      <Container className="pt-2 pb-2">
-        <Carousel slidesToShow={1} arrows={false} autoplay={true} dots>
-          {data.Slides.map((data: Slide, ind: number) => (
-            <CarouselCard1
-              key={ind}
-              title={data?.heading}
-              description={data?.description}
-              imgUrl={
-                data?.image?.formats
-                  ? getImageUrl(data?.image?.formats)
-                  : data?.image?.url
-              }
-              buttonText={data?.buttonText}
-              buttonLink={
-                data?.linkToPage?.slug
-                  ? `/pages/${data?.linkToPage?.slug}`
-                  : data?.linkToProduct?.sku
-                    ? `/product/${data?.linkToProduct?.sku}`
-                    : ""
-              }
-            />
-          ))}
-        </Carousel>
-      </Container>
-    </Box>
-  );
-}

package/src/cms/blocks/Components/ProductCarousel/index.tsx

@@ -1,82 +0,0 @@
-// Template: Market1
-import React from "react";
-
-// ICONS
-import { Light } from "../../Icons/index";
-import { Box } from "@mui/system";
-
-// GLOBAL COMPONENTS
-import { Carousel } from "@evenicanpm/storefront-core/src/components-v2/carousel/index";
-import { SectionCreator } from "@evenicanpm/storefront-core/src/components-v2/section-header/index";
-import ProductCard1Wrapper from "@evenicanpm/storefront-core/src/components-v2/product-cards/product-card-1/product-card-1-wrapper";
-
-// CMS
-import { getImageUrl } from "@/cms/endpoints";
-
-// API
-import getProductByIds from "@/services/product/queries/get-product-by-ids";
-import { getQueryClient } from "@/services/get-query-client";
-import { SimpleProduct } from "@msdyn365-commerce/retail-proxy";
-import { Product, ProductCarouselBlock } from "../../interfaces";
-
-type CombinedProduct = Product & SimpleProduct;
-
-export default async function ProductCarousel(data: ProductCarouselBlock) {
-  const queryClient = getQueryClient();
-  const e4Products = await getProductByIds.fetchData(queryClient, {
-    id: data?.products?.map((product: Product) => product.sku),
-  });
-
-  if (!(e4Products && e4Products.length)) {
-    return null;
-  }
-
-  // join data
-  const combinedData: CombinedProduct[] = data?.products
-    ?.map((product: Product) => {
-      const e4Product = e4Products?.find(
-        (e4Product: SimpleProduct) => product.sku === e4Product.ItemId,
-      );
-
-      if (!e4Product) return null;
-
-      return {
-        ...e4Product,
-        ...product,
-        id: e4Product.RecordId,
-      };
-    })
-    .filter(Boolean) as CombinedProduct[];
-
-  const responsive = [
-    { breakpoint: 3000, settings: { slidesToShow: 4 } },
-    { breakpoint: 1279, settings: { slidesToShow: 4 } },
-    { breakpoint: 959, settings: { slidesToShow: 3 } },
-    { breakpoint: 650, settings: { slidesToShow: 2 } },
-    { breakpoint: 500, settings: { slidesToShow: 1 } },
-  ];
-
-  return (
-    <>
-      <SectionCreator icon={<Light color="primary" />} title={data?.heading}>
-        <Carousel responsive={responsive} height={445} autoplay={true}>
-          {combinedData?.map((item: CombinedProduct) => (
-            <Box pb={0.6} key={item.id}>
-              <ProductCard1Wrapper
-                id={item?.RecordId}
-                slug={item?.ItemId ?? ""}
-                title={item?.Name ?? ""}
-                price={item?.Price}
-                rating={0}
-                imgUrl={getImageUrl(item?.image?.[0]?.formats ?? {})}
-                discount={0}
-                mode="PLP"
-                //uom={item?.uom?.nodes[0].id}
-              />
-            </Box>
-          ))}
-        </Carousel>
-      </SectionCreator>
-    </>
-  );
-}

package/src/cms/blocks/Components/shared/product-grid.tsx

@@ -1,48 +0,0 @@
-import React from "react";
-import Box from "@mui/material/Box";
-import Grid from "@mui/material/Grid2";
-// GLOBAL CUSTOM COMPONENTS
-import { SectionHeader } from "@evenicanpm/storefront-core/src/components-v2/section-header/index";
-import ProductCard1 from "@evenicanpm/storefront-core/src/components-v2/product-cards/product-card-1/index";
-// CUSTOM DATA MODEL
-
-interface Product {
-  id: number;
-  title: string;
-  price: number;
-  rating: number;
-  thumbnail: string;
-  discount?: number;
-  slug: string;
-  uom: string;
-}
-
-// ==============================================================
-type Props = { products: Product[]; heading: string };
-// ==============================================================
-
-export default function ProductGridList({ products, heading }: Props) {
-  return (
-    <Box flex="1 1 0">
-      <SectionHeader title={heading} seeMoreLink="#" />
-
-      <Grid container spacing={3}>
-        {products.map((item) => (
-          <Grid size={{ lg: 4, sm: 6, xs: 12 }} key={item.id}>
-            <ProductCard1
-              hoverEffect
-              id={item.id}
-              slug={item.slug}
-              title={item.title}
-              price={item.price}
-              rating={item.rating}
-              imgUrl={item.thumbnail}
-              discount={item.discount}
-              // TODO: causing ts error => uom={item.uom}
-            />
-          </Grid>
-        ))}
-      </Grid>
-    </Box>
-  );
-}

package/src/components/_components/header/components/user.test.tsx

@@ -1,200 +0,0 @@
-/*
-import { render, screen, fireEvent, waitFor } from "@testing-library/react";
-import { useSession } from "next-auth/react";
-import { NextIntlClientProvider } from "next-intl";
-import { vi } from "vitest";
-import User from "./user";
-import { msalInstance } from "@/lib/auth/msal";
-import signOut from "@/lib/auth/signout";
-
-vi.mock("@/services | update | bd/session/mutations/session-init", () => ({
-  default: () => ({ mutateAsync: vi.fn() }),
-}));
-
-const mockMutate = vi.fn().mockResolvedValue({});
-vi.mock("@/services | update | bd/user/mutations/update-user", () => ({
-  default: () => ({ mutateAsync: mockMutate }),
-}));
-
-vi.mock("@/services | update | bd/session/mutations/session-logout", () => ({
-  default: () => ({ mutateAsync: vi.fn() }),
-}));
-
-vi.mock("next/navigation", () => ({
-  useRouter: () => ({
-    push: vi.fn(),
-  }),
-  usePathname: () => "/mock-path",
-}));
-
-vi.mock("next-auth/react", () => ({
-  useSession: vi.fn(),
-  signIn: vi.fn(),
-}));
-
-vi.mock("@/lib/auth/msal", () => ({
-  msalInstance: {
-    handleRedirectPromise: vi.fn().mockResolvedValue(null),
-  },
-  initializeMsal: vi.fn().mockResolvedValue(undefined),
-}));
-
-vi.mock("@/lib/auth/signout", () => ({
-  default: vi.fn(),
-}));
-
-describe("User Component", async () => {
-  const messages = (await import("@/../messages/en-USon")).default;
-
-  it("renders login button when user is not authenticated", () => {
-    (useSession as jest.Mock).mockReturnValue({
-      data: null,
-      status: "unauthenticated",
-    });
-
-    render(
-      <NextIntlClientProvider locale="en" messages={messages}>
-        <User />
-      </NextIntlClientProvider>,
-    );
-
-    expect(screen.getByText("Login")).toBeInTheDocument();
-  });
-
-  it("renders user menu button when authenticated", async () => {
-    (useSession as jest.Mock).mockReturnValue({
-      data: {
-        user: { email: "test@example.com" },
-        accessToken: "mockAccessToken",
-      },
-      status: "authenticated",
-    });
-
-    render(
-      <NextIntlClientProvider locale="en" messages={messages}>
-        <User />
-      </NextIntlClientProvider>,
-    );
-
-    const userMenuButton = await screen.findByRole("button", {
-      name: /user menu/i,
-    });
-    expect(userMenuButton).toBeInTheDocument();
-  });
-
-  it("calls signOut when session.error is present", () => {
-    (useSession as jest.Mock).mockReturnValue({
-      data: { error: "Some auth error" },
-      status: "authenticated",
-    });
-
-    render(<User />);
-
-    expect(signOut).toHaveBeenCalled();
-  });
-
-  it("calls signOut on logout button click", async () => {
-    const mockSignOut = vi.mocked(signOut);
-
-    (useSession as jest.Mock).mockReturnValue({
-      data: { user: { email: "test@example.com" }, accessToken: "token" },
-      status: "authenticated",
-    });
-
-    render(
-      <NextIntlClientProvider locale="en" messages={messages}>
-        <User />
-      </NextIntlClientProvider>,
-    );
-
-    // Open the menu first
-    fireEvent.click(screen.getByRole("button", { name: /user menu/i }));
-
-    const logoutButton = screen.getByRole("button", { name: /logout/i });
-    expect(logoutButton).toBeInTheDocument();
-
-    fireEvent.click(logoutButton);
-    expect(mockSignOut).toHaveBeenCalled();
-  });
-
-  it("handles MSAL redirect and updates user on success", async () => {
-    (useSession as jest.Mock).mockReturnValue({
-      data: {
-        user: { email: "test@example.com" },
-        accessToken: "mockAccessToken",
-      },
-      status: "authenticated",
-    });
-
-    vi.mocked(msalInstance.handleRedirectPromise).mockResolvedValue({
-      authority: "https://login.microsoftonline.com/some_authority",
-      uniqueId: "some_unique_id",
-      tenantId: "some_tenant_id",
-      tokenType: "id_token",
-      correlationId: "some_correlation_id",
-      idToken: "some_id_token",
-      accessToken: "some_access_token",
-      fromCache: false,
-      expiresOn: new Date(Date.now() + 3600000),
-      scopes: ["some_scope"],
-      account: {
-        homeAccountId: "some_home_account_id",
-        username: "some_username",
-        localAccountId: "some_local_account_id",
-        environment: "some_environment",
-        tenantId: "some_tenant_id",
-      },
-      idTokenClaims: {
-        given_name: "John",
-        family_name: "Doe",
-      },
-    });
-
-    render(
-      <NextIntlClientProvider locale="en" messages={messages}>
-        <User />
-      </NextIntlClientProvider>,
-    );
-
-    await waitFor(() =>
-      expect(mockMutate).toHaveBeenCalledWith({
-        AccountNumber: "",
-        FirstName: "John",
-        LastName: "Doe",
-      }),
-    );
-  });
-
-  it("handles error in MSAL redirect", async () => {
-    const consoleErrorSpy = vi
-      .spyOn(console, "error")
-      .mockImplementation(vi.fn());
-
-    (useSession as jest.Mock).mockReturnValue({
-      data: {
-        user: { email: "test@example.com" },
-        accessToken: "mockAccessToken",
-      },
-      status: "authenticated",
-    });
-
-    vi.mocked(msalInstance.handleRedirectPromise).mockRejectedValue(
-      new Error("MSAL Error"),
-    );
-
-    render(
-      <NextIntlClientProvider locale="en" messages={messages}>
-        <User />
-      </NextIntlClientProvider>,
-    );
-
-    await waitFor(() =>
-      expect(consoleErrorSpy).toHaveBeenCalledWith(
-        "MSAL Redirect Handling Error:",
-        expect.any(Error),
-      ),
-    );
-
-    consoleErrorSpy.mockRestore();
-  });
-});*/

package/src/components/_components/mini-cart/__tests__/cart-item.test.tsx

@@ -1,174 +0,0 @@
-/*
-import { Cart, CartLine } from "@/schemas/cart.schema";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { fireEvent, render, screen } from "@testing-library/react";
-import { setupServer } from "msw/node";
-import React from "react";
-import cartData from "./test-cart-with-itemon";
-import { NextIntlClientProvider } from "next-intl";
-import ENUS from "../../../../../messages/en-USon";
-import fr from "../../../../../messages/fron";
-import CartItem from "../components/cart-item";
-import { vi } from "vitest";
-import { NotificationProvider } from "@/components/Notifications/notification-context";
-
-// @ts-expect-error - We don't use the dates from this json and its not worth parsin
-const cart: Cart = cartData;
-const server = setupServer();
-beforeAll(() => server.listen());
-afterEach(() => server.resetHandlers());
-afterAll(() => server.close());
-
-const queryClient = new QueryClient();
-const fn = vi.fn;
-
-const Wrapper = ({ children }: React.PropsWithChildren) => (
-  <NextIntlClientProvider locale={"en-US"} messages={ENUS}>
-    <NotificationProvider>
-      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
-    </NotificationProvider>
-  </NextIntlClientProvider>
-);
-
-const Wrapper2 = ({ children }: React.PropsWithChildren) => (
-  <NextIntlClientProvider locale={"fr"} messages={fr}>
-    <NotificationProvider>
-      <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
-    </NotificationProvider>
-  </NextIntlClientProvider>
-);
-
-describe("cart-item", () => {
-  it("Renders the name and price", () => {
-    render(
-      <Wrapper>
-        <CartItem
-          item={cart.CartLines[0]}
-          isLineUpdating={false}
-          closeDrawer={() => {
-            fn;
-          }}
-          handleCartAmountChange={(cartline: CartLine) => {
-            cartline;
-          }}
-        />
-      </Wrapper>,
-    );
-
-    expect(screen.getByText(/Leather Dress Coat/)).toBeInTheDocument();
-    expect(screen.getByText(/410.00 x 1/)).toBeInTheDocument();
-  });
-  it("Renders Cart Line Control buttons", () => {
-    render(
-      <Wrapper>
-        <CartItem
-          item={cart.CartLines[0]}
-          isLineUpdating={false}
-          closeDrawer={() => {
-            fn;
-          }}
-          handleCartAmountChange={(cartline: CartLine) => {
-            cartline;
-          }}
-        />
-      </Wrapper>,
-    );
-    expect(screen.getByTitle("Increase Quantity")).toBeInTheDocument();
-    expect(screen.getByTitle("Decrease Quantity")).toBeInTheDocument();
-    expect(screen.getByTitle("Remove Item")).toBeInTheDocument();
-  });
-  it("Translates to French", () => {
-    const testClick = vi.fn();
-    render(
-      <Wrapper2>
-        <CartItem
-          item={cart.CartLines[0]}
-          isLineUpdating={false}
-          closeDrawer={() => {
-            fn;
-          }}
-          handleCartAmountChange={testClick}
-        />
-      </Wrapper2>,
-    );
-    // screen.debug(undefined, 100000)
-    expect(screen.getByTitle("Augmenter la quantité")).toBeInTheDocument();
-    expect(screen.getByTitle("Diminuer la quantité")).toBeInTheDocument();
-    expect(screen.getByTitle("Supprimer")).toBeInTheDocument();
-  });
-  it("Hides Buttons while loading", () => {
-    render(
-      <Wrapper>
-        <CartItem
-          item={cart.CartLines[0]}
-          isLineUpdating={true}
-          closeDrawer={() => {
-            fn;
-          }}
-          handleCartAmountChange={(cartline: CartLine) => {
-            cartline;
-          }}
-        />
-      </Wrapper>,
-    );
-    expect(() => screen.getByTitle("Increase Quantity")).toThrow();
-    expect(() => screen.getByTitle("Decrease Quantity")).toThrow();
-  });
-  it("Does allow increase", () => {
-    const testClick = vi.fn();
-    render(
-      <Wrapper>
-        <CartItem
-          item={cart.CartLines[0]}
-          isLineUpdating={false}
-          closeDrawer={() => {
-            fn;
-          }}
-          handleCartAmountChange={testClick}
-        />
-      </Wrapper>,
-    );
-    // screen.debug(undefined, 100000)
-    const button = screen.getByTitle("Increase Quantity");
-    fireEvent.click(button);
-    expect(testClick).toHaveBeenCalled();
-  });
-  it("Does not allow decrease", () => {
-    const testClick = vi.fn();
-    render(
-      <Wrapper>
-        <CartItem
-          item={cart.CartLines[0]}
-          isLineUpdating={false}
-          closeDrawer={() => {
-            fn;
-          }}
-          handleCartAmountChange={testClick}
-        />
-      </Wrapper>,
-    );
-    // screen.debug(undefined, 100000)
-    const button = screen.getByTitle("Decrease Quantity");
-    fireEvent.click(button);
-    expect(testClick).not.toHaveBeenCalled();
-  });
-  it("Allows Remove", () => {
-    const testClick = vi.fn();
-    render(
-      <Wrapper>
-        <CartItem
-          item={cart.CartLines[0]}
-          isLineUpdating={false}
-          closeDrawer={() => {
-            fn;
-          }}
-          handleCartAmountChange={testClick}
-        />
-      </Wrapper>,
-    );
-    // screen.debug(undefined, 100000)
-    const button = screen.getByTitle("Remove Item");
-    fireEvent.click(button);
-    expect(testClick).toHaveBeenCalled();
-  });
-});*/