feat(mobile): Add to album from asset detail view (#1413)

* add to album from asset detail view

* layout and design

* added shared albums

* fixed remote, asset update, and hit test

* made static size

* fixed create album

* suppress shared expansion tile if there are no shared albums

* updates album

* padding on tile

mobile/lib/modules/asset_viewer/ui/top_control_app_bar.dart

@@ -11,6 +11,7 @@ class TopControlAppBar extends HookConsumerWidget with PreferredSizeWidget {
     required this.onDownloadPressed,
     required this.onSharePressed,
     required this.onDeletePressed,
+    required this.onAddToAlbumPressed,
     required this.onToggleMotionVideo,
     required this.isPlayingMotionVideo,
   }) : super(key: key);
@@ -20,6 +21,7 @@ class TopControlAppBar extends HookConsumerWidget with PreferredSizeWidget {
   final VoidCallback? onDownloadPressed;
   final VoidCallback onToggleMotionVideo;
   final VoidCallback onDeletePressed;
+  final VoidCallback onAddToAlbumPressed;
   final Function onSharePressed;
   final bool isPlayingMotionVideo;
 
@@ -80,6 +82,18 @@ class TopControlAppBar extends HookConsumerWidget with PreferredSizeWidget {
             color: Colors.grey[200],
           ),
         ),
+        if (asset.isRemote)
+          IconButton(
+            iconSize: iconSize,
+            splashRadius: iconSize,
+            onPressed: () {
+              onAddToAlbumPressed();
+            },
+            icon: Icon(
+              Icons.add,
+              color: Colors.grey[200],
+            ),
+          ),
         IconButton(
           iconSize: iconSize,
           splashRadius: iconSize,

mobile/lib/modules/asset_viewer/views/gallery_viewer.dart

@@ -5,6 +5,7 @@ import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hive/hive.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/constants/hive_box.dart';
+import 'package:immich_mobile/modules/album/ui/add_to_album_list.dart';
 import 'package:immich_mobile/modules/asset_viewer/providers/image_viewer_page_state.provider.dart';
 import 'package:immich_mobile/modules/asset_viewer/ui/exif_bottom_sheet.dart';
 import 'package:immich_mobile/modules/asset_viewer/ui/top_control_app_bar.dart';
@@ -105,6 +106,22 @@ class GalleryViewerPage extends HookConsumerWidget {
       );
     }
 
+    void addToAlbum(Asset addToAlbumAsset) {
+      showModalBottomSheet(
+        shape: RoundedRectangleBorder(
+          borderRadius: BorderRadius.circular(15.0),
+        ),
+        barrierColor: Colors.transparent,
+        backgroundColor: Colors.transparent,
+        context: context,
+        builder: (BuildContext _) {
+          return AddToAlbumList(
+            asset: addToAlbumAsset,
+          );
+        },
+      );
+    }
+
     return Scaffold(
       backgroundColor: Colors.black,
       appBar: TopControlAppBar(
@@ -130,6 +147,7 @@ class GalleryViewerPage extends HookConsumerWidget {
           isPlayingMotionVideo.value = !isPlayingMotionVideo.value;
         }),
         onDeletePressed: () => handleDelete((assetList[indexOfAsset.value])),
+        onAddToAlbumPressed: () => addToAlbum(assetList[indexOfAsset.value]),
       ),
       body: SafeArea(
         child: PageView.builder(