search cleanup

frontend/src/sidebar/Sidebar.tsx

@@ -25,6 +25,7 @@ import {
 } from '../ui/icons';
 import PanelHeader from '../ui/PanelHeader';
 import useFloatingMenu from '../ui/useFloatingMenu';
+import { useDocumentsFilter } from '../documents/context/DocumentsFilterContext';
 
 import { getTagColorStyle } from '../utils/colors';
 import { useSidebarContext } from './SidebarContext';
@@ -126,20 +127,11 @@ interface SidebarProps {
   creatingFolder?: boolean;
   tags?: TagEntry[];
   untaggedFilterId?: Identifier | null;
-  activeTagIds?: Array<Identifier | null>;
-  onToggleTagFilter?: (tagId: Identifier | null) => void;
   correspondents?: CorrespondentEntry[];
-  activeCorrespondentIds?: Array<Identifier | null>;
-  onToggleCorrespondentFilter?: (correspondentId: Identifier | null) => void;
   onManageTags?: () => void;
   onManageCorrespondents?: () => void;
   onCreateTag?: (label: string) => Promise<void> | void;
   onCreateCorrespondent?: (name: string) => Promise<void> | void;
-  searchQuery?: string;
-  onSearchChange?: (value: string) => void;
-  onSearchSubmit?: () => void;
-  onSearchClear?: () => void;
-  isFilterActive?: boolean;
   onLogout?: () => void;
   status?: StatusMessage | null;
   tenantName?: string | null;
@@ -301,20 +293,11 @@ const Sidebar: React.FC<SidebarProps> = ({
   creatingFolder = false,
   tags = [],
   untaggedFilterId = null,
-  activeTagIds = [],
-  onToggleTagFilter,
   correspondents = [],
-  activeCorrespondentIds = [],
-  onToggleCorrespondentFilter,
   onManageTags,
   onManageCorrespondents,
   onCreateTag,
   onCreateCorrespondent,
-  searchQuery = '',
-  onSearchChange,
-  onSearchSubmit,
-  onSearchClear,
-  isFilterActive = false,
   onLogout,
   status = null,
   tenantName,
@@ -342,6 +325,17 @@ const Sidebar: React.FC<SidebarProps> = ({
     sidebarSuppressed,
     collapseSidebar,
   } = usePanelManager();
+  const {
+    query: searchQuery,
+    activeTagIds = [],
+    activeCorrespondentIds = [],
+    isActive: isFilterActive,
+    setQuery: setFilterQuery,
+    submit: submitFilter,
+    clear: clearFilterState,
+    toggleTag: toggleTagFilter,
+    toggleCorrespondent: toggleCorrespondentFilter,
+  } = useDocumentsFilter();
   const uploadInputRef = useRef<HTMLInputElement | null>(null);
   const sidebarRef = useRef<HTMLDivElement | null>(null);
   const {
@@ -371,9 +365,12 @@ const Sidebar: React.FC<SidebarProps> = ({
   );
   const handleToggleTag = useCallback(
     (tagId: Identifier | null) => {
-      onToggleTagFilter?.(tagId);
+      if (tagId == null) {
+        return;
+      }
+      toggleTagFilter(tagId);
     },
-    [onToggleTagFilter],
+    [toggleTagFilter],
   );
   const activeTagSet = useMemo(
     () => new Set<Identifier | null>(activeTagIds || []),
@@ -623,20 +620,20 @@ const Sidebar: React.FC<SidebarProps> = ({
 
   const handleSearchInputChange = useCallback(
     (event: React.ChangeEvent<HTMLInputElement>) => {
-      onSearchChange?.(event.target.value);
+      setFilterQuery(event.target.value);
     },
-    [onSearchChange],
+    [setFilterQuery],
   );
   const handleSearchFormSubmit = useCallback(
     (event: React.FormEvent<HTMLFormElement>) => {
       event.preventDefault();
-      onSearchSubmit?.();
+      submitFilter();
     },
-    [onSearchSubmit],
+    [submitFilter],
   );
   const handleSearchClear = useCallback(() => {
-    onSearchClear?.();
-  }, [onSearchClear]);
+    clearFilterState();
+  }, [clearFilterState]);
   const tenantButtonRef = useRef<HTMLButtonElement | null>(null);
   const {
     isOpen: tenantMenuOpen,
@@ -869,22 +866,20 @@ const Sidebar: React.FC<SidebarProps> = ({
             <div className={`status-banner ${status.variant}`}>{status.message}</div>
           </div>
         )}
-        {onSearchChange && (
-          <form className="sidebar__search" onSubmit={handleSearchFormSubmit}>
-            <input
-              type="search"
-              value={searchQuery}
-              onChange={handleSearchInputChange}
-              placeholder="Search documents"
-              aria-label="Search documents"
-            />
-            {isFilterActive && (
-              <button type="button" onClick={handleSearchClear}>
-                Clear
-              </button>
-            )}
-          </form>
-        )}
+        <form className="sidebar__search" onSubmit={handleSearchFormSubmit}>
+          <input
+            type="search"
+            value={searchQuery}
+            onChange={handleSearchInputChange}
+            placeholder="Search documents"
+            aria-label="Search documents"
+          />
+          {isFilterActive && (
+            <button type="button" onClick={handleSearchClear}>
+              Clear
+            </button>
+          )}
+        </form>
         <div className="sidebar-section sidebar-section--folders">
           <div className="sidebar-section__header">
             <h3>Folders</h3>
@@ -1011,7 +1006,7 @@ const Sidebar: React.FC<SidebarProps> = ({
               const className = `sidebar-correspondent-item${isActive ? ' active' : ''}`;
               const handleSelect = () => {
                 const nextId = isActive ? null : correspondent.id;
-                onToggleCorrespondentFilter?.(nextId);
+                toggleCorrespondentFilter(nextId);
               };
               return (
                 <li key={correspondent.id}>

frontend/src/sidebar/useSidebarProps.ts

@@ -80,12 +80,8 @@ interface UseSidebarPropsArgs {
   handlePromptCreateFolder?: () => void;
   creatingFolder: boolean;
   tags: TagOption[];
-  activeTagFilters: Identifier[];
-  toggleTagFilter: (tagId: Identifier) => void;
   handleTagCreate: (payload: { label?: string }) => void | Promise<void>;
   correspondents: CorrespondentOption[];
-  activeCorrespondentFilters: Identifier[];
-  toggleCorrespondentFilter: (correspondentId: Identifier) => void;
   handleCorrespondentCreate: (payload: { name?: string }) =>
     | Promise<CorrespondentOption | null | void>
     | CorrespondentOption
@@ -94,11 +90,6 @@ interface UseSidebarPropsArgs {
   appStatus: string;
   loading: boolean;
   previewActive: boolean;
-  searchQuery: string;
-  handleSearchChange: (value: string) => void;
-  handleSearchSubmit: () => void;
-  clearFilters: () => void;
-  isFilterActive: boolean;
   handleLogout: () => void | Promise<void>;
   status: StatusMessage | null;
   tenantName: string | null;
@@ -127,21 +118,12 @@ interface SidebarHookResult {
   creatingFolder: boolean;
   tags: TagOption[];
   untaggedFilterId: typeof TAG_FILTER_UNTAGGED;
-  activeTagIds: Identifier[];
-  onToggleTagFilter: UseSidebarPropsArgs['toggleTagFilter'];
   onCreateTag: (label: string) => void;
   correspondents: CorrespondentOption[];
-  activeCorrespondentIds: Identifier[];
-  onToggleCorrespondentFilter: UseSidebarPropsArgs['toggleCorrespondentFilter'];
   onCreateCorrespondent: (name: string) => void;
   appStatus: string;
   loading: boolean;
   previewActive: boolean;
-  searchQuery: string;
-  onSearchChange: UseSidebarPropsArgs['handleSearchChange'];
-  onSearchSubmit: UseSidebarPropsArgs['handleSearchSubmit'];
-  onSearchClear: UseSidebarPropsArgs['clearFilters'];
-  isFilterActive: boolean;
   onLogout: UseSidebarPropsArgs['handleLogout'];
   status: StatusMessage | null;
   tenantName: string | null;
@@ -165,21 +147,12 @@ const useSidebarProps = ({
   handlePromptCreateFolder,
   creatingFolder,
   tags,
-  activeTagFilters,
-  toggleTagFilter,
   handleTagCreate,
   correspondents,
-  activeCorrespondentFilters,
-  toggleCorrespondentFilter,
   handleCorrespondentCreate,
   appStatus,
   loading,
   previewActive,
-  searchQuery,
-  handleSearchChange,
-  handleSearchSubmit,
-  clearFilters,
-  isFilterActive,
   handleLogout,
   status,
   tenantName,
@@ -208,21 +181,12 @@ const useSidebarProps = ({
       creatingFolder,
       tags,
       untaggedFilterId: TAG_FILTER_UNTAGGED,
-      activeTagIds: activeTagFilters,
-      onToggleTagFilter: toggleTagFilter,
       onCreateTag: (label) => handleTagCreate({ label }),
       correspondents,
-      activeCorrespondentIds: activeCorrespondentFilters,
-      onToggleCorrespondentFilter: toggleCorrespondentFilter,
       onCreateCorrespondent: (name) => handleCorrespondentCreate({ name }),
       appStatus,
       loading,
       previewActive,
-      searchQuery,
-      onSearchChange: handleSearchChange,
-      onSearchSubmit: handleSearchSubmit,
-      onSearchClear: clearFilters,
-      isFilterActive,
       onLogout: handleLogout,
       status,
       tenantName,
@@ -249,10 +213,7 @@ const useSidebarProps = ({
     [
       handleFileSelection,
       uploadQueue,
-      activeCorrespondentFilters,
-      activeTagFilters,
       appStatus,
-      clearFilters,
       correspondents,
       creatingFolder,
       currentTenantId,
@@ -265,23 +226,17 @@ const useSidebarProps = ({
       handleFolderRename,
       handleLogout,
       handlePromptCreateFolder,
-      handleSearchChange,
-      handleSearchSubmit,
       handleTagCreate,
       handleTenantSelect,
-      isFilterActive,
       loading,
       openSettings,
       previewActive,
-      searchQuery,
       draggedFolderId,
       selectedFolder,
       status,
       tags,
       tenantName,
       tenantOptions,
-      toggleCorrespondentFilter,
-      toggleTagFilter,
     ],
   );