loadtoagent 1.0.0 → 1.3.1

package/renderer/app-dashboard.js

@@ -3,6 +3,7 @@
 window.LoadToAgentAppFactories = window.LoadToAgentAppFactories || {};
 
 window.LoadToAgentAppFactories.createDashboard = function createDashboard(context = {}) {
+  const t = (key, params) => window.LoadToAgentI18n.t(key, params);
   const {
     $,
     esc,
@@ -11,10 +12,14 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
     state,
     compact,
     providerStyle,
+    visibleProviders = () => state.providers,
+    visibleSessions = () => ((state.snapshot && state.snapshot.sessions) || []),
+    isProviderVisible = () => true,
+    isRuntimeLoopSession = () => false,
   } = context;
 
   function renderProviderRail() {
-    $("#providerRail").innerHTML = state.providers
+    $("#providerRail").innerHTML = visibleProviders()
       .map((provider) => {
         const available = !!state.availability[provider.id];
         return `<div class="provider-rail-item ${available ? "connected" : ""}" style="${providerStyle(provider.id)}">
@@ -27,34 +32,95 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
   }
 
   function isProjectlessSession(session) {
-    if (!session || !session.cwd) return true;
+    const cwd = session && (session.originCwd || session.cwd);
+    if (!cwd) return true;
     if (typeof session.projectless === "boolean") return session.projectless;
-    const normalized = String(session.cwd).replace(/\\/g, "/").replace(/\/+$/, "");
+    const normalized = String(cwd).replace(/\\/g, "/").replace(/\/+$/, "");
     return session.provider === "codex" && session.clientKind === "codex-desktop" && /(?:^|\/)Documents\/Codex\/\d{4}-\d{2}-\d{2}\/new-chat$/i.test(normalized);
   }
 
+  function sessionOriginPath(session) {
+    return String(session && (session.originCwd || session.cwd) || "").trim();
+  }
+
+  function normalizedProjectPath(value) {
+    return String(value || "").trim().replace(/\\/g, "/").replace(/\/+$/, "").toLocaleLowerCase();
+  }
+
+  function projectContainsPath(projectPath, candidatePath) {
+    const project = normalizedProjectPath(projectPath);
+    const candidate = normalizedProjectPath(candidatePath);
+    return Boolean(project && candidate && (candidate === project || candidate.startsWith(`${project}/`)));
+  }
+
+  function projectName(projectPath) {
+    const normalized = String(projectPath || "").replace(/\\/g, "/").replace(/\/+$/, "");
+    return normalized.split("/").filter(Boolean).pop() || t("workspace.unknown");
+  }
+
+  function observedProjects() {
+    const projects = new Map();
+    const saved = state.workspaces.map((item) => ({ ...item, key: normalizedProjectPath(item.path) }));
+    saved.forEach((item) => projects.set(item.key, { path: item.path, name: item.name || projectName(item.path), saved: true, count: 0 }));
+    visibleSessions().filter((session) => !session.parentId && !isProjectlessSession(session)).forEach((session) => {
+      const originPath = sessionOriginPath(session);
+      if (!originPath) return;
+      const owner = saved
+        .filter((item) => projectContainsPath(item.path, originPath))
+        .sort((a, b) => b.key.length - a.key.length)[0];
+      const path = owner ? owner.path : originPath;
+      const key = normalizedProjectPath(path);
+      const project = projects.get(key) || { path, name: projectName(path), saved: false, count: 0 };
+      project.count += 1;
+      project.lastActivityAt = !project.lastActivityAt || Date.parse(session.updatedAt || 0) > Date.parse(project.lastActivityAt || 0)
+        ? session.updatedAt
+        : project.lastActivityAt;
+      projects.set(key, project);
+    });
+    const items = [...projects.values()];
+    const duplicateNames = new Map();
+    items.forEach((item) => duplicateNames.set(item.name.toLocaleLowerCase(), (duplicateNames.get(item.name.toLocaleLowerCase()) || 0) + 1));
+    items.forEach((item) => {
+      if (duplicateNames.get(item.name.toLocaleLowerCase()) < 2) return;
+      const parts = String(item.path).replace(/\\/g, "/").replace(/\/+$/, "").split("/").filter(Boolean);
+      item.name = parts.slice(-2).join("/") || item.name;
+    });
+    return items.sort((a, b) => Number(b.count || 0) - Number(a.count || 0)
+      || Number(b.saved) - Number(a.saved)
+      || String(a.name).localeCompare(String(b.name), uiLocale()));
+  }
+
   function sessionWorkspaceLabel(session) {
-    return isProjectlessSession(session) ? window.LoadToAgentI18n.t("ui.no_project") : (session && session.workspace) || "작업 폴더 미상";
+    return isProjectlessSession(session)
+      ? t("ui.no_project")
+      : (session && session.workspace) || projectName(sessionOriginPath(session));
   }
 
   function matchesWorkspaceFilter(session) {
     if (state.workspace === "all") return true;
     if (state.workspace === PROJECTLESS_WORKSPACE) return isProjectlessSession(session);
-    return (
-      !isProjectlessSession(session) &&
-      String((session && session.cwd) || "")
-        .toLowerCase()
-        .startsWith(state.workspace.toLowerCase())
-    );
+    return !isProjectlessSession(session) && projectContainsPath(state.workspace, sessionOriginPath(session));
   }
 
   function renderWorkspaces() {
-    const list = $("#workspaceList");
-    const projectlessCount = ((state.snapshot && state.snapshot.sessions) || []).filter((session) => !session.parentId && isProjectlessSession(session)).length;
-    list.innerHTML =
+    const lists = [$("#workspaceList"), $("#mobileWorkspaceList")].filter(Boolean);
+    const rootSessions = visibleSessions().filter((session) => !session.parentId);
+    const projects = observedProjects();
+    const projectlessCount = rootSessions.filter(isProjectlessSession).length;
+    const savedWorkspaceExists = state.workspace === "all"
+      || (state.workspace === PROJECTLESS_WORKSPACE && projectlessCount > 0)
+      || projects.some((project) => normalizedProjectPath(project.path) === normalizedProjectPath(state.workspace));
+    if (!savedWorkspaceExists) state.workspace = "all";
+    const projectButton = (item) => `<button type="button" class="workspace-item observed-project ${state.workspace === item.path ? "selected" : ""}"
+      data-workspace="${esc(item.path)}" title="${esc(item.path)}"
+      aria-label="${esc(t("project.filter_named", { name: item.name, count: item.count }))}"
+      aria-pressed="${state.workspace === item.path ? "true" : "false"}">
+      <strong>${esc(item.name)}</strong><small>${Number(item.count || 0)}</small>
+      </button>`;
+    const html =
       `<button type="button" class="workspace-item ${state.workspace === "all" ? "selected" : ""}"
         data-workspace="all" aria-pressed="${state.workspace === "all" ? "true" : "false"}">
-      <strong>${window.LoadToAgentI18n.t("ui.all_workspaces")}</strong>
+      <strong>${window.LoadToAgentI18n.t("project.all")}</strong><small>${rootSessions.length}</small>
       </button>` +
       (projectlessCount
         ? `<button type="button" class="workspace-item projectless ${state.workspace === PROJECTLESS_WORKSPACE ? "selected" : ""}"
@@ -65,34 +131,39 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
         <small>${projectlessCount}</small>
         </button>`
         : "") +
-      state.workspaces
-        .map(
-          (item) => `<div class="workspace-row">
-        <button type="button" class="workspace-item ${state.workspace === item.path ? "selected" : ""}"
-          data-workspace="${esc(item.path)}" title="${esc(item.path)}"
-          aria-pressed="${state.workspace === item.path ? "true" : "false"}">
-        <strong>${esc(item.name)}</strong>
-        </button>
+      projects.map((item) => item.saved ? `<div class="workspace-row">
+        ${projectButton(item)}
         <button type="button" class="workspace-remove" data-remove-workspace="${esc(item.path)}"
-          aria-label="${esc(item.name)} 작업 폴더를 목록에서 제거"
+          aria-label="${esc(t("workspace.remove_named", { name: item.name }))}"
           title="${esc(window.LoadToAgentI18n.t("ui.remove_from_list"))}">×</button>
-        </div>`,
-        )
-        .join("") +
-      (!state.workspaces.length ? `<div class="workspace-empty">${window.LoadToAgentI18n.t("ui.use_the_button_to_add_frequently_used_workspaces")}</div>` : "");
+        </div>` : projectButton(item)).join("") +
+      (!projects.length && !projectlessCount ? `<div class="workspace-empty">${window.LoadToAgentI18n.t("project.empty")}</div>` : "");
+    lists.forEach((list) => { list.innerHTML = html; });
+    const selectedProject = projects.find((project) => normalizedProjectPath(project.path) === normalizedProjectPath(state.workspace));
+    const mobileSummary = $("#mobileWorkspaceSummary");
+    if (mobileSummary) mobileSummary.textContent = state.workspace === "all"
+      ? t("project.all")
+      : state.workspace === PROJECTLESS_WORKSPACE
+        ? t("ui.no_project")
+        : selectedProject?.name || projectName(state.workspace);
   }
 
   function renderGlobalStats() {
-    const totals = (state.snapshot && state.snapshot.summary && state.snapshot.summary.totals) || {};
-    const sessions = (state.snapshot && state.snapshot.sessions) || [];
+    const sessions = visibleSessions();
+    const totals = {
+      active: sessions.filter((session) => session.status === "running" || session.status === "starting").length,
+      waiting: sessions.filter((session) => session.attention?.required).length,
+      usage: { total: sessions.reduce((sum, session) => sum + Number(session.usage && session.usage.total || 0), 0) },
+    };
     const rootCount = sessions.filter((session) => !session.parentId).length;
-    const helperCount = sessions.filter((session) => session.parentId).length;
+    const criticalCount = sessions.filter((session) => session.health?.level === "critical").length;
+    const riskCount = sessions.filter((session) => session.health?.level === "warning" || Number(session.context?.percent || 0) >= 75).length;
     const items = [
       [window.LoadToAgentI18n.t("ui.all_tasks"), rootCount, window.LoadToAgentI18n.t("ui.items"), ""],
       [window.LoadToAgentI18n.t("ui.ai_working_now"), totals.active || 0, window.LoadToAgentI18n.t("ui.items"), "live"],
-      [window.LoadToAgentI18n.t("ui.waiting_for_review"), totals.waiting || 0, window.LoadToAgentI18n.t("ui.items"), "alert"],
-      [window.LoadToAgentI18n.t("ui.helper_ai_history"), helperCount, window.LoadToAgentI18n.t("ui.items"), ""],
-      [window.LoadToAgentI18n.t("ui.tokens_used"), compact(totals.usage && totals.usage.total), window.LoadToAgentI18n.t("ui.items"), ""],
+      [window.LoadToAgentI18n.t("management.action_required"), totals.waiting || 0, window.LoadToAgentI18n.t("ui.items"), "alert"],
+      [window.LoadToAgentI18n.t("management.health.critical"), criticalCount, window.LoadToAgentI18n.t("ui.items"), "critical"],
+      [window.LoadToAgentI18n.t("management.risk_total"), riskCount, window.LoadToAgentI18n.t("ui.items"), "warning"],
     ];
     $("#globalStats").innerHTML = items
       .map(
@@ -104,9 +175,46 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
       )
       .join("");
     $("#navAllCount").textContent = rootCount;
-    $("#navActiveCount").textContent = totals.active || 0;
-    $("#navWaitingCount").textContent = totals.waiting || 0;
-    $("#navTmuxCount").textContent = (state.snapshot && state.snapshot.tmux && state.snapshot.tmux.summary && state.snapshot.tmux.summary.aiPanes) || 0;
+    const activeRootCount = sessions.filter((session) => !session.parentId && ["running", "starting"].includes(session.status)).length;
+    $("#navActiveCount").textContent = activeRootCount;
+    const reviewCount = sessions.filter((session) => context.managementBucket?.(session) !== "healthy").length;
+    $("#navWaitingCount").textContent = reviewCount;
+    const scheduledCount = (state.snapshot?.automations || [])
+      .filter((item) => isProviderVisible(item.provider || "codex")).length;
+    const loopCount = sessions.filter(isRuntimeLoopSession).length;
+    $("#navRuntimeCount").textContent = scheduledCount + loopCount;
+    const tmuxSessionCount = Number(state.snapshot?.tmux?.summary?.sessions || 0);
+    $("#navTmuxCount").textContent = tmuxSessionCount;
+    $("#advancedToolsCount").textContent = scheduledCount + loopCount + Number($("#navTerminalCount").textContent || 0) + tmuxSessionCount;
+    const navCounts = {
+      all: rootCount,
+      active: activeRootCount,
+      waiting: reviewCount,
+      runtime: scheduledCount + loopCount,
+      terminal: Number($("#navTerminalCount").textContent || 0),
+      tmux: tmuxSessionCount,
+    };
+    document.querySelectorAll(".nav-item[data-view]").forEach((button) => {
+      const key = {
+        all: "app.nav.home", active: "app.nav.active", waiting: "app.nav.needs_review", runtime: "app.nav.runtime",
+        terminal: "app.nav.session_terminal", tmux: "app.nav.tmux", settings: "app.nav.settings",
+      }[button.dataset.view];
+      const label = t(key);
+      const count = navCounts[button.dataset.view];
+      const unitKey = { all: "tasks", active: "tasks", waiting: "tasks", runtime: "runs", terminal: "sessions", tmux: "groups" }[button.dataset.view];
+      const unit = unitKey ? t(`quality.unit.${unitKey}`) : "";
+      const accessibleLabel = Number.isFinite(count) ? t("quality.nav_count_detailed", { label, count, unit }) : label;
+      button.setAttribute("aria-label", accessibleLabel);
+      button.setAttribute("title", accessibleLabel);
+    });
+    const advancedCount = scheduledCount + loopCount + Number($("#navTerminalCount").textContent || 0) + tmuxSessionCount;
+    $("#advancedToolsNav")?.querySelector("summary")?.setAttribute("aria-label", t("quality.nav_count_detailed", {
+      label: t("management.advanced_tools"), count: advancedCount, unit: t("quality.unit.items"),
+    }));
+    const tmuxShortcut = $("#openTmuxFromAgentWork");
+    $("#agentWorkTmuxCount").textContent = tmuxSessionCount;
+    tmuxShortcut.dataset.i18nParams = JSON.stringify({ count: tmuxSessionCount });
+    tmuxShortcut.setAttribute("aria-label", t("graph.open_tmux_workspace_count", { count: tmuxSessionCount }));
   }
 
   function formatBytes(value) {
@@ -159,7 +267,7 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
       ],
       downloaded: [
         "✓", window.LoadToAgentI18n.t("ui.ready_to_install"), window.LoadToAgentI18n.t("ui.the_update_file_is_ready"),
-        window.LoadToAgentI18n.t("ui.open_the_installer_and_follow_its_instructions_to_finish_updating"),
+        window.LoadToAgentI18n.t("settings.update.auto_install_restart"),
       ],
       error: [
         "!", window.LoadToAgentI18n.t("ui.check_failed"), window.LoadToAgentI18n.t("ui.could_not_check_for_updates"),
@@ -202,7 +310,7 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
     install.textContent = downloading
       ? window.LoadToAgentI18n.t("ui.downloading_2")
       : downloaded
-        ? window.LoadToAgentI18n.t("ui.open_installer")
+        ? `${window.LoadToAgentI18n.t("settings.update.download")} · ${window.LoadToAgentI18n.t("ui.restart")}`
         : window.LoadToAgentI18n.t("settings.update.download");
     const progress = $("#updateProgress");
     progress.classList.toggle("hidden", !downloading && !downloaded);
@@ -210,11 +318,13 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
     $("#updateProgressBar").style.width = `${Math.max(0, Math.min(100, Number(update.progress || 0)))}%`;
     $(".update-progress-track").setAttribute("aria-valuenow", String(Math.max(0, Math.min(100, Number(update.progress || 0)))));
     $("#updateProgressBytes").textContent = downloaded
-      ? `${formatBytes(update.totalBytes || update.downloadedBytes)} · 파일 검증 완료`
+      ? `${formatBytes(update.totalBytes || update.downloadedBytes)} · ${window.LoadToAgentI18n.t("settings.update.file_verified")}`
       : `${formatBytes(update.downloadedBytes)} / ${update.totalBytes ? formatBytes(update.totalBytes) : window.LoadToAgentI18n.t("ui.checking_size")}`;
     const error = $("#updateError");
     error.classList.toggle("hidden", !update.error);
-    error.textContent = update.error || "";
+    error.textContent = update.error
+      ? window.LoadToAgentI18n.errorText(update.error, "ui.could_not_check_for_updates")
+      : "";
     const notes = $("#releaseNotes");
     notes.classList.toggle("hidden", !update.latestVersion);
     $("#releaseNotesText").textContent =
@@ -231,22 +341,29 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
   function renderProviderOverview() {
     pruneProviderFilters();
     const summaries = (state.snapshot && state.snapshot.summary && state.snapshot.summary.providers) || state.providers;
-    const sessions = (state.snapshot && state.snapshot.sessions) || [];
-    $("#providerOverview").innerHTML = summaries
-      .map((provider) => {
+    const sessions = visibleSessions();
+    const visibleSummaries = summaries.filter((provider) => isProviderVisible(provider.id));
+    const overviewTabStopId = state.providerFilters.size ? [...state.providerFilters][0] : visibleSummaries[0]?.id;
+    $("#providerOverview").innerHTML = visibleSummaries
+      .map((provider, index) => {
         const rootCount = sessions.filter((session) => session.provider === provider.id && !session.parentId).length;
         const selected = state.providerFilters.has(provider.id);
+        const tabStop = provider.id === overviewTabStopId;
         return `<button type="button" class="provider-overview-card ${selected ? "selected" : ""}"
           data-provider-card="${esc(provider.id)}"
           data-motion-key="provider:${esc(provider.id)}"
           data-motion-value="${provider.active || 0}:${rootCount}:${(provider.usage && provider.usage.total) || 0}"
           style="${providerStyle(provider.id)}"
+          tabindex="${tabStop ? "0" : "-1"}"
           aria-pressed="${selected ? "true" : "false"}">
       <div class="poc-head">
         <span class="provider-mark">${esc(provider.mark)}</span>
         <div><strong>${esc(provider.label)}</strong><small>${esc(provider.company)}</small></div>
-        <span class="poc-state ${provider.installed ? "online" : ""}">
-          ${provider.installed ? window.LoadToAgentI18n.t("ui.available") : window.LoadToAgentI18n.t("ui.setup_required")}
+        <span class="poc-head-states">
+          <span class="poc-filter-state ${selected ? "visible" : ""}" aria-hidden="true">✓ ${window.LoadToAgentI18n.t("filter.applied")}</span>
+          <span class="poc-state ${provider.installed ? "online" : ""}">
+            ${provider.installed ? window.LoadToAgentI18n.t("ui.available") : window.LoadToAgentI18n.t("ui.setup_required")}
+          </span>
         </span>
       </div>
       <div class="poc-metrics">
@@ -260,7 +377,7 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
   }
 
   function pruneProviderFilters() {
-    const valid = new Set(state.providers.map((provider) => provider.id));
+    const valid = new Set(visibleProviders().map((provider) => provider.id));
     for (const id of [...state.providerFilters]) if (!valid.has(id)) state.providerFilters.delete(id);
     if (valid.size > 0 && state.providerFilters.size === valid.size) state.providerFilters.clear();
   }
@@ -270,27 +387,29 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
     if (providerId === "all") state.providerFilters.clear();
     else if (state.providerFilters.has(providerId)) state.providerFilters.delete(providerId);
     else state.providerFilters.add(providerId);
-    if (state.providers.length > 0 && state.providerFilters.size === state.providers.length) state.providerFilters.clear();
+    if (visibleProviders().length > 0 && state.providerFilters.size === visibleProviders().length) state.providerFilters.clear();
   }
 
   function renderProviderFilter() {
     pruneProviderFilters();
     const allSelected = state.providerFilters.size === 0;
+    const tabStopId = allSelected ? "all" : [...state.providerFilters][0];
     const button = (id, label, mark = "") => {
       const selected = id === "all" ? allSelected : state.providerFilters.has(id);
       return `<button type="button" class="provider-filter-chip ${selected ? "selected" : ""}"
-        data-provider-filter="${esc(id)}" aria-pressed="${selected ? "true" : "false"}">
-        ${mark ? `<span aria-hidden="true">${esc(mark)}</span>` : ""}<b>${esc(label)}</b>
+        data-provider-filter="${esc(id)}" tabindex="${id === tabStopId ? "0" : "-1"}" aria-pressed="${selected ? "true" : "false"}">
+        <i class="provider-filter-check" aria-hidden="true">✓</i>
+        ${mark ? `<span class="provider-filter-mark" aria-hidden="true">${esc(mark)}</span>` : ""}<b>${esc(label)}</b>
       </button>`;
     };
     $("#providerFilter").innerHTML =
       button("all", window.LoadToAgentI18n.t("ui.all_ai")) +
-      state.providers.map((provider) => button(provider.id, provider.label, provider.mark)).join("");
+      visibleProviders().map((provider) => button(provider.id, provider.label, provider.mark)).join("");
   }
 
   function announceProviderFilter() {
     const labels = state.providerFilters.size
-      ? state.providers.filter((provider) => state.providerFilters.has(provider.id)).map((provider) => provider.label).join(", ")
+      ? visibleProviders().filter((provider) => state.providerFilters.has(provider.id)).map((provider) => provider.label).join(", ")
       : window.LoadToAgentI18n.t("ui.all_ai");
     $("#providerFilterStatus").textContent = window.LoadToAgentI18n.t("filter.result_summary", {
       providers: labels,
@@ -299,16 +418,16 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
   }
 
   function filteredSessions() {
-    const allSessions = [...((state.snapshot && state.snapshot.sessions) || [])];
+    const allSessions = [...visibleSessions()];
     let sessions = state.view === "waiting" ? allSessions : allSessions.filter((session) => !session.parentId);
     if (state.view === "active") sessions = sessions.filter((session) => session.status === "running" || session.status === "starting");
-    if (state.view === "waiting") sessions = sessions.filter((session) => session.status === "waiting");
+    if (state.view === "waiting") sessions = sessions.filter((session) => session.attention?.required || ["critical", "warning", "unknown"].includes(session.health?.level) || !session.health);
     if (state.providerFilters.size) sessions = sessions.filter((session) => state.providerFilters.has(session.provider));
     sessions = sessions.filter(matchesWorkspaceFilter);
-    const query = state.search.trim().toLowerCase();
+    const query = state.search.replace(/\s+/g, " ").trim().toLowerCase();
     if (query) {
       sessions = sessions.filter((session) =>
-        [session.title, session.model, session.cwd, session.agentName, ...(session.messages || []).slice(-12).map((item) => item.text)]
+        [session.title, session.model, session.originCwd, session.cwd, session.workspace, session.agentName, ...(session.messages || []).slice(-12).map((item) => item.text)]
           .join(" ")
           .toLowerCase()
           .includes(query),
@@ -326,13 +445,13 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
   }
 
   function graphFilteredSessions() {
-    let sessions = [...((state.snapshot && state.snapshot.sessions) || [])];
+    let sessions = [...visibleSessions()];
     if (state.providerFilters.size) sessions = sessions.filter((session) => state.providerFilters.has(session.provider));
     sessions = sessions.filter(matchesWorkspaceFilter);
-    const query = state.search.trim().toLowerCase();
+    const query = state.search.replace(/\s+/g, " ").trim().toLowerCase();
     if (query)
       sessions = sessions.filter((session) =>
-        [session.title, session.model, session.cwd, session.agentName, session.agentRole, ...(session.messages || []).map((item) => item.text)]
+        [session.title, session.model, session.originCwd, session.cwd, session.workspace, session.agentName, session.agentRole, ...(session.messages || []).map((item) => item.text)]
           .join(" ")
           .toLowerCase()
           .includes(query),
@@ -340,9 +459,28 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
     return sessions;
   }
 
+  function renderProviderVisibilitySettings() {
+    const list = $("#providerVisibilityList");
+    if (!list) return;
+    list.innerHTML = state.providers.map((provider) => {
+      const visible = isProviderVisible(provider.id);
+      const status = window.LoadToAgentI18n.t(visible ? "settings.providers.visible" : "settings.providers.hidden");
+      return `<label class="provider-visibility-option ${visible ? "enabled" : "disabled"}" style="${providerStyle(provider.id)}">
+        <span class="provider-mark" aria-hidden="true">${esc(provider.mark)}</span>
+        <span class="provider-visibility-name"><b>${esc(provider.label)}</b><small>${esc(provider.company)}</small></span>
+        <span class="provider-visibility-status">${esc(status)}</span>
+        <input type="checkbox" data-provider-visibility="${esc(provider.id)}" ${visible ? "checked" : ""}
+          aria-label="${esc(`${provider.label} ${status}`)}">
+        <span class="provider-toggle" aria-hidden="true"><i></i></span>
+      </label>`;
+    }).join("");
+  }
+
   return {
     renderProviderRail,
     isProjectlessSession,
+    sessionOriginPath,
+    observedProjects,
     sessionWorkspaceLabel,
     matchesWorkspaceFilter,
     renderWorkspaces,
@@ -357,5 +495,6 @@ window.LoadToAgentAppFactories.createDashboard = function createDashboard(contex
     announceProviderFilter,
     filteredSessions,
     graphFilteredSessions,
+    renderProviderVisibilitySettings,
   };
 };