@evenicanpm/storefront-core 1.1.0 → 1.2.0

package/src/components/Blocks/Components/ProductSectionFullWidth/index.tsx

@@ -1,103 +0,0 @@
-import React from "react";
-import NextLink from "next/link";
-import Image from "next/image";
-
-// Icons
-import { getIcon } from "../../Icons/index";
-
-// Components
-import Grid from "@mui/material/Grid2";
-import HoverBox from "@evenicanpm/storefront-core/src/components/_components/HoverBox";
-import { H4 } from "@evenicanpm/storefront-core/src/components/_components/Typography";
-import BazaarCard from "@evenicanpm/storefront-core/src/components/_components/BazaarCard";
-import { SectionCreator } from "@evenicanpm/storefront-core/src/components/_components/section-header/index";
-
-// Utils
-import { currency } from "@/lib/lib";
-import { getImageUrl } from "@/cms/endpoints";
-
-// API
-import getProductByIds from "@evenicanpm/storefront-core/src/api-manager/services/product/queries/get-product-by-ids";
-import { getQueryClient } from "@evenicanpm/storefront-core/src/api-manager/services/get-query-client";
-import buildDetailUrl from "@/lib/build-detail-url";
-
-import {
-  Product,
-  ProductSectionFullWidthBlock,
-  ProductWrapper,
-} from "../../interfaces";
-import { SimpleProduct } from "@msdyn365-commerce/retail-proxy";
-
-type CombinedProduct = Product & SimpleProduct;
-export default async function ProductSectionFullWidth(
-  data: ProductSectionFullWidthBlock,
-) {
-  const queryClient = getQueryClient();
-
-  const skus = data?.ProductWrapper?.map((element) => element?.product?.sku);
-
-  const e4Products = await getProductByIds.fetchData(queryClient, { id: skus });
-
-  if (!(e4Products && e4Products.length)) {
-    return null;
-  }
-
-  const productData: CombinedProduct[] = data?.ProductWrapper?.map(
-    (Product: ProductWrapper) => {
-      const e4Product = e4Products?.find(
-        (e4Product: SimpleProduct) => Product.product.sku === e4Product.ItemId,
-      );
-      if (!e4Product) return null;
-      return {
-        ...e4Product,
-        ...Product.product,
-        id: e4Product?.RecordId,
-      };
-    },
-  ).filter(Boolean) as CombinedProduct[];
-
-  const Icon = getIcon(data?.icon);
-
-  return (
-    <SectionCreator icon={<Icon />} title={data.heading} seeMoreLink="#">
-      {/* seeMoreLink should be updated when general product page is built */}
-      <BazaarCard sx={{ padding: "20px" }}>
-        <Grid container spacing={3}>
-          {productData?.map((product, i) => (
-            <Grid
-              size={{ lg: 2, md: 3, sm: 4, xs: 6 }}
-              key={(product.RecordId ?? 0) + i}
-            >
-              <NextLink
-                href={buildDetailUrl(
-                  product?.Name ?? "",
-                  product?.RecordId ?? 0,
-                )}
-                style={{ textDecoration: "none" }}
-                passHref
-              >
-                <HoverBox borderRadius={2} mb={1}>
-                  <Image
-                    src={getImageUrl(product?.image?.[0]?.formats ?? {})}
-                    alt={product.Name ?? "Product"}
-                    width={180}
-                    height={180}
-                    style={{ objectFit: "cover", borderRadius: "8px" }}
-                  />
-                </HoverBox>
-
-                <H4 fontSize={14} mb={0.5} color="black">
-                  {product.Name}
-                </H4>
-
-                <H4 fontSize={14} color="primary.main">
-                  {currency(product.Price ?? 0)}
-                </H4>
-              </NextLink>
-            </Grid>
-          ))}
-        </Grid>
-      </BazaarCard>
-    </SectionCreator>
-  );
-}

package/src/components/Blocks/Components/RichText.tsx

@@ -1,19 +0,0 @@
-"use client";
-
-import React from "react";
-import Markdown from "marked-react";
-import { Container } from "@mui/material";
-
-interface Props {
-  content: string;
-}
-
-const RichText = ({ content }: Props) => {
-  return (
-    <Container>
-      <Markdown>{content}</Markdown>
-    </Container>
-  );
-};
-
-export default RichText;

package/src/components/Blocks/Components/Seo/index.tsx

@@ -1,48 +0,0 @@
-import React from "react";
-import cmsEndPoints from "@/cms/endpoints";
-import { Helmet } from "react-helmet-async";
-import { MetaItem, SeoPageData } from "../../interfaces";
-
-// SEO Component to be populated
-// Included in storefront repo to ensure correct import of react-helmet-async,
-const Seo = (pageData: SeoPageData) => {
-  return (
-    <Helmet>
-      <title>{pageData?.title}</title>
-      <meta name="description" content={pageData?.seo?.metaDescription} />
-      <meta name="title" content={pageData?.seo?.metaTitle} />
-      <meta name="keywords" content={pageData?.seo?.metaKeywords} />
-      <meta
-        property="og:title"
-        content={pageData?.seo?.metaTitle}
-        key="og:title"
-      />
-      <meta
-        property="og:description"
-        content={pageData?.seo?.metaDescription}
-        key="og:description"
-      />
-      <meta
-        property="og:image"
-        content={cmsEndPoints.buildCmsMediaUrl(
-          pageData?.seo?.metaImage?.media?.data?.attributes?.url,
-        )}
-        key="og:image"
-      />
-      {pageData?.seo?.preventIndexing && (
-        <>
-          <meta name="robots" content="noindex"></meta>
-          <meta name="googlebot" content="noindex"></meta>
-        </>
-      )}
-      {pageData?.seo?.meta?.map((metaItem: MetaItem, i: number) => (
-        <meta name={metaItem.name} key={i} content={metaItem.content} />
-      ))}
-      <script type="application/ld+json">
-        {JSON.stringify(pageData?.seo?.structuredData)}
-      </script>
-    </Helmet>
-  );
-};
-
-export default Seo;

package/src/components/Blocks/Components/Services/index.tsx

@@ -1,21 +0,0 @@
-import React from "react";
-import Grid from "@mui/material/Grid2";
-import Container from "@mui/material/Container";
-// LOCAL CUSTOM COMPONENTS
-import ServiceCard from "./service-card";
-import {
-  ServicesBlock,
-  ServiceCard as ServiceCardItem,
-} from "../../interfaces";
-
-export default function Services(data: ServicesBlock) {
-  return (
-    <Container sx={{ marginBottom: "80px", marginTop: "80px" }}>
-      <Grid container spacing={3}>
-        {data?.Services_Card.map((item: ServiceCardItem, i: number) => (
-          <ServiceCard key={item.title + i} service={item} />
-        ))}
-      </Grid>
-    </Container>
-  );
-}

package/src/components/Blocks/Components/Services/service-card.tsx

@@ -1,73 +0,0 @@
-"use client";
-
-import React from "react";
-import Fab from "@mui/material/Fab";
-import Grid from "@mui/material/Grid2";
-import Card from "@mui/material/Card";
-import styled from "@mui/material/styles/styled";
-
-// CUSTOM ICON COMPONENTS
-import { getIcon } from "../../Icons/index";
-
-// GLOBAL CUSTOM COMPONENTS
-import {
-  H4,
-  Span,
-} from "@evenicanpm/storefront-core/src/components/_components/Typography";
-
-// CUSTOM DATA MODEL
-interface Service {
-  icon: string;
-  title: string;
-  description?: string;
-}
-
-// STYLED COMPONENTS
-const StyledFab = styled(Fab)(({ theme }) => ({
-  width: 64,
-  height: 64,
-  fontSize: "1.75rem",
-  boxShadow: theme.shadows[0],
-  backgroundColor: theme.palette.grey[200],
-  zIndex: 5,
-}));
-
-const StyledCard = styled(Card)(({ theme }) => ({
-  padding: "1.5rem",
-  //height: "100%",
-  display: "flex",
-  borderRadius: "8px",
-  alignItems: "center",
-  flexDirection: "column",
-  transition: "all 300ms ease-out",
-  ":hover": { boxShadow: theme.shadows[2] },
-}));
-
-// ==================================================
-type Props = { service: Service };
-// ==================================================
-
-export default function ServiceCard({ service }: Props) {
-  const { icon, title, description } = service;
-
-  const Icon = getIcon(icon);
-
-  return (
-    <Grid size={{ lg: 3, sm: 6, xs: 12 }} sx={{ height: 220 }}>
-      <StyledCard>
-        <StyledFab>
-          <Icon fontSize="inherit" />
-        </StyledFab>
-
-        <H4 mt={2.5} mb={1.25} textAlign="center" fontWeight={400}>
-          {title}
-        </H4>
-
-        <Span textAlign="center" color="grey.600" fontSize={14}>
-          {description ||
-            "We offer competitive prices on our 100 million plus product any range."}
-        </Span>
-      </StyledCard>
-    </Grid>
-  );
-}

package/src/components/Blocks/Components/shared/featured-product-card.tsx

@@ -1,29 +0,0 @@
-import React from "react";
-// GLOBAL CUSTOM COMPONENTS
-import HoverBox from "@evenicanpm/storefront-core/src/components/_components/HoverBox";
-import { H4 } from "@evenicanpm/storefront-core/src/components/_components/Typography";
-import Image from "@/components/Shared/Image";
-
-// ==========================================================
-type Props = { title: string; imgUrl: string };
-// ==========================================================
-
-export default function FeaturedProductCard({ imgUrl, title }: Props) {
-  return (
-    <div>
-      <HoverBox borderRadius="5px" mb={1}>
-        <Image
-          alt={title}
-          width={831}
-          height={546}
-          src={imgUrl}
-          style={{ objectFit: "cover" }}
-        />
-      </HoverBox>
-
-      <H4 fontSize={14} color={"black"} sx={{ marginBottom: 0 }}>
-        {title}
-      </H4>
-    </div>
-  );
-}

package/src/components/Blocks/Components/shared/product-category-item.tsx

@@ -1,49 +0,0 @@
-import React from "react";
-import { HtmlHTMLAttributes } from "react";
-import { styled, SxProps, Theme } from "@mui/material/styles";
-// GLOBAL CUSTOM COMPONENTS
-import { H4 } from "@evenicanpm/storefront-core/src/components/_components/Typography";
-import BazaarCard from "@evenicanpm/storefront-core/src/components/_components/BazaarCard";
-import BazaarImage from "@evenicanpm/storefront-core/src/components/_components/BazaarImage";
-
-// STYLED COMPONENT
-const StyledBazaarCard = styled(BazaarCard)(({ theme }) => ({
-  gap: "1rem",
-  display: "flex",
-  borderRadius: 5,
-  cursor: "pointer",
-  alignItems: "center",
-  padding: "0.75rem 1rem",
-  "&:hover": { boxShadow: theme.shadows[2] },
-}));
-
-// ==============================================================================
-interface Props extends HtmlHTMLAttributes<HTMLElement> {
-  title: string;
-  imgUrl?: string;
-  sx?: SxProps<Theme>;
-  isSelected?: boolean;
-}
-// ==============================================================================
-
-export default function ProductCategoryItem({
-  title,
-  imgUrl,
-  isSelected,
-  sx = {},
-  ...others
-}: Props) {
-  return (
-    <StyledBazaarCard
-      elevation={isSelected ? 2 : 0}
-      sx={{ bgcolor: isSelected ? "white" : "grey.100", ...sx }}
-      {...others}
-    >
-      {imgUrl && <BazaarImage alt="" width={30} src={imgUrl} />}
-
-      <H4 lineHeight="1" textTransform="capitalize" ellipsis>
-        {title}
-      </H4>
-    </StyledBazaarCard>
-  );
-}

package/src/components/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/_components/section-header/index";
-import ProductCard1 from "@evenicanpm/storefront-core/src/components/_components/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/Blocks/Components/shared/top-categories-card.tsx

@@ -1,66 +0,0 @@
-import React from "react";
-
-import Card from "@mui/material/Card";
-import Chip from "@mui/material/Chip";
-import styled from "@mui/material/styles/styled";
-import Image from "@/components/Shared/Image";
-// GLOBAL CUSTOM COMPONENTS
-import HoverBox from "@evenicanpm/storefront-core/src/components/_components/HoverBox";
-import { lightOrDarkText } from "@/lib/hexToLuma";
-import { useTheme } from "@mui/material/styles";
-
-// STYLED COMPONENT
-const StyledChip = styled(Chip)({
-  zIndex: 2,
-  top: "0.875rem",
-  fontSize: "10px",
-  padding: "0 8px",
-  fontWeight: "600",
-  position: "absolute",
-});
-
-// ========================================================
-interface Props {
-  title: string;
-  imgUrl: string;
-  subtitle: string;
-}
-// ========================================================
-
-export default function TopCategoriesCard({ title, subtitle, imgUrl }: Props) {
-  const theme = useTheme();
-  const color = theme.palette.secondary.main;
-  return (
-    <Card sx={{ position: "relative" }}>
-      <StyledChip
-        size="small"
-        label={title}
-        color="secondary"
-        sx={{
-          backgroundColor: "secondary.main",
-          left: 12,
-          color: lightOrDarkText(color),
-        }}
-      />
-
-      <StyledChip
-        color="default"
-        label={subtitle}
-        size="small"
-        sx={{ right: 12 }}
-      />
-
-      <HoverBox borderRadius={2}>
-        <Image
-          src={imgUrl}
-          width={1035}
-          height={348}
-          alt={title}
-          sx={{
-            objectFit: "cover",
-          }}
-        />
-      </HoverBox>
-    </Card>
-  );
-}

package/src/components/Blocks/Components/shared/top-rating-product-card.tsx

@@ -1,66 +0,0 @@
-import React from "react";
-import Rating from "@mui/material/Rating";
-// GLOBAL CUSTOM COMPONENTS
-import HoverBox from "@evenicanpm/storefront-core/src/components/_components/HoverBox";
-import Image from "@/components/Shared/Image";
-import {
-  H4,
-  Small,
-} from "@evenicanpm/storefront-core/src/components/_components/Typography";
-import { FlexRowCenter } from "@evenicanpm/storefront-core/src/components/_components/flex-box/index";
-// CUSTOM UTILS LIBRARY FUNCTION
-import { currency } from "@/lib/lib";
-
-// ======================================================
-interface Props {
-  price: number;
-  title: string;
-  imgUrl: string;
-  rating: number;
-  reviewCount?: number;
-}
-// ======================================================
-
-export default function TopRatingProductCard(props: Props) {
-  const { title, price, imgUrl, rating = 5, reviewCount = 10 } = props;
-
-  return (
-    <div>
-      <HoverBox mb={2} mx="auto" borderRadius={2}>
-        <Image
-          alt={title}
-          width={380}
-          height={380}
-          src={imgUrl}
-          style={{ objectFit: "cover", objectPosition: "center center" }}
-        />
-      </HoverBox>
-
-      <FlexRowCenter>
-        <Rating
-          size="small"
-          value={rating}
-          color="warn"
-          readOnly
-          sx={{ fontSize: 12 }}
-        />
-        <Small fontWeight={600} style={{ color: "black" }}>
-          ({reviewCount})
-        </Small>
-      </FlexRowCenter>
-
-      <H4 fontSize={14} textAlign="center" title={title} ellipsis color="black">
-        {title}
-      </H4>
-
-      <H4
-        fontSize={14}
-        textAlign="center"
-        color="primary.main"
-        sx={{ marginBottom: 0 }}
-      >
-        {currency(price)}
-      </H4>
-    </div>
-  );
-}

package/src/components/Blocks/Icons/Components/Category.tsx

@@ -1,14 +0,0 @@
-"use client";
-import { OverridableComponent } from "@mui/material/OverridableComponent";
-import React from "react";
-import createSvgIcon from "@mui/material/utils/createSvgIcon";
-import { SvgIconTypeMap } from "@mui/material/SvgIcon";
-
-const Category: OverridableComponent<SvgIconTypeMap> = createSvgIcon(
-  <svg fill="currentColor" viewBox="0 0 64 64">
-    <path d="m29 11v14a4 4 0 0 1 -4 4h-14a4 4 0 0 1 -4-4v-14a4 4 0 0 1 4-4h14a4 4 0 0 1 4 4zm24-4h-14a4 4 0 0 0 -4 4v14a4 4 0 0 0 4 4h14a4 4 0 0 0 4-4v-14a4 4 0 0 0 -4-4zm-28 28h-14a4 4 0 0 0 -4 4v14a4 4 0 0 0 4 4h14a4 4 0 0 0 4-4v-14a4 4 0 0 0 -4-4zm21 0a11 11 0 1 0 11 11 11 11 0 0 0 -11-11z" />
-  </svg>,
-  "Category",
-);
-
-export default Category;

package/src/components/Blocks/Icons/Components/DottedStar.tsx

@@ -1,40 +0,0 @@
-"use client";
-import React from "react";
-
-import createSvgIcon from "@mui/material/utils/createSvgIcon";
-
-const DottedStar = createSvgIcon(
-  <svg fill="currentColor" viewBox="0 0 24 24">
-    <path
-      d="M12.431 11.7264L11.9772 10.5867L11.5233 11.7264C11.4231 11.9784 11.1869 12.15 10.9157 12.1679L9.69147 12.2469L10.6349 13.031C10.8436 13.2047 10.9342 13.4828 10.8669 13.7457L10.5641 14.9342L11.6016 14.2785C11.8309 14.1344 12.1234 14.1344 12.3527 14.2785L13.3895 14.9336L13.0867 13.7457C13.0194 13.4828 13.11 13.2047 13.3188 13.031L14.2621 12.2469L13.0386 12.1679C12.7675 12.15 12.5313 11.9784 12.431 11.7264Z"
-      fill="#FF9101"
-    />
-    <path
-      d="M23.3423 8.60791L15.5284 8.10188L12.6302 0.821148C12.4174 0.286994 11.5372 0.286994 11.3243 0.821148L8.42618 8.10188L0.657701 8.60791C0.37 8.62647 0.123547 8.8187 0.0342556 9.09266C-0.0543326 9.36593 0.0321933 9.66666 0.253992 9.85068L6.23112 14.8567L4.29624 22.4498C4.22485 22.7285 4.33125 23.0231 4.56402 23.192C4.79744 23.3609 5.10989 23.3706 5.35292 23.2181L11.9773 19.0312L18.6009 23.2181C18.845 23.3716 19.1564 23.3616 19.3898 23.192C19.6226 23.0231 19.729 22.7292 19.6576 22.4498L17.7227 14.8567L23.746 9.85063C23.9677 9.66661 24.0543 9.36588 23.9657 9.09262C23.8764 8.8187 23.63 8.62643 23.3423 8.60791ZM16.5192 12.2009L14.5589 13.8288L15.1879 16.2978C15.2592 16.5773 15.1528 16.8711 14.9201 17.0401C14.6867 17.2095 14.3754 17.2197 14.1312 17.0662L11.9773 15.7046L9.82274 17.0662C9.5783 17.2186 9.26726 17.2097 9.03383 17.0401C8.80107 16.8711 8.69467 16.5766 8.76605 16.2978L9.39498 13.8288L7.43475 12.2009C7.21299 12.0169 7.12647 11.7161 7.21501 11.4429C7.30425 11.1689 7.55075 10.9767 7.83846 10.9581L10.3816 10.7933L11.3243 8.42591C11.5372 7.89175 12.4174 7.89175 12.6302 8.42591L13.5729 10.7933L16.1154 10.9581C16.4031 10.9767 16.6496 11.1689 16.7389 11.4429C16.8274 11.7161 16.7409 12.0169 16.5192 12.2009Z"
-      fill="#FF9101"
-    />
-    <path
-      d="M11.9993 23.58C12.3876 23.58 12.7024 23.2652 12.7024 22.8769C12.7024 22.4886 12.3876 22.1738 11.9993 22.1738C11.611 22.1738 11.2962 22.4886 11.2962 22.8769C11.2962 23.2652 11.611 23.58 11.9993 23.58Z"
-      fill="#FF9101"
-    />
-    <path
-      d="M22.0295 16.2913C22.1495 15.922 21.9473 15.5253 21.578 15.4054C21.2087 15.2854 20.8121 15.4875 20.6921 15.8568C20.5721 16.2261 20.7742 16.6228 21.1435 16.7428C21.5128 16.8628 21.9095 16.6606 22.0295 16.2913Z"
-      fill="#FF9101"
-    />
-    <path
-      d="M18.3541 5.48443C18.5824 5.1703 18.5127 4.73062 18.1986 4.50237C17.8845 4.27413 17.4448 4.34376 17.2165 4.65789C16.9883 4.97203 17.0579 5.41171 17.372 5.63995C17.6862 5.8682 18.1259 5.79857 18.3541 5.48443Z"
-      fill="#FF9101"
-    />
-    <path
-      d="M6.62693 5.63899C6.94107 5.41075 7.0107 4.97106 6.78245 4.65692C6.55421 4.34279 6.11453 4.27316 5.80039 4.5014C5.48626 4.72964 5.41663 5.16933 5.64487 5.48347C5.87311 5.7976 6.3128 5.86723 6.62693 5.63899Z"
-      fill="#FF9101"
-    />
-    <path
-      d="M2.85485 16.7449C3.22417 16.6249 3.42629 16.2283 3.3063 15.859C3.18632 15.4896 2.78966 15.2875 2.42035 15.4075C2.05104 15.5275 1.84892 15.9241 1.9689 16.2935C2.08889 16.6628 2.48554 16.8649 2.85485 16.7449Z"
-      fill="#FF9101"
-    />
-  </svg>,
-  "DottedStar",
-);
-
-export default DottedStar;

package/src/components/Blocks/Icons/Components/FallbackIcon.tsx

@@ -1,33 +0,0 @@
-"use client";
-import React from "react";
-
-import createSvgIcon from "@mui/material/utils/createSvgIcon";
-
-const FallbackIcon = createSvgIcon(
-  <svg
-    viewBox="0 0 64 64"
-    xmlns="http://www.w3.org/2000/svg"
-    aria-hidden="true"
-    role="img"
-    preserveAspectRatio="xMidYMid meet"
-    fill="#000000"
-  >
-    <g id="SVGRepo_bgCarrier" strokeWidth="0"></g>
-    <g
-      id="SVGRepo_tracerCarrier"
-      strokeLinecap="round"
-      strokeLinejoin="round"
-    ></g>
-    <g id="SVGRepo_iconCarrier">
-      <g fill="#ff5a79">
-        <path d="M6 42.4h10L20 2H2z"></path>
-        <ellipse cx="11" cy="54.4" rx="7.7" ry="7.6"></ellipse>
-        <path d="M40.2 2.1C28.6 2.8 22.5 9.4 22 21.3h11.7c.1-4.1 2.5-7.2 6.7-7.7c4.2-.4 8.2.6 9.4 3.4c1.3 3.1-1.6 6.7-3 8.2c-2.6 2.8-6.8 4.9-8.9 7.9c-2.1 3-2.5 6.9-2.7 11.7h10.3c.1-3.1.3-6 1.7-7.9c2.3-3.1 5.7-4.5 8.5-7c2.7-2.3 5.6-5.1 6-9.5c1.6-12.9-9-19.1-21.5-18.3"></path>
-        <ellipse cx="40.5" cy="55.6" rx="6.5" ry="6.4"></ellipse>
-      </g>
-    </g>
-  </svg>,
-  "FallbackIcon",
-);
-
-export default FallbackIcon;

package/src/components/Blocks/Icons/Components/GiftBox.tsx

@@ -1,18 +0,0 @@
-"use client";
-import React from "react";
-
-import createSvgIcon from "@mui/material/utils/createSvgIcon";
-
-const GiftBox = createSvgIcon(
-  <svg fill="currentColor" viewBox="0 0 22 20">
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M16.5354 0.87868C15.3638 -0.292893 13.4644 -0.292893 12.2928 0.87868L10.8786 2.29289C10.8183 2.35317 10.7611 2.41538 10.707 2.47931C10.653 2.41539 10.5958 2.3532 10.5355 2.29293L9.12132 0.878715C7.94975 -0.292858 6.05025 -0.292858 4.87868 0.878715C3.70711 2.05029 3.70711 3.94978 4.87868 5.12136L5.75732 6H0V12H2V20H20V12H22V6H15.6567L16.5354 5.12132C17.707 3.94975 17.707 2.05025 16.5354 0.87868ZM13.707 5.12132L15.1212 3.70711C15.5117 3.31658 15.5117 2.68342 15.1212 2.29289C14.7307 1.90237 14.0975 1.90237 13.707 2.29289L12.2928 3.70711C11.9023 4.09763 11.9023 4.7308 12.2928 5.12132C12.6833 5.51184 13.3165 5.51184 13.707 5.12132ZM9.12132 3.70714L7.70711 2.29293C7.31658 1.9024 6.68342 1.9024 6.29289 2.29293C5.90237 2.68345 5.90237 3.31662 6.29289 3.70714L7.70711 5.12136C8.09763 5.51188 8.7308 5.51188 9.12132 5.12136C9.51184 4.73083 9.51184 4.09767 9.12132 3.70714ZM20 8V10H2V8H20ZM11.9167 12H18V18H11.9167V12ZM10.0834 12V18H4V12H10.0834Z"
-      fill="#D23F57"
-    />
-  </svg>,
-  "GiftBox",
-);
-
-export default GiftBox;

package/src/components/Blocks/Icons/Components/Light.tsx

@@ -1,13 +0,0 @@
-"use client";
-import React from "react";
-
-import createSvgIcon from "@mui/material/utils/createSvgIcon";
-
-const Light = createSvgIcon(
-  <svg fill="currentColor" viewBox="0 0 24 24">
-    <path d="M19.0765 9.48063H12.1242L15.5905 0L5 14.5194H11.9522L8.48592 24L19.0765 9.48063Z" />
-  </svg>,
-  "Light",
-);
-
-export default Light;

package/src/components/Blocks/Icons/Components/NewArrival.tsx

@@ -1,18 +0,0 @@
-"use client";
-import React from "react";
-
-import createSvgIcon from "@mui/material/utils/createSvgIcon";
-
-const NewArrival = createSvgIcon(
-  <svg fill="currentColor" viewBox="0 0 24 24">
-    <g>
-      <path
-        d="M22.9347 12.001L24 10.1003L22.3995 8.62199L22.8254 6.48519L20.8463 5.57376L20.5911 3.40991L18.4273 3.15468L17.5158 1.17562L15.379 1.60157L13.9006 0.000976562L12 1.0663L10.0994 0.000976562L8.62106 1.60152L6.48427 1.17557L5.57283 3.15463L3.40898 3.40987L3.15375 5.57371L1.17469 6.48515L1.60064 8.62194L0 10.1003L1.06533 12.0009L0 13.9016L1.60055 15.3799L1.17459 17.5167L3.15366 18.4281L3.40889 20.592L5.57273 20.8472L6.48417 22.8263L8.62097 22.4003L10.0993 24.0009L11.9999 22.9356L13.9005 24.0009L15.3788 22.4003L17.5156 22.8263L18.4271 20.8472L20.5909 20.592L20.8462 18.4281L22.8252 17.5167L22.3993 15.3799L23.9998 13.9016L22.9347 12.001ZM8.62936 14.0641H7.61878L5.78016 11.7887V14.0641H4.50881V9.43504H5.49984L7.35802 11.7887V9.43504H8.62936V14.0641ZM12.7238 14.0641H9.42483V9.43504H12.6652V10.5434H10.6962V11.1954H12.3783V12.2255H10.6962V12.9557H12.7239V14.0641H12.7238ZM18.0765 14.0641H17.0203L16.3618 12.408L15.7098 14.0641H14.6536L12.8411 9.43504H14.2168L15.2209 12.6102L15.5403 11.6453L14.7905 9.43504H15.9576L16.3618 10.8629L16.7726 9.43504H17.9397L17.1768 11.6453L17.5094 12.6102L18.507 9.43504H19.8891L18.0765 14.0641Z"
-        fill="#68C944"
-      />
-    </g>
-  </svg>,
-  "NewArrival",
-);
-
-export default NewArrival;