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

restore: bulk actions (#3730)

Browse source 
* feat: improve bulk isArchive and isFavorite updates

* chore: open api
This commit is contained in:
Jason Rasmussen 2023-08-16 16:04:55 -04:00 • committed by GitHub
parent 8568ec838a
commit bab739efbd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
30 changed files with 734 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

56
web/src/lib/components/photos-page/actions/archive-action.svelte
View file

@ -4,15 +4,15 @@
NotificationType,
notificationController,
} from '$lib/components/shared-components/notification/notification';
import { handleError } from '$lib/utils/handle-error';
import { api } from '@api';
import ArchiveArrowDownOutline from 'svelte-material-icons/ArchiveArrowDownOutline.svelte';
import ArchiveArrowUpOutline from 'svelte-material-icons/ArchiveArrowUpOutline.svelte';
import TimerSand from 'svelte-material-icons/TimerSand.svelte';
import MenuOption from '../../shared-components/context-menu/menu-option.svelte';
import { OnAssetArchive, getAssetControlContext } from '../asset-select-control-bar.svelte';
import { OnArchive, getAssetControlContext } from '../asset-select-control-bar.svelte';
export let onAssetArchive: OnAssetArchive = (asset, isArchived) => {
asset.isArchived = isArchived;
};
export let onArchive: OnArchive | undefined = undefined;
export let menuItem = false;
export let unarchive = false;
@ -20,32 +20,50 @@
$: text = unarchive ? 'Unarchive' : 'Archive';
$: logo = unarchive ? ArchiveArrowUpOutline : ArchiveArrowDownOutline;
let loading = false;
const { getAssets, clearSelect } = getAssetControlContext();
const handleArchive = async () => {
const isArchived = !unarchive;
let cnt = 0;
loading = true;
for (const asset of getAssets()) {
if (asset.isArchived !== isArchived) {
api.assetApi.updateAsset({ id: asset.id, updateAssetDto: { isArchived } });
try {
const assets = Array.from(getAssets()).filter((asset) => asset.isArchived !== isArchived);
const ids = assets.map(({ id }) => id);
onAssetArchive(asset, isArchived);
cnt = cnt + 1;
if (ids.length > 0) {
await api.assetApi.updateAssets({ assetBulkUpdateDto: { ids, isArchived } });
}
for (const asset of assets) {
asset.isArchived = isArchived;
}
onArchive?.(ids, isArchived);
notificationController.show({
message: `${isArchived ? 'Archived' : 'Unarchived'} ${ids.length}`,
type: NotificationType.Info,
});
clearSelect();
} catch (error) {
handleError(error, `Unable to ${isArchived ? 'archive' : 'unarchive'}`);
} finally {
loading = false;
}
notificationController.show({
message: `${isArchived ? 'Archived' : 'Unarchived'} ${cnt}`,
type: NotificationType.Info,
});
clearSelect();
};
</script>
{#if menuItem}
<MenuOption {text} on:click={handleArchive} />
{:else}
<CircleIconButton title={text} {logo} on:click={handleArchive} />
{/if}
{#if !menuItem}
{#if loading}
<CircleIconButton title="Loading" logo={TimerSand} />
{:else}
<CircleIconButton title={text} {logo} on:click={handleArchive} />
{/if}
{/if}

21
web/src/lib/components/photos-page/actions/delete-assets.svelte
View file

@ -1,23 +1,27 @@
<script lang="ts">
import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte';
import ConfirmDialogue from '$lib/components/shared-components/confirm-dialogue.svelte';
import {
NotificationType,
notificationController,
} from '$lib/components/shared-components/notification/notification';
import { handleError } from '$lib/utils/handle-error';
import { api } from '@api';
import DeleteOutline from 'svelte-material-icons/DeleteOutline.svelte';
import { OnAssetDelete, getAssetControlContext } from '../asset-select-control-bar.svelte';
import ConfirmDialogue from '$lib/components/shared-components/confirm-dialogue.svelte';
import { handleError } from '../../../utils/handle-error';
import TimerSand from 'svelte-material-icons/TimerSand.svelte';
import MenuOption from '../../shared-components/context-menu/menu-option.svelte';
import { OnAssetDelete, getAssetControlContext } from '../asset-select-control-bar.svelte';
export let onAssetDelete: OnAssetDelete;
export let menuItem = false;
const { getAssets, clearSelect } = getAssetControlContext();
let isShowConfirmation = false;
let loading = false;
const handleDelete = async () => {
loading = true;
try {
let count = 0;
@ -44,14 +48,21 @@
handleError(e, 'Error deleting assets');
} finally {
isShowConfirmation = false;
loading = false;
}
};
</script>
{#if menuItem}
<MenuOption text="Delete" on:click={() => (isShowConfirmation = true)} />
{:else}
<CircleIconButton title="Delete" logo={DeleteOutline} on:click={() => (isShowConfirmation = true)} />
{/if}
{#if !menuItem}
{#if loading}
<CircleIconButton title="Loading" logo={TimerSand} />
{:else}
<CircleIconButton title="Delete" logo={DeleteOutline} on:click={() => (isShowConfirmation = true)} />
{/if}
{/if}
{#if isShowConfirmation}

59
web/src/lib/components/photos-page/actions/favorite-action.svelte
View file

@ -5,14 +5,14 @@
NotificationType,
notificationController,
} from '$lib/components/shared-components/notification/notification';
import { handleError } from '$lib/utils/handle-error';
import { api } from '@api';
import HeartMinusOutline from 'svelte-material-icons/HeartMinusOutline.svelte';
import HeartOutline from 'svelte-material-icons/HeartOutline.svelte';
import { OnAssetFavorite, getAssetControlContext } from '../asset-select-control-bar.svelte';
import TimerSand from 'svelte-material-icons/TimerSand.svelte';
import { OnFavorite, getAssetControlContext } from '../asset-select-control-bar.svelte';
export let onAssetFavorite: OnAssetFavorite = (asset, isFavorite) => {
asset.isFavorite = isFavorite;
};
export let onFavorite: OnFavorite | undefined = undefined;
export let menuItem = false;
export let removeFavorite: boolean;
@ -20,31 +20,50 @@
$: text = removeFavorite ? 'Remove from Favorites' : 'Favorite';
$: logo = removeFavorite ? HeartMinusOutline : HeartOutline;
let loading = false;
const { getAssets, clearSelect } = getAssetControlContext();
const handleFavorite = () => {
const handleFavorite = async () => {
const isFavorite = !removeFavorite;
loading = true;
let cnt = 0;
for (const asset of getAssets()) {
if (asset.isFavorite !== isFavorite) {
api.assetApi.updateAsset({ id: asset.id, updateAssetDto: { isFavorite } });
onAssetFavorite(asset, isFavorite);
cnt = cnt + 1;
try {
const assets = Array.from(getAssets()).filter((asset) => asset.isFavorite !== isFavorite);
const ids = assets.map(({ id }) => id);
if (ids.length > 0) {
await api.assetApi.updateAssets({ assetBulkUpdateDto: { ids, isFavorite } });
}
for (const asset of assets) {
asset.isFavorite = isFavorite;
}
onFavorite?.(ids, isFavorite);
notificationController.show({
message: isFavorite ? `Added ${ids.length} to favorites` : `Removed ${ids.length} from favorites`,
type: NotificationType.Info,
});
clearSelect();
} catch (error) {
handleError(error, `Unable to ${isFavorite ? 'add to' : 'remove from'} favorites`);
} finally {
loading = false;
}
notificationController.show({
message: isFavorite ? `Added ${cnt} to favorites` : `Removed ${cnt} from favorites`,
type: NotificationType.Info,
});
clearSelect();
};
</script>
{#if menuItem}
<MenuOption {text} on:click={handleFavorite} />
{:else}
<CircleIconButton title={text} {logo} on:click={handleFavorite} />
{/if}
{#if !menuItem}
{#if loading}
<CircleIconButton title="Loading" logo={TimerSand} />
{:else}
<CircleIconButton title={text} {logo} on:click={handleFavorite} />
{/if}
{/if}

4
web/src/lib/components/photos-page/asset-select-control-bar.svelte
View file

@ -2,8 +2,8 @@
import { createContext } from '$lib/utils/context';
export type OnAssetDelete = (assetId: string) => void;
export type OnAssetArchive = (asset: AssetResponseDto, archived: boolean) => void;
export type OnAssetFavorite = (asset: AssetResponseDto, favorite: boolean) => void;
export type OnArchive = (ids: string[], isArchived: boolean) => void;
export type OnFavorite = (ids: string[], favorite: boolean) => void;
export interface AssetControlContext {
// Wrap assets in a function, because context isn't reactive.