"use client";

import { useCartStore } from "@/app/store/cartStore";
import LangLink from "@/components/ui/localization/LangLink";
import { images } from "@/lib/images";
import Image from "next/image";

const CartIcon = ({
  closeSideMenu = () => {},
}: {
  closeSideMenu: () => void;
}) => {
  const { cart } = useCartStore();
  return (
    <div className="rounded-full w-8 h-8 relative" onClick={closeSideMenu}>
      <LangLink href="cart">
        <Image
          className="w-full h-full invert lg:invert-0"
          src={images.bag2}
          alt="user profile"
        />
      </LangLink>
      <div
        hidden={!cart?.length}
        className="rounded-full w-3 h-3 bg-red-500 absolute -top-1 -right-1"
      />
    </div>
  );
};

export default CartIcon;