@evenicanpm/storefront-core 1.0.3 → 1.0.5

package/src/components-v2/wishlist/remove-from-wishlist-dialog.tsx

@@ -1,175 +0,0 @@
-import React, { Fragment, useCallback, useEffect } from "react";
-import isFunction from "lodash/isFunction";
-import { useTranslations } from "next-intl";
-import { Grid, Button, Dialog, DialogContent } from "@mui/material";
-import { MdFavorite } from "react-icons/md";
-// Global Custom components
-import DashboardHeader from "./components/dashboard-header";
-import WishlistModalItem from "./components/wishlist-modal-item";
-import NoRecords from "./components/no-records";
-// API
-import getWishlists from "@/api-manager/services/user/queries/get-wishlists";
-import {
-  ExtendedProductListLine,
-  Wishlist,
-  WishlistLinesInput,
-} from "@evenicanpm/storefront-core/src/api-manager/schemas/user.schema";
-import { useNotification } from "@evenicanpm/storefront-core/src/providers/notifications/use-notification";
-
-import { useSession } from "next-auth/react";
-import useRemoveFromWishlist from "@/api-manager/services/user/mutations/remove-from-wishlist";
-
-interface Props {
-  open: boolean;
-  // product?: ProductDetails;
-  productId?: number;
-  onSuccess?: () => void;
-  handleClose: () => void;
-}
-
-export default function RemoveFromWishlistDialog({
-  open,
-  productId,
-  handleClose,
-  onSuccess,
-}: Props) {
-  const { data: wishlists, isLoading } = getWishlists.useSuspenseData();
-  const t = useTranslations("Account.Wishlists");
-  const { setNotification } = useNotification();
-
-  const { mutateAsync: removeFromWishlist } = useRemoveFromWishlist();
-
-  const { data: session } = useSession();
-  const isAuthenticated = !!session;
-
-  const [relevantWishlists, setRelevantWishlists] = React.useState<Wishlist[]>(
-    [],
-  );
-
-  const handleCloseDialog = () => {
-    if (isFunction(handleClose)) {
-      handleClose();
-    }
-  };
-
-  // get wishlists that the product is in
-  const getRelevantWishlists = useCallback(
-    (wishlists: Wishlist[]) => {
-      return wishlists.filter((wishlist) =>
-        wishlist.ProductListLines?.some((line) => line.ProductId === productId),
-      );
-    },
-    [productId],
-  );
-
-  const handleRemoveFromWishlist = useCallback(
-    async (wishlistId: string) => {
-      // get the selected wishlist
-      const wishlist = relevantWishlists.find(
-        (wishlist) => wishlist.Id === wishlistId,
-      );
-      if (wishlist) {
-        try {
-          const extendedWishlistLine = wishlist.ProductListLines?.find(
-            (item: ExtendedProductListLine) => item.ProductId === productId,
-          );
-
-          if (extendedWishlistLine) {
-            const wishlistLinesInput: WishlistLinesInput = {
-              Id: wishlist.Id,
-              ProductListLines: [extendedWishlistLine],
-            };
-
-            await removeFromWishlist(wishlistLinesInput);
-
-            setNotification({
-              message: t("wishlistLineRemoveSuccess"),
-              severity: "success",
-            });
-            if (isFunction(onSuccess)) {
-              onSuccess();
-            }
-          }
-        } catch (error) {
-          setNotification({
-            message: t("wishlistLineRemoveFailed"),
-            severity: "error",
-          });
-        }
-      }
-    },
-    [
-      relevantWishlists,
-      removeFromWishlist,
-      setNotification,
-      t,
-      onSuccess,
-      productId,
-    ],
-  );
-
-  useEffect(() => {
-    const withlistsWithProduct = getRelevantWishlists(wishlists);
-    setRelevantWishlists(withlistsWithProduct);
-    if (open && withlistsWithProduct.length === 1) {
-      // delete right away
-      handleRemoveFromWishlist(withlistsWithProduct[0].Id);
-    }
-  }, [open, getRelevantWishlists, handleRemoveFromWishlist, wishlists]);
-
-  return (
-    <Dialog
-      open={open}
-      onClose={handleCloseDialog}
-      aria-labelledby="form-dialog-title"
-    >
-      <DialogContent>
-        <Fragment>
-          <DashboardHeader
-            title="Account.Wishlists.heading"
-            Icon={MdFavorite}
-            href=""
-            buttonText=""
-          />
-          {isAuthenticated && !isLoading ? (
-            relevantWishlists && relevantWishlists.length > 0 ? (
-              relevantWishlists?.map((wishlist: Wishlist) => (
-                <WishlistModalItem
-                  key={wishlist.Id}
-                  wishlist={wishlist}
-                  removeFromWishlist={handleRemoveFromWishlist}
-                />
-              ))
-            ) : (
-              <NoRecords message="Account.Wishlists.noWishlists" />
-            )
-          ) : (
-            <NoRecords message="Account.Wishlists.wishlistAddUnauthenticated" />
-          )}
-        </Fragment>
-        <Grid container spacing={3}>
-          <Grid
-            item
-            sm={12}
-            xs={12}
-            sx={{
-              display: "flex",
-              justifyContent: "flex-start",
-              gap: 2,
-            }}
-          >
-            <Button
-              color="primary"
-              variant="outlined"
-              size="small"
-              onClick={handleCloseDialog}
-              sx={{ height: 30.75 }}
-            >
-              {t("btnCancel")}
-            </Button>
-          </Grid>
-        </Grid>
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components-v2/wishlist-modal/TODO.md

@@ -1,10 +0,0 @@
-# Wish List Component Dedupe
-
-Found these components inside of the /app directory in storefront,
-seems like someone created duplicates of components that were already
-inside of our client packages wishlist folder.
-
-Todo: Audit two folders and amalgamate duplicate code.
-
-Date: 2025-07-10  
-By: Sam Forderer

package/src/components-v2/wishlist-modal/add-to-wishlist-dialog.tsx

@@ -1,161 +0,0 @@
-import React, { Fragment } from "react";
-import isFunction from "lodash/isFunction";
-import { useTranslations } from "next-intl";
-import { Grid, Button, Dialog, DialogContent } from "@mui/material";
-import { MdFavorite } from "react-icons/md";
-// Global Custom components
-import DashboardHeader from "@evenicanpm/storefront-core/src/pages/account/dashboard-header";
-import CreateWishlistButton from "@evenicanpm/storefront-core/src/pages/account/wishlist/create-wishlist-button";
-import WishlistModalItem from "./wishlist-modal-item";
-import NoRecords from "@evenicanpm/storefront-core/src/pages/account/no-records";
-// API
-import {
-  CopyCartToWishlistInput,
-  Wishlist,
-  WishlistLinesInput,
-} from "@/api-manager/schemas/user.schema";
-import { Cart } from "@/api-manager/schemas/cart.schema";
-import useAddToWishlist from "@/api-manager/services/user/mutations/add-to-wishlist";
-import { useNotification } from "@evenicanpm/storefront-core/src/providers/notifications/use-notification";
-import useCopyCartToWishlist from "@/api-manager/services/user/mutations/copy-cart-to-wishlist";
-import { useSession } from "next-auth/react";
-import getWishlists from "@/api-manager/services/user/queries/get-wishlists";
-
-interface Props {
-  open: boolean;
-  handleClose: () => void;
-  productId?: number;
-  cart?: Cart;
-  onSuccess?: () => void;
-}
-
-export default function AddToWishlistDialog(props: Props) {
-  const { data: wishlists, isLoading } = getWishlists.useData();
-
-  const t = useTranslations("Account.Wishlists");
-  const { setNotification } = useNotification();
-
-  const { mutateAsync: addToWishlist } = useAddToWishlist();
-  const { mutateAsync: copyCartToWishlist } = useCopyCartToWishlist();
-
-  const { data: session } = useSession();
-  const isAuthenticated = !!session;
-
-  const handleClose = () => {
-    if (isFunction(props.handleClose)) {
-      props.handleClose();
-    }
-  };
-
-  const handleAddToWishlist = async (wishlistId: string) => {
-    if (props.productId) {
-      try {
-        const wishlistLinesInput: WishlistLinesInput = {
-          Id: wishlistId,
-          ProductListLines: [],
-        };
-
-        wishlistLinesInput.ProductListLines.push({
-          ProductListId: wishlistId,
-          ProductId: props.productId,
-          Quantity: 1,
-          UnitOfMeasure: "ea",
-        });
-        await addToWishlist(wishlistLinesInput);
-        setNotification({
-          message: t("wishlistLineAddSuccess"),
-          severity: "success",
-        });
-        if (isFunction(props.onSuccess)) {
-          props.onSuccess();
-        }
-      } catch (error) {
-        setNotification({
-          message: t("wishlistLineAddFailed"),
-          severity: "error",
-        });
-      }
-    } else if (props.cart) {
-      try {
-        const copyCartToWishlistInput: CopyCartToWishlistInput = {
-          Id: wishlistId,
-          CartID: props.cart.Id,
-          IsRewrite: false,
-          IsQuantityAggregate: true,
-        };
-
-        await copyCartToWishlist(copyCartToWishlistInput);
-        setNotification({
-          message: t("wishlistCartCopySuccess"),
-          severity: "success",
-        });
-      } catch (error) {
-        setNotification({
-          message: t("wishlistCartCopyFailed"),
-          severity: "error",
-        });
-      }
-    }
-  };
-
-  return (
-    <Dialog
-      open={props.open}
-      onClose={handleClose}
-      aria-labelledby="form-dialog-title"
-    >
-      <DialogContent>
-        <Fragment>
-          <DashboardHeader
-            title="Account.Wishlists.heading"
-            Icon={MdFavorite}
-            href=""
-            buttonText=""
-            buttons={
-              isAuthenticated && (
-                <CreateWishlistButton path="Account.Wishlists.btnCreateNewList" />
-              )
-            }
-          />
-          {isAuthenticated && !isLoading ? (
-            wishlists && wishlists.length > 0 ? (
-              wishlists?.map((wishlist: Wishlist) => (
-                <WishlistModalItem
-                  key={wishlist.Id}
-                  wishlist={wishlist}
-                  addToWishlist={handleAddToWishlist}
-                />
-              ))
-            ) : (
-              <NoRecords message="Account.Wishlists.noWishlists" />
-            )
-          ) : (
-            <NoRecords message="Account.Wishlists.wishlistAddUnauthenticated" />
-          )}
-        </Fragment>
-        <Grid container spacing={3}>
-          <Grid
-            item
-            sm={12}
-            xs={12}
-            sx={{
-              display: "flex",
-              justifyContent: "flex-start",
-              gap: 2,
-            }}
-          >
-            <Button
-              color="primary"
-              variant="outlined"
-              size="small"
-              onClick={handleClose}
-              sx={{ height: 30.75 }}
-            >
-              {t("btnCancel")}
-            </Button>
-          </Grid>
-        </Grid>
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components-v2/wishlist-modal/remove-from-wishlist-dialog.tsx

@@ -1,174 +0,0 @@
-import React, { Fragment, useCallback, useEffect } from "react";
-import isFunction from "lodash/isFunction";
-import { useTranslations } from "next-intl";
-import { Grid, Button, Dialog, DialogContent } from "@mui/material";
-import { MdFavorite } from "react-icons/md";
-// Global Custom components
-import DashboardHeader from "../../../pages/account/dashboard-header";
-import WishlistModalItem from "./wishlist-modal-item";
-import NoRecords from "../../../pages/account/no-records";
-// API
-import getWishlists from "@/api-manager/services/user/queries/get-wishlists";
-import {
-  ExtendedProductListLine,
-  Wishlist,
-  WishlistLinesInput,
-} from "@evenicanpm/storefront-core/src/api-manager/schemas/user.schema";
-import { useNotification } from "@evenicanpm/storefront-core/src/providers/notifications/use-notification";
-import { useSession } from "next-auth/react";
-import useRemoveFromWishlist from "@/api-manager/services/user/mutations/remove-from-wishlist";
-
-interface Props {
-  open: boolean;
-  // product?: ProductDetails;
-  productId?: number;
-  onSuccess?: () => void;
-  handleClose: () => void;
-}
-
-export default function RemoveFromWishlistDialog({
-  open,
-  productId,
-  handleClose,
-  onSuccess,
-}: Props) {
-  const { data: wishlists, isLoading } = getWishlists.useSuspenseData();
-  const t = useTranslations("Account.Wishlists");
-  const { setNotification } = useNotification();
-
-  const { mutateAsync: removeFromWishlist } = useRemoveFromWishlist();
-
-  const { data: session } = useSession();
-  const isAuthenticated = !!session;
-
-  const [relevantWishlists, setRelevantWishlists] = React.useState<Wishlist[]>(
-    [],
-  );
-
-  const handleCloseDialog = () => {
-    if (isFunction(handleClose)) {
-      handleClose();
-    }
-  };
-
-  // get wishlists that the product is in
-  const getRelevantWishlists = useCallback(
-    (wishlists: Wishlist[]) => {
-      return wishlists.filter((wishlist) =>
-        wishlist.ProductListLines?.some((line) => line.ProductId === productId),
-      );
-    },
-    [productId],
-  );
-
-  const handleRemoveFromWishlist = useCallback(
-    async (wishlistId: string) => {
-      // get the selected wishlist
-      const wishlist = relevantWishlists.find(
-        (wishlist) => wishlist.Id === wishlistId,
-      );
-      if (wishlist) {
-        try {
-          const extendedWishlistLine = wishlist.ProductListLines?.find(
-            (item: ExtendedProductListLine) => item.ProductId === productId,
-          );
-
-          if (extendedWishlistLine) {
-            const wishlistLinesInput: WishlistLinesInput = {
-              Id: wishlist.Id,
-              ProductListLines: [extendedWishlistLine],
-            };
-
-            await removeFromWishlist(wishlistLinesInput);
-
-            setNotification({
-              message: t("wishlistLineRemoveSuccess"),
-              severity: "success",
-            });
-            if (isFunction(onSuccess)) {
-              onSuccess();
-            }
-          }
-        } catch (error) {
-          setNotification({
-            message: t("wishlistLineRemoveFailed"),
-            severity: "error",
-          });
-        }
-      }
-    },
-    [
-      relevantWishlists,
-      removeFromWishlist,
-      setNotification,
-      t,
-      onSuccess,
-      productId,
-    ],
-  );
-
-  useEffect(() => {
-    const withlistsWithProduct = getRelevantWishlists(wishlists);
-    setRelevantWishlists(withlistsWithProduct);
-    if (open && withlistsWithProduct.length === 1) {
-      // delete right away
-      handleRemoveFromWishlist(withlistsWithProduct[0].Id);
-    }
-  }, [open, getRelevantWishlists, handleRemoveFromWishlist, wishlists]);
-
-  return (
-    <Dialog
-      open={open}
-      onClose={handleCloseDialog}
-      aria-labelledby="form-dialog-title"
-    >
-      <DialogContent>
-        <Fragment>
-          <DashboardHeader
-            title="Account.Wishlists.heading"
-            Icon={MdFavorite}
-            href=""
-            buttonText=""
-          />
-          {isAuthenticated && !isLoading ? (
-            relevantWishlists && relevantWishlists.length > 0 ? (
-              relevantWishlists?.map((wishlist: Wishlist) => (
-                <WishlistModalItem
-                  key={wishlist.Id}
-                  wishlist={wishlist}
-                  removeFromWishlist={handleRemoveFromWishlist}
-                />
-              ))
-            ) : (
-              <NoRecords message="Account.Wishlists.noWishlists" />
-            )
-          ) : (
-            <NoRecords message="Account.Wishlists.wishlistAddUnauthenticated" />
-          )}
-        </Fragment>
-        <Grid container spacing={3}>
-          <Grid
-            item
-            sm={12}
-            xs={12}
-            sx={{
-              display: "flex",
-              justifyContent: "flex-start",
-              gap: 2,
-            }}
-          >
-            <Button
-              color="primary"
-              variant="outlined"
-              size="small"
-              onClick={handleCloseDialog}
-              sx={{ height: 30.75 }}
-            >
-              {t("btnCancel")}
-            </Button>
-          </Grid>
-        </Grid>
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components-v2/wishlist-modal/wishlist-modal-item.tsx

@@ -1,65 +0,0 @@
-import { Button } from "@mui/material";
-import { format } from "date-fns";
-// MUI ICON COMPONENTS
-// GLOBAL CUSTOM COMPONENTS
-import { Paragraph } from "@evenicanpm/storefront-core/src/components-v2/Typography";
-// LOCAL CUSTOM COMPONENT
-import TableRow from "@evenicanpm/storefront-core/src/pages/account/table-row";
-// API
-import { Wishlist } from "@/api-manager/schemas/user.schema";
-
-interface Props {
-  wishlist: Wishlist;
-  addToWishlist?: (wishlistId: string) => void;
-  removeFromWishlist?: (wishlistId: string) => void;
-}
-
-export default function WishlistModalItem({
-  wishlist,
-  addToWishlist,
-  removeFromWishlist,
-}: Props) {
-  const handleClick = () => {
-    if (addToWishlist) {
-      addToWishlist(wishlist.Id);
-    } else if (removeFromWishlist) {
-      removeFromWishlist(wishlist.Id);
-    }
-  };
-  return (
-    <TableRow
-      sx={{
-        display: "grid",
-        gridTemplateColumns: "2fr 1fr 1fr 1fr", // Define equal column structure
-        alignItems: "center",
-        gap: 2,
-        padding: "10px 15px",
-        width: "500px",
-        cursor: "default",
-      }}
-    >
-      <Paragraph ellipsis sx={{ fontWeight: "bold" }}>
-        {wishlist?.Name ?? ""}
-      </Paragraph>
-      <Paragraph ellipsis>
-        {" "}
-        {format(
-          new Date(wishlist?.CreatedDateTime ?? wishlist?.LastUpdated ?? ""),
-          "MMM dd, yyyy",
-        )}
-      </Paragraph>
-      <Paragraph ellipsis>
-        {" "}
-        {`${wishlist?.ProductListLines?.length} products`}
-      </Paragraph>
-
-      <Button
-        onClick={handleClick}
-        color="primary"
-        sx={{ bgcolor: "primary.light", px: 4 }}
-      >
-        {addToWishlist ? "Add" : "Remove"}
-      </Button>
-    </TableRow>
-  );
-}

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

@@ -1,87 +0,0 @@
-"use client";
-
-import { usePathname } from "next/navigation";
-import { Fragment } from "react";
-import { useTranslations } from "next-intl";
-
-// ICON COMPONENTS
-import {
-  MdOutlineShoppingBag as ShoppingBagOutlined,
-  MdFavoriteBorder as FavoriteBorder,
-  MdPerson as Person,
-  MdPlace as Place,
-} from "react-icons/md";
-
-// GLOBAL CUSTOM COMPONENTS
-import FlexBox from "@evenicanpm/storefront-core/src/components-v2/flex-box/flex-box";
-import {
-  Paragraph,
-  Span,
-} from "@evenicanpm/storefront-core/src/components-v2/Typography";
-
-// API
-import getUser from "@/api-manager/services/user/queries/get-user";
-import getUserCounts from "@/api-manager/services/user/queries/get-user-counts";
-
-// STYLED COMPONENTS
-import { MainContainer, StyledNavLink } from "./styles";
-
-const MENU_ITEMS = [
-  {
-    title: "DASHBOARD",
-    list: [
-      {
-        href: "/account/orders",
-        title: "orders",
-        Icon: ShoppingBagOutlined,
-        count: 0,
-      },
-      { href: "/account/wish-lists", title: "wishlists", Icon: FavoriteBorder },
-    ],
-  },
-  {
-    title: "ACCOUNT SETTINGS",
-    list: [
-      { href: "/account/profile", title: "profile", Icon: Person },
-      { href: "/account/addresses", title: "addresses", Icon: Place, count: 0 },
-    ],
-  },
-];
-
-export default function Navigation() {
-  const pathname = usePathname();
-  const t = useTranslations("Account.Menu");
-
-  const { data: user } = getUser.useData();
-  const { data: counts } = getUserCounts.useData(String(user?.RecordId) || "");
-
-  MENU_ITEMS[0].list[0].count = counts?.orderCount;
-  MENU_ITEMS[1].list[1].count = counts?.addressCount;
-
-  return (
-    <MainContainer>
-      {MENU_ITEMS.map((item) => (
-        <Fragment key={item.title}>
-          <Paragraph p="26px 30px 1rem" color="grey.600" fontSize={12}>
-            {item.title}
-          </Paragraph>
-
-          {item.list.map(({ Icon, count, href, title }) => (
-            <StyledNavLink
-              href={href}
-              key={title}
-              isCurrentPath={pathname.includes(href)}
-            >
-              <FlexBox alignItems="center" gap={1}>
-                <Icon color="inherit" fontSize="large" className="nav-icon" />
-                <Span>{t(title)}</Span>
-              </FlexBox>
-
-              <Span>{count}</Span>
-            </StyledNavLink>
-          ))}
-        </Fragment>
-      ))}
-    </MainContainer>
-  );
-}

package/src/pages-v2/account/no-records.tsx

@@ -1,20 +0,0 @@
-import React from "react";
-import { Box } from "@mui/material";
-import { H4 } from "@evenicanpm/storefront-core/src/components-v2/Typography";
-import { useTranslations } from "next-intl";
-
-type Props = { message: string };
-
-export default function NoRecords({ message }: Props) {
-  const t = useTranslations();
-  return (
-    <Box
-      display="flex"
-      justifyContent="center"
-      alignItems="center"
-      height="50vh"
-    >
-      <H4 color="grey.500">{t(message)}</H4>
-    </Box>
-  );
-}