fix: shared-link-mapper

refactor: form modals (#24790 )
feat: disable admin setup (#24628 )
2025-12-22 15:17:05 -08:00 · 2025-12-22 14:57:10 -05:00 · 2025-12-22 14:15:23 -05:00 · 2025-12-22 14:15:08 -05:00 · 2025-12-22 13:54:14 -05:00 · 2025-12-22 18:44:53 +00:00
141 changed files with 6226 additions and 1779 deletions
--- a/docs/docs/FAQ.mdx
+++ b/docs/docs/FAQ.mdx
@@ -22,7 +22,7 @@ For organizations seeking to resell Immich, we have established the following gu

 - Do not misrepresent your reseller site or services as being officially affiliated with or endorsed by Immich or our development team.

- For small resellers who wish to contribute financially to Immich's development, we recommend directing your customers to purchase licenses directly from us rather than attempting to broker revenue-sharing arrangements. We ask that you refrain from misrepresenting reseller activities as directly supporting our development work.
+- For small resellers who wish to contribute financially to Immich's development, we recommend directing your customers to purchase product keys directly from us rather than attempting to broker revenue-sharing arrangements. We ask that you refrain from misrepresenting reseller activities as directly supporting our development work.

 When in doubt or if you have an edge case scenario, we encourage you to contact us directly via email to discuss the use of our trademark. We can provide clear guidance on what is acceptable and what is not. You can reach out at: questions@immich.app

--- a/docs/docs/install/environment-variables.md
+++ b/docs/docs/install/environment-variables.md
@@ -43,6 +43,7 @@ These environment variables are used by the `docker-compose.yml` file and do **N
 | `IMMICH_PROCESS_INVALID_IMAGES`     | When `true`, generate thumbnails for invalid images                                       |                              | server                   | microservices      |
 | `IMMICH_TRUSTED_PROXIES`            | List of comma-separated IPs set as trusted proxies                                        |                              | server                   | api                |
 | `IMMICH_IGNORE_MOUNT_CHECK_ERRORS`  | See [System Integrity](/administration/system-integrity)                                  |                              | server                   | api, microservices |
+| `IMMICH_ALLOW_SETUP`                | When `false` disables the `/auth/admin-sign-up` endpoint                                  |            `true`            | server                   | api                |

 \*1: `TZ` should be set to a `TZ identifier` from [this list][tz-list]. For example, `TZ="Etc/UTC"`.
 `TZ` is used by `exiftool` as a fallback in case the timezone cannot be determined from the image metadata. It is also used for logfile timestamps and cron job execution.
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -5,6 +5,7 @@
  "acknowledge": "Acknowledge",
  "action": "Action",
  "action_common_update": "Update",
+  "action_description": "A set of action to perform on the filtered assets",
  "actions": "Actions",
  "active": "Active",
  "active_count": "Active: {count}",
@@ -15,9 +16,13 @@
  "add_a_location": "Add a location",
  "add_a_name": "Add a name",
  "add_a_title": "Add a title",
+  "add_action": "Add action",
+  "add_action_description": "Click to add an action to perform",
  "add_birthday": "Add a birthday",
  "add_endpoint": "Add endpoint",
  "add_exclusion_pattern": "Add exclusion pattern",
+  "add_filter": "Add filter",
+  "add_filter_description": "Click to add a filter condition",
  "add_location": "Add location",
  "add_more_users": "Add more users",
  "add_partner": "Add partner",
@@ -36,6 +41,7 @@
  "add_to_shared_album": "Add to shared album",
  "add_upload_to_stack": "Add upload to stack",
  "add_url": "Add URL",
+  "add_workflow_step": "Add workflow step",
  "added_to_archive": "Added to archive",
  "added_to_favorites": "Added to favorites",
  "added_to_favorites_count": "Added {count, number} to favorites",
@@ -467,6 +473,7 @@
  "album_remove_user": "Remove user?",
  "album_remove_user_confirmation": "Are you sure you want to remove {user}?",
  "album_search_not_found": "No albums found matching your search",
+  "album_selected": "Album selected",
  "album_share_no_users": "Looks like you have shared this album with all users or you don't have any user to share with.",
  "album_summary": "Album summary",
  "album_updated": "Album updated",
@@ -488,6 +495,7 @@
  "albums_default_sort_order_description": "Initial asset sort order when creating new albums.",
  "albums_feature_description": "Collections of assets that can be shared with other users.",
  "albums_on_device_count": "Albums on device ({count})",
+  "albums_selected": "{count, plural, one {# album selected} other {# albums selected}}",
  "all": "All",
  "all_albums": "All albums",
  "all_people": "All people",
@@ -524,10 +532,12 @@
  "archived_count": "{count, plural, other {Archived #}}",
  "are_these_the_same_person": "Are these the same person?",
  "are_you_sure_to_do_this": "Are you sure you want to do this?",
+  "array_field_not_fully_supported": "Array fields require manual JSON editing",
  "asset_action_delete_err_read_only": "Cannot delete read only asset(s), skipping",
  "asset_action_share_err_offline": "Cannot fetch offline asset(s), skipping",
  "asset_added_to_album": "Added to album",
  "asset_adding_to_album": "Adding to album…",
+  "asset_created": "Asset created",
  "asset_description_updated": "Asset description has been updated",
  "asset_filename_is_offline": "Asset {filename} is offline",
  "asset_has_unassigned_faces": "Asset has unassigned faces",
@@ -711,6 +721,8 @@
  "change_password_form_password_mismatch": "Passwords do not match",
  "change_password_form_reenter_new_password": "Re-enter New Password",
  "change_pin_code": "Change PIN code",
+  "change_trigger": "Change trigger",
+  "change_trigger_prompt": "Are you sure you want to change the trigger? This will remove all existing actions and filters.",
  "change_your_password": "Change your password",
  "changed_visibility_successfully": "Changed visibility successfully",
  "charging": "Charging",
@@ -787,6 +799,7 @@
  "create_album": "Create album",
  "create_album_page_untitled": "Untitled",
  "create_api_key": "Create API key",
+  "create_first_workflow": "Create first workflow",
  "create_library": "Create Library",
  "create_link": "Create link",
  "create_link_to_share": "Create link to share",
@@ -801,6 +814,7 @@
  "create_tag": "Create tag",
  "create_tag_description": "Create a new tag. For nested tags, please enter the full path of the tag including forward slashes.",
  "create_user": "Create user",
+  "create_workflow": "Create workflow",
  "created": "Created",
  "created_at": "Created",
  "creating_linked_albums": "Creating linked albums...",
@@ -867,6 +881,7 @@
  "deselect_all": "Deselect All",
  "details": "Details",
  "direction": "Direction",
+  "disable": "Disable",
  "disabled": "Disabled",
  "disallow_edits": "Disallow edits",
  "discord": "Discord",
@@ -929,11 +944,13 @@
  "edit_tag": "Edit tag",
  "edit_title": "Edit Title",
  "edit_user": "Edit user",
+  "edit_workflow": "Edit workflow",
  "editor": "Editor",
  "editor_close_without_save_prompt": "The changes will not be saved",
  "editor_close_without_save_title": "Close editor?",
  "editor_crop_tool_h2_aspect_ratios": "Aspect ratios",
  "editor_crop_tool_h2_rotation": "Rotation",
+  "editor_mode": "Editor mode",
  "email": "Email",
  "email_notifications": "Email notifications",
  "empty_folder": "This folder is empty",
@@ -1014,6 +1031,7 @@
    "unable_to_complete_oauth_login": "Unable to complete OAuth login",
    "unable_to_connect": "Unable to connect",
    "unable_to_copy_to_clipboard": "Cannot copy to clipboard, make sure you are accessing the page through https",
+    "unable_to_create": "Unable to create workflow",
    "unable_to_create_admin_account": "Unable to create admin account",
    "unable_to_create_api_key": "Unable to create a new API Key",
    "unable_to_create_library": "Unable to create library",
@@ -1024,6 +1042,7 @@
    "unable_to_delete_exclusion_pattern": "Unable to delete exclusion pattern",
    "unable_to_delete_shared_link": "Unable to delete shared link",
    "unable_to_delete_user": "Unable to delete user",
+    "unable_to_delete_workflow": "Unable to delete workflow",
    "unable_to_download_files": "Unable to download files",
    "unable_to_edit_exclusion_pattern": "Unable to edit exclusion pattern",
    "unable_to_empty_trash": "Unable to empty trash",
@@ -1074,6 +1093,7 @@
    "unable_to_update_settings": "Unable to update settings",
    "unable_to_update_timeline_display_status": "Unable to update timeline display status",
    "unable_to_update_user": "Unable to update user",
+    "unable_to_update_workflow": "Unable to update workflow",
    "unable_to_upload_file": "Unable to upload file"
  },
  "exclusion_pattern": "Exclusion pattern",
@@ -1126,8 +1146,10 @@
  "filename": "Filename",
  "filetype": "Filetype",
  "filter": "Filter",
+  "filter_description": "Conditions to filter the target assets",
  "filter_people": "Filter people",
  "filter_places": "Filter places",
+  "filters": "Filters",
  "find_them_fast": "Find them fast by name with search",
  "first": "First",
  "fix_incorrect_match": "Fix incorrect match",
@@ -1143,6 +1165,7 @@
  "general": "General",
  "geolocation_instruction_location": "Click on an asset with GPS coordinates to use its location, or select a location directly from the map",
  "get_help": "Get Help",
+  "get_people_error": "Error getting people",
  "get_wifiname_error": "Could not get Wi-Fi name. Make sure you have granted the necessary permissions and are connected to a Wi-Fi network",
  "getting_started": "Getting Started",
  "go_back": "Go back",
@@ -1175,6 +1198,7 @@
  "hide_named_person": "Hide person {name}",
  "hide_password": "Hide password",
  "hide_person": "Hide person",
+  "hide_schema": "Hide schema",
  "hide_text_recognition": "Hide text recognition",
  "hide_unnamed_people": "Hide unnamed people",
  "home_page_add_to_album_conflicts": "Added {added} assets to album {album}. {failed} assets are already in the album.",
@@ -1247,6 +1271,8 @@
  "ios_debug_info_processing_ran_at": "Processing ran {dateTime}",
  "items_count": "{count, plural, one {# item} other {# items}}",
  "jobs": "Jobs",
+  "json_editor": "JSON editor",
+  "json_error": "JSON error",
  "keep": "Keep",
  "keep_all": "Keep All",
  "keep_this_delete_others": "Keep this, delete others",
@@ -1416,11 +1442,13 @@
  "monthly_title_text_date_format": "MMMM y",
  "more": "More",
  "move": "Move",
+  "move_down": "Move down",
  "move_off_locked_folder": "Move out of locked folder",
  "move_to": "Move to",
  "move_to_lock_folder_action_prompt": "{count} added to the locked folder",
  "move_to_locked_folder": "Move to locked folder",
  "move_to_locked_folder_confirmation": "These photos and video will be removed from all albums, and only viewable from the locked folder",
+  "move_up": "Move up",
  "moved_to_archive": "Moved {count, plural, one {# asset} other {# assets}} to archive",
  "moved_to_library": "Moved {count, plural, one {# asset} other {# assets}} to library",
  "moved_to_trash": "Moved to trash",
@@ -1430,6 +1458,7 @@
  "my_albums": "My albums",
  "name": "Name",
  "name_or_nickname": "Name or nickname",
+  "name_required": "Name is required",
  "navigate": "Navigate",
  "navigate_to_time": "Navigate to Time",
  "network_requirement_photos_upload": "Use cellular data to backup photos",
@@ -1454,6 +1483,7 @@
  "next": "Next",
  "next_memory": "Next memory",
  "no": "No",
+  "no_actions_added": "No actions added yet",
  "no_albums_message": "Create an album to organize your photos and videos",
  "no_albums_with_name_yet": "It looks like you do not have any albums with this name yet.",
  "no_albums_yet": "It looks like you do not have any albums yet.",
@@ -1463,11 +1493,13 @@
  "no_cast_devices_found": "No cast devices found",
  "no_checksum_local": "No checksum available - cannot fetch local assets",
  "no_checksum_remote": "No checksum available - cannot fetch remote asset",
+  "no_configuration_needed": "No configuration needed",
  "no_devices": "No authorized devices",
  "no_duplicates_found": "No duplicates were found.",
  "no_exif_info_available": "No exif info available",
  "no_explore_results_message": "Upload more photos to explore your collection.",
  "no_favorites_message": "Add favorites to quickly find your best pictures and videos",
+  "no_filters_added": "No filters added yet",
  "no_libraries_message": "Create an external library to view your photos and videos",
  "no_local_assets_found": "No local assets found with this checksum",
  "no_location_set": "No location set",
@@ -1563,6 +1595,7 @@
  "people": "People",
  "people_edits_count": "Edited {count, plural, one {# person} other {# people}}",
  "people_feature_description": "Browsing photos and videos grouped by people",
+  "people_selected": "{count, plural, one {# person selected} other {# people selected}}",
  "people_sidebar_description": "Display a link to People in the sidebar",
  "permanent_deletion_warning": "Permanent deletion warning",
  "permanent_deletion_warning_setting_description": "Show a warning when permanently deleting assets",
@@ -1587,6 +1620,8 @@
  "person_age_years": "{years, plural, other {# years}} old",
  "person_birthdate": "Born on {date}",
  "person_hidden": "{name}{hidden, select, true { (hidden)} other {}}",
+  "person_recognized": "Person recognized",
+  "person_selected": "Person selected",
  "photo_shared_all_users": "Looks like you shared your photos with all users or you don't have any user to share with.",
  "photos": "Photos",
  "photos_and_videos": "Photos & Videos",
@@ -1836,17 +1871,22 @@
  "second": "Second",
  "see_all_people": "See all people",
  "select": "Select",
+  "select_album": "Select album",
  "select_album_cover": "Select album cover",
+  "select_albums": "Select albums",
  "select_all": "Select all",
  "select_all_duplicates": "Select all duplicates",
  "select_all_in": "Select all in {group}",
  "select_avatar_color": "Select avatar color",
+  "select_count": "{count, plural, one {Select #} other {Select #}}",
  "select_face": "Select face",
  "select_featured_photo": "Select featured photo",
  "select_from_computer": "Select from computer",
  "select_keep_all": "Select keep all",
  "select_library_owner": "Select library owner",
  "select_new_face": "Select new face",
+  "select_people": "Select people",
+  "select_person": "Select person",
  "select_person_to_tag": "Select a person to tag",
  "select_photos": "Select photos",
  "select_trash_all": "Select trash all",
@@ -1982,6 +2022,7 @@
  "show_password": "Show password",
  "show_person_options": "Show person options",
  "show_progress_bar": "Show Progress Bar",
+  "show_schema": "Show schema",
  "show_search_options": "Show search options",
  "show_shared_links": "Show shared links",
  "show_slideshow_transition": "Show slideshow transition",
@@ -2109,6 +2150,13 @@
  "trash_page_select_assets_btn": "Select assets",
  "trash_page_title": "Trash ({count})",
  "trashed_items_will_be_permanently_deleted_after": "Trashed items will be permanently deleted after {days, plural, one {# day} other {# days}}.",
+  "trigger": "Trigger",
+  "trigger_asset_uploaded": "Asset Uploaded",
+  "trigger_asset_uploaded_description": "Triggered when a new asset is uploaded",
+  "trigger_description": "An event that kick off the workflow",
+  "trigger_person_recognized": "Person Recognized",
+  "trigger_person_recognized_description": "Triggered when a person is detected",
+  "trigger_type": "Trigger type",
  "troubleshoot": "Troubleshoot",
  "type": "Type",
  "unable_to_change_pin_code": "Unable to change PIN code",
@@ -2139,7 +2187,9 @@
  "unstack": "Un-stack",
  "unstack_action_prompt": "{count} unstacked",
  "unstacked_assets_count": "Un-stacked {count, plural, one {# asset} other {# assets}}",
+  "unsupported_field_type": "Unsupported field type",
  "untagged": "Untagged",
+  "untitled_workflow": "Untitled workflow",
  "up_next": "Up next",
  "update_location_action_prompt": "Update the location of {count} selected assets with:",
  "updated_at": "Updated",
@@ -2185,6 +2235,7 @@
  "utilities": "Utilities",
  "validate": "Validate",
  "validate_endpoint_error": "Please enter a valid URL",
+  "validation_error": "Validation error",
  "variables": "Variables",
  "version": "Version",
  "version_announcement_closing": "Your friend, Alex",
@@ -2216,6 +2267,8 @@
  "viewer_stack_use_as_main_asset": "Use as Main Asset",
  "viewer_unstack": "Un-Stack",
  "visibility_changed": "Visibility changed for {count, plural, one {# person} other {# people}}",
+  "visual": "Visual",
+  "visual_builder": "Visual builder",
  "waiting": "Waiting",
  "waiting_count": "Waiting: {count}",
  "warning": "Warning",
@@ -2224,7 +2277,19 @@
  "welcome_to_immich": "Welcome to Immich",
  "width": "Width",
  "wifi_name": "Wi-Fi Name",
-  "workflow": "Workflow",
+  "workflow_delete_prompt": "Are you sure you want to delete this workflow?",
+  "workflow_deleted": "Workflow deleted",
+  "workflow_description": "Workflow description",
+  "workflow_info": "Workflow info",
+  "workflow_json": "Workflow JSON",
+  "workflow_json_help": "Edit the workflow configuration in JSON format. Changes will sync to the visual builder.",
+  "workflow_name": "Workflow name",
+  "workflow_navigation_prompt": "Are you sure you want to leave without saving your changes?",
+  "workflow_summary": "Workflow summary",
+  "workflow_update_success": "Workflow updated successfully",
+  "workflow_updated": "Workflow updated",
+  "workflows": "Workflows",
+  "workflows_help_text": "Workflows automate actions on your assets based on triggers and filters",
  "wrong_pin_code": "Wrong PIN code",
  "year": "Year",
  "years_ago": "{years, plural, one {# year} other {# years}} ago",
--- a/misc/release/pump-version.sh
+++ b/misc/release/pump-version.sh
@@ -90,6 +90,7 @@ fi
 sed -i "s/\"android\.injected\.version\.name\" => \"$CURRENT_SERVER\",/\"android\.injected\.version\.name\" => \"$NEXT_SERVER\",/" mobile/android/fastlane/Fastfile
 sed -i "s/\"android\.injected\.version\.code\" => $CURRENT_MOBILE,/\"android\.injected\.version\.code\" => $NEXT_MOBILE,/" mobile/android/fastlane/Fastfile
 sed -i "s/^version: $CURRENT_SERVER+$CURRENT_MOBILE$/version: $NEXT_SERVER+$NEXT_MOBILE/" mobile/pubspec.yaml
+perl -i -p0e "s/(<key>CFBundleShortVersionString<\/key>\s*<string>)$CURRENT_SERVER(<\/string>)/\${1}$NEXT_SERVER\${2}/s" mobile/ios/Runner/Info.plist

 ./misc/release/archive-version.js "$NEXT_SERVER"

--- a/mobile/ios/Runner/Info.plist
+++ b/mobile/ios/Runner/Info.plist
@@ -80,7 +80,7 @@
 	<key>CFBundlePackageType</key>
 	<string>APPL</string>
 	<key>CFBundleShortVersionString</key>
-	<string>2.2.1</string>
+	<string>2.4.1</string>
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleURLTypes</key>
--- a/mobile/openapi/README.md
+++ b/mobile/openapi/README.md
@@ -199,6 +199,7 @@ Class | Method | HTTP request | Description
 *PeopleApi* | [**updatePeople**](doc//PeopleApi.md#updatepeople) | **PUT** /people | Update people
 *PeopleApi* | [**updatePerson**](doc//PeopleApi.md#updateperson) | **PUT** /people/{id} | Update person
 *PluginsApi* | [**getPlugin**](doc//PluginsApi.md#getplugin) | **GET** /plugins/{id} | Retrieve a plugin
+*PluginsApi* | [**getPluginTriggers**](doc//PluginsApi.md#getplugintriggers) | **GET** /plugins/triggers | List all plugin triggers
 *PluginsApi* | [**getPlugins**](doc//PluginsApi.md#getplugins) | **GET** /plugins | List all plugins
 *QueuesApi* | [**emptyQueue**](doc//QueuesApi.md#emptyqueue) | **DELETE** /queues/{name}/jobs | Empty a queue
 *QueuesApi* | [**getQueue**](doc//QueuesApi.md#getqueue) | **GET** /queues/{name} | Retrieve a queue
@@ -465,9 +466,10 @@ Class | Method | HTTP request | Description
 - [PinCodeSetupDto](doc//PinCodeSetupDto.md)
 - [PlacesResponseDto](doc//PlacesResponseDto.md)
 - [PluginActionResponseDto](doc//PluginActionResponseDto.md)
- - [PluginContext](doc//PluginContext.md)
+ - [PluginContextType](doc//PluginContextType.md)
 - [PluginFilterResponseDto](doc//PluginFilterResponseDto.md)
 - [PluginResponseDto](doc//PluginResponseDto.md)
+ - [PluginTriggerResponseDto](doc//PluginTriggerResponseDto.md)
 - [PluginTriggerType](doc//PluginTriggerType.md)
 - [PurchaseResponse](doc//PurchaseResponse.md)
 - [PurchaseUpdate](doc//PurchaseUpdate.md)
--- a/mobile/openapi/lib/api.dart
+++ b/mobile/openapi/lib/api.dart
@@ -217,9 +217,10 @@ part 'model/pin_code_reset_dto.dart';
 part 'model/pin_code_setup_dto.dart';
 part 'model/places_response_dto.dart';
 part 'model/plugin_action_response_dto.dart';
-part 'model/plugin_context.dart';
+part 'model/plugin_context_type.dart';
 part 'model/plugin_filter_response_dto.dart';
 part 'model/plugin_response_dto.dart';
+part 'model/plugin_trigger_response_dto.dart';
 part 'model/plugin_trigger_type.dart';
 part 'model/purchase_response.dart';
 part 'model/purchase_update.dart';
--- a/mobile/openapi/lib/api/plugins_api.dart
+++ b/mobile/openapi/lib/api/plugins_api.dart
@@ -73,6 +73,57 @@ class PluginsApi {
    return null;
  }

+  /// List all plugin triggers
+  ///
+  /// Retrieve a list of all available plugin triggers.
+  ///
+  /// Note: This method returns the HTTP [Response].
+  Future<Response> getPluginTriggersWithHttpInfo() async {
+    // ignore: prefer_const_declarations
+    final apiPath = r'/plugins/triggers';
+
+    // ignore: prefer_final_locals
+    Object? postBody;
+
+    final queryParams = <QueryParam>[];
+    final headerParams = <String, String>{};
+    final formParams = <String, String>{};
+
+    const contentTypes = <String>[];
+
+
+    return apiClient.invokeAPI(
+      apiPath,
+      'GET',
+      queryParams,
+      postBody,
+      headerParams,
+      formParams,
+      contentTypes.isEmpty ? null : contentTypes.first,
+    );
+  }
+
+  /// List all plugin triggers
+  ///
+  /// Retrieve a list of all available plugin triggers.
+  Future<List<PluginTriggerResponseDto>?> getPluginTriggers() async {
+    final response = await getPluginTriggersWithHttpInfo();
+    if (response.statusCode >= HttpStatus.badRequest) {
+      throw ApiException(response.statusCode, await _decodeBodyBytes(response));
+    }
+    // When a remote server returns no body with a status of 204, we shall not decode it.
+    // At the time of writing this, `dart:convert` will throw an "Unexpected end of input"
+    // FormatException when trying to decode an empty string.
+    if (response.body.isNotEmpty && response.statusCode != HttpStatus.noContent) {
+      final responseBody = await _decodeBodyBytes(response);
+      return (await apiClient.deserializeAsync(responseBody, 'List<PluginTriggerResponseDto>') as List)
+        .cast<PluginTriggerResponseDto>()
+        .toList(growable: false);
+
+    }
+    return null;
+  }
+
  /// List all plugins
  ///
  /// Retrieve a list of plugins available to the authenticated user.
--- a/mobile/openapi/lib/api/shared_links_api.dart
+++ b/mobile/openapi/lib/api/shared_links_api.dart
@@ -160,7 +160,9 @@ class SharedLinksApi {
  /// Parameters:
  ///
  /// * [String] albumId:
-  Future<Response> getAllSharedLinksWithHttpInfo({ String? albumId, }) async {
+  ///
+  /// * [String] id:
+  Future<Response> getAllSharedLinksWithHttpInfo({ String? albumId, String? id, }) async {
    // ignore: prefer_const_declarations
    final apiPath = r'/shared-links';

@@ -174,6 +176,9 @@ class SharedLinksApi {
    if (albumId != null) {
      queryParams.addAll(_queryParams('', 'albumId', albumId));
    }
+    if (id != null) {
+      queryParams.addAll(_queryParams('', 'id', id));
+    }

    const contentTypes = <String>[];

@@ -196,8 +201,10 @@ class SharedLinksApi {
  /// Parameters:
  ///
  /// * [String] albumId:
-  Future<List<SharedLinkResponseDto>?> getAllSharedLinks({ String? albumId, }) async {
-    final response = await getAllSharedLinksWithHttpInfo( albumId: albumId, );
+  ///
+  /// * [String] id:
+  Future<List<SharedLinkResponseDto>?> getAllSharedLinks({ String? albumId, String? id, }) async {
+    final response = await getAllSharedLinksWithHttpInfo( albumId: albumId, id: id, );
    if (response.statusCode >= HttpStatus.badRequest) {
      throw ApiException(response.statusCode, await _decodeBodyBytes(response));
    }
--- a/mobile/openapi/lib/api_client.dart
+++ b/mobile/openapi/lib/api_client.dart
@@ -482,12 +482,14 @@ class ApiClient {
          return PlacesResponseDto.fromJson(value);
        case 'PluginActionResponseDto':
          return PluginActionResponseDto.fromJson(value);
-        case 'PluginContext':
-          return PluginContextTypeTransformer().decode(value);
+        case 'PluginContextType':
+          return PluginContextTypeTypeTransformer().decode(value);
        case 'PluginFilterResponseDto':
          return PluginFilterResponseDto.fromJson(value);
        case 'PluginResponseDto':
          return PluginResponseDto.fromJson(value);
+        case 'PluginTriggerResponseDto':
+          return PluginTriggerResponseDto.fromJson(value);
        case 'PluginTriggerType':
          return PluginTriggerTypeTypeTransformer().decode(value);
        case 'PurchaseResponse':
--- a/mobile/openapi/lib/api_helper.dart
+++ b/mobile/openapi/lib/api_helper.dart
@@ -127,8 +127,8 @@ String parameterToString(dynamic value) {
  if (value is Permission) {
    return PermissionTypeTransformer().encode(value).toString();
  }
-  if (value is PluginContext) {
-    return PluginContextTypeTransformer().encode(value).toString();
+  if (value is PluginContextType) {
+    return PluginContextTypeTypeTransformer().encode(value).toString();
  }
  if (value is PluginTriggerType) {
    return PluginTriggerTypeTypeTransformer().encode(value).toString();
--- a/mobile/openapi/lib/model/plugin_action_response_dto.dart
+++ b/mobile/openapi/lib/model/plugin_action_response_dto.dart
@@ -32,7 +32,7 @@ class PluginActionResponseDto {

  Object? schema;

-  List<PluginContext> supportedContexts;
+  List<PluginContextType> supportedContexts;

  String title;

@@ -90,7 +90,7 @@ class PluginActionResponseDto {
        methodName: mapValueOfType<String>(json, r'methodName')!,
        pluginId: mapValueOfType<String>(json, r'pluginId')!,
        schema: mapValueOfType<Object>(json, r'schema'),
-        supportedContexts: PluginContext.listFromJson(json[r'supportedContexts']),
+        supportedContexts: PluginContextType.listFromJson(json[r'supportedContexts']),
        title: mapValueOfType<String>(json, r'title')!,
      );
    }
--- a/mobile/openapi/lib/model/plugin_context_type.dart
+++ b/mobile/openapi/lib/model/plugin_context_type.dart
@@ -11,9 +11,9 @@
 part of openapi.api;


-class PluginContext {
+class PluginContextType {
  /// Instantiate a new enum with the provided [value].
-  const PluginContext._(this.value);
+  const PluginContextType._(this.value);

  /// The underlying value of this enum member.
  final String value;
@@ -23,24 +23,24 @@ class PluginContext {

  String toJson() => value;

-  static const asset = PluginContext._(r'asset');
-  static const album = PluginContext._(r'album');
-  static const person = PluginContext._(r'person');
+  static const asset = PluginContextType._(r'asset');
+  static const album = PluginContextType._(r'album');
+  static const person = PluginContextType._(r'person');

-  /// List of all possible values in this [enum][PluginContext].
-  static const values = <PluginContext>[
+  /// List of all possible values in this [enum][PluginContextType].
+  static const values = <PluginContextType>[
    asset,
    album,
    person,
  ];

-  static PluginContext? fromJson(dynamic value) => PluginContextTypeTransformer().decode(value);
+  static PluginContextType? fromJson(dynamic value) => PluginContextTypeTypeTransformer().decode(value);

-  static List<PluginContext> listFromJson(dynamic json, {bool growable = false,}) {
-    final result = <PluginContext>[];
+  static List<PluginContextType> listFromJson(dynamic json, {bool growable = false,}) {
+    final result = <PluginContextType>[];
    if (json is List && json.isNotEmpty) {
      for (final row in json) {
-        final value = PluginContext.fromJson(row);
+        final value = PluginContextType.fromJson(row);
        if (value != null) {
          result.add(value);
        }
@@ -50,16 +50,16 @@ class PluginContext {
  }
 }

-/// Transformation class that can [encode] an instance of [PluginContext] to String,
-/// and [decode] dynamic data back to [PluginContext].
-class PluginContextTypeTransformer {
-  factory PluginContextTypeTransformer() => _instance ??= const PluginContextTypeTransformer._();
+/// Transformation class that can [encode] an instance of [PluginContextType] to String,
+/// and [decode] dynamic data back to [PluginContextType].
+class PluginContextTypeTypeTransformer {
+  factory PluginContextTypeTypeTransformer() => _instance ??= const PluginContextTypeTypeTransformer._();

-  const PluginContextTypeTransformer._();
+  const PluginContextTypeTypeTransformer._();

-  String encode(PluginContext data) => data.value;
+  String encode(PluginContextType data) => data.value;

-  /// Decodes a [dynamic value][data] to a PluginContext.
+  /// Decodes a [dynamic value][data] to a PluginContextType.
  ///
  /// If [allowNull] is true and the [dynamic value][data] cannot be decoded successfully,
  /// then null is returned. However, if [allowNull] is false and the [dynamic value][data]
@@ -67,12 +67,12 @@ class PluginContextTypeTransformer {
  ///
  /// The [allowNull] is very handy when an API changes and a new enum value is added or removed,
  /// and users are still using an old app with the old code.
-  PluginContext? decode(dynamic data, {bool allowNull = true}) {
+  PluginContextType? decode(dynamic data, {bool allowNull = true}) {
    if (data != null) {
      switch (data) {
-        case r'asset': return PluginContext.asset;
-        case r'album': return PluginContext.album;
-        case r'person': return PluginContext.person;
+        case r'asset': return PluginContextType.asset;
+        case r'album': return PluginContextType.album;
+        case r'person': return PluginContextType.person;
        default:
          if (!allowNull) {
            throw ArgumentError('Unknown enum value to decode: $data');
@@ -82,7 +82,7 @@ class PluginContextTypeTransformer {
    return null;
  }

-  /// Singleton [PluginContextTypeTransformer] instance.
-  static PluginContextTypeTransformer? _instance;
+  /// Singleton [PluginContextTypeTypeTransformer] instance.
+  static PluginContextTypeTypeTransformer? _instance;
 }

--- a/mobile/openapi/lib/model/plugin_filter_response_dto.dart
+++ b/mobile/openapi/lib/model/plugin_filter_response_dto.dart
@@ -32,7 +32,7 @@ class PluginFilterResponseDto {

  Object? schema;

-  List<PluginContext> supportedContexts;
+  List<PluginContextType> supportedContexts;

  String title;

@@ -90,7 +90,7 @@ class PluginFilterResponseDto {
        methodName: mapValueOfType<String>(json, r'methodName')!,
        pluginId: mapValueOfType<String>(json, r'pluginId')!,
        schema: mapValueOfType<Object>(json, r'schema'),
-        supportedContexts: PluginContext.listFromJson(json[r'supportedContexts']),
+        supportedContexts: PluginContextType.listFromJson(json[r'supportedContexts']),
        title: mapValueOfType<String>(json, r'title')!,
      );
    }
--- a/mobile/openapi/lib/model/plugin_trigger_response_dto.dart
+++ b/mobile/openapi/lib/model/plugin_trigger_response_dto.dart
@@ -0,0 +1,107 @@
+//
+// AUTO-GENERATED FILE, DO NOT MODIFY!
+//
+// @dart=2.18
+
+// ignore_for_file: unused_element, unused_import
+// ignore_for_file: always_put_required_named_parameters_first
+// ignore_for_file: constant_identifier_names
+// ignore_for_file: lines_longer_than_80_chars
+
+part of openapi.api;
+
+class PluginTriggerResponseDto {
+  /// Returns a new [PluginTriggerResponseDto] instance.
+  PluginTriggerResponseDto({
+    required this.contextType,
+    required this.type,
+  });
+
+  PluginContextType contextType;
+
+  PluginTriggerType type;
+
+  @override
+  bool operator ==(Object other) => identical(this, other) || other is PluginTriggerResponseDto &&
+    other.contextType == contextType &&
+    other.type == type;
+
+  @override
+  int get hashCode =>
+    // ignore: unnecessary_parenthesis
+    (contextType.hashCode) +
+    (type.hashCode);
+
+  @override
+  String toString() => 'PluginTriggerResponseDto[contextType=$contextType, type=$type]';
+
+  Map<String, dynamic> toJson() {
+    final json = <String, dynamic>{};
+      json[r'contextType'] = this.contextType;
+      json[r'type'] = this.type;
+    return json;
+  }
+
+  /// Returns a new [PluginTriggerResponseDto] instance and imports its values from
+  /// [value] if it's a [Map], null otherwise.
+  // ignore: prefer_constructors_over_static_methods
+  static PluginTriggerResponseDto? fromJson(dynamic value) {
+    upgradeDto(value, "PluginTriggerResponseDto");
+    if (value is Map) {
+      final json = value.cast<String, dynamic>();
+
+      return PluginTriggerResponseDto(
+        contextType: PluginContextType.fromJson(json[r'contextType'])!,
+        type: PluginTriggerType.fromJson(json[r'type'])!,
+      );
+    }
+    return null;
+  }
+
+  static List<PluginTriggerResponseDto> listFromJson(dynamic json, {bool growable = false,}) {
+    final result = <PluginTriggerResponseDto>[];
+    if (json is List && json.isNotEmpty) {
+      for (final row in json) {
+        final value = PluginTriggerResponseDto.fromJson(row);
+        if (value != null) {
+          result.add(value);
+        }
+      }
+    }
+    return result.toList(growable: growable);
+  }
+
+  static Map<String, PluginTriggerResponseDto> mapFromJson(dynamic json) {
+    final map = <String, PluginTriggerResponseDto>{};
+    if (json is Map && json.isNotEmpty) {
+      json = json.cast<String, dynamic>(); // ignore: parameter_assignments
+      for (final entry in json.entries) {
+        final value = PluginTriggerResponseDto.fromJson(entry.value);
+        if (value != null) {
+          map[entry.key] = value;
+        }
+      }
+    }
+    return map;
+  }
+
+  // maps a json object with a list of PluginTriggerResponseDto-objects as value to a dart map
+  static Map<String, List<PluginTriggerResponseDto>> mapListFromJson(dynamic json, {bool growable = false,}) {
+    final map = <String, List<PluginTriggerResponseDto>>{};
+    if (json is Map && json.isNotEmpty) {
+      // ignore: parameter_assignments
+      json = json.cast<String, dynamic>();
+      for (final entry in json.entries) {
+        map[entry.key] = PluginTriggerResponseDto.listFromJson(entry.value, growable: growable,);
+      }
+    }
+    return map;
+  }
+
+  /// The list of required keys that must be present in a JSON.
+  static const requiredKeys = <String>{
+    'contextType',
+    'type',
+  };
+}
+
--- a/mobile/openapi/lib/model/workflow_response_dto.dart
+++ b/mobile/openapi/lib/model/workflow_response_dto.dart
@@ -40,7 +40,7 @@ class WorkflowResponseDto {

  String ownerId;

-  WorkflowResponseDtoTriggerTypeEnum triggerType;
+  PluginTriggerType triggerType;

  @override
  bool operator ==(Object other) => identical(this, other) || other is WorkflowResponseDto &&
@@ -105,7 +105,7 @@ class WorkflowResponseDto {
        id: mapValueOfType<String>(json, r'id')!,
        name: mapValueOfType<String>(json, r'name'),
        ownerId: mapValueOfType<String>(json, r'ownerId')!,
-        triggerType: WorkflowResponseDtoTriggerTypeEnum.fromJson(json[r'triggerType'])!,
+        triggerType: PluginTriggerType.fromJson(json[r'triggerType'])!,
      );
    }
    return null;
@@ -165,77 +165,3 @@ class WorkflowResponseDto {
  };
 }

-
-class WorkflowResponseDtoTriggerTypeEnum {
-  /// Instantiate a new enum with the provided [value].
-  const WorkflowResponseDtoTriggerTypeEnum._(this.value);
-
-  /// The underlying value of this enum member.
-  final String value;
-
-  @override
-  String toString() => value;
-
-  String toJson() => value;
-
-  static const assetCreate = WorkflowResponseDtoTriggerTypeEnum._(r'AssetCreate');
-  static const personRecognized = WorkflowResponseDtoTriggerTypeEnum._(r'PersonRecognized');
-
-  /// List of all possible values in this [enum][WorkflowResponseDtoTriggerTypeEnum].
-  static const values = <WorkflowResponseDtoTriggerTypeEnum>[
-    assetCreate,
-    personRecognized,
-  ];
-
-  static WorkflowResponseDtoTriggerTypeEnum? fromJson(dynamic value) => WorkflowResponseDtoTriggerTypeEnumTypeTransformer().decode(value);
-
-  static List<WorkflowResponseDtoTriggerTypeEnum> listFromJson(dynamic json, {bool growable = false,}) {
-    final result = <WorkflowResponseDtoTriggerTypeEnum>[];
-    if (json is List && json.isNotEmpty) {
-      for (final row in json) {
-        final value = WorkflowResponseDtoTriggerTypeEnum.fromJson(row);
-        if (value != null) {
-          result.add(value);
-        }
-      }
-    }
-    return result.toList(growable: growable);
-  }
-}
-
-/// Transformation class that can [encode] an instance of [WorkflowResponseDtoTriggerTypeEnum] to String,
-/// and [decode] dynamic data back to [WorkflowResponseDtoTriggerTypeEnum].
-class WorkflowResponseDtoTriggerTypeEnumTypeTransformer {
-  factory WorkflowResponseDtoTriggerTypeEnumTypeTransformer() => _instance ??= const WorkflowResponseDtoTriggerTypeEnumTypeTransformer._();
-
-  const WorkflowResponseDtoTriggerTypeEnumTypeTransformer._();
-
-  String encode(WorkflowResponseDtoTriggerTypeEnum data) => data.value;
-
-  /// Decodes a [dynamic value][data] to a WorkflowResponseDtoTriggerTypeEnum.
-  ///
-  /// If [allowNull] is true and the [dynamic value][data] cannot be decoded successfully,
-  /// then null is returned. However, if [allowNull] is false and the [dynamic value][data]
-  /// cannot be decoded successfully, then an [UnimplementedError] is thrown.
-  ///
-  /// The [allowNull] is very handy when an API changes and a new enum value is added or removed,
-  /// and users are still using an old app with the old code.
-  WorkflowResponseDtoTriggerTypeEnum? decode(dynamic data, {bool allowNull = true}) {
-    if (data != null) {
-      switch (data) {
-        case r'AssetCreate': return WorkflowResponseDtoTriggerTypeEnum.assetCreate;
-        case r'PersonRecognized': return WorkflowResponseDtoTriggerTypeEnum.personRecognized;
-        default:
-          if (!allowNull) {
-            throw ArgumentError('Unknown enum value to decode: $data');
-          }
-      }
-    }
-    return null;
-  }
-
-  /// Singleton [WorkflowResponseDtoTriggerTypeEnumTypeTransformer] instance.
-  static WorkflowResponseDtoTriggerTypeEnumTypeTransformer? _instance;
-}
-
-
--- a/mobile/openapi/lib/model/workflow_update_dto.dart
+++ b/mobile/openapi/lib/model/workflow_update_dto.dart
@@ -18,6 +18,7 @@ class WorkflowUpdateDto {
    this.enabled,
    this.filters = const [],
    this.name,
+    this.triggerType,
  });

  List<WorkflowActionItemDto> actions;
@@ -48,13 +49,22 @@ class WorkflowUpdateDto {
  ///
  String? name;

+  ///
+  /// Please note: This property should have been non-nullable! Since the specification file
+  /// does not include a default value (using the "default:" property), however, the generated
+  /// source code must fall back to having a nullable type.
+  /// Consider adding a "default:" property in the specification file to hide this note.
+  ///
+  PluginTriggerType? triggerType;
+
  @override
  bool operator ==(Object other) => identical(this, other) || other is WorkflowUpdateDto &&
    _deepEquality.equals(other.actions, actions) &&
    other.description == description &&
    other.enabled == enabled &&
    _deepEquality.equals(other.filters, filters) &&
-    other.name == name;
+    other.name == name &&
+    other.triggerType == triggerType;

  @override
  int get hashCode =>
@@ -63,10 +73,11 @@ class WorkflowUpdateDto {
    (description == null ? 0 : description!.hashCode) +
    (enabled == null ? 0 : enabled!.hashCode) +
    (filters.hashCode) +
-    (name == null ? 0 : name!.hashCode);
+    (name == null ? 0 : name!.hashCode) +
+    (triggerType == null ? 0 : triggerType!.hashCode);

  @override
-  String toString() => 'WorkflowUpdateDto[actions=$actions, description=$description, enabled=$enabled, filters=$filters, name=$name]';
+  String toString() => 'WorkflowUpdateDto[actions=$actions, description=$description, enabled=$enabled, filters=$filters, name=$name, triggerType=$triggerType]';

  Map<String, dynamic> toJson() {
    final json = <String, dynamic>{};
@@ -87,6 +98,11 @@ class WorkflowUpdateDto {
    } else {
    //  json[r'name'] = null;
    }
+    if (this.triggerType != null) {
+      json[r'triggerType'] = this.triggerType;
+    } else {
+    //  json[r'triggerType'] = null;
+    }
    return json;
  }

@@ -104,6 +120,7 @@ class WorkflowUpdateDto {
        enabled: mapValueOfType<bool>(json, r'enabled'),
        filters: WorkflowFilterItemDto.listFromJson(json[r'filters']),
        name: mapValueOfType<String>(json, r'name'),
+        triggerType: PluginTriggerType.fromJson(json[r'triggerType']),
      );
    }
    return null;
--- a/open-api/immich-openapi-specs.json
+++ b/open-api/immich-openapi-specs.json
@@ -8020,6 +8020,55 @@
        "x-immich-state": "Alpha"
      }
    },
+    "/plugins/triggers": {
+      "get": {
+        "description": "Retrieve a list of all available plugin triggers.",
+        "operationId": "getPluginTriggers",
+        "parameters": [],
+        "responses": {
+          "200": {
+            "content": {
+              "application/json": {
+                "schema": {
+                  "items": {
+                    "$ref": "#/components/schemas/PluginTriggerResponseDto"
+                  },
+                  "type": "array"
+                }
+              }
+            },
+            "description": ""
+          }
+        },
+        "security": [
+          {
+            "bearer": []
+          },
+          {
+            "cookie": []
+          },
+          {
+            "api_key": []
+          }
+        ],
+        "summary": "List all plugin triggers",
+        "tags": [
+          "Plugins"
+        ],
+        "x-immich-history": [
+          {
+            "version": "v2.3.0",
+            "state": "Added"
+          },
+          {
+            "version": "v2.3.0",
+            "state": "Alpha"
+          }
+        ],
+        "x-immich-permission": "plugin.read",
+        "x-immich-state": "Alpha"
+      }
+    },
    "/plugins/{id}": {
      "get": {
        "description": "Retrieve information about a specific plugin by its ID.",
@@ -10332,6 +10381,21 @@
              "format": "uuid",
              "type": "string"
            }
+          },
+          {
+            "name": "id",
+            "required": false,
+            "in": "query",
+            "x-immich-history": [
+              {
+                "version": "v2.5.0",
+                "state": "Added"
+              }
+            ],
+            "schema": {
+              "format": "uuid",
+              "type": "string"
+            }
          }
        ],
        "responses": {
@@ -18282,7 +18346,7 @@
          },
          "supportedContexts": {
            "items": {
-              "$ref": "#/components/schemas/PluginContext"
+              "$ref": "#/components/schemas/PluginContextType"
            },
            "type": "array"
          },
@@ -18301,7 +18365,7 @@
        ],
        "type": "object"
      },
-      "PluginContext": {
+      "PluginContextType": {
        "enum": [
          "asset",
          "album",
@@ -18329,7 +18393,7 @@
          },
          "supportedContexts": {
            "items": {
-              "$ref": "#/components/schemas/PluginContext"
+              "$ref": "#/components/schemas/PluginContextType"
            },
            "type": "array"
          },
@@ -18401,6 +18465,29 @@
        ],
        "type": "object"
      },
+      "PluginTriggerResponseDto": {
+        "properties": {
+          "contextType": {
+            "allOf": [
+              {
+                "$ref": "#/components/schemas/PluginContextType"
+              }
+            ]
+          },
+          "type": {
+            "allOf": [
+              {
+                "$ref": "#/components/schemas/PluginTriggerType"
+              }
+            ]
+          }
+        },
+        "required": [
+          "contextType",
+          "type"
+        ],
+        "type": "object"
+      },
      "PluginTriggerType": {
        "enum": [
          "AssetCreate",
@@ -23316,11 +23403,11 @@
            "type": "string"
          },
          "triggerType": {
-            "enum": [
-              "AssetCreate",
-              "PersonRecognized"
-            ],
-            "type": "string"
+            "allOf": [
+              {
+                "$ref": "#/components/schemas/PluginTriggerType"
+              }
+            ]
          }
        },
        "required": [
@@ -23358,6 +23445,13 @@
          },
          "name": {
            "type": "string"
+          },
+          "triggerType": {
+            "allOf": [
+              {
+                "$ref": "#/components/schemas/PluginTriggerType"
+              }
+            ]
          }
        },
        "type": "object"
--- a/open-api/typescript-sdk/src/fetch-client.ts
+++ b/open-api/typescript-sdk/src/fetch-client.ts
@@ -942,7 +942,7 @@ export type PluginActionResponseDto = {
    methodName: string;
    pluginId: string;
    schema: object | null;
-    supportedContexts: PluginContext[];
+    supportedContexts: PluginContextType[];
    title: string;
 };
 export type PluginFilterResponseDto = {
@@ -951,7 +951,7 @@ export type PluginFilterResponseDto = {
    methodName: string;
    pluginId: string;
    schema: object | null;
-    supportedContexts: PluginContext[];
+    supportedContexts: PluginContextType[];
    title: string;
 };
 export type PluginResponseDto = {
@@ -966,6 +966,10 @@ export type PluginResponseDto = {
    updatedAt: string;
    version: string;
 };
+export type PluginTriggerResponseDto = {
+    contextType: PluginContextType;
+    "type": PluginTriggerType;
+};
 export type QueueResponseDto = {
    isPaused: boolean;
    name: QueueName;
@@ -1750,7 +1754,7 @@ export type WorkflowResponseDto = {
    id: string;
    name: string | null;
    ownerId: string;
-    triggerType: TriggerType;
+    triggerType: PluginTriggerType;
 };
 export type WorkflowActionItemDto = {
    actionConfig?: object;
@@ -1774,6 +1778,7 @@ export type WorkflowUpdateDto = {
    enabled?: boolean;
    filters?: WorkflowFilterItemDto[];
    name?: string;
+    triggerType?: PluginTriggerType;
 };
 /**
 * List all activities
@@ -3656,6 +3661,17 @@ export function getPlugins(opts?: Oazapfts.RequestOpts) {
        ...opts
    }));
 }
+/**
+ * List all plugin triggers
+ */
+export function getPluginTriggers(opts?: Oazapfts.RequestOpts) {
+    return oazapfts.ok(oazapfts.fetchJson<{
+        status: 200;
+        data: PluginTriggerResponseDto[];
+    }>("/plugins/triggers", {
+        ...opts
+    }));
+}
 /**
 * Retrieve a plugin
 */
@@ -4202,14 +4218,16 @@ export function lockSession({ id }: {
 /**
 * Retrieve all shared links
 */
-export function getAllSharedLinks({ albumId }: {
+export function getAllSharedLinks({ albumId, id }: {
    albumId?: string;
+    id?: string;
 }, opts?: Oazapfts.RequestOpts) {
    return oazapfts.ok(oazapfts.fetchJson<{
        status: 200;
        data: SharedLinkResponseDto[];
    }>(`/shared-links${QS.query(QS.explode({
-        albumId
+        albumId,
+        id
    }))}`, {
        ...opts
    }));
@@ -5418,11 +5436,15 @@ export enum PartnerDirection {
    SharedBy = "shared-by",
    SharedWith = "shared-with"
 }
-export enum PluginContext {
+export enum PluginContextType {
    Asset = "asset",
    Album = "album",
    Person = "person"
 }
+export enum PluginTriggerType {
+    AssetCreate = "AssetCreate",
+    PersonRecognized = "PersonRecognized"
+}
 export enum QueueJobStatus {
    Active = "active",
    Failed = "failed",
@@ -5639,11 +5661,3 @@ export enum OAuthTokenEndpointAuthMethod {
    ClientSecretPost = "client_secret_post",
    ClientSecretBasic = "client_secret_basic"
 }
-export enum TriggerType {
-    AssetCreate = "AssetCreate",
-    PersonRecognized = "PersonRecognized"
-}
-export enum PluginTriggerType {
-    AssetCreate = "AssetCreate",
-    PersonRecognized = "PersonRecognized"
-}
--- a/plugins/manifest.json
+++ b/plugins/manifest.json
@@ -1,30 +1,36 @@
 {
  "name": "immich-core",
-  "version": "2.0.0",
+  "version": "2.0.1",
  "title": "Immich Core",
  "description": "Core workflow capabilities for Immich",
  "author": "Immich Team",
-
  "wasm": {
    "path": "dist/plugin.wasm"
  },
-
  "filters": [
    {
      "methodName": "filterFileName",
      "title": "Filter by filename",
      "description": "Filter assets by filename pattern using text matching or regular expressions",
-      "supportedContexts": ["asset"],
+      "supportedContexts": [
+        "asset"
+      ],
      "schema": {
        "type": "object",
        "properties": {
          "pattern": {
            "type": "string",
+            "title": "Filename pattern",
            "description": "Text or regex pattern to match against filename"
          },
          "matchType": {
            "type": "string",
-            "enum": ["contains", "regex", "exact"],
+            "title": "Match type",
+            "enum": [
+              "contains",
+              "regex",
+              "exact"
+            ],
            "default": "contains",
            "description": "Type of pattern matching to perform"
          },
@@ -34,43 +40,57 @@
            "description": "Whether matching should be case-sensitive"
          }
        },
-        "required": ["pattern"]
+        "required": [
+          "pattern"
+        ]
      }
    },
    {
      "methodName": "filterFileType",
      "title": "Filter by file type",
      "description": "Filter assets by file type",
-      "supportedContexts": ["asset"],
+      "supportedContexts": [
+        "asset"
+      ],
      "schema": {
        "type": "object",
        "properties": {
          "fileTypes": {
            "type": "array",
+            "title": "File types",
            "items": {
              "type": "string",
-              "enum": ["IMAGE", "VIDEO"]
+              "enum": [
+                "image",
+                "video"
+              ]
            },
            "description": "Allowed file types"
          }
        },
-        "required": ["fileTypes"]
+        "required": [
+          "fileTypes"
+        ]
      }
    },
    {
      "methodName": "filterPerson",
      "title": "Filter by person",
      "description": "Filter by detected person",
-      "supportedContexts": ["person"],
+      "supportedContexts": [
+        "person"
+      ],
      "schema": {
        "type": "object",
        "properties": {
          "personIds": {
            "type": "array",
+            "title": "Person IDs",
            "items": {
              "type": "string"
            },
-            "description": "List of person to match"
+            "description": "List of person to match",
+            "subType": "people-picker"
          },
          "matchAny": {
            "type": "boolean",
@@ -78,24 +98,29 @@
            "description": "Match any name (true) or require all names (false)"
          }
        },
-        "required": ["personIds"]
+        "required": [
+          "personIds"
+        ]
      }
    }
  ],
-
  "actions": [
    {
      "methodName": "actionArchive",
      "title": "Archive",
      "description": "Move the asset to archive",
-      "supportedContexts": ["asset"],
+      "supportedContexts": [
+        "asset"
+      ],
      "schema": {}
    },
    {
      "methodName": "actionFavorite",
      "title": "Favorite",
      "description": "Mark the asset as favorite or unfavorite",
-      "supportedContexts": ["asset"],
+      "supportedContexts": [
+        "asset"
+      ],
      "schema": {
        "type": "object",
        "properties": {
@@ -111,16 +136,23 @@
      "methodName": "actionAddToAlbum",
      "title": "Add to Album",
      "description": "Add the item to a specified album",
-      "supportedContexts": ["asset", "person"],
+      "supportedContexts": [
+        "asset",
+        "person"
+      ],
      "schema": {
        "type": "object",
        "properties": {
          "albumId": {
            "type": "string",
-            "description": "Target album ID"
+            "title": "Album ID",
+            "description": "Target album ID",
+            "subType": "album-picker"
          }
        },
-        "required": ["albumId"]
+        "required": [
+          "albumId"
+        ]
      }
    }
  ]
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/server/src/controllers/plugin.controller.ts
+++ b/server/src/controllers/plugin.controller.ts
@@ -1,7 +1,7 @@
 import { Controller, Get, Param } from '@nestjs/common';
 import { ApiTags } from '@nestjs/swagger';
 import { Endpoint, HistoryBuilder } from 'src/decorators';
-import { PluginResponseDto } from 'src/dtos/plugin.dto';
+import { PluginResponseDto, PluginTriggerResponseDto } from 'src/dtos/plugin.dto';
 import { Permission } from 'src/enum';
 import { Authenticated } from 'src/middleware/auth.guard';
 import { PluginService } from 'src/services/plugin.service';
@@ -12,6 +12,17 @@ import { UUIDParamDto } from 'src/validation';
 export class PluginController {
  constructor(private service: PluginService) {}

+  @Get('triggers')
+  @Authenticated({ permission: Permission.PluginRead })
+  @Endpoint({
+    summary: 'List all plugin triggers',
+    description: 'Retrieve a list of all available plugin triggers.',
+    history: new HistoryBuilder().added('v2.3.0').alpha('v2.3.0'),
+  })
+  getPluginTriggers(): PluginTriggerResponseDto[] {
+    return this.service.getTriggers();
+  }
+
  @Get()
  @Authenticated({ permission: Permission.PluginRead })
  @Endpoint({
--- a/server/src/dtos/env.dto.ts
+++ b/server/src/dtos/env.dto.ts
@@ -58,7 +58,7 @@ export class EnvDto {
  IMMICH_MICROSERVICES_METRICS_PORT?: number;

  @ValidateBoolean({ optional: true })
-  IMMICH_PLUGINS_ENABLED?: boolean;
+  IMMICH_ALLOW_EXTERNAL_PLUGINS?: boolean;

  @Optional()
  @Matches(/^\//, { message: 'IMMICH_PLUGINS_INSTALL_FOLDER must be an absolute path' })
@@ -113,6 +113,9 @@ export class EnvDto {
  @Optional()
  IMMICH_THIRD_PARTY_SUPPORT_URL?: string;

+  @ValidateBoolean({ optional: true })
+  IMMICH_ALLOW_SETUP?: boolean;
+
  @IsIPRange({ requireCIDR: false }, { each: true })
  @Transform(({ value }) =>
    value && typeof value === 'string'
--- a/server/src/dtos/plugin.dto.ts
+++ b/server/src/dtos/plugin.dto.ts
@@ -1,9 +1,16 @@
 import { IsNotEmpty, IsString } from 'class-validator';
 import { PluginAction, PluginFilter } from 'src/database';
-import { PluginContext } from 'src/enum';
+import { PluginContext as PluginContextType, PluginTriggerType } from 'src/enum';
 import type { JSONSchema } from 'src/types/plugin-schema.types';
 import { ValidateEnum } from 'src/validation';

+export class PluginTriggerResponseDto {
+  @ValidateEnum({ enum: PluginTriggerType, name: 'PluginTriggerType' })
+  type!: PluginTriggerType;
+  @ValidateEnum({ enum: PluginContextType, name: 'PluginContextType' })
+  contextType!: PluginContextType;
+}
+
 export class PluginResponseDto {
  id!: string;
  name!: string;
@@ -24,8 +31,8 @@ export class PluginFilterResponseDto {
  title!: string;
  description!: string;

-  @ValidateEnum({ enum: PluginContext, name: 'PluginContext' })
-  supportedContexts!: PluginContext[];
+  @ValidateEnum({ enum: PluginContextType, name: 'PluginContextType' })
+  supportedContexts!: PluginContextType[];
  schema!: JSONSchema | null;
 }

@@ -36,8 +43,8 @@ export class PluginActionResponseDto {
  title!: string;
  description!: string;

-  @ValidateEnum({ enum: PluginContext, name: 'PluginContext' })
-  supportedContexts!: PluginContext[];
+  @ValidateEnum({ enum: PluginContextType, name: 'PluginContextType' })
+  supportedContexts!: PluginContextType[];
  schema!: JSONSchema | null;
 }

--- a/server/src/dtos/shared-link.dto.ts
+++ b/server/src/dtos/shared-link.dto.ts
@@ -1,7 +1,7 @@
 import { ApiProperty } from '@nestjs/swagger';
 import { IsString } from 'class-validator';
-import _ from 'lodash';
 import { SharedLink } from 'src/database';
+import { HistoryBuilder, Property } from 'src/decorators';
 import { AlbumResponseDto, mapAlbumWithoutAssets } from 'src/dtos/album.dto';
 import { AssetResponseDto, mapAsset } from 'src/dtos/asset-response.dto';
 import { SharedLinkType } from 'src/enum';
@@ -10,6 +10,10 @@ import { Optional, ValidateBoolean, ValidateDate, ValidateEnum, ValidateUUID } f
 export class SharedLinkSearchDto {
  @ValidateUUID({ optional: true })
  albumId?: string;
+
+  @ValidateUUID({ optional: true })
+  @Property({ history: new HistoryBuilder().added('v2.5.0') })
+  id?: string;
 }

 export class SharedLinkCreateDto {
@@ -113,10 +117,10 @@ export class SharedLinkResponseDto {
  slug!: string | null;
 }

-export function mapSharedLink(sharedLink: SharedLink): SharedLinkResponseDto {
-  const linkAssets = sharedLink.assets || [];
+export function mapSharedLink(sharedLink: SharedLink, options: { stripAssetMetadata: boolean }): SharedLinkResponseDto {
+  const assets = sharedLink.assets || [];

-  return {
+  const response = {
    id: sharedLink.id,
    description: sharedLink.description,
    password: sharedLink.password,
@@ -125,35 +129,19 @@ export function mapSharedLink(sharedLink: SharedLink): SharedLinkResponseDto {
    type: sharedLink.type,
    createdAt: sharedLink.createdAt,
    expiresAt: sharedLink.expiresAt,
-    assets: linkAssets.map((asset) => mapAsset(asset)),
-    album: sharedLink.album ? mapAlbumWithoutAssets(sharedLink.album) : undefined,
-    allowUpload: sharedLink.allowUpload,
-    allowDownload: sharedLink.allowDownload,
-    showMetadata: sharedLink.showExif,
-    slug: sharedLink.slug,
-  };
-}
-
-export function mapSharedLinkWithoutMetadata(sharedLink: SharedLink): SharedLinkResponseDto {
-  const linkAssets = sharedLink.assets || [];
-  const albumAssets = (sharedLink?.album?.assets || []).map((asset) => asset);
-
-  const assets = _.uniqBy([...linkAssets, ...albumAssets], (asset) => asset.id);
-
-  return {
-    id: sharedLink.id,
-    description: sharedLink.description,
-    password: sharedLink.password,
-    userId: sharedLink.userId,
-    key: sharedLink.key.toString('base64url'),
-    type: sharedLink.type,
-    createdAt: sharedLink.createdAt,
-    expiresAt: sharedLink.expiresAt,
-    assets: assets.map((asset) => mapAsset(asset, { stripMetadata: true })),
+    assets: assets.map((asset) => mapAsset(asset, { stripMetadata: options.stripAssetMetadata })),
    album: sharedLink.album ? mapAlbumWithoutAssets(sharedLink.album) : undefined,
    allowUpload: sharedLink.allowUpload,
    allowDownload: sharedLink.allowDownload,
    showMetadata: sharedLink.showExif,
    slug: sharedLink.slug,
  };
+
+  // unless we select sharedLink.album.sharedLinks this will be wrong
+  if (response.album) {
+    response.album.hasSharedLink = true;
+    response.album.shared = true;
+  }
+
+  return response;
 }
--- a/server/src/dtos/workflow.dto.ts
+++ b/server/src/dtos/workflow.dto.ts
@@ -48,6 +48,9 @@ export class WorkflowCreateDto {
 }

 export class WorkflowUpdateDto {
+  @ValidateEnum({ enum: PluginTriggerType, name: 'PluginTriggerType', optional: true })
+  triggerType?: PluginTriggerType;
+
  @IsString()
  @IsNotEmpty()
  @Optional()
@@ -74,6 +77,7 @@ export class WorkflowUpdateDto {
 export class WorkflowResponseDto {
  id!: string;
  ownerId!: string;
+  @ValidateEnum({ enum: PluginTriggerType, name: 'PluginTriggerType' })
  triggerType!: PluginTriggerType;
  name!: string | null;
  description!: string;
--- a/server/src/plugins.ts
+++ b/server/src/plugins.ts
@@ -1,37 +1,17 @@
 import { PluginContext, PluginTriggerType } from 'src/enum';
-import { JSONSchema } from 'src/types/plugin-schema.types';

 export type PluginTrigger = {
-  name: string;
  type: PluginTriggerType;
-  description: string;
-  context: PluginContext;
-  schema: JSONSchema | null;
+  contextType: PluginContext;
 };

 export const pluginTriggers: PluginTrigger[] = [
  {
-    name: 'Asset Uploaded',
    type: PluginTriggerType.AssetCreate,
-    description: 'Triggered when a new asset is uploaded',
-    context: PluginContext.Asset,
-    schema: {
-      type: 'object',
-      properties: {
-        assetType: {
-          type: 'string',
-          description: 'Type of the asset',
-          default: 'ALL',
-          enum: ['Image', 'Video', 'All'],
-        },
-      },
-    },
+    contextType: PluginContext.Asset,
  },
  {
-    name: 'Person Recognized',
    type: PluginTriggerType.PersonRecognized,
-    description: 'Triggered when a person is detected in an asset',
-    context: PluginContext.Person,
-    schema: null,
+    contextType: PluginContext.Person,
  },
 ];
--- a/server/src/queries/workflow.repository.sql
+++ b/server/src/queries/workflow.repository.sql
@@ -7,6 +7,8 @@ from
  "workflow"
 where
  "id" = $1
+order by
+  "createdAt" desc

 -- WorkflowRepository.getWorkflowsByOwner
 select
@@ -16,7 +18,7 @@ from
 where
  "ownerId" = $1
 order by
-  "name"
+  "createdAt" desc

 -- WorkflowRepository.getWorkflowsByTrigger
 select
--- a/server/src/repositories/config.repository.spec.ts
+++ b/server/src/repositories/config.repository.spec.ts
@@ -8,6 +8,8 @@ const getEnv = () => {

 const resetEnv = () => {
  for (const env of [
+    'IMMICH_ALLOW_EXTERNAL_PLUGINS',
+    'IMMICH_ALLOW_SETUP',
    'IMMICH_ENV',
    'IMMICH_WORKERS_INCLUDE',
    'IMMICH_WORKERS_EXCLUDE',
@@ -75,6 +77,9 @@ describe('getEnv', () => {
      configFile: undefined,
      logLevel: undefined,
    });
+
+    expect(config.plugins.external).toEqual({ allow: false });
+    expect(config.setup).toEqual({ allow: true });
  });

  describe('IMMICH_MEDIA_LOCATION', () => {
@@ -84,6 +89,32 @@ describe('getEnv', () => {
    });
  });

+  describe('IMMICH_ALLOW_EXTERNAL_PLUGINS', () => {
+    it('should disable plugins', () => {
+      process.env.IMMICH_ALLOW_EXTERNAL_PLUGINS = 'false';
+      const config = getEnv();
+      expect(config.plugins.external).toEqual({ allow: false });
+    });
+
+    it('should throw an error for invalid value', () => {
+      process.env.IMMICH_ALLOW_EXTERNAL_PLUGINS = 'invalid';
+      expect(() => getEnv()).toThrowError('IMMICH_ALLOW_EXTERNAL_PLUGINS must be a boolean value');
+    });
+  });
+
+  describe('IMMICH_ALLOW_SETUP', () => {
+    it('should disable setup', () => {
+      process.env.IMMICH_ALLOW_SETUP = 'false';
+      const { setup } = getEnv();
+      expect(setup).toEqual({ allow: false });
+    });
+
+    it('should throw an error for invalid value', () => {
+      process.env.IMMICH_ALLOW_SETUP = 'invalid';
+      expect(() => getEnv()).toThrowError('IMMICH_ALLOW_SETUP must be a boolean value');
+    });
+  });
+
  describe('database', () => {
    it('should use defaults', () => {
      const { database } = getEnv();
--- a/server/src/repositories/config.repository.ts
+++ b/server/src/repositories/config.repository.ts
@@ -90,6 +90,10 @@ export interface EnvData {

  redis: RedisOptions;

+  setup: {
+    allow: boolean;
+  };
+
  telemetry: {
    apiPort: number;
    microservicesPort: number;
@@ -104,8 +108,10 @@ export interface EnvData {
  workers: ImmichWorker[];

  plugins: {
-    enabled: boolean;
-    installFolder?: string;
+    external: {
+      allow: boolean;
+      installFolder?: string;
+    };
  };

  noColor: boolean;
@@ -313,6 +319,10 @@ const getEnv = (): EnvData => {
      corePlugin: join(buildFolder, 'corePlugin'),
    },

+    setup: {
+      allow: dto.IMMICH_ALLOW_SETUP ?? true,
+    },
+
    storage: {
      ignoreMountCheckErrors: !!dto.IMMICH_IGNORE_MOUNT_CHECK_ERRORS,
      mediaLocation: dto.IMMICH_MEDIA_LOCATION,
@@ -327,8 +337,10 @@ const getEnv = (): EnvData => {
    workers,

    plugins: {
-      enabled: !!dto.IMMICH_PLUGINS_ENABLED,
-      installFolder: dto.IMMICH_PLUGINS_INSTALL_FOLDER,
+      external: {
+        allow: dto.IMMICH_ALLOW_EXTERNAL_PLUGINS ?? false,
+        installFolder: dto.IMMICH_PLUGINS_INSTALL_FOLDER,
+      },
    },

    noColor: !!dto.NO_COLOR,
--- a/server/src/repositories/database.repository.ts
+++ b/server/src/repositories/database.repository.ts
@@ -358,7 +358,7 @@ export class DatabaseRepository {
  }

  async runMigrations(): Promise<void> {
-    this.logger.debug('Running migrations');
+    this.logger.log('Running migrations');

    const migrator = this.createMigrator();

@@ -379,7 +379,7 @@ export class DatabaseRepository {
      throw error;
    }

-    this.logger.debug('Finished running migrations');
+    this.logger.log('Finished running migrations');
  }

  async migrateFilePaths(sourceFolder: string, targetFolder: string): Promise<void> {
--- a/server/src/repositories/shared-link.repository.ts
+++ b/server/src/repositories/shared-link.repository.ts
@@ -12,6 +12,7 @@ import { SharedLinkTable } from 'src/schema/tables/shared-link.table';

 export type SharedLinkSearchOptions = {
  userId: string;
+  id?: string;
  albumId?: string;
 };

@@ -118,7 +119,7 @@ export class SharedLinkRepository {
  }

  @GenerateSql({ params: [{ userId: DummyValue.UUID, albumId: DummyValue.UUID }] })
-  getAll({ userId, albumId }: SharedLinkSearchOptions) {
+  getAll({ userId, id, albumId }: SharedLinkSearchOptions) {
    return this.db
      .selectFrom('shared_link')
      .selectAll('shared_link')
@@ -176,6 +177,7 @@ export class SharedLinkRepository {
      .select((eb) => eb.fn.toJson('album').$castTo<Album | null>().as('album'))
      .where((eb) => eb.or([eb('shared_link.type', '=', SharedLinkType.Individual), eb('album.id', 'is not', null)]))
      .$if(!!albumId, (eb) => eb.where('shared_link.albumId', '=', albumId!))
+      .$if(!!id, (eb) => eb.where('shared_link.id', '=', id!))
      .orderBy('shared_link.createdAt', 'desc')
      .distinctOn(['shared_link.createdAt'])
      .execute();
--- a/server/src/repositories/workflow.repository.ts
+++ b/server/src/repositories/workflow.repository.ts
@@ -12,12 +12,22 @@ export class WorkflowRepository {

  @GenerateSql({ params: [DummyValue.UUID] })
  getWorkflow(id: string) {
-    return this.db.selectFrom('workflow').selectAll().where('id', '=', id).executeTakeFirst();
+    return this.db
+      .selectFrom('workflow')
+      .selectAll()
+      .where('id', '=', id)
+      .orderBy('createdAt', 'desc')
+      .executeTakeFirst();
  }

  @GenerateSql({ params: [DummyValue.UUID] })
  getWorkflowsByOwner(ownerId: string) {
-    return this.db.selectFrom('workflow').selectAll().where('ownerId', '=', ownerId).orderBy('name').execute();
+    return this.db
+      .selectFrom('workflow')
+      .selectAll()
+      .where('ownerId', '=', ownerId)
+      .orderBy('createdAt', 'desc')
+      .execute();
  }

  @GenerateSql({ params: [PluginTriggerType.AssetCreate] })
--- a/server/src/services/auth.service.ts
+++ b/server/src/services/auth.service.ts
@@ -165,6 +165,11 @@ export class AuthService extends BaseService {
  }

  async adminSignUp(dto: SignUpDto): Promise<UserAdminResponseDto> {
+    const { setup } = this.configRepository.getEnv();
+    if (!setup.allow) {
+      throw new BadRequestException('Admin setup is disabled');
+    }
+
    const adminUser = await this.userRepository.getAdmin();
    if (adminUser) {
      throw new BadRequestException('The server already has an admin');
--- a/server/src/services/media.service.ts
+++ b/server/src/services/media.service.ts
@@ -158,7 +158,7 @@ export class MediaService extends BaseService {
  async handleGenerateThumbnails({ id }: JobOf<JobName.AssetGenerateThumbnails>): Promise<JobStatus> {
    const asset = await this.assetJobRepository.getForGenerateThumbnailJob(id);
    if (!asset) {
-      this.logger.warn(`Thumbnail generation failed for asset ${id}: not found`);
+      this.logger.warn(`Thumbnail generation failed for asset ${id}: not found in database or missing metadata`);
      return JobStatus.Failed;
    }

--- a/server/src/services/memory.service.ts
+++ b/server/src/services/memory.service.ts
@@ -28,6 +28,7 @@ export class MemoryService extends BaseService {
          continue;
        }

+        this.logger.log(`Creating memories for ${target.toISO()}`);
        try {
          await Promise.all(users.map((owner) => this.createOnThisDayMemories(owner.id, target)));
        } catch (error) {
--- a/server/src/services/metadata.service.ts
+++ b/server/src/services/metadata.service.ts
@@ -366,9 +366,13 @@ export class MetadataService extends BaseService {

    const isChanged = sidecarPath !== sidecarFile?.path;

-    this.logger.debug(
-      `Sidecar check found old=${sidecarFile?.path}, new=${sidecarPath} will ${isChanged ? 'update' : 'do nothing for'}  asset ${asset.id}: ${asset.originalPath}`,
-    );
+    if (sidecarFile?.path || sidecarPath) {
+      this.logger.debug(
+        `Sidecar check found old=${sidecarFile?.path}, new=${sidecarPath} will ${isChanged ? 'update' : 'do nothing for'} asset ${asset.id}: ${asset.originalPath}`,
+      );
+    } else {
+      this.logger.verbose(`No sidecars found for asset ${asset.id}: ${asset.originalPath}`);
+    }

    if (!isChanged) {
      return JobStatus.Skipped;
@@ -858,9 +862,13 @@ export class MetadataService extends BaseService {
    const result = firstDateTime(exifTags);
    const tag = result?.tag;
    const dateTime = result?.dateTime;
-    this.logger.verbose(
-      `Date and time is ${dateTime} using exifTag ${tag} for asset ${asset.id}: ${asset.originalPath}`,
-    );
+    if (dateTime) {
+      this.logger.verbose(
+        `Date and time is ${dateTime} using exifTag ${tag} for asset ${asset.id}: ${asset.originalPath}`,
+      );
+    } else {
+      this.logger.verbose(`No exif date time information found for asset ${asset.id}: ${asset.originalPath}`);
+    }

    // timezone
    let timeZone = exifTags.tz ?? null;
--- a/server/src/services/plugin.service.ts
+++ b/server/src/services/plugin.service.ts
@@ -6,8 +6,9 @@ import { join } from 'node:path';
 import { Asset, WorkflowAction, WorkflowFilter } from 'src/database';
 import { OnEvent, OnJob } from 'src/decorators';
 import { PluginManifestDto } from 'src/dtos/plugin-manifest.dto';
-import { mapPlugin, PluginResponseDto } from 'src/dtos/plugin.dto';
+import { mapPlugin, PluginResponseDto, PluginTriggerResponseDto } from 'src/dtos/plugin.dto';
 import { JobName, JobStatus, PluginTriggerType, QueueName } from 'src/enum';
+import { pluginTriggers } from 'src/plugins';
 import { ArgOf } from 'src/repositories/event.repository';
 import { BaseService } from 'src/services/base.service';
 import { PluginHostFunctions } from 'src/services/plugin-host.functions';
@@ -50,6 +51,10 @@ export class PluginService extends BaseService {
    await this.loadPlugins();
  }

+  getTriggers(): PluginTriggerResponseDto[] {
+    return pluginTriggers;
+  }
+
  //
  // CRUD operations for plugins
  //
@@ -80,8 +85,8 @@ export class PluginService extends BaseService {
    this.logger.log(`Successfully processed core plugin: ${coreManifest.name} (version ${coreManifest.version})`);

    // Load external plugins
-    if (plugins.enabled && plugins.installFolder) {
-      await this.loadExternalPlugins(plugins.installFolder);
+    if (plugins.external.allow && plugins.external.installFolder) {
+      await this.loadExternalPlugins(plugins.external.installFolder);
    }
  }

--- a/server/src/services/server.service.ts
+++ b/server/src/services/server.service.ts
@@ -115,8 +115,9 @@ export class ServerService extends BaseService {
  }

  async getSystemConfig(): Promise<ServerConfigDto> {
+    const { setup } = this.configRepository.getEnv();
    const config = await this.getConfig({ withCache: false });
-    const isInitialized = await this.userRepository.hasAdmin();
+    const isInitialized = !setup.allow || (await this.userRepository.hasAdmin());
    const onboarding = await this.systemMetadataRepository.get(SystemMetadataKey.AdminOnboarding);

    return {
--- a/server/src/services/shared-link.service.ts
+++ b/server/src/services/shared-link.service.ts
@@ -6,7 +6,6 @@ import { AssetIdsDto } from 'src/dtos/asset.dto';
 import { AuthDto } from 'src/dtos/auth.dto';
 import {
  mapSharedLink,
-  mapSharedLinkWithoutMetadata,
  SharedLinkCreateDto,
  SharedLinkEditDto,
  SharedLinkPasswordDto,
@@ -19,10 +18,10 @@ import { getExternalDomain, OpenGraphTags } from 'src/utils/misc';

@Injectable()
 export class SharedLinkService extends BaseService {
-  async getAll(auth: AuthDto, { albumId }: SharedLinkSearchDto): Promise<SharedLinkResponseDto[]> {
+  async getAll(auth: AuthDto, { id, albumId }: SharedLinkSearchDto): Promise<SharedLinkResponseDto[]> {
    return this.sharedLinkRepository
-      .getAll({ userId: auth.user.id, albumId })
-      .then((links) => links.map((link) => mapSharedLink(link)));
+      .getAll({ userId: auth.user.id, id, albumId })
+      .then((links) => links.map((link) => mapSharedLink(link, { stripAssetMetadata: false })));
  }

  async getMine(auth: AuthDto, dto: SharedLinkPasswordDto): Promise<SharedLinkResponseDto> {
@@ -31,7 +30,7 @@ export class SharedLinkService extends BaseService {
    }

    const sharedLink = await this.findOrFail(auth.user.id, auth.sharedLink.id);
-    const response = this.mapToSharedLink(sharedLink, { withExif: sharedLink.showExif });
+    const response = mapSharedLink(sharedLink, { stripAssetMetadata: !sharedLink.showExif });
    if (sharedLink.password) {
      response.token = this.validateAndRefreshToken(sharedLink, dto);
    }
@@ -41,7 +40,7 @@ export class SharedLinkService extends BaseService {

  async get(auth: AuthDto, id: string): Promise<SharedLinkResponseDto> {
    const sharedLink = await this.findOrFail(auth.user.id, id);
-    return this.mapToSharedLink(sharedLink, { withExif: true });
+    return mapSharedLink(sharedLink, { stripAssetMetadata: false });
  }

  async create(auth: AuthDto, dto: SharedLinkCreateDto): Promise<SharedLinkResponseDto> {
@@ -81,7 +80,7 @@ export class SharedLinkService extends BaseService {
        slug: dto.slug || null,
      });

-      return this.mapToSharedLink(sharedLink, { withExif: true });
+      return mapSharedLink(sharedLink, { stripAssetMetadata: false });
    } catch (error) {
      this.handleError(error);
    }
@@ -108,7 +107,7 @@ export class SharedLinkService extends BaseService {
        showExif: dto.showMetadata,
        slug: dto.slug || null,
      });
-      return this.mapToSharedLink(sharedLink, { withExif: true });
+      return mapSharedLink(sharedLink, { stripAssetMetadata: false });
    } catch (error) {
      this.handleError(error);
    }
@@ -214,10 +213,6 @@ export class SharedLinkService extends BaseService {
    };
  }

-  private mapToSharedLink(sharedLink: SharedLink, { withExif }: { withExif: boolean }) {
-    return withExif ? mapSharedLink(sharedLink) : mapSharedLinkWithoutMetadata(sharedLink);
-  }
-
  private validateAndRefreshToken(sharedLink: SharedLink, dto: SharedLinkPasswordDto): string {
    const token = this.cryptoRepository.hashSha256(`${sharedLink.id}-${sharedLink.password}`);
    const sharedLinkTokens = dto.token?.split(',') || [];
--- a/server/src/services/workflow.service.ts
+++ b/server/src/services/workflow.service.ts
@@ -16,10 +16,10 @@ import { BaseService } from 'src/services/base.service';
@Injectable()
 export class WorkflowService extends BaseService {
  async create(auth: AuthDto, dto: WorkflowCreateDto): Promise<WorkflowResponseDto> {
-    const trigger = this.getTriggerOrFail(dto.triggerType);
+    const context = this.getContextForTrigger(dto.triggerType);

-    const filterInserts = await this.validateAndMapFilters(dto.filters, trigger.context);
-    const actionInserts = await this.validateAndMapActions(dto.actions, trigger.context);
+    const filterInserts = await this.validateAndMapFilters(dto.filters, context);
+    const actionInserts = await this.validateAndMapActions(dto.actions, context);

    const workflow = await this.workflowRepository.createWorkflow(
      {
@@ -56,11 +56,11 @@ export class WorkflowService extends BaseService {
    }

    const workflow = await this.findOrFail(id);
-    const trigger = this.getTriggerOrFail(workflow.triggerType);
+    const context = this.getContextForTrigger(dto.triggerType ?? workflow.triggerType);

    const { filters, actions, ...workflowUpdate } = dto;
-    const filterInserts = filters && (await this.validateAndMapFilters(filters, trigger.context));
-    const actionInserts = actions && (await this.validateAndMapActions(actions, trigger.context));
+    const filterInserts = filters && (await this.validateAndMapFilters(filters, context));
+    const actionInserts = actions && (await this.validateAndMapActions(actions, context));

    const updatedWorkflow = await this.workflowRepository.updateWorkflow(
      id,
@@ -124,12 +124,12 @@ export class WorkflowService extends BaseService {
    }));
  }

-  private getTriggerOrFail(triggerType: PluginTriggerType) {
-    const trigger = pluginTriggers.find((t) => t.type === triggerType);
+  private getContextForTrigger(type: PluginTriggerType) {
+    const trigger = pluginTriggers.find((t) => t.type === type);
    if (!trigger) {
-      throw new BadRequestException(`Invalid trigger type: ${triggerType}`);
+      throw new BadRequestException(`Invalid trigger type: ${type}`);
    }
-    return trigger;
+    return trigger.contextType;
  }

  private async findOrFail(id: string) {
--- a/server/test/medium/specs/services/workflow.service.spec.ts
+++ b/server/test/medium/specs/services/workflow.service.spec.ts
@@ -611,6 +611,100 @@ describe(WorkflowService.name, () => {
        sut.update(auth, created.id, { actions: [{ pluginActionId: factory.uuid(), actionConfig: {} }] }),
      ).rejects.toThrow();
    });
+
+    it('should update trigger type', async () => {
+      const { sut, ctx } = setup();
+      const { user } = await ctx.newUser();
+      const auth = factory.auth({ user });
+
+      const created = await sut.create(auth, {
+        triggerType: PluginTriggerType.PersonRecognized,
+        name: 'test-workflow',
+        description: 'Test',
+        enabled: true,
+        filters: [],
+        actions: [],
+      });
+
+      await sut.update(auth, created.id, {
+        triggerType: PluginTriggerType.AssetCreate,
+      });
+
+      const fetched = await sut.get(auth, created.id);
+      expect(fetched.triggerType).toBe(PluginTriggerType.AssetCreate);
+    });
+
+    it('should add filters', async () => {
+      const { sut, ctx } = setup();
+      const { user } = await ctx.newUser();
+      const auth = factory.auth({ user });
+
+      const created = await sut.create(auth, {
+        triggerType: PluginTriggerType.AssetCreate,
+        name: 'test-workflow',
+        description: 'Test',
+        enabled: true,
+        filters: [],
+        actions: [],
+      });
+
+      await sut.update(auth, created.id, {
+        filters: [
+          { pluginFilterId: testFilterId, filterConfig: { first: true } },
+          { pluginFilterId: testFilterId, filterConfig: { second: true } },
+        ],
+      });
+
+      const fetched = await sut.get(auth, created.id);
+      expect(fetched.filters).toHaveLength(2);
+      expect(fetched.filters[0].filterConfig).toEqual({ first: true });
+      expect(fetched.filters[1].filterConfig).toEqual({ second: true });
+    });
+
+    it('should replace existing filters', async () => {
+      const { sut, ctx } = setup();
+      const { user } = await ctx.newUser();
+      const auth = factory.auth({ user });
+
+      const created = await sut.create(auth, {
+        triggerType: PluginTriggerType.AssetCreate,
+        name: 'test-workflow',
+        description: 'Test',
+        enabled: true,
+        filters: [{ pluginFilterId: testFilterId, filterConfig: { original: true } }],
+        actions: [],
+      });
+
+      await sut.update(auth, created.id, {
+        filters: [{ pluginFilterId: testFilterId, filterConfig: { replaced: true } }],
+      });
+
+      const fetched = await sut.get(auth, created.id);
+      expect(fetched.filters).toHaveLength(1);
+      expect(fetched.filters[0].filterConfig).toEqual({ replaced: true });
+    });
+
+    it('should remove existing filters', async () => {
+      const { sut, ctx } = setup();
+      const { user } = await ctx.newUser();
+      const auth = factory.auth({ user });
+
+      const created = await sut.create(auth, {
+        triggerType: PluginTriggerType.AssetCreate,
+        name: 'test-workflow',
+        description: 'Test',
+        enabled: true,
+        filters: [{ pluginFilterId: testFilterId, filterConfig: { toRemove: true } }],
+        actions: [],
+      });
+
+      await sut.update(auth, created.id, {
+        filters: [],
+      });
+
+      const fetched = await sut.get(auth, created.id);
+      expect(fetched.filters).toHaveLength(0);
+    });
  });

  describe('delete', () => {
--- a/server/test/repositories/config.repository.mock.ts
+++ b/server/test/repositories/config.repository.mock.ts
@@ -75,6 +75,10 @@ const envData: EnvData = {
    corePlugin: '/build/corePlugin',
  },

+  setup: {
+    allow: true,
+  },
+
  storage: {
    ignoreMountCheckErrors: false,
  },
@@ -88,8 +92,10 @@ const envData: EnvData = {
  workers: [ImmichWorker.Api, ImmichWorker.Microservices],

  plugins: {
-    enabled: true,
-    installFolder: '/app/data/plugins',
+    external: {
+      allow: true,
+      installFolder: '/app/data/plugins',
+    },
  },

  noColor: false,
--- a/web/package.json
+++ b/web/package.json
@@ -58,6 +58,7 @@
    "socket.io-client": "~4.8.0",
    "svelte-gestures": "^5.2.2",
    "svelte-i18n": "^4.0.1",
+    "svelte-jsoneditor": "^3.10.0",
    "svelte-maplibre": "^1.2.5",
    "svelte-persisted-store": "^0.12.0",
    "tabbable": "^6.2.0",
--- a/web/src/lib/actions/drag-and-drop.ts
+++ b/web/src/lib/actions/drag-and-drop.ts
@@ -0,0 +1,118 @@
+export interface DragAndDropOptions {
+  index: number;
+  onDragStart?: (index: number) => void;
+  onDragEnter?: (index: number) => void;
+  onDrop?: (e: DragEvent, index: number) => void;
+  onDragEnd?: () => void;
+  isDragging?: boolean;
+  isDragOver?: boolean;
+}
+
+export function dragAndDrop(node: HTMLElement, options: DragAndDropOptions) {
+  let { index, onDragStart, onDragEnter, onDrop, onDragEnd, isDragging, isDragOver } = options;
+
+  const isFormElement = (element: HTMLElement) => {
+    return element.tagName === 'INPUT' || element.tagName === 'TEXTAREA' || element.tagName === 'SELECT';
+  };
+
+  const handleDragStart = (e: DragEvent) => {
+    // Prevent drag if it originated from an input, textarea, or select element
+    const target = e.target as HTMLElement;
+    if (isFormElement(target)) {
+      e.preventDefault();
+      return;
+    }
+    onDragStart?.(index);
+  };
+
+  const handleDragEnter = () => {
+    onDragEnter?.(index);
+  };
+
+  const handleDragOver = (e: DragEvent) => {
+    e.preventDefault();
+  };
+
+  const handleDrop = (e: DragEvent) => {
+    onDrop?.(e, index);
+  };
+
+  const handleDragEnd = () => {
+    onDragEnd?.();
+  };
+
+  // Disable draggable when focusing on form elements (fixes Firefox input interaction)
+  const handleFocusIn = (e: FocusEvent) => {
+    const target = e.target as HTMLElement;
+    if (isFormElement(target)) {
+      node.setAttribute('draggable', 'false');
+    }
+  };
+
+  const handleFocusOut = (e: FocusEvent) => {
+    const target = e.target as HTMLElement;
+    if (isFormElement(target)) {
+      node.setAttribute('draggable', 'true');
+    }
+  };
+
+  node.setAttribute('draggable', 'true');
+  node.setAttribute('role', 'button');
+  node.setAttribute('tabindex', '0');
+
+  node.addEventListener('dragstart', handleDragStart);
+  node.addEventListener('dragenter', handleDragEnter);
+  node.addEventListener('dragover', handleDragOver);
+  node.addEventListener('drop', handleDrop);
+  node.addEventListener('dragend', handleDragEnd);
+  node.addEventListener('focusin', handleFocusIn);
+  node.addEventListener('focusout', handleFocusOut);
+
+  // Update classes based on drag state
+  const updateClasses = (dragging: boolean, dragOver: boolean) => {
+    // Remove all drag-related classes first
+    node.classList.remove('opacity-50', 'border-gray-400', 'dark:border-gray-500', 'border-solid');
+
+    // Add back only the active ones
+    if (dragging) {
+      node.classList.add('opacity-50');
+    }
+
+    if (dragOver) {
+      node.classList.add('border-gray-400', 'dark:border-gray-500', 'border-solid');
+      node.classList.remove('border-transparent');
+    } else {
+      node.classList.add('border-transparent');
+    }
+  };
+
+  updateClasses(isDragging || false, isDragOver || false);
+
+  return {
+    update(newOptions: DragAndDropOptions) {
+      index = newOptions.index;
+      onDragStart = newOptions.onDragStart;
+      onDragEnter = newOptions.onDragEnter;
+      onDrop = newOptions.onDrop;
+      onDragEnd = newOptions.onDragEnd;
+
+      const newIsDragging = newOptions.isDragging || false;
+      const newIsDragOver = newOptions.isDragOver || false;
+
+      if (newIsDragging !== isDragging || newIsDragOver !== isDragOver) {
+        isDragging = newIsDragging;
+        isDragOver = newIsDragOver;
+        updateClasses(isDragging, isDragOver);
+      }
+    },
+    destroy() {
+      node.removeEventListener('dragstart', handleDragStart);
+      node.removeEventListener('dragenter', handleDragEnter);
+      node.removeEventListener('dragover', handleDragOver);
+      node.removeEventListener('drop', handleDrop);
+      node.removeEventListener('dragend', handleDragEnd);
+      node.removeEventListener('focusin', handleFocusIn);
+      node.removeEventListener('focusout', handleFocusOut);
+    },
+  };
+}
--- a/web/src/lib/assets/empty-workflows.svg
+++ b/web/src/lib/assets/empty-workflows.svg
--- a/web/src/lib/attachments/drag-and-drop.svelte.ts
+++ b/web/src/lib/attachments/drag-and-drop.svelte.ts
@@ -0,0 +1,105 @@
+import type { Attachment } from 'svelte/attachments';
+
+export interface DragAndDropOptions {
+  index: number;
+  onDragStart?: (index: number) => void;
+  onDragEnter?: (index: number) => void;
+  onDrop?: (e: DragEvent, index: number) => void;
+  onDragEnd?: () => void;
+  isDragging?: boolean;
+  isDragOver?: boolean;
+}
+
+export function dragAndDrop(options: DragAndDropOptions): Attachment {
+  return (node: Element) => {
+    const element = node as HTMLElement;
+    const { index, onDragStart, onDragEnter, onDrop, onDragEnd, isDragging, isDragOver } = options;
+
+    const isFormElement = (el: HTMLElement) => {
+      return el.tagName === 'INPUT' || el.tagName === 'TEXTAREA' || el.tagName === 'SELECT';
+    };
+
+    const handleDragStart = (e: DragEvent) => {
+      // Prevent drag if it originated from an input, textarea, or select element
+      const target = e.target as HTMLElement;
+      if (isFormElement(target)) {
+        e.preventDefault();
+        return;
+      }
+      onDragStart?.(index);
+    };
+
+    const handleDragEnter = () => {
+      onDragEnter?.(index);
+    };
+
+    const handleDragOver = (e: DragEvent) => {
+      e.preventDefault();
+    };
+
+    const handleDrop = (e: DragEvent) => {
+      onDrop?.(e, index);
+    };
+
+    const handleDragEnd = () => {
+      onDragEnd?.();
+    };
+
+    // Disable draggable when focusing on form elements (fixes Firefox input interaction)
+    const handleFocusIn = (e: FocusEvent) => {
+      const target = e.target as HTMLElement;
+      if (isFormElement(target)) {
+        element.setAttribute('draggable', 'false');
+      }
+    };
+
+    const handleFocusOut = (e: FocusEvent) => {
+      const target = e.target as HTMLElement;
+      if (isFormElement(target)) {
+        element.setAttribute('draggable', 'true');
+      }
+    };
+
+    // Update classes based on drag state
+    const updateClasses = (dragging: boolean, dragOver: boolean) => {
+      // Remove all drag-related classes first
+      element.classList.remove('opacity-50', 'border-light-500', 'border-solid');
+
+      // Add back only the active ones
+      if (dragging) {
+        element.classList.add('opacity-50');
+      }
+
+      if (dragOver) {
+        element.classList.add('border-light-500', 'border-solid');
+        element.classList.remove('border-transparent');
+      } else {
+        element.classList.add('border-transparent');
+      }
+    };
+
+    element.setAttribute('draggable', 'true');
+    element.setAttribute('role', 'button');
+    element.setAttribute('tabindex', '0');
+
+    element.addEventListener('dragstart', handleDragStart);
+    element.addEventListener('dragenter', handleDragEnter);
+    element.addEventListener('dragover', handleDragOver);
+    element.addEventListener('drop', handleDrop);
+    element.addEventListener('dragend', handleDragEnd);
+    element.addEventListener('focusin', handleFocusIn);
+    element.addEventListener('focusout', handleFocusOut);
+
+    updateClasses(isDragging || false, isDragOver || false);
+
+    return () => {
+      element.removeEventListener('dragstart', handleDragStart);
+      element.removeEventListener('dragenter', handleDragEnter);
+      element.removeEventListener('dragover', handleDragOver);
+      element.removeEventListener('drop', handleDrop);
+      element.removeEventListener('dragend', handleDragEnd);
+      element.removeEventListener('focusin', handleFocusIn);
+      element.removeEventListener('focusout', handleFocusOut);
+    };
+  };
+}
--- a/web/src/lib/components/AdminSidebar.svelte
+++ b/web/src/lib/components/AdminSidebar.svelte
@@ -9,7 +9,7 @@
 <div class="h-full flex flex-col justify-between gap-2">
  <div class="flex flex-col pt-8 pe-4 gap-1">
    <NavbarItem title={$t('users')} href={AppRoute.ADMIN_USERS} icon={mdiAccountMultipleOutline} />
-    <NavbarItem title={$t('external_libraries')} href={AppRoute.ADMIN_LIBRARY_MANAGEMENT} icon={mdiBookshelf} />
+    <NavbarItem title={$t('external_libraries')} href={AppRoute.ADMIN_LIBRARIES} icon={mdiBookshelf} />
    <NavbarItem title={$t('admin.queues')} href={AppRoute.ADMIN_QUEUES} icon={mdiTrayFull} />
    <NavbarItem title={$t('settings')} href={AppRoute.ADMIN_SETTINGS} icon={mdiCog} />
    <NavbarItem title={$t('server_stats')} href={AppRoute.ADMIN_STATS} icon={mdiServer} />
--- a/web/src/lib/components/TableButton.svelte
+++ b/web/src/lib/components/TableButton.svelte
@@ -1,14 +1,15 @@
 <script lang="ts">
-  import { IconButton, type ActionItem } from '@immich/ui';
+  import { IconButton, type ActionItem, type Size } from '@immich/ui';

  type Props = {
    action: ActionItem;
+    size?: Size;
  };

-  const { action }: Props = $props();
+  const { action, size }: Props = $props();
  const { title, icon, onAction } = $derived(action);
 </script>

 {#if action.$if?.() ?? true}
-  <IconButton shape="round" color="primary" {icon} aria-label={title} onclick={() => onAction(action)} />
+  <IconButton {size} shape="round" color="primary" {icon} aria-label={title} onclick={() => onAction(action)} />
 {/if}
--- a/web/src/lib/components/album-page/album-card-group.svelte
+++ b/web/src/lib/components/album-page/album-card-group.svelte
@@ -65,7 +65,6 @@
    <div class="grid grid-auto-fill-56 gap-y-4" transition:slide={{ duration: 300 }}>
      {#each albums as album, index (album.id)}
        <a
-          data-sveltekit-preload-data="hover"
          href={resolve(`${AppRoute.ALBUMS}/${album.id}`)}
          animate:flip={{ duration: 400 }}
          oncontextmenu={(event) => oncontextmenu(event, album)}
--- a/web/src/lib/components/album-page/albums-list.svelte
+++ b/web/src/lib/components/album-page/albums-list.svelte
@@ -1,13 +1,9 @@
 <script lang="ts">
-  import { goto } from '$app/navigation';
-  import { resolve } from '$app/paths';
  import AlbumCardGroup from '$lib/components/album-page/album-card-group.svelte';
  import AlbumsTable from '$lib/components/album-page/albums-table.svelte';
  import OnEvents from '$lib/components/OnEvents.svelte';
  import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
  import RightClickContextMenu from '$lib/components/shared-components/context-menu/right-click-context-menu.svelte';
-  import ToastAction from '$lib/components/ToastAction.svelte';
-  import { AppRoute } from '$lib/constants';
  import AlbumEditModal from '$lib/modals/AlbumEditModal.svelte';
  import AlbumShareModal from '$lib/modals/AlbumShareModal.svelte';
  import SharedLinkCreateModal from '$lib/modals/SharedLinkCreateModal.svelte';
@@ -17,8 +13,8 @@
    AlbumGroupBy,
    AlbumSortBy,
    AlbumViewMode,
-    SortOrder,
    locale,
+    SortOrder,
    type AlbumViewSettings,
  } from '$lib/stores/preferences.store';
  import { user } from '$lib/stores/user.store';
@@ -27,8 +23,13 @@
  import type { ContextMenuPosition } from '$lib/utils/context-menu';
  import { handleError } from '$lib/utils/handle-error';
  import { normalizeSearchString } from '$lib/utils/string-utils';
-  import { addUsersToAlbum, type AlbumResponseDto, type AlbumUserAddDto } from '@immich/sdk';
-  import { modalManager, toastManager } from '@immich/ui';
+  import {
+    addUsersToAlbum,
+    type AlbumResponseDto,
+    type AlbumUserAddDto,
+    type SharedLinkResponseDto,
+  } from '@immich/sdk';
+  import { modalManager } from '@immich/ui';
  import { mdiDeleteOutline, mdiDownload, mdiRenameOutline, mdiShareVariantOutline } from '@mdi/js';
  import { groupBy } from 'lodash-es';
  import { onMount, type Snippet } from 'svelte';
@@ -199,10 +200,7 @@

    switch (action) {
      case 'edit': {
-        const editedAlbum = await modalManager.show(AlbumEditModal, { album: selectedAlbum });
-        if (editedAlbum) {
-          successEditAlbumInfo(editedAlbum);
-        }
+        await modalManager.show(AlbumEditModal, { album: selectedAlbum });
        break;
      }

@@ -215,12 +213,7 @@
          }

          case 'sharedLink': {
-            const success = await modalManager.show(SharedLinkCreateModal, { albumId: selectedAlbum.id });
-            if (success) {
-              selectedAlbum.shared = true;
-              selectedAlbum.hasSharedLink = true;
-              updateAlbumInfo(selectedAlbum);
-            }
+            await modalManager.show(SharedLinkCreateModal, { albumId: selectedAlbum.id });
            break;
          }
        }
@@ -244,39 +237,18 @@
    await Promise.allSettled(albumsToRemove.map((album) => handleDeleteAlbum(album, { prompt: false, notify: false })));
  };

-  const updateAlbumInfo = (album: AlbumResponseDto) => {
-    ownedAlbums[ownedAlbums.findIndex(({ id }) => id === album.id)] = album;
-    sharedAlbums[sharedAlbums.findIndex(({ id }) => id === album.id)] = album;
-  };
-
-  const updateRecentAlbumInfo = (album: AlbumResponseDto) => {
-    for (const cachedAlbum of userInteraction.recentAlbums || []) {
-      if (cachedAlbum.id === album.id) {
-        Object.assign(cachedAlbum, { ...cachedAlbum, ...album });
-        break;
-      }
+  const findAndUpdate = (albums: AlbumResponseDto[], album: AlbumResponseDto) => {
+    const target = albums.find(({ id }) => id === album.id);
+    if (target) {
+      Object.assign(target, album);
    }
+
+    return albums;
  };

-  const successEditAlbumInfo = (album: AlbumResponseDto) => {
-    toastManager.custom({
-      component: ToastAction,
-      props: {
-        color: 'primary',
-        title: $t('success'),
-        description: $t('album_info_updated'),
-        button: {
-          text: $t('view_album'),
-          color: 'primary',
-          onClick() {
-            return goto(resolve(`${AppRoute.ALBUMS}/${album.id}`));
-          },
-        },
-      },
-    });
-
-    updateAlbumInfo(album);
-    updateRecentAlbumInfo(album);
+  const onUpdate = (album: AlbumResponseDto) => {
+    ownedAlbums = findAndUpdate(ownedAlbums, album);
+    sharedAlbums = findAndUpdate(sharedAlbums, album);
  };

  const handleAddUsers = async (album: AlbumResponseDto, albumUsers: AlbumUserAddDto[]) => {
@@ -287,19 +259,30 @@
          albumUsers,
        },
      });
-      updateAlbumInfo(updatedAlbum);
+      onUpdate(updatedAlbum);
    } catch (error) {
      handleError(error, $t('errors.unable_to_add_album_users'));
    }
  };

+  const onAlbumUpdate = (album: AlbumResponseDto) => {
+    onUpdate(album);
+    userInteraction.recentAlbums = findAndUpdate(userInteraction.recentAlbums || [], album);
+  };
+
  const onAlbumDelete = (album: AlbumResponseDto) => {
    ownedAlbums = ownedAlbums.filter(({ id }) => id !== album.id);
    sharedAlbums = sharedAlbums.filter(({ id }) => id !== album.id);
  };
+
+  const onSharedLinkCreate = (sharedLink: SharedLinkResponseDto) => {
+    if (sharedLink.album) {
+      onUpdate(sharedLink.album);
+    }
+  };
 </script>

-<OnEvents {onAlbumDelete} />
+<OnEvents {onAlbumUpdate} {onAlbumDelete} {onSharedLinkCreate} />

 {#if albums.length > 0}
  {#if userSettings.view === AlbumViewMode.Cover}
--- a/web/src/lib/components/asset-viewer/actions/share-action.svelte
+++ b/web/src/lib/components/asset-viewer/actions/share-action.svelte
@@ -1,26 +0,0 @@
-<script lang="ts">
-  import SharedLinkCreateModal from '$lib/modals/SharedLinkCreateModal.svelte';
-  import type { AssetResponseDto } from '@immich/sdk';
-  import { IconButton, modalManager } from '@immich/ui';
-  import { mdiShareVariantOutline } from '@mdi/js';
-  import { t } from 'svelte-i18n';
-
-  interface Props {
-    asset: AssetResponseDto;
-  }
-
-  let { asset }: Props = $props();
-
-  const handleClick = async () => {
-    await modalManager.show(SharedLinkCreateModal, { assetIds: [asset.id] });
-  };
-</script>
-
-<IconButton
-  color="secondary"
-  shape="round"
-  variant="ghost"
-  icon={mdiShareVariantOutline}
-  onclick={handleClick}
-  aria-label={$t('share')}
-/>
--- a/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
+++ b/web/src/lib/components/asset-viewer/asset-viewer-nav-bar.svelte
@@ -2,6 +2,7 @@
  import { goto } from '$app/navigation';
  import { resolve } from '$app/paths';
  import CastButton from '$lib/cast/cast-button.svelte';
+  import ActionButton from '$lib/components/ActionButton.svelte';
  import type { OnAction, PreAction } from '$lib/components/asset-viewer/actions/action';
  import AddToAlbumAction from '$lib/components/asset-viewer/actions/add-to-album-action.svelte';
  import AddToStackAction from '$lib/components/asset-viewer/actions/add-to-stack-action.svelte';
@@ -18,14 +19,13 @@
  import SetProfilePictureAction from '$lib/components/asset-viewer/actions/set-profile-picture-action.svelte';
  import SetStackPrimaryAsset from '$lib/components/asset-viewer/actions/set-stack-primary-asset.svelte';
  import SetVisibilityAction from '$lib/components/asset-viewer/actions/set-visibility-action.svelte';
-  import ShareAction from '$lib/components/asset-viewer/actions/share-action.svelte';
  import ShowDetailAction from '$lib/components/asset-viewer/actions/show-detail-action.svelte';
  import UnstackAction from '$lib/components/asset-viewer/actions/unstack-action.svelte';
  import ButtonContextMenu from '$lib/components/shared-components/context-menu/button-context-menu.svelte';
  import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
  import { AppRoute } from '$lib/constants';
  import { featureFlagsManager } from '$lib/managers/feature-flags-manager.svelte';
-  import { handleReplaceAsset } from '$lib/services/asset.service';
+  import { getAssetActions, handleReplaceAsset } from '$lib/services/asset.service';
  import { photoViewerImgElement } from '$lib/stores/assets-store.svelte';
  import { user } from '$lib/stores/user.store';
  import { photoZoomState } from '$lib/stores/zoom-image.store';
@@ -110,6 +110,8 @@
  let isLocked = $derived(asset.visibility === AssetVisibility.Locked);
  let smartSearchEnabled = $derived(featureFlagsManager.value.smartSearch);

+  const { Share } = $derived(getAssetActions($t, asset));
+
  // $: showEditorButton =
  //   isOwner &&
  //   asset.type === AssetTypeEnum.Image &&
@@ -132,9 +134,7 @@
  <div class="flex gap-2 overflow-x-auto dark" data-testid="asset-viewer-navbar-actions">
    <CastButton />

-    {#if !asset.isTrashed && $user && !isLocked}
-      <ShareAction {asset} />
-    {/if}
+    <ActionButton action={Share} />
    {#if asset.isOffline}
      <IconButton
        shape="round"
--- a/web/src/lib/components/layouts/AdminPageLayout.svelte
+++ b/web/src/lib/components/layouts/AdminPageLayout.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
  import PageContent from '$lib/components/layouts/PageContent.svelte';
  import NavigationBar from '$lib/components/shared-components/navigation-bar/navigation-bar.svelte';
-  import AdminSidebar from '$lib/sidebars/AdminSidebar.svelte';
+  import AdminSidebar from '$lib/components/AdminSidebar.svelte';
  import { sidebarStore } from '$lib/stores/sidebar.svelte';
  import type { HeaderButtonActionItem } from '$lib/types';
  import {
--- a/web/src/lib/components/onboarding-page/onboarding-hello.svelte
+++ b/web/src/lib/components/onboarding-page/onboarding-hello.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
  import { serverConfigManager } from '$lib/managers/server-config-manager.svelte';
-  import { OnboardingRole } from '$lib/models/onboarding-role';
  import { user } from '$lib/stores/user.store';
+  import { OnboardingRole } from '$lib/types';
  import { Logo } from '@immich/ui';
  import { t } from 'svelte-i18n';

--- a/web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte
+++ b/web/src/lib/components/shared-components/navigation-bar/account-info-panel.svelte
@@ -78,7 +78,7 @@
      </Button>
      {#if $user.isAdmin}
        <Button
-          href={AppRoute.ADMIN_USERS}
+          href={AppRoute.ADMIN_SETTINGS}
          onclick={onClose}
          shape="round"
          variant="ghost"
--- a/web/src/lib/components/shared-components/upload-asset-preview.svelte
+++ b/web/src/lib/components/shared-components/upload-asset-preview.svelte
@@ -1,9 +1,9 @@
 <script lang="ts">
  import { AppRoute } from '$lib/constants';
-  import type { UploadAsset } from '$lib/models/upload-asset';
-  import { UploadState } from '$lib/models/upload-asset';
  import { locale } from '$lib/stores/preferences.store';
  import { uploadAssetsStore } from '$lib/stores/upload';
+  import type { UploadAsset } from '$lib/types';
+  import { UploadState } from '$lib/types';
  import { getByteUnitString } from '$lib/utils/byte-units';
  import { fileUploadHandler } from '$lib/utils/file-uploader';
  import { Icon } from '@immich/ui';
--- a/web/src/lib/components/timeline/Timeline.svelte
+++ b/web/src/lib/components/timeline/Timeline.svelte
@@ -13,6 +13,7 @@
  import Skeleton from '$lib/elements/Skeleton.svelte';
  import type { DayGroup } from '$lib/managers/timeline-manager/day-group.svelte';
  import { isIntersecting } from '$lib/managers/timeline-manager/internal/intersection-support.svelte';
+  import { focusAsset } from '$lib/components/timeline/actions/focus-actions';
  import type { MonthGroup } from '$lib/managers/timeline-manager/month-group.svelte';
  import { TimelineManager } from '$lib/managers/timeline-manager/timeline-manager.svelte';
  import type { TimelineAsset, TimelineManagerOptions, ViewportTopMonth } from '$lib/managers/timeline-manager/types';
@@ -25,7 +26,7 @@
  import { getTimes, type ScrubberListener } from '$lib/utils/timeline-util';
  import { type AlbumResponseDto, type PersonResponseDto, type UserResponseDto } from '@immich/sdk';
  import { DateTime } from 'luxon';
-  import { onDestroy, onMount, type Snippet } from 'svelte';
+  import { onDestroy, onMount, tick, type Snippet } from 'svelte';
  import type { UpdatePayload } from 'vite';

  interface Props {
@@ -226,6 +227,9 @@
    if (!scrolled) {
      // if the asset is not found, scroll to the top
      timelineManager.scrollTo(0);
+    } else if (scrollTarget) {
+      await tick();
+      focusAsset(scrollTarget);
    }
    invisible = false;
  };
--- a/web/src/lib/components/timeline/actions/focus-actions.ts
+++ b/web/src/lib/components/timeline/actions/focus-actions.ts
@@ -21,11 +21,15 @@ export const focusPreviousAsset = () =>

 const queryHTMLElement = (query: string) => document.querySelector(query) as HTMLElement;

+export const focusAsset = (assetId: string) => {
+  const element = queryHTMLElement(`[data-thumbnail-focus-container][data-asset="${assetId}"]`);
+  element?.focus();
+};
+
 export const setFocusToAsset = (scrollToAsset: (asset: TimelineAsset) => boolean, asset: TimelineAsset) => {
  const scrolled = scrollToAsset(asset);
  if (scrolled) {
-    const element = queryHTMLElement(`[data-thumbnail-focus-container][data-asset="${asset.id}"]`);
-    element?.focus();
+    focusAsset(asset.id);
  }
 };

@@ -71,8 +75,7 @@ export const setFocusTo = async (
    if (!invocation.isStillValid()) {
      return;
    }
-    const element = queryHTMLElement(`[data-thumbnail-focus-container][data-asset="${asset.id}"]`);
-    element?.focus();
+    focusAsset(asset.id);
  }

  invocation.endInvocation();
--- a/web/src/lib/components/user-settings-page/user-api-key-list.svelte
+++ b/web/src/lib/components/user-settings-page/user-api-key-list.svelte
@@ -1,68 +1,47 @@
 <script lang="ts">
+  import OnEvents from '$lib/components/OnEvents.svelte';
+  import TableButton from '$lib/components/TableButton.svelte';
  import { dateFormats } from '$lib/constants';
-  import ApiKeyCreateModal from '$lib/modals/ApiKeyCreateModal.svelte';
-  import ApiKeySecretModal from '$lib/modals/ApiKeySecretModal.svelte';
-  import ApiKeyUpdateModal from '$lib/modals/ApiKeyUpdateModal.svelte';
+  import { getApiKeyActions, getApiKeysActions } from '$lib/services/api-key.service';
  import { locale } from '$lib/stores/preferences.store';
-  import { handleError } from '$lib/utils/handle-error';
-  import { deleteApiKey, getApiKeys, type ApiKeyResponseDto } from '@immich/sdk';
-  import { Button, IconButton, modalManager, toastManager } from '@immich/ui';
-  import { mdiPencilOutline, mdiTrashCanOutline } from '@mdi/js';
+  import { getApiKeys, type ApiKeyResponseDto } from '@immich/sdk';
+  import { Button } from '@immich/ui';
  import { t } from 'svelte-i18n';
  import { fade } from 'svelte/transition';

-  interface Props {
+  type Props = {
    keys: ApiKeyResponseDto[];
-  }
+  };

  let { keys = $bindable() }: Props = $props();

-  async function refreshKeys() {
+  const onApiKeyCreate = async () => {
    keys = await getApiKeys();
-  }
-
-  const handleCreate = async () => {
-    const secret = await modalManager.show(ApiKeyCreateModal);
-
-    if (!secret) {
-      return;
-    }
-
-    await modalManager.show(ApiKeySecretModal, { secret });
-    await refreshKeys();
  };

-  const handleUpdate = async (key: ApiKeyResponseDto) => {
-    const success = await modalManager.show(ApiKeyUpdateModal, {
-      apiKey: key,
-    });
-
-    if (success) {
-      await refreshKeys();
+  const onApiKeyUpdate = (update: ApiKeyResponseDto) => {
+    for (const key of keys) {
+      if (key.id === update.id) {
+        Object.assign(key, update);
+      }
    }
  };

-  const handleDelete = async (key: ApiKeyResponseDto) => {
-    const isConfirmed = await modalManager.showDialog({ prompt: $t('delete_api_key_prompt') });
-    if (!isConfirmed) {
-      return;
-    }
-
-    try {
-      await deleteApiKey({ id: key.id });
-      toastManager.success($t('removed_api_key', { values: { name: key.name } }));
-    } catch (error) {
-      handleError(error, $t('errors.unable_to_remove_api_key'));
-    } finally {
-      await refreshKeys();
-    }
+  const onApiKeyDelete = ({ id }: ApiKeyResponseDto) => {
+    keys = keys.filter((apiKey) => apiKey.id !== id);
  };
+
+  const { Create } = $derived(getApiKeysActions($t));
 </script>

+<OnEvents {onApiKeyCreate} {onApiKeyUpdate} {onApiKeyDelete} />
+
 <section class="my-4">
  <div class="flex flex-col gap-2" in:fade={{ duration: 500 }}>
    <div class="mb-2 flex justify-end">
-      <Button shape="round" size="small" onclick={() => handleCreate()}>{$t('new_api_key')}</Button>
+      <Button leadingIcon={Create.icon} shape="round" size="small" onclick={() => Create.onAction(Create)}
+        >{Create.title}</Button
+      >
    </div>

    {#if keys.length > 0}
@@ -79,6 +58,7 @@
        </thead>
        <tbody class="block w-full overflow-y-auto rounded-md border dark:border-immich-dark-gray">
          {#each keys as key (key.id)}
+            {@const { Update, Delete } = getApiKeyActions($t, key)}
            <tr
              class="flex h-20 w-full place-items-center text-center dark:text-immich-dark-fg even:bg-subtle/20 odd:bg-subtle/80"
            >
@@ -91,22 +71,8 @@
                >{new Date(key.createdAt).toLocaleDateString($locale, dateFormats.settings)}
              </td>
              <td class="flex flex-row flex-wrap justify-center gap-x-2 gap-y-1 w-1/4">
-                <IconButton
-                  shape="round"
-                  color="primary"
-                  icon={mdiPencilOutline}
-                  aria-label={$t('edit_key')}
-                  size="small"
-                  onclick={() => handleUpdate(key)}
-                />
-                <IconButton
-                  shape="round"
-                  color="primary"
-                  icon={mdiTrashCanOutline}
-                  aria-label={$t('delete_key')}
-                  size="small"
-                  onclick={() => handleDelete(key)}
-                />
+                <TableButton action={Update} size="small" />
+                <TableButton action={Delete} size="small" />
              </td>
            </tr>
          {/each}
--- a/web/src/lib/components/utilities-page/utilities-menu.svelte
+++ b/web/src/lib/components/utilities-page/utilities-menu.svelte
@@ -9,6 +9,7 @@
    mdiCrosshairsGps,
    mdiImageSizeSelectLarge,
    mdiLinkEdit,
+    mdiStateMachine,
  } from '@mdi/js';
  import { t } from 'svelte-i18n';

@@ -16,6 +17,7 @@
    { href: AppRoute.DUPLICATES, icon: mdiContentDuplicate, label: $t('review_duplicates') },
    { href: AppRoute.LARGE_FILES, icon: mdiImageSizeSelectLarge, label: $t('review_large_files') },
    { href: AppRoute.GEOLOCATION, icon: mdiCrosshairsGps, label: $t('manage_geolocation') },
+    { href: AppRoute.WORKFLOWS, icon: mdiStateMachine, label: $t('workflows') },
  ];
 </script>

--- a/web/src/lib/components/workflows/SchemaFormFields.svelte
+++ b/web/src/lib/components/workflows/SchemaFormFields.svelte
@@ -0,0 +1,171 @@
+<script lang="ts">
+  import { getComponentDefaultValue, getComponentFromSchema } from '$lib/utils/workflow';
+  import { Field, Input, MultiSelect, Select, Switch, Text } from '@immich/ui';
+  import WorkflowPickerField from './WorkflowPickerField.svelte';
+
+  type Props = {
+    schema: object | null;
+    config: Record<string, unknown>;
+    configKey?: string;
+  };
+
+  let { schema = null, config = $bindable({}), configKey }: Props = $props();
+
+  const components = $derived(getComponentFromSchema(schema));
+
+  // Get the actual config object to work with
+  const actualConfig = $derived(configKey ? (config[configKey] as Record<string, unknown>) || {} : config);
+
+  // Update function that handles nested config
+  const updateConfig = (key: string, value: unknown) => {
+    config = configKey ? { ...config, [configKey]: { ...actualConfig, [key]: value } } : { ...config, [key]: value };
+  };
+
+  const updateConfigBatch = (updates: Record<string, unknown>) => {
+    config = configKey ? { ...config, [configKey]: { ...actualConfig, ...updates } } : { ...config, ...updates };
+  };
+
+  // Derive which keys need initialization (missing from actualConfig)
+  const uninitializedKeys = $derived.by(() => {
+    if (!components) {
+      return [];
+    }
+
+    return Object.entries(components)
+      .filter(([key]) => actualConfig[key] === undefined)
+      .map(([key, component]) => ({ key, component, defaultValue: getComponentDefaultValue(component) }));
+  });
+
+  // Derive the batch updates needed
+  const pendingUpdates = $derived.by(() => {
+    const updates: Record<string, unknown> = {};
+    for (const { key, defaultValue } of uninitializedKeys) {
+      updates[key] = defaultValue;
+    }
+    return updates;
+  });
+
+  // Initialize config namespace if needed
+  $effect(() => {
+    if (configKey && !config[configKey]) {
+      config = { ...config, [configKey]: {} };
+    }
+  });
+
+  // Apply pending config updates
+  $effect(() => {
+    if (Object.keys(pendingUpdates).length > 0) {
+      updateConfigBatch(pendingUpdates);
+    }
+  });
+
+  const isPickerField = (subType: string | undefined) => subType === 'album-picker' || subType === 'people-picker';
+</script>
+
+{#if components}
+  <div class="flex flex-col gap-2">
+    {#each Object.entries(components) as [key, component] (key)}
+      {@const label = component.title || component.label || key}
+
+      <div class="flex flex-col gap-1 border bg-light p-4 rounded-xl">
+        <!-- Select component -->
+        {#if component.type === 'select'}
+          {#if isPickerField(component.subType)}
+            <WorkflowPickerField
+              {component}
+              configKey={key}
+              value={actualConfig[key] as string | string[]}
+              onchange={(value) => updateConfig(key, value)}
+            />
+          {:else}
+            {@const options = component.options?.map((opt) => {
+              return { label: opt.label, value: String(opt.value) };
+            }) || [{ label: 'N/A', value: '' }]}
+            {@const currentValue = actualConfig[key]}
+            {@const selectedItem = options.find((opt) => opt.value === String(currentValue)) ?? options[0]}
+
+            <Field
+              {label}
+              required={component.required}
+              description={component.description}
+              requiredIndicator={component.required}
+            >
+              <Select data={options} onChange={(opt) => updateConfig(key, opt.value)} value={selectedItem} />
+            </Field>
+          {/if}
+
+          <!-- MultiSelect component -->
+        {:else if component.type === 'multiselect'}
+          {#if isPickerField(component.subType)}
+            <WorkflowPickerField
+              {component}
+              configKey={key}
+              value={actualConfig[key] as string | string[]}
+              onchange={(value) => updateConfig(key, value)}
+            />
+          {:else}
+            {@const options = component.options?.map((opt) => {
+              return { label: opt.label, value: String(opt.value) };
+            }) || [{ label: 'N/A', value: '' }]}
+            {@const currentValues = (actualConfig[key] as string[]) ?? []}
+            {@const selectedItems = options.filter((opt) => currentValues.includes(opt.value))}
+
+            <Field
+              {label}
+              required={component.required}
+              description={component.description}
+              requiredIndicator={component.required}
+            >
+              <MultiSelect
+                data={options}
+                onChange={(opt) =>
+                  updateConfig(
+                    key,
+                    opt.map((o) => o.value),
+                  )}
+                values={selectedItems}
+              />
+            </Field>
+          {/if}
+
+          <!-- Switch component -->
+        {:else if component.type === 'switch'}
+          {@const checked = Boolean(actualConfig[key])}
+          <Field
+            {label}
+            description={component.description}
+            requiredIndicator={component.required}
+            required={component.required}
+          >
+            <Switch {checked} onCheckedChange={(check) => updateConfig(key, check)} />
+          </Field>
+
+          <!-- Text input -->
+        {:else if isPickerField(component.subType)}
+          <WorkflowPickerField
+            {component}
+            configKey={key}
+            value={actualConfig[key] as string | string[]}
+            onchange={(value) => updateConfig(key, value)}
+          />
+        {:else}
+          <Field
+            {label}
+            description={component.description}
+            requiredIndicator={component.required}
+            required={component.required}
+          >
+            <Input
+              id={key}
+              value={actualConfig[key] as string}
+              oninput={(e) => updateConfig(key, e.currentTarget.value)}
+              required={component.required}
+            />
+          </Field>
+        {/if}
+      </div>
+    {/each}
+  </div>
+{:else}
+  <Text size="small" color="muted">No configuration required</Text>
+{/if}
--- a/web/src/lib/components/workflows/WorkflowCardConnector.svelte
+++ b/web/src/lib/components/workflows/WorkflowCardConnector.svelte
@@ -0,0 +1,42 @@
+<script lang="ts">
+  type Props = {
+    animated?: boolean;
+  };
+
+  let { animated = true }: Props = $props();
+</script>
+
+<div class="flex justify-center py-2">
+  <div class="relative h-12 w-0.5">
+    <div class="absolute inset-0 bg-linear-to-b from-primary/30 via-primary/50 to-primary/30"></div>
+    {#if animated}
+      <div class="absolute inset-0 bg-linear-to-b from-transparent via-primary to-transparent flow-pulse"></div>
+    {/if}
+    <div class="absolute left-1/2 top-0 -translate-x-1/2 -translate-y-1/2">
+      <div class="h-2 w-2 rounded-full bg-primary shadow-sm shadow-primary/50"></div>
+    </div>
+    <div class="absolute left-1/2 bottom-0 -translate-x-1/2 translate-y-1/2">
+      <div class="h-2 w-2 rounded-full bg-primary shadow-sm shadow-primary/50"></div>
+    </div>
+  </div>
+</div>
+
+<style>
+  @keyframes flow {
+    0% {
+      transform: translateY(-25%);
+      opacity: 0;
+    }
+    50% {
+      opacity: 1;
+    }
+    100% {
+      transform: translateY(25%);
+      opacity: 0;
+    }
+  }
+
+  .flow-pulse {
+    animation: flow 2s ease-in-out infinite;
+  }
+</style>
--- a/web/src/lib/components/workflows/WorkflowJsonEditor.svelte
+++ b/web/src/lib/components/workflows/WorkflowJsonEditor.svelte
@@ -0,0 +1,69 @@
+<script lang="ts">
+  import { themeManager } from '$lib/managers/theme-manager.svelte';
+  import type { WorkflowPayload } from '$lib/services/workflow.service';
+  import { Button, Card, CardBody, CardDescription, CardHeader, CardTitle, Icon, VStack } from '@immich/ui';
+  import { mdiCodeJson } from '@mdi/js';
+  import { JSONEditor, Mode, type Content, type OnChangeStatus } from 'svelte-jsoneditor';
+
+  type Props = {
+    jsonContent: WorkflowPayload;
+    onApply: () => void;
+    onContentChange: (content: WorkflowPayload) => void;
+  };
+
+  let { jsonContent, onApply, onContentChange }: Props = $props();
+
+  let content: Content = $derived({ json: jsonContent });
+  let canApply = $state(false);
+  let editorClass = $derived(themeManager.isDark ? 'jse-theme-dark' : '');
+
+  const handleChange = (updated: Content, _: Content, status: OnChangeStatus) => {
+    if (status.contentErrors) {
+      return;
+    }
+
+    canApply = true;
+
+    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>
+
+<VStack gap={4}>
+  <Card>
+    <CardHeader>
+      <div class="flex items-start justify-between gap-3">
+        <div class="flex items-start gap-3">
+          <Icon icon={mdiCodeJson} size="20" class="mt-1" />
+          <div class="flex flex-col">
+            <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="w-full h-[600px] rounded-lg overflow-hidden border {editorClass}">
+          <JSONEditor {content} onChange={handleChange} mainMenuBar={false} mode={Mode.text} />
+        </div>
+      </VStack>
+    </CardBody>
+  </Card>
+</VStack>
+
+<style>
+  @import 'svelte-jsoneditor/themes/jse-theme-dark.css';
+</style>
--- a/web/src/lib/components/workflows/WorkflowPickerField.svelte
+++ b/web/src/lib/components/workflows/WorkflowPickerField.svelte
@@ -0,0 +1,104 @@
+<script lang="ts">
+  import WorkflowPickerItemCard from '$lib/components/workflows/WorkflowPickerItemCard.svelte';
+  import AlbumPickerModal from '$lib/modals/AlbumPickerModal.svelte';
+  import PeoplePickerModal from '$lib/modals/PeoplePickerModal.svelte';
+  import { fetchPickerMetadata, type PickerMetadata } from '$lib/services/workflow.service';
+  import type { ComponentConfig } from '$lib/utils/workflow';
+  import type { AlbumResponseDto, PersonResponseDto } from '@immich/sdk';
+  import { Button, Field, modalManager } from '@immich/ui';
+  import { mdiPlus } from '@mdi/js';
+  import { t } from 'svelte-i18n';
+
+  type Props = {
+    component: ComponentConfig;
+    configKey: string;
+    value: string | string[] | undefined;
+    onchange: (value: string | string[]) => void;
+  };
+
+  let { component, configKey, value = $bindable(), onchange }: Props = $props();
+
+  const label = $derived(component.title || component.label || configKey);
+  const subType = $derived(component.subType as 'album-picker' | 'people-picker');
+  const isAlbum = $derived(subType === 'album-picker');
+  const multiple = $derived(component.type === 'multiselect' || Array.isArray(value));
+
+  let pickerMetadata = $state<PickerMetadata | undefined>();
+
+  $effect(() => {
+    if (!value) {
+      pickerMetadata = undefined;
+      return;
+    }
+
+    if (!pickerMetadata) {
+      void loadMetadata();
+    }
+  });
+
+  const loadMetadata = async () => {
+    pickerMetadata = await fetchPickerMetadata(value, subType);
+  };
+
+  const handlePicker = async () => {
+    if (isAlbum) {
+      const albums = await modalManager.show(AlbumPickerModal, { shared: false });
+      if (albums && albums.length > 0) {
+        const newValue = multiple ? albums.map((album) => album.id) : albums[0].id;
+        onchange(newValue);
+        pickerMetadata = multiple ? albums : albums[0];
+      }
+    } else {
+      const currentIds = (Array.isArray(value) ? value : []) as string[];
+      const excludedIds = multiple ? currentIds : [];
+      const people = await modalManager.show(PeoplePickerModal, { multiple, excludedIds });
+      if (people && people.length > 0) {
+        const newValue = multiple ? people.map((person) => person.id) : people[0].id;
+        onchange(newValue);
+        pickerMetadata = multiple ? people : people[0];
+      }
+    }
+  };
+
+  const removeSelection = () => {
+    onchange(multiple ? [] : '');
+    pickerMetadata = undefined;
+  };
+
+  const removeItemFromSelection = (itemId: string) => {
+    if (!Array.isArray(value)) {
+      return;
+    }
+
+    const newValue = value.filter((id) => id !== itemId);
+    onchange(newValue);
+
+    if (Array.isArray(pickerMetadata)) {
+      pickerMetadata = pickerMetadata.filter((item) => item.id !== itemId) as AlbumResponseDto[] | PersonResponseDto[];
+    }
+  };
+
+  const getButtonText = () => {
+    if (isAlbum) {
+      return multiple ? $t('select_albums') : $t('select_album');
+    }
+    return multiple ? $t('select_people') : $t('select_person');
+  };
+</script>
+
+<Field {label} required={component.required} description={component.description} requiredIndicator={component.required}>
+  <div class="flex flex-col gap-3">
+    {#if pickerMetadata && !Array.isArray(pickerMetadata)}
+      <WorkflowPickerItemCard item={pickerMetadata} {isAlbum} onRemove={removeSelection} />
+    {:else if pickerMetadata && Array.isArray(pickerMetadata) && pickerMetadata.length > 0}
+      <div class="flex flex-col gap-2">
+        {#each pickerMetadata as item (item.id)}
+          <WorkflowPickerItemCard {item} {isAlbum} onRemove={() => removeItemFromSelection(item.id)} />
+        {/each}
+      </div>
+    {/if}
+    <Button size="small" variant="outline" leadingIcon={mdiPlus} onclick={handlePicker}>
+      {getButtonText()}
+    </Button>
+  </div>
+</Field>
--- a/web/src/lib/components/workflows/WorkflowPickerItemCard.svelte
+++ b/web/src/lib/components/workflows/WorkflowPickerItemCard.svelte
@@ -0,0 +1,57 @@
+<script lang="ts">
+  import { getAssetThumbnailUrl, getPeopleThumbnailUrl } from '$lib/utils';
+  import type { AlbumResponseDto, PersonResponseDto } from '@immich/sdk';
+  import { Card, CardBody, IconButton, Text } from '@immich/ui';
+  import { mdiClose } from '@mdi/js';
+  import { t } from 'svelte-i18n';
+
+  type Props = {
+    item: AlbumResponseDto | PersonResponseDto;
+    isAlbum: boolean;
+    onRemove: () => void;
+  };
+
+  let { item, isAlbum, onRemove }: Props = $props();
+</script>
+
+<Card color="secondary">
+  <CardBody class="flex items-center gap-3">
+    <div class="shrink-0">
+      {#if isAlbum && 'albumThumbnailAssetId' in item}
+        {#if item.albumThumbnailAssetId}
+          <img
+            src={getAssetThumbnailUrl(item.albumThumbnailAssetId)}
+            alt={item.albumName}
+            class="h-12 w-12 rounded-lg object-cover"
+          />
+        {:else}
+          <div class="h-12 w-12 rounded-lg"></div>
+        {/if}
+      {:else if !isAlbum && 'name' in item}
+        <img src={getPeopleThumbnailUrl(item)} alt={item.name} class="h-12 w-12 rounded-full object-cover" />
+      {/if}
+    </div>
+    <div class="min-w-0 flex-1">
+      <Text class="font-semibold truncate">
+        {isAlbum && 'albumName' in item ? item.albumName : 'name' in item ? item.name : ''}
+      </Text>
+      {#if isAlbum && 'assetCount' in item}
+        <Text size="small" color="muted">
+          {$t('items_count', { values: { count: item.assetCount } })}
+        </Text>
+      {/if}
+    </div>
+
+    <IconButton
+      type="button"
+      onclick={onRemove}
+      class="shrink-0"
+      shape="round"
+      aria-label={$t('remove')}
+      icon={mdiClose}
+      size="small"
+      variant="ghost"
+      color="secondary"
+    />
+  </CardBody>
+</Card>
--- a/web/src/lib/components/workflows/WorkflowSummary.svelte
+++ b/web/src/lib/components/workflows/WorkflowSummary.svelte
@@ -0,0 +1,184 @@
+<script lang="ts">
+  import {
+    PluginTriggerType,
+    type PluginActionResponseDto,
+    type PluginFilterResponseDto,
+    type PluginTriggerResponseDto,
+  } from '@immich/sdk';
+  import { Icon, IconButton, Text } from '@immich/ui';
+  import { mdiClose, mdiFilterOutline, mdiFlashOutline, mdiPlayCircleOutline, mdiViewDashboardOutline } from '@mdi/js';
+  import { t } from 'svelte-i18n';
+
+  type Props = {
+    trigger: PluginTriggerResponseDto;
+    filters: PluginFilterResponseDto[];
+    actions: PluginActionResponseDto[];
+  };
+
+  let { trigger, filters, actions }: Props = $props();
+
+  const getTriggerName = (triggerType: PluginTriggerType) => {
+    switch (triggerType) {
+      case PluginTriggerType.AssetCreate: {
+        return $t('trigger_asset_uploaded');
+      }
+      case PluginTriggerType.PersonRecognized: {
+        return $t('trigger_person_recognized');
+      }
+      default: {
+        return triggerType;
+      }
+    }
+  };
+
+  let isOpen = $state(false);
+  let position = $state({ x: 0, y: 0 });
+  let isDragging = $state(false);
+  let dragOffset = $state({ x: 0, y: 0 });
+  let containerEl: HTMLDivElement | undefined = $state();
+
+  const handleMouseDown = (e: MouseEvent) => {
+    if (!containerEl) {
+      return;
+    }
+    isDragging = true;
+    const rect = containerEl.getBoundingClientRect();
+    dragOffset = {
+      x: e.clientX - rect.left,
+      y: e.clientY - rect.top,
+    };
+    document.addEventListener('mousemove', handleMouseMove);
+    document.addEventListener('mouseup', handleMouseUp);
+  };
+
+  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}
+  <!-- svelte-ignore a11y_no_static_element_interactions -->
+  <div
+    bind:this={containerEl}
+    class="hidden sm:block fixed w-64 hover:cursor-grab select-none"
+    style="left: {position.x}px; top: {position.y}px;"
+    class:cursor-grabbing={isDragging}
+    onmousedown={handleMouseDown}
+  >
+    <div
+      class="rounded-xl border-transparent border-2 hover:shadow-xl hover:border-dashed bg-light-50 shadow-sm p-4 hover:border-light-300 transition-all"
+    >
+      <div class="flex items-center justify-between mb-4 cursor-grab select-none">
+        <Text size="small" class="font-semibold">{$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 bg-light-100 border p-3">
+          <div class="flex items-center gap-2 mb-1">
+            <Icon icon={mdiFlashOutline} size="18" class="text-primary" />
+            <span class="text-[10px] font-semibold uppercase tracking-wide">{$t('trigger')}</span>
+          </div>
+          <p class="text-sm truncate pl-5">{getTriggerName(trigger.type)}</p>
+        </div>
+
+        <!-- Connector -->
+        <div class="flex justify-center">
+          <div class="w-0.5 h-3 bg-light-400"></div>
+        </div>
+
+        <!-- Filters -->
+        {#if filters.length > 0}
+          <div class="rounded-lg bg-light-100 border p-3">
+            <div class="flex items-center gap-2 mb-2">
+              <Icon icon={mdiFilterOutline} size="18" class="text-warning" />
+              <span class="text-[10px] font-semibold uppercase tracking-wide">{$t('filters')}</span>
+            </div>
+            <div class="space-y-1 pl-5">
+              {#each filters as filter, index (index)}
+                <div class="flex items-center gap-2">
+                  <span
+                    class="shrink-0 h-4 w-4 rounded-full bg-light-200 text-[10px] font-medium flex items-center justify-center"
+                    >{index + 1}</span
+                  >
+                  <p class="text-sm truncate">{filter.title}</p>
+                </div>
+              {/each}
+            </div>
+          </div>
+
+          <!-- Connector -->
+          <div class="flex justify-center">
+            <div class="w-0.5 h-3 bg-light-400"></div>
+          </div>
+        {/if}
+
+        <!-- Actions -->
+        {#if actions.length > 0}
+          <div class="rounded-lg bg-light-100 border p-3">
+            <div class="flex items-center gap-2 mb-2">
+              <Icon icon={mdiPlayCircleOutline} size="18" class="text-success" />
+              <span class="text-[10px] font-semibold uppercase tracking-wide">{$t('actions')}</span>
+            </div>
+            <div class="space-y-1 pl-5">
+              {#each actions as action, index (index)}
+                <div class="flex items-center gap-2">
+                  <span
+                    class="shrink-0 h-4 w-4 rounded-full bg-light-200 text-[10px] font-medium flex items-center justify-center"
+                    >{index + 1}</span
+                  >
+                  <p class="text-sm truncate">{action.title}</p>
+                </div>
+              {/each}
+            </div>
+          </div>
+        {/if}
+      </div>
+    </div>
+  </div>
+{:else}
+  <button
+    type="button"
+    class="hidden sm:flex fixed right-6 bottom-6 h-14 w-14 items-center justify-center rounded-full bg-primary text-light shadow-lg hover:bg-primary/90 transition-colors"
+    title={$t('workflow_summary')}
+    onclick={() => (isOpen = true)}
+  >
+    <Icon icon={mdiViewDashboardOutline} size="24" />
+  </button>
+{/if}
--- a/web/src/lib/components/workflows/WorkflowTriggerCard.svelte
+++ b/web/src/lib/components/workflows/WorkflowTriggerCard.svelte
@@ -0,0 +1,80 @@
+<script lang="ts">
+  import { PluginTriggerType, type PluginTriggerResponseDto } from '@immich/sdk';
+  import { Icon, Text } from '@immich/ui';
+  import { mdiFaceRecognition, mdiFileUploadOutline, mdiLightningBolt } from '@mdi/js';
+  import { t } from 'svelte-i18n';
+
+  type Props = {
+    trigger: PluginTriggerResponseDto;
+    selected: boolean;
+    onclick: () => void;
+  };
+
+  let { trigger, selected, onclick }: Props = $props();
+
+  const getTriggerIcon = (triggerType: PluginTriggerType) => {
+    switch (triggerType) {
+      case PluginTriggerType.AssetCreate: {
+        return mdiFileUploadOutline;
+      }
+      case PluginTriggerType.PersonRecognized: {
+        return mdiFaceRecognition;
+      }
+      default: {
+        return mdiLightningBolt;
+      }
+    }
+  };
+
+  const getTriggerName = (triggerType: PluginTriggerType) => {
+    switch (triggerType) {
+      case PluginTriggerType.AssetCreate: {
+        return $t('trigger_asset_uploaded');
+      }
+      case PluginTriggerType.PersonRecognized: {
+        return $t('trigger_person_recognized');
+      }
+      default: {
+        return triggerType;
+      }
+    }
+  };
+
+  const getTriggerDescription = (triggerType: PluginTriggerType) => {
+    switch (triggerType) {
+      case PluginTriggerType.AssetCreate: {
+        return $t('trigger_asset_uploaded_description');
+      }
+      case PluginTriggerType.PersonRecognized: {
+        return $t('trigger_person_recognized_description');
+      }
+      default: {
+        return '';
+      }
+    }
+  };
+</script>
+
+<button
+  type="button"
+  {onclick}
+  class="group rounded-xl p-4 w-full text-left cursor-pointer border-2 {selected
+    ? 'border-primary text-primary'
+    : 'border-light-100 hover:border-light-200 text-light-400 hover:text-light-700'}"
+>
+  <div class="flex items-center gap-3">
+    <div
+      class="rounded-xl p-2 {selected
+        ? 'bg-primary text-light'
+        : 'text-light-100 bg-light-300 group-hover:bg-light-500'}"
+    >
+      <Icon icon={getTriggerIcon(trigger.type)} size="24" />
+    </div>
+    <div class="flex-1">
+      <Text class="font-semibold mb-1">{getTriggerName(trigger.type)}</Text>
+      {#if getTriggerDescription(trigger.type)}
+        <Text size="small">{getTriggerDescription(trigger.type)}</Text>
+      {/if}
+    </div>
+  </div>
+</button>
--- a/web/src/lib/constants.ts
+++ b/web/src/lib/constants.ts
@@ -1,3 +1,5 @@
+export const UUID_REGEX = /^[\dA-Fa-f]{8}(?:\b-[\dA-Fa-f]{4}){3}\b-[\dA-Fa-f]{12}$/;
+
 export enum AssetAction {
  ARCHIVE = 'archive',
  UNARCHIVE = 'unarchive',
@@ -20,7 +22,9 @@ export enum AssetAction {

 export enum AppRoute {
  ADMIN_USERS = '/admin/users',
-  ADMIN_LIBRARY_MANAGEMENT = '/admin/library-management',
+  ADMIN_USERS_NEW = '/admin/users/new',
+  ADMIN_LIBRARIES = '/admin/library-management',
+  ADMIN_LIBRARIES_NEW = '/admin/library-management/new',
  ADMIN_SETTINGS = '/admin/system-settings',
  ADMIN_STATS = '/admin/server-status',
  ADMIN_QUEUES = '/admin/queues',
@@ -55,6 +59,7 @@ export enum AppRoute {
  DUPLICATES = '/utilities/duplicates',
  LARGE_FILES = '/utilities/large-files',
  GEOLOCATION = '/utilities/geolocation',
+  WORKFLOWS = '/utilities/workflows',

  FOLDERS = '/folders',
  TAGS = '/tags',
--- a/web/src/lib/managers/event-manager.svelte.ts
+++ b/web/src/lib/managers/event-manager.svelte.ts
@@ -2,12 +2,14 @@ import type { ThemeSetting } from '$lib/managers/theme-manager.svelte';
 import type { ReleaseEvent } from '$lib/types';
 import type {
  AlbumResponseDto,
+  ApiKeyResponseDto,
  LibraryResponseDto,
  LoginResponseDto,
  QueueResponseDto,
  SharedLinkResponseDto,
  SystemConfigDto,
  UserAdminResponseDto,
+  WorkflowResponseDto,
 } from '@immich/sdk';

 export type Events = {
@@ -18,8 +20,13 @@ export type Events = {
  LanguageChange: [{ name: string; code: string; rtl?: boolean }];
  ThemeChange: [ThemeSetting];

+  ApiKeyCreate: [ApiKeyResponseDto];
+  ApiKeyUpdate: [ApiKeyResponseDto];
+  ApiKeyDelete: [ApiKeyResponseDto];
+
  AssetReplace: [{ oldAssetId: string; newAssetId: string }];

+  AlbumUpdate: [AlbumResponseDto];
  AlbumDelete: [AlbumResponseDto];

  QueueUpdate: [QueueResponseDto];
@@ -42,6 +49,9 @@ export type Events = {
  LibraryUpdate: [LibraryResponseDto];
  LibraryDelete: [{ id: string }];

+  WorkflowUpdate: [WorkflowResponseDto];
+  WorkflowDelete: [WorkflowResponseDto];
+
  ReleaseEvent: [ReleaseEvent];
 };

--- a/web/src/lib/modals/AddWorkflowStepModal.svelte
+++ b/web/src/lib/modals/AddWorkflowStepModal.svelte
@@ -0,0 +1,80 @@
+<script lang="ts">
+  import type { PluginActionResponseDto, PluginFilterResponseDto } from '@immich/sdk';
+  import { Modal, ModalBody, Text } from '@immich/ui';
+  import { mdiFilterOutline, mdiPlayCircleOutline } from '@mdi/js';
+  import { t } from 'svelte-i18n';
+
+  type Props = {
+    filters: PluginFilterResponseDto[];
+    actions: PluginActionResponseDto[];
+    onClose: (result?: { type: 'filter' | 'action'; item: PluginFilterResponseDto | PluginActionResponseDto }) => void;
+    type?: 'filter' | 'action';
+  };
+
+  let { filters, actions, onClose, type }: Props = $props();
+
+  type StepType = 'filter' | 'action';
+
+  const handleSelect = (type: StepType, item: PluginFilterResponseDto | PluginActionResponseDto) => {
+    onClose({ type, item });
+  };
+
+  const getModalTitle = () => {
+    if (type === 'filter') {
+      return $t('add_filter');
+    } else if (type === 'action') {
+      return $t('add_action');
+    } else {
+      return $t('add_workflow_step');
+    }
+  };
+
+  const getModalIcon = () => {
+    if (type === 'filter') {
+      return mdiFilterOutline;
+    } else if (type === 'action') {
+      return mdiPlayCircleOutline;
+    } else {
+      return false;
+    }
+  };
+</script>
+
+{#snippet stepButton(title: string, description?: string, onclick?: () => void)}
+  <button
+    type="button"
+    {onclick}
+    class="flex items-start gap-3 p-3 rounded-lg text-left bg-light-100 hover:border-primary border text-dark"
+  >
+    <div class="flex-1">
+      <Text color="primary" class="font-medium">{title}</Text>
+      {#if description}
+        <Text size="small" class="mt-1">{description}</Text>
+      {/if}
+    </div>
+  </button>
+{/snippet}
+
+<Modal title={getModalTitle()} icon={getModalIcon()} onClose={() => onClose()}>
+  <ModalBody>
+    <div class="space-y-6">
+      <!-- Filters Section -->
+      {#if filters.length > 0 && (!type || type === 'filter')}
+        <div class="grid grid-cols-1 gap-2">
+          {#each filters as filter (filter.id)}
+            {@render stepButton(filter.title, filter.description, () => handleSelect('filter', filter))}
+          {/each}
+        </div>
+      {/if}
+
+      <!-- Actions Section -->
+      {#if actions.length > 0 && (!type || type === 'action')}
+        <div class="grid grid-cols-1 gap-2">
+          {#each actions as action (action.id)}
+            {@render stepButton(action.title, action.description, () => handleSelect('action', action))}
+          {/each}
+        </div>
+      {/if}
+    </div>
+  </ModalBody>
+</Modal>
--- a/web/src/lib/modals/AlbumEditModal.svelte
+++ b/web/src/lib/modals/AlbumEditModal.svelte
@@ -1,63 +1,41 @@
 <script lang="ts">
  import AlbumCover from '$lib/components/album-page/album-cover.svelte';
-  import { handleError } from '$lib/utils/handle-error';
-  import { updateAlbumInfo, type AlbumResponseDto } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, Textarea } from '@immich/ui';
+  import { handleUpdateAlbum } from '$lib/services/album.service';
+  import { type AlbumResponseDto } from '@immich/sdk';
+  import { Field, FormModal, Input, Textarea } from '@immich/ui';
  import { mdiRenameOutline } from '@mdi/js';
  import { t } from 'svelte-i18n';

  type Props = {
    album: AlbumResponseDto;
-    onClose: (album?: AlbumResponseDto) => void;
+    onClose: () => void;
  };

-  let { album = $bindable(), onClose }: Props = $props();
+  let { album, onClose }: Props = $props();

  let albumName = $state(album.albumName);
  let description = $state(album.description);
-  let isSubmitting = $state(false);

-  const handleSubmit = async (event: Event) => {
-    event.preventDefault();
-
-    isSubmitting = true;
-
-    try {
-      await updateAlbumInfo({ id: album.id, updateAlbumDto: { albumName, description } });
-      album.albumName = albumName;
-      album.description = description;
-      onClose(album);
-    } catch (error) {
-      handleError(error, $t('errors.unable_to_update_album_info'));
-    } finally {
-      isSubmitting = false;
+  const onSubmit = async () => {
+    const success = await handleUpdateAlbum(album, { albumName, description });
+    if (success) {
+      onClose();
    }
  };
 </script>

-<Modal icon={mdiRenameOutline} title={$t('edit_album')} size="medium" {onClose}>
-  <ModalBody>
-    <form onsubmit={handleSubmit} autocomplete="off" id="edit-album-form">
-      <div class="flex items-center gap-8 m-4">
-        <AlbumCover {album} class="h-50 w-50 shadow-lg hidden sm:flex" />
+<FormModal icon={mdiRenameOutline} title={$t('edit_album')} size="medium" {onClose} {onSubmit}>
+  <div class="flex items-center gap-8 m-4">
+    <AlbumCover {album} class="h-50 w-50 shadow-lg hidden sm:flex" />

-        <div class="grow flex flex-col gap-4">
-          <Field label={$t('name')}>
-            <Input bind:value={albumName} />
-          </Field>
+    <div class="grow flex flex-col gap-4">
+      <Field label={$t('name')}>
+        <Input bind:value={albumName} />
+      </Field>

-          <Field label={$t('description')}>
-            <Textarea bind:value={description} />
-          </Field>
-        </div>
-      </div>
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button shape="round" type="submit" fullWidth disabled={isSubmitting} form="edit-album-form">{$t('save')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+      <Field label={$t('description')}>
+        <Textarea bind:value={description} />
+      </Field>
+    </div>
+  </div>
+</FormModal>
--- a/web/src/lib/modals/ApiKeyCreateModal.svelte
+++ b/web/src/lib/modals/ApiKeyCreateModal.svelte
@@ -1,12 +1,12 @@
 <script lang="ts">
  import ApiKeyPermissionsPicker from '$lib/components/ApiKeyPermissionsPicker.svelte';
-  import { handleError } from '$lib/utils/handle-error';
-  import { createApiKey, Permission } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, toastManager } from '@immich/ui';
+  import { handleCreateApiKey } from '$lib/services/api-key.service';
+  import { Permission } from '@immich/sdk';
+  import { Field, FormModal, Input } from '@immich/ui';
  import { mdiKeyVariant } from '@mdi/js';
  import { t } from 'svelte-i18n';

-  type Props = { onClose: (secret?: string) => void };
+  type Props = { onClose: () => void };

  const { onClose }: Props = $props();

@@ -14,47 +14,22 @@
  let selectedPermissions = $state<Permission[]>([]);
  const isAllPermissions = $derived(selectedPermissions.length === Object.keys(Permission).length - 1);

-  const onsubmit = async () => {
-    if (!name) {
-      toastManager.warning($t('api_key_empty'));
-      return;
-    }
-
-    if (selectedPermissions.length === 0) {
-      toastManager.warning($t('permission_empty'));
-      return;
-    }
-
-    try {
-      const { secret } = await createApiKey({
-        apiKeyCreateDto: {
-          name,
-          permissions: isAllPermissions ? [Permission.All] : selectedPermissions,
-        },
-      });
-      onClose(secret);
-    } catch (error) {
-      handleError(error, $t('errors.unable_to_create_api_key'));
+  const onSubmit = async () => {
+    const success = await handleCreateApiKey({
+      name,
+      permissions: isAllPermissions ? [Permission.All] : selectedPermissions,
+    });
+    if (success) {
+      onClose();
    }
  };
 </script>

-<Modal title={$t('new_api_key')} icon={mdiKeyVariant} {onClose} size="giant">
-  <ModalBody>
-    <form {onsubmit} autocomplete="off" id="api-key-form">
-      <div class="mb-4 flex flex-col gap-2">
-        <Field label={$t('name')}>
-          <Input bind:value={name} />
-        </Field>
-      </div>
-      <ApiKeyPermissionsPicker bind:selectedPermissions />
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button shape="round" type="submit" fullWidth form="api-key-form">{$t('create')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+<FormModal title={$t('new_api_key')} icon={mdiKeyVariant} {onClose} {onSubmit} submitText={$t('create')} size="giant">
+  <div class="mb-4 flex flex-col gap-2">
+    <Field label={$t('name')}>
+      <Input bind:value={name} />
+    </Field>
+  </div>
+  <ApiKeyPermissionsPicker bind:selectedPermissions />
+</FormModal>
--- a/web/src/lib/modals/ApiKeyUpdateModal.svelte
+++ b/web/src/lib/modals/ApiKeyUpdateModal.svelte
@@ -1,69 +1,44 @@
 <script lang="ts">
  import ApiKeyPermissionsPicker from '$lib/components/ApiKeyPermissionsPicker.svelte';
-  import { handleError } from '$lib/utils/handle-error';
-  import { Permission, updateApiKey } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, toastManager } from '@immich/ui';
+  import { handleUpdateApiKey } from '$lib/services/api-key.service';
+  import { Permission } from '@immich/sdk';
+  import { Field, FormModal, Input } from '@immich/ui';
  import { mdiKeyVariant } from '@mdi/js';
  import { t } from 'svelte-i18n';

-  interface Props {
+  type Props = {
    apiKey: { id: string; name: string; permissions: Permission[] };
-    onClose: (success?: true) => void;
-  }
+    onClose: () => void;
+  };

  let { apiKey, onClose }: Props = $props();

+  const isAllPermissions = (permissions: Permission[]) => permissions.length === Object.keys(Permission).length - 1;
+
  const mapPermissions = (permissions: Permission[]) =>
    permissions.includes(Permission.All)
      ? Object.values(Permission).filter((permission) => permission !== Permission.All)
      : permissions;
-  const isAllPermissions = (permissions: Permission[]) => permissions.length === Object.keys(Permission).length - 1;

  let name = $state(apiKey.name);
  let selectedPermissions = $state<Permission[]>(mapPermissions(apiKey.permissions));

-  const onsubmit = async () => {
-    if (!name) {
-      toastManager.warning($t('api_key_empty'));
-      return;
-    }
-    if (selectedPermissions.length === 0) {
-      toastManager.warning($t('permission_empty'));
-      return;
-    }
-
-    try {
-      await updateApiKey({
-        id: apiKey.id,
-        apiKeyUpdateDto: {
-          name,
-          permissions: isAllPermissions(selectedPermissions) ? [Permission.All] : selectedPermissions,
-        },
-      });
-      toastManager.success($t('saved_api_key'));
-      onClose(true);
-    } catch (error) {
-      handleError(error, $t('errors.unable_to_save_api_key'));
+  const onSubmit = async () => {
+    const success = await handleUpdateApiKey(apiKey, {
+      name,
+      permissions: isAllPermissions(selectedPermissions) ? [Permission.All] : selectedPermissions,
+    });
+    if (success) {
+      onClose();
    }
  };
 </script>

-<Modal title={$t('api_key')} icon={mdiKeyVariant} {onClose} size="giant">
-  <ModalBody>
-    <form {onsubmit} autocomplete="off" id="api-key-form">
-      <div class="mb-4 flex flex-col gap-2">
-        <Field label={$t('name')}>
-          <Input bind:value={name} />
-        </Field>
-      </div>
-      <ApiKeyPermissionsPicker bind:selectedPermissions />
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button shape="round" type="submit" fullWidth form="api-key-form">{$t('save')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+<FormModal title={$t('api_key')} icon={mdiKeyVariant} {onClose} {onSubmit} size="giant">
+  <div class="mb-4 flex flex-col gap-2">
+    <Field label={$t('name')}>
+      <Input bind:value={name} />
+    </Field>
+  </div>
+  <ApiKeyPermissionsPicker bind:selectedPermissions />
+</FormModal>
--- a/web/src/lib/modals/AssetTagModal.svelte
+++ b/web/src/lib/modals/AssetTagModal.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
  import { tagAssets } from '$lib/utils/asset-utils';
  import { getAllTags, upsertTags, type TagResponseDto } from '@immich/sdk';
-  import { Button, HStack, Icon, Modal, ModalBody, ModalFooter } from '@immich/ui';
+  import { FormModal, Icon } from '@immich/ui';
  import { mdiClose, mdiTag } from '@mdi/js';
  import { onMount } from 'svelte';
  import { t } from 'svelte-i18n';
@@ -25,7 +25,11 @@
    allTags = await getAllTags();
  });

-  const handleSubmit = async () => {
+  const onSubmit = async () => {
+    if (selectedIds.size === 0) {
+      return;
+    }
+
    await tagAssets({ tagIds: [...selectedIds], assetIds, showNotification: false });
    onClose(true);
  };
@@ -47,60 +51,52 @@
  const handleRemove = (tag: string) => {
    selectedIds.delete(tag);
  };
-
-  const onsubmit = async (event: Event) => {
-    event.preventDefault();
-    await handleSubmit();
-  };
 </script>

-<Modal size="small" title={$t('tag_assets')} icon={mdiTag} {onClose}>
-  <ModalBody>
-    <form {onsubmit} autocomplete="off" id="create-tag-form">
-      <div class="my-4 flex flex-col gap-2">
-        <Combobox
-          onSelect={handleSelect}
-          label={$t('tag')}
-          {allowCreate}
-          defaultFirstOption
-          options={allTags.map((tag) => ({ id: tag.id, label: tag.value, value: tag.id }))}
-          placeholder={$t('search_tags')}
-          forceFocus
-        />
-      </div>
-    </form>
+<FormModal
+  size="small"
+  title={$t('tag_assets')}
+  icon={mdiTag}
+  {onClose}
+  {onSubmit}
+  submitText={$t('tag_assets')}
+  {disabled}
+>
+  <div class="my-4 flex flex-col gap-2">
+    <Combobox
+      onSelect={handleSelect}
+      label={$t('tag')}
+      {allowCreate}
+      defaultFirstOption
+      options={allTags.map((tag) => ({ id: tag.id, label: tag.value, value: tag.id }))}
+      placeholder={$t('search_tags')}
+      forceFocus
+    />
+  </div>

-    <section class="flex flex-wrap pt-2 gap-1">
-      {#each selectedIds as tagId (tagId)}
-        {@const tag = tagMap[tagId]}
-        {#if tag}
-          <div class="flex group transition-all">
-            <span
-              class="inline-block h-min whitespace-nowrap ps-3 pe-1 group-hover:ps-3 py-1 text-center align-baseline leading-none text-gray-100 dark:text-immich-dark-gray bg-primary roudned-s-full hover:bg-immich-primary/80 dark:hover:bg-immich-dark-primary/80 transition-all"
-            >
-              <p class="text-sm">
-                {tag.value}
-              </p>
-            </span>
+  <section class="flex flex-wrap pt-2 gap-1">
+    {#each selectedIds as tagId (tagId)}
+      {@const tag = tagMap[tagId]}
+      {#if tag}
+        <div class="flex group transition-all">
+          <span
+            class="inline-block h-min whitespace-nowrap ps-3 pe-1 group-hover:ps-3 py-1 text-center align-baseline leading-none text-gray-100 dark:text-immich-dark-gray bg-primary roudned-s-full hover:bg-immich-primary/80 dark:hover:bg-immich-dark-primary/80 transition-all"
+          >
+            <p class="text-sm">
+              {tag.value}
+            </p>
+          </span>

-            <button
-              type="button"
-              class="text-gray-100 dark:text-immich-dark-gray bg-immich-primary/95 dark:bg-immich-dark-primary/95 rounded-e-full place-items-center place-content-center pe-2 ps-1 py-1 hover:bg-immich-primary/80 dark:hover:bg-immich-dark-primary/80 transition-all"
-              title={$t('remove_tag')}
-              onclick={() => handleRemove(tagId)}
-            >
-              <Icon icon={mdiClose} />
-            </button>
-          </div>
-        {/if}
-      {/each}
-    </section>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" fullWidth color="secondary" onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button type="submit" shape="round" fullWidth form="create-tag-form" {disabled}>{$t('tag_assets')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+          <button
+            type="button"
+            class="text-gray-100 dark:text-immich-dark-gray bg-immich-primary/95 dark:bg-immich-dark-primary/95 rounded-e-full place-items-center place-content-center pe-2 ps-1 py-1 hover:bg-immich-primary/80 dark:hover:bg-immich-dark-primary/80 transition-all"
+            title={$t('remove_tag')}
+            onclick={() => handleRemove(tagId)}
+          >
+            <Icon icon={mdiClose} />
+          </button>
+        </div>
+      {/if}
+    {/each}
+  </section>
+</FormModal>
--- a/web/src/lib/modals/LibraryExclusionPatternAddModal.svelte
+++ b/web/src/lib/modals/LibraryExclusionPatternAddModal.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
  import { handleAddLibraryExclusionPattern } from '$lib/services/library.service';
  import type { LibraryResponseDto } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, Text } from '@immich/ui';
+  import { Field, FormModal, Input, Text } from '@immich/ui';
  import { mdiFolderSync } from '@mdi/js';
  import { t } from 'svelte-i18n';

@@ -11,33 +11,26 @@
  };

  const { library, onClose }: Props = $props();
-  let exclusionPattern = $state('');
+  let value = $state('');

-  const onsubmit = async () => {
-    const success = await handleAddLibraryExclusionPattern(library, exclusionPattern);
+  const onSubmit = async () => {
+    const success = await handleAddLibraryExclusionPattern(library, value);
    if (success) {
      onClose();
    }
  };
 </script>

-<Modal title={$t('add_exclusion_pattern')} icon={mdiFolderSync} {onClose} size="small">
-  <ModalBody>
-    <form {onsubmit} autocomplete="off" id="library-exclusion-pattern-form">
-      <Text size="small" class="mb-4">{$t('admin.exclusion_pattern_description')}</Text>
-
-      <Field label={$t('pattern')}>
-        <Input bind:value={exclusionPattern} />
-      </Field>
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button shape="round" type="submit" fullWidth form="library-exclusion-pattern-form">
-        {$t('add')}
-      </Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+<FormModal
+  title={$t('add_exclusion_pattern')}
+  icon={mdiFolderSync}
+  {onClose}
+  {onSubmit}
+  submitText={$t('add')}
+  size="small"
+>
+  <Text size="small" class="mb-4">{$t('admin.exclusion_pattern_description')}</Text>
+  <Field label={$t('pattern')}>
+    <Input bind:value />
+  </Field>
+</FormModal>
--- a/web/src/lib/modals/LibraryExclusionPatternEditModal.svelte
+++ b/web/src/lib/modals/LibraryExclusionPatternEditModal.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
  import { handleEditExclusionPattern } from '$lib/services/library.service';
  import type { LibraryResponseDto } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, Text } from '@immich/ui';
+  import { Field, FormModal, Input, Text } from '@immich/ui';
  import { mdiFolderSync } from '@mdi/js';
  import { t } from 'svelte-i18n';

@@ -11,35 +11,20 @@
    onClose: () => void;
  };

-  const { library, exclusionPattern, onClose }: Props = $props();
+  const { library, exclusionPattern: oldValue, onClose }: Props = $props();
+  let newValue = $state(oldValue);

-  let newExclusionPattern = $state(exclusionPattern);
-
-  const onsubmit = async () => {
-    const success = await handleEditExclusionPattern(library, exclusionPattern, newExclusionPattern);
+  const onSubmit = async () => {
+    const success = await handleEditExclusionPattern(library, oldValue, newValue);
    if (success) {
      onClose();
    }
  };
 </script>

-<Modal title={$t('edit_exclusion_pattern')} icon={mdiFolderSync} {onClose} size="small">
-  <ModalBody>
-    <form {onsubmit} autocomplete="off" id="library-exclusion-pattern-form">
-      <Text size="small" class="mb-4">{$t('admin.exclusion_pattern_description')}</Text>
-
-      <Field label={$t('pattern')}>
-        <Input bind:value={newExclusionPattern} />
-      </Field>
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button shape="round" type="submit" fullWidth form="library-exclusion-pattern-form">
-        {$t('save')}
-      </Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+<FormModal title={$t('edit_exclusion_pattern')} icon={mdiFolderSync} {onClose} {onSubmit} size="small">
+  <Text size="small" class="mb-4">{$t('admin.exclusion_pattern_description')}</Text>
+  <Field label={$t('pattern')}>
+    <Input bind:value={newValue} />
+  </Field>
+</FormModal>
--- a/web/src/lib/modals/LibraryFolderAddModal.svelte
+++ b/web/src/lib/modals/LibraryFolderAddModal.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
  import { handleAddLibraryFolder } from '$lib/services/library.service';
  import type { LibraryResponseDto } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, Text } from '@immich/ui';
+  import { Field, FormModal, Input, Text } from '@immich/ui';
  import { mdiFolderSync } from '@mdi/js';
  import { t } from 'svelte-i18n';

@@ -11,34 +11,26 @@
  };

  const { library, onClose }: Props = $props();
-  let folder = $state('');
-
-  const onsubmit = async () => {
-    const success = await handleAddLibraryFolder(library, folder);
+  let value = $state('');

+  const onSubmit = async () => {
+    const success = await handleAddLibraryFolder(library, value);
    if (success) {
      onClose();
    }
  };
 </script>

-<Modal title={$t('library_add_folder')} icon={mdiFolderSync} {onClose} size="small">
-  <ModalBody>
-    <form {onsubmit} autocomplete="off" id="library-import-path-form">
-      <Text size="small" class="mb-4">{$t('admin.library_folder_description')}</Text>
-
-      <Field label={$t('path')}>
-        <Input bind:value={folder} />
-      </Field>
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button shape="round" type="submit" fullWidth form="library-import-path-form">
-        {$t('add')}
-      </Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+<FormModal
+  title={$t('library_add_folder')}
+  icon={mdiFolderSync}
+  {onClose}
+  {onSubmit}
+  size="small"
+  submitText={$t('add')}
+>
+  <Text size="small" class="mb-4">{$t('admin.library_folder_description')}</Text>
+  <Field label={$t('path')}>
+    <Input bind:value />
+  </Field>
+</FormModal>
--- a/web/src/lib/modals/LibraryFolderEditModal.svelte
+++ b/web/src/lib/modals/LibraryFolderEditModal.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
  import { handleEditLibraryFolder } from '$lib/services/library.service';
  import type { LibraryResponseDto } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, Text } from '@immich/ui';
+  import { Field, FormModal, Input, Text } from '@immich/ui';
  import { mdiFolderSync } from '@mdi/js';
  import { t } from 'svelte-i18n';

@@ -11,35 +11,21 @@
    onClose: () => void;
  };

-  const { library, folder, onClose }: Props = $props();
+  const { library, folder: oldValue, onClose }: Props = $props();

-  let newFolder = $state(folder);
+  let newValue = $state(oldValue);

-  const onsubmit = async () => {
-    const success = await handleEditLibraryFolder(library, folder, newFolder);
+  const onSubmit = async () => {
+    const success = await handleEditLibraryFolder(library, oldValue, newValue);
    if (success) {
      onClose();
    }
  };
 </script>

-<Modal title={$t('library_edit_folder')} icon={mdiFolderSync} {onClose} size="small">
-  <ModalBody>
-    <form {onsubmit} autocomplete="off" id="library-import-path-form">
-      <Text size="small" class="mb-4">{$t('admin.library_folder_description')}</Text>
-
-      <Field label={$t('path')}>
-        <Input bind:value={newFolder} />
-      </Field>
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button shape="round" type="submit" fullWidth form="library-import-path-form">
-        {$t('save')}
-      </Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+<FormModal title={$t('library_edit_folder')} icon={mdiFolderSync} {onClose} {onSubmit} size="small">
+  <Text size="small" class="mb-4">{$t('admin.library_folder_description')}</Text>
+  <Field label={$t('path')}>
+    <Input bind:value={newValue} />
+  </Field>
+</FormModal>
--- a/web/src/lib/modals/LibraryRenameModal.svelte
+++ b/web/src/lib/modals/LibraryRenameModal.svelte
@@ -1,41 +0,0 @@
-<script lang="ts">
-  import { handleRenameLibrary } from '$lib/services/library.service';
-  import type { LibraryResponseDto } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter } from '@immich/ui';
-  import { mdiRenameOutline } from '@mdi/js';
-  import { t } from 'svelte-i18n';
-
-  type Props = {
-    library: LibraryResponseDto;
-    onClose: () => void;
-  };
-
-  let { library, onClose }: Props = $props();
-
-  let newName = $state(library.name);
-
-  const onsubmit = async () => {
-    const success = await handleRenameLibrary(library, newName);
-
-    if (success) {
-      onClose();
-    }
-  };
-</script>
-
-<Modal icon={mdiRenameOutline} title={$t('rename')} {onClose} size="small">
-  <ModalBody>
-    <form {onsubmit} autocomplete="off" id="rename-library-form">
-      <Field label={$t('name')}>
-        <Input bind:value={newName} />
-      </Field>
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button shape="round" fullWidth color="secondary" onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button shape="round" fullWidth type="submit" form="rename-library-form">{$t('save')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
--- a/web/src/lib/modals/MapSettingsModal.svelte
+++ b/web/src/lib/modals/MapSettingsModal.svelte
@@ -2,7 +2,7 @@
  import SettingSelect from '$lib/components/shared-components/settings/setting-select.svelte';
  import DateInput from '$lib/elements/DateInput.svelte';
  import type { MapSettings } from '$lib/stores/preferences.store';
-  import { Button, Field, HStack, Modal, ModalBody, ModalFooter, Stack, Switch } from '@immich/ui';
+  import { Button, Field, FormModal, Stack, Switch } from '@immich/ui';
  import { Duration } from 'luxon';
  import { t } from 'svelte-i18n';
  import { fly } from 'svelte/transition';
@@ -17,119 +17,107 @@

  let customDateRange = $state(!!settings.dateAfter || !!settings.dateBefore);

-  const onsubmit = (event: Event) => {
-    event.preventDefault();
+  const onSubmit = () => {
    onClose(settings);
  };
 </script>

-<Modal title={$t('map_settings')} {onClose} size="small">
-  <ModalBody>
-    <form {onsubmit} id="map-settings-form">
-      <Stack gap={4}>
-        <Field label={$t('allow_dark_mode')}>
-          <Switch bind:checked={settings.allowDarkMode} />
-        </Field>
-        <Field label={$t('only_favorites')}>
-          <Switch bind:checked={settings.onlyFavorites} />
-        </Field>
-        <Field label={$t('include_archived')}>
-          <Switch bind:checked={settings.includeArchived} />
-        </Field>
-        <Field label={$t('include_shared_partner_assets')}>
-          <Switch bind:checked={settings.withPartners} />
-        </Field>
-        <Field label={$t('include_shared_albums')}>
-          <Switch bind:checked={settings.withSharedAlbums} />
-        </Field>
+<FormModal title={$t('map_settings')} {onClose} {onSubmit} size="small">
+  <Stack gap={4}>
+    <Field label={$t('allow_dark_mode')}>
+      <Switch bind:checked={settings.allowDarkMode} />
+    </Field>
+    <Field label={$t('only_favorites')}>
+      <Switch bind:checked={settings.onlyFavorites} />
+    </Field>
+    <Field label={$t('include_archived')}>
+      <Switch bind:checked={settings.includeArchived} />
+    </Field>
+    <Field label={$t('include_shared_partner_assets')}>
+      <Switch bind:checked={settings.withPartners} />
+    </Field>
+    <Field label={$t('include_shared_albums')}>
+      <Switch bind:checked={settings.withSharedAlbums} />
+    </Field>

-        {#if customDateRange}
-          <div in:fly={{ y: 10, duration: 200 }} class="flex flex-col gap-4">
-            <div class="flex items-center justify-between gap-8">
-              <label class="immich-form-label shrink-0 text-sm" for="date-after">{$t('date_after')}</label>
-              <DateInput
-                class="immich-form-input w-40"
-                type="date"
-                id="date-after"
-                max={settings.dateBefore}
-                bind:value={settings.dateAfter}
-              />
-            </div>
-            <div class="flex items-center justify-between gap-8">
-              <label class="immich-form-label shrink-0 text-sm" for="date-before">{$t('date_before')}</label>
-              <DateInput class="immich-form-input w-40" type="date" id="date-before" bind:value={settings.dateBefore} />
-            </div>
-            <div class="flex justify-center text-xs">
-              <Button
-                color="primary"
-                size="small"
-                variant="ghost"
-                onclick={() => {
-                  customDateRange = false;
-                  settings.dateAfter = '';
-                  settings.dateBefore = '';
-                }}
-              >
-                {$t('remove_custom_date_range')}
-              </Button>
-            </div>
-          </div>
-        {:else}
-          <div in:fly={{ y: -10, duration: 200 }} class="flex flex-col gap-1">
-            <SettingSelect
-              label={$t('date_range')}
-              name="date-range"
-              bind:value={settings.relativeDate}
-              options={[
-                {
-                  value: '',
-                  text: $t('all'),
-                },
-                {
-                  value: Duration.fromObject({ hours: 24 }).toISO() || '',
-                  text: $t('past_durations.hours', { values: { hours: 24 } }),
-                },
-                {
-                  value: Duration.fromObject({ days: 7 }).toISO() || '',
-                  text: $t('past_durations.days', { values: { days: 7 } }),
-                },
-                {
-                  value: Duration.fromObject({ days: 30 }).toISO() || '',
-                  text: $t('past_durations.days', { values: { days: 30 } }),
-                },
-                {
-                  value: Duration.fromObject({ years: 1 }).toISO() || '',
-                  text: $t('past_durations.years', { values: { years: 1 } }),
-                },
-                {
-                  value: Duration.fromObject({ years: 3 }).toISO() || '',
-                  text: $t('past_durations.years', { values: { years: 3 } }),
-                },
-              ]}
-            />
-            <div class="text-xs">
-              <Button
-                color="primary"
-                size="small"
-                variant="ghost"
-                onclick={() => {
-                  customDateRange = true;
-                  settings.relativeDate = '';
-                }}
-              >
-                {$t('use_custom_date_range')}
-              </Button>
-            </div>
-          </div>
-        {/if}
-      </Stack>
-    </form>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button color="secondary" shape="round" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button type="submit" shape="round" fullWidth form="map-settings-form">{$t('save')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+    {#if customDateRange}
+      <div in:fly={{ y: 10, duration: 200 }} class="flex flex-col gap-4">
+        <div class="flex items-center justify-between gap-8">
+          <label class="immich-form-label shrink-0 text-sm" for="date-after">{$t('date_after')}</label>
+          <DateInput
+            class="immich-form-input w-40"
+            type="date"
+            id="date-after"
+            max={settings.dateBefore}
+            bind:value={settings.dateAfter}
+          />
+        </div>
+        <div class="flex items-center justify-between gap-8">
+          <label class="immich-form-label shrink-0 text-sm" for="date-before">{$t('date_before')}</label>
+          <DateInput class="immich-form-input w-40" type="date" id="date-before" bind:value={settings.dateBefore} />
+        </div>
+        <div class="flex justify-center text-xs">
+          <Button
+            color="primary"
+            size="small"
+            variant="ghost"
+            onclick={() => {
+              customDateRange = false;
+              settings.dateAfter = '';
+              settings.dateBefore = '';
+            }}
+          >
+            {$t('remove_custom_date_range')}
+          </Button>
+        </div>
+      </div>
+    {:else}
+      <div in:fly={{ y: -10, duration: 200 }} class="flex flex-col gap-1">
+        <SettingSelect
+          label={$t('date_range')}
+          name="date-range"
+          bind:value={settings.relativeDate}
+          options={[
+            {
+              value: '',
+              text: $t('all'),
+            },
+            {
+              value: Duration.fromObject({ hours: 24 }).toISO() || '',
+              text: $t('past_durations.hours', { values: { hours: 24 } }),
+            },
+            {
+              value: Duration.fromObject({ days: 7 }).toISO() || '',
+              text: $t('past_durations.days', { values: { days: 7 } }),
+            },
+            {
+              value: Duration.fromObject({ days: 30 }).toISO() || '',
+              text: $t('past_durations.days', { values: { days: 30 } }),
+            },
+            {
+              value: Duration.fromObject({ years: 1 }).toISO() || '',
+              text: $t('past_durations.years', { values: { years: 1 } }),
+            },
+            {
+              value: Duration.fromObject({ years: 3 }).toISO() || '',
+              text: $t('past_durations.years', { values: { years: 3 } }),
+            },
+          ]}
+        />
+        <div class="text-xs">
+          <Button
+            color="primary"
+            size="small"
+            variant="ghost"
+            onclick={() => {
+              customDateRange = true;
+              settings.relativeDate = '';
+            }}
+          >
+            {$t('use_custom_date_range')}
+          </Button>
+        </div>
+      </div>
+    {/if}
+  </Stack>
+</FormModal>
--- a/web/src/lib/modals/PeoplePickerModal.svelte
+++ b/web/src/lib/modals/PeoplePickerModal.svelte
@@ -0,0 +1,108 @@
+<script lang="ts">
+  import ImageThumbnail from '$lib/components/assets/thumbnail/image-thumbnail.svelte';
+  import SearchBar from '$lib/elements/SearchBar.svelte';
+  import { getPeopleThumbnailUrl } from '$lib/utils';
+  import { handleError } from '$lib/utils/handle-error';
+  import { getAllPeople, type PersonResponseDto } from '@immich/sdk';
+  import { Button, HStack, LoadingSpinner, Modal, ModalBody, ModalFooter } from '@immich/ui';
+  import { onMount } from 'svelte';
+  import { t } from 'svelte-i18n';
+
+  type Props = {
+    multiple?: boolean;
+    excludedIds?: string[];
+    onClose: (people?: PersonResponseDto[]) => void;
+  };
+
+  let { multiple = false, excludedIds = [], onClose }: Props = $props();
+
+  let people: PersonResponseDto[] = $state([]);
+  let loading = $state(true);
+  let searchName = $state('');
+  let selectedPeople: PersonResponseDto[] = $state([]);
+
+  const filteredPeople = $derived(
+    people
+      .filter((person) => !excludedIds.includes(person.id))
+      .filter((person) => !searchName || person.name.toLowerCase().includes(searchName.toLowerCase())),
+  );
+
+  onMount(async () => {
+    try {
+      loading = true;
+      const result = await getAllPeople({ withHidden: false });
+      people = result.people;
+      loading = false;
+    } catch (error) {
+      handleError(error, $t('get_people_error'));
+    }
+  });
+
+  const togglePerson = (person: PersonResponseDto) => {
+    if (multiple) {
+      const index = selectedPeople.findIndex((p) => p.id === person.id);
+      selectedPeople = index === -1 ? [...selectedPeople, person] : selectedPeople.filter((p) => p.id !== person.id);
+    } else {
+      onClose([person]);
+    }
+  };
+
+  const handleSubmit = () => {
+    if (selectedPeople.length > 0) {
+      onClose(selectedPeople);
+    } else {
+      onClose();
+    }
+  };
+</script>
+
+<Modal title={multiple ? $t('select_people') : $t('select_person')} {onClose} size="small">
+  <ModalBody>
+    <div class="flex flex-col gap-4">
+      <SearchBar bind:name={searchName} placeholder={$t('search_people')} showLoadingSpinner={false} />
+
+      <div class="immich-scrollbar max-h-96 overflow-y-auto">
+        {#if loading}
+          <div class="flex justify-center p-8">
+            <LoadingSpinner />
+          </div>
+        {:else if filteredPeople.length > 0}
+          <div class="grid grid-cols-3 gap-4 p-2">
+            {#each filteredPeople as person (person.id)}
+              {@const isSelected = selectedPeople.some((p) => p.id === person.id)}
+              <button
+                type="button"
+                onclick={() => togglePerson(person)}
+                class="flex flex-col items-center gap-2 rounded-xl p-2 transition-all hover:bg-subtle {isSelected
+                  ? 'bg-primary/10 ring-2 ring-primary'
+                  : ''}"
+              >
+                <ImageThumbnail
+                  circle
+                  shadow
+                  url={getPeopleThumbnailUrl(person)}
+                  altText={person.name}
+                  widthStyle="100%"
+                />
+                <p class="line-clamp-2 text-center text-sm font-medium">{person.name}</p>
+              </button>
+            {/each}
+          </div>
+        {:else}
+          <p class="py-8 text-center text-sm text-gray-500">{$t('no_people_found')}</p>
+        {/if}
+      </div>
+    </div>
+  </ModalBody>
+
+  {#if multiple}
+    <ModalFooter>
+      <HStack fullWidth gap={4}>
+        <Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
+        <Button shape="round" fullWidth onclick={handleSubmit} disabled={selectedPeople.length === 0}>
+          {$t('select_count', { values: { count: selectedPeople.length } })}
+        </Button>
+      </HStack>
+    </ModalFooter>
+  {/if}
+</Modal>
--- a/web/src/lib/modals/SharedLinkCreateModal.svelte
+++ b/web/src/lib/modals/SharedLinkCreateModal.svelte
@@ -2,17 +2,17 @@
  import SharedLinkExpiration from '$lib/components/SharedLinkExpiration.svelte';
  import { handleCreateSharedLink } from '$lib/services/shared-link.service';
  import { SharedLinkType } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, PasswordInput, Switch, Text } from '@immich/ui';
+  import { Field, FormModal, Input, PasswordInput, Switch, Text } from '@immich/ui';
  import { mdiLink } from '@mdi/js';
  import { t } from 'svelte-i18n';

  interface Props {
-    onClose: (success?: boolean) => void;
+    onClose: () => void;
    albumId?: string;
    assetIds?: string[];
  }

-  let { onClose, albumId = $bindable(), assetIds = $bindable([]) }: Props = $props();
+  let { onClose, albumId, assetIds }: Props = $props();

  let description = $state('');
  let allowDownload = $state(true);
@@ -22,7 +22,7 @@
  let slug = $state('');
  let expiresAt = $state<string | null>(null);

-  let shareType = $derived(albumId ? SharedLinkType.Album : SharedLinkType.Individual);
+  let type = $derived(albumId ? SharedLinkType.Album : SharedLinkType.Individual);

  $effect(() => {
    if (!showMetadata) {
@@ -30,9 +30,9 @@
    }
  });

-  const onCreate = async () => {
+  const onSubmit = async () => {
    const success = await handleCreateSharedLink({
-      type: shareType,
+      type,
      albumId,
      assetIds,
      expiresAt,
@@ -43,61 +43,58 @@
      showMetadata,
      slug,
    });
-
    if (success) {
-      onClose(true);
+      onClose();
    }
  };
 </script>

-<Modal title={$t('create_link_to_share')} icon={mdiLink} size="small" {onClose}>
-  <ModalBody>
-    {#if shareType === SharedLinkType.Album}
-      <div>{$t('album_with_link_access')}</div>
-    {/if}
+<FormModal
+  title={$t('create_link_to_share')}
+  icon={mdiLink}
+  size="small"
+  {onClose}
+  {onSubmit}
+  submitText={$t('create_link')}
+>
+  {#if type === SharedLinkType.Album}
+    <div>{$t('album_with_link_access')}</div>
+  {/if}

-    {#if shareType === SharedLinkType.Individual}
-      <div>{$t('create_link_to_share_description')}</div>
-    {/if}
+  {#if type === SharedLinkType.Individual}
+    <div>{$t('create_link_to_share_description')}</div>
+  {/if}

-    <div class="flex flex-col gap-4 mt-4">
-      <div>
-        <Field label={$t('custom_url')} description={$t('shared_link_custom_url_description')}>
-          <Input bind:value={slug} autocomplete="off" />
-        </Field>
-        {#if slug}
-          <Text size="tiny" color="muted" class="pt-2 break-all">/s/{encodeURIComponent(slug)}</Text>
-        {/if}
-      </div>
-
-      <Field label={$t('password')} description={$t('shared_link_password_description')}>
-        <PasswordInput bind:value={password} autocomplete="new-password" />
-      </Field>
-
-      <Field label={$t('description')}>
-        <Input bind:value={description} autocomplete="off" />
-      </Field>
-
-      <SharedLinkExpiration bind:expiresAt />
-
-      <Field label={$t('show_metadata')}>
-        <Switch bind:checked={showMetadata} />
-      </Field>
-
-      <Field label={$t('allow_public_user_to_download')} disabled={!showMetadata}>
-        <Switch bind:checked={allowDownload} />
-      </Field>
-
-      <Field label={$t('allow_public_user_to_upload')}>
-        <Switch bind:checked={allowUpload} />
+  <div class="flex flex-col gap-4 mt-4">
+    <div>
+      <Field label={$t('custom_url')} description={$t('shared_link_custom_url_description')}>
+        <Input bind:value={slug} autocomplete="off" />
      </Field>
+      {#if slug}
+        <Text size="tiny" color="muted" class="pt-2 break-all">/s/{encodeURIComponent(slug)}</Text>
+      {/if}
    </div>
-  </ModalBody>

-  <ModalFooter>
-    <HStack fullWidth>
-      <Button color="secondary" shape="round" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button fullWidth shape="round" onclick={onCreate}>{$t('create_link')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+    <Field label={$t('password')} description={$t('shared_link_password_description')}>
+      <PasswordInput bind:value={password} autocomplete="new-password" />
+    </Field>
+
+    <Field label={$t('description')}>
+      <Input bind:value={description} autocomplete="off" />
+    </Field>
+
+    <SharedLinkExpiration bind:expiresAt />
+
+    <Field label={$t('show_metadata')}>
+      <Switch bind:checked={showMetadata} />
+    </Field>
+
+    <Field label={$t('allow_public_user_to_download')} disabled={!showMetadata}>
+      <Switch bind:checked={allowDownload} />
+    </Field>
+
+    <Field label={$t('allow_public_user_to_upload')}>
+      <Switch bind:checked={allowUpload} />
+    </Field>
+  </div>
+</FormModal>
--- a/web/src/lib/modals/SharedLinkUpdateModal.svelte
+++ b/web/src/lib/modals/SharedLinkUpdateModal.svelte
@@ -1,98 +0,0 @@
-<script lang="ts">
-  import SharedLinkExpiration from '$lib/components/SharedLinkExpiration.svelte';
-  import { handleUpdateSharedLink } from '$lib/services/shared-link.service';
-  import { SharedLinkType, type SharedLinkResponseDto } from '@immich/sdk';
-  import { Button, Field, HStack, Input, Modal, ModalBody, ModalFooter, PasswordInput, Switch, Text } from '@immich/ui';
-  import { mdiLink } from '@mdi/js';
-  import { t } from 'svelte-i18n';
-
-  interface Props {
-    onClose: (success?: boolean) => void;
-    sharedLink: SharedLinkResponseDto;
-  }
-
-  let { onClose, sharedLink }: Props = $props();
-
-  let description = $state(sharedLink.description ?? '');
-  let allowDownload = $state(sharedLink.allowDownload);
-  let allowUpload = $state(sharedLink.allowUpload);
-  let showMetadata = $state(sharedLink.showMetadata);
-  let password = $state(sharedLink.password ?? '');
-  let slug = $state(sharedLink.slug ?? '');
-  let shareType = sharedLink.album ? SharedLinkType.Album : SharedLinkType.Individual;
-  let expiresAt = $state(sharedLink.expiresAt);
-
-  const onUpdate = async () => {
-    const success = await handleUpdateSharedLink(sharedLink, {
-      description,
-      password: password ?? null,
-      expiresAt,
-      allowUpload,
-      allowDownload,
-      showMetadata,
-      slug: slug.trim() ?? null,
-    });
-
-    if (success) {
-      onClose(true);
-    }
-  };
-</script>
-
-<Modal title={$t('edit_link')} icon={mdiLink} size="small" {onClose}>
-  <ModalBody>
-    {#if shareType === SharedLinkType.Album}
-      <div class="text-sm">
-        {$t('public_album')} |
-        <span class="text-primary">{sharedLink.album?.albumName}</span>
-      </div>
-    {/if}
-
-    {#if shareType === SharedLinkType.Individual}
-      <div class="text-sm">
-        {$t('individual_share')} |
-        <span class="text-primary">{sharedLink.description || ''}</span>
-      </div>
-    {/if}
-
-    <div class="flex flex-col gap-4 mt-4">
-      <div>
-        <Field label={$t('custom_url')} description={$t('shared_link_custom_url_description')}>
-          <Input bind:value={slug} autocomplete="off" />
-        </Field>
-        {#if slug}
-          <Text size="tiny" color="muted" class="pt-2">/s/{encodeURIComponent(slug)}</Text>
-        {/if}
-      </div>
-
-      <Field label={$t('password')} description={$t('shared_link_password_description')}>
-        <PasswordInput bind:value={password} autocomplete="new-password" />
-      </Field>
-
-      <Field label={$t('description')}>
-        <Input bind:value={description} autocomplete="off" />
-      </Field>
-
-      <SharedLinkExpiration createdAt={sharedLink.createdAt} bind:expiresAt />
-
-      <Field label={$t('show_metadata')}>
-        <Switch bind:checked={showMetadata} />
-      </Field>
-
-      <Field label={$t('allow_public_user_to_download')} disabled={!showMetadata}>
-        <Switch bind:checked={allowDownload} />
-      </Field>
-
-      <Field label={$t('allow_public_user_to_upload')}>
-        <Switch bind:checked={allowUpload} />
-      </Field>
-    </div>
-  </ModalBody>
-
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button color="secondary" shape="round" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button fullWidth shape="round" onclick={onUpdate}>{$t('confirm')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
--- a/web/src/lib/modals/SlideshowSettingsModal.svelte
+++ b/web/src/lib/modals/SlideshowSettingsModal.svelte
@@ -1,9 +1,6 @@
 <script lang="ts">
-  import SettingInputField from '$lib/components/shared-components/settings/setting-input-field.svelte';
-  import SettingSwitch from '$lib/components/shared-components/settings/setting-switch.svelte';
-  import { SettingInputFieldType } from '$lib/constants';
  import type { RenderedOption } from '$lib/elements/Dropdown.svelte';
-  import { Button, HStack, Modal, ModalBody, ModalFooter } from '@immich/ui';
+  import { Field, FormModal, HelperText, NumberInput, Switch } from '@immich/ui';
  import {
    mdiArrowDownThin,
    mdiArrowUpThin,
@@ -26,9 +23,9 @@
    slideshowState,
  } = slideshowStore;

-  interface Props {
+  type Props = {
    onClose: () => void;
-  }
+  };

  let { onClose }: Props = $props();

@@ -63,7 +60,7 @@
    }
  };

-  const applyChanges = () => {
+  const onSubmit = () => {
    $slideshowDelay = tempSlideshowDelay;
    $showProgressBar = tempShowProgressBar;
    $slideshowNavigation = tempSlideshowNavigation;
@@ -75,41 +72,41 @@
  };
 </script>

-<Modal size="small" title={$t('slideshow_settings')} onClose={() => onClose()}>
-  <ModalBody>
-    <div class="flex flex-col gap-4 text-primary">
-      <SettingDropdown
-        title={$t('direction')}
-        options={Object.values(navigationOptions)}
-        selectedOption={navigationOptions[tempSlideshowNavigation]}
-        onToggle={(option) => {
-          tempSlideshowNavigation = handleToggle(option, navigationOptions) || tempSlideshowNavigation;
-        }}
-      />
-      <SettingDropdown
-        title={$t('look')}
-        options={Object.values(lookOptions)}
-        selectedOption={lookOptions[tempSlideshowLook]}
-        onToggle={(option) => {
-          tempSlideshowLook = handleToggle(option, lookOptions) || tempSlideshowLook;
-        }}
-      />
-      <SettingSwitch title={$t('autoplay_slideshow')} bind:checked={tempSlideshowAutoplay} />
-      <SettingSwitch title={$t('show_progress_bar')} bind:checked={tempShowProgressBar} />
-      <SettingSwitch title={$t('show_slideshow_transition')} bind:checked={tempSlideshowTransition} />
-      <SettingInputField
-        inputType={SettingInputFieldType.NUMBER}
-        label={$t('duration')}
-        description={$t('admin.slideshow_duration_description')}
-        min={1}
-        bind:value={tempSlideshowDelay}
-      />
-    </div>
-  </ModalBody>
-  <ModalFooter>
-    <HStack fullWidth>
-      <Button color="secondary" shape="round" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
-      <Button fullWidth color="primary" shape="round" onclick={applyChanges}>{$t('confirm')}</Button>
-    </HStack>
-  </ModalFooter>
-</Modal>
+<FormModal size="small" title={$t('slideshow_settings')} {onClose} {onSubmit}>
+  <div class="flex flex-col gap-4">
+    <SettingDropdown
+      title={$t('direction')}
+      options={Object.values(navigationOptions)}
+      selectedOption={navigationOptions[tempSlideshowNavigation]}
+      onToggle={(option) => {
+        tempSlideshowNavigation = handleToggle(option, navigationOptions) || tempSlideshowNavigation;
+      }}
+    />
+
+    <SettingDropdown
+      title={$t('look')}
+      options={Object.values(lookOptions)}
+      selectedOption={lookOptions[tempSlideshowLook]}
+      onToggle={(option) => {
+        tempSlideshowLook = handleToggle(option, lookOptions) || tempSlideshowLook;
+      }}
+    />
+
+    <Field label={$t('autoplay_slideshow')}>
+      <Switch bind:checked={tempSlideshowAutoplay} />
+    </Field>
+
+    <Field label={$t('show_progress_bar')}>
+      <Switch bind:checked={tempShowProgressBar} />
+    </Field>
+
+    <Field label={$t('show_slideshow_transition')}>
+      <Switch bind:checked={tempSlideshowTransition} />
+    </Field>
+
+    <Field label={$t('duration')}>
+      <NumberInput min={1} bind:value={tempSlideshowDelay} />
+      <HelperText>{$t('admin.slideshow_duration_description')}</HelperText>
+    </Field>
+  </div>
+</FormModal>
--- a/web/src/lib/models/onboarding-role.ts
+++ b/web/src/lib/models/onboarding-role.ts
@@ -1,4 +0,0 @@
-export enum OnboardingRole {
-  SERVER = 'server',
-  USER = 'user',
-}
--- a/web/src/lib/models/upload-asset.ts
+++ b/web/src/lib/models/upload-asset.ts
@@ -1,22 +0,0 @@
-export enum UploadState {
-  PENDING,
-  STARTED,
-  DONE,
-  ERROR,
-  DUPLICATED,
-}
-
-export type UploadAsset = {
-  id: string;
-  file: File;
-  assetId?: string;
-  isTrashed?: boolean;
-  albumId?: string;
-  progress?: number;
-  state?: UploadState;
-  startDate?: number;
-  eta?: number;
-  speed?: number;
-  error?: unknown;
-  message?: string;
-};
--- a/web/src/lib/services/album.service.ts
+++ b/web/src/lib/services/album.service.ts
@@ -1,10 +1,41 @@
+import { goto } from '$app/navigation';
+import ToastAction from '$lib/components/ToastAction.svelte';
+import { AppRoute } from '$lib/constants';
 import { eventManager } from '$lib/managers/event-manager.svelte';
 import { downloadArchive } from '$lib/utils/asset-utils';
 import { handleError } from '$lib/utils/handle-error';
 import { getFormatter } from '$lib/utils/i18n';
-import { deleteAlbum, type AlbumResponseDto } from '@immich/sdk';
+import { deleteAlbum, updateAlbumInfo, type AlbumResponseDto, type UpdateAlbumDto } from '@immich/sdk';
 import { modalManager, toastManager } from '@immich/ui';

+export const handleUpdateAlbum = async ({ id }: { id: string }, dto: UpdateAlbumDto) => {
+  const $t = await getFormatter();
+
+  try {
+    const response = await updateAlbumInfo({ id, updateAlbumDto: dto });
+    eventManager.emit('AlbumUpdate', response);
+    toastManager.custom({
+      component: ToastAction,
+      props: {
+        color: 'primary',
+        title: $t('success'),
+        description: $t('album_info_updated'),
+        button: {
+          text: $t('view_album'),
+          color: 'primary',
+          onClick() {
+            return goto(`${AppRoute.ALBUMS}/${id}`);
+          },
+        },
+      },
+    });
+
+    return true;
+  } catch (error) {
+    handleError(error, $t('errors.unable_to_update_album_info'));
+  }
+};
+
 export const handleDeleteAlbum = async (album: AlbumResponseDto, options?: { prompt?: boolean; notify?: boolean }) => {
  const $t = await getFormatter();
  const { prompt = true, notify = true } = options ?? {};
--- a/web/src/lib/services/api-key.service.ts
+++ b/web/src/lib/services/api-key.service.ts
@@ -0,0 +1,110 @@
+import { eventManager } from '$lib/managers/event-manager.svelte';
+import ApiKeyCreateModal from '$lib/modals/ApiKeyCreateModal.svelte';
+import ApiKeySecretModal from '$lib/modals/ApiKeySecretModal.svelte';
+import ApiKeyUpdateModal from '$lib/modals/ApiKeyUpdateModal.svelte';
+import { handleError } from '$lib/utils/handle-error';
+import { getFormatter } from '$lib/utils/i18n';
+import {
+  createApiKey,
+  deleteApiKey,
+  updateApiKey,
+  type ApiKeyCreateDto,
+  type ApiKeyResponseDto,
+  type ApiKeyUpdateDto,
+} from '@immich/sdk';
+import { modalManager, toastManager, type ActionItem } from '@immich/ui';
+import { mdiPencilOutline, mdiPlus, mdiTrashCanOutline } from '@mdi/js';
+import type { MessageFormatter } from 'svelte-i18n';
+
+export const getApiKeysActions = ($t: MessageFormatter) => {
+  const Create: ActionItem = {
+    title: $t('new_api_key'),
+    icon: mdiPlus,
+    onAction: () => modalManager.show(ApiKeyCreateModal, {}),
+  };
+
+  return { Create };
+};
+
+export const getApiKeyActions = ($t: MessageFormatter, apiKey: ApiKeyResponseDto) => {
+  const Update: ActionItem = {
+    title: $t('edit_key'),
+    icon: mdiPencilOutline,
+    onAction: () => modalManager.show(ApiKeyUpdateModal, { apiKey }),
+  };
+
+  const Delete: ActionItem = {
+    title: $t('delete_key'),
+    icon: mdiTrashCanOutline,
+    onAction: () => handleDeleteApiKey(apiKey),
+  };
+
+  return { Update, Delete };
+};
+
+export const handleCreateApiKey = async (dto: ApiKeyCreateDto) => {
+  const $t = await getFormatter();
+
+  try {
+    if (!dto.name) {
+      toastManager.warning($t('api_key_empty'));
+      return;
+    }
+
+    if (dto.permissions.length === 0) {
+      toastManager.warning($t('permission_empty'));
+      return;
+    }
+
+    const { apiKey, secret } = await createApiKey({ apiKeyCreateDto: dto });
+
+    eventManager.emit('ApiKeyCreate', apiKey);
+
+    // no nested modal
+    void modalManager.show(ApiKeySecretModal, { secret });
+
+    return true;
+  } catch (error) {
+    handleError(error, $t('errors.unable_to_create_api_key'));
+  }
+};
+
+export const handleUpdateApiKey = async (apiKey: { id: string }, dto: ApiKeyUpdateDto) => {
+  const $t = await getFormatter();
+
+  if (!dto.name) {
+    toastManager.warning($t('api_key_empty'));
+    return;
+  }
+
+  if (dto.permissions && dto.permissions.length === 0) {
+    toastManager.warning($t('permission_empty'));
+    return;
+  }
+
+  try {
+    const response = await updateApiKey({ id: apiKey.id, apiKeyUpdateDto: dto });
+    eventManager.emit('ApiKeyUpdate', response);
+    toastManager.success($t('saved_api_key'));
+    return true;
+  } catch (error) {
+    handleError(error, $t('errors.unable_to_save_api_key'));
+  }
+};
+
+export const handleDeleteApiKey = async (apiKey: ApiKeyResponseDto) => {
+  const $t = await getFormatter();
+
+  const confirmed = await modalManager.showDialog({ prompt: $t('delete_api_key_prompt') });
+  if (!confirmed) {
+    return;
+  }
+
+  try {
+    await deleteApiKey({ id: apiKey.id });
+    eventManager.emit('ApiKeyDelete', apiKey);
+    toastManager.success($t('removed_api_key', { values: { name: apiKey.name } }));
+  } catch (error) {
+    handleError(error, $t('errors.unable_to_remove_api_key'));
+  }
+};
--- a/web/src/lib/services/asset.service.ts
+++ b/web/src/lib/services/asset.service.ts
@@ -1,6 +1,23 @@
 import { eventManager } from '$lib/managers/event-manager.svelte';
+import SharedLinkCreateModal from '$lib/modals/SharedLinkCreateModal.svelte';
+import { user as authUser } from '$lib/stores/user.store';
 import { openFileUploadDialog } from '$lib/utils/file-uploader';
-import { copyAsset, deleteAssets } from '@immich/sdk';
+import { AssetVisibility, copyAsset, deleteAssets, type AssetResponseDto } from '@immich/sdk';
+import { modalManager, type ActionItem } from '@immich/ui';
+import { mdiShareVariantOutline } from '@mdi/js';
+import type { MessageFormatter } from 'svelte-i18n';
+import { get } from 'svelte/store';
+
+export const getAssetActions = ($t: MessageFormatter, asset: AssetResponseDto) => {
+  const Share: ActionItem = {
+    title: $t('share'),
+    icon: mdiShareVariantOutline,
+    $if: () => !!(get(authUser) && !asset.isTrashed && asset.visibility !== AssetVisibility.Locked),
+    onAction: () => modalManager.show(SharedLinkCreateModal, { assetIds: [asset.id] }),
+  };
+
+  return { Share };
+};

 export const handleReplaceAsset = async (oldAssetId: string) => {
  const [newAssetId] = await openFileUploadDialog({ multiple: false });
--- a/web/src/lib/services/library.service.ts
+++ b/web/src/lib/services/library.service.ts
@@ -1,12 +1,10 @@
 import { goto } from '$app/navigation';
 import { AppRoute } from '$lib/constants';
 import { eventManager } from '$lib/managers/event-manager.svelte';
-import LibraryCreateModal from '$lib/modals/LibraryCreateModal.svelte';
 import LibraryExclusionPatternAddModal from '$lib/modals/LibraryExclusionPatternAddModal.svelte';
 import LibraryExclusionPatternEditModal from '$lib/modals/LibraryExclusionPatternEditModal.svelte';
 import LibraryFolderAddModal from '$lib/modals/LibraryFolderAddModal.svelte';
 import LibraryFolderEditModal from '$lib/modals/LibraryFolderEditModal.svelte';
-import LibraryRenameModal from '$lib/modals/LibraryRenameModal.svelte';
 import { handleError } from '$lib/utils/handle-error';
 import { getFormatter } from '$lib/utils/i18n';
 import {
@@ -19,6 +17,7 @@ import {
  updateLibrary,
  type CreateLibraryDto,
  type LibraryResponseDto,
+  type UpdateLibraryDto,
 } from '@immich/sdk';
 import { modalManager, toastManager, type ActionItem } from '@immich/ui';
 import { mdiPencilOutline, mdiPlusBoxOutline, mdiSync, mdiTrashCanOutline } from '@mdi/js';
@@ -38,7 +37,7 @@ export const getLibrariesActions = ($t: MessageFormatter, libraries: LibraryResp
    title: $t('create_library'),
    type: $t('command'),
    icon: mdiPlusBoxOutline,
-    onAction: () => handleShowLibraryCreateModal(),
+    onAction: () => goto(AppRoute.ADMIN_LIBRARIES_NEW),
    shortcuts: { shift: true, key: 'n' },
  };

@@ -46,11 +45,11 @@ export const getLibrariesActions = ($t: MessageFormatter, libraries: LibraryResp
 };

 export const getLibraryActions = ($t: MessageFormatter, library: LibraryResponseDto) => {
-  const Rename: ActionItem = {
+  const Edit: ActionItem = {
    icon: mdiPencilOutline,
    type: $t('command'),
-    title: $t('rename'),
-    onAction: () => modalManager.show(LibraryRenameModal, { library }),
+    title: $t('edit'),
+    onAction: () => goto(`${AppRoute.ADMIN_LIBRARIES}/${library.id}/edit`),
    shortcuts: { key: 'r' },
  };

@@ -85,7 +84,7 @@ export const getLibraryActions = ($t: MessageFormatter, library: LibraryResponse
    shortcuts: { shift: true, key: 'r' },
  };

-  return { Rename, Delete, AddFolder, AddExclusionPattern, Scan };
+  return { Edit, Delete, AddFolder, AddExclusionPattern, Scan };
 };

 export const getLibraryFolderActions = ($t: MessageFormatter, library: LibraryResponseDto, folder: string) => {
@@ -150,7 +149,7 @@ const handleScanLibrary = async (library: LibraryResponseDto) => {
 };

 export const handleViewLibrary = async (library: LibraryResponseDto) => {
-  await goto(`${AppRoute.ADMIN_LIBRARY_MANAGEMENT}/${library.id}`);
+  await goto(`${AppRoute.ADMIN_LIBRARIES}/${library.id}`);
 };

 export const handleCreateLibrary = async (dto: CreateLibraryDto) => {
@@ -160,33 +159,24 @@ export const handleCreateLibrary = async (dto: CreateLibraryDto) => {
    const library = await createLibrary({ createLibraryDto: dto });
    eventManager.emit('LibraryCreate', library);
    toastManager.success($t('admin.library_created', { values: { library: library.name } }));
-    return true;
+    return library;
  } catch (error) {
    handleError(error, $t('errors.unable_to_create_library'));
-    return false;
  }
 };

-export const handleRenameLibrary = async (library: { id: string }, name?: string) => {
+export const handleUpdateLibrary = async (library: LibraryResponseDto, dto: UpdateLibraryDto) => {
  const $t = await getFormatter();

-  if (!name) {
-    return false;
-  }
-
  try {
-    const updatedLibrary = await updateLibrary({
-      id: library.id,
-      updateLibraryDto: { name },
-    });
+    const updatedLibrary = await updateLibrary({ id: library.id, updateLibraryDto: dto });
    eventManager.emit('LibraryUpdate', updatedLibrary);
    toastManager.success($t('admin.library_updated'));
+    return true;
  } catch (error) {
    handleError(error, $t('errors.unable_to_update_library'));
    return false;
  }
-
-  return true;
 };

 const handleDeleteLibrary = async (library: LibraryResponseDto) => {
@@ -241,14 +231,14 @@ export const handleAddLibraryFolder = async (library: LibraryResponseDto, folder
  return true;
 };

-export const handleEditLibraryFolder = async (library: LibraryResponseDto, oldFolder: string, newFolder: string) => {
+export const handleEditLibraryFolder = async (library: LibraryResponseDto, oldValue: string, newValue: string) => {
  const $t = await getFormatter();

-  if (oldFolder === newFolder) {
+  if (oldValue === newValue) {
    return true;
  }

-  const importPaths = library.importPaths.map((path) => (path === oldFolder ? newFolder : path));
+  const importPaths = library.importPaths.map((path) => (path === oldValue ? newValue : path));

  try {
    const updatedLibrary = await updateLibrary({ id: library.id, updateLibraryDto: { importPaths } });
@@ -309,20 +299,14 @@ export const handleAddLibraryExclusionPattern = async (library: LibraryResponseD
  return true;
 };

-export const handleEditExclusionPattern = async (
-  library: LibraryResponseDto,
-  oldExclusionPattern: string,
-  newExclusionPattern: string,
-) => {
+export const handleEditExclusionPattern = async (library: LibraryResponseDto, oldValue: string, newValue: string) => {
  const $t = await getFormatter();

-  if (oldExclusionPattern === newExclusionPattern) {
+  if (oldValue === newValue) {
    return true;
  }

-  const exclusionPatterns = library.exclusionPatterns.map((pattern) =>
-    pattern === oldExclusionPattern ? newExclusionPattern : pattern,
-  );
+  const exclusionPatterns = library.exclusionPatterns.map((pattern) => (pattern === oldValue ? newValue : pattern));

  try {
    const updatedLibrary = await updateLibrary({ id: library.id, updateLibraryDto: { exclusionPatterns } });
@@ -357,7 +341,3 @@ const handleDeleteExclusionPattern = async (library: LibraryResponseDto, exclusi
    handleError(error, $t('errors.unable_to_update_library'));
  }
 };
-
-export const handleShowLibraryCreateModal = async () => {
-  await modalManager.show(LibraryCreateModal, {});
-};
--- a/web/src/lib/services/queue.service.ts
+++ b/web/src/lib/services/queue.service.ts
@@ -241,7 +241,7 @@ export const asQueueItem = ($t: MessageFormatter, queue: { name: QueueName }): Q
    },
    [QueueName.Workflow]: {
      icon: mdiStateMachine,
-      title: $t('workflow'),
+      title: $t('workflows'),
    },
  };

--- a/web/src/lib/services/shared-link.service.ts
+++ b/web/src/lib/services/shared-link.service.ts
@@ -9,6 +9,7 @@ import { handleError } from '$lib/utils/handle-error';
 import { getFormatter } from '$lib/utils/i18n';
 import {
  createSharedLink,
+  getSharedLinkById,
  removeSharedLink,
  removeSharedLinkAssets,
  updateSharedLink,
@@ -24,7 +25,7 @@ export const getSharedLinkActions = ($t: MessageFormatter, sharedLink: SharedLin
  const Edit: ActionItem = {
    title: $t('edit_link'),
    icon: mdiPencilOutline,
-    onAction: () => goto(`${AppRoute.SHARED_LINKS}/${sharedLink.id}`),
+    onAction: () => goto(`${AppRoute.SHARED_LINKS}/${sharedLink.id}/edit`),
  };

  const Delete: ActionItem = {
@@ -58,7 +59,11 @@ export const handleCreateSharedLink = async (dto: SharedLinkCreateDto) => {
  const $t = await getFormatter();

  try {
-    const sharedLink = await createSharedLink({ sharedLinkCreateDto: dto });
+    let sharedLink = await createSharedLink({ sharedLinkCreateDto: dto });
+    if (dto.albumId) {
+      // fetch album details, for event
+      sharedLink = await getSharedLinkById({ id: sharedLink.id });
+    }

    eventManager.emit('SharedLinkCreate', sharedLink);

--- a/web/src/lib/services/user-admin.service.ts
+++ b/web/src/lib/services/user-admin.service.ts
@@ -1,10 +1,9 @@
 import { goto } from '$app/navigation';
+import { AppRoute } from '$lib/constants';
 import { eventManager } from '$lib/managers/event-manager.svelte';
 import { serverConfigManager } from '$lib/managers/server-config-manager.svelte';
 import PasswordResetSuccessModal from '$lib/modals/PasswordResetSuccessModal.svelte';
-import UserCreateModal from '$lib/modals/UserCreateModal.svelte';
 import UserDeleteConfirmModal from '$lib/modals/UserDeleteConfirmModal.svelte';
-import UserEditModal from '$lib/modals/UserEditModal.svelte';
 import UserRestoreConfirmModal from '$lib/modals/UserRestoreConfirmModal.svelte';
 import { user as authUser } from '$lib/stores/user.store';
 import type { HeaderButtonActionItem } from '$lib/types';
@@ -39,7 +38,7 @@ export const getUserAdminsActions = ($t: MessageFormatter) => {
    title: $t('create_user'),
    type: $t('command'),
    icon: mdiPlusBoxOutline,
-    onAction: () => modalManager.show(UserCreateModal, {}),
+    onAction: () => goto(AppRoute.ADMIN_USERS_NEW),
    shortcuts: { shift: true, key: 'n' },
  };

@@ -50,7 +49,7 @@ export const getUserAdminActions = ($t: MessageFormatter, user: UserAdminRespons
  const Update: ActionItem = {
    icon: mdiPencilOutline,
    title: $t('edit'),
-    onAction: () => modalManager.show(UserEditModal, { user }),
+    onAction: () => goto(`${AppRoute.ADMIN_USERS}/${user.id}/edit`),
  };

  const Delete: ActionItem = {
@@ -103,7 +102,7 @@ export const handleCreateUserAdmin = async (dto: UserAdminCreateDto) => {
    const response = await createUserAdmin({ userAdminCreateDto: dto });
    eventManager.emit('UserAdminCreate', response);
    toastManager.success();
-    return true;
+    return response;
  } catch (error) {
    handleError(error, $t('errors.unable_to_create_user'));
  }
--- a/web/src/lib/services/workflow.service.ts
+++ b/web/src/lib/services/workflow.service.ts
@@ -0,0 +1,451 @@
+import { goto } from '$app/navigation';
+import { AppRoute } from '$lib/constants';
+import { eventManager } from '$lib/managers/event-manager.svelte';
+import { handleError } from '$lib/utils/handle-error';
+import { getFormatter } from '$lib/utils/i18n';
+import {
+  createWorkflow,
+  deleteWorkflow,
+  getAlbumInfo,
+  getPerson,
+  PluginTriggerType,
+  updateWorkflow,
+  type AlbumResponseDto,
+  type PersonResponseDto,
+  type PluginActionResponseDto,
+  type PluginContextType,
+  type PluginFilterResponseDto,
+  type PluginTriggerResponseDto,
+  type WorkflowActionItemDto,
+  type WorkflowFilterItemDto,
+  type WorkflowResponseDto,
+  type WorkflowUpdateDto,
+} from '@immich/sdk';
+import { modalManager, toastManager, type ActionItem } from '@immich/ui';
+import { mdiCodeJson, mdiDelete, mdiPause, mdiPencil, mdiPlay } from '@mdi/js';
+import type { MessageFormatter } from 'svelte-i18n';
+
+export type PickerSubType = 'album-picker' | 'people-picker';
+export type PickerMetadata = AlbumResponseDto | PersonResponseDto | AlbumResponseDto[] | PersonResponseDto[];
+
+export interface WorkflowPayload {
+  name: string;
+  description: string;
+  enabled: boolean;
+  triggerType: string;
+  filters: Record<string, unknown>[];
+  actions: Record<string, unknown>[];
+}
+
+/**
+ * Get filters that support the given context
+ */
+export const getFiltersByContext = (
+  availableFilters: PluginFilterResponseDto[],
+  context: PluginContextType,
+): PluginFilterResponseDto[] => {
+  return availableFilters.filter((filter) => filter.supportedContexts.includes(context));
+};
+
+/**
+ * Get actions that support the given context
+ */
+export const getActionsByContext = (
+  availableActions: PluginActionResponseDto[],
+  context: PluginContextType,
+): PluginActionResponseDto[] => {
+  return availableActions.filter((action) => action.supportedContexts.includes(context));
+};
+
+export const remapConfigsOnReorder = (
+  configs: Record<string, unknown>,
+  prefix: 'filter' | 'action',
+  fromIndex: number,
+  toIndex: number,
+  totalCount: number,
+): Record<string, unknown> => {
+  const newConfigs: Record<string, unknown> = {};
+
+  // Create an array of configs in order
+  const configArray: unknown[] = [];
+  for (let i = 0; i < totalCount; i++) {
+    configArray.push(configs[`${prefix}_${i}`] ?? {});
+  }
+
+  // Move the item from fromIndex to toIndex
+  const [movedItem] = configArray.splice(fromIndex, 1);
+  configArray.splice(toIndex, 0, movedItem);
+
+  // Rebuild the configs object with new indices
+  for (let i = 0; i < configArray.length; i++) {
+    newConfigs[`${prefix}_${i}`] = configArray[i];
+  }
+
+  return newConfigs;
+};
+
+/**
+ * Remap configs when an item is removed
+ * Shifts all configs after the removed index down by one
+ */
+export const remapConfigsOnRemove = (
+  configs: Record<string, unknown>,
+  prefix: 'filter' | 'action',
+  removedIndex: number,
+  totalCount: number,
+): Record<string, unknown> => {
+  const newConfigs: Record<string, unknown> = {};
+
+  let newIndex = 0;
+  for (let i = 0; i < totalCount; i++) {
+    if (i !== removedIndex) {
+      newConfigs[`${prefix}_${newIndex}`] = configs[`${prefix}_${i}`] ?? {};
+      newIndex++;
+    }
+  }
+
+  return newConfigs;
+};
+
+export const initializeConfigs = (
+  type: 'action' | 'filter',
+  workflow: WorkflowResponseDto,
+): Record<string, unknown> => {
+  const configs: Record<string, unknown> = {};
+
+  if (workflow.filters && type == 'filter') {
+    for (const [index, workflowFilter] of workflow.filters.entries()) {
+      configs[`filter_${index}`] = workflowFilter.filterConfig ?? {};
+    }
+  }
+
+  if (workflow.actions && type == 'action') {
+    for (const [index, workflowAction] of workflow.actions.entries()) {
+      configs[`action_${index}`] = workflowAction.actionConfig ?? {};
+    }
+  }
+
+  return configs;
+};
+
+/**
+ * Build workflow payload from current state
+ * Uses index-based keys to support multiple filters/actions of the same type
+ */
+export const buildWorkflowPayload = (
+  name: string,
+  description: string,
+  enabled: boolean,
+  triggerType: string,
+  orderedFilters: PluginFilterResponseDto[],
+  orderedActions: PluginActionResponseDto[],
+  filterConfigs: Record<string, unknown>,
+  actionConfigs: Record<string, unknown>,
+): WorkflowPayload => {
+  const filters = orderedFilters.map((filter, index) => ({
+    [filter.methodName]: filterConfigs[`filter_${index}`] ?? {},
+  }));
+
+  const actions = orderedActions.map((action, index) => ({
+    [action.methodName]: actionConfigs[`action_${index}`] ?? {},
+  }));
+
+  return {
+    name,
+    description,
+    enabled,
+    triggerType,
+    filters,
+    actions,
+  };
+};
+
+export const parseWorkflowJson = (
+  jsonString: string,
+  availableTriggers: PluginTriggerResponseDto[],
+  availableFilters: PluginFilterResponseDto[],
+  availableActions: PluginActionResponseDto[],
+): {
+  success: boolean;
+  error?: string;
+  data?: {
+    name: string;
+    description: string;
+    enabled: boolean;
+    trigger?: PluginTriggerResponseDto;
+    filters: PluginFilterResponseDto[];
+    actions: PluginActionResponseDto[];
+    filterConfigs: Record<string, unknown>;
+    actionConfigs: Record<string, unknown>;
+  };
+} => {
+  try {
+    const parsed = JSON.parse(jsonString);
+
+    const trigger = availableTriggers.find((t) => t.type === parsed.triggerType);
+
+    const filters: PluginFilterResponseDto[] = [];
+    const filterConfigs: Record<string, unknown> = {};
+    if (Array.isArray(parsed.filters)) {
+      for (const [index, filterObj] of parsed.filters.entries()) {
+        const methodName = Object.keys(filterObj)[0];
+        const filter = availableFilters.find((f) => f.methodName === methodName);
+        if (filter) {
+          filters.push(filter);
+          filterConfigs[`filter_${index}`] = (filterObj as Record<string, unknown>)[methodName];
+        }
+      }
+    }
+
+    const actions: PluginActionResponseDto[] = [];
+    const actionConfigs: Record<string, unknown> = {};
+    if (Array.isArray(parsed.actions)) {
+      for (const [index, actionObj] of parsed.actions.entries()) {
+        const methodName = Object.keys(actionObj)[0];
+        const action = availableActions.find((a) => a.methodName === methodName);
+        if (action) {
+          actions.push(action);
+          actionConfigs[`action_${index}`] = (actionObj as Record<string, unknown>)[methodName];
+        }
+      }
+    }
+
+    return {
+      success: true,
+      data: {
+        name: parsed.name ?? '',
+        description: parsed.description ?? '',
+        enabled: parsed.enabled ?? false,
+        trigger,
+        filters,
+        actions,
+        filterConfigs,
+        actionConfigs,
+      },
+    };
+  } catch (error) {
+    return {
+      success: false,
+      error: error instanceof Error ? error.message : 'Invalid JSON',
+    };
+  }
+};
+
+export const hasWorkflowChanged = (
+  previousWorkflow: WorkflowResponseDto,
+  enabled: boolean,
+  name: string,
+  description: string,
+  triggerType: string,
+  orderedFilters: PluginFilterResponseDto[],
+  orderedActions: PluginActionResponseDto[],
+  filterConfigs: Record<string, unknown>,
+  actionConfigs: Record<string, unknown>,
+): boolean => {
+  if (enabled !== previousWorkflow.enabled) {
+    return true;
+  }
+
+  if (name !== (previousWorkflow.name ?? '') || description !== (previousWorkflow.description ?? '')) {
+    return true;
+  }
+
+  if (triggerType !== previousWorkflow.triggerType) {
+    return true;
+  }
+
+  const previousFilterIds = previousWorkflow.filters?.map((f) => f.pluginFilterId) ?? [];
+  const currentFilterIds = orderedFilters.map((f) => f.id);
+  if (JSON.stringify(previousFilterIds) !== JSON.stringify(currentFilterIds)) {
+    return true;
+  }
+
+  const previousActionIds = previousWorkflow.actions?.map((a) => a.pluginActionId) ?? [];
+  const currentActionIds = orderedActions.map((a) => a.id);
+  if (JSON.stringify(previousActionIds) !== JSON.stringify(currentActionIds)) {
+    return true;
+  }
+
+  const previousFilterConfigs: Record<string, unknown> = {};
+  for (const [index, wf] of (previousWorkflow.filters ?? []).entries()) {
+    previousFilterConfigs[`filter_${index}`] = wf.filterConfig ?? {};
+  }
+  if (JSON.stringify(previousFilterConfigs) !== JSON.stringify(filterConfigs)) {
+    return true;
+  }
+
+  const previousActionConfigs: Record<string, unknown> = {};
+  for (const [index, wa] of (previousWorkflow.actions ?? []).entries()) {
+    previousActionConfigs[`action_${index}`] = wa.actionConfig ?? {};
+  }
+  if (JSON.stringify(previousActionConfigs) !== JSON.stringify(actionConfigs)) {
+    return true;
+  }
+
+  return false;
+};
+
+export const handleUpdateWorkflow = async (
+  workflowId: string,
+  name: string,
+  description: string,
+  enabled: boolean,
+  triggerType: PluginTriggerType,
+  orderedFilters: PluginFilterResponseDto[],
+  orderedActions: PluginActionResponseDto[],
+  filterConfigs: Record<string, unknown>,
+  actionConfigs: Record<string, unknown>,
+): Promise<WorkflowResponseDto> => {
+  const filters = orderedFilters.map((filter, index) => ({
+    pluginFilterId: filter.id,
+    filterConfig: filterConfigs[`filter_${index}`] ?? {},
+  })) as WorkflowFilterItemDto[];
+
+  const actions = orderedActions.map((action, index) => ({
+    pluginActionId: action.id,
+    actionConfig: actionConfigs[`action_${index}`] ?? {},
+  })) as WorkflowActionItemDto[];
+
+  const updateDto: WorkflowUpdateDto = {
+    name,
+    description,
+    enabled,
+    filters,
+    actions,
+    triggerType,
+  };
+
+  return updateWorkflow({ id: workflowId, workflowUpdateDto: updateDto });
+};
+
+export const getWorkflowActions = ($t: MessageFormatter, workflow: WorkflowResponseDto) => {
+  const ToggleEnabled: ActionItem = {
+    title: workflow.enabled ? $t('disable') : $t('enable'),
+    icon: workflow.enabled ? mdiPause : mdiPlay,
+    color: workflow.enabled ? 'danger' : 'primary',
+    onAction: async () => {
+      await handleToggleWorkflowEnabled(workflow);
+    },
+  };
+
+  const Edit: ActionItem = {
+    title: $t('edit'),
+    icon: mdiPencil,
+    onAction: () => handleNavigateToWorkflow(workflow),
+  };
+
+  const Delete: ActionItem = {
+    title: $t('delete'),
+    icon: mdiDelete,
+    color: 'danger',
+    onAction: async () => {
+      await handleDeleteWorkflow(workflow);
+    },
+  };
+
+  return { ToggleEnabled, Edit, Delete };
+};
+
+export const getWorkflowShowSchemaAction = (
+  $t: MessageFormatter,
+  isExpanded: boolean,
+  onToggle: () => void,
+): ActionItem => ({
+  title: isExpanded ? $t('hide_schema') : $t('show_schema'),
+  icon: mdiCodeJson,
+  onAction: onToggle,
+});
+
+export const handleCreateWorkflow = async (): Promise<WorkflowResponseDto | undefined> => {
+  const $t = await getFormatter();
+
+  try {
+    const workflow = await createWorkflow({
+      workflowCreateDto: {
+        name: $t('untitled_workflow'),
+        triggerType: PluginTriggerType.AssetCreate,
+        filters: [],
+        actions: [],
+        enabled: false,
+      },
+    });
+
+    await goto(`${AppRoute.WORKFLOWS}/${workflow.id}`);
+    return workflow;
+  } catch (error) {
+    handleError(error, $t('errors.unable_to_create'));
+  }
+};
+
+export const handleToggleWorkflowEnabled = async (
+  workflow: WorkflowResponseDto,
+): Promise<WorkflowResponseDto | undefined> => {
+  const $t = await getFormatter();
+
+  try {
+    const updated = await updateWorkflow({
+      id: workflow.id,
+      workflowUpdateDto: { enabled: !workflow.enabled },
+    });
+
+    eventManager.emit('WorkflowUpdate', updated);
+    toastManager.success($t('workflow_updated'));
+    return updated;
+  } catch (error) {
+    handleError(error, $t('errors.unable_to_update_workflow'));
+  }
+};
+
+export const handleDeleteWorkflow = async (workflow: WorkflowResponseDto): Promise<boolean> => {
+  const $t = await getFormatter();
+
+  const confirmed = await modalManager.showDialog({
+    prompt: $t('workflow_delete_prompt'),
+    confirmColor: 'danger',
+  });
+
+  if (!confirmed) {
+    return false;
+  }
+
+  try {
+    await deleteWorkflow({ id: workflow.id });
+    eventManager.emit('WorkflowDelete', workflow);
+    toastManager.success($t('workflow_deleted'));
+    return true;
+  } catch (error) {
+    handleError(error, $t('errors.unable_to_delete_workflow'));
+    return false;
+  }
+};
+
+export const handleNavigateToWorkflow = async (workflow: WorkflowResponseDto): Promise<void> => {
+  await goto(`${AppRoute.WORKFLOWS}/${workflow.id}`);
+};
+
+export const fetchPickerMetadata = async (
+  value: string | string[] | undefined,
+  subType: PickerSubType,
+): Promise<PickerMetadata | undefined> => {
+  if (!value) {
+    return undefined;
+  }
+
+  const isAlbum = subType === 'album-picker';
+
+  try {
+    if (Array.isArray(value) && value.length > 0) {
+      // Multiple selection
+      return isAlbum
+        ? await Promise.all(value.map((id) => getAlbumInfo({ id })))
+        : await Promise.all(value.map((id) => getPerson({ id })));
+    } else if (typeof value === 'string' && value) {
+      // Single selection
+      return isAlbum ? await getAlbumInfo({ id: value }) : await getPerson({ id: value });
+    }
+  } catch (error) {
+    console.error(`Failed to fetch picker metadata:`, error);
+  }
+
+  return undefined;
+};
--- a/web/src/lib/stores/upload.ts
+++ b/web/src/lib/stores/upload.ts
@@ -1,5 +1,5 @@
+import { UploadState, type UploadAsset } from '$lib/types';
 import { derived, writable } from 'svelte/store';
-import { UploadState, type UploadAsset } from '../models/upload-asset';

 function createUploadStore() {
  const uploadAssets = writable<Array<UploadAsset>>([]);
--- a/web/src/lib/types.ts
+++ b/web/src/lib/types.ts
@@ -12,3 +12,31 @@ export interface ReleaseEvent {
 export type QueueSnapshot = { timestamp: number; snapshot?: QueueResponseDto[] };

 export type HeaderButtonActionItem = ActionItem & { data?: { title?: string } };
+
+export enum UploadState {
+  PENDING,
+  STARTED,
+  DONE,
+  ERROR,
+  DUPLICATED,
+}
+
+export type UploadAsset = {
+  id: string;
+  file: File;
+  assetId?: string;
+  isTrashed?: boolean;
+  albumId?: string;
+  progress?: number;
+  state?: UploadState;
+  startDate?: number;
+  eta?: number;
+  speed?: number;
+  error?: unknown;
+  message?: string;
+};
+
+export enum OnboardingRole {
+  SERVER = 'server',
+  USER = 'user',
+}
--- a/web/src/lib/utils.ts
+++ b/web/src/lib/utils.ts
@@ -162,7 +162,7 @@ export const getQueueName = derived(t, ($t) => {
      [QueueName.Notifications]: $t('notifications'),
      [QueueName.BackupDatabase]: $t('admin.backup_database'),
      [QueueName.Ocr]: $t('admin.machine_learning_ocr'),
-      [QueueName.Workflow]: $t('workflow'),
+      [QueueName.Workflow]: $t('workflows'),
    };

    return names[name];
--- a/web/src/lib/utils/asset-utils.ts
+++ b/web/src/lib/utils/asset-utils.ts
@@ -353,7 +353,7 @@ const supportedImageMimeTypes = new Set([

 const isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent); // https://stackoverflow.com/a/23522755
 if (isSafari) {
-  supportedImageMimeTypes.add('image/heic').add('image/heif');
+  supportedImageMimeTypes.add('image/heic').add('image/heif').add('image/jxl');
 }

 /**
--- a/web/src/lib/utils/cancellable-task.spec.ts
+++ b/web/src/lib/utils/cancellable-task.spec.ts
@@ -0,0 +1,540 @@
+import { CancellableTask } from '$lib/utils/cancellable-task';
+
+describe('CancellableTask', () => {
+  describe('execute', () => {
+    it('should execute task successfully and return LOADED', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async (_: AbortSignal) => {
+        await new Promise((resolve) => setTimeout(resolve, 10));
+      });
+
+      const result = await task.execute(taskFn, true);
+
+      expect(result).toBe('LOADED');
+      expect(task.executed).toBe(true);
+      expect(task.loading).toBe(false);
+      expect(taskFn).toHaveBeenCalledTimes(1);
+    });
+
+    it('should call loadedCallback when task completes successfully', async () => {
+      const loadedCallback = vi.fn();
+      const task = new CancellableTask(loadedCallback);
+      const taskFn = vi.fn(async () => {});
+
+      await task.execute(taskFn, true);
+
+      expect(loadedCallback).toHaveBeenCalledTimes(1);
+    });
+
+    it('should return DONE if task is already executed', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {});
+
+      await task.execute(taskFn, true);
+      const result = await task.execute(taskFn, true);
+
+      expect(result).toBe('DONE');
+      expect(taskFn).toHaveBeenCalledTimes(1);
+    });
+
+    it('should wait if task is already running', async () => {
+      const task = new CancellableTask();
+      let resolveTask: () => void;
+      const taskPromise = new Promise<void>((resolve) => {
+        resolveTask = resolve;
+      });
+      const taskFn = vi.fn(async () => {
+        await taskPromise;
+      });
+
+      const promise1 = task.execute(taskFn, true);
+      const promise2 = task.execute(taskFn, true);
+
+      expect(task.loading).toBe(true);
+      resolveTask!();
+
+      const [result1, result2] = await Promise.all([promise1, promise2]);
+
+      expect(result1).toBe('LOADED');
+      expect(result2).toBe('WAITED');
+      expect(taskFn).toHaveBeenCalledTimes(1);
+    });
+
+    it('should pass AbortSignal to task function', async () => {
+      const task = new CancellableTask();
+      let capturedSignal: AbortSignal | null = null;
+      const taskFn = async (signal: AbortSignal) => {
+        await Promise.resolve();
+        capturedSignal = signal;
+      };
+
+      await task.execute(taskFn, true);
+
+      expect(capturedSignal).toBeInstanceOf(AbortSignal);
+    });
+
+    it('should set cancellable flag correctly', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {});
+
+      expect(task.cancellable).toBe(true);
+      const promise = task.execute(taskFn, false);
+      expect(task.cancellable).toBe(false);
+      await promise;
+    });
+
+    it('should not allow transition from prevent cancel to allow cancel when task is running', async () => {
+      const task = new CancellableTask();
+      let resolveTask: () => void;
+      const taskPromise = new Promise<void>((resolve) => {
+        resolveTask = resolve;
+      });
+      const taskFn = vi.fn(async () => {
+        await taskPromise;
+      });
+
+      const promise1 = task.execute(taskFn, false);
+      expect(task.cancellable).toBe(false);
+
+      const promise2 = task.execute(taskFn, true);
+      expect(task.cancellable).toBe(false);
+
+      resolveTask!();
+      await Promise.all([promise1, promise2]);
+    });
+  });
+
+  describe('cancel', () => {
+    it('should cancel a running task', async () => {
+      const task = new CancellableTask();
+      let taskStarted = false;
+      const taskFn = async (signal: AbortSignal) => {
+        taskStarted = true;
+        await new Promise((resolve) => setTimeout(resolve, 100));
+        if (signal.aborted) {
+          throw new DOMException('Aborted', 'AbortError');
+        }
+      };
+
+      const promise = task.execute(taskFn, true);
+
+      // Wait a bit to ensure task has started
+      await new Promise((resolve) => setTimeout(resolve, 10));
+      expect(taskStarted).toBe(true);
+
+      task.cancel();
+
+      const result = await promise;
+      expect(result).toBe('CANCELED');
+      expect(task.executed).toBe(false);
+    });
+
+    it('should call canceledCallback when task is canceled', async () => {
+      const canceledCallback = vi.fn();
+      const task = new CancellableTask(undefined, canceledCallback);
+      const taskFn = async (signal: AbortSignal) => {
+        await new Promise((resolve) => setTimeout(resolve, 100));
+        if (signal.aborted) {
+          throw new DOMException('Aborted', 'AbortError');
+        }
+      };
+
+      const promise = task.execute(taskFn, true);
+      await new Promise((resolve) => setTimeout(resolve, 10));
+      task.cancel();
+      await promise;
+
+      expect(canceledCallback).toHaveBeenCalledTimes(1);
+    });
+
+    it('should not cancel if task is not cancellable', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {
+        await new Promise((resolve) => setTimeout(resolve, 50));
+      });
+
+      const promise = task.execute(taskFn, false);
+      task.cancel();
+      const result = await promise;
+
+      expect(result).toBe('LOADED');
+      expect(task.executed).toBe(true);
+    });
+
+    it('should not cancel if task is already executed', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {});
+
+      await task.execute(taskFn, true);
+      expect(task.executed).toBe(true);
+
+      task.cancel();
+      expect(task.executed).toBe(true);
+    });
+  });
+
+  describe('reset', () => {
+    it('should reset task to initial state', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {});
+
+      await task.execute(taskFn, true);
+      expect(task.executed).toBe(true);
+
+      await task.reset();
+
+      expect(task.executed).toBe(false);
+      expect(task.cancelToken).toBe(null);
+      expect(task.loading).toBe(false);
+    });
+
+    it('should cancel running task before resetting', async () => {
+      const task = new CancellableTask();
+      const taskFn = async (signal: AbortSignal) => {
+        await new Promise((resolve) => setTimeout(resolve, 100));
+        if (signal.aborted) {
+          throw new DOMException('Aborted', 'AbortError');
+        }
+      };
+
+      const promise = task.execute(taskFn, true);
+      await new Promise((resolve) => setTimeout(resolve, 10));
+
+      const resetPromise = task.reset();
+
+      await promise;
+      await resetPromise;
+
+      expect(task.executed).toBe(false);
+      expect(task.loading).toBe(false);
+    });
+
+    it('should allow re-execution after reset', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {});
+
+      await task.execute(taskFn, true);
+      await task.reset();
+      const result = await task.execute(taskFn, true);
+
+      expect(result).toBe('LOADED');
+      expect(task.executed).toBe(true);
+      expect(taskFn).toHaveBeenCalledTimes(2);
+    });
+  });
+
+  describe('waitUntilCompletion', () => {
+    it('should return DONE if task is already executed', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {});
+
+      await task.execute(taskFn, true);
+      const result = await task.waitUntilCompletion();
+
+      expect(result).toBe('DONE');
+    });
+
+    it('should return WAITED if task completes while waiting', async () => {
+      const task = new CancellableTask();
+      let resolveTask: () => void;
+      const taskPromise = new Promise<void>((resolve) => {
+        resolveTask = resolve;
+      });
+      const taskFn = async () => {
+        await taskPromise;
+      };
+
+      const executePromise = task.execute(taskFn, true);
+      const waitPromise = task.waitUntilCompletion();
+
+      resolveTask!();
+
+      const [, waitResult] = await Promise.all([executePromise, waitPromise]);
+
+      expect(waitResult).toBe('WAITED');
+    });
+
+    it('should return CANCELED if task is canceled', async () => {
+      const task = new CancellableTask();
+      const taskFn = async (signal: AbortSignal) => {
+        await new Promise((resolve) => setTimeout(resolve, 100));
+        if (signal.aborted) {
+          throw new DOMException('Aborted', 'AbortError');
+        }
+      };
+
+      const executePromise = task.execute(taskFn, true);
+      const waitPromise = task.waitUntilCompletion();
+
+      await new Promise((resolve) => setTimeout(resolve, 10));
+      task.cancel();
+
+      const [, waitResult] = await Promise.all([executePromise, waitPromise]);
+
+      expect(waitResult).toBe('CANCELED');
+    });
+  });
+
+  describe('waitUntilExecution', () => {
+    it('should return DONE if task is already executed', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {});
+
+      await task.execute(taskFn, true);
+      const result = await task.waitUntilExecution();
+
+      expect(result).toBe('DONE');
+    });
+
+    it('should return WAITED if task completes successfully', async () => {
+      const task = new CancellableTask();
+      let resolveTask: () => void;
+      const taskPromise = new Promise<void>((resolve) => {
+        resolveTask = resolve;
+      });
+      const taskFn = async () => {
+        await taskPromise;
+      };
+
+      const executePromise = task.execute(taskFn, true);
+      const waitPromise = task.waitUntilExecution();
+
+      resolveTask!();
+
+      const [, waitResult] = await Promise.all([executePromise, waitPromise]);
+
+      expect(waitResult).toBe('WAITED');
+    });
+
+    it('should retry if task is canceled and wait for next execution', async () => {
+      vi.useFakeTimers();
+
+      const task = new CancellableTask();
+      let attempt = 0;
+      const taskFn = async (signal: AbortSignal) => {
+        attempt++;
+        await new Promise((resolve) => setTimeout(resolve, 100));
+        if (signal.aborted && attempt === 1) {
+          throw new DOMException('Aborted', 'AbortError');
+        }
+      };
+
+      // Start first execution
+      const executePromise1 = task.execute(taskFn, true);
+      const waitPromise = task.waitUntilExecution();
+
+      // Cancel the first execution
+      vi.advanceTimersByTime(10);
+      task.cancel();
+      vi.advanceTimersByTime(100);
+      await executePromise1;
+
+      // Start second execution
+      const executePromise2 = task.execute(taskFn, true);
+      vi.advanceTimersByTime(100);
+
+      const [executeResult, waitResult] = await Promise.all([executePromise2, waitPromise]);
+
+      expect(executeResult).toBe('LOADED');
+      expect(waitResult).toBe('WAITED');
+      expect(attempt).toBe(2);
+
+      vi.useRealTimers();
+    });
+  });
+
+  describe('error handling', () => {
+    it('should return ERRORED when task throws non-abort error', async () => {
+      const task = new CancellableTask();
+      const error = new Error('Task failed');
+      const taskFn = async () => {
+        await Promise.resolve();
+        throw error;
+      };
+
+      const result = await task.execute(taskFn, true);
+
+      expect(result).toBe('ERRORED');
+      expect(task.executed).toBe(false);
+    });
+
+    it('should call errorCallback when task throws non-abort error', async () => {
+      const errorCallback = vi.fn();
+      const task = new CancellableTask(undefined, undefined, errorCallback);
+      const error = new Error('Task failed');
+      const taskFn = async () => {
+        await Promise.resolve();
+        throw error;
+      };
+
+      await task.execute(taskFn, true);
+
+      expect(errorCallback).toHaveBeenCalledTimes(1);
+      expect(errorCallback).toHaveBeenCalledWith(error);
+    });
+
+    it('should return CANCELED when task throws AbortError', async () => {
+      const task = new CancellableTask();
+      const taskFn = async () => {
+        await Promise.resolve();
+        throw new DOMException('Aborted', 'AbortError');
+      };
+
+      const result = await task.execute(taskFn, true);
+
+      expect(result).toBe('CANCELED');
+      expect(task.executed).toBe(false);
+    });
+
+    it('should allow re-execution after error', async () => {
+      const task = new CancellableTask();
+      const taskFn1 = async () => {
+        await Promise.resolve();
+        throw new Error('Failed');
+      };
+      const taskFn2 = vi.fn(async () => {});
+
+      const result1 = await task.execute(taskFn1, true);
+      expect(result1).toBe('ERRORED');
+
+      const result2 = await task.execute(taskFn2, true);
+      expect(result2).toBe('LOADED');
+      expect(task.executed).toBe(true);
+    });
+  });
+
+  describe('loading property', () => {
+    it('should return true when task is running', async () => {
+      const task = new CancellableTask();
+      let resolveTask: () => void;
+      const taskPromise = new Promise<void>((resolve) => {
+        resolveTask = resolve;
+      });
+      const taskFn = async () => {
+        await taskPromise;
+      };
+
+      expect(task.loading).toBe(false);
+
+      const promise = task.execute(taskFn, true);
+      expect(task.loading).toBe(true);
+
+      resolveTask!();
+      await promise;
+
+      expect(task.loading).toBe(false);
+    });
+  });
+
+  describe('complete promise', () => {
+    it('should resolve when task completes successfully', async () => {
+      const task = new CancellableTask();
+      const taskFn = vi.fn(async () => {});
+
+      const completePromise = task.complete;
+      await task.execute(taskFn, true);
+      await expect(completePromise).resolves.toBeUndefined();
+    });
+
+    it('should reject when task is canceled', async () => {
+      const task = new CancellableTask();
+      const taskFn = async (signal: AbortSignal) => {
+        await new Promise((resolve) => setTimeout(resolve, 100));
+        if (signal.aborted) {
+          throw new DOMException('Aborted', 'AbortError');
+        }
+      };
+
+      const completePromise = task.complete;
+      const promise = task.execute(taskFn, true);
+      await new Promise((resolve) => setTimeout(resolve, 10));
+      task.cancel();
+      await promise;
+
+      await expect(completePromise).rejects.toBeUndefined();
+    });
+
+    it('should reject when task errors', async () => {
+      const task = new CancellableTask();
+      const taskFn = async () => {
+        await Promise.resolve();
+        throw new Error('Failed');
+      };
+
+      const completePromise = task.complete;
+      await task.execute(taskFn, true);
+
+      await expect(completePromise).rejects.toBeUndefined();
+    });
+  });
+
+  describe('abort signal handling', () => {
+    it('should automatically call abort() on signal when task is canceled', async () => {
+      const task = new CancellableTask();
+      let capturedSignal: AbortSignal | null = null;
+      const taskFn = async (signal: AbortSignal) => {
+        capturedSignal = signal;
+        // Simulate a long-running task
+        await new Promise((resolve) => setTimeout(resolve, 100));
+        if (signal.aborted) {
+          throw new DOMException('Aborted', 'AbortError');
+        }
+      };
+
+      const promise = task.execute(taskFn, true);
+
+      // Wait a bit to ensure task has started
+      await new Promise((resolve) => setTimeout(resolve, 10));
+
+      expect(capturedSignal).not.toBeNull();
+      expect(capturedSignal!.aborted).toBe(false);
+
+      // Cancel the task
+      task.cancel();
+
+      // Verify the signal was aborted
+      expect(capturedSignal!.aborted).toBe(true);
+
+      const result = await promise;
+      expect(result).toBe('CANCELED');
+    });
+
+    it('should detect if signal was aborted after task completes', async () => {
+      const task = new CancellableTask();
+      let controller: AbortController | null = null;
+      const taskFn = async (_: AbortSignal) => {
+        // Capture the controller to abort it externally
+        controller = task.cancelToken;
+        // Simulate some work
+        await new Promise((resolve) => setTimeout(resolve, 10));
+        // Now abort before the function returns
+        controller?.abort();
+      };
+
+      const result = await task.execute(taskFn, true);
+
+      expect(result).toBe('CANCELED');
+      expect(task.executed).toBe(false);
+    });
+
+    it('should handle abort signal in async operations', async () => {
+      const task = new CancellableTask();
+      const taskFn = async (signal: AbortSignal) => {
+        // Simulate listening to abort signal during async operation
+        return new Promise<void>((resolve, reject) => {
+          signal.addEventListener('abort', () => {
+            reject(new DOMException('Aborted', 'AbortError'));
+          });
+          setTimeout(() => resolve(), 100);
+        });
+      };
+
+      const promise = task.execute(taskFn, true);
+      await new Promise((resolve) => setTimeout(resolve, 10));
+      task.cancel();
+
+      const result = await promise;
+      expect(result).toBe('CANCELED');
+    });
+  });
+});
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Jason Rasmussen	ed8310af14	fix: shared-link-mapper	2025-12-22 14:57:10 -05:00
Jason Rasmussen	01e3b8e5df	refactor: form modals (#24790 )	2025-12-22 14:15:23 -05:00
Jason Rasmussen	5a7c9a252c	feat: disable admin setup (#24628 )	2025-12-22 14:15:08 -05:00
Jason Rasmussen	f99f5f4f91	refactor: map setting modal (#24789 )	2025-12-22 13:54:14 -05:00
Jason Rasmussen	8ad27c7cea	refactor: slideshow modal (#24788 )	2025-12-22 18:44:53 +00:00
Jason Rasmussen	edc21ed746	fix(web): stale album info (#24787 )	2025-12-22 19:38:57 +01:00
Jason Rasmussen	dd744f8ee3	refactor: album edit modal (#24786 )	2025-12-22 13:33:49 -05:00
Min Idzelis	f6f9a3abb4	fix: task never rejected on cancel, add tests (#24418 )	2025-12-22 13:12:43 -05:00
Jason Rasmussen	1c156a179b	feat: shared link edit (#24783 )	2025-12-22 11:47:06 -05:00
Jason Rasmussen	952f189d8b	feat: prefer admin settings page over users page (#24780 )	2025-12-22 11:31:22 -05:00
Jason Rasmussen	40e750e8be	refactor: api key service (#24779 )	2025-12-22 11:09:11 -05:00
Jason Rasmussen	c7510d572a	chore: move models (#24778 )	2025-12-22 15:23:57 +00:00
Jason Rasmussen	165f9e15ee	feat: modal routes (#24726 ) feat: new user route	2025-12-22 15:04:08 +00:00
Mert	dfdbb773ce	fix(web): display jxl original (#24766 ) display jxl original	2025-12-21 20:10:22 -06:00
bo0tzz	f053ce548d	fix: product keys wording in commercial guidelines faq (#24765 )	2025-12-21 19:35:21 +00:00
bo0tzz	d7c28470ee	feat: focus jumped-to item in timeline (#24738 )	2025-12-21 08:52:52 -06:00
Alex	28f6064240	feat: workflow ui (#24190 ) * feat: workflow ui * wip * wip * wip * pr feedback * refactor: picker field * use showDialog directly * better test * refactor step selection modal * move enable button to info form * use for Props * pr feedback * refactor ActionItem * refactor ActionItem * more refactor * fix: new schemaformfield has value of the same type * chore: clean up	2025-12-20 21:07:07 -06:00
Alex	4b3b458bb6	chore: update info.plist app version in bump-version (#24722 )	2025-12-20 21:02:11 -06:00
Sergey Katsubo	4736b4e3e8	chore(server): improve log messages (#24744 ) * Clarify the "asset not found" log during thumbnail generation: it's about database * Move not found sidecars to verbose level instead of "old=null, new=null" at debug * Log memory creation at default level * Add explicit log for missing exif date time Instead of: Date and time is undefined using exifTag undefined for asset ... * Log database migration start/end at default level Currently, these messages are logged as "debug". But they are not printed when debug or verbose level is set. This is due to the known limitation: SystemConfigService sets LogLevel later on, after migrations run.	2025-12-20 21:00:34 -06:00