"use client";

import { useParams } from "next/navigation";

import { useViewStore } from "@/lib/stores/view-store";
import { ListView } from "@/components/views/list";
import { BoardView } from "@/components/views/board";
import { TableView } from "@/components/views/table";
import { EmbedView } from "@/components/views/embed";
import { OverviewView } from "@/components/views/overview/overview-view";
import { FormView } from "@/components/views/form/form-view";

export default function ProjectPage() {
  const params = useParams();
  const workspaceSlug =
    typeof params?.workspaceSlug === "string" ? params.workspaceSlug : undefined;
  const projectId =
    typeof params?.projectId === "string" ? params.projectId : undefined;

  const activeView = useViewStore((s) => s.activeView);
  const config = useViewStore((s) => s.config);

  switch (activeView) {
    case "board":
      return <BoardView config={config} />;
    case "table":
      return <TableView config={config} />;
    case "embed":
      return <EmbedView config={config} />;
    case "overview":
      return (
        <OverviewView workspaceId={workspaceSlug} spaceId={projectId} />
      );
    case "form":
      return <FormView config={config} />;
    case "list":
    default:
      return <ListView config={config} />;
  }
}