feat: initial work to change groups to cards

gruprsvp · Dec 19, 2024 · d2aaf63 · d2aaf63
1 parent 8aac52b
commit d2aaf63
Show file tree

Hide file tree

Showing 3 changed files with 66 additions and 9 deletions.
diff --git a/ios/Podfile.lock b/ios/Podfile.lock
@@ -30,6 +30,9 @@ PODS:
   - GTMSessionFetcher/Core (3.5.0)
   - GTMSessionFetcher/Full (3.5.0):
     - GTMSessionFetcher/Core
+  - image_cropper (0.0.4):
+    - Flutter
+    - TOCropViewController (~> 2.7.4)
   - image_picker_ios (0.0.1):
     - Flutter
   - integration_test (0.0.1):
@@ -44,6 +47,7 @@ PODS:
     - FlutterMacOS
   - sign_in_with_apple (0.0.1):
     - Flutter
+  - TOCropViewController (2.7.4)
   - url_launcher_ios (0.0.1):
     - Flutter
 
@@ -53,6 +57,7 @@ DEPENDENCIES:
   - flutter_contacts (from `.symlinks/plugins/flutter_contacts/ios`)
   - flutter_native_splash (from `.symlinks/plugins/flutter_native_splash/ios`)
   - google_sign_in_ios (from `.symlinks/plugins/google_sign_in_ios/darwin`)
+  - image_cropper (from `.symlinks/plugins/image_cropper/ios`)
   - image_picker_ios (from `.symlinks/plugins/image_picker_ios/ios`)
   - integration_test (from `.symlinks/plugins/integration_test/ios`)
   - path_provider_foundation (from `.symlinks/plugins/path_provider_foundation/darwin`)
@@ -67,6 +72,7 @@ SPEC REPOS:
     - GoogleSignIn
     - GTMAppAuth
     - GTMSessionFetcher
+    - TOCropViewController
 
 EXTERNAL SOURCES:
   app_links:
@@ -79,6 +85,8 @@ EXTERNAL SOURCES:
     :path: ".symlinks/plugins/flutter_native_splash/ios"
   google_sign_in_ios:
     :path: ".symlinks/plugins/google_sign_in_ios/darwin"
+  image_cropper:
+    :path: ".symlinks/plugins/image_cropper/ios"
   image_picker_ios:
     :path: ".symlinks/plugins/image_picker_ios/ios"
   integration_test:
@@ -104,12 +112,14 @@ SPEC CHECKSUMS:
   GoogleSignIn: d4281ab6cf21542b1cfaff85c191f230b399d2db
   GTMAppAuth: f69bd07d68cd3b766125f7e072c45d7340dea0de
   GTMSessionFetcher: 5aea5ba6bd522a239e236100971f10cb71b96ab6
+  image_cropper: 5f162dcf988100dc1513f9c6b7eb42cd6fbf9156
   image_picker_ios: 7fe1ff8e34c1790d6fff70a32484959f563a928a
   integration_test: 4a889634ef21a45d28d50d622cf412dc6d9f586e
   path_provider_foundation: 080d55be775b7414fd5a5ef3ac137b97b097e564
   share_plus: 50da8cb520a8f0f65671c6c6a99b3617ed10a58a
   shared_preferences_foundation: 9e1978ff2562383bd5676f64ec4e9aa8fa06a6f7
   sign_in_with_apple: c5dcc141574c8c54d5ac99dd2163c0c72ad22418
+  TOCropViewController: 80b8985ad794298fb69d3341de183f33d1853654
   url_launcher_ios: 694010445543906933d732453a59da0a173ae33d
 
 PODFILE CHECKSUM: 7be2f5f74864d463a8ad433546ed1de7e0f29aef

diff --git a/lib/presentation/screens/group_details.dart b/lib/presentation/screens/group_details.dart
@@ -21,6 +21,7 @@ class GroupDetailsScreen extends StatelessWidget {
     final l10n = AppLocalizations.of(context)!;
     final groupId = group?.id;
     final groupIdStr = groupId?.toString();
+    final groupImage = group?.picture;
     final groupDescription = group?.description;
 
     return Scaffold(
@@ -29,6 +30,18 @@ class GroupDetailsScreen extends StatelessWidget {
         ),
         body: Column(
           children: [
+            if (groupImage != null)
+              ClipRRect(
+                borderRadius:
+                    BorderRadius.vertical(bottom: Radius.circular(24)),
+                child: AspectRatio(
+                  aspectRatio: 1,
+                  child: Hero(
+                    tag: groupImage,
+                    child: Image.network(groupImage, fit: BoxFit.cover),
+                  ),
+                ),
+              ),
             const DateDropdownContainer(),
             if (groupDescription != null)
               Padding(

diff --git a/lib/presentation/widgets/groups_list.dart b/lib/presentation/widgets/groups_list.dart
@@ -10,17 +10,51 @@ class GroupsList extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return ListView.builder(
+    final theme = Theme.of(context);
+    return GridView.builder(
+      gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(
+        maxCrossAxisExtent: 512,
+        childAspectRatio: 3 / 4,
+      ),
       itemBuilder: (context, index) {
         final group = groups!.elementAt(index);
-        return ListTile(
-          // TODO avatar and description
-          title: Text(group.displayName),
-          subtitle: group.description != null
-              ? Text(group.description!.split('\n').first)
-              : null,
-          onTap: () =>
-              GroupDetailsRoute(groupId: group.id.toString()).push(context),
+        return Card.outlined(
+          clipBehavior: Clip.antiAlias,
+          child: InkWell(
+            onTap: () =>
+                GroupDetailsRoute(groupId: group.id.toString()).push(context),
+            child: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                if (group.picture != null)
+                  ClipRRect(
+                    borderRadius:
+                        BorderRadius.vertical(bottom: Radius.circular(24)),
+                    child: AspectRatio(
+                      aspectRatio: 1,
+                      child: Hero(
+                        tag: group.picture!,
+                        child: Image.network(
+                          group.picture!,
+                          fit: BoxFit.cover,
+                        ),
+                      ),
+                    ),
+                  ),
+                Padding(
+                  padding: const EdgeInsets.all(16),
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    children: [
+                      Text(group.displayName,
+                          style: theme.textTheme.headlineMedium),
+                      if (group.description != null) Text(group.description!),
+                    ],
+                  ),
+                ),
+              ],
+            ),
+          ),
         );
       },
       itemCount: groups?.length ?? 0,