feat: album edit (#19936)

mobile/lib/presentation/pages/drift_album.page.dart

@@ -13,6 +13,7 @@ import 'package:immich_mobile/models/albums/album_search.model.dart';
 import 'package:immich_mobile/pages/common/large_leading_tile.dart';
 import 'package:immich_mobile/presentation/widgets/images/thumbnail.widget.dart';
 import 'package:immich_mobile/providers/infrastructure/album.provider.dart';
+import 'package:immich_mobile/providers/infrastructure/current_album.provider.dart';
 import 'package:immich_mobile/providers/user.provider.dart';
 import 'package:immich_mobile/routing/router.dart';
 import 'package:immich_mobile/utils/remote_album.utils.dart';
@@ -478,7 +479,7 @@ class _QuickSortAndViewMode extends StatelessWidget {
   }
 }
 
-class _AlbumList extends StatelessWidget {
+class _AlbumList extends ConsumerWidget {
   const _AlbumList({
     required this.isLoading,
     required this.error,
@@ -492,7 +493,7 @@ class _AlbumList extends StatelessWidget {
   final String? userId;
 
   @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, WidgetRef ref) {
     if (isLoading) {
       return const SliverToBoxAdapter(
         child: Center(
@@ -567,9 +568,12 @@ class _AlbumList extends StatelessWidget {
                   color: context.colorScheme.onSurfaceSecondary,
                 ),
               ),
-              onTap: () => context.router.push(
-                RemoteAlbumRoute(album: album),
-              ),
+              onTap: () {
+                ref.read(currentRemoteAlbumProvider.notifier).setAlbum(album);
+                context.router.push(
+                  RemoteAlbumRoute(album: album),
+                );
+              },
               leadingPadding: const EdgeInsets.only(
                 right: 16,
               ),
@@ -692,7 +696,7 @@ class _AlbumGrid extends StatelessWidget {
   }
 }
 
-class _GridAlbumCard extends StatelessWidget {
+class _GridAlbumCard extends ConsumerWidget {
   const _GridAlbumCard({
     required this.album,
     required this.userId,
@@ -702,11 +706,14 @@ class _GridAlbumCard extends StatelessWidget {
   final String? userId;
 
   @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, WidgetRef ref) {
     return GestureDetector(
-      onTap: () => context.router.push(
-        RemoteAlbumRoute(album: album),
-      ),
+      onTap: () {
+        ref.read(currentRemoteAlbumProvider.notifier).setAlbum(album);
+        context.router.push(
+          RemoteAlbumRoute(album: album),
+        );
+      },
       child: Card(
         elevation: 0,
         color: context.colorScheme.surfaceBright,

mobile/lib/presentation/pages/drift_create_album.page.dart

@@ -6,6 +6,7 @@ import 'package:immich_mobile/extensions/build_context_extensions.dart';
 import 'package:immich_mobile/extensions/translate_extensions.dart';
 import 'package:immich_mobile/presentation/widgets/images/thumbnail.widget.dart';
 import 'package:immich_mobile/providers/infrastructure/album.provider.dart';
+import 'package:immich_mobile/providers/infrastructure/current_album.provider.dart';
 import 'package:immich_mobile/routing/router.dart';
 import 'package:immich_mobile/widgets/album/album_action_filled_button.dart';
 
@@ -202,6 +203,7 @@ class _DriftCreateAlbumPageState extends ConsumerState<DriftCreateAlbumPage> {
         );
 
     if (album != null) {
+      ref.read(currentRemoteAlbumProvider.notifier).setAlbum(album);
       context.replaceRoute(
         RemoteAlbumRoute(album: album),
       );

mobile/lib/presentation/pages/drift_remote_album.page.dart

@@ -1,17 +1,237 @@
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+
 import 'package:immich_mobile/domain/models/album/album.model.dart';
+import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';
+import 'package:immich_mobile/extensions/translate_extensions.dart';
 import 'package:immich_mobile/presentation/widgets/bottom_sheet/remote_album_bottom_sheet.widget.dart';
+import 'package:immich_mobile/presentation/widgets/remote_album/drift_album_option.widget.dart';
 import 'package:immich_mobile/presentation/widgets/timeline/timeline.widget.dart';
+import 'package:immich_mobile/providers/infrastructure/album.provider.dart';
+import 'package:immich_mobile/providers/infrastructure/remote_album.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
-import 'package:immich_mobile/widgets/common/mesmerizing_sliver_app_bar.dart';
+import 'package:immich_mobile/providers/user.provider.dart';
+import 'package:immich_mobile/routing/router.dart';
+import 'package:immich_mobile/widgets/common/immich_toast.dart';
+import 'package:immich_mobile/widgets/common/remote_album_sliver_app_bar.dart';
 
 @RoutePage()
-class RemoteAlbumPage extends StatelessWidget {
+class RemoteAlbumPage extends ConsumerStatefulWidget {
   final RemoteAlbum album;
 
-  const RemoteAlbumPage({super.key, required this.album});
+  const RemoteAlbumPage({
+    super.key,
+    required this.album,
+  });
+
+  @override
+  ConsumerState<RemoteAlbumPage> createState() => _RemoteAlbumPageState();
+}
+
+class _RemoteAlbumPageState extends ConsumerState<RemoteAlbumPage> {
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  Future<void> addAssets(BuildContext context) async {
+    final albumAssets =
+        await ref.read(remoteAlbumProvider.notifier).getAssets(widget.album.id);
+
+    final newAssets = await context.pushRoute<Set<BaseAsset>>(
+      DriftAssetSelectionTimelineRoute(
+        lockedSelectionAssets: albumAssets.toSet(),
+      ),
+    );
+
+    if (newAssets == null || newAssets.isEmpty) {
+      return;
+    }
+
+    final added = await ref.read(remoteAlbumProvider.notifier).addAssets(
+          widget.album.id,
+          newAssets.map((asset) {
+            final remoteAsset = asset as RemoteAsset;
+            return remoteAsset.id;
+          }).toList(),
+        );
+
+    if (added > 0) {
+      ImmichToast.show(
+        context: context,
+        msg: "assets_added_to_album_count".t(
+          context: context,
+          args: {
+            'count': added.toString(),
+          },
+        ),
+        toastType: ToastType.success,
+      );
+    }
+  }
+
+  Future<void> addUsers(BuildContext context) async {
+    final newUsers = await context.pushRoute<List<String>>(
+      DriftUserSelectionRoute(album: widget.album),
+    );
+
+    if (newUsers == null || newUsers.isEmpty) {
+      return;
+    }
+
+    try {
+      await ref
+          .read(remoteAlbumProvider.notifier)
+          .addUsers(widget.album.id, newUsers);
+
+      if (newUsers.isNotEmpty) {
+        ImmichToast.show(
+          context: context,
+          msg: "users_added_to_album_count".t(
+            context: context,
+            args: {
+              'count': newUsers.length,
+            },
+          ),
+          toastType: ToastType.success,
+        );
+      }
+
+      ref.invalidate(remoteAlbumSharedUsersProvider(widget.album.id));
+    } catch (e) {
+      ImmichToast.show(
+        context: context,
+        msg: "Failed to add users to album: ${e.toString()}",
+        toastType: ToastType.error,
+      );
+    }
+  }
+
+  Future<void> toggleAlbumOrder() async {
+    await ref.read(remoteAlbumProvider.notifier).toggleAlbumOrder(
+          widget.album.id,
+        );
+
+    ref.invalidate(timelineServiceProvider);
+  }
+
+  Future<void> deleteAlbum(BuildContext context) async {
+    final confirmed = await showDialog<bool>(
+      context: context,
+      builder: (BuildContext context) {
+        return AlertDialog(
+          title: Text('delete_album'.t(context: context)),
+          content: Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              Text(
+                'album_delete_confirmation'.t(
+                  context: context,
+                  args: {'album': widget.album.name},
+                ),
+              ),
+              const SizedBox(height: 8),
+              Text(
+                'album_delete_confirmation_description'.t(context: context),
+              ),
+            ],
+          ),
+          actions: [
+            TextButton(
+              onPressed: () => Navigator.of(context).pop(false),
+              child: Text('cancel'.t(context: context)),
+            ),
+            TextButton(
+              onPressed: () => Navigator.of(context).pop(true),
+              style: TextButton.styleFrom(
+                foregroundColor: Theme.of(context).colorScheme.error,
+              ),
+              child: Text('delete_album'.t(context: context)),
+            ),
+          ],
+        );
+      },
+    );
+
+    if (confirmed == true) {
+      try {
+        await ref
+            .read(remoteAlbumProvider.notifier)
+            .deleteAlbum(widget.album.id);
+
+        ImmichToast.show(
+          context: context,
+          msg: 'library_deleted'
+              .t(context: context), // Using existing success message
+          toastType: ToastType.success,
+        );
+
+        context.pushRoute(const DriftAlbumsRoute());
+      } catch (e) {
+        ImmichToast.show(
+          context: context,
+          msg: 'album_viewer_appbar_share_err_delete'.t(context: context),
+          toastType: ToastType.error,
+        );
+      }
+    }
+  }
+
+  Future<void> showEditTitleAndDescription(BuildContext context) async {
+    final result = await showDialog<_EditAlbumData?>(
+      context: context,
+      barrierDismissible: true,
+      builder: (context) => _EditAlbumDialog(album: widget.album),
+    );
+
+    if (result != null && context.mounted) {
+      HapticFeedback.mediumImpact();
+    }
+  }
+
+  void showOptionSheet(BuildContext context) {
+    final user = ref.watch(currentUserProvider);
+    final isOwner = user != null ? user.id == widget.album.ownerId : false;
+
+    showModalBottomSheet(
+      context: context,
+      backgroundColor: context.colorScheme.surface,
+      isScrollControlled: false,
+      builder: (context) {
+        return DriftRemoteAlbumOption(
+          onDeleteAlbum: isOwner
+              ? () async {
+                  await deleteAlbum(context);
+                  if (context.mounted) {
+                    context.pop();
+                  }
+                }
+              : null,
+          onAddUsers: isOwner
+              ? () async {
+                  await addUsers(context);
+                  context.pop();
+                }
+              : null,
+          onAddPhotos: () async {
+            await addAssets(context);
+            context.pop();
+          },
+          onToggleAlbumOrder: () async {
+            await toggleAlbumOrder();
+            context.pop();
+          },
+          onEditAlbum: () async {
+            context.pop();
+            await showEditTitleAndDescription(context);
+          },
+        );
+      },
+    );
+  }
 
   @override
   Widget build(BuildContext context) {
@@ -21,19 +241,207 @@ class RemoteAlbumPage extends StatelessWidget {
           (ref) {
             final timelineService = ref
                 .watch(timelineFactoryProvider)
-                .remoteAlbum(albumId: album.id);
+                .remoteAlbum(albumId: widget.album.id);
             ref.onDispose(timelineService.dispose);
             return timelineService;
           },
         ),
       ],
       child: Timeline(
-        appBar: MesmerizingSliverAppBar(
-          title: album.name,
+        appBar: RemoteAlbumSliverAppBar(
           icon: Icons.photo_album_outlined,
+          onShowOptions: () => showOptionSheet(context),
+          onToggleAlbumOrder: () => toggleAlbumOrder(),
+          onEditTitle: () => showEditTitleAndDescription(context),
         ),
         bottomSheet: RemoteAlbumBottomSheet(
-          album: album,
+          album: widget.album,
+        ),
+      ),
+    );
+  }
+}
+
+class _EditAlbumData {
+  final String name;
+  final String? description;
+
+  const _EditAlbumData({
+    required this.name,
+    this.description,
+  });
+}
+
+class _EditAlbumDialog extends ConsumerStatefulWidget {
+  final RemoteAlbum album;
+
+  const _EditAlbumDialog({
+    required this.album,
+  });
+
+  @override
+  ConsumerState<_EditAlbumDialog> createState() => _EditAlbumDialogState();
+}
+
+class _EditAlbumDialogState extends ConsumerState<_EditAlbumDialog> {
+  late final TextEditingController titleController;
+  late final TextEditingController descriptionController;
+  final formKey = GlobalKey<FormState>();
+
+  @override
+  void initState() {
+    super.initState();
+    titleController = TextEditingController(text: widget.album.name);
+    descriptionController = TextEditingController(
+      text: widget.album.description.isEmpty ? '' : widget.album.description,
+    );
+  }
+
+  @override
+  void dispose() {
+    titleController.dispose();
+    descriptionController.dispose();
+    super.dispose();
+  }
+
+  Future<void> _handleSave() async {
+    if (formKey.currentState?.validate() != true) return;
+
+    try {
+      final newTitle = titleController.text.trim();
+      final newDescription = descriptionController.text.trim();
+
+      await ref.read(remoteAlbumProvider.notifier).updateAlbum(
+            widget.album.id,
+            name: newTitle,
+            description: newDescription.isEmpty ? null : newDescription,
+          );
+
+      if (mounted) {
+        Navigator.of(context).pop(
+          _EditAlbumData(
+            name: newTitle,
+            description: newDescription.isEmpty ? null : newDescription,
+          ),
+        );
+      }
+    } catch (e) {
+      if (mounted) {
+        ImmichToast.show(
+          context: context,
+          msg: 'album_update_error'.t(context: context),
+          toastType: ToastType.error,
+        );
+      }
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Dialog(
+      insetPadding: const EdgeInsets.all(24),
+      shape: const RoundedRectangleBorder(
+        borderRadius: BorderRadius.all(
+          Radius.circular(16),
+        ),
+      ),
+      child: SingleChildScrollView(
+        child: Container(
+          padding: const EdgeInsets.all(16),
+          constraints: const BoxConstraints(maxWidth: 550),
+          child: Form(
+            key: formKey,
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              crossAxisAlignment: CrossAxisAlignment.stretch,
+              children: [
+                Row(
+                  children: [
+                    Icon(
+                      Icons.edit_outlined,
+                      color: context.colorScheme.primary,
+                      size: 24,
+                    ),
+                    const SizedBox(width: 12),
+                    Text(
+                      'edit_album'.t(context: context),
+                      style: context.textTheme.titleMedium,
+                    ),
+                  ],
+                ),
+                const SizedBox(height: 24),
+
+                // Album Name
+                Text(
+                  'album_name'.t(context: context).toUpperCase(),
+                  style: context.textTheme.labelSmall?.copyWith(
+                    fontWeight: FontWeight.w600,
+                  ),
+                ),
+                const SizedBox(height: 4),
+                TextFormField(
+                  controller: titleController,
+                  maxLines: 1,
+                  textCapitalization: TextCapitalization.sentences,
+                  decoration: InputDecoration(
+                    border: const OutlineInputBorder(
+                      borderRadius: BorderRadius.all(Radius.circular(12)),
+                    ),
+                    filled: true,
+                    fillColor: context.colorScheme.surface,
+                  ),
+                  validator: (value) {
+                    if (value == null || value.trim().isEmpty) {
+                      return 'album_name_required'.t(context: context);
+                    }
+
+                    return null;
+                  },
+                ),
+                const SizedBox(height: 18),
+
+                // Description
+                Text(
+                  'description'.t(context: context).toUpperCase(),
+                  style: context.textTheme.labelSmall?.copyWith(
+                    fontWeight: FontWeight.w600,
+                  ),
+                ),
+                const SizedBox(height: 4),
+                TextFormField(
+                  controller: descriptionController,
+                  maxLines: 4,
+                  textCapitalization: TextCapitalization.sentences,
+                  decoration: InputDecoration(
+                    border: const OutlineInputBorder(
+                      borderRadius: BorderRadius.all(
+                        Radius.circular(12),
+                      ),
+                    ),
+                    filled: true,
+                    fillColor: context.colorScheme.surface,
+                  ),
+                ),
+                const SizedBox(height: 24),
+
+                // Action Buttons
+                Row(
+                  mainAxisAlignment: MainAxisAlignment.end,
+                  children: [
+                    TextButton(
+                      onPressed: () => Navigator.of(context).pop(null),
+                      child: Text('cancel'.t(context: context)),
+                    ),
+                    const SizedBox(width: 12),
+                    FilledButton(
+                      onPressed: _handleSave,
+                      child: Text('save'.t(context: context)),
+                    ),
+                  ],
+                ),
+              ],
+            ),
+          ),
         ),
       ),
     );

mobile/lib/presentation/pages/drift_user_selection.page.dart

@@ -0,0 +1,215 @@
+import 'package:auto_route/auto_route.dart';
+import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/domain/models/user.model.dart';
+import 'package:immich_mobile/domain/models/album/album.model.dart';
+import 'package:immich_mobile/domain/models/user_metadata.model.dart';
+import 'package:immich_mobile/extensions/asyncvalue_extensions.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';
+import 'package:immich_mobile/providers/infrastructure/db.provider.dart';
+import 'package:immich_mobile/providers/infrastructure/remote_album.provider.dart';
+import 'package:immich_mobile/providers/user.provider.dart';
+import 'package:immich_mobile/widgets/common/user_circle_avatar.dart';
+
+// TODO: Refactor this provider when we have user provider/service/repository pattern in place
+final driftUsersProvider =
+    FutureProvider.autoDispose<List<UserDto>>((ref) async {
+  final drift = ref.watch(driftProvider);
+  final currentUser = ref.watch(currentUserProvider);
+
+  final userEntities = await drift.managers.userEntity.get();
+
+  final users = userEntities
+      .map(
+        (entity) => UserDto(
+          id: entity.id,
+          name: entity.name,
+          email: entity.email,
+          isAdmin: entity.isAdmin,
+          profileImagePath: entity.profileImagePath,
+          updatedAt: entity.updatedAt,
+          quotaSizeInBytes: entity.quotaSizeInBytes ?? 0,
+          quotaUsageInBytes: entity.quotaUsageInBytes,
+          isPartnerSharedBy: false,
+          isPartnerSharedWith: false,
+          avatarColor: AvatarColor.primary,
+          memoryEnabled: true,
+          inTimeline: true,
+        ),
+      )
+      .toList();
+
+  users.removeWhere((u) => currentUser?.id == u.id);
+
+  return users;
+});
+
+@RoutePage()
+class DriftUserSelectionPage extends HookConsumerWidget {
+  final RemoteAlbum album;
+
+  const DriftUserSelectionPage({
+    super.key,
+    required this.album,
+  });
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final AsyncValue<List<UserDto>> suggestedShareUsers =
+        ref.watch(driftUsersProvider);
+    final sharedUsersList = useState<Set<UserDto>>({});
+
+    addNewUsersHandler() {
+      context.maybePop(sharedUsersList.value.map((e) => e.id).toList());
+    }
+
+    buildTileIcon(UserDto user) {
+      if (sharedUsersList.value.contains(user)) {
+        return CircleAvatar(
+          backgroundColor: context.primaryColor,
+          child: const Icon(
+            Icons.check_rounded,
+            size: 25,
+          ),
+        );
+      } else {
+        return UserCircleAvatar(
+          user: user,
+        );
+      }
+    }
+
+    buildUserList(List<UserDto> users) {
+      List<Widget> usersChip = [];
+
+      for (var user in sharedUsersList.value) {
+        usersChip.add(
+          Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 8.0),
+            child: Chip(
+              backgroundColor: context.primaryColor.withValues(alpha: 0.15),
+              label: Text(
+                user.name,
+                style: const TextStyle(
+                  fontSize: 12,
+                  fontWeight: FontWeight.bold,
+                ),
+              ),
+            ),
+          ),
+        );
+      }
+      return ListView(
+        children: [
+          Wrap(
+            children: [...usersChip],
+          ),
+          Padding(
+            padding: const EdgeInsets.all(16.0),
+            child: Text(
+              'suggestions'.tr(),
+              style: const TextStyle(
+                fontSize: 14,
+                color: Colors.grey,
+                fontWeight: FontWeight.bold,
+              ),
+            ),
+          ),
+          ListView.builder(
+            primary: false,
+            shrinkWrap: true,
+            itemBuilder: ((context, index) {
+              return ListTile(
+                leading: buildTileIcon(users[index]),
+                dense: true,
+                title: Text(
+                  users[index].name,
+                  style: const TextStyle(
+                    fontSize: 14,
+                    fontWeight: FontWeight.bold,
+                  ),
+                ),
+                subtitle: Text(
+                  users[index].email,
+                  style: const TextStyle(
+                    fontSize: 12,
+                  ),
+                ),
+                onTap: () {
+                  if (sharedUsersList.value.contains(users[index])) {
+                    sharedUsersList.value = sharedUsersList.value
+                        .where(
+                          (selectedUser) => selectedUser.id != users[index].id,
+                        )
+                        .toSet();
+                  } else {
+                    sharedUsersList.value = {
+                      ...sharedUsersList.value,
+                      users[index],
+                    };
+                  }
+                },
+              );
+            }),
+            itemCount: users.length,
+          ),
+        ],
+      );
+    }
+
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text(
+          'invite_to_album',
+        ).tr(),
+        elevation: 0,
+        centerTitle: false,
+        leading: IconButton(
+          icon: const Icon(Icons.close_rounded),
+          onPressed: () {
+            context.maybePop(null);
+          },
+        ),
+        actions: [
+          TextButton(
+            onPressed:
+                sharedUsersList.value.isEmpty ? null : addNewUsersHandler,
+            child: const Text(
+              "add",
+              style: TextStyle(fontSize: 14, fontWeight: FontWeight.bold),
+            ).tr(),
+          ),
+        ],
+      ),
+      body: suggestedShareUsers.widgetWhen(
+        onData: (users) {
+          // Get shared users for this album from the database
+          final sharedUsers =
+              ref.watch(remoteAlbumSharedUsersProvider(album.id));
+
+          return sharedUsers.when(
+            data: (albumSharedUsers) {
+              // Filter out users that are already shared with this album and the owner
+              final filteredUsers = users.where((user) {
+                return !albumSharedUsers
+                        .any((sharedUser) => sharedUser.id == user.id) &&
+                    user.id != album.ownerId;
+              }).toList();
+
+              return buildUserList(filteredUsers);
+            },
+            loading: () => const Center(child: CircularProgressIndicator()),
+            error: (error, stack) {
+              // If we can't load shared users, just filter out the owner
+              final filteredUsers =
+                  users.where((user) => user.id != album.ownerId).toList();
+              return buildUserList(filteredUsers);
+            },
+          );
+        },
+      ),
+    );
+  }
+}

mobile/lib/presentation/widgets/remote_album/drift_album_option.widget.dart

@@ -0,0 +1,118 @@
+import 'package:flutter/material.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/extensions/build_context_extensions.dart';
+import 'package:immich_mobile/extensions/translate_extensions.dart';
+
+class DriftRemoteAlbumOption extends ConsumerWidget {
+  const DriftRemoteAlbumOption({
+    super.key,
+    this.onAddPhotos,
+    this.onAddUsers,
+    this.onDeleteAlbum,
+    this.onLeaveAlbum,
+    this.onCreateSharedLink,
+    this.onToggleAlbumOrder,
+    this.onEditAlbum,
+  });
+
+  final VoidCallback? onAddPhotos;
+  final VoidCallback? onAddUsers;
+  final VoidCallback? onDeleteAlbum;
+  final VoidCallback? onLeaveAlbum;
+  final VoidCallback? onCreateSharedLink;
+  final VoidCallback? onToggleAlbumOrder;
+  final VoidCallback? onEditAlbum;
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    TextStyle textStyle = Theme.of(context).textTheme.bodyLarge!.copyWith(
+          fontWeight: FontWeight.w600,
+        );
+
+    return SafeArea(
+      child: Padding(
+        padding: const EdgeInsets.symmetric(vertical: 24.0),
+        child: ListView(
+          shrinkWrap: true,
+          children: [
+            if (onEditAlbum != null)
+              ListTile(
+                leading: const Icon(Icons.edit),
+                title: Text(
+                  'edit_album'.t(context: context),
+                  style: textStyle,
+                ),
+                onTap: onEditAlbum,
+              ),
+            if (onAddPhotos != null)
+              ListTile(
+                leading: const Icon(Icons.add_a_photo),
+                title: Text(
+                  'add_photos'.t(context: context),
+                  style: textStyle,
+                ),
+                onTap: onAddPhotos,
+              ),
+            if (onAddUsers != null)
+              ListTile(
+                leading: const Icon(Icons.group_add),
+                title: Text(
+                  'album_viewer_page_share_add_users'.t(context: context),
+                  style: textStyle,
+                ),
+                onTap: onAddUsers,
+              ),
+            if (onLeaveAlbum != null)
+              ListTile(
+                leading: const Icon(Icons.person_remove_rounded),
+                title: Text(
+                  'leave_album'.t(context: context),
+                  style: textStyle,
+                ),
+                onTap: onLeaveAlbum,
+              ),
+            if (onToggleAlbumOrder != null)
+              ListTile(
+                leading: const Icon(Icons.swap_vert_rounded),
+                title: Text(
+                  'change_display_order'.t(context: context),
+                  style: textStyle,
+                ),
+                onTap: onToggleAlbumOrder,
+              ),
+            if (onCreateSharedLink != null)
+              ListTile(
+                leading: const Icon(Icons.link),
+                title: Text(
+                  'create_shared_link'.t(context: context),
+                  style: textStyle,
+                ),
+                onTap: onCreateSharedLink,
+              ),
+            if (onDeleteAlbum != null) ...[
+              const Divider(
+                indent: 16,
+                endIndent: 16,
+              ),
+              ListTile(
+                leading: Icon(
+                  Icons.delete,
+                  color:
+                      context.isDarkTheme ? Colors.red[400] : Colors.red[800],
+                ),
+                title: Text(
+                  'delete_album'.t(context: context),
+                  style: textStyle.copyWith(
+                    color:
+                        context.isDarkTheme ? Colors.red[400] : Colors.red[800],
+                  ),
+                ),
+                onTap: onDeleteAlbum,
+              ),
+            ],
+          ],
+        ),
+      ),
+    );
+  }
+}