feat(mobile): Videos play in memories now (#6940)

* Videos play in memories now

Remove auto video advance

* to next asset after video is done playing

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>

mobile/lib/modules/memories/ui/memory_card.dart

@@ -3,6 +3,7 @@ import 'dart:ui';
 import 'package:cached_network_image/cached_network_image.dart';
 import 'package:flutter/material.dart';
 import 'package:immich_mobile/extensions/build_context_extensions.dart';
+import 'package:immich_mobile/modules/asset_viewer/views/video_viewer_page.dart';
 import 'package:immich_mobile/shared/models/asset.dart';
 import 'package:immich_mobile/shared/models/store.dart';
 import 'package:immich_mobile/shared/ui/immich_image.dart';
@@ -11,15 +12,15 @@ import 'package:openapi/api.dart';
 
 class MemoryCard extends StatelessWidget {
   final Asset asset;
-  final void Function() onTap;
   final String title;
   final bool showTitle;
+  final Function()? onVideoEnded;
 
   const MemoryCard({
     required this.asset,
-    required this.onTap,
     required this.title,
     required this.showTitle,
+    this.onVideoEnded,
     super.key,
   });
 
@@ -59,24 +60,23 @@ class MemoryCard extends StatelessWidget {
               child: Container(color: Colors.black.withOpacity(0.2)),
             ),
           ),
-          GestureDetector(
-            onTap: onTap,
-            child: LayoutBuilder(
-              builder: (context, constraints) {
-                // Determine the fit using the aspect ratio
-                BoxFit fit = BoxFit.fitWidth;
-                if (asset.width != null && asset.height != null) {
-                  final aspectRatio = asset.width! / asset.height!;
-                  final phoneAspectRatio =
-                      constraints.maxWidth / constraints.maxHeight;
-                  // Look for a 25% difference in either direction
-                  if (phoneAspectRatio * .75 < aspectRatio &&
-                      phoneAspectRatio * 1.25 > aspectRatio) {
-                    // Cover to look nice if we have nearly the same aspect ratio
-                    fit = BoxFit.cover;
-                  }
+          LayoutBuilder(
+            builder: (context, constraints) {
+              // Determine the fit using the aspect ratio
+              BoxFit fit = BoxFit.fitWidth;
+              if (asset.width != null && asset.height != null) {
+                final aspectRatio = asset.height! / asset.width!;
+                final phoneAspectRatio =
+                    constraints.maxWidth / constraints.maxHeight;
+                // Look for a 25% difference in either direction
+                if (phoneAspectRatio * .75 < aspectRatio &&
+                    phoneAspectRatio * 1.25 > aspectRatio) {
+                  // Cover to look nice if we have nearly the same aspect ratio
+                  fit = BoxFit.cover;
                 }
+              }
 
+              if (asset.isImage) {
                 return Hero(
                   tag: 'memory-${asset.id}',
                   child: ImmichImage(
@@ -88,8 +88,25 @@ class MemoryCard extends StatelessWidget {
                     preferredLocalAssetSize: 2048,
                   ),
                 );
-              },
-            ),
+              } else {
+                return Hero(
+                  tag: 'memory-${asset.id}',
+                  child: VideoViewerPage(
+                    asset: asset,
+                    showDownloadingIndicator: false,
+                    placeholder: ImmichImage(
+                      asset,
+                      fit: fit,
+                      type: ThumbnailFormat.JPEG,
+                      preferredLocalAssetSize: 2048,
+                    ),
+                    hideControlsTimer: const Duration(seconds: 2),
+                    onVideoEnded: onVideoEnded,
+                    showControls: false,
+                  ),
+                );
+              }
+            },
           ),
           if (showTitle)
             Positioned(