mirror of
https://github.com/immich-app/immich
synced 2025-11-07 17:27:20 +00:00
chore: rename edit album form modal (#19375)
This commit is contained in:
parent
0426699f13
commit
1dc8fa2979
2 changed files with 2 additions and 2 deletions
|
|
@ -2,7 +2,6 @@
|
|||
import { goto } from '$app/navigation';
|
||||
import AlbumCardGroup from '$lib/components/album-page/album-card-group.svelte';
|
||||
import AlbumsTable from '$lib/components/album-page/albums-table.svelte';
|
||||
import EditAlbumForm from '$lib/components/forms/edit-album-form.svelte';
|
||||
import MenuOption from '$lib/components/shared-components/context-menu/menu-option.svelte';
|
||||
import RightClickContextMenu from '$lib/components/shared-components/context-menu/right-click-context-menu.svelte';
|
||||
import {
|
||||
|
|
@ -11,6 +10,7 @@
|
|||
} from '$lib/components/shared-components/notification/notification';
|
||||
import { AppRoute } from '$lib/constants';
|
||||
import { modalManager } from '$lib/managers/modal-manager.svelte';
|
||||
import AlbumEditModal from '$lib/modals/AlbumEditModal.svelte';
|
||||
import AlbumShareModal from '$lib/modals/AlbumShareModal.svelte';
|
||||
import QrCodeModal from '$lib/modals/QrCodeModal.svelte';
|
||||
import SharedLinkCreateModal from '$lib/modals/SharedLinkCreateModal.svelte';
|
||||
|
|
@ -258,7 +258,7 @@
|
|||
|
||||
const handleEdit = async (album: AlbumResponseDto) => {
|
||||
closeAlbumContextMenu();
|
||||
const editedAlbum = await modalManager.show(EditAlbumForm, {
|
||||
const editedAlbum = await modalManager.show(AlbumEditModal, {
|
||||
album,
|
||||
});
|
||||
if (editedAlbum) {
|
||||
|
|
|
|||
|
|
@ -1,76 +0,0 @@
|
|||
<script lang="ts">
|
||||
import AlbumCover from '$lib/components/album-page/album-cover.svelte';
|
||||
import { handleError } from '$lib/utils/handle-error';
|
||||
import { updateAlbumInfo, type AlbumResponseDto } from '@immich/sdk';
|
||||
import { Button, Modal, ModalBody, ModalFooter } from '@immich/ui';
|
||||
import { mdiRenameOutline } from '@mdi/js';
|
||||
import { t } from 'svelte-i18n';
|
||||
|
||||
interface Props {
|
||||
album: AlbumResponseDto;
|
||||
onClose: (album?: AlbumResponseDto) => void;
|
||||
}
|
||||
|
||||
let { album = $bindable(), onClose }: Props = $props();
|
||||
|
||||
let albumName = $state(album.albumName);
|
||||
let description = $state(album.description);
|
||||
|
||||
let isSubmitting = $state(false);
|
||||
|
||||
const handleUpdateAlbumInfo = async () => {
|
||||
isSubmitting = true;
|
||||
try {
|
||||
await updateAlbumInfo({
|
||||
id: album.id,
|
||||
updateAlbumDto: {
|
||||
albumName,
|
||||
description,
|
||||
},
|
||||
});
|
||||
album.albumName = albumName;
|
||||
album.description = description;
|
||||
onClose(album);
|
||||
} catch (error) {
|
||||
handleError(error, $t('errors.unable_to_update_album_info'));
|
||||
} finally {
|
||||
isSubmitting = false;
|
||||
}
|
||||
};
|
||||
|
||||
const onsubmit = async (event: Event) => {
|
||||
event.preventDefault();
|
||||
await handleUpdateAlbumInfo();
|
||||
};
|
||||
</script>
|
||||
|
||||
<Modal icon={mdiRenameOutline} title={$t('edit_album')} size="medium" {onClose}>
|
||||
<ModalBody>
|
||||
<form {onsubmit} autocomplete="off" id="edit-album-form">
|
||||
<div class="flex items-center">
|
||||
<div class="hidden sm:flex">
|
||||
<AlbumCover {album} class="h-[200px] w-[200px] m-4 shadow-lg" />
|
||||
</div>
|
||||
|
||||
<div class="grow">
|
||||
<div class="m-4 flex flex-col gap-2">
|
||||
<label class="immich-form-label" for="name">{$t('name')}</label>
|
||||
<input class="immich-form-input" id="name" type="text" bind:value={albumName} />
|
||||
</div>
|
||||
|
||||
<div class="m-4 flex flex-col gap-2">
|
||||
<label class="immich-form-label" for="description">{$t('description')}</label>
|
||||
<textarea class="immich-form-input" id="description" bind:value={description}></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</ModalBody>
|
||||
|
||||
<ModalFooter>
|
||||
<div class="flex gap-2 w-full">
|
||||
<Button shape="round" color="secondary" fullWidth onclick={() => onClose()}>{$t('cancel')}</Button>
|
||||
<Button shape="round" type="submit" fullWidth disabled={isSubmitting} form="edit-album-form">{$t('save')}</Button>
|
||||
</div>
|
||||
</ModalFooter>
|
||||
</Modal>
|
||||
Loading…
Add table
Add a link
Reference in a new issue