helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-14 17:36:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat(web): unlink live photos (#12574)

Browse source 
feat(web): unlink live photo
This commit is contained in:
Jason Rasmussen 2024-09-11 16:26:29 -04:00 • committed by GitHub
parent 233372303b
commit 01c7adc24d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 148 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

55
web/src/lib/components/photos-page/actions/link-live-photo-action.svelte
View file

@ -1,44 +1,75 @@
<script lang="ts">
import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte';
import type { OnLink } from '$lib/utils/actions';
import { AssetTypeEnum, updateAsset } from '@immich/sdk';
import { mdiMotionPlayOutline, mdiTimerSand } from '@mdi/js';
import type { OnLink, OnUnlink } from '$lib/utils/actions';
import { handleError } from '$lib/utils/handle-error';
import { AssetTypeEnum, getAssetInfo, updateAsset } from '@immich/sdk';
import { mdiLinkOff, mdiMotionPlayOutline, mdiTimerSand } from '@mdi/js';
import { t } from 'svelte-i18n';
import MenuOption from '../../shared-components/context-menu/menu-option.svelte';
import { getAssetControlContext } from '../asset-select-control-bar.svelte';
export let onLink: OnLink;
export let onUnlink: OnUnlink;
export let menuItem = false;
export let unlink = false;
let loading = false;
const text = $t('link_motion_video');
const icon = mdiMotionPlayOutline;
$: text = unlink ? $t('unlink_motion_video') : $t('link_motion_video');
$: icon = unlink ? mdiLinkOff : mdiMotionPlayOutline;
const { clearSelect, getOwnedAssets } = getAssetControlContext();
const onClick = () => (unlink ? handleUnlink() : handleLink());
const handleLink = async () => {
let [still, motion] = [...getOwnedAssets()];
if (still.type === AssetTypeEnum.Video) {
[still, motion] = [motion, still];
}
loading = true;
const response = await updateAsset({ id: still.id, updateAssetDto: { livePhotoVideoId: motion.id } });
onLink(response);
clearSelect();
loading = false;
try {
loading = true;
const stillResponse = await updateAsset({ id: still.id, updateAssetDto: { livePhotoVideoId: motion.id } });
onLink({ still: stillResponse, motion });
clearSelect();
} catch (error) {
handleError(error, $t('errors.unable_to_link_motion_video'));
} finally {
loading = false;
}
};
const handleUnlink = async () => {
const [still] = [...getOwnedAssets()];
const motionId = still?.livePhotoVideoId;
if (!motionId) {
return;
}
try {
loading = true;
const stillResponse = await updateAsset({ id: still.id, updateAssetDto: { livePhotoVideoId: null } });
const motionResponse = await getAssetInfo({ id: motionId });
onUnlink({ still: stillResponse, motion: motionResponse });
clearSelect();
} catch (error) {
handleError(error, $t('errors.unable_to_unlink_motion_video'));
} finally {
loading = false;
}
};
</script>
{#if menuItem}
<MenuOption {text} {icon} onClick={handleLink} />
<MenuOption {text} {icon} {onClick} />
{/if}
{#if !menuItem}
{#if loading}
<CircleIconButton title={$t('loading')} icon={mdiTimerSand} />
{:else}
<CircleIconButton title={text} {icon} on:click={handleLink} />
<CircleIconButton title={text} {icon} on:click={onClick} />
{/if}
{/if}