@evenicanpm/storefront-core 2.0.0 → 2.1.0

package/src/components/product-quantity-buttons/__tests__/product-quantity-buttons.test.tsx

@@ -1,6 +1,7 @@
+import type { CartLine } from "@evenicanpm/storefront-core/src/api-manager/schemas/cart.schema";
 import { render } from "@testing-library/react";
 import type { ReactNode } from "react";
-import { vi } from "vitest";
+import { describe, expect, it, vi } from "vitest";
 import ProductQuantityButtons from "../index";
 
 vi.mock("next-intl", () => ({
@@ -12,7 +13,7 @@ vi.mock("@evenicanpm/storefront-core/src/hooks/use-cart", () => ({
 		handleAddToCart: vi.fn(),
 		handleCartAmountChange: vi.fn(),
 		loading: false,
-		currentCartLine: { Quantity: 1 } as any,
+		currentCartLine: { Quantity: 1 } as CartLine | undefined,
 	})),
 }));
 

package/src/components/product-quantity-buttons/compound/quantity-buttons-root.tsx

@@ -9,7 +9,7 @@ import type { CartLine } from "@msdyn365-commerce/retail-proxy";
 import Button from "@mui/material/Button";
 import CircularProgress from "@mui/material/CircularProgress";
 import { useTranslations } from "next-intl";
-import React, { createContext, type ReactNode, useContext } from "react";
+import { createContext, type ReactNode, useContext } from "react";
 import { MdAdd as Add, MdRemove as Remove } from "react-icons/md";
 // TODO: Encapsulate the addToCart api calls inside this component
 // so no need to pass in props.

package/src/components/product-quantity-buttons/index.tsx

@@ -7,7 +7,6 @@ import {
 	type QuantityButtonProps,
 	QuantityButtons,
 } from "@evenicanpm/storefront-core/src/components/product-quantity-buttons/compound/quantity-buttons-root";
-import React from "react";
 
 /**
  * Pre-composed version of quantity buttons.

package/src/components/product-quantity-variants/ProductQuantity.stories.tsx

@@ -1,7 +1,6 @@
 // Replace your-framework with the framework you are using, e.g. react-vite, nextjs, nextjs-vite, etc.
 
-import type { Meta, StoryObj } from "@storybook/react";
-import React from "react";
+import type { Meta } from "@storybook/react";
 import { product } from "../../../__mocks__/product-dimensions";
 import QuantityButtons from "./index";
 
@@ -12,7 +11,6 @@ const meta = {
 } satisfies Meta<typeof QuantityButtons>;
 
 export default meta;
-type Story = StoryObj<typeof meta>;
 
 export const Interactive = () => {
 	return <QuantityButtons product={product} />;

package/src/components/products-view/ProductsGrid.stories.tsx

@@ -1,7 +1,6 @@
 // Replace your-framework with the framework you are using, e.g. react-vite, nextjs, nextjs-vite, etc.
 
-import type { Meta, StoryObj } from "@storybook/react";
-import React from "react";
+import type { Meta } from "@storybook/react";
 import { data, prices } from "../../../__mocks__/products";
 import { ProductsGrid } from "./index";
 
@@ -12,7 +11,6 @@ const meta = {
 } satisfies Meta<typeof ProductsGrid>;
 
 export default meta;
-type Story = StoryObj<typeof meta>;
 
 export const Interactive = () => {
 	return <ProductsGrid products={data.products} productPrices={prices} />;

package/src/components/products-view/ProductsList.stories.tsx

@@ -1,7 +1,6 @@
 // Replace your-framework with the framework you are using, e.g. react-vite, nextjs, nextjs-vite, etc.
 
-import type { Meta, StoryObj } from "@storybook/react";
-import React from "react";
+import type { Meta } from "@storybook/react";
 import { data, prices } from "../../../__mocks__/products";
 import { ProductsList } from "./index";
 
@@ -12,7 +11,6 @@ const meta = {
 } satisfies Meta<typeof ProductsList>;
 
 export default meta;
-type Story = StoryObj<typeof meta>;
 
 export const Interactive = () => {
 	return <ProductsList products={data.products} productPrices={prices} />;

package/src/components/products-view/__tests__/products-view.test.tsx

@@ -1,7 +1,14 @@
 import type { ProductSearchResult as Product } from "@msdyn365-commerce/retail-proxy";
 import { render } from "@testing-library/react";
+import type { ReactNode } from "react";
 import { vi } from "vitest";
-import { ProductsGrid, ProductsList } from "../index";
+import {
+	ProductsGrid,
+	ProductsList,
+	type Props as ProductsViewProps,
+} from "../index";
+
+type MockChildrenProps = { children?: ReactNode };
 
 vi.mock("next-intl", () => ({
 	useTranslations: () => (key: string) => key,
@@ -19,11 +26,11 @@ vi.mock(
 	"@evenicanpm/storefront-core/src/components/products-view/compound/products-grid-view",
 	() => ({
 		default: Object.assign(
-			({ children }: any) => (
+			({ children }: MockChildrenProps) => (
 				<div data-testid="products-grid-view">{children}</div>
 			),
 			{
-				Grid: ({ children }: any) => (
+				Grid: ({ children }: MockChildrenProps) => (
 					<div data-testid="products-grid">{children}</div>
 				),
 				Card: () => <div data-testid="product-card">Card</div>,
@@ -36,11 +43,11 @@ vi.mock(
 	"@evenicanpm/storefront-core/src/components/products-view/compound/products-list-view",
 	() => ({
 		default: Object.assign(
-			({ children }: any) => (
+			({ children }: MockChildrenProps) => (
 				<div data-testid="products-list-view">{children}</div>
 			),
 			{
-				List: ({ children }: any) => (
+				List: ({ children }: MockChildrenProps) => (
 					<div data-testid="products-list">{children}</div>
 				),
 				Card: () => <div data-testid="product-card">Card</div>,
@@ -80,9 +87,11 @@ describe("ProductsView components", () => {
 		});
 
 		it("renders with product prices", () => {
-			const prices = [{ price: 100, adjustedPrice: 80, productId: 1 }];
+			const prices = [
+				{ price: 100, adjustedPrice: 80, productId: 1 },
+			] as NonNullable<ProductsViewProps["productPrices"]>;
 			const { container } = render(
-				<ProductsGrid products={mockProducts} productPrices={prices as any} />,
+				<ProductsGrid products={mockProducts} productPrices={prices} />,
 			);
 			expect(
 				container.querySelector("[data-testid='products-grid-view']"),
@@ -126,9 +135,11 @@ describe("ProductsView components", () => {
 		});
 
 		it("renders with product prices", () => {
-			const prices = [{ price: 100, adjustedPrice: 80, productId: 1 }];
+			const prices = [
+				{ price: 100, adjustedPrice: 80, productId: 1 },
+			] as NonNullable<ProductsViewProps["productPrices"]>;
 			const { container } = render(
-				<ProductsList products={mockProducts} productPrices={prices as any} />,
+				<ProductsList products={mockProducts} productPrices={prices} />,
 			);
 			expect(
 				container.querySelector("[data-testid='products-list-view']"),

package/src/components/products-view/index.tsx

@@ -3,7 +3,7 @@ import ProductsGridView from "@evenicanpm/storefront-core/src/components/product
 import ProductsListView from "@evenicanpm/storefront-core/src/components/products-view/compound/products-list-view";
 // DATA MODEL
 import type { ProductSearchResult as Product } from "@msdyn365-commerce/retail-proxy";
-import React, { type ReactNode } from "react";
+import type { ReactNode } from "react";
 
 export interface Props {
 	/** List of products to display */

package/src/components/scrollbar/Scrollbar.stories.tsx

@@ -1,7 +1,6 @@
 // Replace your-framework with the framework you are using, e.g. react-vite, nextjs, nextjs-vite, etc.
 
-import type { Meta, StoryObj } from "@storybook/react";
-import React from "react";
+import type { Meta } from "@storybook/react";
 import Scrollbar from "./index";
 
 const meta = {
@@ -11,7 +10,6 @@ const meta = {
 } satisfies Meta<typeof Scrollbar>;
 
 export default meta;
-type Story = StoryObj<typeof meta>;
 
 export const WithLink = () => (
 	<div style={{ height: "500px" }}>

package/src/components/scrollbar/__tests__/scrollbar.test.tsx

@@ -1,9 +1,15 @@
 import { render, screen } from "@testing-library/react";
+import type { HTMLAttributes, ReactNode } from "react";
 import { vi } from "vitest";
 import Scrollbar from "../scrollbar";
 
+type SimplebarMockProps = HTMLAttributes<HTMLDivElement> & {
+	children?: ReactNode;
+	autoHide?: boolean;
+};
+
 vi.mock("simplebar-react", () => ({
-	default: ({ children, autoHide, ...props }: any) => (
+	default: ({ children, autoHide, ...props }: SimplebarMockProps) => (
 		<div data-testid="custom-scrollbar" data-autohide={autoHide} {...props}>
 			{children}
 		</div>

package/src/components/search-bar/SearchBarLarge.stories.tsx

@@ -1,7 +1,6 @@
 // Replace your-framework with the framework you are using, e.g. react-vite, nextjs, nextjs-vite, etc.
 
-import type { Meta, StoryObj } from "@storybook/react";
-import React from "react";
+import type { Meta } from "@storybook/react";
 import { SearchBarViewLg } from "./index";
 
 const meta = {
@@ -12,6 +11,5 @@ const meta = {
 } satisfies Meta<typeof SearchBarViewLg>;
 
 export default meta;
-type Story = StoryObj<typeof meta>;
 
 export const WithLink = () => <SearchBarViewLg></SearchBarViewLg>;

package/src/components/search-bar/compound/results-item-lg.tsx

@@ -8,7 +8,6 @@ import {
 	useSearchResultItem,
 } from "@evenicanpm/storefront-core/src/components/search-bar/compound/context";
 import Grid from "@mui/material/Grid";
-import React from "react";
 
 /**
  * Large, vertical result item card, used for desktop view.

package/src/components/search-bar/compound/results-item-sm.tsx

@@ -16,7 +16,6 @@ import { getProductDetailUrl } from "@evenicanpm/storefront-core/src/lib/build-p
 import { currency } from "@evenicanpm/storefront-core/src/lib/lib";
 import { Box, Grid } from "@mui/material";
 import MenuItem from "@mui/material/MenuItem";
-import React from "react";
 
 /**
  * Small, horizontal result item card, used for mobile view.

package/src/components/search-bar/compound/textfield-adornment-category.tsx

@@ -10,7 +10,6 @@ import TouchRipple from "@mui/material/ButtonBase";
 import MenuItem from "@mui/material/MenuItem";
 import useTheme from "@mui/material/styles/useTheme";
 import { useTranslations } from "next-intl";
-import React from "react";
 import { MdKeyboardArrowDown as KeyboardArrowDownOutlined } from "react-icons/md";
 
 type DisplayCategory = {

package/src/components/search-bar/compound/textfield.tsx

@@ -10,7 +10,6 @@ import { INPUT_SX } from "@evenicanpm/storefront-core/src/components/search-bar/
 import { useMediaQuery, useTheme } from "@mui/material";
 import TextField from "@mui/material/TextField";
 import { useTranslations } from "next-intl";
-import React from "react";
 
 /**
  * The actual input field for the search bar.

package/src/components/search-bar/utils/findCategoryNameById.ts

@@ -5,9 +5,9 @@ import type { Category } from "@msdyn365-commerce/retail-proxy";
  */
 export const findCategoryNameById = (
 	searchCategory: number,
-	categories: any,
-	t: Function,
-) => {
+	categories: Category[] | undefined,
+	t: (key: string) => string,
+): string => {
 	if (searchCategory === 0) {
 		return t("Navigation.allCategoriesLabel");
 	}

package/src/components/section/__tests__/section.test.tsx

@@ -1,5 +1,6 @@
 import { render, screen } from "@testing-library/react";
-import { vi } from "vitest";
+import type { ReactNode } from "react";
+import { describe, expect, it, vi } from "vitest";
 import { Section } from "../compound/section";
 
 vi.mock("next-intl", () => ({
@@ -14,7 +15,13 @@ vi.mock(
 );
 
 vi.mock("@mui/material/Container", () => ({
-	default: ({ className, children }: any) => (
+	default: ({
+		className,
+		children,
+	}: {
+		className?: string;
+		children?: ReactNode;
+	}) => (
 		<div data-testid="mui-container" className={className}>
 			{children}
 		</div>
@@ -28,7 +35,7 @@ describe("Section", () => {
 				<div>Section Content</div>
 			</Section>,
 		);
-		expect(screen.getByText("Section Content")).toBeInTheDocument();
+		expect(screen.getByText("Section Content")).toBeTruthy();
 	});
 
 	it("renders with Container component", () => {
@@ -69,7 +76,7 @@ describe("Section", () => {
 				<div>Spaced Content</div>
 			</Section>,
 		);
-		expect(screen.getByText("Spaced Content")).toBeInTheDocument();
+		expect(screen.getByText("Spaced Content")).toBeTruthy();
 	});
 
 	it("exposes Header subcomponent", () => {
@@ -84,9 +91,9 @@ describe("Section", () => {
 				<div>Child 3</div>
 			</Section>,
 		);
-		expect(screen.getByText("Child 1")).toBeInTheDocument();
-		expect(screen.getByText("Child 2")).toBeInTheDocument();
-		expect(screen.getByText("Child 3")).toBeInTheDocument();
+		expect(screen.getByText("Child 1")).toBeTruthy();
+		expect(screen.getByText("Child 2")).toBeTruthy();
+		expect(screen.getByText("Child 3")).toBeTruthy();
 	});
 
 	it("accepts custom sx styling", () => {

package/src/components/side-nav/SideNav.stories.tsx

@@ -94,7 +94,7 @@ export const ControlledState: Story = {
 				open={open}
 				position="left"
 				width={300}
-				handler={(toggle) => (
+				handler={(_toggle) => (
 					<Button variant="contained" onClick={() => setOpen(true)}>
 						Open Controlled Menu
 					</Button>

package/src/components/site-logo.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import Image from "next/image";
 import Link from "next/link";
 
 interface SiteLogoProps {
@@ -9,7 +10,13 @@ interface SiteLogoProps {
 const SiteLogo: React.FC<SiteLogoProps> = () => {
 	return (
 		<Link href="/">
-			<img src={"/logo-blue.png"} alt="E4 Logo" height={54} />
+			<Image
+				src="/logo-blue.png"
+				alt="E4 Logo"
+				width={180}
+				height={54}
+				style={{ width: "auto", height: 54 }}
+			/>
 		</Link>
 	);
 };

package/src/components/wishlist-dialogs/add-to-wishlist/add-to-wishlist-button.tsx

@@ -23,7 +23,7 @@ const AddToWishlistButton = (props: Props) => {
 	};
 
 	// conditionally render button styles based on variant (pdp or minicart)
-	let style: any;
+	let style: ButtonProps["sx"];
 	let btnFullwidth: boolean;
 	let btnColor: ButtonProps["color"];
 	let btnVariant: ButtonProps["variant"];

package/src/components/wishlist-dialogs/add-to-wishlist/compound/add-to-wishlist-bottom-ui.tsx

@@ -1,7 +1,7 @@
 import { AddToWishListDialogContext } from "@evenicanpm/storefront-core/src/components/wishlist-dialogs/add-to-wishlist/compound/context";
 import { Button, Grid } from "@mui/material";
 import { useTranslations } from "next-intl";
-import React, { useContext } from "react";
+import { useContext } from "react";
 
 const AddToWishListBottomUI = () => {
 	const t = useTranslations("Account.Wishlists");

package/src/components/wishlist-dialogs/add-to-wishlist/compound/wishlist-dialog-header.tsx

@@ -11,7 +11,6 @@ import { IconButton, styled, type Theme } from "@mui/material";
 import useMediaQuery from "@mui/material/useMediaQuery";
 import { useSession } from "next-auth/react";
 import { useTranslations } from "next-intl";
-import React from "react";
 // ICONS
 import { MdFavorite } from "react-icons/md";
 

package/src/components/wishlist-dialogs/create-wishlist/compound/create-wishlist-bottom-ui.tsx

@@ -2,7 +2,7 @@ import { CreateNewWishlistContext } from "@evenicanpm/storefront-core/src/compon
 import { Button } from "@mui/material";
 import Grid from "@mui/material/Grid2";
 import { useTranslations } from "next-intl";
-import React, { useContext } from "react";
+import { useContext } from "react";
 
 function BottomUI() {
 	const t = useTranslations("Account.Wishlists");

package/src/hooks/use-nextauth-session.ts

@@ -42,7 +42,10 @@ export function useAppSession() {
 				await initializeMsal();
 				const res = await getMsalInstance().handleRedirectPromise();
 				if (res) {
-					const { given_name, family_name } = res.idTokenClaims as any;
+					const { given_name, family_name } = res.idTokenClaims as {
+						given_name?: string;
+						family_name?: string;
+					};
 					if (given_name && family_name) {
 						updateUser({
 							AccountNumber: "",

package/src/lib/lib.ts

@@ -9,7 +9,7 @@ import { formatDistanceStrict } from "date-fns";
 
 function getDateDifference(date: string | number | Date) {
 	const distance = formatDistanceStrict(new Date(), new Date(date));
-	return distance + " ago";
+	return `${distance} ago`;
 }
 
 /**

package/src/lib/page-slugs.ts

@@ -6,5 +6,3 @@ export const PageSlug = {
 	Confirmation: "confirmation",
 	Content: "content",
 } as const;
-
-type PageSlug = keyof typeof PageSlug;

package/src/lib/refiner-utils.ts

@@ -12,11 +12,11 @@ const convertParameterToRefiner = (parameter: string): ProductRefinerValue => {
 		sourceValue,
 	] = parameter.split("|");
 	return {
-		RefinerRecordId: Number.parseInt(recordId),
-		DataTypeValue: Number.parseInt(dataTypeValue),
+		RefinerRecordId: Number.parseInt(recordId, 10),
+		DataTypeValue: Number.parseInt(dataTypeValue, 10),
 		LeftValueBoundString: leftBoundString,
 		RightValueBoundString: rightBoundString,
-		RefinerSourceValue: Number.parseInt(sourceValue),
+		RefinerSourceValue: Number.parseInt(sourceValue, 10),
 	};
 };
 

package/src/pages/account/account-navigation.tsx

@@ -114,25 +114,22 @@ const AccountNavigation = ({ items, children }: AccountNavigationProps) => {
 	return (
 		<AccountNavigationContext.Provider value={{ items: mergedItems }}>
 			<MainContainer>
-				{children || (
-					<>
-						{mergedItems.map((section) => (
-							<AccountNavigation.Section
-								key={section.title}
-								title={section.title}
-							>
-								{section.list.map((item) => (
-									<AccountNavigation.Item
-										key={item.title}
-										{...item}
-										isActive={pathname?.includes(item.href) ?? false}
-										label={t(item.title)}
-									/>
-								))}
-							</AccountNavigation.Section>
-						))}
-					</>
-				)}
+				{children ||
+					mergedItems.map((section) => (
+						<AccountNavigation.Section
+							key={section.title}
+							title={section.title}
+						>
+							{section.list.map((item) => (
+								<AccountNavigation.Item
+									key={item.title}
+									{...item}
+									isActive={pathname?.includes(item.href) ?? false}
+									label={t(item.title)}
+								/>
+							))}
+						</AccountNavigation.Section>
+					))}
 			</MainContainer>
 		</AccountNavigationContext.Provider>
 	);
@@ -156,7 +153,7 @@ AccountNavigation.Section = ({ title, children }: SectionProps) => {
 
 interface ItemProps {
 	href: string;
-	Icon: React.ComponentType<any>;
+	Icon: React.ComponentType<React.SVGProps<SVGSVGElement>>;
 	count?: number;
 	label: string;
 	isActive?: boolean;

package/src/pages/account/addresses/address-form.tsx

@@ -28,8 +28,18 @@ import { useLocale, useTranslations } from "next-intl";
 import React, { createContext, useContext } from "react";
 import { z } from "zod";
 
+interface AddressFormValues {
+	Name: string;
+	Street: string;
+	City: string;
+	State: string;
+	ZipCode: string;
+	Country: string;
+	Phone: string;
+}
+
 interface FormContextValue {
-	formik: ReturnType<typeof useFormik<any>>;
+	formik: ReturnType<typeof useFormik<AddressFormValues>>;
 	countries: CountryRegionInfo[] | undefined;
 	states: { StateId?: string; StateName?: string }[] | undefined;
 	selectedCountry: CountryRegionInfo | null;
@@ -78,9 +88,7 @@ const AddressForm = ({ address, children }: RootProps) => {
 		Phone: z.string().optional().default(""),
 	});
 
-	type FormSchemaType = z.infer<typeof FormSchema>;
-
-	const initialValues: FormSchemaType = {
+	const initialValues: AddressFormValues = {
 		Name: address?.Name ?? "",
 		Street: address?.Street ?? "",
 		City: address?.City ?? "",
@@ -90,7 +98,7 @@ const AddressForm = ({ address, children }: RootProps) => {
 		Phone: address?.Phone ?? "",
 	};
 
-	const handleSubmit = async (values: FormSchemaType) => {
+	const handleSubmit = async (values: AddressFormValues) => {
 		let newAddress: Address = {
 			Name: values.Name,
 			Street: values.Street,
@@ -123,7 +131,7 @@ const AddressForm = ({ address, children }: RootProps) => {
 		}
 	};
 
-	const formik = useFormik<FormSchemaType>({
+	const formik = useFormik<AddressFormValues>({
 		initialValues,
 		onSubmit: handleSubmit,
 		validate: withZodSchema(FormSchema),
@@ -140,7 +148,7 @@ const AddressForm = ({ address, children }: RootProps) => {
 
 // ------------------- Fields -------------------
 interface FieldProps {
-	name: keyof Address;
+	name: keyof AddressFormValues;
 	label?: string;
 	required?: boolean;
 }

package/src/pages/account/dashboard-header.tsx

@@ -15,7 +15,7 @@ import {
 } from "@mui/material";
 import Link from "next/link";
 import { useTranslations } from "next-intl";
-import React, { createContext, type ReactNode, useContext } from "react";
+import { createContext, type ReactNode, useContext } from "react";
 import type { IconType } from "react-icons";
 import { MdMenu as Menu } from "react-icons/md";
 

package/src/pages/cart/checkout-form.tsx

@@ -141,7 +141,7 @@ CheckoutForm.Notes = () => {
 				multiline
 				onChange={debounceCommentUpdate}
 				inputRef={textRef}
-				inputProps={{ ["data-testid"]: "cart-comment" }}
+				inputProps={{ "data-testid": "cart-comment" }}
 			/>
 			<Divider sx={{ mb: 2 }} />
 		</>

package/src/pages/checkout/checkout-alt-form/checkout-step.tsx

@@ -117,7 +117,7 @@ CheckoutStep.Header = () => {
 	);
 };
 
-CheckoutStep.Body = <P extends object = {}>({
+CheckoutStep.Body = <P extends object = object>({
 	component: Component,
 	componentProps,
 }: {

package/src/pages/checkout/checkout-alt-form/steps/address/new-address-form.tsx

@@ -44,7 +44,7 @@ interface NewAddressFormCtx {
 	states: { StateName: string; StateId: string }[] | undefined;
 	selectedCountry: CountryRegionInfo | null;
 	setSelectedCountry: (c: CountryRegionInfo | null) => void;
-	errors: Record<string, any>;
+	errors: Partial<Record<keyof AddressFormInput, { message?: string }>>;
 	t: ReturnType<typeof useTranslations>;
 	onCancel: () => void;
 }

package/src/pages/checkout/checkout-alt-form/steps/payment/payment-details.tsx

@@ -8,7 +8,10 @@ import {
 	Small,
 } from "@evenicanpm/storefront-core/src/components/Typography";
 import type { CheckoutStepComponentProps } from "@evenicanpm/storefront-core/src/pages/checkout/checkout-alt-form/checkout-step";
-import type { CardPaymentAcceptResult } from "@msdyn365-commerce/retail-proxy";
+import type {
+	CardPaymentAcceptPoint,
+	CardPaymentAcceptResult,
+} from "@msdyn365-commerce/retail-proxy";
 import { Alert, Box, Card } from "@mui/material";
 import { useTranslations } from "next-intl";
 import React from "react";
@@ -43,7 +46,7 @@ type PaymentDetailsCompound = React.FC<CheckoutStepComponentProps> & {
 		iframeReference: React.RefObject<HTMLIFrameElement>;
 		iframeHeight: number;
 		errorState: PaymentError[];
-		paymentAcceptPointData: any;
+		paymentAcceptPointData: CardPaymentAcceptPoint | null | undefined;
 	}>;
 };
 

package/src/pages/checkout/checkout-alt-summary/cart-item.tsx

@@ -7,7 +7,7 @@ import {
 	Span,
 } from "@evenicanpm/storefront-core/src/components/Typography";
 import useCurrencyFormatter from "@evenicanpm/storefront-core/src/lib/currency-formatter";
-import React, { createContext, type ReactNode, useContext } from "react";
+import { createContext, type ReactNode, useContext } from "react";
 
 interface CartItemContextValue {
 	cartLine: CartLine;

package/src/pages/checkout/checkout-alt-summary/checkout-alt-summary.tsx

@@ -13,7 +13,7 @@ import ListItem from "@evenicanpm/storefront-core/src/pages/checkout/checkout-al
 import Box from "@mui/material/Box";
 import Divider from "@mui/material/Divider";
 import { useTranslations } from "next-intl";
-import React, { createContext, type ReactNode, useContext } from "react";
+import { createContext, type ReactNode, useContext } from "react";
 
 interface Props {
 	cart: Cart;

package/src/pages/confirmation/address.tsx

@@ -7,7 +7,7 @@ import {
 } from "@evenicanpm/storefront-core/src/components/Typography";
 import { Card } from "@mui/material";
 import { useTranslations } from "next-intl";
-import React, { createContext, type ReactNode, useContext } from "react";
+import { createContext, type ReactNode, useContext } from "react";
 
 const AddressContext = createContext<Address | null>(null);