mirror of
https://github.com/immich-app/immich
synced 2025-11-07 17:27:20 +00:00
feat(web): suggest people when typing a name (#4126)
* feat(web): suggest people when entering a name * fix: border size from 2 to 1 pixel * pr feedback * fix: web unit test * pr feedback --------- Co-authored-by: Alex <alex.tran1502@gmail.com>
This commit is contained in:
parent
9a7e48eaa6
commit
fc64be6603
4 changed files with 117 additions and 48 deletions
|
|
@ -3,10 +3,10 @@
|
|||
import { createEventDispatcher } from 'svelte';
|
||||
import ImageThumbnail from '../assets/thumbnail/image-thumbnail.svelte';
|
||||
import Button from '../elements/buttons/button.svelte';
|
||||
import { clickOutside } from '$lib/utils/click-outside';
|
||||
|
||||
export let person: PersonResponseDto;
|
||||
let name = person.name;
|
||||
export let name: string;
|
||||
export let suggestedPeople = false;
|
||||
|
||||
const dispatch = createEventDispatcher<{
|
||||
change: string;
|
||||
|
|
@ -15,9 +15,9 @@
|
|||
</script>
|
||||
|
||||
<div
|
||||
class="flex max-w-lg place-items-center rounded-lg border bg-gray-100 p-2 dark:border-transparent dark:bg-gray-700"
|
||||
use:clickOutside
|
||||
on:outclick={() => dispatch('cancel')}
|
||||
class="flex w-full place-items-center {suggestedPeople
|
||||
? 'rounded-t-lg border-b dark:border-immich-dark-gray'
|
||||
: 'rounded-lg'} bg-gray-100 p-2 dark:bg-gray-700"
|
||||
>
|
||||
<ImageThumbnail
|
||||
circle
|
||||
|
|
|
|||
|
|
@ -17,16 +17,7 @@
|
|||
|
||||
export let personMerge1: PersonResponseDto;
|
||||
export let personMerge2: PersonResponseDto;
|
||||
export let people: PersonResponseDto[];
|
||||
let potentialMergePeople: PersonResponseDto[] = people
|
||||
.filter(
|
||||
(person: PersonResponseDto) =>
|
||||
personMerge2.name.toLowerCase() === person.name.toLowerCase() &&
|
||||
person.id !== personMerge2.id &&
|
||||
person.id !== personMerge1.id &&
|
||||
!person.isHidden,
|
||||
)
|
||||
.slice(0, 3);
|
||||
export let potentialMergePeople: PersonResponseDto[];
|
||||
|
||||
let choosePersonToMerge = false;
|
||||
|
||||
|
|
@ -48,7 +39,9 @@
|
|||
<h1 class="truncate px-4 py-4 font-medium text-immich-primary dark:text-immich-dark-primary">
|
||||
Merge faces - {title}
|
||||
</h1>
|
||||
<CircleIconButton logo={Close} on:click={() => dispatch('close')} />
|
||||
<div class="p-2">
|
||||
<CircleIconButton logo={Close} on:click={() => dispatch('close')} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center justify-center px-2 py-4 md:h-36 md:px-4 md:py-4">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue