reorganzie lib, update drawer ui, wire up explore page to searchActors api

lib/api.dart

···
 import 'package:grain/main.dart';
 import 'package:http/http.dart' as http;
 import 'dart:convert';
-import 'profile.dart';
-import 'gallery.dart';
-import 'notification.dart' as grain;
+import 'models/profile.dart';
+import 'models/gallery.dart';
+import 'models/notification.dart' as grain;
 
 class ApiService {
   String? _accessToken;
···
         'Failed to load notifications: status ${response.statusCode}, body: ${response.body}',
       );
       throw Exception('Failed to load notifications: \\${response.statusCode}');
+    }
+  }
+
+  Future<List<Profile>> searchActors(String query) async {
+    if (_accessToken == null) return [];
+    appLogger.i('Searching actors for query: $query with token: $_accessToken');
+
+    final response = await http.get(
+      Uri.parse('$_apiUrl/xrpc/social.grain.actor.searchActors?q=$query'),
+      headers: {'Authorization': 'Bearer $_accessToken'},
+    );
+    if (response.statusCode == 200) {
+      final data = json.decode(response.body);
+      final items = data['actors'] as List<dynamic>?;
+      if (items != null) {
+        appLogger.i('Found ${items.length} actors for query: $query');
+        return items.map((item) => Profile.fromJson(item)).toList();
+      } else {
+        return [];
+      }
+    } else {
+      appLogger.e(
+        'Failed to search actors: status ${response.statusCode}, body: ${response.body}',
+      );
+      throw Exception('Failed to search actors: ${response.statusCode}');
     }
   }
 }

lib/comments_page.dart lib/screens/comments_page.dart

···
 import 'package:flutter/material.dart';
 import 'package:grain/api.dart';
-import 'package:grain/comment.dart';
-import 'package:grain/gallery.dart';
+import 'package:grain/models/comment.dart';
+import 'package:grain/models/gallery.dart';
 import 'package:grain/utils.dart';
 
 class CommentsPage extends StatefulWidget {
···
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      appBar: AppBar(title: const Text('Comments')),
+      appBar: AppBar(
+        title: const Text(
+          'Comments',
+          style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600),
+        ),
+      ),
       body: _loading
           ? const Center(child: CircularProgressIndicator())
           : _error
           ? const Center(child: Text('Failed to load comments.'))
           : ListView(
-        padding: const EdgeInsets.all(12),
-        children: [
-          if (_gallery != null)
-            Text(
-              _gallery!.title,
-              style: const TextStyle(
-                fontWeight: FontWeight.bold,
-                fontSize: 18,
-              ),
+              padding: const EdgeInsets.all(12),
+              children: [
+                if (_gallery != null)
+                  Text(
+                    _gallery!.title,
+                    style: const TextStyle(
+                      fontWeight: FontWeight.bold,
+                      fontSize: 18,
+                    ),
+                  ),
+                const SizedBox(height: 12),
+                _CommentsList(comments: _comments),
+              ],
             ),
-          const SizedBox(height: 12),
-          _CommentsList(comments: _comments),
-        ],
-      ),
     );
   }
 }
···
     return comments.where((c) => c.replyTo == null).toList();
   }
 
-  Widget _buildCommentTree(Comment comment, Map<String, List<Comment>> repliesByParent, int depth) {
+  Widget _buildCommentTree(
+    Comment comment,
+    Map<String, List<Comment>> repliesByParent,
+    int depth,
+  ) {
     return Padding(
       padding: EdgeInsets.only(left: depth * 18.0),
       child: Column(
···
         children: [
           _CommentTile(comment: comment),
           if (repliesByParent[comment.uri] != null)
-            ...repliesByParent[comment.uri]!
-                .map((reply) => _buildCommentTree(reply, repliesByParent, depth + 1))
-                ,
+            ...repliesByParent[comment.uri]!.map(
+              (reply) => _buildCommentTree(reply, repliesByParent, depth + 1),
+            ),
         ],
       ),
     );
···
                       ),
                       child: AspectRatio(
                         aspectRatio:
-                        (comment.focus!.width > 0 &&
-                            comment.focus!.height > 0)
+                            (comment.focus!.width > 0 &&
+                                comment.focus!.height > 0)
                             ? comment.focus!.width / comment.focus!.height
                             : 1.0,
                         child: ClipRRect(

lib/gallery_page.dart lib/screens/gallery_page.dart

···
 import 'package:flutter/material.dart';
-import 'package:grain/gallery.dart';
+import 'package:grain/models/gallery.dart';
 import 'package:grain/api.dart';
-import 'package:grain/justified_gallery_view.dart';
-import 'package:grain/comments_page.dart';
-import 'utils.dart';
+import 'package:grain/widgets/justified_gallery_view.dart';
+import 'package:grain/utils.dart';
+import './comments_page.dart';
 
 class GalleryPage extends StatefulWidget {
   final String uri;
···
         .toList();
     return Scaffold(
       appBar: AppBar(
-        title: Text(gallery.title.isNotEmpty ? gallery.title : 'Gallery'),
+        title: Text(
+          gallery.title.isNotEmpty ? gallery.title : 'Gallery',
+          style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600),
+        ),
       ),
       body: Padding(
         padding: const EdgeInsets.symmetric(horizontal: 16),

lib/home_page.dart lib/screens/home_page.dart

···
 import 'package:flutter/material.dart';
 import 'package:grain/api.dart';
-import 'package:grain/gallery.dart';
-import 'package:grain/gallery_page.dart';
-import 'package:grain/comments_page.dart';
+import 'package:grain/models/gallery.dart';
+import 'gallery_page.dart';
+import 'comments_page.dart';
 import 'profile_page.dart';
-import 'utils.dart';
+import 'package:grain/utils.dart';
 import 'log_page.dart';
-import 'app_version_text.dart';
+import 'package:grain/widgets/app_version_text.dart';
 import 'notifications_page.dart';
+import 'explore_page.dart';
+import 'package:font_awesome_flutter/font_awesome_flutter.dart';
 
 class TimelineItem {
   final Gallery gallery;
···
 class _MyHomePageState extends State<MyHomePage> {
   bool showProfile = false;
   bool showNotifications = false;
+  bool showExplore = false;
   List<TimelineItem> _timeline = [];
   bool _timelineLoading = true;
 
···
   }
 
   int get _navIndex {
-    if (showProfile) return 2;
-    if (showNotifications) return 1;
+    if (showProfile) return 3;
+    if (showNotifications) return 2;
+    if (showExplore) return 1;
     return 0;
   }
 
···
           padding: EdgeInsets.zero,
           children: [
             DrawerHeader(
-              decoration: BoxDecoration(
-                color: Theme.of(context).colorScheme.inversePrimary,
-              ),
-              child: Text(
-                'Menu',
-                style: TextStyle(color: Colors.white, fontSize: 24),
+              decoration: BoxDecoration(color: Colors.white),
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  CircleAvatar(
+                    radius: 22, // Smaller avatar
+                    backgroundImage:
+                        apiService.currentUser?.avatar != null &&
+                            apiService.currentUser!.avatar.isNotEmpty
+                        ? NetworkImage(apiService.currentUser!.avatar)
+                        : null,
+                    backgroundColor: Colors.white,
+                    child:
+                        (apiService.currentUser == null ||
+                            apiService.currentUser!.avatar.isEmpty)
+                        ? const Icon(
+                            Icons.account_circle,
+                            size: 32,
+                            color: Colors.grey,
+                          )
+                        : null,
+                  ),
+                  const SizedBox(height: 6),
+                  Text(
+                    apiService.currentUser?.displayName ?? '',
+                    style: const TextStyle(
+                      color: Colors.black,
+                      fontSize: 15, // Smaller text
+                      fontWeight: FontWeight.bold,
+                    ),
+                  ),
+                  if (apiService.currentUser?.handle != null)
+                    Text(
+                      '@${apiService.currentUser!.handle}',
+                      style: const TextStyle(
+                        color: Colors.black54,
+                        fontSize: 11, // Smaller text
+                      ),
+                    ),
+                  const SizedBox(height: 6),
+                  Row(
+                    mainAxisAlignment: MainAxisAlignment.start,
+                    children: [
+                      Text(
+                        (apiService.currentUser?.followersCount ?? 0)
+                            .toString(),
+                        style: const TextStyle(
+                          color: Colors.black,
+                          fontWeight: FontWeight.bold,
+                          fontSize: 13,
+                        ),
+                      ),
+                      const SizedBox(width: 4),
+                      const Text(
+                        'Followers',
+                        style: TextStyle(color: Colors.black54, fontSize: 10),
+                      ),
+                      const SizedBox(width: 16),
+                      Text(
+                        (apiService.currentUser?.followsCount ?? 0).toString(),
+                        style: const TextStyle(
+                          color: Colors.black,
+                          fontWeight: FontWeight.bold,
+                          fontSize: 13,
+                        ),
+                      ),
+                      const SizedBox(width: 4),
+                      const Text(
+                        'Following',
+                        style: TextStyle(color: Colors.black54, fontSize: 10),
+                      ),
+                    ],
+                  ),
+                ],
               ),
             ),
             ListTile(
-              leading: const Icon(Icons.home),
+              leading: const Icon(FontAwesomeIcons.house),
               title: const Text('Home'),
               onTap: () {
                 Navigator.pop(context);
                 setState(() {
                   showProfile = false;
                   showNotifications = false;
+                  showExplore = false;
                 });
               },
             ),
             ListTile(
-              leading: const Icon(Icons.person),
+              leading: const Icon(FontAwesomeIcons.magnifyingGlass),
+              title: const Text('Explore'),
+              onTap: () {
+                Navigator.pop(context);
+                setState(() {
+                  showExplore = true;
+                  showProfile = false;
+                  showNotifications = false;
+                });
+              },
+            ),
+            ListTile(
+              leading: const Icon(FontAwesomeIcons.user),
               title: const Text('Profile'),
               onTap: () {
                 Navigator.pop(context);
                 setState(() {
                   showProfile = true;
                   showNotifications = false;
+                  showExplore = false;
                 });
               },
             ),
             ListTile(
-              leading: const Icon(Icons.list_alt),
+              leading: const Icon(FontAwesomeIcons.list),
               title: const Text('Logs'),
               onTap: () {
                 Navigator.pop(context);
···
                 ),
               ),
               title: Text(
-                showNotifications ? 'Notifications' : widget.title,
+                showNotifications
+                    ? 'Notifications'
+                    : showExplore
+                    ? 'Explore'
+                    : widget.title,
                 style: const TextStyle(
                   fontSize: 18,
                   fontWeight: FontWeight.w600,
···
             ),
       body: Stack(
         children: [
-          if (!showProfile && !showNotifications) _buildTimeline(),
+          if (!showProfile && !showNotifications && !showExplore)
+            _buildTimeline(),
+          if (showExplore)
+            Positioned.fill(
+              child: Material(
+                color: Theme.of(
+                  context,
+                ).scaffoldBackgroundColor.withOpacity(0.98),
+                child: SafeArea(child: Stack(children: [ExplorePage()])),
+              ),
+            ),
           if (showNotifications)
             Positioned.fill(
               child: Material(
···
       bottomNavigationBar: BottomNavigationBar(
         items: <BottomNavigationBarItem>[
           BottomNavigationBarItem(
-            icon: Icon(_navIndex == 0 ? Icons.home : Icons.home_outlined),
+            icon: Transform.translate(
+              offset: const Offset(0, 10),
+              child: FaIcon(FontAwesomeIcons.house),
+            ),
+            label: '',
+          ),
+          BottomNavigationBarItem(
+            icon: Transform.translate(
+              offset: const Offset(0, 10),
+              child: const FaIcon(FontAwesomeIcons.magnifyingGlass),
+            ),
             label: '',
           ),
           BottomNavigationBarItem(
-            icon: const Icon(Icons.notifications_none),
+            icon: Transform.translate(
+              offset: const Offset(0, 10),
+              child: const FaIcon(FontAwesomeIcons.solidBell),
+            ),
             label: '',
           ),
           BottomNavigationBarItem(
             icon: apiService.currentUser?.avatar != null
-                ? Container(
-                    width: 24,
-                    height: 24,
-                    decoration: BoxDecoration(
-                      shape: BoxShape.circle,
-                      border: Border.all(
-                        color: _navIndex == 2
-                            ? Colors.lightBlue
-                            : Colors.transparent,
-                        width: 3,
+                ? Transform.translate(
+                    offset: const Offset(0, 10),
+                    child: Container(
+                      width: 32,
+                      height: 32,
+                      decoration: BoxDecoration(
+                        shape: BoxShape.circle,
+                        border: Border.all(
+                          color: _navIndex == 3
+                              ? Colors.lightBlue
+                              : Colors.transparent,
+                          width: 3,
+                        ),
                       ),
-                    ),
-                    child: CircleAvatar(
-                      radius: 12,
-                      backgroundImage: NetworkImage(
-                        apiService.currentUser!.avatar,
+                      child: ClipOval(
+                        child: Image.network(
+                          apiService.currentUser!.avatar,
+                          fit: BoxFit.cover,
+                          width: 24,
+                          height: 24,
+                        ),
                       ),
-                      backgroundColor: Colors.transparent,
                     ),
                   )
-                : Icon(
-                    _navIndex == 2
-                        ? Icons.account_circle
-                        : Icons.account_circle_outlined,
+                : FaIcon(
+                    _navIndex == 3
+                        ? FontAwesomeIcons.solidUser
+                        : FontAwesomeIcons.user,
                   ),
             label: '',
           ),
···
         currentIndex: _navIndex,
         selectedItemColor: Colors.lightBlue,
         onTap: (index) {
-          if (index == 1) {
+          if (index == 2) {
             setState(() {
               showNotifications = true;
               showProfile = false;
+              showExplore = false;
             });
             return;
           }
-          if (index == 2) {
+          if (index == 3) {
             setState(() {
               showProfile = true;
               showNotifications = false;
+              showExplore = false;
+            });
+            return;
+          }
+          if (index == 1) {
+            setState(() {
+              showExplore = true;
+              showProfile = false;
+              showNotifications = false;
             });
             return;
           }
···
             setState(() {
               showProfile = false;
               showNotifications = false;
+              showExplore = false;
             });
             return;
           }

lib/justified_gallery_view.dart lib/widgets/justified_gallery_view.dart

···
 import 'package:flutter/material.dart';
-import 'package:grain/gallery.dart';
+import 'package:grain/models/gallery.dart';
 
 class JustifiedGalleryView extends StatelessWidget {
   final List<GalleryPhoto> items;

lib/main.dart

···
 import 'package:flutter_dotenv/flutter_dotenv.dart';
 import 'package:google_fonts/google_fonts.dart';
 import 'package:grain/app_logger.dart';
-import 'package:grain/splash_page.dart';
-import 'package:grain/home_page.dart';
+import 'package:grain/screens/splash_page.dart';
+import 'package:grain/screens/home_page.dart';
 
 class AppConfig {
   static late final String apiUrl;

lib/notifications_page.dart lib/screens/notifications_page.dart

···
 import 'package:flutter/material.dart';
-import 'api.dart';
-import 'notification.dart' as grain;
-import 'utils.dart';
+import 'package:grain/api.dart';
+import 'package:grain/models/notification.dart' as grain;
+import 'package:grain/utils.dart';
 
 class NotificationsPage extends StatefulWidget {
   const NotificationsPage({super.key});

lib/profile_page.dart lib/screens/profile_page.dart

···
 import 'package:flutter/material.dart';
-import 'package:grain/gallery.dart';
+import 'package:grain/models/gallery.dart';
 import 'package:grain/api.dart';
-import 'package:grain/gallery_page.dart';
+import 'gallery_page.dart';
 
 class ProfilePage extends StatefulWidget {
   final dynamic profile;

lib/screens/explore_page.dart

···
+import 'dart:async';
+import 'package:flutter/material.dart';
+import 'package:grain/api.dart';
+import 'package:grain/models/profile.dart';
+import 'profile_page.dart';
+
+class ExplorePage extends StatelessWidget {
+  const ExplorePage({super.key});
+
+  Future<List<Profile>> _delayedSearch(String query) async {
+    await Future.delayed(const Duration(milliseconds: 500));
+    return apiService.searchActors(query);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.all(16.0),
+      child: SearchAnchor.bar(
+        barHintText: 'Search for users',
+        barShape: WidgetStateProperty.all(
+          RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
+        ),
+        barElevation: WidgetStateProperty.all(0),
+        suggestionsBuilder: (context, controller) {
+          if (controller.text.isEmpty) {
+            return [];
+          }
+          return [
+            FutureBuilder<List<Profile>>(
+              future: _delayedSearch(controller.text),
+              builder: (context, snapshot) {
+                if (snapshot.connectionState == ConnectionState.waiting) {
+                  return const ListTile(
+                    title: Text('Searching...'),
+                    leading: SizedBox(
+                      width: 20,
+                      height: 20,
+                      child: CircularProgressIndicator(strokeWidth: 2),
+                    ),
+                  );
+                }
+                if (snapshot.hasError) {
+                  return const ListTile(title: Text('Error searching users'));
+                }
+                final results = snapshot.data ?? [];
+                if (results.isEmpty) {
+                  return const ListTile(title: Text('No users found'));
+                }
+                return Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: results.map((profile) {
+                    return ListTile(
+                      leading: profile.avatar.isNotEmpty
+                          ? CircleAvatar(
+                              backgroundImage: NetworkImage(profile.avatar),
+                              radius: 16,
+                            )
+                          : const CircleAvatar(
+                              radius: 16,
+                              child: Icon(
+                                Icons.account_circle,
+                                color: Colors.grey,
+                              ),
+                            ),
+                      title: Text(
+                        profile.displayName.isNotEmpty
+                            ? profile.displayName
+                            : '@${profile.handle}',
+                      ),
+                      subtitle: profile.handle.isNotEmpty
+                          ? Text('@${profile.handle}')
+                          : null,
+                      onTap: () async {
+                        // Navigate to the profile page for the selected user
+                        final loadedProfile = await apiService.fetchProfile(
+                          did: profile.did,
+                        );
+                        if (context.mounted) {
+                          Navigator.of(context).push(
+                            MaterialPageRoute(
+                              builder: (context) => ProfilePage(
+                                profile: loadedProfile,
+                                showAppBar: true,
+                              ),
+                            ),
+                          );
+                        }
+                      },
+                    );
+                  }).toList(),
+                );
+              },
+            ),
+          ];
+        },
+      ),
+    );
+  }
+}

pubspec.lock

···
     description: flutter
     source: sdk
     version: "0.0.0"
+  font_awesome_flutter:
+    dependency: "direct main"
+    description:
+      name: font_awesome_flutter
+      sha256: d3a89184101baec7f4600d58840a764d2ef760fe1c5a20ef9e6b0e9b24a07a3a
+      url: "https://pub.dev"
+    source: hosted
+    version: "10.8.0"
   freezed_annotation:
     dependency: transitive
     description:

pubspec.yaml

···
   google_fonts: ^6.2.1
   logger: ^2.6.0
   package_info_plus: ^8.3.0
+  font_awesome_flutter: ^10.8.0
 
 dependency_overrides:
   atproto_oauth: