From 3b011e23b472bbac45a18c13bee8111c60bf49c0 Mon Sep 17 00:00:00 2001
From: David Oduneye <davidoduneye1@gmail.com>
Date: Thu, 30 Nov 2023 18:30:10 -0500
Subject: [PATCH] feat: added search for all tasks

---
 client-new/src/screens/app/TaskScreen.tsx | 50 ++++++++++++++++++++---
 package.json                              |  5 +++
 yarn.lock                                 |  8 ++++
 3 files changed, 58 insertions(+), 5 deletions(-)
 create mode 100644 package.json
 create mode 100644 yarn.lock

diff --git a/client-new/src/screens/app/TaskScreen.tsx b/client-new/src/screens/app/TaskScreen.tsx
index b72433c..d98a759 100644
--- a/client-new/src/screens/app/TaskScreen.tsx
+++ b/client-new/src/screens/app/TaskScreen.tsx
@@ -1,7 +1,7 @@
 import { useUser } from '@/contexts/UserContext';
-import { Button, ScrollView, Text, View } from 'native-base';
+import { Button, Icon, Input, ScrollView, Text, View } from 'native-base';
 
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
 
 import HomeScreenTaskCard from '../../components/homescreen components/HomeScreenTaskCard';
 import LegacyWordmark from '../../components/reusable/LegacyWordmark';
@@ -15,6 +15,10 @@ import TaskTagGrid from '@/components/reusable/TaskTagGrid';
 export default function TaskScreen({ navigation }) {
   const { user } = useUser();
   const [selectedTags, setSelectedTags] = useState([]);
+  const [search, setSearch] = useState('');
+  const [fileteredTasks, setFilteredTasks] = useState<ITask[]>([]);
+  let debounceTimer;
+
 
   const { isPending, data: tasks, error, refetch } = useQuery({
     queryKey: ['tasks', user?.id, selectedTags],
@@ -22,6 +26,28 @@ export default function TaskScreen({ navigation }) {
     staleTime: 60000 // TEMP, unsolved refetch when unncessary
   });
 
+  useEffect(() => {
+    const debounce = (func, delay) => {
+      clearTimeout(debounceTimer);
+      debounceTimer = setTimeout(() => {
+        func();
+      }, delay);
+    };
+
+    const filterTasks = () => {
+      const filtered = tasks?.filter((task) => {
+        return task.task_name.toLowerCase().includes(search.toLowerCase()) || task.task_description.toLowerCase().includes(search.toLowerCase());
+      });
+      setFilteredTasks(filtered);
+    };
+
+    debounce(filterTasks, 300);
+
+    return () => {
+      clearTimeout(debounceTimer);
+    };
+  }, [search]);
+
   return (
     <>
       <ScrollView
@@ -52,9 +78,23 @@ export default function TaskScreen({ navigation }) {
             >
               All Tasks
             </Text>
+            <View>
+              <Input
+                placeholder="Search"
+                size="md"
+                isDisabled={isPending ? true : false}
+                width={'100%'}
+                backgroundColor={'#F2F2F2'}
+                borderRadius={'10px'}
+                paddingLeft={'10px'}
+                paddingRight={'10px'}
+                marginBottom={'20px'}
+                value={search}
+                onChangeText={(text) => setSearch(text)}
+              />
+            </View>
             <View flexDirection={'row'}>
               <TaskTagGrid selectedTags={selectedTags} pressfunc={setSelectedTags} />
-
             </View>
           </View>
           <View
@@ -64,8 +104,8 @@ export default function TaskScreen({ navigation }) {
           >
             {isPending && <ActivityIndicator style={{ marginTop: 50 }} />}
             {error && <Text>Error: {error.message}</Text>}
-            {tasks && tasks.length === 0 && <Text>No tasks found</Text>}
-            {tasks && tasks.map((item: ITask, index: number) =>
+            {fileteredTasks && fileteredTasks.length === 0 && <Text>No tasks found</Text>}
+            {fileteredTasks && fileteredTasks.map((item: ITask, index: number) =>
               <View key={index} mb={0}>
                 <HomeScreenTaskCard task={item} isAllTasks={false} />
               </View> 
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..cd574b2
--- /dev/null
+++ b/package.json
@@ -0,0 +1,5 @@
+{
+  "dependencies": {
+    "lodash": "^4.17.21"
+  }
+}
diff --git a/yarn.lock b/yarn.lock
new file mode 100644
index 0000000..bb4db65
--- /dev/null
+++ b/yarn.lock
@@ -0,0 +1,8 @@
+# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+# yarn lockfile v1
+
+
+lodash@^4.17.21:
+  version "4.17.21"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
+  integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==