feat(search): Enable data-only checkbox

theopensystemslab · Oct 1, 2024 · a154cf7 · a154cf7
1 parent 916f89d
commit a154cf7
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 7 deletions.
diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/SearchHeader.tsx b/editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/SearchHeader.tsx
@@ -8,6 +8,7 @@ import ChecklistItem from "ui/shared/ChecklistItem";
 import Input from "ui/shared/Input";
 
 import { Context, Data } from ".";
+import { ALL_FACETS, DATA_FACETS } from "./facets";
 
 export const SearchHeader: Components<Data, Context>["Header"] = ({
   context,
@@ -23,6 +24,14 @@ export const SearchHeader: Components<Data, Context>["Header"] = ({
     }
   }, [formik.values.pattern, lastPattern, setIsSearching]);
 
+  // Use "data.title" as proxy for all facets
+  const isDataOnly = () => !formik.values.facets.includes("data.title");
+
+  const toggleDataOnly = () =>
+    isDataOnly()
+      ? formik.setFieldValue("facets", ALL_FACETS)
+      : formik.setFieldValue("facets", DATA_FACETS);
+
   return (
     <Box mx={3} pt={3} component="form" onSubmit={formik.handleSubmit}>
       <Typography
@@ -59,9 +68,9 @@ export const SearchHeader: Components<Data, Context>["Header"] = ({
       <ChecklistItem
         label="Search only data fields"
         id={"search-data-field-facet"}
-        checked
         inputProps={{ disabled: !hasFeatureFlag("DATA_ONLY_SEARCH") }}
-        onChange={() => {}}
+        checked={isDataOnly()}
+        onChange={toggleDataOnly}
         variant="compact"
       />
       {formik.values.pattern && (

diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/facets.ts b/editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/facets.ts
@@ -1,7 +1,7 @@
 import { IndexedNode } from "@opensystemslab/planx-core/types";
 import { FuseOptionKey } from "fuse.js";
 
-type SearchFacets = Array<FuseOptionKey<IndexedNode>>;
+export type SearchFacets = Array<FuseOptionKey<IndexedNode>>;
 
 const generalData: SearchFacets = ["data.fn", "data.val"];
 
@@ -26,10 +26,29 @@ const drawBoundaryData: SearchFacets = [
 ];
 
 /** Data fields used across PlanX components */
-export const DATA_FACETS = [
+export const DATA_FACETS: SearchFacets = [
   ...generalData,
   ...fileUploadAndLabelData,
   ...calculateData,
   ...listData,
   ...drawBoundaryData,
 ];
+
+const basicFields: SearchFacets = [
+  "data.text",
+  "data.title",
+  "data.description",
+];
+
+const moreInformation: SearchFacets = [
+  "data.notes",
+  "data.howMeasured",
+  "data.policyRef",
+  "data.info",
+];
+
+export const ALL_FACETS: SearchFacets = [
+  ...basicFields,
+  ...moreInformation,
+  ...DATA_FACETS,
+];
diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/index.tsx b/editor.planx.uk/src/pages/FlowEditor/components/Sidebar/Search/index.tsx
@@ -13,15 +13,15 @@ import React, { useEffect, useMemo, useState } from "react";
 import { Components, Virtuoso } from "react-virtuoso";
 
 import { ExternalPortalList } from "./ExternalPortalList";
-import { DATA_FACETS } from "./facets";
+import { ALL_FACETS, SearchFacets } from "./facets";
 import { SearchHeader } from "./SearchHeader";
 import { SearchResultCard } from "./SearchResultCard";
 
 const DEBOUNCE_MS = 500;
 
 interface SearchNodes {
   pattern: string;
-  facets: typeof DATA_FACETS;
+  facets: SearchFacets;
 }
 
 // Types for Virtuoso
@@ -64,7 +64,7 @@ const Search: React.FC = () => {
 
   // Set up search input form
   const formik = useFormik<SearchNodes>({
-    initialValues: { pattern: "", facets: DATA_FACETS },
+    initialValues: { pattern: "", facets: ALL_FACETS },
     onSubmit: ({ pattern }) => {
       debouncedSearch(pattern);
     },