add searchbar

covas_mobile/lib/pages/ListItemMenu.dart

@@ -42,6 +42,8 @@ class ListItemMenu extends StatefulWidget {
 class _MyHomePageState extends State<ListItemMenu> {
   // variable to call and store future list of posts
   Future<List<Events>> postsFuture = getPosts();
+  List<Events> filteredPosts = [];
+  late SearchBar searchBar;
 
   // function to fetch data from api and return future list of posts
   static Future<List<Events>> getPosts() async {
@@ -60,15 +62,61 @@ class _MyHomePageState extends State<ListItemMenu> {
     return body;
   }
 
+  Future<List<Events>> searchPosts(String query) async {
+    SharedPreferences prefs = await SharedPreferences.getInstance();
+    var accessToken = prefs.getString("access_token") ?? "";
+    final List<Events> body = [];
+    if (accessToken.isNotEmpty) {
+      var url = Uri.parse("${globals.api}/events/search?item=$query");
+      final response = await http.get(url, headers: {
+        "Content-Type": "application/json",
+        HttpHeaders.cookieHeader: "access_token=${accessToken}"
+      });
+      final List body = json.decode(utf8.decode(response.bodyBytes));
+      return body.map((e) => Events.fromJson(e)).toList();
+    }
+    return body;
+  }
+
   Future<void> popCamera() async {
     await availableCameras().then((value) => Navigator.push(context,
         MaterialPageRoute(builder: (_) => Camera(camera: value.first))));
   }
 
+  void _filterPosts(String query) async {
+    if (query.isNotEmpty) {
+      List<Events> results = await searchPosts(query);
+      setState(() {
+        filteredPosts = results;
+      });
+    } else {
+      // Reset to full list or clear results
+      setState(() {
+        filteredPosts.clear();
+      });
+    }
+  }
+
   // build function
   @override
   Widget build(BuildContext context) {
     return Scaffold(
+      appBar: AppBar(
+        title: const Text("Item list menu"),
+        backgroundColor: Colors.blue,
+        foregroundColor: Colors.white,
+        actions: [
+          IconButton(
+            icon: const Icon(Icons.search),
+            onPressed: () {
+              showSearch(
+                context: context,
+                delegate: SearchDelegateExample(),
+              );
+            },
+          ),
+        ],
+      ),
       body: Center(
         // FutureBuilder
         child: FutureBuilder<List<Events>>(
@@ -80,7 +128,9 @@ class _MyHomePageState extends State<ListItemMenu> {
             } else if (snapshot.hasData) {
               // once data is fetched, display it on screen (call buildPosts())
               final posts = snapshot.data!;
-              return buildPosts(posts);
+              final displayedPosts =
+                  filteredPosts.isEmpty ? posts : filteredPosts;
+              return buildPosts(displayedPosts);
             } else {
               // if no data, show simple Text
               return const Text("No data available");
@@ -95,13 +145,6 @@ class _MyHomePageState extends State<ListItemMenu> {
   Widget buildPosts(List<Events> posts) {
     // ListView Builder to show data in a list
     return Scaffold(
-      appBar: AppBar(
-        // Here we take the value from the MyHomePage object that was created by
-        // the App.build method, and use it to set our appbar title.
-        title: Text("Item list menu"),
-        backgroundColor: Colors.blue,
-        foregroundColor: Colors.white,
-      ),
       body: ListView.separated(
         itemCount: posts.length,
         itemBuilder: (context, index) {
@@ -133,3 +176,84 @@ class _MyHomePageState extends State<ListItemMenu> {
     );
   }
 }
+
+class SearchDelegateExample extends SearchDelegate {
+  @override
+  List<Widget> buildActions(BuildContext context) {
+    return [
+      IconButton(
+        icon: const Icon(Icons.clear),
+        onPressed: () {
+          query = '';
+        },
+      ),
+    ];
+  }
+
+  @override
+  Widget buildLeading(BuildContext context) {
+    return IconButton(
+      icon: const Icon(Icons.arrow_back),
+      onPressed: () {
+        close(context, null);
+      },
+    );
+  }
+
+  @override
+  Widget buildResults(BuildContext context) {
+    // Perform the search and return the results
+    return FutureBuilder<List<Events>>(
+      future: searchPosts(query),
+      builder: (context, snapshot) {
+        if (snapshot.connectionState == ConnectionState.waiting) {
+          return const Center(child: CircularProgressIndicator());
+        } else if (snapshot.hasData) {
+          final posts = snapshot.data!;
+          return ListView.builder(
+            itemCount: posts.length,
+            itemBuilder: (context, index) {
+              final post = posts[index];
+              return ListTile(
+                title: Text(post.name!),
+                subtitle: Text(post.place!),
+                onTap: () {
+                  Navigator.push(
+                    context,
+                    MaterialPageRoute(
+                      builder: (_) => ItemMenu(title: post.id!),
+                    ),
+                  );
+                },
+              );
+            },
+          );
+        } else {
+          return const Center(child: Text("No results found"));
+        }
+      },
+    );
+  }
+
+  @override
+  Widget buildSuggestions(BuildContext context) {
+    // Show suggestions as the user types
+    return Container(); // Implement suggestions if needed
+  }
+
+  Future<List<Events>> searchPosts(String query) async {
+    SharedPreferences prefs = await SharedPreferences.getInstance();
+    var accessToken = prefs.getString("access_token") ?? "";
+    final List<Events> body = [];
+    if (accessToken.isNotEmpty) {
+      var url = Uri.parse("${globals.api}/events/search?item=$query");
+      final response = await http.get(url, headers: {
+        "Content-Type": "application/json",
+        HttpHeaders.cookieHeader: "access_token=${accessToken}"
+      });
+      final List body = json.decode(utf8.decode(response.bodyBytes));
+      return body.map((e) => Events.fromJson(e)).toList();
+    }
+    return body;
+  }
+}