"use client";

import SiteBreadcrumb from "@/components/site-breadcrumb";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import ContestTable from "./components/contest-table";
import { Link } from "@/components/navigation";
import { Button } from "@/components/ui/button";
import { UploadIcon } from "lucide-react";
import { getCookiesDecrypt } from "@/lib/utils";
import { useEffect, useState } from "react";
import { useTranslations } from "next-intl";

const ContestPage = () => {
  const [userLevelId, setUserLevelId] = useState<any>(null);
  const t = useTranslations("Contest");
  const levelNumber = Number(getCookiesDecrypt("ulne"));

  useEffect(() => {
    setUserLevelId(Number(getCookiesDecrypt("ulie")));
  }, []);
  return (
    <div>
      <SiteBreadcrumb />
      <div className="space-y-4">
        <Card>
          <CardHeader className="border-b border-solid border-default-200 mb-6">
            <CardTitle>
              <div className="flex items-center">
                <div className="flex-1 text-xl font-medium text-default-900">
                  {t("table", { defaultValue: "Table" })}{" "}
                  {t("contest", { defaultValue: "Contest" })}
                </div>
                {userLevelId !== 776 &&
                  userLevelId !== null &&
                  levelNumber !== 3 && (
                    <div className="flex-none">
                      <Link href={"/shared/contest/create"}>
                        <Button color="primary" className="text-white">
                          <UploadIcon size={18} className="mr-2" />
                          {t("create-contest", {
                            defaultValue: "Create Contest",
                          })}
                        </Button>
                      </Link>
                    </div>
                  )}

                {/* {userLevelId !== 776 && userLevelId !== null && (
                  <div className="flex-none">
                    <Link href={"/shared/contest/create"}>
                      <Button color="primary" className="text-white">
                        <UploadIcon size={18} className="mr-2" />
                        {t("create-contest", {
                          defaultValue: "Create Contest",
                        })}
                      </Button>
                    </Link>
                  </div>
                )} */}
              </div>
            </CardTitle>
          </CardHeader>
          <CardContent className="p-0">
            <ContestTable />
          </CardContent>
        </Card>
      </div>
    </div>
  );
};

export default ContestPage;