Remove sidebar filter

Author: xPaw

src/components/DeclarationsPage.tsx

@@ -3,61 +3,45 @@ import { styled } from "@linaria/react";
 import { DeclarationsContext, type GameContext } from "./schema/DeclarationsContext";
 import { DeclarationsSidebar } from "./DeclarationsSidebar";
 import { ContentList } from "./schema/ContentList";
-import { SidebarFilterContext } from "./layout/SidebarFilterContext";
 import { SearchContext } from "./search/SearchContext";
 import { useHashParam } from "../utils/filtering";
 import { NavBar } from "./layout/NavBar";
 
 export default function DeclarationsPage({ context }: { context: GameContext }) {
-  const [filter, setFilter] = useState("");
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const search = useHashParam("search") ?? "";
 
   useEffect(() => {
     const listener = (e: KeyboardEvent) => {
       if (e.key !== "/" || e.ctrlKey || e.metaKey || e.altKey) return;
       const active = document.activeElement;
-      const mainSearch = document.getElementById("main-search");
-      const sidebarFilter = document.getElementById("sidebar-filter");
-
-      if (active === mainSearch) {
-        e.preventDefault();
-        sidebarFilter?.focus();
-      } else if (active === sidebarFilter) {
-        // Explicit check before the HTMLInputElement guard below,
-        // otherwise "/" would just type into the filter input.
-        e.preventDefault();
-        mainSearch?.focus();
-      } else if (!(active instanceof HTMLInputElement)) {
+      if (!(active instanceof HTMLInputElement)) {
         e.preventDefault();
-        mainSearch?.focus();
+        document.getElementById("main-search")?.focus();
       }
     };
     document.addEventListener("keydown", listener);
     return () => document.removeEventListener("keydown", listener);
   }, []);
 
   const searchCtx = useMemo(() => ({ search }), [search]);
-  const filterCtx = useMemo(() => ({ filter, setFilter }), [filter]);
 
   const closeSidebar = useCallback(() => setSidebarOpen(false), []);
   const openSidebar = useCallback(() => setSidebarOpen(true), []);
 
   return (
     <DeclarationsContext.Provider value={context}>
       <SearchContext.Provider value={searchCtx}>
-        <SidebarFilterContext.Provider value={filterCtx}>
-          <PageGrid>
-            <MobileSidebarOverlay data-open={sidebarOpen || undefined} onClick={closeSidebar} />
-            <SidebarPanel data-open={sidebarOpen || undefined}>
-              <DeclarationsSidebar onNavigate={closeSidebar} sidebarOpen={sidebarOpen} />
-            </SidebarPanel>
-            <ContentColumn>
-              <NavBar onMenuClick={openSidebar} />
-              <ContentList />
-            </ContentColumn>
-          </PageGrid>
-        </SidebarFilterContext.Provider>
+        <PageGrid>
+          <MobileSidebarOverlay data-open={sidebarOpen || undefined} onClick={closeSidebar} />
+          <SidebarPanel data-open={sidebarOpen || undefined}>
+            <DeclarationsSidebar onNavigate={closeSidebar} sidebarOpen={sidebarOpen} />
+          </SidebarPanel>
+          <ContentColumn>
+            <NavBar onMenuClick={openSidebar} />
+            <ContentList />
+          </ContentColumn>
+        </PageGrid>
       </SearchContext.Provider>
     </DeclarationsContext.Provider>
   );

src/components/DeclarationsSidebar.tsx

@@ -14,8 +14,7 @@ import type { Range } from "@tanstack/react-virtual";
 import { DeclarationsContext } from "./schema/DeclarationsContext";
 import { Declaration } from "../data/types";
 import { DeclarationSidebarElement, SidebarGroupHeader, SidebarWrapper } from "./layout/Sidebar";
-import { SidebarFilterContext } from "./layout/SidebarFilterContext";
-import { SearchInput } from "./search/SearchBox";
+import { matchesWords, useParsedSearch } from "../utils/filtering";
 import { GameSwitcher, S2VLogo } from "./layout/NavBar";
 
 type SidebarRow =
@@ -188,7 +187,7 @@ export const DeclarationsSidebar = ({
   sidebarOpen?: boolean;
 }) => {
   const { declarations, game } = useContext(DeclarationsContext);
-  const { filter, setFilter } = useContext(SidebarFilterContext);
+  const { nameWords, moduleWords } = useParsedSearch();
   const { module: activeModule = "", scope = "" } = useParams();
   const [collapsed, setCollapsed] = useState<Set<string>>(() => new Set());
   const [hydrated, setHydrated] = useState(false);
@@ -197,14 +196,19 @@ export const DeclarationsSidebar = ({
   const { rows, stickyIndexes } = useMemo(() => {
     const rows: SidebarRow[] = [];
     const stickyIndexes: number[] = [];
-    const lower = filter?.toLowerCase();
+    const hasNameFilter = nameWords.length > 0;
+    const hasModuleFilter = moduleWords.length > 0;
     for (const [module, moduleMap] of declarations) {
+      // Module filter (OR across module words, same as main search)
+      if (hasModuleFilter) {
+        const mod = module.toLowerCase();
+        if (!moduleWords.some((w) => mod.includes(w))) continue;
+      }
       // Collect matching items (or all items if no filter)
       const items: Declaration[] = [];
       for (const d of moduleMap.values()) {
-        if (!lower || d.name.toLowerCase().includes(lower)) {
-          items.push(d);
-        }
+        if (hasNameFilter && !matchesWords(d.name, nameWords)) continue;
+        items.push(d);
       }
       if (items.length === 0) continue;
       stickyIndexes.push(rows.length);
@@ -216,7 +220,7 @@ export const DeclarationsSidebar = ({
       }
     }
     return { rows, stickyIndexes };
-  }, [declarations, filter, collapsed]);
+  }, [declarations, nameWords, moduleWords, collapsed]);
 
   const activeIndex = useMemo(() => {
     if (!scope || !activeModule) return -1;
@@ -272,17 +276,6 @@ export const DeclarationsSidebar = ({
           </SidebarBrand>
           <GameSwitcher currentGame={game} />
         </SidebarBrandRow>
-        <SidebarSearchInput
-          id="sidebar-filter"
-          type="search"
-          placeholder="Filter…"
-          value={filter}
-          onChange={(e) => setFilter(e.target.value)}
-          aria-label="Filter classes and enums"
-          spellCheck={false}
-          autoCorrect="off"
-          autoCapitalize="off"
-        />
       </SidebarHeader>
       {hydrated ? (
         <VirtualizedList
@@ -345,10 +338,6 @@ const SidebarBrand = styled.a`
   white-space: nowrap;
 `;
 
-const SidebarSearchInput = styled(SearchInput)`
-  background: var(--background);
-`;
-
 const SidebarList = styled.div`
   flex: 1;
   overflow: auto;

src/components/layout/SidebarFilterContext.ts

@@ -304,7 +304,7 @@ const types: IntrinsicDef[] = [
 
   {
     // Other aliases: CKV3MemberNameSet
-    name: "KeyValues3", 
+    name: "KeyValues3",
     fields: [
       { name: "m_bContextIndependent", offset: 0, type: bf(1) },
       { name: "m_bFreeArrayMemory", offset: 0, type: bf(1) },