"use client";

import { Typography } from "@material-tailwind/react";
import Image from "next/image";

import emptyBox from "../../public/img/empty-box.png";
import { _useScopedI18n } from "../i18n/client";

export default function EmptyCartMessageComponent() {
  const scopeT = _useScopedI18n("sharedComponents.emptyCartMessageComponent");

  return (
    <>
      <div className="flex items-center justify-center flex-col w-full h-full">
        <Image src={emptyBox.src} alt="emptyBox" width={100} height={100} />
        <Typography
          variant="h6"
          className="text-base font-medium text-slate-400"
        >
          {scopeT("title")}
        </Typography>
      </div>
    </>
  );
}
