fix live photo play button not updating

mobile/lib/widgets/asset_viewer/gallery_app_bar.dart

@@ -21,13 +21,8 @@ import 'package:immich_mobile/widgets/common/immich_toast.dart';
 
 class GalleryAppBar extends ConsumerWidget {
   final void Function() showInfo;
-  final ValueNotifier<bool> isPlayingMotionVideo;
 
-  const GalleryAppBar({
-    super.key,
-    required this.showInfo,
-    required this.isPlayingMotionVideo,
-  });
+  const GalleryAppBar({super.key, required this.showInfo});
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
@@ -109,15 +104,12 @@ class GalleryAppBar extends ConsumerWidget {
           child: TopControlAppBar(
             isOwner: isOwner,
             isPartner: isPartner,
-            isPlayingMotionVideo: isPlayingMotionVideo.value,
             asset: asset,
             onMoreInfoPressed: showInfo,
             onFavorite: toggleFavorite,
             onRestorePressed: () => handleRestore(asset),
             onUploadPressed: asset.isLocal ? () => handleUpload(asset) : null,
             onDownloadPressed: asset.isLocal ? null : handleDownloadAsset,
-            onToggleMotionVideo: () =>
-                isPlayingMotionVideo.value = !isPlayingMotionVideo.value,
             onAddToAlbumPressed: () => addToAlbum(asset),
             onActivitiesPressed: handleActivities,
           ),

mobile/lib/widgets/asset_viewer/motion_photo_button.dart

@@ -0,0 +1,22 @@
+import 'package:flutter/material.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/constants/immich_colors.dart';
+import 'package:immich_mobile/providers/asset_viewer/is_motion_video_playing.provider.dart';
+
+class MotionPhotoButton extends ConsumerWidget {
+  const MotionPhotoButton({super.key});
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final isPlaying = ref.watch(isPlayingMotionVideoProvider);
+
+    return IconButton(
+      onPressed: () {
+        ref.read(isPlayingMotionVideoProvider.notifier).toggle();
+      },
+      icon: isPlaying
+          ? const Icon(Icons.motion_photos_pause_outlined, color: grey200)
+          : const Icon(Icons.play_circle_outline_rounded, color: grey200),
+    );
+  }
+}

mobile/lib/widgets/asset_viewer/top_control_app_bar.dart

@@ -5,6 +5,7 @@ import 'package:immich_mobile/providers/activity_statistics.provider.dart';
 import 'package:immich_mobile/providers/album/current_album.provider.dart';
 import 'package:immich_mobile/entities/asset.entity.dart';
 import 'package:immich_mobile/providers/asset.provider.dart';
+import 'package:immich_mobile/widgets/asset_viewer/motion_photo_button.dart';
 
 class TopControlAppBar extends HookConsumerWidget {
   const TopControlAppBar({
@@ -14,8 +15,6 @@ class TopControlAppBar extends HookConsumerWidget {
     required this.onDownloadPressed,
     required this.onAddToAlbumPressed,
     required this.onRestorePressed,
-    required this.onToggleMotionVideo,
-    required this.isPlayingMotionVideo,
     required this.onFavorite,
     required this.onUploadPressed,
     required this.isOwner,
@@ -27,12 +26,10 @@ class TopControlAppBar extends HookConsumerWidget {
   final Function onMoreInfoPressed;
   final VoidCallback? onUploadPressed;
   final VoidCallback? onDownloadPressed;
-  final VoidCallback onToggleMotionVideo;
   final VoidCallback onAddToAlbumPressed;
   final VoidCallback onRestorePressed;
   final VoidCallback onActivitiesPressed;
   final Function(Asset) onFavorite;
-  final bool isPlayingMotionVideo;
   final bool isOwner;
   final bool isPartner;
 
@@ -57,23 +54,6 @@ class TopControlAppBar extends HookConsumerWidget {
       );
     }
 
-    Widget buildLivePhotoButton() {
-      return IconButton(
-        onPressed: () {
-          onToggleMotionVideo();
-        },
-        icon: isPlayingMotionVideo
-            ? Icon(
-                Icons.motion_photos_pause_outlined,
-                color: Colors.grey[200],
-              )
-            : Icon(
-                Icons.play_circle_outline_rounded,
-                color: Colors.grey[200],
-              ),
-      );
-    }
-
     Widget buildMoreInfoButton() {
       return IconButton(
         onPressed: () {
@@ -175,13 +155,11 @@ class TopControlAppBar extends HookConsumerWidget {
       foregroundColor: Colors.grey[100],
       backgroundColor: Colors.transparent,
       leading: buildBackButton(),
-      actionsIconTheme: const IconThemeData(
-        size: iconSize,
-      ),
+      actionsIconTheme: const IconThemeData(size: iconSize),
       shape: const Border(),
       actions: [
         if (asset.isRemote && isOwner) buildFavoriteButton(a),
-        if (asset.livePhotoVideoId != null) buildLivePhotoButton(),
+        if (asset.livePhotoVideoId != null) const MotionPhotoButton(),
         if (asset.isLocal && !asset.isRemote) buildUploadButton(),
         if (asset.isRemote && !asset.isLocal && isOwner) buildDownloadButton(),
         if (asset.isRemote && (isOwner || isPartner) && !asset.isTrashed)