loadtoagent 1.0.0 → 1.3.1

package/renderer/app-events-dialogs.js

@@ -3,18 +3,22 @@
 window.LoadToAgentAppFactories = window.LoadToAgentAppFactories || {};
 
 window.LoadToAgentAppFactories.createDialogEventBindings = function createDialogEventBindings(context = {}) {
+  const t = (key, params) => window.LoadToAgentI18n.t(key, params);
   const {
-    $, $$, state, providerInfo, renderProviderRail, scheduleAgentWorkflowConnections, resumeAgentTerminal, loadSessionDetail,
+    $, $$, state, providerInfo, visibleProviders = () => state.providers, renderProviderRail, scheduleAgentWorkflowConnections, resumeAgentTerminal, loadSessionDetail,
     closeDrawer, renderDrawer, providerPickerHtml, syncRunComposer, openRunModal, closeRunModal, toast, performUiAction,
-    handleRun, trapDialogFocus,
+    handleRun, trapDialogFocus, currentDialog, selectView, saveRunDraft = () => {}, safeBackdrop = null,
+    copyText = async () => false,
+    dispatchAgentCommand, controlManagedRun, quickRespond, prepareReassignment,
   } = context;
 
   function bindRunComposerEvents() {
     $("#newRunBtn").addEventListener("click", openRunModal);
     $$("[data-open-run]").forEach((button) => button.addEventListener("click", openRunModal));
-    $("#closeRunModalBtn").addEventListener("click", closeRunModal);
-    $("#cancelRunBtn").addEventListener("click", closeRunModal);
-    $("#runModal").addEventListener("click", (event) => {
+    $("#closeRunModalBtn").addEventListener("click", () => closeRunModal());
+    $("#cancelRunBtn").addEventListener("click", () => closeRunModal());
+    if (safeBackdrop) safeBackdrop($("#runModal"), () => closeRunModal());
+    else $("#runModal").addEventListener("click", (event) => {
       if (event.target === $("#runModal")) closeRunModal();
     });
     $("#runProviderPicker").addEventListener("click", (event) => {
@@ -23,6 +27,20 @@ window.LoadToAgentAppFactories.createDialogEventBindings = function createDialog
       state.runProvider = button.dataset.runProvider;
       $("#runProviderPicker").innerHTML = providerPickerHtml();
       syncRunComposer();
+      saveRunDraft();
+    });
+    $("#runProviderPicker").addEventListener("keydown", (event) => {
+      if (!["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"].includes(event.key)) return;
+      const options = $$("#runProviderPicker [data-run-provider]:not(:disabled)");
+      const current = Math.max(0, options.indexOf(event.target.closest("[data-run-provider]")));
+      const next = event.key === "Home"
+        ? 0
+        : event.key === "End"
+          ? options.length - 1
+          : (current + (["ArrowRight", "ArrowDown"].includes(event.key) ? 1 : -1) + options.length) % options.length;
+      event.preventDefault();
+      options[next]?.click();
+      requestAnimationFrame(() => $("#runProviderPicker").querySelector(`[data-run-provider="${CSS.escape(state.runProvider)}"]`)?.focus());
     });
     $("#runProviderHelp").addEventListener("click", async (event) => {
       const docs = event.target.closest("[data-provider-docs]");
@@ -31,31 +49,33 @@ window.LoadToAgentAppFactories.createDialogEventBindings = function createDialog
         if (provider.docs)
           await performUiAction(async () => {
             const result = await window.loadtoagent.openExternal(provider.docs);
-            if (!result || result.ok === false) throw new Error("공식 설치 문서를 열지 못했습니다.");
-          }, "공식 설치 문서를 열지 못했습니다.");
+            if (!result || result.ok === false) throw new Error(t("run.docs_open_failed"));
+          }, t("run.docs_open_failed"), docs);
         return;
       }
-      if (event.target.closest("[data-provider-recheck]")) {
-        const nextAvailability = await performUiAction(() => window.loadtoagent.probeProviders(), "AI CLI 연결 상태를 확인하지 못했습니다.");
+      const recheck = event.target.closest("[data-provider-recheck]");
+      if (recheck) {
+        const nextAvailability = await performUiAction(() => window.loadtoagent.probeProviders(), t("run.cli_check_failed"), recheck);
         if (!nextAvailability) return;
         state.availability = nextAvailability;
-        const installed = state.providers.find((provider) => state.availability[provider.id]);
+        const installed = visibleProviders().find((provider) => state.availability[provider.id]);
         if (installed) state.runProvider = installed.id;
         $("#runProviderPicker").innerHTML = providerPickerHtml();
         renderProviderRail();
         syncRunComposer();
-        toast(installed ? `${installed.label} CLI를 찾았습니다. 이제 작업을 시작할 수 있어요.` : "아직 설치된 AI CLI를 찾지 못했습니다. 설치와 로그인을 확인해 주세요.");
+        toast(installed ? t("run.cli_ready", { provider: installed.label }) : t("run.cli_not_found"));
       }
     });
     $("#runPrompt").addEventListener("input", syncRunComposer);
     $(".run-prompt-examples").addEventListener("click", (event) => {
-      const example = event.target.closest("[data-run-prompt-example]");
+      const example = event.target.closest("[data-run-prompt-key]");
       if (!example) return;
       const input = $("#runPrompt");
-      const text = example.dataset.runPromptExample;
+      const text = t(example.dataset.runPromptKey);
       if (!input.value.trim()) input.value = text;
       else input.setRangeText(`${input.selectionStart ? "\n\n" : ""}${text}`, input.selectionStart, input.selectionEnd, "end");
       syncRunComposer();
+      saveRunDraft();
       input.focus();
     });
     $("#runWorkspaceSuggestions").addEventListener("click", (event) => {
@@ -63,14 +83,28 @@ window.LoadToAgentAppFactories.createDialogEventBindings = function createDialog
       if (!workspace) return;
       $("#runCwd").value = workspace.dataset.runWorkspace;
       syncRunComposer();
+      saveRunDraft();
+    });
+    $("#runWorkspaceSuggestions").addEventListener("keydown", (event) => {
+      if (!["ArrowLeft", "ArrowRight", "Home", "End"].includes(event.key)) return;
+      const options = $$("#runWorkspaceSuggestions [data-run-workspace]");
+      const current = Math.max(0, options.indexOf(event.target.closest("[data-run-workspace]")));
+      const next = event.key === "Home"
+        ? 0
+        : event.key === "End"
+          ? options.length - 1
+          : (current + (event.key === "ArrowRight" ? 1 : -1) + options.length) % options.length;
+      event.preventDefault();
+      options[next]?.focus();
     });
     $("#runCwd").addEventListener("input", syncRunComposer);
     $("#allowWrites").addEventListener("change", syncRunComposer);
     $("#pickRunCwdBtn").addEventListener("click", async () => {
-      const folder = await performUiAction(() => window.loadtoagent.pickWorkspace(), "작업 폴더를 선택하지 못했습니다.");
+      const folder = await performUiAction(() => window.loadtoagent.pickWorkspace(), t("workspace.pick_failed"), $("#pickRunCwdBtn"));
       if (folder) {
         $("#runCwd").value = folder;
         syncRunComposer();
+        saveRunDraft();
       }
     });
     $("#runForm").addEventListener("keydown", (event) => {
@@ -80,11 +114,27 @@ window.LoadToAgentAppFactories.createDialogEventBindings = function createDialog
       }
     });
     $("#runForm").addEventListener("submit", handleRun);
+    $("#runForm").addEventListener("invalid", (event) => {
+      event.target.setAttribute("aria-invalid", "true");
+      if (!$("#runForm").dataset.invalidFocusQueued) {
+        $("#runForm").dataset.invalidFocusQueued = "true";
+        queueMicrotask(() => {
+          delete $("#runForm").dataset.invalidFocusQueued;
+          $("#runForm").querySelector(":invalid")?.focus({ preventScroll: true });
+        });
+      }
+    }, true);
+    $("#runForm").addEventListener("input", (event) => {
+      if (event.target.matches("input, textarea, select") && event.target.checkValidity()) event.target.removeAttribute("aria-invalid");
+      $("#runError").classList.add("hidden");
+      $("#runError").textContent = "";
+    });
   }
 
   function bindDrawerAndGlobalEvents() {
     $("#closeDrawerBtn").addEventListener("click", closeDrawer);
-    $("#drawerBackdrop").addEventListener("click", closeDrawer);
+    if (safeBackdrop) safeBackdrop($("#drawerBackdrop"), closeDrawer, $("#detailDrawer"));
+    else $("#drawerBackdrop").addEventListener("click", closeDrawer);
     $(".drawer-tabs").addEventListener("click", (event) => {
       const tab = event.target.closest("[data-tab]");
       if (tab) {
@@ -94,7 +144,8 @@ window.LoadToAgentAppFactories.createDialogEventBindings = function createDialog
       }
     });
     $(".drawer-tabs").addEventListener("keydown", (event) => {
-      if (!["ArrowLeft", "ArrowRight", "Home", "End"].includes(event.key)) return;
+      const pageKey = event.ctrlKey && ["PageUp", "PageDown"].includes(event.key);
+      if (!pageKey && !["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"].includes(event.key)) return;
       const tabs = $$(".drawer-tab:not(.hidden)");
       const current = Math.max(0, tabs.indexOf(event.target.closest(".drawer-tab")));
       const next =
@@ -102,7 +153,7 @@ window.LoadToAgentAppFactories.createDialogEventBindings = function createDialog
           ? 0
           : event.key === "End"
             ? tabs.length - 1
-            : (current + (event.key === "ArrowRight" ? 1 : -1) + tabs.length) % tabs.length;
+            : (current + (["ArrowRight", "ArrowDown", "PageDown"].includes(event.key) ? 1 : -1) + tabs.length) % tabs.length;
       event.preventDefault();
       state.drawerTab = tabs[next].dataset.tab;
       state.drawerForceLatest = state.drawerTab === "chat";
@@ -110,14 +161,50 @@ window.LoadToAgentAppFactories.createDialogEventBindings = function createDialog
       $(`.drawer-tab[data-tab="${state.drawerTab}"]`)?.focus();
     });
     $("#detailDrawer").addEventListener("click", async (event) => {
+      const copy = event.target.closest("[data-copy-text]");
+      if (copy) {
+        await copyText(copy.dataset.copyText);
+        return;
+      }
       const resume = event.target.closest("[data-resume-agent]");
       if (resume) {
-        await resumeAgentTerminal(resume.dataset.resumeAgent);
+        if (resume.dataset.busy === "true") return;
+        resume.dataset.busy = "true";
+        resume.disabled = true;
+        resume.setAttribute("aria-busy", "true");
+        try {
+          await resumeAgentTerminal(resume.dataset.resumeAgent);
+        } finally {
+          if (resume.isConnected) {
+            delete resume.dataset.busy;
+            resume.disabled = false;
+            resume.removeAttribute("aria-busy");
+          }
+        }
+        return;
+      }
+      const quick = event.target.closest("[data-attention-quick]");
+      if (quick) {
+        quickRespond(quick.dataset.attentionSessionId || state.selectedId, quick.dataset.attentionQuick, $("#detailDrawer"));
+        return;
+      }
+      const managedAction = event.target.closest("[data-managed-run-action]");
+      if (managedAction) {
+        await controlManagedRun(managedAction.dataset.managementSessionId || state.selectedId, managedAction.dataset.managedRunAction);
+        return;
+      }
+      const reassign = event.target.closest("[data-reassign-session]");
+      if (reassign) {
+        prepareReassignment(reassign.dataset.reassignSession);
         return;
       }
       const retry = event.target.closest("[data-retry-detail]");
       if (retry) {
-        loadSessionDetail(retry.dataset.retryDetail, true);
+        if (retry.dataset.busy === "true") return;
+        retry.dataset.busy = "true";
+        retry.disabled = true;
+        retry.setAttribute("aria-busy", "true");
+        await loadSessionDetail(retry.dataset.retryDetail, true);
         return;
       }
       const latest = event.target.closest("[data-scroll-latest]");
@@ -127,33 +214,55 @@ window.LoadToAgentAppFactories.createDialogEventBindings = function createDialog
         return;
       }
       const stop = event.target.closest("[data-stop-run]");
-      if (!stop) return;
-      const runId = stop.dataset.stopRun;
-      if (state.stopRequests.has(runId)) return;
-      state.stopRequests.add(runId);
-      renderDrawer();
-      try {
-        const result = await window.loadtoagent.stopAgent(runId);
-        toast(result.ok ? window.LoadToAgentI18n.t("ui.stop_request_sent") : result.error);
-      } catch (error) {
-        toast((error && error.message) || window.LoadToAgentI18n.t("ui.could_not_send_the_stop_request"));
-      } finally {
-        state.stopRequests.delete(runId);
-        if (state.selectedId) renderDrawer();
-      }
+      if (stop) await controlManagedRun(state.selectedId, "stop");
+    });
+    $("#detailDrawer").addEventListener("input", (event) => {
+      const input = event.target.closest("[data-agent-command-draft]");
+      if (input) state.agentCommandDrafts.set(input.dataset.agentCommandDraft, input.value);
+    });
+    $("#detailDrawer").addEventListener("change", (event) => {
+      const picker = event.target.closest("[data-agent-command-target]");
+      if (!picker) return;
+      if (picker.value) state.agentCommandTargets.set(picker.dataset.agentCommandTarget, picker.value);
+      else state.agentCommandTargets.delete(picker.dataset.agentCommandTarget);
+      picker.closest("form")?.querySelectorAll("button").forEach(button => { button.disabled = !picker.value; });
+    });
+    $("#detailDrawer").addEventListener("keydown", (event) => {
+      const input = event.target.closest("[data-agent-command-draft]");
+      if (!input || event.key !== "Enter" || event.shiftKey || event.isComposing || event.keyCode === 229) return;
+      event.preventDefault();
+      input.closest("form")?.requestSubmit();
+    });
+    $("#detailDrawer").addEventListener("submit", (event) => {
+      const form = event.target.closest("[data-agent-command-form]");
+      if (!form) return;
+      event.preventDefault();
+      dispatchAgentCommand(form.dataset.agentCommandForm, form);
     });
     document.addEventListener("keydown", (event) => {
       trapDialogFocus(event);
-      if (event.key.toLowerCase() === "n" && (event.metaKey || event.ctrlKey) && !event.shiftKey && !event.altKey) {
+      const editable = event.target instanceof HTMLElement && Boolean(event.target.closest("input, textarea, select, [contenteditable='true']"));
+      const dialogOpen = Boolean(currentDialog?.());
+      const viewShortcuts = ["all", "active", "waiting", "runtime", "terminal", "tmux", "settings"];
+      if (!editable && !dialogOpen && (event.metaKey || event.ctrlKey) && /^[1-7]$/.test(event.key)) {
+        event.preventDefault();
+        selectView(viewShortcuts[Number(event.key) - 1], { focusMain: true });
+        return;
+      }
+      if (!editable && !dialogOpen && event.key === "/" && !event.metaKey && !event.ctrlKey && !event.altKey) {
+        event.preventDefault();
+        if (state.view !== "all") selectView("all");
+        $("#searchInput").focus();
+        return;
+      }
+      if (!editable && !dialogOpen && event.key.toLowerCase() === "n" && (event.metaKey || event.ctrlKey) && !event.shiftKey && !event.altKey) {
         event.preventDefault();
         if ($("#runModal").classList.contains("hidden")) openRunModal();
         return;
       }
       if (event.key !== "Escape") return;
       if (!$("#mobileToolsMenu").classList.contains("hidden")) {
-        $("#mobileToolsMenu").classList.add("hidden");
-        $("#mobileMoreBtn").setAttribute("aria-expanded", "false");
-        $("#mobileMoreBtn").focus();
+        $("#mobileToolsCloseBtn")?.click();
       } else if (!$("#runModal").classList.contains("hidden")) closeRunModal();
       else closeDrawer();
     });

package/renderer/app-events-filters.js

@@ -3,42 +3,137 @@
 window.LoadToAgentAppFactories = window.LoadToAgentAppFactories || {};
 
 window.LoadToAgentAppFactories.createFilterEventBindings = function createFilterEventBindings(context = {}) {
-  const { $, state, renderSessions, render, renderWorkspaces, renderProviderOverview, renderProviderFilter, toggleProviderFilter, announceProviderFilter, performUiAction, toast } = context;
+  const t = (key, params) => window.LoadToAgentI18n.t(key, params);
+  const { $, state, setProviderVisible = () => {}, visibleSnapshot = () => state.snapshot, closeDrawer = () => {}, openDrawer = () => {}, renderSessions, render, renderWorkspaces, renderProviderOverview, renderProviderFilter, toggleProviderFilter, announceProviderFilter, filteredSessions, performUiAction, toast, announce, normalizedSearch = (value) => String(value || "").trim(), saveDashboardPreferences = () => {}, restoreDialogTrigger = () => {}, setDialogOpenState = () => {} } = context;
 
   function bindFilterAndWorkspaceEvents() {
+    const syncFilterResetButton = () => {
+      const hasFilters = Boolean(
+        $("#searchInput").value || state.search || state.providerFilters.size || state.workspace !== "all" || state.sort !== "recent",
+      );
+      $("#resetFiltersBtn").classList.toggle("hidden", !hasFilters);
+    };
+    const moveFocus = (event, container, selector, previousKeys, nextKeys) => {
+      if (![...previousKeys, ...nextKeys, "Home", "End"].includes(event.key)) return false;
+      const items = Array.from(container.querySelectorAll(selector)).filter((item) => !item.disabled && !item.hidden);
+      if (!items.length) return false;
+      const current = Math.max(0, items.indexOf(event.target.closest(selector)));
+      const next = event.key === "Home"
+        ? 0
+        : event.key === "End"
+          ? items.length - 1
+          : (current + (nextKeys.includes(event.key) ? 1 : -1) + items.length) % items.length;
+      event.preventDefault();
+      items[next].focus();
+      return true;
+    };
     $("#loadMoreBtn").addEventListener("click", () => {
+      const previousCount = document.querySelectorAll("#sessionGrid [data-session-id]").length;
       state.visibleLimit += 30;
       renderSessions("load-more");
+      const cards = document.querySelectorAll("#sessionGrid [data-session-id]");
+      cards[Math.min(previousCount, cards.length - 1)]?.focus({ preventScroll: true });
+      announce(window.LoadToAgentI18n.t("filter.more_loaded", { count: Math.max(0, cards.length - previousCount) }));
     });
-    $("#workspaceList").addEventListener("click", async (event) => {
+    const workspaceLists = [$("#workspaceList"), $("#mobileWorkspaceList")].filter(Boolean);
+    const handleWorkspaceClick = async (event) => {
+      const activeList = event.currentTarget;
       const remove = event.target.closest("[data-remove-workspace]");
       if (remove) {
         event.stopPropagation();
-        const workspaces = await performUiAction(() => window.loadtoagent.removeWorkspace(remove.dataset.removeWorkspace), "작업 폴더를 제거하지 못했습니다.");
+        const path = remove.dataset.removeWorkspace;
+        const workspaceItems = Array.from(activeList.querySelectorAll("[data-workspace]"));
+        const workspaceIndex = Math.max(0, workspaceItems.indexOf(remove.closest(".workspace-row")?.querySelector("[data-workspace]")));
+        const workspaces = await performUiAction(() => window.loadtoagent.removeWorkspace(remove.dataset.removeWorkspace), t("workspace.remove_failed"), remove);
         if (!workspaces) return;
         state.workspaces = workspaces;
         if (state.workspace === remove.dataset.removeWorkspace) state.workspace = "all";
         render();
+        syncFilterResetButton();
+        saveDashboardPreferences();
+        requestAnimationFrame(() => {
+          const nextItems = Array.from(activeList.querySelectorAll("[data-workspace]"));
+          nextItems[Math.min(workspaceIndex, nextItems.length - 1)]?.focus();
+        });
+        announce(window.LoadToAgentI18n.t("quality.workspace_removed", { name: path.split(/[\\/]/).filter(Boolean).pop() || path }));
         return;
       }
       const item = event.target.closest("[data-workspace]");
       if (item) {
+        const label = item.querySelector("strong")?.textContent.trim() || t("project.all");
         state.workspace = item.dataset.workspace;
         state.visibleLimit = 30;
         renderWorkspaces();
         renderSessions("filter");
+        syncFilterResetButton();
+        saveDashboardPreferences();
+        announce(t("filter.workspace_results", { project: label, count: filteredSessions().length }));
+        if (activeList.id === "mobileWorkspaceList") {
+          const menu = $("#mobileToolsMenu");
+          setDialogOpenState(menu, false);
+          menu?.classList.add("hidden");
+          $("#mobileMoreBtn")?.setAttribute("aria-expanded", "false");
+          const focusResults = () => ($("#liveSessionGrid")?.querySelector("[data-graph-focus], [data-open-session]")
+            || $("#sessionGrid")?.querySelector("[data-session-id]")
+            || $("#mainContent"))?.focus({ preventScroll: true });
+          restoreDialogTrigger();
+          focusResults();
+          requestAnimationFrame(focusResults);
+        }
       }
+    };
+    workspaceLists.forEach((list) => {
+      list.addEventListener("click", handleWorkspaceClick);
+      list.addEventListener("keydown", (event) => {
+        moveFocus(event, event.currentTarget, "[data-workspace]", ["ArrowUp"], ["ArrowDown"]);
+      });
     });
     let searchTimer = null;
     $("#searchInput").addEventListener("input", (event) => {
       clearTimeout(searchTimer);
       const value = event.target.value;
+      $("#searchClearBtn").classList.toggle("hidden", !value);
+      syncFilterResetButton();
       searchTimer = setTimeout(() => {
-        state.search = value;
+        state.search = normalizedSearch(value);
         state.visibleLimit = 30;
         renderSessions("filter");
+        announce(window.LoadToAgentI18n.t("filter.search_results", { count: filteredSessions().length }));
+        syncFilterResetButton();
+        saveDashboardPreferences();
       }, 120);
     });
+    $("#searchClearBtn").addEventListener("click", () => {
+      clearTimeout(searchTimer);
+      $("#searchInput").value = "";
+      $("#searchClearBtn").classList.add("hidden");
+      state.search = "";
+      state.visibleLimit = 30;
+      renderSessions("filter");
+      announce(window.LoadToAgentI18n.t("filter.search_cleared"));
+      $("#searchInput").focus();
+      syncFilterResetButton();
+      saveDashboardPreferences();
+    });
+    $("#searchInput").addEventListener("keydown", (event) => {
+      if (event.key === "Escape" && event.currentTarget.value) {
+        event.preventDefault();
+        $("#searchClearBtn").click();
+        return;
+      }
+      if (event.key === "ArrowDown") {
+        const first = $("#sessionGrid [data-session-id]") || $("#liveSessionGrid button, #liveSessionGrid [tabindex='0']");
+        if (first) {
+          event.preventDefault();
+          first.focus();
+        }
+        return;
+      }
+      if (event.key === "Enter" && filteredSessions().length === 1) {
+        event.preventDefault();
+        openDrawer(filteredSessions()[0].id);
+      }
+    });
     $("#providerFilter").addEventListener("click", (event) => {
       const chip = event.target.closest("[data-provider-filter]");
       if (!chip) return;
@@ -48,26 +143,94 @@ window.LoadToAgentAppFactories.createFilterEventBindings = function createFilter
       renderProviderOverview();
       renderSessions("filter");
       announceProviderFilter();
-      requestAnimationFrame(() => $("#providerFilter").querySelector(`[data-provider-filter="${CSS.escape(chip.dataset.providerFilter)}"]`)?.focus());
+      const next = $("#providerFilter").querySelector(`[data-provider-filter="${CSS.escape(chip.dataset.providerFilter)}"]`);
+      next?.classList.add("filter-clicked");
+      next?.focus();
+      syncFilterResetButton();
+      saveDashboardPreferences();
+    });
+    $("#providerFilter").addEventListener("keydown", (event) => {
+      moveFocus(event, event.currentTarget, "[data-provider-filter]", ["ArrowLeft", "ArrowUp"], ["ArrowRight", "ArrowDown"]);
     });
     $("#sortSelect").addEventListener("change", (event) => {
       state.sort = event.target.value;
       state.visibleLimit = 30;
       renderSessions("filter");
+      const label = event.target.selectedOptions[0]?.textContent || event.target.value;
+      announce(window.LoadToAgentI18n.t("filter.sort_changed", { sort: label, count: filteredSessions().length }));
+      syncFilterResetButton();
+      saveDashboardPreferences();
     });
-    $("#addWorkspaceBtn").addEventListener("click", async () => {
-      const workspaces = await performUiAction(() => window.loadtoagent.addWorkspaces(), "작업 폴더를 추가하지 못했습니다.");
+    $("#resetFiltersBtn").addEventListener("click", () => {
+      clearTimeout(searchTimer);
+      state.search = "";
+      state.providerFilters.clear();
+      state.workspace = "all";
+      state.sort = "recent";
+      state.visibleLimit = 30;
+      $("#searchInput").value = "";
+      $("#searchClearBtn").classList.add("hidden");
+      $("#sortSelect").value = "recent";
+      renderWorkspaces();
+      renderProviderFilter();
+      renderProviderOverview();
+      renderSessions("filter");
+      syncFilterResetButton();
+      saveDashboardPreferences();
+      announce(window.LoadToAgentI18n.t("filter.reset_done", { count: filteredSessions().length }));
+      $("#searchInput").focus();
+    });
+    $("#providerVisibilityList").addEventListener("change", async (event) => {
+      const input = event.target.closest("[data-provider-visibility]");
+      if (!input) return;
+      const providerId = input.dataset.providerVisibility;
+      const previousVisible = !input.checked;
+      const selectedBeforeChange = (state.rawSnapshot?.sessions || []).find((session) => session.id === state.selectedId)
+        || state.details.get(state.selectedId);
+      setProviderVisible(providerId, input.checked);
+      state.visibleLimit = 30;
+      if (state.selectedId && selectedBeforeChange && state.hiddenProviders.has(selectedBeforeChange.provider)) closeDrawer();
+      if (window.LoadToAgentTerminal) window.LoadToAgentTerminal.updateSnapshot(visibleSnapshot(), state.workspaces);
+      render("filter");
+      try {
+        await Promise.resolve(window.loadtoagent.setProviderVisibility?.({ hidden: [...state.hiddenProviders] }));
+      } catch (error) {
+        window.LoadToAgentRendererUtils.reportRecoverableError("provider-visibility-persistence", error);
+        setProviderVisible(providerId, previousVisible);
+        if (window.LoadToAgentTerminal) window.LoadToAgentTerminal.updateSnapshot(visibleSnapshot(), state.workspaces);
+        render("filter");
+        toast(t("settings.providers.save_failed"));
+        return;
+      }
+      toast(t(input.checked ? "settings.providers.shown_toast" : "settings.providers.hidden_toast"));
+    });
+    const addWorkspaceButtons = [$("#addWorkspaceBtn"), $("#mobileAddWorkspaceBtn")].filter(Boolean);
+    const addWorkspace = async (event) => {
+      const trigger = event.currentTarget;
+      const previousPaths = new Set(state.workspaces.map((workspace) => workspace.path));
+      const workspaces = await performUiAction(() => window.loadtoagent.addWorkspaces(), t("workspace.add_failed"), trigger);
       if (!workspaces) return;
       state.workspaces = workspaces;
       renderWorkspaces();
-    });
+      syncFilterResetButton();
+      const added = state.workspaces.find((workspace) => !previousPaths.has(workspace.path));
+      requestAnimationFrame(() => {
+        const targetList = trigger.id === "mobileAddWorkspaceBtn" ? $("#mobileWorkspaceList") : $("#workspaceList");
+        if (added) targetList?.querySelector(`[data-workspace="${CSS.escape(added.path)}"]`)?.focus();
+        else trigger.focus();
+      });
+      announce(window.LoadToAgentI18n.t("quality.workspace_added", { count: state.workspaces.length }));
+    };
+    addWorkspaceButtons.forEach((button) => button.addEventListener("click", addWorkspace));
     $("#probeBtn").addEventListener("click", async () => {
-      const nextAvailability = await performUiAction(() => window.loadtoagent.probeProviders(), "AI CLI 연결 상태를 확인하지 못했습니다.");
+      const nextAvailability = await performUiAction(() => window.loadtoagent.probeProviders(), t("run.cli_check_failed"), $("#probeBtn"));
       if (!nextAvailability) return;
       state.availability = nextAvailability;
       render();
       toast(window.LoadToAgentI18n.t("ui.ai_cli_connections_were_checked_again"));
     });
+    $("#searchClearBtn").classList.toggle("hidden", !$("#searchInput").value);
+    syncFilterResetButton();
   }
 
   return { bindFilterAndWorkspaceEvents };