@evenicanpm/storefront-core 2.0.0 → 2.0.1

package/src/pages/confirmation/confirmation-summary.tsx

@@ -12,7 +12,7 @@ import {
 import useCurrencyFormatter from "@evenicanpm/storefront-core/src/lib/currency-formatter";
 import { Card, Divider } from "@mui/material";
 import { useTranslations } from "next-intl";
-import React, { createContext, type ReactNode, useContext } from "react";
+import { createContext, type ReactNode, useContext } from "react";
 
 type SummaryValues = {
 	order: SalesOrder;

package/src/pages/product-details/currency.ts

@@ -13,7 +13,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/pages/product-details/product-intro/compound/thumbnail-with-skeleton.tsx

@@ -1,4 +1,5 @@
 import { Skeleton } from "@mui/material";
+import Image from "next/image";
 import { useState } from "react";
 
 /**
@@ -11,9 +12,11 @@ function ThumbnailWithSkeleton({ src }: Readonly<{ src: string }>) {
 	return (
 		<>
 			{!loaded && <Skeleton variant="rounded" width={50} height={50} />}
-			<img
+			<Image
 				src={src}
 				alt="Product thumbnail"
+				width={50}
+				height={50}
 				onLoad={() => setLoaded(true)}
 				style={{
 					display: loaded ? "block" : "none",

package/src/pages/product-list/breadcrumbs.tsx

@@ -1,7 +1,6 @@
 import type { CategoryHierarchy } from "@evenicanpm/storefront-core/src/lib/category-helpers";
 import { Breadcrumbs, Typography } from "@mui/material";
 import Link from "next/link";
-import React from "react";
 import {
 	getCategoryTranslatedName,
 	getCategoryUrl,

package/src/pages/product-list/list-filter.tsx

@@ -4,7 +4,6 @@ import {
 } from "@evenicanpm/storefront-core/src/components/flex-box";
 import { Span } from "@evenicanpm/storefront-core/src/components/Typography";
 import type { ProductRefinerValue } from "@msdyn365-commerce/retail-proxy";
-import React from "react";
 import CheckboxLabel from "./checkbox-label";
 import type { RenderedFacetProps } from "./facet-group";
 

package/src/pages/product-list/product-list-context.tsx

@@ -151,7 +151,7 @@ const ProductListProvider = ({ children }: { children: React.ReactNode }) => {
 
 	const { data, isLoading } = getProductList.useData(inputParams);
 	const { data: productPrices } = getProductPrices.useSuspenseData({
-		productIds: data?.products.map((product) => product.RecordId) || [],
+		productIds: (data?.products ?? []).map((product) => product.RecordId),
 	});
 	const handleRefinerChange = useCallback(
 		(refiner: ProductRefinerValue) => {

package/src/pages/product-list/product-list-view.tsx

@@ -18,7 +18,7 @@ import { usePreviousRefiners } from "@evenicanpm/storefront-core/src/pages/produ
 import { Box, CircularProgress, Paper, Typography } from "@mui/material";
 import Grid from "@mui/material/Grid2";
 import { useLocale, useTranslations } from "next-intl";
-import React, { createContext, type ReactNode, useContext } from "react";
+import { createContext, type ReactNode, useContext } from "react";
 
 type PLViewCtx = { categoryId: number };
 const ProductListViewContext = createContext<PLViewCtx | null>(null);
@@ -61,7 +61,7 @@ ProductListView.Header = function Header() {
 		<Box>
 			<CategoryBreadcrumbs breadcrumbs={breadcrumbs} locale={locale} />
 			<Paragraph color="grey.600" sx={{ mt: 1 }}>
-				{(productData?.count ?? 0) + " " + t("results")}
+				{`${productData?.count ?? 0} ${t("results")}`}
 			</Paragraph>
 		</Box>
 	);

package/src/pages/product-list/selected-facets.tsx

@@ -5,7 +5,7 @@ import {
 } from "@msdyn365-commerce/retail-proxy";
 import { Button, Chip, Stack } from "@mui/material";
 import { useTranslations } from "next-intl";
-import React, { useEffect, useState } from "react";
+import { useEffect, useState } from "react";
 import useProductList from "./use-product-list";
 
 export default function SelectedFacets() {

package/src/pages/quickorder/context.ts

@@ -1,8 +1,14 @@
 "use client";
 
+import type { Cart } from "@evenicanpm/storefront-core/src/api-manager/schemas/cart.schema";
 import { createContext, useContext } from "react";
 import type { QuickOrderRowData } from "./quick-order-row";
 
+export type UploadedItem = {
+	itemId: string | number;
+	qty?: number;
+};
+
 export enum RowError {
 	ProductNotFound,
 	InvalidQuantity,
@@ -12,7 +18,7 @@ export enum RowError {
 
 export type QuickOrderContextType = {
 	rows: QuickOrderRowData[];
-	cart: any;
+	cart: Cart | undefined;
 	handleRowUpdate: (
 		id: number,
 		value: string,
@@ -21,7 +27,7 @@ export type QuickOrderContextType = {
 	handleRowDelete: (id: number) => void;
 	handleAddRows: () => void;
 	handleAddToCart: () => Promise<void>;
-	handleUploadedItems: (items: any[]) => Promise<void>;
+	handleUploadedItems: (items: UploadedItem[]) => Promise<void>;
 	resetForm: () => void;
 	generateFile: () => void;
 };

package/src/pages/quickorder/order-upload.tsx

@@ -15,8 +15,26 @@ export interface OrderUploadProps {
 	onUploadItems: (data: OrderUploadItem[]) => void;
 }
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-declare const XLSX: any;
+type XlsxCellValue = string | number | boolean | null;
+
+interface XlsxCell {
+	v?: XlsxCellValue;
+}
+
+interface XlsxSheet {
+	"!ref"?: string;
+	[key: string]: XlsxCell | string | undefined;
+}
+
+declare const XLSX: {
+	read(
+		data: string | ArrayBuffer,
+		opts: { type: string },
+	): { SheetNames: string[]; Sheets: Record<string, XlsxSheet> };
+	utils: {
+		sheet_to_json<T>(ws: XlsxSheet, opts?: { header?: number }): T[];
+	};
+};
 
 export default function OrderUpload({
 	onUploadItems,
@@ -110,8 +128,7 @@ function readFirstSheet(binary: string | ArrayBuffer) {
 }
 
 //Extract Items
-// biome-ignore lint/suspicious/noExplicitAny: <explanation> This is required as the XLSX library returns a sheet as an object with dynamic keys based on the cell positions (e.g., A1, B2, etc.), which cannot be typed more specifically without extensive type definitions that may not be practical. --- IGNORE ---
-function extractItemsFromSheet(ws: Record<string, any>): OrderUploadItem[] {
+function extractItemsFromSheet(ws: XlsxSheet): OrderUploadItem[] {
 	const ref = ws["!ref"];
 	let data: OrderUploadItem[] = [];
 
@@ -121,16 +138,17 @@ function extractItemsFromSheet(ws: Record<string, any>): OrderUploadItem[] {
 			const rowCount = Number(end.substring(1));
 
 			for (let i = 2; i < rowCount + 1; i++) {
-				const qty = ws[`B${i}`]?.v;
-				const itemId = ws[`A${i}`]?.v;
+				const qty = (ws[`B${i}`] as XlsxCell | undefined)?.v;
+				const itemId = (ws[`A${i}`] as XlsxCell | undefined)?.v;
 
-				if (itemId) data.push({ itemId, qty });
+				if (itemId != null)
+					data.push({ itemId: String(itemId), qty: Number(qty) });
 			}
 		}
 	} catch {}
 
 	if (data.length === 0) {
-		data = XLSX.utils.sheet_to_json(ws, { header: 0 });
+		data = XLSX.utils.sheet_to_json<OrderUploadItem>(ws, { header: 0 });
 	}
 
 	return data;

package/src/pages/quickorder/provider.tsx

@@ -5,7 +5,7 @@ import getCart from "@evenicanpm/storefront-core/src/api-manager/services/cart/q
 import useSearchProducts from "@evenicanpm/storefront-core/src/api-manager/services/product/mutations/search-products";
 import type React from "react";
 import { useCallback, useEffect, useState } from "react";
-import { QuickOrderContext, RowError } from "./context";
+import { QuickOrderContext, RowError, type UploadedItem } from "./context";
 import type { QuickOrderRowData } from "./quick-order-row";
 
 const generateEmptyRow = (id: number): QuickOrderRowData => ({
@@ -35,7 +35,7 @@ export default function QuickOrderProvider({
 
 	const generateRowData = useCallback(
 		(
-			product: any,
+			product: QuickOrderRowData["product"],
 			rowId: number,
 			value: string,
 			found: boolean,
@@ -135,24 +135,23 @@ export default function QuickOrderProvider({
 		}
 	};
 
-	const handleUploadedItems = async (items: any[]) => {
-		const itemIds = items.map((it: any) => it.itemId.toString());
+	const handleUploadedItems = async (items: UploadedItem[]) => {
+		const itemIds = items.map((it) => it.itemId.toString());
 		const response = await getProductSearchResults(itemIds);
 
 		const updated = rows.filter((r) => r.value);
 		let rowId = updated.reduce((max, r) => Math.max(max, r.id), 0) + 1;
 
-		items.forEach((it: any) => {
+		items.forEach((it) => {
 			const product = response?.find(
-				(r: any) =>
-					r.ItemId?.toLowerCase() === it.itemId.toString().toLowerCase(),
+				(r) => r.ItemId?.toLowerCase() === it.itemId.toString().toLowerCase(),
 			);
 			const qty = it.qty || 1;
 			updated.push(
 				generateRowData(
 					product || null,
 					rowId++,
-					it.itemId,
+					it.itemId.toString(),
 					!!product,
 					qty.toString(),
 				),
@@ -172,7 +171,7 @@ export default function QuickOrderProvider({
 		const csv =
 			header +
 			rows.map(({ value, quantity }) => `${value},${quantity}`).join("\n");
-		const uri = "data:text/csv;charset=utf-8," + csv;
+		const uri = `data:text/csv;charset=utf-8,${csv}`;
 
 		const link = document.createElement("a");
 		link.setAttribute("href", encodeURI(uri));

package/src/pages/quickorder/quick-order.tsx

@@ -59,6 +59,10 @@ export interface QuickOrderRowData {
 	rowError: RowError;
 }
 
+type SearchableProduct = {
+	ItemId?: string;
+};
+
 type Ctx = {
 	rows: QuickOrderRowData[];
 	setRows: React.Dispatch<React.SetStateAction<QuickOrderRowData[]>>;
@@ -189,7 +193,7 @@ const QuickOrder = ({ children }: { children?: ReactNode }) => {
 		const csv =
 			header +
 			rows.map(({ value, quantity }) => `${value},${quantity}`).join("\n");
-		const encoded = encodeURI("data:text/csv;charset=utf-8," + csv);
+		const encoded = encodeURI(`data:text/csv;charset=utf-8,${csv}`);
 
 		const link = document.createElement("a");
 		link.setAttribute("href", encoded);
@@ -218,21 +222,23 @@ const QuickOrder = ({ children }: { children?: ReactNode }) => {
 	};
 
 	const handleUploadedItems = useCallback(
-		async (items: OrderUploadItem[]) => {
-			const ids = items.map((it) => it.itemId.toString());
-			const response = await searchProductsMultiple(ids);
+		async (items: OrderUploadItem[]): Promise<void> => {
+			const ids: string[] = items.map((it) => it.itemId.toString());
+			const response: ProductSearchResult[] | undefined =
+				await searchProductsMultiple(ids);
 
-			let curr = [...rows];
-			const firstEmptyIdx = curr.findIndex((r) => !r.value);
+			let curr: QuickOrderRowData[] = [...rows];
+			const firstEmptyIdx: number = curr.findIndex((r) => !r.value);
 			if (firstEmptyIdx > -1) curr = curr.slice(0, firstEmptyIdx);
 
-			let rowId = curr.reduce((m, r) => Math.max(m, r.id), 0) + 1;
+			let rowId: number = curr.reduce((m, r) => Math.max(m, r.id), 0) + 1;
 
-			items.forEach((it) => {
-				const product = response?.find(
-					(r) => it.itemId.toString().toLowerCase() === r.ItemId?.toLowerCase(),
+			items.forEach((it: OrderUploadItem): void => {
+				const product: ProductSearchResult | undefined = response?.find(
+					(r: SearchableProduct) =>
+						it.itemId.toString().toLowerCase() === r.ItemId?.toLowerCase(),
 				);
-				const qty = it.qty || 1;
+				const qty: number = it.qty || 1;
 				curr.push(
 					generateRowData(
 						product || null,

package/src/providers/nav-provider/index.tsx

@@ -2,7 +2,7 @@
 import type { CategoryHierarchy } from "@evenicanpm/storefront-core/src/lib/category-helpers";
 import { createLink } from "@evenicanpm/storefront-core/src/providers/nav-provider/utils/createLink";
 import { useTranslations } from "next-intl";
-import React, { createContext, type PropsWithChildren, useState } from "react";
+import { createContext, type PropsWithChildren, useState } from "react";
 import type { CmsNavItem } from "@/cms/interfaces/navigation";
 
 type NavContextType = {

package/tsconfig.json

@@ -10,7 +10,6 @@
 		"moduleResolution": "node",
 		"resolveJsonModule": true,
 		"outDir": "./dist",
-		"baseUrl": "./",
 		"jsx": "preserve",
 		"typeRoots": ["../../../../storefront/node_modules/@types"],
 		"paths": {