1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2024-12-29 15:11:58 +00:00

feat(web): use websocket to update the feature photo (#10683)

feat: use ws to update the feature photo
This commit is contained in:
martin 2024-06-28 21:40:18 +02:00 committed by GitHub
parent 821570f2fb
commit e0bb9add91
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 27 additions and 3 deletions

View file

@ -8,6 +8,8 @@
import { getMetadataSearchQuery } from '$lib/utils/metadata-search'; import { getMetadataSearchQuery } from '$lib/utils/metadata-search';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
import EmptyPlaceholder from '$lib/components/shared-components/empty-placeholder.svelte'; import EmptyPlaceholder from '$lib/components/shared-components/empty-placeholder.svelte';
import { onMount } from 'svelte';
import { websocketEvents } from '$lib/stores/websocket';
export let data: PageData; export let data: PageData;
@ -36,6 +38,18 @@
MAX_PLACE_ITEMS = screenSize < 768 ? Math.floor(innerWidth / 150) : Math.floor(innerWidth / 172); MAX_PLACE_ITEMS = screenSize < 768 ? Math.floor(innerWidth / 150) : Math.floor(innerWidth / 172);
} }
} }
onMount(() => {
return websocketEvents.on('on_person_thumbnail', (personId: string) => {
people.map((person) => {
if (person.id === personId) {
person.updatedAt = Date.now().toString();
}
});
// trigger reactivity
people = people;
});
});
</script> </script>
<svelte:window bind:innerWidth={screenSize} /> <svelte:window bind:innerWidth={screenSize} />

View file

@ -15,7 +15,7 @@
NotificationType, NotificationType,
} from '$lib/components/shared-components/notification/notification'; } from '$lib/components/shared-components/notification/notification';
import { ActionQueryParameterValue, AppRoute, QueryParameter } from '$lib/constants'; import { ActionQueryParameterValue, AppRoute, QueryParameter } from '$lib/constants';
import { getPeopleThumbnailUrl } from '$lib/utils'; import { getPeopleThumbnailUrl, handlePromiseError } from '$lib/utils';
import { handleError } from '$lib/utils/handle-error'; import { handleError } from '$lib/utils/handle-error';
import { shortcut } from '$lib/actions/shortcut'; import { shortcut } from '$lib/actions/shortcut';
import { import {
@ -35,6 +35,7 @@
import SearchPeople from '$lib/components/faces-page/people-search.svelte'; import SearchPeople from '$lib/components/faces-page/people-search.svelte';
import LinkButton from '$lib/components/elements/buttons/link-button.svelte'; import LinkButton from '$lib/components/elements/buttons/link-button.svelte';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
import { websocketEvents } from '$lib/stores/websocket';
export let data: PageData; export let data: PageData;
@ -79,12 +80,21 @@
} }
} }
onMount(async () => { onMount(() => {
const getSearchedPeople = $page.url.searchParams.get(QueryParameter.SEARCHED_PEOPLE); const getSearchedPeople = $page.url.searchParams.get(QueryParameter.SEARCHED_PEOPLE);
if (getSearchedPeople) { if (getSearchedPeople) {
searchName = getSearchedPeople; searchName = getSearchedPeople;
await handleSearchPeople(true, searchName); handlePromiseError(handleSearchPeople(true, searchName));
} }
return websocketEvents.on('on_person_thumbnail', (personId: string) => {
people.map((person) => {
if (person.id === personId) {
person.updatedAt = Date.now().toString();
}
});
// trigger reactivity
people = people;
});
}); });
const handleSearch = async () => { const handleSearch = async () => {