feat: unassign faces

web/src/lib/components/faces-page/unmerge-face-selector.svelte

@@ -6,10 +6,11 @@
     createPerson,
     getAllPeople,
     reassignFaces,
+    unassignFaces,
     type AssetFaceUpdateItem,
     type PersonResponseDto,
   } from '@immich/sdk';
-  import { mdiMerge, mdiPlus } from '@mdi/js';
+  import { mdiMerge, mdiPlus, mdiTagRemove } from '@mdi/js';
   import { createEventDispatcher, onMount } from 'svelte';
   import { quintOut } from 'svelte/easing';
   import { fly } from 'svelte/transition';
@@ -28,6 +29,7 @@
   let disableButtons = false;
   let showLoadingSpinnerCreate = false;
   let showLoadingSpinnerReassign = false;
+  let showLoadingSpinnerUnassign = false;
   let hasSelection = false;
   let screenHeight: number;
 
@@ -111,6 +113,24 @@
     showLoadingSpinnerReassign = false;
     dispatch('confirm');
   };
+
+  const handleUnassign = async () => {
+    const timeout = setTimeout(() => (showLoadingSpinnerUnassign = true), 100);
+    try {
+      disableButtons = true;
+      await unassignFaces({ assetFaceUpdateDto: { data: selectedPeople } });
+      notificationController.show({
+        message: `Un-assigned ${assetIds.length} asset${assetIds.length > 1 ? 's' : ''}`,
+        type: NotificationType.Info,
+      });
+    } catch (error) {
+      handleError(error, 'Unable to unassign assets');
+    } finally {
+      clearTimeout(timeout);
+    }
+    showLoadingSpinnerCreate = false;
+    dispatch('confirm');
+  };
 </script>
 
 <svelte:window bind:innerHeight={screenHeight} />
@@ -126,6 +146,19 @@
     </svelte:fragment>
     <svelte:fragment slot="trailing">
       <div class="flex gap-4">
+        <Button
+          title={'Unassign selected assets to a new person'}
+          size={'sm'}
+          disabled={disableButtons || hasSelection}
+          on:click={handleUnassign}
+        >
+          {#if !showLoadingSpinnerUnassign}
+            <Icon path={mdiTagRemove} size={18} />
+          {:else}
+            <LoadingSpinner />
+          {/if}
+          <span class="ml-2"> Unassign</span></Button
+        >
         <Button
           title={'Assign selected assets to a new person'}
           size={'sm'}