refactor: use event-manager

web/src/lib/components/shared-components/gallery-viewer/gallery-viewer.svelte

@@ -228,11 +228,9 @@
   };
 
   const toggleArchive = async () => {
-    const onUndoArchive = assetInteraction.isAllArchived ? undefined : () => onReload?.();
     const ids = await archiveAssets(
       assetInteraction.selectedAssets,
       assetInteraction.isAllArchived ? AssetVisibility.Timeline : AssetVisibility.Archive,
-      onUndoArchive,
     );
     if (ids) {
       assets = assets.filter((asset) => !ids.includes(asset.id));

web/src/lib/components/shared-components/map/map.svelte

@@ -318,12 +318,12 @@
     untrack(() => map?.jumpTo({ center, zoom }));
   });
 
-  const onAssetsDelete = async () => {
+  const onAssetsChanged = async () => {
     mapMarkers = await loadMapMarkers();
   };
 </script>
 
-<OnEvents {onAssetsDelete} />
+<OnEvents onAssetsDelete={onAssetsChanged} onAssetsArchive={onAssetsChanged} onAssetsUnarchive={onAssetsChanged} />
 
 <!--  We handle style loading ourselves so we set style blank here -->
 <MapLibre

web/src/lib/components/timeline/actions/ArchiveAction.svelte

@@ -26,9 +26,8 @@
   const handleArchive = async () => {
     const visibility = unarchive ? AssetVisibility.Timeline : AssetVisibility.Archive;
     const assets = [...getOwnedAssets()].filter((asset) => asset.visibility !== visibility);
-    const onUndoArchive = (ids: string[]) => onArchive?.(ids, AssetVisibility.Timeline);
     loading = true;
-    const ids = await archiveAssets(assets, visibility as AssetVisibility, onUndoArchive);
+    const ids = await archiveAssets(assets, visibility as AssetVisibility);
     if (ids) {
       onArchive?.(ids, visibility);
       clearSelect();

web/src/lib/components/timeline/actions/TimelineKeyboardActions.svelte

@@ -70,9 +70,7 @@
 
   const toggleArchive = async () => {
     const visibility = assetInteraction.isAllArchived ? AssetVisibility.Timeline : AssetVisibility.Archive;
-    const onUndoArchive = (ids: string[]) =>
+    const ids = await archiveAssets(assetInteraction.selectedAssets, visibility);
-      timelineManager.update(ids, (asset) => (asset.visibility = AssetVisibility.Timeline));
-    const ids = await archiveAssets(assetInteraction.selectedAssets, visibility, onUndoArchive);
     timelineManager.update(ids, (asset) => (asset.visibility = visibility));
     eventManager.emit('AssetsArchive', ids);
     deselectAllAssets();

web/src/lib/managers/event-manager.svelte.ts

@@ -34,6 +34,7 @@ export type Events = {
 
   AssetUpdate: [AssetResponseDto];
   AssetsArchive: [string[]];
+  AssetsUnarchive: [string[]];
   AssetsDelete: [string[]];
   AssetEditsApplied: [string];
   AssetsTag: [string[]];

web/src/lib/managers/timeline-manager/timeline-manager.svelte.ts

@@ -23,7 +23,7 @@ import {
   type TimelineDateTime,
   type TimelineYearMonth,
 } from '$lib/utils/timeline-util';
-import { AssetOrder, getAssetInfo, getTimeBuckets, type AssetResponseDto } from '@immich/sdk';
+import { AssetOrder, AssetVisibility, getAssetInfo, getTimeBuckets, type AssetResponseDto } from '@immich/sdk';
 import { clamp, isEqual } from 'lodash-es';
 import { SvelteDate, SvelteSet } from 'svelte/reactivity';
 import { DayGroup } from './day-group.svelte';
@@ -114,6 +114,7 @@ export class TimelineManager extends VirtualScrollManager {
     this.#unsubscribes.push(
       eventManager.on({
         AssetUpdate: (asset: AssetResponseDto) => this.upsertAssets([toTimelineAsset(asset)]),
+        AssetsUnarchive: (ids) => this.update(ids, (asset) => (asset.visibility = AssetVisibility.Timeline)),
       }),
     );
   }

web/src/lib/utils/asset-utils.ts

@@ -1,5 +1,6 @@
 import { authManager } from '$lib/managers/auth-manager.svelte';
 import { downloadManager } from '$lib/managers/download-manager.svelte';
+import { eventManager } from '$lib/managers/event-manager.svelte';
 import { TimelineManager } from '$lib/managers/timeline-manager/timeline-manager.svelte';
 import type { TimelineAsset } from '$lib/managers/timeline-manager/types';
 import type { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
@@ -440,10 +441,7 @@ export const toggleArchive = async (asset: AssetResponseDto) => {
           description: $t('added_to_archive'),
           button: {
             label: $t('undo'),
-            onclick: () =>
+            onclick: () => undoArchiveAssets([asset.id]),
-              undoArchiveAssets([asset.id], () => {
-                asset.isArchived = false;
-              }),
           },
         },
         { timeout: 5000 },
@@ -458,7 +456,7 @@ export const toggleArchive = async (asset: AssetResponseDto) => {
   return asset;
 };
 
-const undoArchiveAssets = async (ids: string[], onUndo: ((ids: string[]) => void) | undefined = undefined) => {
+const undoArchiveAssets = async (ids: string[]) => {
   const $t = get(t);
   try {
     if (ids.length > 0) {
@@ -470,17 +468,13 @@ const undoArchiveAssets = async (ids: string[], onUndo: ((ids: string[]) => void
       });
     }
 
-    onUndo?.(ids);
+    eventManager.emit('AssetsUnarchive', ids);
   } catch (error) {
     handleError(error, $t('errors.unable_to_archive_unarchive', { values: { archived: false } }));
   }
 };
 
-export const archiveAssets = async (
+export const archiveAssets = async (assets: { id: string }[], visibility: AssetVisibility) => {
-  assets: { id: string }[],
-  visibility: AssetVisibility,
-  onUndoArchive: ((ids: string[]) => void) | undefined = undefined,
-) => {
   const ids = assets.map(({ id }) => id);
   const $t = get(t);
 
@@ -497,7 +491,7 @@ export const archiveAssets = async (
           description: $t('archived_count', { values: { count: ids.length } }),
           button: {
             label: $t('undo'),
-            onclick: () => undoArchiveAssets(ids, onUndoArchive),
+            onclick: () => undoArchiveAssets(ids),
           },
         },
         { timeout: 5000 },

web/src/routes/(user)/people/[personId]/[[photos=photos]]/[[assetId=id]]/+page.svelte

@@ -330,6 +330,7 @@
   onPersonAssetDelete={handlePersonAssetDelete}
   onAssetsDelete={updateAssetCount}
   onAssetsArchive={updateAssetCount}
+  onAssetsUnarchive={updateAssetCount}
 />
 
 <main