2117 add mvp full text search listings; "and" feature (#2856)

Author: VirginiaWu11

client/src/components/FoodSeeker/SearchResults/ResultsFilters/FilterPanel.tsx

@@ -172,10 +172,10 @@ const FilterPanel: FC<FilterPanelProps> = ({ mealPantry, filterCount }) => {
       <Box sx={{ padding: "0 1rem 1rem 1rem", overflowY: "auto" }}>
         <Box sx={{ paddingBottom: "1rem" }}>
           <Typography variant="h4" sx={yPadding}>
-            Organization Name
+            Search
           </Typography>
           <OutlinedInput
-            placeholder="i.e. church of"
+            placeholder="i.e. kosher, senior, First Baptist, 90015"
             value={orgNameFilter}
             onChange={(e) =>
               dispatch({
@@ -186,7 +186,7 @@ const FilterPanel: FC<FilterPanelProps> = ({ mealPantry, filterCount }) => {
             endAdornment={
               <InputAdornment position="end">
                 <IconButton
-                  aria-label="Clear organization name filter"
+                  aria-label="Clear search filter"
                   edge="end"
                   onClick={() =>
                     dispatch({

client/src/hooks/useOrganizationBests.ts

@@ -37,6 +37,24 @@ interface SelectAllParams {
   categoryIds: number[];
 }
 
+// Public-facing text fields searched by the "orgNameFilter" free-text search
+// (label reads "Search" in the UI). Deliberately excludes internal/admin-only
+// fields such as `adminNotes` -- only fields a food seeker can already see on
+// the listing/detail page belong here.
+const SEARCHABLE_FIELDS = [
+  "name",
+  "address1",
+  "address2",
+  "city",
+  "zip",
+  "phone",
+  "email",
+  "requirements",
+  "notes",
+  "services",
+  "items",
+] as const;
+
 interface UseOrganizationBestsState {
   data: SearchStakeholder[] | null;
   loading: boolean;
@@ -135,11 +153,17 @@ export default function useOrganizationBests() {
         });
       }
       if (filters.orgNameFilter) {
+        const searchWords = filters
+          .orgNameFilter!.toLowerCase()
+          .split(" ")
+          .filter(Boolean);
         filteredStakeholders = filteredStakeholders.filter((stakeholder) => {
-          return filters.orgNameFilter!
-            .toLowerCase()
-            .split(" ")
-            .every((word) => stakeholder.name.toLowerCase().includes(word));
+          const searchableText = SEARCHABLE_FIELDS.map(
+            (field) => stakeholder[field] || ""
+          )
+            .join(" ")
+            .toLowerCase();
+          return searchWords.every((word) => searchableText.includes(word));
         });
       }
       if (filters.foodTypeFilter) {

client/tests/helpers/mocks.ts

@@ -377,7 +377,7 @@ function makeStakeholdersResponse() {
       createdDate: "2020-03-30T01:39:28",
       modifiedDate: null,
       approvedDate: null,
-      requirements: "",
+      requirements: "Kosher options available for seniors",
       inactive: false,
       parentOrganization: "",
       physicalAccess: "",

client/tests/organizations.spec.ts

@@ -108,4 +108,53 @@ test.describe("Organizations", () => {
     await expect(page.getByText("Stakeholder 2")).toBeVisible();
     await expect(page.getByText("Stakeholder 3")).toBeHidden();
   });
+
+  test("searching by address should show only the matching stakeholder", async ({
+    page,
+  }) => {
+    await mockRequests(page);
+    await page.goto("/organizations");
+    await page.getByRole("button", { name: "More Filters" }).click();
+    await page
+      .getByPlaceholder("i.e. kosher, senior, First Baptist, 90015")
+      .fill("222 Address");
+    await expect(page.getByText("Stakeholder 1")).toBeHidden();
+    await expect(page.getByText("Stakeholder 2")).toBeVisible();
+    await expect(page.getByText("Stakeholder 3")).toBeHidden();
+  });
+
+  test("searching by a multi-word term found in a non-name field (requirements) should show only the matching stakeholder", async ({
+    page,
+  }) => {
+    await mockRequests(page);
+    await page.goto("/organizations");
+    await page.getByRole("button", { name: "More Filters" }).click();
+    // "kosher" and "seniors" only both appear in Stakeholder 2's requirements
+    // text -- this exercises the "AND" multi-word, non-name-field search.
+    await page
+      .getByPlaceholder("i.e. kosher, senior, First Baptist, 90015")
+      .fill("kosher seniors");
+    await expect(page.getByText("Stakeholder 1")).toBeHidden();
+    await expect(page.getByText("Stakeholder 2")).toBeVisible();
+    await expect(page.getByText("Stakeholder 3")).toBeHidden();
+  });
+
+  test("searching by words matched across two different fields (name + address) on the same stakeholder should AND across fields", async ({
+    page,
+  }) => {
+    await mockRequests(page);
+    await page.goto("/organizations");
+    await page.getByRole("button", { name: "More Filters" }).click();
+    // "stakeholder" matches the `name` field of all three mock stakeholders,
+    // but "222" only appears in Stakeholder 2's `address1` field. Only a
+    // stakeholder satisfying both words -- one via name, one via a different
+    // field -- should remain, proving the fields are searched as one
+    // combined AND-across-fields blob rather than independently.
+    await page
+      .getByPlaceholder("i.e. kosher, senior, First Baptist, 90015")
+      .fill("stakeholder 222");
+    await expect(page.getByText("Stakeholder 1")).toBeHidden();
+    await expect(page.getByText("Stakeholder 2")).toBeVisible();
+    await expect(page.getByText("Stakeholder 3")).toBeHidden();
+  });
 });