- backend: users.preferences jsonb (migration 000004), Me returns preferences, PATCH /auth/me/preferences with validation (visible list + labels) - frontend: gear in info section opens PhotoInfoSettingsDialog; base attribute set shown by default, remaining under ellipsis; per-attribute visibility and custom labels persisted to the profile; reset clears settings from the profile - frontend: dialog has select-all/deselect-all icon buttons (no 'show all'); EXIF constants extracted to lib/exif.ts - fix: render modal overlays via portal to document.body so they center in the viewport despite transformed panel/rail ancestors - openspec: sync lightroom-workspace-ui artifacts (spec/design/proposal/tasks 9.8)
91 lines
2.2 KiB
Svelte
91 lines
2.2 KiB
Svelte
<script lang="ts">
|
|
import Icon from './Icon.svelte';
|
|
import { portal } from '$lib/actions/portal';
|
|
import { albums } from '$lib/stores/albums.svelte';
|
|
import type { Album } from '$lib/types';
|
|
|
|
interface Props {
|
|
onClose: () => void;
|
|
onCreated?: (album: Album) => void;
|
|
}
|
|
|
|
let { onClose, onCreated }: Props = $props();
|
|
|
|
let title = $state('');
|
|
let busy = $state(false);
|
|
let error = $state('');
|
|
|
|
async function submit(ev: Event) {
|
|
ev.preventDefault();
|
|
if (!title.trim() || busy) return;
|
|
busy = true;
|
|
error = '';
|
|
try {
|
|
const album = await albums.create(title.trim());
|
|
onCreated?.(album);
|
|
onClose();
|
|
} catch (e) {
|
|
error = (e as Error).message;
|
|
} finally {
|
|
busy = false;
|
|
}
|
|
}
|
|
|
|
function onKey(ev: KeyboardEvent) {
|
|
if (ev.key === 'Escape') onClose();
|
|
}
|
|
|
|
function autofocus(node: HTMLInputElement) {
|
|
node.focus();
|
|
}
|
|
</script>
|
|
|
|
<svelte:window onkeydown={onKey} />
|
|
|
|
<div
|
|
use:portal
|
|
class="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4"
|
|
role="dialog"
|
|
aria-modal="true"
|
|
aria-label="Новый альбом"
|
|
tabindex="-1"
|
|
onclick={(e) => {
|
|
if (e.target === e.currentTarget) onClose();
|
|
}}
|
|
onkeydown={onKey}
|
|
>
|
|
<form
|
|
class="border-border bg-bg-elevated w-full max-w-sm space-y-4 rounded-xl border p-5"
|
|
onsubmit={submit}
|
|
>
|
|
<h2 class="text-lg font-semibold">Новый альбом</h2>
|
|
<label class="block">
|
|
<span class="text-text-muted mb-1 block text-sm">Название</span>
|
|
<input
|
|
bind:value={title}
|
|
use:autofocus
|
|
class="border-border bg-bg text-text w-full rounded-lg border px-3 py-2"
|
|
placeholder="Например, Отпуск"
|
|
/>
|
|
</label>
|
|
{#if error}<p class="text-danger text-sm">{error}</p>{/if}
|
|
<div class="flex justify-end gap-2">
|
|
<button
|
|
type="button"
|
|
class="border-border text-text rounded-lg border px-4 py-2 text-sm"
|
|
onclick={onClose}
|
|
>
|
|
Отмена
|
|
</button>
|
|
<button
|
|
type="submit"
|
|
disabled={busy || !title.trim()}
|
|
class="bg-primary text-primary-fg inline-flex items-center gap-1.5 rounded-lg px-4 py-2 text-sm disabled:opacity-50"
|
|
>
|
|
<Icon name="add" class="size-4" />
|
|
{busy ? 'Создание…' : 'Создать'}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|