From 578c1a35a4affa92dbaaea6f68f50bacf4d05429 Mon Sep 17 00:00:00 2001
From: Rory Doak <138574807+RODO94@users.noreply.github.com>
Date: Thu, 6 Feb 2025 16:53:37 +0000
Subject: [PATCH] feat: wire up search and filter on Team page (#4265)

---
 editor.planx.uk/src/pages/Team.tsx | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/editor.planx.uk/src/pages/Team.tsx b/editor.planx.uk/src/pages/Team.tsx
index cb84b20bb4..1d581cc108 100644
--- a/editor.planx.uk/src/pages/Team.tsx
+++ b/editor.planx.uk/src/pages/Team.tsx
@@ -542,6 +542,18 @@ const Team: React.FC = () => {
   const [filteredFlows, setFilteredFlows] = useState<FlowSummary[] | null>(
     null,
   );
+  const [searchedFlows, setSearchedFlows] = useState<FlowSummary[] | null>(
+    null,
+  );
+  const [matchingFlows, setMatchingflows] = useState<FlowSummary[] | null>(
+    null,
+  );
+
+  useEffect(() => {
+    const diffFlows =
+      searchedFlows?.filter((flow) => filteredFlows?.includes(flow)) || null;
+    setMatchingflows(diffFlows);
+  }, [searchedFlows, filteredFlows]);
 
   const sortOptions: SortableFields<FlowSummary>[] = [
     {
@@ -607,6 +619,7 @@ const Team: React.FC = () => {
       );
       setFlows(sortedFlows);
       setFilteredFlows(sortedFlows);
+      setSearchedFlows(sortedFlows);
     });
   }, [teamId, setFlows, getFlows]);
 
@@ -646,7 +659,7 @@ const Team: React.FC = () => {
           {hasFeatureFlag("SORT_FLOWS") && flows && (
             <SearchBox<FlowSummary>
               records={flows}
-              setRecords={setFilteredFlows}
+              setRecords={setSearchedFlows}
               searchKey={["name", "slug"]}
             />
           )}
@@ -704,9 +717,9 @@ const Team: React.FC = () => {
             </Box>
           )}
         </Box>
-        {filteredFlows && flows && (
+        {matchingFlows && flows && (
           <DashboardList>
-            {filteredFlows.map((flow) => (
+            {matchingFlows.map((flow) => (
               <FlowCard
                 flow={flow}
                 flows={flows}