feat: searchbar permanent

dialer/lib/features/home/home_page.dart

@@ -3,17 +3,43 @@ import 'package:dialer/features/contacts/contact_page.dart';
 import 'package:dialer/features/favorites/favorites_page.dart';
 import 'package:dialer/features/history/history_page.dart';
 import 'package:dialer/features/composition/composition.dart';
+import 'package:flutter_contacts/flutter_contacts.dart';
 
 class _MyHomePageState extends State<MyHomePage>
     with SingleTickerProviderStateMixin {
   late TabController _tabController;
-  final SearchController _searchController = SearchController();
+  List<Contact> _allContacts = [];
+  List<Contact> _contactSuggestions = [];
 
   @override
   void initState() {
     super.initState();
     _tabController = TabController(length: 3, vsync: this, initialIndex: 1);
     _tabController.addListener(_handleTabIndex);
+    _fetchContacts();
+  }
+
+  void _fetchContacts() async {
+    if (await FlutterContacts.requestPermission()) {
+      _allContacts = await FlutterContacts.getContacts(withProperties: true);
+      setState(() {});
+    }
+  }
+
+  void _onSearchChanged(String query) {
+    print("Search query: $query");
+
+    setState(() {
+      if (query.isEmpty) {
+        _contactSuggestions = List.from(_allContacts);
+      } else {
+        _contactSuggestions = _allContacts.where((contact) {
+          return contact.displayName
+              .toLowerCase()
+              .contains(query.toLowerCase());
+        }).toList();
+      }
+    });
   }
 
   @override
@@ -27,10 +53,6 @@ class _MyHomePageState extends State<MyHomePage>
     setState(() {});
   }
 
-  void _onSearchChanged(String query) {
-    // Use this method to manage search actions if needed
-  }
-
   @override
   Widget build(BuildContext context) {
     return Scaffold(
@@ -40,15 +62,14 @@ class _MyHomePageState extends State<MyHomePage>
           // Persistent Search Bar
           Padding(
             padding: const EdgeInsets.only(
-              top: 24.0, // Outside top padding
+              top: 24.0,
-              bottom: 10.0, // Outside bottom padding
+              bottom: 10.0,
-              left: 16.0, // Outside left padding
+              left: 16.0,
-              right: 16.0, // Outside right padding
+              right: 16.0,
             ),
             child: Container(
               decoration: BoxDecoration(
-                color: const Color.fromARGB(
+                color: const Color.fromARGB(255, 30, 30, 30),
-                    255, 30, 30, 30), // Background of the SearchBar
                 borderRadius: BorderRadius.circular(12.0),
                 border: Border(
                   top: BorderSide(color: Colors.grey.shade800, width: 1),
@@ -63,15 +84,15 @@ class _MyHomePageState extends State<MyHomePage>
                     controller: controller,
                     padding: MaterialStateProperty.all<EdgeInsetsGeometry>(
                       EdgeInsets.only(
-                        top: 10.0, // Inside top padding
+                        top: 6.0,
-                        bottom: 10.0, // Inside bottom padding
+                        bottom: 6.0,
-                        left: 16.0, // Inside left padding
+                        left: 16.0,
-                        right: 16.0, // Inside right padding
+                        right: 16.0,
                       ),
                     ),
-                    onChanged: _onSearchChanged,
                     onTap: () {
                       controller.openView();
+                      _onSearchChanged('');
                     },
                     backgroundColor: MaterialStateProperty.all(
                         const Color.fromARGB(255, 30, 30, 30)),
@@ -91,18 +112,21 @@ class _MyHomePageState extends State<MyHomePage>
                     ),
                   );
                 },
+                viewOnChanged: (query) {
+                  _onSearchChanged(query);
+                },
                 suggestionsBuilder:
                     (BuildContext context, SearchController controller) {
-                  return List<ListTile>.generate(5, (int index) {
+                  return _contactSuggestions.map((contact) {
-                    final String item = 'Suggestion $index';
                     return ListTile(
-                      title: Text(item),
+                      key: ValueKey(contact.id),
+                      title: Text(contact.displayName,
+                          style: const TextStyle(color: Colors.white)),
                       onTap: () {
-                        // Close the search view and select suggestion
+                        controller.closeView(contact.displayName);
-                        controller.closeView(item);
                       },
                     );
-                  });
+                  }).toList();
                 },
               ),
             ),