import { NoData } from "@/assets/svgs/NoData";
import LocalePath from "@/components/UiComponents/LocalePath";
import { useTranslations } from "next-intl";
import React from "react";

interface Props {
  withoutBtn?: boolean;
  title?: string;
  hideDesc?: boolean;
}
const EmptyProducts = ({
  withoutBtn = false,
  hideDesc = false,
  title,
}: Props) => {
  const t = useTranslations();
  return (
    <div className="min-h-[300px] flex flex-col gap-4 justify-start items-center">
      <NoData className="w-[400px] h-[300px]" />
      <h3 className="text-[1.75rem] text-gray font-bold ">
        {title ? title : t("empty.no_products")}
      </h3>
      {!hideDesc && (
        <p className="font-bold text-dark">{t("empty.no_products_desc")}</p>
      )}
      {!withoutBtn && (
        <LocalePath className="app-btn mt-4 py-3.5 !min-w-[350px]" href="/">
          {t("NAV.home")}
        </LocalePath>
      )}
    </div>
  );
};

export default EmptyProducts;