feat: Add a search/filter for collection pane #305

This feature adds a search/filter functionality to the collection pane, allowing users to easily search for specific requests based on their names. Users can input search queries to filter the requests displayed in the collection pane, improving the navigation and organization of requests within the application.

Author: sudhar08

lib/providers/collection_providers.dart

@@ -1,3 +1,4 @@
+import 'package:collection/collection.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'settings_providers.dart';
 import 'ui_providers.dart';
@@ -8,6 +9,7 @@ import '../consts.dart';
 import 'package:http/http.dart' as http;
 
 final selectedIdStateProvider = StateProvider<String?>((ref) => null);
+final searchQueryProvider = StateProvider<String>((ref) => '');
 
 final selectedRequestModelProvider = StateProvider<RequestModel?>((ref) {
   final selectedId = ref.watch(selectedIdStateProvider);
@@ -31,7 +33,7 @@ final StateNotifierProvider<CollectionStateNotifier, Map<String, RequestModel>?>
 class CollectionStateNotifier
     extends StateNotifier<Map<String, RequestModel>?> {
   CollectionStateNotifier(this.ref, this.hiveHandler) : super(null) {
-    var status = loadData();
+    var status = filterRequests(ref.read(searchQueryProvider.notifier).state);
     Future.microtask(() {
       if (status) {
         ref.read(requestSequenceProvider.notifier).state = [
@@ -248,6 +250,37 @@ class CollectionStateNotifier
     }
   }
 
+  bool filterRequests(String query) {
+    if (query.isEmpty) {
+
+      loadData();
+      return true;
+    } else {
+      // Filter requests based on the query
+      final filteredRequests = state?.values.where((request) =>
+          request.name.toLowerCase().contains(query.toLowerCase())).toList();
+
+
+      if (filteredRequests != null && filteredRequests.isNotEmpty) {
+
+        Map<String, RequestModel> requestMap = {};
+
+        for (var request in filteredRequests) {
+          requestMap[request.id] = request;
+        }
+
+        state = requestMap;
+
+      } else {
+        print("No matching requests found");
+      }
+
+
+
+      return false;
+    }
+  }
+
   Future<void> saveData() async {
     ref.read(saveDataStateProvider.notifier).state = true;
     final saveResponse = ref.read(settingsProvider).saveResponses;

lib/screens/home_page/collection_pane.dart

@@ -1,3 +1,4 @@
+import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:apidash/providers/providers.dart';
@@ -66,10 +67,33 @@ class CollectionPane extends ConsumerWidget {
                     style: kTextStyleButton,
                   ),
                 ),
+
               ],
             ),
           ),
-          kVSpacer8,
+          kVSpacer10,
+           SizedBox(
+            height:30,
+            child:SearchBar(
+
+              onChanged: (value){
+                  if(value.isNotEmpty){
+                  ref.read(searchQueryProvider.notifier).state = value;
+                  ref.read(collectionStateNotifierProvider.notifier)
+                      .filterRequests(value);
+                  }
+                  else{
+
+                  }
+
+              },
+              hintText: "search",
+              leading: Icon(Icons.search),
+              textStyle: MaterialStateTextStyle.resolveWith((states) => TextStyle(fontSize: 15.0)),
+              elevation: MaterialStateProperty.all(2.0),
+            )),
+          kVSpacer10,
+
           const Expanded(
             child: RequestList(),
           ),
@@ -110,15 +134,15 @@ class _RequestListState extends ConsumerState<RequestList> {
     final alwaysShowCollectionPaneScrollbar = ref.watch(settingsProvider
         .select((value) => value.alwaysShowCollectionPaneScrollbar));
 
-    return Scrollbar(
+    return requestItems.isNotEmpty?Scrollbar(
       controller: controller,
       thumbVisibility: alwaysShowCollectionPaneScrollbar ? true : null,
       radius: const Radius.circular(12),
       child: ReorderableListView.builder(
         padding: kPr8CollectionPane,
         scrollController: controller,
         buildDefaultDragHandles: false,
-        itemCount: requestSequence.length,
+        itemCount: requestItems.length,
         onReorder: (int oldIndex, int newIndex) {
           if (oldIndex < newIndex) {
             newIndex -= 1;
@@ -131,6 +155,8 @@ class _RequestListState extends ConsumerState<RequestList> {
         },
         itemBuilder: (context, index) {
           var id = requestSequence[index];
+          print(requestItems[id]!);
+
           return ReorderableDragStartListener(
             key: ValueKey(id),
             index: index,
@@ -144,7 +170,7 @@ class _RequestListState extends ConsumerState<RequestList> {
           );
         },
       ),
-    );
+    ):Text("data");
   }
 }