feat: initial work to change groups to cards

gruprsvp · Dec 30, 2024 · 46720ed · 46720ed
1 parent 9f21382
commit 46720ed
Show file tree

Hide file tree

Showing 5 changed files with 85 additions and 26 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/containers/group_details.dart b/lib/presentation/containers/group_details.dart
@@ -5,7 +5,7 @@ import 'package:freezed_annotation/freezed_annotation.dart';
 import 'package:parousia/actions/actions.dart';
 import 'package:parousia/models/models.dart';
 import 'package:parousia/presentation/presentation.dart';
-import 'package:parousia/selectors/members.dart';
+import 'package:parousia/selectors/selectors.dart';
 import 'package:parousia/state/state.dart';
 import 'package:redux/redux.dart';
 

diff --git a/lib/presentation/screens/group_details.dart b/lib/presentation/screens/group_details.dart
@@ -19,25 +19,52 @@ class GroupDetailsScreen extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final l10n = AppLocalizations.of(context)!;
+    final textTheme = Theme.of(context).textTheme;
+
     final groupId = group?.id;
     final groupIdStr = groupId?.toString();
+    final groupImage = group?.picture;
+    final groupName = group?.displayName ?? groupIdStr ?? '';
     final groupDescription = group?.description;
 
     return Scaffold(
-        appBar: AppBar(
-          title: Text(group?.displayName ?? l10n.loading),
-        ),
-        body: Column(
-          children: [
-            const DateDropdownContainer(),
-            if (groupDescription != null)
-              Padding(
-                padding: const EdgeInsets.only(left: 16.0, right: 16.0),
-                child: Text(groupDescription),
-              ),
-            Expanded(child: SchedulesListContainer(groupId: groupIdStr)),
-          ],
-        ),
+        body: NestedScrollView(
+            headerSliverBuilder: (context, innerBoxIsScrolled) => [
+                  SliverAppBar(
+                    pinned: true,
+                    expandedHeight: groupImage != null ? 256 : 0,
+                    flexibleSpace: FlexibleSpaceBar(
+                        background: groupImage != null
+                            ? Hero(
+                                tag: groupImage,
+                                child: ClipRRect(
+                                  borderRadius: BorderRadius.vertical(
+                                      bottom: Radius.circular(24)),
+                                  child: AspectRatio(
+                                    aspectRatio: 1,
+                                    child: Image.network(groupImage,
+                                        fit: BoxFit.cover),
+                                  ),
+                                ),
+                              )
+                            : null,
+                        collapseMode: CollapseMode.pin,
+                        title: Hero(
+                          tag: groupName,
+                          child:
+                              Text(groupName, style: textTheme.headlineMedium),
+                        )),
+                  ),
+                  SliverToBoxAdapter(
+                    child: Column(
+                      children: [
+                        if (groupDescription != null) Text(groupDescription),
+                        const DateDropdownContainer(),
+                      ],
+                    ),
+                  ),
+                ],
+            body: SchedulesListContainer(groupId: groupIdStr)),
         floatingActionButton: isAdmin && groupIdStr != null
             ? FloatingActionButton.extended(
                 onPressed: () =>

diff --git a/lib/presentation/widgets/groups_list.dart b/lib/presentation/widgets/groups_list.dart
@@ -10,15 +10,37 @@ class GroupsList extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return ListView.builder(
+    final theme = Theme.of(context);
+    return ListView.separated(
+      separatorBuilder: (context, index) => const SizedBox(height: 8),
       itemBuilder: (context, index) {
         final group = groups!.elementAt(index);
+        final picture = group.picture;
+        final displayName = group.displayName;
+        final description = group.description ?? '';
+
         return ListTile(
-          // TODO avatar and description
-          title: Text(group.displayName),
-          subtitle: group.description != null
-              ? Text(group.description!.split('\n').first)
-              : null,
+          leading: Hero(
+            tag: picture ?? group.hashCode,
+            child: CircleAvatar(
+              radius: 32,
+              foregroundImage: picture != null ? NetworkImage(picture) : null,
+              child: Icon(
+                Icons.group,
+                size: 32,
+                color: Colors.white,
+              ),
+            ),
+          ),
+          title: Hero(
+              tag: displayName,
+              child: Text(displayName, style: theme.textTheme.headlineMedium)),
+          subtitle: Text(
+            description,
+            overflow: TextOverflow.fade,
+            softWrap: false,
+            maxLines: 1,
+          ),
           onTap: () =>
               GroupDetailsRoute(groupId: group.id.toString()).push(context),
         );

diff --git a/lib/util/fakes.dart b/lib/util/fakes.dart
@@ -8,21 +8,21 @@ class Fake {
   static Profile profile() => Profile(
         id: const Uuid().v4(),
         displayName: faker.person.name(),
-        picture: faker.image.image(height: 128, width: 128),
+        picture: faker.image.loremPicsum(height: 128, width: 128),
       );
 
   static Group group() => Group(
         id: const Uuid().v7(),
         displayName: faker.company.name(),
         description: faker.lorem.sentence(),
-        picture: faker.image.image(height: 128, width: 128),
+        picture: faker.image.loremPicsum(height: 512, width: 512),
       );
 
-  static Schedule schedule() => Schedule(
+  static Schedule schedule({String? groupId}) => Schedule(
         id: const Uuid().v7(),
-        groupId: const Uuid().v7(),
+        groupId: groupId ?? const Uuid().v7(),
         displayName: faker.lorem.sentence(),
-        recurrenceRule: CommonRecurrenceRules.monthly,
+        recurrenceRule: CommonRecurrenceRules.daily,
         startDate: DateTime.now(),
       );
 }