/* eslint-disable @typescript-eslint/no-explicit-any */
import { BASE_URL } from "@/components/main/BaseUrl";
import React from "react";
import { cookies } from "next/headers";
import { IProjectRequest, Project, SelectedUser } from "@/types/types";
import Container from "@/components/elements/Container";
import MainProjectCard from "@/components/projects/MainProjectCard";
import { statusMap } from "@/constants";
import ProjectWorkroomSelectedUser from "@/components/projects/Workroom/ProjectWorkroomSelectedUser";
import ProjectRequests from "@/components/projects/ProjectPage/ProjectRequests";
import { getServerLanguage } from "@/lib/i18n/server";
import { translateCommon } from "@/lib/i18n/translate";
import type { AppLanguage } from "@/lib/i18n/registry";

interface IProjectProps {
  params: Promise<{ id: string }>;
}

const getAdStatusAndColor = (statusType: string, lang: AppLanguage) => {
  const entry = statusMap[statusType as keyof typeof statusMap];
  if (!entry) {
    return {
      label: translateCommon(lang, "constants.unknown"),
      color: "#000",
    };
  }
  return {
    label: translateCommon(lang, entry.labelKey),
    color: entry.color,
  };
};

async function ProjectPage({ params }: IProjectProps) {
  const { id } = await params;
  const lang = await getServerLanguage();
  const token = (await cookies()).get("token")?.value || "";

  try {
    const response = await fetch(`${BASE_URL}/workroom/get?projectId=${id}`, {
      cache: "no-store",
      headers: {
        Authorization: token ? `Bearer ${token}` : "",
      },
    });

    if (!response.ok) {
      throw new Error(`Fetch failed: ${response.status}`);
    }

    const data = await response.json();
    const project = data.project as Project;
    const projectRequests = data.projectRequests as IProjectRequest[];
    const { label } = getAdStatusAndColor(project?.status, lang);
    let selectedUser;
    if (project?.selected_user) {
      selectedUser = project?.selected_user as SelectedUser;
    }
    console.log(data);

    return (
      <Container>
        <h1 className="font-bold text-xl text-center line-clamp-2 mb-5 mt-10">
          {project?.title}
        </h1>
        <div className="px-4">
          <MainProjectCard
            color="#fff"
            borderColor="#ccc"
            textColor="#111"
            statusType={label}
            project={project}
            full={true}
          />
          {/* {status == "ongoing" && selected_user && (
            <ProjectWorkroomRate
              projectId={id}
              selected_user={selected_user}
            />
          )} */}
          <>
            {project?.status == "done" && selectedUser && (
              <ProjectWorkroomSelectedUser selectedUser={selectedUser} />
            )}
            <p className="my-4 text-center font-semibold">
              {translateCommon(lang, "settings.workroom.projectRequestsHeading")}
            </p>
            <ProjectRequests projectRequests={projectRequests} />
          </>
        </div>
      </Container>
    );
  } catch (error: any) {
    return (
      <Container>
        <h1 className="text-red-500 text-center mt-10">
          {translateCommon(lang, "settings.workroom.fetchError")}
        </h1>
        {error.data}
      </Container>
    );
  }
}

export default ProjectPage;
