import { useEffect } from "react";
import { useNavigate } from "react-router";

import { useAuth } from "~/context/AuthContext";
import { DashboardPage } from "../../components/admin/DashboardPage";
import { useScriptWorkspaceStore } from "./state/scriptWorkspaceStore";

export default function DashboardRoute() {
  const scripts = useScriptWorkspaceStore((s) => s.scripts);
  const scriptCount = useScriptWorkspaceStore((s) => s.scriptCount);
  const loadScriptCount = useScriptWorkspaceStore((s) => s.loadScriptCount);
  const apiOnline = useScriptWorkspaceStore((s) => s.apiOnline);
  const workspaceId = useAuth().currentWorkspace?.workspace_id;
  const navigate = useNavigate();

  // Reload on workspace switch — DashboardRoute is not keyed by
  // workspace/user (only ScriptsPage is), so without this dep the
  // previous workspace's count would persist.
  useEffect(() => {
    void loadScriptCount();
  }, [loadScriptCount, workspaceId]);

  return (
    <DashboardPage
      scriptCount={scriptCount ?? scripts.length}
      online={apiOnline}
      onNavigate={(page) => {
        if (page === "scripts") navigate("/scripts");
        else if (page === "schedules") navigate("/schedules");
        else navigate("/system");
      }}
    />
  );
}