cleanup

# Conflicts:
#	mobile/android/app/src/main/kotlin/app/alextran/immich/sync/Messages.g.kt
#	mobile/ios/Runner/Sync/Messages.g.swift
#	mobile/lib/platform/native_sync_api.g.dart

i18n/en.json

@@ -976,7 +976,6 @@
   "downloading_asset_filename": "Downloading asset {filename}",
   "downloading_from_icloud": "Downloading from iCloud",
   "downloading_media": "Downloading media",
-  "drag_to_reorder": "Drag to reorder",
   "drop_files_to_upload": "Drop files anywhere to upload",
   "duplicates": "Duplicates",
   "duplicates_description": "Resolve each group by indicating which, if any, are duplicates.",
@@ -2255,7 +2254,6 @@
   "step_delete_confirm": "Are you sure you want to delete this step?",
   "step_details": "Step details",
   "steps": "Steps",
-  "steps_count": "{count, plural, one {# step} other {# steps}}",
   "stop_casting": "Stop casting",
   "stop_motion_photo": "Stop Motion Photo",
   "stop_photo_sharing": "Stop sharing your photos?",
@@ -2478,7 +2476,6 @@
   "week": "Week",
   "welcome": "Welcome",
   "welcome_to_immich": "Welcome to Immich",
-  "when": "When",
   "width": "Width",
   "wifi_name": "Wi-Fi Name",
   "workflow": "Workflow",

mobile/android/app/src/main/AndroidManifest.xml

@@ -89,6 +89,20 @@
         <data android:mimeType="video/*" />
       </intent-filter>
 
+      <!-- Allow Immich to act as an image viewer -->
+      <intent-filter android:label="View in Immich">
+        <action android:name="android.intent.action.VIEW" />
+        <category android:name="android.intent.category.DEFAULT" />
+        <data android:scheme="content" android:mimeType="image/*" />
+      </intent-filter>
+
+      <!-- Allow Immich to act as a video viewer -->
+      <intent-filter android:label="View in Immich">
+        <action android:name="android.intent.action.VIEW" />
+        <category android:name="android.intent.category.DEFAULT" />
+        <data android:scheme="content" android:mimeType="video/*" />
+      </intent-filter>
+
       <!-- immich:// URL scheme handling -->
       <intent-filter>
         <action android:name="android.intent.action.VIEW" />

mobile/android/app/src/main/kotlin/app/alextran/immich/MainActivity.kt

@@ -1,6 +1,7 @@
 package app.alextran.immich
 
 import android.content.Context
+import android.content.Intent
 import android.os.Build
 import android.os.ext.SdkExtensions
 import app.alextran.immich.background.BackgroundEngineLock
@@ -22,6 +23,7 @@ import app.alextran.immich.permission.PermissionApiImpl
 import app.alextran.immich.sync.NativeSyncApi
 import app.alextran.immich.sync.NativeSyncApiImpl26
 import app.alextran.immich.sync.NativeSyncApiImpl30
+import app.alextran.immich.viewintent.ViewIntentPlugin
 import io.flutter.embedding.android.FlutterFragmentActivity
 import io.flutter.embedding.engine.FlutterEngine
 
@@ -31,6 +33,11 @@ class MainActivity : FlutterFragmentActivity() {
     registerPlugins(this, flutterEngine)
   }
 
+  override fun onNewIntent(intent: Intent) {
+    super.onNewIntent(intent)
+    setIntent(intent)
+  }
+
   companion object {
     fun registerPlugins(ctx: Context, flutterEngine: FlutterEngine) {
       HttpClientManager.initialize(ctx)
@@ -55,6 +62,7 @@ class MainActivity : FlutterFragmentActivity() {
       BackgroundWorkerFgHostApi.setUp(messenger, BackgroundWorkerApiImpl(ctx))
       ConnectivityApi.setUp(messenger, ConnectivityApiImpl(ctx))
 
+      flutterEngine.plugins.add(ViewIntentPlugin())
       flutterEngine.plugins.add(backgroundEngineLockImpl)
       flutterEngine.plugins.add(nativeSyncApiImpl)
       flutterEngine.plugins.add(permissionApiImpl)

mobile/android/app/src/main/kotlin/app/alextran/immich/viewintent/ViewIntent.g.kt

@@ -0,0 +1,292 @@
+// Autogenerated from Pigeon (v26.3.4), do not edit directly.
+// See also: https://pub.dev/packages/pigeon
+@file:Suppress("UNCHECKED_CAST", "ArrayInDataClass")
+
+package app.alextran.immich.viewintent
+
+import android.util.Log
+import io.flutter.plugin.common.BasicMessageChannel
+import io.flutter.plugin.common.BinaryMessenger
+import io.flutter.plugin.common.EventChannel
+import io.flutter.plugin.common.MessageCodec
+import io.flutter.plugin.common.StandardMethodCodec
+import io.flutter.plugin.common.StandardMessageCodec
+import java.io.ByteArrayOutputStream
+import java.nio.ByteBuffer
+private object ViewIntentPigeonUtils {
+
+  fun wrapResult(result: Any?): List<Any?> {
+    return listOf(result)
+  }
+
+  fun wrapError(exception: Throwable): List<Any?> {
+    return if (exception is FlutterError) {
+      listOf(
+        exception.code,
+        exception.message,
+        exception.details
+      )
+    } else {
+      listOf(
+        exception.javaClass.simpleName,
+        exception.toString(),
+        "Cause: " + exception.cause + ", Stacktrace: " + Log.getStackTraceString(exception)
+      )
+    }
+  }
+  fun doubleEquals(a: Double, b: Double): Boolean {
+    // Normalize -0.0 to 0.0 and handle NaN equality.
+    return (if (a == 0.0) 0.0 else a) == (if (b == 0.0) 0.0 else b) || (a.isNaN() && b.isNaN())
+  }
+
+  fun floatEquals(a: Float, b: Float): Boolean {
+    // Normalize -0.0 to 0.0 and handle NaN equality.
+    return (if (a == 0.0f) 0.0f else a) == (if (b == 0.0f) 0.0f else b) || (a.isNaN() && b.isNaN())
+  }
+
+  fun doubleHash(d: Double): Int {
+    // Normalize -0.0 to 0.0 and handle NaN to ensure consistent hash codes.
+    val normalized = if (d == 0.0) 0.0 else d
+    val bits = java.lang.Double.doubleToLongBits(normalized)
+    return (bits xor (bits ushr 32)).toInt()
+  }
+
+  fun floatHash(f: Float): Int {
+    // Normalize -0.0 to 0.0 and handle NaN to ensure consistent hash codes.
+    val normalized = if (f == 0.0f) 0.0f else f
+    return java.lang.Float.floatToIntBits(normalized)
+  }
+
+  fun deepEquals(a: Any?, b: Any?): Boolean {
+    if (a === b) {
+      return true
+    }
+    if (a == null || b == null) {
+      return false
+    }
+    if (a is ByteArray && b is ByteArray) {
+      return a.contentEquals(b)
+    }
+    if (a is IntArray && b is IntArray) {
+      return a.contentEquals(b)
+    }
+    if (a is LongArray && b is LongArray) {
+      return a.contentEquals(b)
+    }
+    if (a is DoubleArray && b is DoubleArray) {
+      if (a.size != b.size) return false
+      for (i in a.indices) {
+        if (!doubleEquals(a[i], b[i])) return false
+      }
+      return true
+    }
+    if (a is FloatArray && b is FloatArray) {
+      if (a.size != b.size) return false
+      for (i in a.indices) {
+        if (!floatEquals(a[i], b[i])) return false
+      }
+      return true
+    }
+    if (a is Array<*> && b is Array<*>) {
+      if (a.size != b.size) return false
+      for (i in a.indices) {
+        if (!deepEquals(a[i], b[i])) return false
+      }
+      return true
+    }
+    if (a is List<*> && b is List<*>) {
+      if (a.size != b.size) return false
+      val iterA = a.iterator()
+      val iterB = b.iterator()
+      while (iterA.hasNext() && iterB.hasNext()) {
+        if (!deepEquals(iterA.next(), iterB.next())) return false
+      }
+      return true
+    }
+    if (a is Map<*, *> && b is Map<*, *>) {
+      if (a.size != b.size) return false
+      for (entry in a) {
+        val key = entry.key
+        var found = false
+        for (bEntry in b) {
+          if (deepEquals(key, bEntry.key)) {
+            if (deepEquals(entry.value, bEntry.value)) {
+              found = true
+              break
+            } else {
+              return false
+            }
+          }
+        }
+        if (!found) return false
+      }
+      return true
+    }
+    if (a is Double && b is Double) {
+      return doubleEquals(a, b)
+    }
+    if (a is Float && b is Float) {
+      return floatEquals(a, b)
+    }
+    return a == b
+  }
+
+  fun deepHash(value: Any?): Int {
+    return when (value) {
+      null -> 0
+      is ByteArray -> value.contentHashCode()
+      is IntArray -> value.contentHashCode()
+      is LongArray -> value.contentHashCode()
+      is DoubleArray -> {
+        var result = 1
+        for (item in value) {
+          result = 31 * result + doubleHash(item)
+        }
+        result
+      }
+      is FloatArray -> {
+        var result = 1
+        for (item in value) {
+          result = 31 * result + floatHash(item)
+        }
+        result
+      }
+      is Array<*> -> {
+        var result = 1
+        for (item in value) {
+          result = 31 * result + deepHash(item)
+        }
+        result
+      }
+      is List<*> -> {
+        var result = 1
+        for (item in value) {
+          result = 31 * result + deepHash(item)
+        }
+        result
+      }
+      is Map<*, *> -> {
+        var result = 0
+        for (entry in value) {
+          result += ((deepHash(entry.key) * 31) xor deepHash(entry.value))
+        }
+        result
+      }
+      is Double -> doubleHash(value)
+      is Float -> floatHash(value)
+      else -> value.hashCode()
+    }
+  }
+
+}
+
+/**
+ * Error class for passing custom error details to Flutter via a thrown PlatformException.
+ * @property code The error code.
+ * @property message The error message.
+ * @property details The error details. Must be a datatype supported by the api codec.
+ */
+class FlutterError (
+  val code: String,
+  override val message: String? = null,
+  val details: Any? = null
+) : RuntimeException()
+
+/** Generated class from Pigeon that represents data sent in messages. */
+data class ViewIntentPayload (
+  val path: String? = null,
+  val mimeType: String,
+  val localAssetId: String? = null
+)
+ {
+  companion object {
+    fun fromList(pigeonVar_list: List<Any?>): ViewIntentPayload {
+      val path = pigeonVar_list[0] as String?
+      val mimeType = pigeonVar_list[1] as String
+      val localAssetId = pigeonVar_list[2] as String?
+      return ViewIntentPayload(path, mimeType, localAssetId)
+    }
+  }
+  fun toList(): List<Any?> {
+    return listOf(
+      path,
+      mimeType,
+      localAssetId,
+    )
+  }
+  override fun equals(other: Any?): Boolean {
+    if (other == null || other.javaClass != javaClass) {
+      return false
+    }
+    if (this === other) {
+      return true
+    }
+    val other = other as ViewIntentPayload
+    return ViewIntentPigeonUtils.deepEquals(this.path, other.path) && ViewIntentPigeonUtils.deepEquals(this.mimeType, other.mimeType) && ViewIntentPigeonUtils.deepEquals(this.localAssetId, other.localAssetId)
+  }
+
+  override fun hashCode(): Int {
+    var result = javaClass.hashCode()
+    result = 31 * result + ViewIntentPigeonUtils.deepHash(this.path)
+    result = 31 * result + ViewIntentPigeonUtils.deepHash(this.mimeType)
+    result = 31 * result + ViewIntentPigeonUtils.deepHash(this.localAssetId)
+    return result
+  }
+}
+private open class ViewIntentPigeonCodec : StandardMessageCodec() {
+  override fun readValueOfType(type: Byte, buffer: ByteBuffer): Any? {
+    return when (type) {
+      129.toByte() -> {
+        return (readValue(buffer) as? List<Any?>)?.let {
+          ViewIntentPayload.fromList(it)
+        }
+      }
+      else -> super.readValueOfType(type, buffer)
+    }
+  }
+  override fun writeValue(stream: ByteArrayOutputStream, value: Any?)   {
+    when (value) {
+      is ViewIntentPayload -> {
+        stream.write(129)
+        writeValue(stream, value.toList())
+      }
+      else -> super.writeValue(stream, value)
+    }
+  }
+}
+
+
+/** Generated interface from Pigeon that represents a handler of messages from Flutter. */
+interface ViewIntentHostApi {
+  fun consumeViewIntent(callback: (Result<ViewIntentPayload?>) -> Unit)
+
+  companion object {
+    /** The codec used by ViewIntentHostApi. */
+    val codec: MessageCodec<Any?> by lazy {
+      ViewIntentPigeonCodec()
+    }
+    /** Sets up an instance of `ViewIntentHostApi` to handle messages through the `binaryMessenger`. */
+    @JvmOverloads
+    fun setUp(binaryMessenger: BinaryMessenger, api: ViewIntentHostApi?, messageChannelSuffix: String = "") {
+      val separatedMessageChannelSuffix = if (messageChannelSuffix.isNotEmpty()) ".$messageChannelSuffix" else ""
+      run {
+        val channel = BasicMessageChannel<Any?>(binaryMessenger, "dev.flutter.pigeon.immich_mobile.ViewIntentHostApi.consumeViewIntent$separatedMessageChannelSuffix", codec)
+        if (api != null) {
+          channel.setMessageHandler { _, reply ->
+            api.consumeViewIntent{ result: Result<ViewIntentPayload?> ->
+              val error = result.exceptionOrNull()
+              if (error != null) {
+                reply.reply(ViewIntentPigeonUtils.wrapError(error))
+              } else {
+                val data = result.getOrNull()
+                reply.reply(ViewIntentPigeonUtils.wrapResult(data))
+              }
+            }
+          }
+        } else {
+          channel.setMessageHandler(null)
+        }
+      }
+    }
+  }
+}

mobile/android/app/src/main/kotlin/app/alextran/immich/viewintent/ViewIntentPlugin.kt

@@ -0,0 +1,219 @@
+package app.alextran.immich.viewintent
+
+import android.app.Activity
+import android.content.ContentUris
+import android.content.Context
+import android.content.Intent
+import android.net.Uri
+import android.os.Build
+import android.provider.DocumentsContract
+import android.provider.MediaStore
+import android.provider.OpenableColumns
+import android.util.Log
+import android.webkit.MimeTypeMap
+import io.flutter.embedding.engine.plugins.FlutterPlugin
+import io.flutter.embedding.engine.plugins.activity.ActivityAware
+import io.flutter.embedding.engine.plugins.activity.ActivityPluginBinding
+import io.flutter.plugin.common.PluginRegistry
+import java.io.File
+import java.io.FileOutputStream
+import kotlinx.coroutines.CoroutineScope
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.SupervisorJob
+import kotlinx.coroutines.cancel
+import kotlinx.coroutines.launch
+
+private const val TAG = "ViewIntentPlugin"
+
+class ViewIntentPlugin : FlutterPlugin, ActivityAware, PluginRegistry.NewIntentListener, ViewIntentHostApi {
+  private var context: Context? = null
+  private var activity: Activity? = null
+  private var pendingIntent: Intent? = null
+  private val ioScope = CoroutineScope(SupervisorJob() + Dispatchers.IO)
+
+  override fun onAttachedToEngine(binding: FlutterPlugin.FlutterPluginBinding) {
+    context = binding.applicationContext
+    ViewIntentHostApi.setUp(binding.binaryMessenger, this)
+  }
+
+  override fun onDetachedFromEngine(binding: FlutterPlugin.FlutterPluginBinding) {
+    ViewIntentHostApi.setUp(binding.binaryMessenger, null)
+    ioScope.cancel()
+    context = null
+  }
+
+  override fun onAttachedToActivity(binding: ActivityPluginBinding) {
+    activity = binding.activity
+    pendingIntent = binding.activity.intent
+    binding.addOnNewIntentListener(this)
+  }
+
+  override fun onDetachedFromActivityForConfigChanges() {
+    activity = null
+  }
+
+  override fun onReattachedToActivityForConfigChanges(binding: ActivityPluginBinding) {
+    onAttachedToActivity(binding)
+  }
+
+  override fun onDetachedFromActivity() {
+    activity = null
+  }
+
+  override fun onNewIntent(intent: Intent): Boolean {
+    pendingIntent = intent
+    return false
+  }
+
+  override fun consumeViewIntent(callback: (Result<ViewIntentPayload?>) -> Unit) {
+    val context = context ?: run {
+      callback(Result.success(null))
+      return
+    }
+    val intent = pendingIntent ?: activity?.intent
+
+    if (intent?.action != Intent.ACTION_VIEW) {
+      callback(Result.success(null))
+      return
+    }
+
+    val uri = intent.data
+    if (uri == null) {
+      callback(Result.success(null))
+      return
+    }
+
+    ioScope.launch {
+      try {
+        val mimeType = context.contentResolver.getType(uri) ?: intent.type
+        if (mimeType == null || (!mimeType.startsWith("image/") && !mimeType.startsWith("video/"))) {
+          callback(Result.success(null))
+          return@launch
+        }
+
+        val localAssetId = extractLocalAssetId(context, uri, mimeType)
+        val tempFilePath = if (localAssetId == null) {
+          copyUriToTempFile(context, uri, mimeType)?.absolutePath ?: run {
+            callback(Result.success(null))
+            return@launch
+          }
+        } else {
+          null
+        }
+        val payload = ViewIntentPayload(
+          path = tempFilePath,
+          mimeType = mimeType,
+          localAssetId = localAssetId,
+        )
+        consumeViewIntent(intent)
+        callback(Result.success(payload))
+      } catch (e: Exception) {
+        callback(Result.failure(e))
+      }
+    }
+  }
+
+  private fun consumeViewIntent(currentIntent: Intent) {
+    pendingIntent = Intent(currentIntent).apply {
+      action = null
+      data = null
+      type = null
+    }
+    activity?.intent = pendingIntent
+  }
+
+  private fun extractLocalAssetId(context: Context, uri: Uri, mimeType: String): String? {
+    return tryExtractDocumentLocalAssetId(context, uri)
+      ?: tryParseContentUriId(uri)
+      ?: tryParseLastPathSegmentId(uri)
+      ?: resolveLocalIdByNameAndSize(context, uri, mimeType)
+  }
+
+  private fun tryExtractDocumentLocalAssetId(context: Context, uri: Uri): String? {
+    return try {
+      if (!DocumentsContract.isDocumentUri(context, uri)) return null
+      val docId = DocumentsContract.getDocumentId(uri)
+      if (docId.isBlank() || docId.startsWith("raw:")) return null
+      val parsed = docId.substringAfter(':', docId)
+      if (parsed.isNotEmpty() && parsed.all(Char::isDigit)) parsed else null
+    } catch (e: Exception) {
+      Log.w(TAG, "Failed to resolve local asset id from document URI: $uri", e)
+      null
+    }
+  }
+
+  private fun tryParseContentUriId(uri: Uri): String? {
+    return try {
+      val parsed = ContentUris.parseId(uri)
+      if (parsed >= 0) parsed.toString() else null
+    } catch (e: Exception) {
+      Log.w(TAG, "Failed to parse local asset id from content URI: $uri", e)
+      null
+    }
+  }
+
+  private fun tryParseLastPathSegmentId(uri: Uri): String? {
+    val segment = uri.lastPathSegment ?: return null
+    return if (segment.all(Char::isDigit)) segment else null
+  }
+
+  private fun copyUriToTempFile(context: Context, uri: Uri, mimeType: String): File? {
+    return try {
+      val extension = MimeTypeMap.getSingleton().getExtensionFromMimeType(mimeType)?.let { ".$it" }
+      val tempFile = File.createTempFile("view_intent_", extension, context.cacheDir)
+      context.contentResolver.openInputStream(uri)?.use { inputStream ->
+        FileOutputStream(tempFile).use { outputStream ->
+          inputStream.copyTo(outputStream)
+        }
+      } ?: return null
+      tempFile
+    } catch (_: Exception) {
+      null
+    }
+  }
+
+  private fun resolveLocalIdByNameAndSize(context: Context, uri: Uri, mimeType: String): String? {
+    val metaProjection = arrayOf(OpenableColumns.DISPLAY_NAME, OpenableColumns.SIZE)
+    val (displayName, size) =
+      try {
+        context.contentResolver.query(uri, metaProjection, null, null, null)?.use { cursor ->
+          if (!cursor.moveToFirst()) return null
+          val nameIdx = cursor.getColumnIndex(OpenableColumns.DISPLAY_NAME)
+          val sizeIdx = cursor.getColumnIndex(OpenableColumns.SIZE)
+          val name = if (nameIdx >= 0) cursor.getString(nameIdx) else null
+          val bytes = if (sizeIdx >= 0) cursor.getLong(sizeIdx) else -1L
+          if (name.isNullOrBlank() || bytes < 0) return null
+          name to bytes
+        } ?: return null
+      } catch (_: Exception) {
+        return null
+      }
+
+    val tableUri = when {
+      mimeType.startsWith("image/") -> MediaStore.Images.Media.EXTERNAL_CONTENT_URI
+      mimeType.startsWith("video/") -> MediaStore.Video.Media.EXTERNAL_CONTENT_URI
+      else -> if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
+        MediaStore.Files.getContentUri(MediaStore.VOLUME_EXTERNAL)
+      } else {
+        MediaStore.Files.getContentUri("external")
+      }
+    }
+    return try {
+      context.contentResolver
+        .query(
+          tableUri,
+          arrayOf(MediaStore.MediaColumns._ID),
+          "${MediaStore.MediaColumns.DISPLAY_NAME}=? AND ${MediaStore.MediaColumns.SIZE}=?",
+          arrayOf(displayName, size.toString()),
+          "${MediaStore.MediaColumns.DATE_MODIFIED} DESC",
+        )?.use { cursor ->
+          if (!cursor.moveToFirst()) return null
+          val idIndex = cursor.getColumnIndex(MediaStore.MediaColumns._ID)
+          if (idIndex < 0) return null
+          cursor.getLong(idIndex).toString()
+        }
+    } catch (_: Exception) {
+      null
+    }
+  }
+}

mobile/ios/Runner/Sync/MessagesImpl.swift

@@ -318,7 +318,7 @@ class NativeSyncApiImpl: ImmichPlugin, NativeSyncApi, FlutterPlugin {
       }
     }
   }
-  
+
   func cancelHashing() {
     hashTask?.cancel()
     hashTask = nil

mobile/lib/domain/services/timeline.service.dart

@@ -17,6 +17,8 @@ typedef TimelineBucketSource = Stream<List<Bucket>> Function();
 
 typedef TimelineQuery = ({TimelineAssetSource assetSource, TimelineBucketSource bucketSource, TimelineOrigin origin});
 
+enum TimelineStatus { uninitialized, ready, disposed }
+
 enum TimelineOrigin {
   main,
   localAlbum,
@@ -101,9 +103,13 @@ class TimelineService {
   int _bufferOffset = 0;
   List<BaseAsset> _buffer = [];
   StreamSubscription? _bucketSubscription;
+  final StreamController<TimelineStatus> _statusController = StreamController<TimelineStatus>.broadcast();
 
   int _totalAssets = 0;
   int get totalAssets => _totalAssets;
+  TimelineStatus _status = TimelineStatus.uninitialized;
+  TimelineStatus get status => _status;
+  bool get isReady => _status == TimelineStatus.ready;
 
   TimelineService(TimelineQuery query)
     : this._(assetSource: query.assetSource, bucketSource: query.bucketSource, origin: query.origin);
@@ -139,12 +145,17 @@ class TimelineService {
 
         // change the state's total assets count only after the buffer is reloaded
         _totalAssets = totalAssets;
+        if (_status == TimelineStatus.uninitialized) {
+          _status = TimelineStatus.ready;
+          _statusController.add(_status);
+        }
         EventStream.shared.emit(const TimelineReloadEvent());
       });
     });
   }
 
   Stream<List<Bucket>> Function() get watchBuckets => _bucketSource;
+  Stream<TimelineStatus> watchStatus() => _statusController.stream;
 
   Future<List<BaseAsset>> loadAssets(int index, int count) => _mutex.run(() => _loadAssets(index, count));
 
@@ -247,5 +258,12 @@ class TimelineService {
     _bucketSubscription = null;
     _buffer = [];
     _bufferOffset = 0;
+    if (_status != TimelineStatus.disposed) {
+      _status = TimelineStatus.disposed;
+      if (!_statusController.isClosed) {
+        _statusController.add(_status);
+      }
+    }
+    await _statusController.close();
   }
 }

mobile/lib/infrastructure/repositories/timeline.repository.dart

@@ -678,6 +678,7 @@ class DriftTimelineRepository extends DriftDatabaseRepository {
       return query.map((row) => row.toDto()).get();
     }
   }
+
 }
 
 List<Bucket> _generateBuckets(int count) {

mobile/lib/main.dart

@@ -24,6 +24,7 @@ import 'package:immich_mobile/pages/common/splash_screen.page.dart';
 import 'package:immich_mobile/platform/background_worker_lock_api.g.dart';
 import 'package:immich_mobile/providers/app_life_cycle.provider.dart';
 import 'package:immich_mobile/providers/asset_viewer/share_intent_upload.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_handler.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/db.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/metadata.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/platform.provider.dart';
@@ -128,6 +129,7 @@ class ImmichAppState extends ConsumerState<ImmichApp> with WidgetsBindingObserve
       case AppLifecycleState.resumed:
         dPrint(() => "[APP STATE] resumed");
         ref.read(appStateProvider.notifier).handleAppResume();
+        unawaited(ref.read(viewIntentHandlerProvider).onAppResumed());
         break;
       case AppLifecycleState.inactive:
         dPrint(() => "[APP STATE] inactive");
@@ -233,6 +235,7 @@ class ImmichAppState extends ConsumerState<ImmichApp> with WidgetsBindingObserve
       }
     });
 
+    ref.read(viewIntentHandlerProvider).init();
     ref.read(shareIntentUploadProvider.notifier).init();
   }
 

mobile/lib/models/view_intent/view_intent_payload.extension.dart

@@ -0,0 +1,35 @@
+import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:path/path.dart';
+
+extension ViewIntentPayloadX on ViewIntentPayload {
+  String get fileName {
+    final resolvedPath = path;
+    if (resolvedPath != null && resolvedPath.isNotEmpty) {
+      return basename(resolvedPath);
+    }
+    return localAssetId ?? 'view_intent_asset';
+  }
+
+  bool get isImage => mimeType.toLowerCase().startsWith('image/');
+
+  bool get isVideo => mimeType.toLowerCase().startsWith('video/');
+
+  AssetPlaybackStyle get playbackStyle {
+    if (isVideo) {
+      return AssetPlaybackStyle.video;
+    }
+
+    final normalizedMimeType = mimeType.toLowerCase();
+    if (normalizedMimeType == 'image/gif' || normalizedMimeType == 'image/webp') {
+      return AssetPlaybackStyle.imageAnimated;
+    }
+
+    final normalizedPath = path?.toLowerCase();
+    if (normalizedPath != null && (normalizedPath.endsWith('.gif') || normalizedPath.endsWith('.webp'))) {
+      return AssetPlaybackStyle.imageAnimated;
+    }
+
+    return AssetPlaybackStyle.image;
+  }
+}

mobile/lib/pages/common/splash_screen.page.dart

@@ -17,6 +17,7 @@ import 'package:immich_mobile/providers/auth.provider.dart';
 import 'package:immich_mobile/providers/background_sync.provider.dart';
 import 'package:immich_mobile/providers/backup/drift_backup.provider.dart';
 import 'package:immich_mobile/providers/server_info.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_handler.provider.dart';
 import 'package:immich_mobile/providers/websocket.provider.dart';
 import 'package:immich_mobile/routing/router.dart';
 import 'package:immich_mobile/theme/color_scheme.dart';
@@ -314,6 +315,7 @@ class SplashScreenPageState extends ConsumerState<SplashScreenPage> {
       final wsProvider = ref.read(websocketProvider.notifier);
       final backgroundManager = ref.read(backgroundSyncProvider);
       final backupProvider = ref.read(driftBackupProvider.notifier);
+      final viewIntentHandler = ref.read(viewIntentHandlerProvider);
 
       unawaited(
         ref.read(authProvider.notifier).saveAuthInfo(accessToken: accessToken).then(
@@ -328,6 +330,8 @@ class SplashScreenPageState extends ConsumerState<SplashScreenPage> {
                 backgroundManager.syncRemote().then((success) => syncSuccess = success),
               ]);
 
+              await viewIntentHandler.flushDeferredViewIntent();
+
               if (syncSuccess) {
                 await Future.wait([
                   backgroundManager.hashAssets().then((_) {

mobile/lib/platform/native_sync_api.g.dart

@@ -9,14 +9,22 @@ import 'dart:typed_data' show Float64List, Int32List, Int64List;
 import 'package:flutter/services.dart';
 import 'package:meta/meta.dart' show immutable, protected, visibleForTesting;
 
-Object? _extractReplyValueOrThrow(List<Object?>? replyList, String channelName, {required bool isNullValid}) {
+Object? _extractReplyValueOrThrow(
+    List<Object?>? replyList,
+    String channelName, {
+    required bool isNullValid,
+}) {
   if (replyList == null) {
     throw PlatformException(
       code: 'channel-error',
       message: 'Unable to establish connection on channel: "$channelName".',
     );
   } else if (replyList.length > 1) {
-    throw PlatformException(code: replyList[0]! as String, message: replyList[1] as String?, details: replyList[2]);
+    throw PlatformException(
+      code: replyList[0]! as String,
+      message: replyList[1] as String?,
+      details: replyList[2],
+    );
   } else if (!isNullValid && (replyList.isNotEmpty && replyList[0] == null)) {
     throw PlatformException(
       code: 'null-error',
@@ -37,7 +45,9 @@ bool _deepEquals(Object? a, Object? b) {
     return a == b;
   }
   if (a is List && b is List) {
-    return a.length == b.length && a.indexed.every(((int, dynamic) item) => _deepEquals(item.$2, b[item.$1]));
+    return a.length == b.length &&
+        a.indexed
+            .every(((int, dynamic) item) => _deepEquals(item.$2, b[item.$1]));
   }
   if (a is Map && b is Map) {
     if (a.length != b.length) {
@@ -86,7 +96,15 @@ int _deepHash(Object? value) {
   return value.hashCode;
 }
 
-enum PlatformAssetPlaybackStyle { unknown, image, video, imageAnimated, livePhoto, videoLooping }
+
+enum PlatformAssetPlaybackStyle {
+  unknown,
+  image,
+  video,
+  imageAnimated,
+  livePhoto,
+  videoLooping,
+}
 
 class PlatformAsset {
   PlatformAsset({
@@ -154,8 +172,7 @@ class PlatformAsset {
   }
 
   Object encode() {
-    return _toList();
-  }
+    return _toList();  }
 
   static PlatformAsset decode(Object result) {
     result as List<Object?>;
@@ -186,20 +203,7 @@ class PlatformAsset {
     if (identical(this, other)) {
       return true;
     }
-    return _deepEquals(id, other.id) &&
-        _deepEquals(name, other.name) &&
-        _deepEquals(type, other.type) &&
-        _deepEquals(createdAt, other.createdAt) &&
-        _deepEquals(updatedAt, other.updatedAt) &&
-        _deepEquals(width, other.width) &&
-        _deepEquals(height, other.height) &&
-        _deepEquals(durationMs, other.durationMs) &&
-        _deepEquals(orientation, other.orientation) &&
-        _deepEquals(isFavorite, other.isFavorite) &&
-        _deepEquals(adjustmentTime, other.adjustmentTime) &&
-        _deepEquals(latitude, other.latitude) &&
-        _deepEquals(longitude, other.longitude) &&
-        _deepEquals(playbackStyle, other.playbackStyle);
+    return _deepEquals(id, other.id) && _deepEquals(name, other.name) && _deepEquals(type, other.type) && _deepEquals(createdAt, other.createdAt) && _deepEquals(updatedAt, other.updatedAt) && _deepEquals(width, other.width) && _deepEquals(height, other.height) && _deepEquals(durationMs, other.durationMs) && _deepEquals(orientation, other.orientation) && _deepEquals(isFavorite, other.isFavorite) && _deepEquals(adjustmentTime, other.adjustmentTime) && _deepEquals(latitude, other.latitude) && _deepEquals(longitude, other.longitude) && _deepEquals(playbackStyle, other.playbackStyle);
   }
 
   @override
@@ -227,12 +231,17 @@ class PlatformAlbum {
   int assetCount;
 
   List<Object?> _toList() {
-    return <Object?>[id, name, updatedAt, isCloud, assetCount];
+    return <Object?>[
+      id,
+      name,
+      updatedAt,
+      isCloud,
+      assetCount,
+    ];
   }
 
   Object encode() {
-    return _toList();
-  }
+    return _toList();  }
 
   static PlatformAlbum decode(Object result) {
     result as List<Object?>;
@@ -254,11 +263,7 @@ class PlatformAlbum {
     if (identical(this, other)) {
       return true;
     }
-    return _deepEquals(id, other.id) &&
-        _deepEquals(name, other.name) &&
-        _deepEquals(updatedAt, other.updatedAt) &&
-        _deepEquals(isCloud, other.isCloud) &&
-        _deepEquals(assetCount, other.assetCount);
+    return _deepEquals(id, other.id) && _deepEquals(name, other.name) && _deepEquals(updatedAt, other.updatedAt) && _deepEquals(isCloud, other.isCloud) && _deepEquals(assetCount, other.assetCount);
   }
 
   @override
@@ -267,7 +272,12 @@ class PlatformAlbum {
 }
 
 class SyncDelta {
-  SyncDelta({required this.hasChanges, required this.updates, required this.deletes, required this.assetAlbums});
+  SyncDelta({
+    required this.hasChanges,
+    required this.updates,
+    required this.deletes,
+    required this.assetAlbums,
+  });
 
   bool hasChanges;
 
@@ -278,12 +288,16 @@ class SyncDelta {
   Map<String, List<String>> assetAlbums;
 
   List<Object?> _toList() {
-    return <Object?>[hasChanges, updates, deletes, assetAlbums];
+    return <Object?>[
+      hasChanges,
+      updates,
+      deletes,
+      assetAlbums,
+    ];
   }
 
   Object encode() {
-    return _toList();
-  }
+    return _toList();  }
 
   static SyncDelta decode(Object result) {
     result as List<Object?>;
@@ -304,10 +318,7 @@ class SyncDelta {
     if (identical(this, other)) {
       return true;
     }
-    return _deepEquals(hasChanges, other.hasChanges) &&
-        _deepEquals(updates, other.updates) &&
-        _deepEquals(deletes, other.deletes) &&
-        _deepEquals(assetAlbums, other.assetAlbums);
+    return _deepEquals(hasChanges, other.hasChanges) && _deepEquals(updates, other.updates) && _deepEquals(deletes, other.deletes) && _deepEquals(assetAlbums, other.assetAlbums);
   }
 
   @override
@@ -316,7 +327,11 @@ class SyncDelta {
 }
 
 class HashResult {
-  HashResult({required this.assetId, this.error, this.hash});
+  HashResult({
+    required this.assetId,
+    this.error,
+    this.hash,
+  });
 
   String assetId;
 
@@ -325,16 +340,23 @@ class HashResult {
   String? hash;
 
   List<Object?> _toList() {
-    return <Object?>[assetId, error, hash];
+    return <Object?>[
+      assetId,
+      error,
+      hash,
+    ];
   }
 
   Object encode() {
-    return _toList();
-  }
+    return _toList();  }
 
   static HashResult decode(Object result) {
     result as List<Object?>;
-    return HashResult(assetId: result[0]! as String, error: result[1] as String?, hash: result[2] as String?);
+    return HashResult(
+      assetId: result[0]! as String,
+      error: result[1] as String?,
+      hash: result[2] as String?,
+    );
   }
 
   @override
@@ -355,7 +377,11 @@ class HashResult {
 }
 
 class CloudIdResult {
-  CloudIdResult({required this.assetId, this.error, this.cloudId});
+  CloudIdResult({
+    required this.assetId,
+    this.error,
+    this.cloudId,
+  });
 
   String assetId;
 
@@ -364,16 +390,23 @@ class CloudIdResult {
   String? cloudId;
 
   List<Object?> _toList() {
-    return <Object?>[assetId, error, cloudId];
+    return <Object?>[
+      assetId,
+      error,
+      cloudId,
+    ];
   }
 
   Object encode() {
-    return _toList();
-  }
+    return _toList();  }
 
   static CloudIdResult decode(Object result) {
     result as List<Object?>;
-    return CloudIdResult(assetId: result[0]! as String, error: result[1] as String?, cloudId: result[2] as String?);
+    return CloudIdResult(
+      assetId: result[0]! as String,
+      error: result[1] as String?,
+      cloudId: result[2] as String?,
+    );
   }
 
   @override
@@ -385,9 +418,7 @@ class CloudIdResult {
     if (identical(this, other)) {
       return true;
     }
-    return _deepEquals(assetId, other.assetId) &&
-        _deepEquals(error, other.error) &&
-        _deepEquals(cloudId, other.cloudId);
+    return _deepEquals(assetId, other.assetId) && _deepEquals(error, other.error) && _deepEquals(cloudId, other.cloudId);
   }
 
   @override
@@ -395,6 +426,7 @@ class CloudIdResult {
   int get hashCode => _deepHash(<Object?>[runtimeType, ..._toList()]);
 }
 
+
 class _PigeonCodec extends StandardMessageCodec {
   const _PigeonCodec();
   @override
@@ -402,22 +434,22 @@ class _PigeonCodec extends StandardMessageCodec {
     if (value is int) {
       buffer.putUint8(4);
       buffer.putInt64(value);
-    } else if (value is PlatformAssetPlaybackStyle) {
+    }    else if (value is PlatformAssetPlaybackStyle) {
       buffer.putUint8(129);
       writeValue(buffer, value.index);
-    } else if (value is PlatformAsset) {
+    }    else if (value is PlatformAsset) {
       buffer.putUint8(130);
       writeValue(buffer, value.encode());
-    } else if (value is PlatformAlbum) {
+    }    else if (value is PlatformAlbum) {
       buffer.putUint8(131);
       writeValue(buffer, value.encode());
-    } else if (value is SyncDelta) {
+    }    else if (value is SyncDelta) {
       buffer.putUint8(132);
       writeValue(buffer, value.encode());
-    } else if (value is HashResult) {
+    }    else if (value is HashResult) {
       buffer.putUint8(133);
       writeValue(buffer, value.encode());
-    } else if (value is CloudIdResult) {
+    }    else if (value is CloudIdResult) {
       buffer.putUint8(134);
       writeValue(buffer, value.encode());
     } else {
@@ -452,8 +484,8 @@ class NativeSyncApi {
   /// available for dependency injection.  If it is left null, the default
   /// BinaryMessenger will be used which routes to the host platform.
   NativeSyncApi({BinaryMessenger? binaryMessenger, String messageChannelSuffix = ''})
-    : pigeonVar_binaryMessenger = binaryMessenger,
-      pigeonVar_messageChannelSuffix = messageChannelSuffix.isNotEmpty ? '.$messageChannelSuffix' : '';
+      : pigeonVar_binaryMessenger = binaryMessenger,
+        pigeonVar_messageChannelSuffix = messageChannelSuffix.isNotEmpty ? '.$messageChannelSuffix' : '';
   final BinaryMessenger? pigeonVar_binaryMessenger;
 
   static const MessageCodec<Object?> pigeonChannelCodec = _PigeonCodec();
@@ -461,8 +493,7 @@ class NativeSyncApi {
   final String pigeonVar_messageChannelSuffix;
 
   Future<bool> shouldFullSync() async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.shouldFullSync$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.shouldFullSync$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -472,16 +503,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return pigeonVar_replyValue! as bool;
   }
 
   Future<SyncDelta> getMediaChanges() async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getMediaChanges$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getMediaChanges$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -491,16 +522,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return pigeonVar_replyValue! as SyncDelta;
   }
 
   Future<void> checkpointSync() async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.checkpointSync$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.checkpointSync$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -509,12 +540,16 @@ class NativeSyncApi {
     final Future<Object?> pigeonVar_sendFuture = pigeonVar_channel.send(null);
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
-    _extractReplyValueOrThrow(pigeonVar_replyList, pigeonVar_channelName, isNullValid: true);
+    _extractReplyValueOrThrow(
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: true,
+    )
+    ;
   }
 
   Future<void> clearSyncCheckpoint() async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.clearSyncCheckpoint$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.clearSyncCheckpoint$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -523,12 +558,16 @@ class NativeSyncApi {
     final Future<Object?> pigeonVar_sendFuture = pigeonVar_channel.send(null);
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
-    _extractReplyValueOrThrow(pigeonVar_replyList, pigeonVar_channelName, isNullValid: true);
+    _extractReplyValueOrThrow(
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: true,
+    )
+    ;
   }
 
   Future<List<String>> getAssetIdsForAlbum(String albumId) async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getAssetIdsForAlbum$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getAssetIdsForAlbum$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -538,16 +577,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return (pigeonVar_replyValue! as List<Object?>).cast<String>();
   }
 
   Future<List<PlatformAlbum>> getAlbums() async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getAlbums$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getAlbums$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -557,16 +596,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return (pigeonVar_replyValue! as List<Object?>).cast<PlatformAlbum>();
   }
 
   Future<int> getAssetsCountSince(String albumId, int timestamp) async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getAssetsCountSince$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getAssetsCountSince$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -576,16 +615,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return pigeonVar_replyValue! as int;
   }
 
   Future<List<PlatformAsset>> getAssetsForAlbum(String albumId, {int? updatedTimeCond}) async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getAssetsForAlbum$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getAssetsForAlbum$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -595,16 +634,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return (pigeonVar_replyValue! as List<Object?>).cast<PlatformAsset>();
   }
 
   Future<List<HashResult>> hashAssets(List<String> assetIds, {bool allowNetworkAccess = false}) async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.hashAssets$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.hashAssets$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -614,16 +653,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return (pigeonVar_replyValue! as List<Object?>).cast<HashResult>();
   }
 
   Future<void> cancelHashing() async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.cancelHashing$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.cancelHashing$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -632,12 +671,16 @@ class NativeSyncApi {
     final Future<Object?> pigeonVar_sendFuture = pigeonVar_channel.send(null);
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
-    _extractReplyValueOrThrow(pigeonVar_replyList, pigeonVar_channelName, isNullValid: true);
+    _extractReplyValueOrThrow(
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: true,
+    )
+    ;
   }
 
   Future<Map<String, List<PlatformAsset>>> getTrashedAssets() async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getTrashedAssets$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getTrashedAssets$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -647,16 +690,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return (pigeonVar_replyValue! as Map<Object?, Object?>).cast<String, List<PlatformAsset>>();
   }
 
   Future<bool> restoreFromTrashById(String mediaId, int type) async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.restoreFromTrashById$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.restoreFromTrashById$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -666,16 +709,16 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return pigeonVar_replyValue! as bool;
   }
 
   Future<List<CloudIdResult>> getCloudIdForAssetIds(List<String> assetIds) async {
-    final pigeonVar_channelName =
-        'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getCloudIdForAssetIds$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channelName = 'dev.flutter.pigeon.immich_mobile.NativeSyncApi.getCloudIdForAssetIds$pigeonVar_messageChannelSuffix';
     final pigeonVar_channel = BasicMessageChannel<Object?>(
       pigeonVar_channelName,
       pigeonChannelCodec,
@@ -685,10 +728,11 @@ class NativeSyncApi {
     final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
 
     final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
-      pigeonVar_replyList,
-      pigeonVar_channelName,
-      isNullValid: false,
-    );
+        pigeonVar_replyList,
+        pigeonVar_channelName,
+        isNullValid: false,
+    )
+    ;
     return (pigeonVar_replyValue! as List<Object?>).cast<CloudIdResult>();
   }
 }

mobile/lib/platform/view_intent_api.g.dart

@@ -0,0 +1,191 @@
+// Autogenerated from Pigeon (v26.3.4), do not edit directly.
+// See also: https://pub.dev/packages/pigeon
+// ignore_for_file: unused_import, unused_shown_name
+// ignore_for_file: type=lint
+
+import 'dart:async';
+import 'dart:typed_data' show Float64List, Int32List, Int64List;
+
+import 'package:flutter/services.dart';
+import 'package:meta/meta.dart' show immutable, protected, visibleForTesting;
+
+Object? _extractReplyValueOrThrow(List<Object?>? replyList, String channelName, {required bool isNullValid}) {
+  if (replyList == null) {
+    throw PlatformException(
+      code: 'channel-error',
+      message: 'Unable to establish connection on channel: "$channelName".',
+    );
+  } else if (replyList.length > 1) {
+    throw PlatformException(code: replyList[0]! as String, message: replyList[1] as String?, details: replyList[2]);
+  } else if (!isNullValid && (replyList.isNotEmpty && replyList[0] == null)) {
+    throw PlatformException(
+      code: 'null-error',
+      message: 'Host platform returned null value for non-null return value.',
+    );
+  }
+  return replyList.firstOrNull;
+}
+
+bool _deepEquals(Object? a, Object? b) {
+  if (identical(a, b)) {
+    return true;
+  }
+  if (a is double && b is double) {
+    if (a.isNaN && b.isNaN) {
+      return true;
+    }
+    return a == b;
+  }
+  if (a is List && b is List) {
+    return a.length == b.length && a.indexed.every(((int, dynamic) item) => _deepEquals(item.$2, b[item.$1]));
+  }
+  if (a is Map && b is Map) {
+    if (a.length != b.length) {
+      return false;
+    }
+    for (final MapEntry<Object?, Object?> entryA in a.entries) {
+      bool found = false;
+      for (final MapEntry<Object?, Object?> entryB in b.entries) {
+        if (_deepEquals(entryA.key, entryB.key)) {
+          if (_deepEquals(entryA.value, entryB.value)) {
+            found = true;
+            break;
+          } else {
+            return false;
+          }
+        }
+      }
+      if (!found) {
+        return false;
+      }
+    }
+    return true;
+  }
+  return a == b;
+}
+
+int _deepHash(Object? value) {
+  if (value is List) {
+    return Object.hashAll(value.map(_deepHash));
+  }
+  if (value is Map) {
+    int result = 0;
+    for (final MapEntry<Object?, Object?> entry in value.entries) {
+      result += (_deepHash(entry.key) * 31) ^ _deepHash(entry.value);
+    }
+    return result;
+  }
+  if (value is double && value.isNaN) {
+    // Normalize NaN to a consistent hash.
+    return 0x7FF8000000000000.hashCode;
+  }
+  if (value is double && value == 0.0) {
+    // Normalize -0.0 to 0.0 so they have the same hash code.
+    return 0.0.hashCode;
+  }
+  return value.hashCode;
+}
+
+class ViewIntentPayload {
+  ViewIntentPayload({this.path, required this.mimeType, this.localAssetId});
+
+  String? path;
+
+  String mimeType;
+
+  String? localAssetId;
+
+  List<Object?> _toList() {
+    return <Object?>[path, mimeType, localAssetId];
+  }
+
+  Object encode() {
+    return _toList();
+  }
+
+  static ViewIntentPayload decode(Object result) {
+    result as List<Object?>;
+    return ViewIntentPayload(
+      path: result[0] as String?,
+      mimeType: result[1]! as String,
+      localAssetId: result[2] as String?,
+    );
+  }
+
+  @override
+  // ignore: avoid_equals_and_hash_code_on_mutable_classes
+  bool operator ==(Object other) {
+    if (other is! ViewIntentPayload || other.runtimeType != runtimeType) {
+      return false;
+    }
+    if (identical(this, other)) {
+      return true;
+    }
+    return _deepEquals(path, other.path) &&
+        _deepEquals(mimeType, other.mimeType) &&
+        _deepEquals(localAssetId, other.localAssetId);
+  }
+
+  @override
+  // ignore: avoid_equals_and_hash_code_on_mutable_classes
+  int get hashCode => _deepHash(<Object?>[runtimeType, ..._toList()]);
+}
+
+class _PigeonCodec extends StandardMessageCodec {
+  const _PigeonCodec();
+  @override
+  void writeValue(WriteBuffer buffer, Object? value) {
+    if (value is int) {
+      buffer.putUint8(4);
+      buffer.putInt64(value);
+    } else if (value is ViewIntentPayload) {
+      buffer.putUint8(129);
+      writeValue(buffer, value.encode());
+    } else {
+      super.writeValue(buffer, value);
+    }
+  }
+
+  @override
+  Object? readValueOfType(int type, ReadBuffer buffer) {
+    switch (type) {
+      case 129:
+        return ViewIntentPayload.decode(readValue(buffer)!);
+      default:
+        return super.readValueOfType(type, buffer);
+    }
+  }
+}
+
+class ViewIntentHostApi {
+  /// Constructor for [ViewIntentHostApi].  The [binaryMessenger] named argument is
+  /// available for dependency injection.  If it is left null, the default
+  /// BinaryMessenger will be used which routes to the host platform.
+  ViewIntentHostApi({BinaryMessenger? binaryMessenger, String messageChannelSuffix = ''})
+    : pigeonVar_binaryMessenger = binaryMessenger,
+      pigeonVar_messageChannelSuffix = messageChannelSuffix.isNotEmpty ? '.$messageChannelSuffix' : '';
+  final BinaryMessenger? pigeonVar_binaryMessenger;
+
+  static const MessageCodec<Object?> pigeonChannelCodec = _PigeonCodec();
+
+  final String pigeonVar_messageChannelSuffix;
+
+  Future<ViewIntentPayload?> consumeViewIntent() async {
+    final pigeonVar_channelName =
+        'dev.flutter.pigeon.immich_mobile.ViewIntentHostApi.consumeViewIntent$pigeonVar_messageChannelSuffix';
+    final pigeonVar_channel = BasicMessageChannel<Object?>(
+      pigeonVar_channelName,
+      pigeonChannelCodec,
+      binaryMessenger: pigeonVar_binaryMessenger,
+    );
+    final Future<Object?> pigeonVar_sendFuture = pigeonVar_channel.send(null);
+    final pigeonVar_replyList = await pigeonVar_sendFuture as List<Object?>?;
+
+    final Object? pigeonVar_replyValue = _extractReplyValueOrThrow(
+      pigeonVar_replyList,
+      pigeonVar_channelName,
+      isNullValid: true,
+    );
+    return pigeonVar_replyValue as ViewIntentPayload?;
+  }
+}

mobile/lib/presentation/pages/dev/main_timeline.page.dart

@@ -1,16 +1,25 @@
+import 'dart:async';
+
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:immich_mobile/presentation/widgets/memory/memory_lane.widget.dart';
 import 'package:immich_mobile/presentation/widgets/timeline/timeline.widget.dart';
 import 'package:immich_mobile/providers/infrastructure/memory.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_main_timeline_ready.provider.dart';
 
 @RoutePage()
-class MainTimelinePage extends ConsumerWidget {
+class MainTimelinePage extends HookConsumerWidget {
   const MainTimelinePage({super.key});
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    useEffect(() {
+      unawaited(Future<void>(() => ref.read(viewIntentMainTimelineReadyProvider.notifier).markMountedOnce()));
+      return null;
+    }, const []);
+
     final hasMemories = ref.watch(driftMemoryFutureProvider.select((state) => state.value?.isNotEmpty ?? false));
     return Timeline(
       topSliverWidget: const SliverToBoxAdapter(child: DriftMemoryLane()),

mobile/lib/presentation/widgets/action_buttons/upload_action_button.widget.dart

@@ -1,4 +1,5 @@
 import 'dart:async';
+import 'dart:io';
 
 import 'package:flutter/material.dart';
 import 'package:fluttertoast/fluttertoast.dart';
@@ -7,9 +8,11 @@ import 'package:immich_mobile/constants/enums.dart';
 import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
 import 'package:immich_mobile/extensions/translate_extensions.dart';
 import 'package:immich_mobile/presentation/widgets/action_buttons/base_action_button.widget.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_file_path.provider.dart';
 import 'package:immich_mobile/providers/backup/asset_upload_progress.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/action.provider.dart';
 import 'package:immich_mobile/providers/timeline/multiselect.provider.dart';
+import 'package:immich_mobile/services/foreground_upload.service.dart';
 import 'package:immich_mobile/widgets/common/immich_toast.dart';
 import 'package:immich_ui/immich_ui.dart';
 
@@ -26,7 +29,11 @@ class UploadActionButton extends ConsumerWidget {
     }
 
     final isTimeline = source == ActionSource.timeline;
+    final viewerIntentFilePath = source == ActionSource.viewer ? ref.read(viewIntentFilePathProvider) : null;
     List<LocalAsset>? assets;
+    var isUploadDialogOpen = false;
+    var wasUploadCancelled = false;
+    Future<void>? uploadDialogFuture;
 
     if (source == ActionSource.timeline) {
       assets = ref.read(multiSelectProvider).selectedAssets.whereType<LocalAsset>().toList();
@@ -35,22 +42,44 @@ class UploadActionButton extends ConsumerWidget {
       }
       ref.read(multiSelectProvider.notifier).reset();
     } else {
-      unawaited(
-        showDialog(
-          context: context,
-          barrierDismissible: false,
-          builder: (dialogContext) => const _UploadProgressDialog(),
-        ),
-      );
+      isUploadDialogOpen = true;
+      uploadDialogFuture =
+          showDialog<void>(
+            context: context,
+            barrierDismissible: false,
+            builder: (dialogContext) => _UploadProgressDialog(
+              onCancel: () {
+                wasUploadCancelled = true;
+              },
+            ),
+          ).whenComplete(() {
+            isUploadDialogOpen = false;
+          });
+      unawaited(uploadDialogFuture);
     }
 
-    final result = await ref.read(actionProvider.notifier).upload(source, assets: assets);
+    var success = false;
+    if (!isTimeline && viewerIntentFilePath != null) {
+      var hasError = false;
+      await ref
+          .read(foregroundUploadServiceProvider)
+          .uploadShareIntent(
+            [File(viewerIntentFilePath)],
+            onError: (fileId, errorMessage) {
+              hasError = true;
+            },
+          );
+      success = !hasError;
+    } else {
+      final result = await ref.read(actionProvider.notifier).upload(source, assets: assets);
+      success = result.success;
+    }
 
-    if (!isTimeline && context.mounted) {
+    if (!isTimeline && context.mounted && isUploadDialogOpen) {
       Navigator.of(context, rootNavigator: true).pop();
     }
 
-    if (context.mounted && !result.success) {
+    if (context.mounted && !success && !wasUploadCancelled) {
       ImmichToast.show(
         context: context,
         msg: 'scaffold_body_error_occurred'.t(context: context),
@@ -73,7 +102,9 @@ class UploadActionButton extends ConsumerWidget {
 }
 
 class _UploadProgressDialog extends ConsumerWidget {
-  const _UploadProgressDialog();
+  final VoidCallback onCancel;
+
+  const _UploadProgressDialog({required this.onCancel});
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
@@ -103,7 +134,8 @@ class _UploadProgressDialog extends ConsumerWidget {
           onPressed: () {
             ref.read(manualUploadCancelTokenProvider)?.complete();
             ref.read(manualUploadCancelTokenProvider.notifier).state = null;
-            Navigator.of(context).pop();
+            onCancel();
+            Navigator.of(context, rootNavigator: true).pop();
           },
           labelText: 'cancel'.t(context: context),
         ),

mobile/lib/presentation/widgets/asset_viewer/asset_page.widget.dart

@@ -1,4 +1,5 @@
 import 'dart:async';
+import 'dart:io';
 import 'dart:math' as math;
 
 import 'package:auto_route/auto_route.dart';
@@ -21,6 +22,7 @@ import 'package:immich_mobile/providers/asset_viewer/asset_viewer.provider.dart'
 import 'package:immich_mobile/providers/asset_viewer/is_motion_video_playing.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/metadata.provider.dart';
 import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_file_path.provider.dart';
 import 'package:immich_mobile/widgets/common/immich_loading_indicator.dart';
 import 'package:immich_mobile/widgets/photo_view/photo_view.dart';
 
@@ -323,14 +325,18 @@ class _AssetPageState extends ConsumerState<AssetPage> {
     required PhotoViewHeroAttributes? heroAttributes,
     required bool isCurrent,
     required bool isPlayingMotionVideo,
+    required String? localFilePath,
   }) {
     final size = context.sizeData;
+    final imageProvider = localFilePath != null
+        ? FileImage(File(localFilePath))
+        : getFullImageProvider(asset, size: size);
 
     if (asset.isImage && !isPlayingMotionVideo) {
       return PhotoView(
         key: Key(asset.heroTag),
         index: widget.index,
-        imageProvider: getFullImageProvider(asset, size: size),
+        imageProvider: imageProvider,
         heroAttributes: heroAttributes,
         loadingBuilder: (context, progress, index) => const Center(child: ImmichLoadingIndicator()),
         gaplessPlayback: true,
@@ -377,12 +383,9 @@ class _AssetPageState extends ConsumerState<AssetPage> {
       child: NativeVideoViewer(
         key: _NativeVideoViewerKey(asset.heroTag),
         asset: asset,
+        localFilePath: localFilePath,
         isCurrent: isCurrent,
-        image: Image(
-          image: getFullImageProvider(asset, size: size),
-          fit: BoxFit.contain,
-          alignment: Alignment.center,
-        ),
+        image: Image(image: imageProvider, fit: BoxFit.contain, alignment: Alignment.center),
       ),
     );
   }
@@ -393,6 +396,7 @@ class _AssetPageState extends ConsumerState<AssetPage> {
     _showingDetails = ref.watch(assetViewerProvider.select((s) => s.showingDetails));
     final stackIndex = ref.watch(assetViewerProvider.select((s) => s.stackIndex));
     final isPlayingMotionVideo = ref.watch(isPlayingMotionVideoProvider);
+    final timelineOrigin = ref.read(timelineServiceProvider).origin;
 
     final asset = _asset;
     if (asset == null) {
@@ -421,6 +425,8 @@ class _AssetPageState extends ConsumerState<AssetPage> {
       _scrollController.snapPosition.snapOffset = _snapOffset;
     }
 
+    final viewIntentFilePath = timelineOrigin == TimelineOrigin.deepLink ? ref.watch(viewIntentFilePathProvider) : null;
+
     return Stack(
       children: [
         SingleChildScrollView(
@@ -440,6 +446,7 @@ class _AssetPageState extends ConsumerState<AssetPage> {
                         : null,
                     isCurrent: isCurrent,
                     isPlayingMotionVideo: isPlayingMotionVideo,
+                    localFilePath: viewIntentFilePath,
                   ),
                 ),
                 IgnorePointer(

mobile/lib/presentation/widgets/asset_viewer/asset_viewer.page.dart

@@ -64,18 +64,7 @@ class AssetViewer extends ConsumerStatefulWidget {
   ConsumerState createState() => _AssetViewerState();
 
   static void setAsset(WidgetRef ref, BaseAsset asset) {
-    ref.read(assetViewerProvider.notifier).reset();
-
-    // Hide controls by default for videos
-    if (asset.isVideo) {
-      ref.read(assetViewerProvider.notifier).setControls(false);
-    }
-
-    _setAsset(ref, asset);
-  }
-
-  static void _setAsset(WidgetRef ref, BaseAsset asset) {
-    ref.read(assetViewerProvider.notifier).setAsset(asset);
+    prepareAssetViewerState(ref.read(assetViewerProvider.notifier), asset);
   }
 }
 
@@ -89,6 +78,7 @@ class _AssetViewerState extends ConsumerState<AssetViewer> {
 
   StreamSubscription? _reloadSubscription;
   KeepAliveLink? _stackChildrenKeepAlive;
+  bool _disposeStarted = false;
 
   void _onTapNavigate(int direction) {
     final page = _pageController.page?.toInt();
@@ -123,6 +113,7 @@ class _AssetViewerState extends ConsumerState<AssetViewer> {
 
   @override
   void dispose() {
+    _disposeStarted = true;
     _pageController.dispose();
     _preloader.dispose();
     _reloadSubscription?.cancel();
@@ -160,14 +151,17 @@ class _AssetViewerState extends ConsumerState<AssetViewer> {
   }
 
   void _onAssetChanged(int index) async {
+    if (!mounted) {
+      return;
+    }
     _currentPage = index;
 
     final asset = await ref.read(timelineServiceProvider).getAssetAsync(index);
-    if (asset == null) {
+    if (!mounted || asset == null) {
       return;
     }
 
-    AssetViewer._setAsset(ref, asset);
+    ref.read(assetViewerProvider.notifier).setAsset(asset);
     _preloader.preload(index, context.sizeData);
     _handleCasting();
     _stackChildrenKeepAlive?.close();
@@ -203,6 +197,9 @@ class _AssetViewerState extends ConsumerState<AssetViewer> {
   }
 
   void _onEvent(Event event) {
+    if (!mounted || _disposeStarted) {
+      return;
+    }
     switch (event) {
       case TimelineReloadEvent():
         _onTimelineReloadEvent();
@@ -226,13 +223,20 @@ class _AssetViewerState extends ConsumerState<AssetViewer> {
   void _onTimelineReloadEvent() {
     final timelineService = ref.read(timelineServiceProvider);
     final totalAssets = timelineService.totalAssets;
+    final currentAsset = ref.read(assetViewerProvider).currentAsset;
+    final isViewerTransitionInProgress = ref.read(
+      assetViewerProvider.select((value) => value.isViewerTransitionInProgress),
+    );
+
+    if (isViewerTransitionInProgress) {
+      return;
+    }
 
     if (totalAssets == 0) {
       context.maybePop();
       return;
     }
 
-    final currentAsset = ref.read(assetViewerProvider).currentAsset;
     final assetIndex = currentAsset != null ? timelineService.getIndex(currentAsset.heroTag) : null;
     final index = (assetIndex ?? _currentPage).clamp(0, totalAssets - 1);
 

mobile/lib/presentation/widgets/asset_viewer/video_viewer.widget.dart

@@ -1,4 +1,5 @@
 import 'dart:async';
+import 'dart:io';
 
 import 'package:flutter/material.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
@@ -19,6 +20,7 @@ import 'package:native_video_player/native_video_player.dart';
 
 class NativeVideoViewer extends ConsumerStatefulWidget {
   final BaseAsset asset;
+  final String? localFilePath;
   final bool isCurrent;
   final bool showControls;
   final Widget image;
@@ -26,6 +28,7 @@ class NativeVideoViewer extends ConsumerStatefulWidget {
   const NativeVideoViewer({
     super.key,
     required this.asset,
+    this.localFilePath,
     required this.image,
     this.isCurrent = false,
     this.showControls = true,
@@ -106,6 +109,19 @@ class _NativeVideoViewerState extends ConsumerState<NativeVideoViewer> with Widg
     }
 
     try {
+      final localFilePath = widget.localFilePath;
+      if (localFilePath != null) {
+        final file = File(localFilePath);
+        if (!await file.exists()) {
+          throw Exception('No file found for the video');
+        }
+
+        return VideoSource.init(
+          path: CurrentPlatform.isAndroid ? file.uri.toString() : file.path,
+          type: VideoSourceType.file,
+        );
+      }
+
       if (videoAsset.hasLocal && videoAsset.livePhotoVideoId == null) {
         final id = videoAsset is LocalAsset ? videoAsset.id : (videoAsset as RemoteAsset).localId!;
         final file = await StorageRepository().getFileForAsset(id);

mobile/lib/providers/asset_viewer/asset_viewer.provider.dart

@@ -10,6 +10,7 @@ class AssetViewerState {
   final bool isZoomed;
   final BaseAsset? currentAsset;
   final int stackIndex;
+  final bool isViewerTransitionInProgress;
 
   const AssetViewerState({
     this.backgroundOpacity = 1.0,
@@ -18,6 +19,7 @@ class AssetViewerState {
     this.isZoomed = false,
     this.currentAsset,
     this.stackIndex = 0,
+    this.isViewerTransitionInProgress = false,
   });
 
   AssetViewerState copyWith({
@@ -27,6 +29,7 @@ class AssetViewerState {
     bool? isZoomed,
     BaseAsset? currentAsset,
     int? stackIndex,
+    bool? isViewerTransitionInProgress,
   }) {
     return AssetViewerState(
       backgroundOpacity: backgroundOpacity ?? this.backgroundOpacity,
@@ -35,6 +38,7 @@ class AssetViewerState {
       isZoomed: isZoomed ?? this.isZoomed,
       currentAsset: currentAsset ?? this.currentAsset,
       stackIndex: stackIndex ?? this.stackIndex,
+      isViewerTransitionInProgress: isViewerTransitionInProgress ?? this.isViewerTransitionInProgress,
     );
   }
 
@@ -57,7 +61,8 @@ class AssetViewerState {
         other.showingControls == showingControls &&
         other.isZoomed == isZoomed &&
         other.currentAsset == currentAsset &&
-        other.stackIndex == stackIndex;
+        other.stackIndex == stackIndex &&
+        other.isViewerTransitionInProgress == isViewerTransitionInProgress;
   }
 
   @override
@@ -67,7 +72,8 @@ class AssetViewerState {
       showingControls.hashCode ^
       isZoomed.hashCode ^
       currentAsset.hashCode ^
-      stackIndex.hashCode;
+      stackIndex.hashCode ^
+      isViewerTransitionInProgress.hashCode;
 }
 
 class AssetViewerStateNotifier extends Notifier<AssetViewerState> {
@@ -137,10 +143,28 @@ class AssetViewerStateNotifier extends Notifier<AssetViewerState> {
     }
     state = state.copyWith(stackIndex: index);
   }
+
+  void setViewerTransitionInProgress(bool isInProgress) {
+    if (isInProgress == state.isViewerTransitionInProgress) {
+      return;
+    }
+    state = state.copyWith(isViewerTransitionInProgress: isInProgress);
+  }
 }
 
 final assetViewerProvider = NotifierProvider<AssetViewerStateNotifier, AssetViewerState>(AssetViewerStateNotifier.new);
 
+void prepareAssetViewerState(AssetViewerStateNotifier notifier, BaseAsset asset) {
+  notifier.reset();
+
+  // Hide controls by default for videos before the viewer is shown.
+  if (asset.isVideo) {
+    notifier.setControls(false);
+  }
+
+  notifier.setAsset(asset);
+}
+
 final _watchedCurrentAssetProvider = StreamProvider<BaseAsset?>((ref) {
   ref.watch(assetViewerProvider.select((s) => s.currentAsset?.heroTag));
   final asset = ref.read(assetViewerProvider).currentAsset;

mobile/lib/providers/asset_viewer/share_intent_upload.provider.dart

@@ -1,101 +1,101 @@
-import 'dart:io';
-
-import 'package:hooks_riverpod/hooks_riverpod.dart';
-import 'package:immich_mobile/models/upload/share_intent_attachment.model.dart';
-import 'package:immich_mobile/routing/router.dart';
-import 'package:immich_mobile/services/share_intent_service.dart';
-import 'package:immich_mobile/services/foreground_upload.service.dart';
-import 'package:logging/logging.dart';
-import 'package:path/path.dart' as p;
-
-final shareIntentUploadProvider = StateNotifierProvider<ShareIntentUploadStateNotifier, List<ShareIntentAttachment>>(
-  ((ref) => ShareIntentUploadStateNotifier(
-    ref.watch(appRouterProvider),
-    ref.read(foregroundUploadServiceProvider),
-    ref.read(shareIntentServiceProvider),
-  )),
-);
-
-class ShareIntentUploadStateNotifier extends StateNotifier<List<ShareIntentAttachment>> {
-  final AppRouter router;
-  final ForegroundUploadService _foregroundUploadService;
-  final ShareIntentService _shareIntentService;
-  final Logger _logger = Logger('ShareIntentUploadStateNotifier');
-
-  ShareIntentUploadStateNotifier(this.router, this._foregroundUploadService, this._shareIntentService) : super([]);
-
-  void init() {
-    _shareIntentService.onSharedMedia = onSharedMedia;
-    _shareIntentService.init();
-  }
-
-  void onSharedMedia(List<ShareIntentAttachment> attachments) {
-    router.removeWhere((route) => route.name == "ShareIntentRoute");
-    clearAttachments();
-    addAttachments(attachments);
-    router.push(ShareIntentRoute(attachments: attachments));
-  }
-
-  void addAttachments(List<ShareIntentAttachment> attachments) {
-    if (attachments.isEmpty) {
-      return;
-    }
-    state = [...state, ...attachments];
-  }
-
-  void removeAttachment(ShareIntentAttachment attachment) {
-    final updatedState = state.where((element) => element != attachment).toList();
-    if (updatedState.length != state.length) {
-      state = updatedState;
-    }
-  }
-
-  void clearAttachments() {
-    if (state.isEmpty) {
-      return;
-    }
-
-    state = [];
-  }
-
-  Future<void> uploadAll(List<File> files) async {
-    for (final file in files) {
-      final fileId = p.hash(file.path).toString();
-      _updateStatus(fileId, UploadStatus.running);
-    }
-
-    await _foregroundUploadService.uploadShareIntent(
-      files,
-      onProgress: (fileId, bytes, totalBytes) {
-        final progress = totalBytes > 0 ? bytes / totalBytes : 0.0;
-        _updateProgress(fileId, progress);
-      },
-      onSuccess: (fileId) {
-        _updateStatus(fileId, UploadStatus.complete, progress: 1.0);
-      },
-      onError: (fileId, errorMessage) {
-        _logger.warning("Upload failed for file: $fileId, error: $errorMessage");
-        _updateStatus(fileId, UploadStatus.failed);
-      },
-    );
-  }
-
-  void _updateStatus(String fileId, UploadStatus status, {double? progress}) {
-    final id = int.parse(fileId);
-    state = [
-      for (final attachment in state)
-        if (attachment.id == id)
-          attachment.copyWith(status: status, uploadProgress: progress ?? attachment.uploadProgress)
-        else
-          attachment,
-    ];
-  }
-
-  void _updateProgress(String fileId, double progress) {
-    final id = int.parse(fileId);
-    state = [
-      for (final attachment in state)
-        if (attachment.id == id) attachment.copyWith(uploadProgress: progress) else attachment,
-    ];
-  }
-}
+import 'dart:io';
+
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/models/upload/share_intent_attachment.model.dart';
+import 'package:immich_mobile/routing/router.dart';
+import 'package:immich_mobile/services/foreground_upload.service.dart';
+import 'package:immich_mobile/services/share_intent_service.dart';
+import 'package:logging/logging.dart';
+import 'package:path/path.dart' as p;
+
+final shareIntentUploadProvider = StateNotifierProvider<ShareIntentUploadStateNotifier, List<ShareIntentAttachment>>(
+  ((ref) => ShareIntentUploadStateNotifier(
+    ref.watch(appRouterProvider),
+    ref.read(foregroundUploadServiceProvider),
+    ref.read(shareIntentServiceProvider),
+  )),
+);
+
+class ShareIntentUploadStateNotifier extends StateNotifier<List<ShareIntentAttachment>> {
+  final AppRouter router;
+  final ForegroundUploadService _foregroundUploadService;
+  final ShareIntentService _shareIntentService;
+  final Logger _logger = Logger('ShareIntentUploadStateNotifier');
+
+  ShareIntentUploadStateNotifier(this.router, this._foregroundUploadService, this._shareIntentService) : super([]);
+
+  void init() {
+    _shareIntentService.onSharedMedia = onSharedMedia;
+    _shareIntentService.init();
+  }
+
+  void onSharedMedia(List<ShareIntentAttachment> attachments) {
+    router.removeWhere((route) => route.name == "ShareIntentRoute");
+    clearAttachments();
+    addAttachments(attachments);
+    router.push(ShareIntentRoute(attachments: attachments));
+  }
+
+  void addAttachments(List<ShareIntentAttachment> attachments) {
+    if (attachments.isEmpty) {
+      return;
+    }
+    state = [...state, ...attachments];
+  }
+
+  void removeAttachment(ShareIntentAttachment attachment) {
+    final updatedState = state.where((element) => element != attachment).toList();
+    if (updatedState.length != state.length) {
+      state = updatedState;
+    }
+  }
+
+  void clearAttachments() {
+    if (state.isEmpty) {
+      return;
+    }
+
+    state = [];
+  }
+
+  Future<void> uploadAll(List<File> files) async {
+    for (final file in files) {
+      final fileId = p.hash(file.path).toString();
+      _updateStatus(fileId, UploadStatus.running);
+    }
+
+    await _foregroundUploadService.uploadShareIntent(
+      files,
+      onProgress: (fileId, bytes, totalBytes) {
+        final progress = totalBytes > 0 ? bytes / totalBytes : 0.0;
+        _updateProgress(fileId, progress);
+      },
+      onSuccess: (fileId, _) {
+        _updateStatus(fileId, UploadStatus.complete, progress: 1.0);
+      },
+      onError: (fileId, errorMessage) {
+        _logger.warning("Upload failed for file: $fileId, error: $errorMessage");
+        _updateStatus(fileId, UploadStatus.failed);
+      },
+    );
+  }
+
+  void _updateStatus(String fileId, UploadStatus status, {double? progress}) {
+    final id = int.parse(fileId);
+    state = [
+      for (final attachment in state)
+        if (attachment.id == id)
+          attachment.copyWith(status: status, uploadProgress: progress ?? attachment.uploadProgress)
+        else
+          attachment,
+    ];
+  }
+
+  void _updateProgress(String fileId, double progress) {
+    final id = int.parse(fileId);
+    state = [
+      for (final attachment in state)
+        if (attachment.id == id) attachment.copyWith(uploadProgress: progress) else attachment,
+    ];
+  }
+}

mobile/lib/providers/infrastructure/action.provider.dart

@@ -31,11 +31,12 @@ class ActionResult {
   final int count;
   final bool success;
   final String? error;
+  final List<String> remoteAssetIds;
 
-  const ActionResult({required this.count, required this.success, this.error});
+  const ActionResult({required this.count, required this.success, this.error, this.remoteAssetIds = const []});
 
   @override
-  String toString() => 'ActionResult(count: $count, success: $success, error: $error)';
+  String toString() => 'ActionResult(count: $count, success: $success, error: $error, remoteAssetIds: $remoteAssetIds)';
 }
 
 class ActionNotifier extends Notifier<void> {
@@ -489,10 +490,14 @@ class ActionNotifier extends Notifier<void> {
 
   Future<ActionResult> upload(ActionSource source, {List<LocalAsset>? assets}) async {
     final assetsToUpload = assets ?? _getAssets(source).whereType<LocalAsset>().toList();
+    if (assetsToUpload.isEmpty) {
+      return const ActionResult(count: 0, success: false, error: 'No assets to upload');
+    }
 
     final progressNotifier = ref.read(assetUploadProgressProvider.notifier);
     final cancelToken = Completer<void>();
     ref.read(manualUploadCancelTokenProvider.notifier).state = cancelToken;
+    final remoteAssetIds = <String>[];
 
     // Initialize progress for all assets
     for (final asset in assetsToUpload) {
@@ -509,6 +514,7 @@ class ActionNotifier extends Notifier<void> {
             progressNotifier.setProgress(localAssetId, progress);
           },
           onSuccess: (localAssetId, remoteAssetId) {
+            remoteAssetIds.add(remoteAssetId);
             progressNotifier.remove(localAssetId);
           },
           onError: (localAssetId, errorMessage) {
@@ -516,7 +522,14 @@ class ActionNotifier extends Notifier<void> {
           },
         ),
       );
-      return ActionResult(count: assetsToUpload.length, success: true);
+      final uploadedCount = remoteAssetIds.length;
+      final success = uploadedCount == assetsToUpload.length;
+      return ActionResult(
+        count: assetsToUpload.length,
+        success: success,
+        error: success ? null : 'Uploaded $uploadedCount/${assetsToUpload.length} assets successfully',
+        remoteAssetIds: remoteAssetIds,
+      );
     } catch (error, stack) {
       _logger.severe('Failed manually upload assets', error, stack);
       return ActionResult(count: assetsToUpload.length, success: false, error: error.toString());

mobile/lib/providers/infrastructure/timeline.provider.dart

@@ -41,3 +41,23 @@ final timelineUsersProvider = StreamProvider<List<String>>((ref) {
 
   return ref.watch(timelineRepositoryProvider).watchTimelineUserIds(currentUserId);
 });
+
+final timelineStatusProvider = StreamProvider.autoDispose.family<TimelineStatus, TimelineService>((
+  ref,
+  timelineService,
+) async* {
+  yield timelineService.status;
+  yield* timelineService.watchStatus();
+});
+
+Future<void> waitForTimelineReady(TimelineService timelineService, Duration timeout) {
+  if (timelineService.isReady) {
+    return Future.value();
+  }
+
+  return timelineService
+      .watchStatus()
+      .firstWhere((status) => status == TimelineStatus.ready)
+      .timeout(timeout)
+      .then((_) {});
+}

mobile/lib/providers/view_intent/view_intent_file_path.provider.dart

@@ -0,0 +1,31 @@
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+
+class ViewIntentFilePathNotifier extends Notifier<String?> {
+  @override
+  String? build() => null;
+
+  void setPath(String path) {
+    if (state == path) {
+      return;
+    }
+    state = path;
+  }
+
+  void clear() {
+    if (state == null) {
+      return;
+    }
+    state = null;
+  }
+
+  void clearIfMatch(String path) {
+    if (state != path) {
+      return;
+    }
+    state = null;
+  }
+}
+
+final viewIntentFilePathProvider = NotifierProvider<ViewIntentFilePathNotifier, String?>(
+  ViewIntentFilePathNotifier.new,
+);

mobile/lib/providers/view_intent/view_intent_handler.provider.dart

@@ -0,0 +1,23 @@
+import 'dart:io';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_handler_android.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_handler_stub.dart';
+
+abstract class ViewIntentHandler {
+  void init();
+
+  Future<void> onAppResumed();
+
+  Future<void> flushDeferredViewIntent();
+
+  Future<void> handle(ViewIntentPayload attachment);
+}
+
+final viewIntentHandlerProvider = Provider<ViewIntentHandler>((ref) {
+  if (Platform.isAndroid) {
+    return AndroidViewIntentHandler(ref);
+  }
+
+  return const StubViewIntentHandler();
+});

mobile/lib/providers/view_intent/view_intent_handler_android.dart

@@ -0,0 +1,118 @@
+import 'dart:async';
+
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
+import 'package:immich_mobile/domain/services/timeline.service.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:immich_mobile/providers/asset_viewer/asset_viewer.provider.dart';
+import 'package:immich_mobile/providers/auth.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_file_path.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_handler.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_main_timeline_ready.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_pending.provider.dart';
+import 'package:immich_mobile/routing/router.dart';
+import 'package:immich_mobile/services/view_intent.service.dart';
+import 'package:immich_mobile/services/view_intent_asset_resolver.service.dart';
+import 'package:logging/logging.dart';
+
+class AndroidViewIntentHandler implements ViewIntentHandler {
+  final Ref _ref;
+  final ViewIntentService _viewIntentService;
+  final ViewIntentAssetResolver _viewIntentAssetResolver;
+  final AppRouter _router;
+  static final Logger _logger = Logger('ViewIntentHandler');
+
+  AndroidViewIntentHandler(Ref ref)
+    : _ref = ref,
+      _viewIntentService = ref.read(viewIntentServiceProvider),
+      _viewIntentAssetResolver = ref.read(viewIntentAssetResolverProvider),
+      _router = ref.watch(appRouterProvider);
+
+  @override
+  void init() {
+    // Covers cold start from a view intent before the first lifecycle "resumed".
+    unawaited(onAppResumed());
+  }
+
+  @override
+  Future<void> onAppResumed() => _checkForViewIntent();
+
+  @override
+  Future<void> flushDeferredViewIntent() => _flushPending();
+
+  Future<void> _checkForViewIntent() async {
+    final attachment = await _viewIntentService.consumeViewIntent();
+    if (attachment != null) {
+      await handle(attachment);
+      return;
+    }
+
+    if (_ref.read(viewIntentPendingProvider) == null) {
+      await _viewIntentService.cleanupStaleTempFiles();
+    }
+  }
+
+  Future<void> _flushPending() async {
+    if (_ref.read(viewIntentPendingProvider) == null) {
+      return;
+    }
+
+    try {
+      await _ref.read(viewIntentMainTimelineReadyProvider.notifier).wait(timeout: const Duration(seconds: 3));
+    } catch (_) {
+      return;
+    }
+
+    final pendingAttachment = _ref.read(viewIntentPendingProvider.notifier).takeIfFresh();
+    _logger.info('flushPending, pendingAttachment:$pendingAttachment}');
+    if (pendingAttachment != null) {
+      await handle(pendingAttachment);
+    }
+  }
+
+  @override
+  Future<void> handle(ViewIntentPayload attachment) async {
+    _logger.info(
+      'handle attachment, mimeType:${attachment.mimeType}, localAssetId=${attachment.localAssetId}, path=${attachment.path}, isAuthenticated:${_ref.read(authProvider).isAuthenticated}',
+    );
+
+    if (!_ref.read(authProvider).isAuthenticated) {
+      _ref.read(viewIntentPendingProvider.notifier).defer(attachment);
+      return;
+    }
+
+    final resolvedAsset = await _viewIntentAssetResolver.resolve(attachment);
+    _logger.fine('resolved view intent asset: ${resolvedAsset.asset}');
+    await _openAssetViewer(
+      resolvedAsset.asset,
+      resolvedAsset.timelineService,
+      viewIntentFilePath: resolvedAsset.viewIntentFilePath,
+    );
+  }
+
+  Future<void> _openAssetViewer(BaseAsset asset, TimelineService timelineService, {String? viewIntentFilePath}) async {
+    final notifier = _ref.read(assetViewerProvider.notifier);
+    notifier.setViewerTransitionInProgress(true);
+    try {
+      prepareAssetViewerState(notifier, asset);
+      if (viewIntentFilePath != null) {
+        _ref.read(viewIntentFilePathProvider.notifier).setPath(viewIntentFilePath);
+        unawaited(_viewIntentService.setManagedTempFilePath(viewIntentFilePath));
+      } else {
+        _ref.read(viewIntentFilePathProvider.notifier).clear();
+        unawaited(_viewIntentService.cleanupManagedTempFile());
+      }
+
+      // Mirror the home-screen widget pattern: replace the route stack so
+      // the viewer sits directly on top of the main timeline. Back-press
+      // from the viewer lands the user on the timeline rather than on
+      // whatever route happened to be current (e.g. splash, login).
+      await _router.replaceAll([
+        const TabShellRoute(),
+        AssetViewerRoute(initialIndex: 0, timelineService: timelineService),
+      ]);
+    } finally {
+      notifier.setViewerTransitionInProgress(false);
+    }
+  }
+}

mobile/lib/providers/view_intent/view_intent_handler_stub.dart

@@ -0,0 +1,18 @@
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_handler.provider.dart';
+
+class StubViewIntentHandler implements ViewIntentHandler {
+  const StubViewIntentHandler();
+
+  @override
+  void init() {}
+
+  @override
+  Future<void> onAppResumed() async {}
+
+  @override
+  Future<void> flushDeferredViewIntent() async {}
+
+  @override
+  Future<void> handle(ViewIntentPayload attachment) async {}
+}

mobile/lib/providers/view_intent/view_intent_main_timeline_ready.provider.dart

@@ -0,0 +1,59 @@
+import 'dart:async';
+
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/domain/services/timeline.service.dart';
+import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
+
+final viewIntentMainTimelineReadyProvider = NotifierProvider<ViewIntentMainTimelineReadyNotifier, bool>(
+  ViewIntentMainTimelineReadyNotifier.new,
+);
+
+class ViewIntentMainTimelineReadyNotifier extends Notifier<bool> {
+  Completer<void>? _readyCompleter;
+  bool _hasSeenMainTimeline = false;
+  bool _hasTimelineUsers = false;
+  bool _isTimelineReady = false;
+
+  @override
+  bool build() {
+    _readyCompleter ??= Completer<void>();
+
+    final timelineUsers = ref.watch(timelineUsersProvider).valueOrNull;
+    final timelineService = ref.watch(timelineServiceProvider);
+    final timelineStatus = ref.watch(timelineStatusProvider(timelineService)).valueOrNull ?? timelineService.status;
+
+    _hasTimelineUsers = timelineUsers != null && timelineUsers.isNotEmpty;
+    _isTimelineReady = timelineStatus == TimelineStatus.ready;
+
+    final isReady = _computeReady();
+    _completeWaitersIfReady(isReady);
+    return isReady;
+  }
+
+  Future<void> wait({required Duration timeout}) {
+    if (state) {
+      return Future.value();
+    }
+
+    return _readyCompleter!.future.timeout(timeout);
+  }
+
+  void markMountedOnce() {
+    _hasSeenMainTimeline = true;
+    final isReady = _computeReady();
+    state = isReady;
+    _completeWaitersIfReady(isReady);
+  }
+
+  bool _computeReady() => _hasSeenMainTimeline && _hasTimelineUsers && _isTimelineReady;
+
+  void _completeWaitersIfReady(bool isReady) {
+    if (isReady) {
+      if (!(_readyCompleter?.isCompleted ?? true)) {
+        _readyCompleter?.complete();
+      }
+    } else if (_readyCompleter?.isCompleted ?? true) {
+      _readyCompleter = Completer<void>();
+    }
+  }
+}

mobile/lib/providers/view_intent/view_intent_pending.provider.dart

@@ -0,0 +1,39 @@
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+
+final viewIntentNowProvider = Provider<DateTime Function()>((ref) => DateTime.now);
+
+final viewIntentPendingProvider = NotifierProvider<ViewIntentPendingNotifier, ViewIntentPayload?>(
+  ViewIntentPendingNotifier.new,
+);
+
+class ViewIntentPendingNotifier extends Notifier<ViewIntentPayload?> {
+  static const _ttl = Duration(minutes: 10);
+
+  DateTime? _deferredAt;
+
+  @override
+  ViewIntentPayload? build() => null;
+
+  void defer(ViewIntentPayload attachment) {
+    _deferredAt = ref.read(viewIntentNowProvider)();
+    state = attachment;
+  }
+
+  ViewIntentPayload? takeIfFresh() {
+    final attachment = state;
+    final deferredAt = _deferredAt;
+    state = null;
+    _deferredAt = null;
+
+    if (attachment == null) {
+      return null;
+    }
+
+    if (deferredAt != null && ref.read(viewIntentNowProvider)().difference(deferredAt) > _ttl) {
+      return null;
+    }
+
+    return attachment;
+  }
+}

mobile/lib/services/foreground_upload.service.dart

@@ -151,7 +151,7 @@ class ForegroundUploadService {
     List<File> files, {
     Completer<void>? cancelToken,
     void Function(String fileId, int bytes, int totalBytes)? onProgress,
-    void Function(String fileId)? onSuccess,
+    void Function(String fileId, String remoteAssetId)? onSuccess,
     void Function(String fileId, String errorMessage)? onError,
   }) async {
     if (files.isEmpty) {
@@ -171,7 +171,7 @@ class ForegroundUploadService {
         );
 
         if (result.isSuccess) {
-          onSuccess?.call(fileId);
+          onSuccess?.call(fileId, result.remoteAssetId!);
         } else if (!result.isCancelled && result.errorMessage != null) {
           onError?.call(fileId, result.errorMessage!);
         }

mobile/lib/services/view_intent.service.dart

@@ -0,0 +1,91 @@
+import 'dart:io';
+
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:path/path.dart' as p;
+import 'package:path_provider/path_provider.dart';
+
+final viewIntentServiceProvider = Provider((ref) => ViewIntentService(ViewIntentHostApi()));
+
+class ViewIntentService {
+  final ViewIntentHostApi _viewIntentHostApi;
+  final Future<Directory> Function() _temporaryDirectory;
+  String? _managedTempFilePath;
+
+  ViewIntentService(this._viewIntentHostApi, {Future<Directory> Function()? temporaryDirectory})
+    : _temporaryDirectory = temporaryDirectory ?? getTemporaryDirectory;
+
+  Future<ViewIntentPayload?> consumeViewIntent() async {
+    try {
+      return await _viewIntentHostApi.consumeViewIntent();
+    } catch (_) {
+      // Ignore errors - view intent might not be present
+      return null;
+    }
+  }
+
+  Future<void> setManagedTempFilePath(String path) async {
+    final previous = _managedTempFilePath;
+    if (previous == path) {
+      return;
+    }
+    _managedTempFilePath = path;
+    if (previous != null) {
+      await cleanupTempFile(previous);
+    }
+  }
+
+  Future<void> cleanupManagedTempFile() async {
+    final path = _managedTempFilePath;
+    _managedTempFilePath = null;
+    if (path != null) {
+      await cleanupTempFile(path);
+    }
+  }
+
+  Future<void> cleanupManagedTempFileIfCurrent(String path) async {
+    if (_managedTempFilePath == path) {
+      _managedTempFilePath = null;
+    }
+    await cleanupTempFile(path);
+  }
+
+  Future<void> cleanupTempFile(String path) async {
+    if (!_isManagedTempFile(path)) {
+      return;
+    }
+
+    try {
+      final file = File(path);
+      if (await file.exists()) {
+        await file.delete();
+      }
+    } catch (_) {
+      // Best-effort cleanup only.
+    }
+  }
+
+  Future<void> cleanupStaleTempFiles() async {
+    try {
+      final tempDirectory = await _temporaryDirectory();
+      await for (final entity in tempDirectory.list()) {
+        if (entity is! File) {
+          continue;
+        }
+
+        final path = entity.path;
+        if (!_isManagedTempFile(path) || path == _managedTempFilePath) {
+          continue;
+        }
+
+        await entity.delete();
+      }
+    } catch (_) {
+      // Best-effort cleanup only.
+    }
+  }
+
+  bool _isManagedTempFile(String path) {
+    return p.basename(path).startsWith('view_intent_') && p.basename(p.dirname(path)) == 'cache';
+  }
+}

mobile/lib/services/view_intent_asset_resolver.service.dart

@@ -0,0 +1,90 @@
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
+import 'package:immich_mobile/domain/services/timeline.service.dart';
+import 'package:immich_mobile/infrastructure/repositories/local_asset.repository.dart';
+import 'package:immich_mobile/models/view_intent/view_intent_payload.extension.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:immich_mobile/providers/infrastructure/asset.provider.dart';
+import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
+import 'package:logging/logging.dart';
+
+class ViewIntentResolvedAsset {
+  final BaseAsset asset;
+  final TimelineService timelineService;
+
+  /// Path to the materialized temp file backing this asset, if any. Set only
+  /// for the transient deep-link case (no DB-backed local asset). The upload
+  /// flow reads this to know which file to upload.
+  final String? viewIntentFilePath;
+
+  const ViewIntentResolvedAsset({required this.asset, required this.timelineService, this.viewIntentFilePath});
+}
+
+final viewIntentAssetResolverProvider = Provider<ViewIntentAssetResolver>(
+  (ref) => ViewIntentAssetResolver(
+    localAssetRepository: ref.read(localAssetRepository),
+    timelineFactory: ref.read(timelineFactoryProvider),
+  ),
+);
+
+/// Resolves an incoming ACTION_VIEW intent into the data the asset viewer
+/// needs: a [BaseAsset] and a [TimelineService] containing it.
+///
+/// Always wraps the resolved asset in a 1-element [TimelineOrigin.deepLink]
+/// timeline — mirroring how the app's home-screen widgets open a single
+/// asset. We don't try to map the asset to its position in the user's main
+/// timeline because that would require ROW_NUMBER queries over the full
+/// merged timeline (slow at scale) and complex "wait until the main timeline
+/// service is ready at that index" coordination. Back-navigation from the
+/// viewer lands on the main timeline because the handler pushes the viewer
+/// on top of [TabShellRoute].
+class ViewIntentAssetResolver {
+  final DriftLocalAssetRepository _localAssetRepository;
+  final TimelineFactory _timelineFactory;
+  static final Logger _logger = Logger('ViewIntentAssetResolver');
+
+  const ViewIntentAssetResolver({
+    required DriftLocalAssetRepository localAssetRepository,
+    required TimelineFactory timelineFactory,
+  }) : _localAssetRepository = localAssetRepository,
+       _timelineFactory = timelineFactory;
+
+  Future<ViewIntentResolvedAsset> resolve(ViewIntentPayload attachment) async {
+    final localAssetId = attachment.localAssetId;
+    final path = attachment.path;
+    _logger.fine('resolve start, localAssetId=$localAssetId, path=$path, mimeType=${attachment.mimeType}');
+
+    if (localAssetId == null && path == null) {
+      throw StateError('ViewIntent resolution requires either a localAssetId or a materialized file path.');
+    }
+
+    // Prefer the DB-backed local asset when we have one — it carries richer
+    // metadata than the transient model we'd otherwise synthesise.
+    final localAsset = localAssetId != null ? await _localAssetRepository.getById(localAssetId) : null;
+    final asset = localAsset ?? _toTransientAsset(attachment);
+
+    return ViewIntentResolvedAsset(
+      asset: asset,
+      timelineService: _timelineFactory.fromAssets([asset], TimelineOrigin.deepLink),
+      // viewIntentFilePath is only meaningful for the transient case — the
+      // DB-backed local asset carries its own path/URI for the upload flow.
+      viewIntentFilePath: localAsset == null ? path : null,
+    );
+  }
+
+  LocalAsset _toTransientAsset(ViewIntentPayload attachment) {
+    final now = DateTime.now();
+    return LocalAsset(
+      // TODO(Ombodi): Introduce a file-backed BaseAsset for path-only view intents.
+      // The viewer currently expects a BaseAsset, so this temporary LocalAsset
+      // adapts an unmanaged file into the existing timeline/viewer pipeline.
+      id: attachment.localAssetId ?? '-${attachment.path!.hashCode.abs()}',
+      name: attachment.fileName,
+      type: attachment.isVideo ? AssetType.video : AssetType.image,
+      createdAt: now,
+      updatedAt: now,
+      isEdited: false,
+      playbackStyle: attachment.playbackStyle,
+    );
+  }
+}

mobile/lib/widgets/forms/login/login_form.dart

@@ -21,6 +21,7 @@ import 'package:immich_mobile/providers/background_sync.provider.dart';
 import 'package:immich_mobile/providers/gallery_permission.provider.dart';
 import 'package:immich_mobile/providers/oauth.provider.dart';
 import 'package:immich_mobile/providers/server_info.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_handler.provider.dart';
 import 'package:immich_mobile/providers/websocket.provider.dart';
 import 'package:immich_mobile/repositories/permission.repository.dart';
 import 'package:immich_mobile/routing/router.dart';
@@ -182,9 +183,11 @@ class LoginForm extends HookConsumerWidget {
 
     Future<void> handleSyncFlow() async {
       final backgroundManager = ref.read(backgroundSyncProvider);
+      final viewIntentHandler = ref.read(viewIntentHandlerProvider);
 
       await backgroundManager.syncLocal(full: true);
       await backgroundManager.syncRemote();
+      await viewIntentHandler.flushDeferredViewIntent();
       await backgroundManager.hashAssets();
 
       if (MetadataRepository.instance.appConfig.backup.syncAlbums) {
@@ -259,7 +262,7 @@ class LoginForm extends HookConsumerWidget {
           }
           unawaited(handleSyncFlow());
           ref.read(websocketProvider.notifier).connect();
-          unawaited(context.replaceRoute(const TabShellRoute()));
+          unawaited(context.router.replaceAll([const TabShellRoute()]));
           return;
         }
       } catch (error) {
@@ -346,7 +349,7 @@ class LoginForm extends HookConsumerWidget {
               await getManageMediaPermission();
             }
             unawaited(handleSyncFlow());
-            unawaited(context.replaceRoute(const TabShellRoute()));
+            unawaited(context.router.replaceAll([const TabShellRoute()]));
             return;
           }
         } catch (error, stack) {

mobile/mise.toml

@@ -29,7 +29,8 @@ run = [
   "dart run pigeon --input pigeon/background_worker_lock_api.dart",
   "dart run pigeon --input pigeon/connectivity_api.dart",
   "dart run pigeon --input pigeon/network_api.dart",
-  "dart format lib/platform/native_sync_api.g.dart lib/platform/local_image_api.g.dart lib/platform/remote_image_api.g.dart lib/platform/background_worker_api.g.dart lib/platform/background_worker_lock_api.g.dart lib/platform/connectivity_api.g.dart lib/platform/network_api.g.dart",
+    "dart run pigeon --input pigeon/view_intent_api.dart",
+    "dart format lib/platform/native_sync_api.g.dart lib/platform/local_image_api.g.dart lib/platform/remote_image_api.g.dart lib/platform/background_worker_api.g.dart lib/platform/background_worker_lock_api.g.dart lib/platform/connectivity_api.g.dart lib/platform/network_api.g.dart lib/platform/view_intent_api.g.dart",
 ]
 
 [tasks."codegen:translation"]

mobile/pigeon/view_intent_api.dart

@@ -0,0 +1,24 @@
+import 'package:pigeon/pigeon.dart';
+
+@ConfigurePigeon(
+  PigeonOptions(
+    dartOut: 'lib/platform/view_intent_api.g.dart',
+    kotlinOut: 'android/app/src/main/kotlin/app/alextran/immich/viewintent/ViewIntent.g.kt',
+    kotlinOptions: KotlinOptions(package: 'app.alextran.immich.viewintent'),
+    dartOptions: DartOptions(),
+    dartPackageName: 'immich_mobile',
+  ),
+)
+class ViewIntentPayload {
+  final String? path;
+  final String mimeType;
+  final String? localAssetId;
+
+  const ViewIntentPayload({this.path, required this.mimeType, this.localAssetId});
+}
+
+@HostApi()
+abstract class ViewIntentHostApi {
+  @async
+  ViewIntentPayload? consumeViewIntent();
+}

mobile/test/providers/view_intent/view_intent_handler_android_test.dart

@@ -0,0 +1,276 @@
+import 'dart:async';
+
+import 'package:auto_route/auto_route.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
+import 'package:immich_mobile/domain/models/timeline.model.dart';
+import 'package:immich_mobile/domain/services/timeline.service.dart';
+import 'package:immich_mobile/domain/services/user.service.dart';
+import 'package:immich_mobile/models/auth/auth_state.model.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:immich_mobile/providers/auth.provider.dart';
+import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_handler_android.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_main_timeline_ready.provider.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_pending.provider.dart';
+import 'package:immich_mobile/routing/router.dart';
+import 'package:immich_mobile/services/view_intent.service.dart';
+import 'package:immich_mobile/services/view_intent_asset_resolver.service.dart';
+import 'package:immich_mobile/services/auth.service.dart';
+import 'package:immich_mobile/services/api.service.dart';
+import 'package:immich_mobile/services/secure_storage.service.dart';
+import 'package:immich_mobile/services/widget.service.dart';
+import 'package:mocktail/mocktail.dart';
+
+class MockViewIntentHostApi extends Mock implements ViewIntentHostApi {}
+
+class MockViewIntentAssetResolver extends Mock implements ViewIntentAssetResolver {}
+
+class MockAppRouter extends Mock implements AppRouter {}
+
+class MockAuthService extends Mock implements AuthService {}
+
+class MockApiService extends Mock implements ApiService {}
+
+class MockUserService extends Mock implements UserService {}
+
+class MockSecureStorageService extends Mock implements SecureStorageService {}
+
+class MockWidgetService extends Mock implements WidgetService {}
+
+class FakePageRouteInfo extends Fake implements PageRouteInfo<dynamic> {}
+
+class FakeTimelineService extends Fake implements TimelineService {}
+
+class TestViewIntentService extends ViewIntentService {
+  ViewIntentPayload? consumedAttachment;
+  int cleanupStaleTempFilesCalls = 0;
+  int cleanupManagedTempFileCalls = 0;
+  final List<String> managedTempPaths = [];
+
+  TestViewIntentService() : super(MockViewIntentHostApi());
+
+  @override
+  Future<ViewIntentPayload?> consumeViewIntent() async => consumedAttachment;
+
+  @override
+  Future<void> cleanupStaleTempFiles() async {
+    cleanupStaleTempFilesCalls++;
+  }
+
+  @override
+  Future<void> cleanupManagedTempFile() async {
+    cleanupManagedTempFileCalls++;
+  }
+
+  @override
+  Future<void> setManagedTempFilePath(String path) async {
+    managedTempPaths.add(path);
+  }
+}
+
+class TestAuthNotifier extends AuthNotifier {
+  TestAuthNotifier(Ref ref, AuthState initial)
+    : super(
+        MockAuthService(),
+        MockApiService(),
+        MockUserService(),
+        MockSecureStorageService(),
+        MockWidgetService(),
+        ref,
+      ) {
+    state = initial;
+  }
+
+  void setAuthenticated(bool isAuthenticated) {
+    state = state.copyWith(isAuthenticated: isAuthenticated);
+  }
+}
+
+final _handlerProvider = Provider<AndroidViewIntentHandler>((ref) => AndroidViewIntentHandler(ref));
+
+void main() {
+  TestWidgetsFlutterBinding.ensureInitialized();
+
+  late TestViewIntentService viewIntentService;
+  late MockViewIntentAssetResolver resolver;
+  late MockAppRouter router;
+  late TestAuthNotifier authNotifier;
+  late ProviderContainer container;
+  late AndroidViewIntentHandler handler;
+  late ViewIntentPayload payload;
+  late LocalAsset deepLinkAsset;
+  late TimelineService deepLinkTimelineService;
+
+  setUpAll(() {
+    registerFallbackValue(FakePageRouteInfo());
+    registerFallbackValue(<PageRouteInfo<dynamic>>[]);
+    registerFallbackValue(FakeTimelineService());
+    registerFallbackValue(
+      ViewIntentPayload(path: '/tmp/fallback.jpg', mimeType: 'image/jpeg', localAssetId: 'fallback'),
+    );
+  });
+
+  setUp(() async {
+    viewIntentService = TestViewIntentService();
+    resolver = MockViewIntentAssetResolver();
+    router = MockAppRouter();
+    payload = ViewIntentPayload(path: '/tmp/incoming.jpg', mimeType: 'image/jpeg', localAssetId: 'local-1');
+    deepLinkAsset = _localAsset(id: 'local-1');
+    deepLinkTimelineService = await _createReadyTimelineService([deepLinkAsset], TimelineOrigin.deepLink);
+
+    when(() => router.replaceAll(any())).thenAnswer((_) async {});
+
+    container = ProviderContainer(
+      overrides: [
+        viewIntentServiceProvider.overrideWithValue(viewIntentService),
+        viewIntentAssetResolverProvider.overrideWithValue(resolver),
+        appRouterProvider.overrideWithValue(router),
+        // viewIntentMainTimelineReadyProvider reads both of these to compute
+        // its ready state — without them wait() never resolves.
+        timelineServiceProvider.overrideWithValue(deepLinkTimelineService),
+        timelineUsersProvider.overrideWith((ref) => Stream.value(['user-1'])),
+        authProvider.overrideWith((ref) {
+          authNotifier = TestAuthNotifier(ref, _authState(isAuthenticated: true));
+          return authNotifier;
+        }),
+      ],
+    );
+
+    authNotifier = container.read(authProvider.notifier) as TestAuthNotifier;
+    await container.read(timelineUsersProvider.future);
+    handler = container.read(_handlerProvider);
+
+    addTearDown(() async {
+      await deepLinkTimelineService.dispose();
+      container.dispose();
+    });
+  });
+
+  test('handle defers unauthenticated attachment', () async {
+    authNotifier.setAuthenticated(false);
+
+    await handler.handle(payload);
+
+    expect(container.read(viewIntentPendingProvider), payload);
+    verifyNever(() => resolver.resolve(any()));
+  });
+
+  testWidgets('flushDeferredViewIntent waits for main timeline readiness before flushing pending attachment', (
+    tester,
+  ) async {
+    authNotifier.setAuthenticated(false);
+    container.read(viewIntentPendingProvider.notifier).defer(payload);
+    authNotifier.setAuthenticated(true);
+
+    when(() => resolver.resolve(payload)).thenAnswer((_) async {
+      return ViewIntentResolvedAsset(asset: deepLinkAsset, timelineService: deepLinkTimelineService);
+    });
+
+    unawaited(handler.flushDeferredViewIntent());
+    await tester.pump();
+
+    expect(container.read(viewIntentPendingProvider), payload);
+    verifyNever(() => resolver.resolve(any()));
+
+    container.read(viewIntentMainTimelineReadyProvider.notifier).markMountedOnce();
+    await tester.pump();
+    await tester.pump();
+    await tester.idle();
+
+    expect(container.read(viewIntentPendingProvider), isNull);
+    verify(() => resolver.resolve(payload)).called(1);
+  });
+
+  test('flushDeferredViewIntent does nothing when there is no pending attachment', () async {
+    await handler.flushDeferredViewIntent();
+
+    verifyNever(() => resolver.resolve(any()));
+  });
+
+  test('onAppResumed cleans stale temp files when no attachment is present', () async {
+    viewIntentService.consumedAttachment = null;
+
+    await handler.onAppResumed();
+
+    expect(viewIntentService.cleanupStaleTempFilesCalls, 1);
+    verifyNever(() => resolver.resolve(any()));
+  });
+
+  test('onAppResumed does not clean stale temp files while pending attachment exists', () async {
+    viewIntentService.consumedAttachment = null;
+    container.read(viewIntentPendingProvider.notifier).defer(payload);
+
+    await handler.onAppResumed();
+
+    expect(viewIntentService.cleanupStaleTempFilesCalls, 0);
+    verifyNever(() => resolver.resolve(any()));
+  });
+
+  testWidgets('onAppResumed handles attachment immediately when authenticated', (tester) async {
+    viewIntentService.consumedAttachment = payload;
+    when(() => resolver.resolve(payload)).thenAnswer(
+      (_) async => ViewIntentResolvedAsset(asset: deepLinkAsset, timelineService: deepLinkTimelineService),
+    );
+
+    unawaited(handler.onAppResumed());
+    await tester.pump();
+    await tester.pump();
+    await tester.pump();
+    await tester.idle();
+
+    verify(() => resolver.resolve(payload)).called(1);
+    // Routes the user to [TabShell, AssetViewer] so back-press lands on the
+    // main timeline — mirrors the home-screen widget navigation pattern.
+    final captured = verify(() => router.replaceAll(captureAny())).captured;
+    expect(captured, hasLength(1));
+    final routes = captured.single as List<PageRouteInfo<dynamic>>;
+    expect(routes, hasLength(2));
+    expect(routes[0].routeName, TabShellRoute.name);
+    expect(routes[1].routeName, AssetViewerRoute.name);
+  });
+}
+
+AuthState _authState({required bool isAuthenticated}) {
+  return AuthState(
+    deviceId: 'device-1',
+    userId: 'user-1',
+    userEmail: 'user@example.com',
+    isAuthenticated: isAuthenticated,
+    name: 'User',
+    isAdmin: false,
+    profileImagePath: '',
+  );
+}
+
+LocalAsset _localAsset({required String id}) {
+  return LocalAsset(
+    id: id,
+    name: '$id.jpg',
+    checksum: 'checksum-1',
+    type: AssetType.image,
+    createdAt: DateTime(2026, 4, 20),
+    updatedAt: DateTime(2026, 4, 20),
+    playbackStyle: AssetPlaybackStyle.image,
+    isEdited: false,
+  );
+}
+
+TimelineService _timelineServiceFromAssets(List<BaseAsset> assets, TimelineOrigin origin) {
+  return TimelineService((
+    assetSource: (index, count) async => assets.skip(index).take(count).toList(),
+    bucketSource: () => Stream.value([Bucket(assetCount: assets.length)]),
+    origin: origin,
+  ));
+}
+
+Future<TimelineService> _createReadyTimelineService(List<BaseAsset> assets, TimelineOrigin origin) async {
+  final timelineService = _timelineServiceFromAssets(assets, origin);
+
+  if (!timelineService.isReady) {
+    await timelineService.watchStatus().firstWhere((status) => status == TimelineStatus.ready);
+  }
+
+  return timelineService;
+}

mobile/test/providers/view_intent/view_intent_pending_provider_test.dart

@@ -0,0 +1,64 @@
+import 'package:flutter_test/flutter_test.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:immich_mobile/providers/view_intent/view_intent_pending.provider.dart';
+
+void main() {
+  late DateTime now;
+  late ProviderContainer container;
+
+  final attachment = ViewIntentPayload(
+    path: '/tmp/file.jpg',
+    mimeType: 'image/jpeg',
+    localAssetId: '42',
+  );
+
+  setUp(() {
+    now = DateTime(2026, 4, 17, 12);
+    container = ProviderContainer(
+      overrides: [viewIntentNowProvider.overrideWithValue(() => now)],
+    );
+    addTearDown(container.dispose);
+  });
+
+  test('defer stores pending attachment', () {
+    container.read(viewIntentPendingProvider.notifier).defer(attachment);
+
+    expect(container.read(viewIntentPendingProvider), attachment);
+  });
+
+  test('takeIfFresh returns pending attachment once', () {
+    container.read(viewIntentPendingProvider.notifier).defer(attachment);
+
+    final first = container.read(viewIntentPendingProvider.notifier).takeIfFresh();
+    final second = container.read(viewIntentPendingProvider.notifier).takeIfFresh();
+
+    expect(first, attachment);
+    expect(second, isNull);
+  });
+
+  test('takeIfFresh drops expired attachment', () {
+    container.read(viewIntentPendingProvider.notifier).defer(attachment);
+    now = now.add(const Duration(minutes: 11));
+
+    final result = container.read(viewIntentPendingProvider.notifier).takeIfFresh();
+
+    expect(result, isNull);
+    expect(container.read(viewIntentPendingProvider), isNull);
+  });
+
+  test('newer deferred attachment replaces older one', () {
+    final newerAttachment = ViewIntentPayload(
+      path: '/tmp/file-2.jpg',
+      mimeType: 'image/jpeg',
+      localAssetId: '43',
+    );
+
+    container.read(viewIntentPendingProvider.notifier).defer(attachment);
+    container.read(viewIntentPendingProvider.notifier).defer(newerAttachment);
+
+    final result = container.read(viewIntentPendingProvider.notifier).takeIfFresh();
+
+    expect(result, newerAttachment);
+  });
+}

mobile/test/services/view_intent_asset_resolver_test.dart

@@ -0,0 +1,123 @@
+import 'dart:async';
+
+import 'package:flutter_test/flutter_test.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/domain/models/asset/base_asset.model.dart';
+import 'package:immich_mobile/domain/models/timeline.model.dart';
+import 'package:immich_mobile/domain/services/timeline.service.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:immich_mobile/providers/infrastructure/asset.provider.dart';
+import 'package:immich_mobile/providers/infrastructure/timeline.provider.dart';
+import 'package:immich_mobile/services/view_intent_asset_resolver.service.dart';
+import 'package:mocktail/mocktail.dart';
+
+import '../infrastructure/repository.mock.dart';
+
+class MockTimelineFactory extends Mock implements TimelineFactory {}
+
+void main() {
+  late MockDriftLocalAssetRepository mockLocalAssetRepository;
+  late MockTimelineFactory timelineFactory;
+  late List<TimelineService> createdTimelineServices;
+  late ProviderContainer container;
+
+  setUp(() {
+    mockLocalAssetRepository = MockDriftLocalAssetRepository();
+    timelineFactory = MockTimelineFactory();
+    createdTimelineServices = [];
+
+    when(() => timelineFactory.fromAssets(any(), TimelineOrigin.deepLink)).thenAnswer((invocation) {
+      final assets = List<BaseAsset>.from(invocation.positionalArguments[0] as List<BaseAsset>);
+      final timelineService = _timelineServiceFromAssets(assets, TimelineOrigin.deepLink);
+      createdTimelineServices.add(timelineService);
+      return timelineService;
+    });
+
+    container = ProviderContainer(
+      overrides: [
+        localAssetRepository.overrideWith((ref) => mockLocalAssetRepository),
+        timelineFactoryProvider.overrideWith((ref) => timelineFactory),
+      ],
+    );
+
+    addTearDown(() async {
+      for (final timelineService in createdTimelineServices) {
+        await timelineService.dispose();
+      }
+      container.dispose();
+    });
+  });
+
+  test('returns DB-backed local asset wrapped in a 1-element deep-link timeline', () async {
+    final localAsset = _localAsset(id: 'local-1', checksum: 'checksum-1');
+    when(() => mockLocalAssetRepository.getById('local-1')).thenAnswer((_) async => localAsset);
+
+    final result = await _resolve(container, _payload(localAssetId: 'local-1'));
+
+    expect(result.asset, equals(localAsset));
+    expect(result.timelineService.origin, TimelineOrigin.deepLink);
+    expect(result.viewIntentFilePath, isNull, reason: 'DB-backed assets carry their own source — no temp file needed');
+  });
+
+  test('returns transient asset with temp file path when localAssetId has no DB row', () async {
+    when(() => mockLocalAssetRepository.getById('local-1')).thenAnswer((_) async => null);
+
+    final result = await _resolve(container, _payload(localAssetId: 'local-1', path: '/tmp/incoming.jpg'));
+
+    expect(result.asset, isA<LocalAsset>());
+    expect(result.timelineService.origin, TimelineOrigin.deepLink);
+    expect(result.viewIntentFilePath, '/tmp/incoming.jpg');
+  });
+
+  test('returns transient asset for path-only attachment', () async {
+    final result = await _resolve(
+      container,
+      _payload(localAssetId: null, path: '/tmp/incoming.webp', mimeType: 'image/webp'),
+    );
+
+    expect(result.asset, isA<LocalAsset>());
+    expect(result.timelineService.origin, TimelineOrigin.deepLink);
+    expect(result.viewIntentFilePath, '/tmp/incoming.webp');
+
+    final asset = result.asset as LocalAsset;
+    expect(asset.localId, startsWith('-'));
+    expect(asset.name, 'incoming.webp');
+    expect(asset.playbackStyle, AssetPlaybackStyle.imageAnimated);
+  });
+
+  test('throws when neither localAssetId nor path is provided', () async {
+    await expectLater(
+      _resolve(container, _payload(localAssetId: null, path: null)),
+      throwsA(isA<StateError>()),
+    );
+  });
+}
+
+Future<ViewIntentResolvedAsset> _resolve(ProviderContainer container, ViewIntentPayload payload) {
+  return container.read(viewIntentAssetResolverProvider).resolve(payload);
+}
+
+ViewIntentPayload _payload({String? localAssetId = 'local-1', String? path, String mimeType = 'image/jpeg'}) {
+  return ViewIntentPayload(path: path, mimeType: mimeType, localAssetId: localAssetId);
+}
+
+LocalAsset _localAsset({required String id, String? checksum}) {
+  return LocalAsset(
+    id: id,
+    name: '$id.jpg',
+    checksum: checksum,
+    type: AssetType.image,
+    createdAt: DateTime(2026, 4, 20),
+    updatedAt: DateTime(2026, 4, 20),
+    playbackStyle: AssetPlaybackStyle.image,
+    isEdited: false,
+  );
+}
+
+TimelineService _timelineServiceFromAssets(List<BaseAsset> assets, TimelineOrigin origin) {
+  return TimelineService((
+    assetSource: (index, count) async => assets.skip(index).take(count).toList(),
+    bucketSource: () => Stream.value([Bucket(assetCount: assets.length)]),
+    origin: origin,
+  ));
+}

mobile/test/services/view_intent_service_test.dart

@@ -0,0 +1,96 @@
+import 'dart:io';
+
+import 'package:flutter_test/flutter_test.dart';
+import 'package:immich_mobile/platform/view_intent_api.g.dart';
+import 'package:immich_mobile/services/view_intent.service.dart';
+import 'package:mocktail/mocktail.dart';
+
+class MockViewIntentHostApi extends Mock implements ViewIntentHostApi {}
+
+void main() {
+  late MockViewIntentHostApi hostApi;
+  late ViewIntentService service;
+  late Directory tempRoot;
+  late Directory cacheDir;
+
+  final attachment = ViewIntentPayload(
+    path: '/tmp/file.jpg',
+    mimeType: 'image/jpeg',
+    localAssetId: '42',
+  );
+
+  setUp(() {
+    hostApi = MockViewIntentHostApi();
+    tempRoot = Directory.systemTemp.createTempSync('view-intent-root');
+    cacheDir = Directory('${tempRoot.path}/cache')..createSync();
+    service = ViewIntentService(hostApi, temporaryDirectory: () async => cacheDir);
+  });
+
+  tearDown(() async {
+    clearInteractions(hostApi);
+    if (await tempRoot.exists()) {
+      await tempRoot.delete(recursive: true);
+    }
+  });
+
+  test('consumeViewIntent returns null when no attachment', () async {
+    when(() => hostApi.consumeViewIntent()).thenAnswer((_) async => null);
+
+    final result = await service.consumeViewIntent();
+
+    expect(result, isNull);
+    verify(() => hostApi.consumeViewIntent()).called(1);
+  });
+
+  test('consumeViewIntent returns attachment when present', () async {
+    when(() => hostApi.consumeViewIntent()).thenAnswer((_) async => attachment);
+
+    final result = await service.consumeViewIntent();
+
+    expect(result, attachment);
+    verify(() => hostApi.consumeViewIntent()).called(1);
+  });
+
+  test('consumeViewIntent swallows host api errors', () async {
+    when(() => hostApi.consumeViewIntent()).thenThrow(Exception('boom'));
+
+    final result = await service.consumeViewIntent();
+
+    expect(result, isNull);
+    verify(() => hostApi.consumeViewIntent()).called(1);
+  });
+
+  test('setManagedTempFilePath cleans previous managed temp file', () async {
+    final firstFile = File('${cacheDir.path}/view_intent_first.jpg')..writeAsStringSync('first');
+    final secondFile = File('${cacheDir.path}/view_intent_second.jpg')..writeAsStringSync('second');
+
+    await service.setManagedTempFilePath(firstFile.path);
+    await service.setManagedTempFilePath(secondFile.path);
+
+    expect(await firstFile.exists(), isFalse);
+    expect(await secondFile.exists(), isTrue);
+
+    await service.cleanupManagedTempFile();
+    expect(await secondFile.exists(), isFalse);
+  });
+
+  test('cleanupTempFile ignores non-managed paths', () async {
+    final nonManagedFile = File('${tempRoot.path}/plain_file.jpg')..writeAsStringSync('content');
+
+    await service.cleanupTempFile(nonManagedFile.path);
+
+    expect(await nonManagedFile.exists(), isTrue);
+  });
+
+  test('cleanupStaleTempFiles removes view-intent temp files and keeps unrelated files', () async {
+    final firstFile = File('${cacheDir.path}/view_intent_first.jpg')..writeAsStringSync('first');
+    final secondFile = File('${cacheDir.path}/view_intent_second.jpg')..writeAsStringSync('second');
+    final unrelatedFile = File('${cacheDir.path}/plain_file.jpg')..writeAsStringSync('plain');
+
+    await service.cleanupStaleTempFiles();
+
+    expect(await firstFile.exists(), isFalse);
+    expect(await secondFile.exists(), isFalse);
+    expect(await unrelatedFile.exists(), isTrue);
+  });
+}

web/src/lib/modals/PluginMethodPicker.svelte

@@ -12,7 +12,7 @@
   const { trigger, selectedKey, onClose }: Props = $props();
 </script>
 
-<BasicModal title={$t('add_step')} {onClose} size="medium">
+<BasicModal title={$t('add_step')} {onClose}>
   {#await searchPluginMethods({ trigger })}
     <div class="flex w-full place-content-center place-items-center">
       <LoadingSpinner />

web/src/lib/modals/WorkflowAddStepModal.svelte

@@ -38,7 +38,7 @@
 </script>
 
 {#if method}
-  <FormModal title={$t('add_step')} {onClose} {onSubmit} disabled={!method} size="medium">
+  <FormModal title={$t('add_step')} {onClose} {onSubmit} disabled={!method} size="small">
     <div class="flex items-center justify-between gap-2">
       <div class="grow text-start">
         <Text fontWeight="medium">{method.title}</Text>

web/src/lib/modals/WorkflowEditStepModal.svelte

@@ -35,7 +35,7 @@
 </script>
 
 {#if method}
-  <FormModal title={$t('step_details')} {onClose} {onSubmit} disabled={!method} size="medium">
+  <FormModal title={$t('step_details')} {onClose} {onSubmit} disabled={!method} size="small">
     <div class="flex items-center justify-between gap-2">
       <div class="grow text-start">
         <Text fontWeight="medium">{method.title}</Text>

web/src/lib/modals/WorkflowTriggerPicker.svelte

@@ -17,7 +17,7 @@
   const onSubmit = () => onClose(selected);
 </script>
 
-<FormModal title={$t('trigger')} {onClose} {onSubmit} size="medium">
+<FormModal title={$t('trigger')} {onClose} {onSubmit} size="small">
   <div class="flex flex-col gap-2">
     {#each pluginManager.triggers as item (item.trigger)}
       <ListButton selected={selected === item.trigger} onclick={() => (selected = item.trigger)}>

web/src/routes/(user)/workflows/+page.svelte

@@ -4,24 +4,26 @@
   import UserPageLayout from '$lib/components/layouts/UserPageLayout.svelte';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import EmptyPlaceholder from '$lib/components/shared-components/EmptyPlaceholder.svelte';
+  import { pluginManager } from '$lib/managers/plugin-manager.svelte';
   import { Route } from '$lib/route';
   import { getWorkflowActions, getWorkflowsActions, getWorkflowShowSchemaAction } from '$lib/services/workflow.service';
   import { getWorkflowForShare, type WorkflowResponseDto } from '@immich/sdk';
   import {
-    Badge,
     Button,
     Card,
+    CardBody,
     CardDescription,
     CardHeader,
     CardTitle,
     CodeBlock,
     Container,
-    Icon,
     IconButton,
     MenuItemType,
     menuManager,
+    Text,
+    VStack,
   } from '@immich/ui';
-  import { mdiClose, mdiDotsVertical, mdiFlashOutline } from '@mdi/js';
+  import { mdiClose, mdiDotsVertical } from '@mdi/js';
   import { t } from 'svelte-i18n';
   import { SvelteSet } from 'svelte/reactivity';
   import type { PageData } from './$types';
@@ -44,6 +46,20 @@
     }
   };
 
+  const getTriggerLabel = (triggerType: string) => {
+    const labels: Record<string, string> = {
+      AssetCreate: $t('asset_created'),
+      PersonRecognized: $t('person_recognized'),
+    };
+    return labels[triggerType] || triggerType;
+  };
+
+  const formatTimestamp = (createdAt: string) =>
+    new Intl.DateTimeFormat(undefined, {
+      dateStyle: 'medium',
+      timeStyle: 'short',
+    }).format(new Date(createdAt));
+
   const showWorkflowMenu = (event: MouseEvent, workflow: WorkflowResponseDto) => {
     const { ToggleEnabled, Edit, Delete } = getWorkflowActions($t, workflow);
     void menuManager.show({
@@ -76,6 +92,12 @@
 
 <OnEvents {onWorkflowCreate} {onWorkflowUpdate} {onWorkflowDelete} />
 
+{#snippet chipItem(title: string)}
+  <span class="rounded-xl border border-gray-200/80 bg-light px-3 py-1.5 text-sm dark:border-gray-600">
+    <span class="font-medium text-dark">{title}</span>
+  </span>
+{/snippet}
+
 <UserPageLayout title={data.meta.title} actions={[Create]} scrollbar={false}>
   <section class="flex place-content-center sm:mx-4">
     <Container center size="large" class="pb-28">
@@ -89,77 +111,92 @@
           class="mx-auto mt-10"
         />
       {:else}
-        <div class="my-6 flex flex-col gap-3">
+        <div class="my-6 grid gap-6">
           {#each workflows as workflow (workflow.id)}
-            <Card class="group shadow-none transition-colors hover:border-primary">
-              <CardHeader>
-                <a
-                  href={Route.viewWorkflow({ id: workflow.id })}
-                  class="flex items-center gap-4"
-                  class:opacity-55={!workflow.enabled}
-                >
-                  <div
-                    class={`flex size-11 shrink-0 items-center justify-center rounded-xl ${
-                      workflow.enabled
-                        ? 'bg-immich-primary/10 text-immich-primary dark:bg-immich-dark-primary/15 dark:text-immich-dark-primary'
-                        : 'bg-gray-100 text-gray-400 dark:bg-gray-800 dark:text-gray-500'
-                    }`}
-                  >
-                    <Icon icon={mdiFlashOutline} size="20" />
+            <Card class="border border-light-200">
+              <CardHeader
+                class={`flex flex-row gap-4 px-8 py-6 sm:items-center sm:gap-6 ${
+                  workflow.enabled
+                    ? 'bg-linear-to-r from-green-50 to-white dark:from-green-800/50 dark:to-green-950/45'
+                    : 'bg-neutral-50 dark:bg-neutral-900'
+                }`}
+              >
+                <div class="flex-1">
+                  <div class="flex items-center gap-3">
+                    <span class="rounded-full {workflow.enabled ? 'size-3 bg-success' : 'size-3 rounded-full bg-muted'}"
+                    ></span>
+                    <CardTitle>{workflow.name || $t('workflow')}</CardTitle>
                   </div>
+                  {#if workflow.description}
+                    <CardDescription class="mt-1 text-sm">{workflow.description}</CardDescription>
+                  {/if}
+                </div>
 
-                  <div class="min-w-0 flex-1">
-                    <div class="flex items-center gap-2">
-                      <CardTitle class="truncate font-semibold text-dark group-hover:text-primary">
-                        {workflow.name || $t('workflow')}
-                      </CardTitle>
-
-                      {#if !workflow.enabled}
-                        <Badge size="small" color="secondary">
-                          {$t('disabled')}
-                        </Badge>
-                      {/if}
-                    </div>
-
-                    {#if workflow.description}
-                      <CardDescription class="mt-0.5 truncate">
-                        {workflow.description}
-                      </CardDescription>
-                    {/if}
+                <div class="flex items-center gap-4">
+                  <div class="hidden text-right sm:block">
+                    <Text size="tiny">{$t('created_at')}</Text>
+                    <Text size="small" fontWeight="medium">
+                      {formatTimestamp(workflow.createdAt)}
+                    </Text>
                   </div>
-
                   <IconButton
                     shape="round"
                     variant="ghost"
                     color="secondary"
                     icon={mdiDotsVertical}
                     aria-label={$t('menu')}
-                    onclick={(event: MouseEvent) => {
-                      event.preventDefault();
-                      event.stopPropagation();
-                      showWorkflowMenu(event, workflow);
-                    }}
+                    onclick={(event: MouseEvent) => showWorkflowMenu(event, workflow)}
                   />
-                </a>
+                </div>
+              </CardHeader>
+
+              <CardBody class="space-y-6">
+                <div class="grid gap-4 md:grid-cols-3">
+                  <!-- Trigger Section -->
+                  <div class="rounded-2xl border border-light-200 bg-light-50 p-4">
+                    <div class="mb-3">
+                      <Text size="tiny" color="muted" fontWeight="medium">{$t('trigger')}</Text>
+                    </div>
+                    {@render chipItem(getTriggerLabel(workflow.trigger))}
+                  </div>
+
+                  <!-- Actions Section -->
+                  <div class="rounded-2xl border border-light-200 bg-light-50 p-4">
+                    <div class="mb-3">
+                      <Text size="tiny" color="muted" fontWeight="medium">{$t('steps')}</Text>
+                    </div>
+
+                    <div>
+                      {#if workflow.steps.length === 0}
+                        <span class="text-sm text-light-600">
+                          {$t('no_steps')}
+                        </span>
+                      {:else}
+                        <div class="flex flex-wrap gap-2">
+                          {#each workflow.steps as step, i (i)}
+                            {@render chipItem(pluginManager.getMethodLabel(step.method))}
+                          {/each}
+                        </div>
+                      {/if}
+                    </div>
+                  </div>
+                </div>
 
                 {#if expandedIds.has(workflow.id)}
                   {#await getWorkflowForShare({ id: workflow.id }) then result}
-                    <div class="border-t border-gray-200 p-4 dark:border-gray-800">
+                    <VStack gap={2} class="w-full rounded-2xl border border-light-200 bg-light-50 p-4">
                       <CodeBlock code={JSON.stringify(result, null, 2)} lineNumbers />
                       <Button
-                        class="mt-2"
                         leadingIcon={mdiClose}
                         fullWidth
                         variant="ghost"
                         color="secondary"
-                        onclick={() => toggleExpanded(workflow.id)}
+                        onclick={() => toggleExpanded(workflow.id)}>{$t('close')}</Button
                       >
-                        {$t('close')}
-                      </Button>
-                    </div>
+                    </VStack>
                   {/await}
                 {/if}
-              </CardHeader>
+              </CardBody>
             </Card>
           {/each}
         </div>

web/src/routes/(user)/workflows/[workflowId]/+page.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { beforeNavigate, goto, invalidate } from '$app/navigation';
+  import { goto, invalidate } from '$app/navigation';
   import OnEvents from '$lib/components/OnEvents.svelte';
   import { pluginManager } from '$lib/managers/plugin-manager.svelte';
   import WorkflowAddStepModal from '$lib/modals/WorkflowAddStepModal.svelte';
@@ -8,7 +8,7 @@
   import { Route } from '$lib/route';
   import { handleUpdateWorkflow } from '$lib/services/workflow.service';
   import { getTriggerDescription, getTriggerName } from '$lib/utils/workflow';
-  import type { WorkflowResponseDto, WorkflowStepDto, WorkflowUpdateDto } from '@immich/sdk';
+  import type { WorkflowResponseDto, WorkflowStepDto } from '@immich/sdk';
   import {
     ActionBar,
     AppShell,
@@ -29,40 +29,26 @@
     IconButton,
     Input,
     modalManager,
+    Stack,
     Switch,
+    Text,
     Textarea,
     VStack,
+    type ActionItem,
   } from '@immich/ui';
   import {
     mdiArrowLeft,
-    mdiCodeJson,
     mdiContentSave,
     mdiFlashOutline,
     mdiFormatListBulletedSquare,
     mdiInformationOutline,
     mdiPencilOutline,
     mdiPlus,
+    mdiTrashCanOutline,
   } from '@mdi/js';
-  import { cloneDeep, isEqual } from 'lodash-es';
-  import { flushSync } from 'svelte';
   import { t } from 'svelte-i18n';
   import type { PageData } from './$types';
-  import WorkflowJsonEditor from './WorkflowJsonEditor.svelte';
-  import WorkflowStepCard from './WorkflowStepCard.svelte';
-  import WorkflowStepDragImage from './WorkflowStepDragImage.svelte';
-  import WorkflowSummary from './WorkflowSummary.svelte';
-
-  type WorkflowJsonContent = Required<
-    Pick<WorkflowUpdateDto, 'description' | 'enabled' | 'name' | 'steps' | 'trigger'>
-  >;
-
-  type EditMode = 'visual' | 'json';
-  type StepDragImage = {
-    description?: string;
-    isFilter: boolean;
-    label: string;
-    stepNumber: number;
-  };
+  import HeaderActionButton from '$lib/components/HeaderActionButton.svelte';
 
   type Props = {
     data: PageData;
@@ -71,27 +57,6 @@
   let { data }: Props = $props();
 
   let { id, enabled, name, description, trigger, steps } = $derived(data.workflow);
-  let savedWorkflow = $state(cloneDeep(data.workflow));
-  let allowNavigation = $state(false);
-  let isShowingNavigationDialog = $state(false);
-  let isSaving = $state(false);
-  let editMode = $state<EditMode>('visual');
-  let draggedIndex = $state<number | null>(null);
-  let dragHandleHoverIndex = $state<number | null>(null);
-  let dragImageElement = $state<HTMLElement | null>(null);
-  let dragImage = $state<StepDragImage>({ isFilter: false, label: '', stepNumber: 1 });
-  let dropTargetIndex = $state<number | null>(null);
-
-  const workflowSummary = $derived({ name, description, trigger, steps });
-  const workflowJsonContent = $derived<WorkflowJsonContent>({ description, enabled, name, steps, trigger });
-
-  const hasChanges = $derived(
-    enabled !== savedWorkflow.enabled ||
-      name !== savedWorkflow.name ||
-      description !== savedWorkflow.description ||
-      !isEqual(trigger, savedWorkflow.trigger) ||
-      !isEqual(steps, savedWorkflow.steps),
-  );
 
   const handleAddStep = async () => {
     const step = await modalManager.show(WorkflowAddStepModal, { trigger });
@@ -100,90 +65,13 @@
     }
   };
 
-  const handleInsertStep = async (index: number) => {
-    const step = await modalManager.show(WorkflowAddStepModal, { trigger });
-    if (step) {
-      steps = [...steps.slice(0, index), step, ...steps.slice(index)];
-    }
-  };
-
-  const replaceStep = (index: number, step: WorkflowStepDto) => {
-    steps = steps.map((current, i) => (i === index ? cloneDeep(step) : current));
-  };
-
-  const handleEditStep = async (index: number) => {
-    const step = steps[index];
-    if (!step) {
-      return;
-    }
-
-    const result = await modalManager.show(WorkflowEditStepModal, { trigger, step: cloneDeep(step) });
+  const handleEditStep = async (step: WorkflowStepDto) => {
+    const result = await modalManager.show(WorkflowEditStepModal, { trigger, step });
     if (result) {
-      replaceStep(index, result);
+      Object.assign(step, result);
     }
   };
 
-  const handleDragStart = (index: number, event: DragEvent) => {
-    draggedIndex = index;
-    if (event.dataTransfer) {
-      event.dataTransfer.effectAllowed = 'move';
-      event.dataTransfer.setData('text/plain', String(index));
-
-      const step = steps[index];
-      const method = step ? pluginManager.getMethod(step.method) : undefined;
-      dragImage = {
-        description: method?.description,
-        isFilter: method?.uiHints?.includes('filter') ?? false,
-        label: step ? pluginManager.getMethodLabel(step.method) : '',
-        stepNumber: index + 1,
-      };
-      flushSync();
-
-      if (dragImageElement) {
-        event.dataTransfer.setDragImage(dragImageElement, 16, 22);
-      }
-    }
-  };
-
-  const handleDragOver = (index: number, event: DragEvent) => {
-    if (draggedIndex === null) {
-      return;
-    }
-    event.preventDefault();
-    if (event.dataTransfer) {
-      event.dataTransfer.dropEffect = 'move';
-    }
-    if (dropTargetIndex !== index) {
-      dropTargetIndex = index;
-    }
-  };
-
-  const handleDragLeave = (index: number) => {
-    if (dropTargetIndex === index) {
-      dropTargetIndex = null;
-    }
-  };
-
-  const handleDrop = (index: number, event: DragEvent) => {
-    event.preventDefault();
-    const from = draggedIndex;
-    draggedIndex = null;
-    dropTargetIndex = null;
-    if (from === null || from === index) {
-      return;
-    }
-    const next = [...steps];
-    const [moved] = next.splice(from, 1);
-    next.splice(index, 0, moved);
-    steps = next;
-  };
-
-  const handleDragEnd = () => {
-    draggedIndex = null;
-    dragHandleHoverIndex = null;
-    dropTargetIndex = null;
-  };
-
   const handleDeleteStep = async (index: number) => {
     const confirmed = await modalManager.showDialog({ title: $t('step_delete'), prompt: $t('step_delete_confirm') });
     if (confirmed) {
@@ -192,16 +80,11 @@
     }
   };
 
-  const handleJsonContentChange = (content: WorkflowJsonContent) => {
-    enabled = content.enabled;
-    name = content.name;
-    description = content.description;
-    trigger = content.trigger;
-    steps = cloneDeep(content.steps);
+  const onClose = async () => {
+    // check for pending changes
+    await goto(Route.workflows());
   };
 
-  const onClose = () => goto(Route.workflows());
-
   const onChangeTrigger = async () => {
     const newTrigger = await modalManager.show(WorkflowTriggerPicker, { selected: trigger });
     if (newTrigger) {
@@ -212,228 +95,163 @@
   const onWorkflowUpdate = async (response: WorkflowResponseDto) => {
     if (id === response.id) {
       data.workflow = response;
-      savedWorkflow = cloneDeep(response);
       await invalidate('workflow:data');
     }
   };
 
-  const confirmNavigation = async () => {
-    if (!hasChanges) {
-      return true;
-    }
-
-    if (isShowingNavigationDialog) {
-      return false;
-    }
-
-    try {
-      isShowingNavigationDialog = true;
-      return await modalManager.showDialog({
-        prompt: $t('workflow_navigation_prompt'),
-        confirmColor: 'primary',
-      });
-    } finally {
-      isShowingNavigationDialog = false;
-    }
+  const Done: ActionItem = {
+    title: $t('save'),
+    icon: mdiContentSave,
+    color: 'primary',
+    onAction: () => handleUpdateWorkflow(id, { enabled, name, description, trigger, steps }),
   };
-
-  const saveWorkflow = async () => {
-    if (!hasChanges || isSaving) {
-      return;
-    }
-
-    isSaving = true;
-    try {
-      const submitted = { enabled, name, description, trigger, steps: cloneDeep(steps) };
-      const saved = await handleUpdateWorkflow(id, submitted);
-
-      if (saved) {
-        Object.assign(savedWorkflow, submitted);
-      }
-    } finally {
-      isSaving = false;
-    }
-  };
-
-  beforeNavigate(({ cancel, to, willUnload }) => {
-    if (!hasChanges || allowNavigation) {
-      return;
-    }
-
-    cancel();
-
-    if (willUnload || !to) {
-      return;
-    }
-
-    void confirmNavigation().then((confirmed) => {
-      if (confirmed) {
-        allowNavigation = true;
-        void goto(to.url);
-      }
-    });
-  });
 </script>
 
 <OnEvents {onWorkflowUpdate} />
 
-<AppShell class="">
+<AppShell>
   <AppShellBar>
     <ActionBar static {onClose} translations={{ close: $t('back') }} closeIcon={mdiArrowLeft}>
       <ControlBarHeader>
         <ControlBarTitle>{data.workflow.name}</ControlBarTitle>
         <ControlBarDescription>{data.workflow.description}</ControlBarDescription>
       </ControlBarHeader>
-      <ControlBarContent class="flex items-center justify-end gap-6">
-        <div class="flex gap-1 rounded-full border border-light-200 bg-light p-1" role="group">
-          <Button
-            variant={editMode === 'visual' ? 'filled' : 'ghost'}
-            color={editMode === 'visual' ? 'primary' : 'secondary'}
-            size="small"
-            leadingIcon={mdiFormatListBulletedSquare}
-            aria-pressed={editMode === 'visual'}
-            onclick={() => (editMode = 'visual')}
-            shape="round"
-          >
-            {$t('visual')}
-          </Button>
-          <Button
-            variant={editMode === 'json' ? 'filled' : 'ghost'}
-            color={editMode === 'json' ? 'primary' : 'secondary'}
-            size="small"
-            leadingIcon={mdiCodeJson}
-            aria-pressed={editMode === 'json'}
-            onclick={() => (editMode = 'json')}
-            shape="round"
-          >
-            JSON
-          </Button>
-        </div>
-
-        <Button
-          variant="filled"
-          size="small"
-          color="primary"
-          leadingIcon={mdiContentSave}
-          disabled={!hasChanges || isSaving}
-          loading={isSaving}
-          onclick={saveWorkflow}
-        >
-          {$t('save')}
-        </Button>
+      <ControlBarContent class="flex justify-end">
+        <HeaderActionButton action={Done} variant="filled" />
       </ControlBarContent>
     </ActionBar>
   </AppShellBar>
 
   <Container size="medium" class="pt-8 pb-24" center>
     <VStack gap={4}>
-      {#if editMode === 'visual'}
-        <Card class="shadow-none" expandable>
-          <CardHeader>
-            <div class="flex place-items-start gap-3">
-              <Icon icon={mdiInformationOutline} size="20" class="mt-1" />
-              <div class="flex flex-col">
-                <CardTitle>
-                  {$t('workflow_info')}
-                </CardTitle>
-              </div>
+      <Card expandable>
+        <CardHeader>
+          <div class="flex place-items-start gap-3">
+            <Icon icon={mdiInformationOutline} size="20" class="mt-1" />
+            <div class="flex flex-col">
+              <CardTitle>
+                {$t('workflow_info')}
+              </CardTitle>
             </div>
-          </CardHeader>
+          </div>
+        </CardHeader>
 
-          <CardBody>
-            <VStack gap={4}>
-              <div class="relative w-full overflow-hidden rounded-xl border p-4" class:bg-primary-50={enabled}>
-                <Field label={enabled ? $t('enabled') : $t('disabled')} color={enabled ? 'primary' : 'secondary'}>
-                  <Switch bind:checked={enabled} />
-                </Field>
-              </div>
-
-              <Field label={$t('name')} required>
-                <Input
-                  placeholder={$t('workflow_name')}
-                  bind:value={() => name ?? '', (value) => (name = value || null)}
-                />
+        <CardBody>
+          <VStack gap={4}>
+            <div class="relative w-full overflow-hidden rounded-xl border p-4" class:bg-primary-50={enabled}>
+              <Field label={enabled ? $t('enabled') : $t('disabled')} color={enabled ? 'primary' : 'secondary'}>
+                <Switch bind:checked={enabled} />
               </Field>
-              <Field label={$t('description')} for="workflow-description">
-                <Textarea
-                  id="workflow-description"
-                  grow
-                  placeholder={$t('workflow_description')}
-                  bind:value={() => description ?? '', (value) => (description = value || null)}
-                />
-              </Field>
-            </VStack>
-          </CardBody>
-        </Card>
+            </div>
 
-        <div class="my-4 h-px w-[98%] bg-light-200"></div>
-
-        <Card class="shadow-none">
-          <CardHeader>
-            <div class="flex items-center gap-3">
-              <div class="flex size-10 shrink-0 items-center justify-center rounded-lg bg-success-50">
-                <Icon icon={mdiFlashOutline} size="20" class="text-success" />
-              </div>
-              <div class="flex min-w-0 flex-1 flex-col">
-                <CardTitle class="truncate">{getTriggerName($t, trigger)}</CardTitle>
-                <CardDescription class="truncate">{getTriggerDescription($t, trigger)}</CardDescription>
-              </div>
-
-              <IconButton
-                icon={mdiPencilOutline}
-                aria-label={$t('edit')}
-                variant="ghost"
-                shape="round"
-                color="secondary"
-                size="small"
-                onclick={onChangeTrigger}
+            <Field label={$t('name')} required>
+              <Input
+                placeholder={$t('workflow_name')}
+                bind:value={() => name ?? '', (value) => (name = value || null)}
               />
+            </Field>
+            <Field label={$t('description')} for="workflow-description">
+              <Textarea
+                id="workflow-description"
+                grow
+                placeholder={$t('workflow_description')}
+                bind:value={() => description ?? '', (value) => (description = value || null)}
+              />
+            </Field>
+          </VStack>
+        </CardBody>
+      </Card>
+
+      <div class="my-4 h-px w-[98%] bg-light-200"></div>
+
+      <Card>
+        <CardHeader class="bg-success-50">
+          <div class="flex items-start gap-3">
+            <Icon icon={mdiFlashOutline} size="20" class="mt-1 text-success" />
+            <div class="flex grow flex-col">
+              <CardTitle class="text-left text-success">{$t('trigger')}</CardTitle>
+              <CardDescription>{$t('trigger_description')}</CardDescription>
             </div>
-          </CardHeader>
-        </Card>
+            <div class="flex items-center justify-end">
+              <Button leadingIcon={mdiPencilOutline} size="small" color="secondary" onclick={onChangeTrigger}>
+                {$t('edit')}
+              </Button>
+            </div>
+          </div>
+        </CardHeader>
 
-        {#each steps as step, index (index)}
-          <WorkflowStepCard
-            {step}
-            {index}
-            isDragging={draggedIndex === index}
-            isDragHandleHovered={dragHandleHoverIndex === index}
-            isDropTarget={dropTargetIndex === index && draggedIndex !== null && draggedIndex !== index}
-            onEdit={handleEditStep}
-            onDelete={handleDeleteStep}
-            onInsertBefore={handleInsertStep}
-            onDragStart={handleDragStart}
-            onDragEnd={handleDragEnd}
-            onDragOver={handleDragOver}
-            onDragLeave={handleDragLeave}
-            onDrop={handleDrop}
-            onDragHandleEnter={(i) => (dragHandleHoverIndex = i)}
-            onDragHandleLeave={() => (dragHandleHoverIndex = null)}
-          />
-        {/each}
+        <CardBody>
+          <div class="flex flex-col items-start">
+            <Text>{getTriggerName($t, trigger)}</Text>
+            <Text size="small" color="muted">{getTriggerDescription($t, trigger)}</Text>
+          </div>
+        </CardBody>
+      </Card>
 
-        <Button
-          size="small"
-          fullWidth
-          variant="ghost"
-          leadingIcon={mdiPlus}
-          class="border border-dashed"
-          onclick={handleAddStep}
-        >
-          {$t('add_step')}
-        </Button>
-      {:else}
-        <WorkflowJsonEditor jsonContent={workflowJsonContent} onContentChange={handleJsonContentChange} />
-      {/if}
+      <Card>
+        <CardHeader class="bg-primary-50">
+          <div class="flex items-start gap-3">
+            <Icon icon={mdiFormatListBulletedSquare} size="20" class="mt-1 text-primary" />
+            <CardTitle class="text-left text-primary">{$t('steps')}</CardTitle>
+          </div>
+        </CardHeader>
+
+        <CardBody>
+          {#if steps.length === 0}
+            <Button leadingIcon={mdiPlus} onclick={handleAddStep}>{$t('add_step')}</Button>
+          {:else}
+            <Stack gap={2}>
+              {#each steps as step, index (index)}
+                {@const method = pluginManager.getMethod(step.method)}
+                {#if index > 0}
+                  <hr />
+                {/if}
+                <div
+                  // {@attach dragAndDrop({
+                  //   index,
+                  //   onDragStart: handleFilterDragStart,
+                  //   onDragEnter: handleFilterDragEnter,
+                  //   onDrop: handleFilterDrop,
+                  //   onDragEnd: handleFilterDragEnd,
+                  //   isDragging: draggedIndex === index,
+                  //   isDragOver: dragOverIndex === index,
+                  // })}
+                  class="flex cursor-move justify-between gap-2 rounded-2xl border-2 border-dashed bg-light-50 p-4 transition-all hover:border-light-300"
+                >
+                  <div class="flex flex-col gap-1">
+                    <Text>{pluginManager.getMethodLabel(step.method)}</Text>
+                    {#if method?.description}
+                      <Text color="muted" size="small">{method.description}</Text>
+                    {/if}
+                  </div>
+                  <div class="flex gap-1">
+                    <IconButton
+                      icon={mdiPencilOutline}
+                      aria-label={$t('edit')}
+                      variant="ghost"
+                      shape="round"
+                      color="secondary"
+                      onclick={() => handleEditStep(step)}
+                    />
+                    <IconButton
+                      icon={mdiTrashCanOutline}
+                      aria-label={$t('delete')}
+                      variant="ghost"
+                      shape="round"
+                      color="danger"
+                      onclick={() => handleDeleteStep(index)}
+                    />
+                  </div>
+                </div>
+              {/each}
+
+              <Button size="small" fullWidth variant="ghost" leadingIcon={mdiPlus} onclick={handleAddStep}>
+                {$t('add_step')}
+              </Button>
+            </Stack>
+          {/if}
+        </CardBody>
+      </Card>
     </VStack>
   </Container>
-
-  <WorkflowStepDragImage
-    bind:ref={dragImageElement}
-    description={dragImage.description}
-    isFilter={dragImage.isFilter}
-    label={dragImage.label}
-    stepNumber={dragImage.stepNumber}
-  />
-  <WorkflowSummary workflow={workflowSummary} />
 </AppShell>

web/src/routes/(user)/workflows/[workflowId]/+page.ts

@@ -1,4 +1,4 @@
-import { getWorkflow } from '@immich/sdk';
+import { searchWorkflows } from '@immich/sdk';
 import { redirect } from '@sveltejs/kit';
 import { pluginManager } from '$lib/managers/plugin-manager.svelte';
 import { Route } from '$lib/route';
@@ -8,7 +8,7 @@ import type { PageLoad } from './$types';
 
 export const load = (async ({ url, params, depends }) => {
   await authenticate(url);
-  const [workflow] = await Promise.all([getWorkflow({ id: params.workflowId }), pluginManager.ready()]);
+  const [[workflow]] = await Promise.all([searchWorkflows({ id: params.workflowId }), pluginManager.ready()]);
   const $t = await getFormatter();
 
   if (!workflow) {

web/src/routes/(user)/workflows/[workflowId]/WorkflowJsonEditor.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
-  import { WorkflowTrigger, type WorkflowStepDto, type WorkflowUpdateDto } from '@immich/sdk';
+  import type { WorkflowResponseDto } from '@immich/sdk';
   import {
+    Button,
     Card,
     CardBody,
     CardDescription,
@@ -12,91 +13,40 @@
     VStack,
   } from '@immich/ui';
   import { mdiCodeJson } from '@mdi/js';
-  import { isEqual } from 'lodash-es';
-  import { untrack } from 'svelte';
   import { JSONEditor, Mode, type Content, type OnChangeStatus } from 'svelte-jsoneditor';
-  import { t } from 'svelte-i18n';
-
-  type WorkflowJsonContent = Required<
-    Pick<WorkflowUpdateDto, 'description' | 'enabled' | 'name' | 'steps' | 'trigger'>
-  >;
 
   type Props = {
-    jsonContent: WorkflowJsonContent;
-    onContentChange: (content: WorkflowJsonContent) => void;
+    jsonContent: WorkflowResponseDto;
+    onApply: () => void;
+    onContentChange: (content: WorkflowResponseDto) => void;
   };
 
-  let { jsonContent, onContentChange }: Props = $props();
+  let { jsonContent, onApply, onContentChange }: Props = $props();
 
-  let content: Content = $state({ json: jsonContent });
+  let content: Content = $derived({ json: jsonContent });
+  let canApply = $state(false);
   let editorClass = $derived(themeManager.value === Theme.Dark ? 'jse-theme-dark' : '');
 
-  const isWorkflowStep = (value: unknown): value is WorkflowStepDto => {
-    if (!value || typeof value !== 'object') {
-      return false;
-    }
-
-    const step = value as Partial<WorkflowStepDto>;
-    return (
-      typeof step.method === 'string' &&
-      (step.config === null || (typeof step.config === 'object' && !Array.isArray(step.config))) &&
-      (step.enabled === undefined || typeof step.enabled === 'boolean')
-    );
-  };
-
-  const isWorkflowJsonContent = (value: unknown): value is WorkflowJsonContent => {
-    if (!value || typeof value !== 'object') {
-      return false;
-    }
-
-    const workflow = value as Partial<WorkflowJsonContent>;
-    return (
-      typeof workflow.enabled === 'boolean' &&
-      (workflow.name === null || typeof workflow.name === 'string') &&
-      (workflow.description === null || typeof workflow.description === 'string') &&
-      Object.values(WorkflowTrigger).includes(workflow.trigger as WorkflowTrigger) &&
-      Array.isArray(workflow.steps) &&
-      workflow.steps.every(isWorkflowStep)
-    );
-  };
-
-  const parseContent = (updated: Content) => {
-    if ('json' in updated) {
-      return updated.json;
-    }
-
-    return JSON.parse(updated.text);
-  };
-
-  $effect(() => {
-    const nextContent = jsonContent;
-    let isSynced = false;
-
-    try {
-      isSynced = isEqual(
-        untrack(() => parseContent(content)),
-        nextContent,
-      );
-    } catch {
-      // The editor can be temporarily invalid while typing in text mode.
-    }
-
-    if (!isSynced) {
-      content = { json: nextContent };
-    }
-  });
-
   const handleChange = (updated: Content, _: Content, status: OnChangeStatus) => {
     if (status.contentErrors) {
       return;
     }
 
-    const parsed = parseContent(updated);
-    if (!isWorkflowJsonContent(parsed)) {
-      return;
-    }
+    canApply = true;
 
-    onContentChange(parsed);
+    if ('text' in updated && updated.text !== undefined) {
+      try {
+        const parsed = JSON.parse(updated.text);
+        onContentChange(parsed);
+      } catch (error_) {
+        console.error('Invalid JSON in text mode:', error_);
+      }
+    }
+  };
+
+  const handleApply = () => {
+    onApply();
+    canApply = false;
   };
 </script>
 
@@ -107,16 +57,17 @@
         <div class="flex items-start gap-3">
           <Icon icon={mdiCodeJson} size="20" class="mt-1" />
           <div class="flex flex-col">
-            <CardTitle>{$t('workflow_json')}</CardTitle>
-            <CardDescription>{$t('workflow_json_help')}</CardDescription>
+            <CardTitle>Workflow JSON</CardTitle>
+            <CardDescription>Edit the workflow configuration directly in JSON format</CardDescription>
           </div>
         </div>
+        <Button size="small" color="primary" onclick={handleApply} disabled={!canApply}>Apply Changes</Button>
       </div>
     </CardHeader>
     <CardBody>
       <VStack gap={2}>
         <div class="h-[600px] w-full overflow-hidden rounded-lg border {editorClass}">
-          <JSONEditor bind:content onChange={handleChange} mainMenuBar={false} mode={Mode.text} />
+          <JSONEditor {content} onChange={handleChange} mainMenuBar={false} mode={Mode.text} />
         </div>
       </VStack>
     </CardBody>

web/src/routes/(user)/workflows/[workflowId]/WorkflowStepCard.svelte

@@ -1,195 +0,0 @@
-<script lang="ts">
-  import { pluginManager } from '$lib/managers/plugin-manager.svelte';
-  import type { WorkflowStepDto } from '@immich/sdk';
-  import { Badge, Card, CardBody, CardDescription, CardHeader, CardTitle, Icon, IconButton } from '@immich/ui';
-  import {
-    mdiAutoFix,
-    mdiDragVertical,
-    mdiFilterVariant,
-    mdiPencilOutline,
-    mdiPlus,
-    mdiTrashCanOutline,
-  } from '@mdi/js';
-  import { t } from 'svelte-i18n';
-
-  type Props = {
-    step: WorkflowStepDto;
-    index: number;
-    isDragging: boolean;
-    isDragHandleHovered: boolean;
-    isDropTarget: boolean;
-    onEdit: (index: number) => void;
-    onDelete: (index: number) => void;
-    onInsertBefore: (index: number) => void;
-    onDragStart: (index: number, event: DragEvent) => void;
-    onDragEnd: () => void;
-    onDragOver: (index: number, event: DragEvent) => void;
-    onDragLeave: (index: number) => void;
-    onDrop: (index: number, event: DragEvent) => void;
-    onDragHandleEnter: (index: number) => void;
-    onDragHandleLeave: () => void;
-  };
-
-  let {
-    step,
-    index,
-    isDragging,
-    isDragHandleHovered,
-    isDropTarget,
-    onEdit,
-    onDelete,
-    onInsertBefore,
-    onDragStart,
-    onDragEnd,
-    onDragOver,
-    onDragLeave,
-    onDrop,
-    onDragHandleEnter,
-    onDragHandleLeave,
-  }: Props = $props();
-
-  const method = $derived(pluginManager.getMethod(step.method));
-  const isFilter = $derived(method?.uiHints?.includes('filter') ?? false);
-  const configEntries = $derived(
-    Object.entries(step.config ?? {}).filter(([, value]) => value !== null && value !== undefined && value !== ''),
-  );
-
-  const truncate = (input: string, max = 24) => (input.length > max ? input.slice(0, max - 1) + '…' : input);
-
-  const formatConfigValue = (value: unknown): string => {
-    if (value === null || value === undefined) {
-      return '—';
-    }
-    if (typeof value === 'boolean') {
-      return value ? 'on' : 'off';
-    }
-    if (typeof value === 'number') {
-      return String(value);
-    }
-    if (typeof value === 'string') {
-      return `"${truncate(value)}"`;
-    }
-    if (Array.isArray(value)) {
-      if (value.length === 0) {
-        return $t('none');
-      }
-      const items = value.map((v) => (v !== null && typeof v === 'object' ? '{…}' : String(v)));
-      const joined = items.join(' · ');
-      if (joined.length <= 28) {
-        return `"${joined}"`;
-      }
-      return $t('items_count', { values: { count: value.length } });
-    }
-    return '{…}';
-  };
-</script>
-
-<div class="group/step-row flex w-full flex-col">
-  <div class="-mt-4 ml-18 flex w-full items-center gap-4">
-    <div class="relative flex w-1 shrink-0 justify-start">
-      <div class="h-10 w-0.5 bg-light-200"></div>
-      <button
-        type="button"
-        class="absolute top-1/2 left-1/2 z-10 -translate-1/2 cursor-pointer rounded-full border border-dashed border-primary-200 bg-light p-0.5 text-primary opacity-0 transition-opacity group-hover/step-row:opacity-100 hover:bg-primary-50"
-        aria-label={$t('add_step')}
-        title={$t('add_step')}
-        onclick={() => onInsertBefore(index)}
-      >
-        <Icon icon={mdiPlus} size="14" />
-      </button>
-    </div>
-  </div>
-
-  <div
-    class="w-full transition-all"
-    class:opacity-40={isDragging}
-    class:scale-[0.99]={isDragging}
-    ondragover={(event) => onDragOver(index, event)}
-    ondragleave={() => onDragLeave(index)}
-    ondrop={(event) => onDrop(index, event)}
-    role="listitem"
-  >
-    <Card
-      class="shadow-none transition-colors {isDropTarget
-        ? 'border-primary ring-2 ring-primary-200'
-        : isDragHandleHovered
-          ? 'border-dashed border-primary'
-          : ''}"
-    >
-      <CardHeader>
-        <div class="flex items-center gap-2">
-          <!-- svelte-ignore a11y_no_static_element_interactions -->
-          <div
-            class="flex shrink-0 cursor-grab items-center justify-center rounded-md border border-transparent p-1 text-light-400 select-none hover:border-primary-200 hover:bg-primary-50 hover:text-primary active:cursor-grabbing"
-            aria-label={$t('drag_to_reorder')}
-            draggable="true"
-            onmouseenter={() => onDragHandleEnter(index)}
-            onmouseleave={onDragHandleLeave}
-            ondragstart={(event) => onDragStart(index, event)}
-            ondragend={onDragEnd}
-            title={$t('drag_to_reorder')}
-          >
-            <Icon icon={mdiDragVertical} size="20" />
-          </div>
-          <div
-            class="flex size-10 shrink-0 items-center justify-center rounded-lg"
-            class:bg-primary-50={isFilter}
-            class:bg-warning-50={!isFilter}
-          >
-            <Icon
-              icon={isFilter ? mdiFilterVariant : mdiAutoFix}
-              size="20"
-              class={isFilter ? 'text-primary' : 'text-warning'}
-            />
-          </div>
-          <div class="flex min-w-0 flex-1 flex-col">
-            <CardTitle class="truncate">
-              <span class="mr-1 font-bold text-light-500">{index + 1}</span>
-              {pluginManager.getMethodLabel(step.method)}
-            </CardTitle>
-            {#if method?.description}
-              <CardDescription class="truncate">{method.description}</CardDescription>
-            {/if}
-          </div>
-          <div class="flex shrink-0 items-center gap-1">
-            <IconButton
-              icon={mdiPencilOutline}
-              aria-label={$t('edit')}
-              variant="ghost"
-              shape="round"
-              color="secondary"
-              size="small"
-              onclick={() => onEdit(index)}
-            />
-            <IconButton
-              icon={mdiTrashCanOutline}
-              aria-label={$t('delete')}
-              variant="ghost"
-              shape="round"
-              color="danger"
-              size="small"
-              onclick={() => onDelete(index)}
-            />
-          </div>
-        </div>
-      </CardHeader>
-
-      {#if configEntries.length > 0}
-        <CardBody class="py-3">
-          <div class="flex flex-wrap items-center gap-1.5">
-            {#each configEntries as [key, value] (key)}
-              <Badge
-                color={isFilter ? 'info' : 'warning'}
-                shape="round"
-                size="small"
-                class="border font-mono {isFilter ? 'border-primary-200' : 'border-warning-200'}"
-              >
-                <span class="opacity-60">{key}</span>{formatConfigValue(value)}
-              </Badge>
-            {/each}
-          </div>
-        </CardBody>
-      {/if}
-    </Card>
-  </div>
-</div>

web/src/routes/(user)/workflows/[workflowId]/WorkflowStepDragImage.svelte

@@ -1,43 +0,0 @@
-<script lang="ts">
-  import { Icon } from '@immich/ui';
-  import { mdiAutoFix, mdiFilterVariant } from '@mdi/js';
-
-  type Props = {
-    ref?: HTMLElement | null;
-    description?: string;
-    isFilter: boolean;
-    label: string;
-    stepNumber: number;
-  };
-
-  let { ref = $bindable(null), description, isFilter, label, stepNumber }: Props = $props();
-</script>
-
-<div
-  bind:this={ref}
-  aria-hidden="true"
-  class="pointer-events-none fixed top-[-1000px] left-0 flex w-80 items-center gap-2.5 rounded-lg border border-light-200 bg-light px-3 py-2.5 text-sm/5 text-dark shadow-2xl"
->
-  <div
-    class="flex size-8 shrink-0 items-center justify-center rounded-lg"
-    class:bg-primary-50={isFilter}
-    class:bg-warning-50={!isFilter}
-  >
-    <Icon
-      icon={isFilter ? mdiFilterVariant : mdiAutoFix}
-      size="18"
-      class={isFilter ? 'text-primary' : 'text-warning'}
-    />
-  </div>
-
-  <div class="min-w-0 flex-1">
-    <div class="flex min-w-0 items-center gap-2">
-      <span class="shrink-0 font-bold text-light-500">#{stepNumber}</span>
-      <span class="truncate font-bold">{label}</span>
-    </div>
-
-    {#if description}
-      <div class="mt-0.5 truncate text-xs/4 text-light-500">{description}</div>
-    {/if}
-  </div>
-</div>

web/src/routes/(user)/workflows/[workflowId]/WorkflowSummary.svelte

@@ -1,176 +1,137 @@
 <script lang="ts">
-  import { pluginManager } from '$lib/managers/plugin-manager.svelte';
   import { getTriggerName } from '$lib/utils/workflow';
-  import type { WorkflowStepDto, WorkflowTrigger } from '@immich/sdk';
+  import type { WorkflowResponseDto } from '@immich/sdk';
   import { Icon, IconButton, Text } from '@immich/ui';
-  import { mdiCheck, mdiClose, mdiContentCopy, mdiViewDashboardOutline } from '@mdi/js';
+  import { mdiClose, mdiFlashOutline, mdiPlayCircleOutline, mdiViewDashboardOutline } from '@mdi/js';
   import { t } from 'svelte-i18n';
-  import { fly } from 'svelte/transition';
-
-  type WorkflowSummaryData = {
-    name: string | null;
-    description: string | null;
-    trigger: WorkflowTrigger;
-    steps: WorkflowStepDto[];
-  };
 
   type Props = {
-    workflow: WorkflowSummaryData;
+    workflow: WorkflowResponseDto;
   };
 
   let { workflow }: Props = $props();
+  const { trigger, steps } = $derived(workflow);
 
   let isOpen = $state(false);
-  let justCopied = $state(false);
-  let copyTimer: ReturnType<typeof setTimeout> | undefined;
-  let panelElement = $state<HTMLElement | undefined>(undefined);
+  let position = $state({ x: 0, y: 0 });
+  let isDragging = $state(false);
+  let dragOffset = $state({ x: 0, y: 0 });
+  let containerEl: HTMLDivElement | undefined = $state();
 
-  $effect(() => {
-    if (!isOpen) {
+  const handleMouseDown = (e: MouseEvent) => {
+    if (!containerEl) {
       return;
     }
-
-    const handleKeydown = (event: KeyboardEvent) => {
-      if (event.key === 'Escape') {
-        event.stopPropagation();
-        event.preventDefault();
-        isOpen = false;
-      }
+    isDragging = true;
+    const rect = containerEl.getBoundingClientRect();
+    dragOffset = {
+      x: e.clientX - rect.left,
+      y: e.clientY - rect.top,
     };
-
-    const handlePointerDown = (event: PointerEvent) => {
-      if (panelElement && event.target instanceof Node && !panelElement.contains(event.target)) {
-        isOpen = false;
-      }
-    };
-
-    document.addEventListener('keydown', handleKeydown, { capture: true });
-    document.addEventListener('pointerdown', handlePointerDown);
-
-    return () => {
-      document.removeEventListener('keydown', handleKeydown, { capture: true });
-      document.removeEventListener('pointerdown', handlePointerDown);
-    };
-  });
-
-  const formatConfigValue = (value: unknown): string => {
-    if (value === null || value === undefined) {
-      return '—';
-    }
-    if (typeof value === 'boolean') {
-      return value ? 'true' : 'false';
-    }
-    if (typeof value === 'number') {
-      return String(value);
-    }
-    if (typeof value === 'string') {
-      return `"${value}"`;
-    }
-    if (Array.isArray(value)) {
-      if (value.length === 0) {
-        return '[]';
-      }
-      return '[' + value.map((v) => (v !== null && typeof v === 'object' ? '{…}' : String(v))).join(', ') + ']';
-    }
-    if (typeof value === 'object') {
-      return JSON.stringify(value);
-    }
-    return String(value);
+    document.addEventListener('mousemove', handleMouseMove);
+    document.addEventListener('mouseup', handleMouseUp);
   };
 
-  const getConfigEntries = (config: WorkflowStepDto['config']) =>
-    Object.entries(config ?? {}).filter(([, value]) => value !== null && value !== undefined && value !== '');
-
-  const asciiSummary = $derived.by(() => {
-    const lines: string[] = [];
-    const title = workflow.name ?? $t('no_name');
-    lines.push(`${title}`);
-    if (workflow.description) {
-      lines.push(workflow.description);
-    }
-
-    lines.push('', '  WHEN', `    ⚡ ${getTriggerName($t, workflow.trigger)}`, '', '  THEN');
-
-    if (workflow.steps.length === 0) {
-      lines.push(`    ${$t('no_steps')}`);
-      return lines.join('\n');
-    }
-
-    for (const [i, step] of workflow.steps.entries()) {
-      const method = pluginManager.getMethod(step.method);
-      const isFilter = method?.uiHints?.includes('filter') ?? false;
-      const type = isFilter ? $t('filter') : $t('action');
-      const label = pluginManager.getMethodLabel(step.method);
-      lines.push(`    [${i + 1}] ${type.toUpperCase()} · ${label}`);
-      for (const [key, value] of getConfigEntries(step.config)) {
-        lines.push(`          ${key} = ${formatConfigValue(value)}`);
-      }
-      if (i < workflow.steps.length - 1) {
-        lines.push('');
-      }
-    }
-
-    return lines.join('\n');
-  });
-
-  const handleCopy = async () => {
-    try {
-      await navigator.clipboard.writeText(asciiSummary);
-      justCopied = true;
-      if (copyTimer) {
-        clearTimeout(copyTimer);
-      }
-      copyTimer = setTimeout(() => (justCopied = false), 1500);
-    } catch {
-      // ignore — clipboard may be unavailable
+  const handleMouseMove = (e: MouseEvent) => {
+    if (!isDragging) {
+      return;
     }
+    position = {
+      x: e.clientX - dragOffset.x,
+      y: e.clientY - dragOffset.y,
+    };
   };
+
+  const handleMouseUp = () => {
+    isDragging = false;
+    document.removeEventListener('mousemove', handleMouseMove);
+    document.removeEventListener('mouseup', handleMouseUp);
+  };
+
+  $effect(() => {
+    // Initialize position to bottom-right on mount
+    if (globalThis.window && position.x === 0 && position.y === 0) {
+      position = {
+        x: globalThis.innerWidth - 280,
+        y: globalThis.innerHeight - 400,
+      };
+    }
+  });
 </script>
 
 {#if isOpen}
-  <aside
-    bind:this={panelElement}
-    class="fixed inset-y-20 right-4 bottom-4 hidden max-w-lg flex-col overflow-hidden rounded-2xl border border-light-200 bg-light shadow-2xl sm:flex"
-    transition:fly={{ x: 400, duration: 250 }}
-    aria-label={$t('workflow_summary')}
+  <!-- svelte-ignore a11y_no_static_element_interactions -->
+  <div
+    bind:this={containerEl}
+    class="fixed hidden w-64 select-none hover:cursor-grab sm:block"
+    style="left: {position.x}px; top: {position.y}px;"
+    class:cursor-grabbing={isDragging}
+    onmousedown={handleMouseDown}
   >
-    <!-- Header -->
-    <div class="flex shrink-0 items-center justify-between border-b border-light-200 px-4 py-2.5">
-      <Text size="small" fontWeight="semi-bold" color="muted">{$t('workflow_summary')}</Text>
-      <div class="flex items-center gap-1">
-        <IconButton
-          icon={justCopied ? mdiCheck : mdiContentCopy}
-          size="small"
-          variant="ghost"
-          color={justCopied ? 'success' : 'secondary'}
-          title={$t('copy_to_clipboard')}
-          aria-label={$t('copy_to_clipboard')}
-          onclick={handleCopy}
-        />
-        <IconButton
-          icon={mdiClose}
-          size="small"
-          variant="ghost"
-          color="secondary"
-          title="Close summary"
-          aria-label="Close summary"
-          onclick={() => (isOpen = false)}
-        />
+    <div
+      class="rounded-xl border-2 border-transparent bg-light-50 p-4 shadow-sm transition-all hover:border-dashed hover:border-light-300 hover:shadow-xl"
+    >
+      <div class="mb-4 flex cursor-grab items-center justify-between select-none">
+        <Text size="small" fontWeight="semi-bold">{$t('workflow_summary')}</Text>
+        <div class="flex items-center gap-1">
+          <IconButton
+            icon={mdiClose}
+            size="small"
+            variant="ghost"
+            color="secondary"
+            title="Close summary"
+            aria-label="Close summary"
+            onclick={(e: MouseEvent) => {
+              e.stopPropagation();
+              isOpen = false;
+            }}
+          />
+        </div>
+      </div>
+
+      <div class="space-y-2">
+        <!-- Trigger -->
+        <div class="rounded-lg border bg-light-100 p-3">
+          <div class="mb-1 flex items-center gap-2">
+            <Icon icon={mdiFlashOutline} size="18" class="text-primary" />
+            <Text size="tiny" fontWeight="semi-bold">{$t('trigger')}</Text>
+          </div>
+          <p class="truncate pl-5 text-sm">{getTriggerName($t, trigger)}</p>
+        </div>
+
+        <!-- Connector -->
+        <div class="flex justify-center">
+          <div class="h-3 w-0.5 bg-light-400"></div>
+        </div>
+
+        <!-- Steps -->
+        {#if steps.length > 0}
+          <div class="rounded-lg border bg-light-100 p-3">
+            <div class="mb-2 flex items-center gap-2">
+              <Icon icon={mdiPlayCircleOutline} size="18" class="text-success" />
+              <Text size="tiny" fontWeight="semi-bold">{$t('actions')}</Text>
+            </div>
+            <div class="space-y-1 pl-5">
+              {#each steps as step, index (index)}
+                <div class="flex items-center gap-2">
+                  <span
+                    class="flex size-4 shrink-0 items-center justify-center rounded-full bg-light-200 text-[10px] font-medium"
+                    >{index + 1}</span
+                  >
+                  <p class="truncate text-sm">{step.method}</p>
+                </div>
+              {/each}
+            </div>
+          </div>
+        {/if}
       </div>
     </div>
-
-    <!-- ASCII body — what you see is what you copy -->
-    <div class="flex-1 overflow-auto p-4">
-      <pre
-        class="m-0 overflow-auto rounded-lg border border-light-200 bg-light-100 px-4 py-3 font-mono text-xs/relaxed whitespace-pre">{asciiSummary}</pre>
-    </div>
-  </aside>
+  </div>
 {:else}
   <button
     type="button"
     class="fixed right-6 bottom-6 hidden size-14 items-center justify-center rounded-full bg-primary text-light shadow-lg transition-colors hover:bg-primary/90 sm:flex"
     title={$t('workflow_summary')}
-    aria-label={$t('workflow_summary')}
     onclick={() => (isOpen = true)}
   >
     <Icon icon={mdiViewDashboardOutline} size="24" />