// Root app — routes between Login / Super Admin / Client Workspace + state management

const App = () => {
  // Session: null = login screen; { kind, ... } when logged in
  const [session, setSession] = useState(null);

  // Super Admin can drill into a tenant in support mode
  const [tenantOpenId, setTenantOpenId] = useState(null);

  // Global SaaS state — all loaded from API, no local seed data leak into tenants
  const [tenants, setTenants] = useState([]);
  const [tenantAdmins, setTenantAdmins] = useState({});
  const [auditLog, setAuditLog] = useState([]);

  // Tenant-level state — empty by default, hydrated per-tenant from API in workspace.jsx
  const [tasks, setTasks] = useState([]);
  const [taskHistory, setTaskHistory] = useState({});
  const [comments, setComments] = useState({});
  const [users, setUsers] = useState([]);
  const [divisions, setDivisions] = useState([]);
  const [departments, setDepartments] = useState([]);
  const [positions, setPositions] = useState([]);
  const [mainProcesses, setMainProcesses] = useState([]);
  const [processes, setProcesses] = useState([]);
  const [subprocesses, setSubprocesses] = useState([]);

  // Role + user (for demo switching)
  const [currentRole, setCurrentRole] = useState("admin");
  const [currentUserId, setCurrentUserId] = useState(null);

  // Tweaks panel
  const [tweaks, setTweak] = useTweaks(TWEAK_DEFAULTS);
  const [tweaksOpen, setTweaksOpen] = useState(false);

  // Apply dark mode class to html
  useEffect(() => {
    document.documentElement.classList.toggle("dark", !!tweaks.darkMode);
  }, [tweaks.darkMode]);

  // Super admin: load tenants + audit log from API
  useEffect(() => {
    if (session?.kind !== "super_admin" || !window.apiClient) return;
    window.apiClient.getTenants().then(list => {
      if (Array.isArray(list)) setTenants(list);
    }).catch(() => {});
    window.apiClient.getAdminAuditLogs(500).then(list => {
      if (Array.isArray(list)) {
        setAuditLog(list.map(r => ({
          id: r.id, scope: "super",
          tenant_id: r.tenant_id, action: r.action,
          reason: r.details || r.action,
          performed_by: r.performed_by || "system",
          at: r.created_at,
        })));
      }
    }).catch(() => {});
  }, [session?.kind]);

  // Edit-mode protocol for host toolbar
  useEffect(() => {
    const handler = (e) => {
      if (e.data?.type === "__activate_edit_mode") setTweaksOpen(true);
      if (e.data?.type === "__deactivate_edit_mode") setTweaksOpen(false);
    };
    window.addEventListener("message", handler);
    try { window.parent.postMessage({ type:"__edit_mode_available" }, "*"); } catch {}
    return () => window.removeEventListener("message", handler);
  }, []);

  const handleLogin = (s) => {
    if (s.kind === "super_admin") {
      setSession({ kind:"super_admin", email:s.email });
    } else {
      // tenant - merge API tenant into local tenants list if not present
      if (s.tenant && !tenants.find(t => t.id === s.tenant.id)) {
        setTenants(prev => [{
          ...s.tenant,
          accent: s.tenant.accent || "indigo",
          usage: s.tenant.usage || { users: 1, active_users: 1, divisions: 0, departments: 0, positions: 0, processes: 0, tasks: 0, storage_gb: 0 },
          industry: s.tenant.industry || "—",
          plan: s.tenant.plan || "Business",
          seats: s.tenant.seats || 50,
        }, ...prev]);
      }
      // Inject the logged-in user into local users state so ProfileMenu/RoleSwitcher can find them
      if (s.user_id && !users.find(u => u.id === s.user_id)) {
        const fullName = ((s.first_name || "") + " " + (s.last_name || "")).trim() || s.email;
        setUsers(prev => [{
          id: s.user_id,
          full_name: fullName,
          email: s.email,
          employee_code: "",
          system_role: s.role,
          status: "active",
          positions: [],
          from_api: true,
        }, ...prev]);
      }
      setSession({ kind:"tenant", tenant_id: s.tenant_id, role: s.role, user_id: s.user_id, email: s.email });
      setCurrentRole(s.role);
      setCurrentUserId(s.user_id);
    }
  };

  const handleLogout = () => {
    setSession(null);
    setTenantOpenId(null);
  };

  // Login screen
  if (!session) {
    return (
      <ToastProvider>
        <LoginScreen onLogin={handleLogin}/>
      </ToastProvider>
    );
  }

  // Super Admin in support mode → render Client workspace for that tenant w/ banner
  if (session.kind === "super_admin" && tenantOpenId) {
    const tenant = tenants.find(t => t.id === tenantOpenId);
    return (
      <ToastProvider>
        <ClientWorkspace tenant={tenant}
          currentRole="admin" setCurrentRole={()=>{}}
          currentUserId={null} setCurrentUserId={()=>{}}
          onLogout={handleLogout}
          onReturnSuperAdmin={()=>setTenantOpenId(null)}
          supportMode={true}
          tweaks={tweaks} setTweak={setTweak}
          tasks={tasks} setTasks={setTasks}
          taskHistory={taskHistory} setTaskHistory={setTaskHistory}
          comments={comments} setComments={setComments}
          auditLog={auditLog} setAuditLog={setAuditLog}
          subprocesses={subprocesses} setSubprocesses={setSubprocesses}
          positions={positions} setPositions={setPositions}
          divisions={divisions} setDivisions={setDivisions}
          departments={departments} setDepartments={setDepartments}
          users={users} setUsers={setUsers}
          mainProcesses={mainProcesses} setMainProcesses={setMainProcesses}
          processes={processes} setProcesses={setProcesses}
        />
        <TweaksPanel tweaks={tweaks} setTweak={setTweak} open={tweaksOpen} onClose={()=>{ setTweaksOpen(false); window.parent.postMessage({ type:"__edit_mode_dismissed" }, "*"); }}/>
      </ToastProvider>
    );
  }

  // Super Admin
  if (session.kind === "super_admin") {
    return (
      <ToastProvider>
        <SuperAdminPortal
          tenants={tenants} setTenants={setTenants}
          auditLog={auditLog} setAuditLog={setAuditLog}
          onLogout={handleLogout}
          tenantOpen={tenantOpenId} setTenantOpen={setTenantOpenId}
          tenantAdmins={tenantAdmins} setTenantAdmins={setTenantAdmins}
        />
        <TweaksPanel tweaks={tweaks} setTweak={setTweak} open={tweaksOpen} onClose={()=>{ setTweaksOpen(false); window.parent.postMessage({ type:"__edit_mode_dismissed" }, "*"); }}/>
      </ToastProvider>
    );
  }

  // Client tenant
  const tenant = tenants.find(t => t.id === session.tenant_id);
  if (!tenant) {
    return <div className="p-10">Tenant not found.</div>;
  }
  return (
    <ToastProvider>
      <ClientWorkspace tenant={tenant}
        currentRole={currentRole} setCurrentRole={setCurrentRole}
        currentUserId={currentUserId} setCurrentUserId={setCurrentUserId}
        onLogout={handleLogout}
        tweaks={tweaks} setTweak={setTweak}
        tasks={tasks} setTasks={setTasks}
        taskHistory={taskHistory} setTaskHistory={setTaskHistory}
        comments={comments} setComments={setComments}
        auditLog={auditLog} setAuditLog={setAuditLog}
        subprocesses={subprocesses} setSubprocesses={setSubprocesses}
        positions={positions} setPositions={setPositions}
        divisions={divisions} setDivisions={setDivisions}
        departments={departments} setDepartments={setDepartments}
        users={users} setUsers={setUsers}
        mainProcesses={mainProcesses} setMainProcesses={setMainProcesses}
        processes={processes} setProcesses={setProcesses}
      />
      <TweaksPanel tweaks={tweaks} setTweak={setTweak} open={tweaksOpen} onClose={()=>{ setTweaksOpen(false); window.parent.postMessage({ type:"__edit_mode_dismissed" }, "*"); }}/>
    </ToastProvider>
  );
};

ReactDOM.createRoot(document.getElementById("root")).render(<App />);