refactor: user edit modal (#23025)

This commit is contained in:
Jason Rasmussen 2025-10-17 14:38:57 -04:00 committed by GitHub
parent 67f093f75b
commit 24a6757630
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -5,7 +5,7 @@
import { ByteUnit, convertFromBytes, convertToBytes } from '$lib/utils/byte-units'; import { ByteUnit, convertFromBytes, convertToBytes } from '$lib/utils/byte-units';
import { handleError } from '$lib/utils/handle-error'; import { handleError } from '$lib/utils/handle-error';
import { updateUserAdmin, type UserAdminResponseDto } from '@immich/sdk'; import { updateUserAdmin, type UserAdminResponseDto } from '@immich/sdk';
import { Button, Field, HStack, Modal, ModalBody, ModalFooter, Switch } from '@immich/ui'; import { Button, Field, HStack, Input, Label, Link, Modal, ModalBody, ModalFooter, Switch, Text } from '@immich/ui';
import { mdiAccountEditOutline } from '@mdi/js'; import { mdiAccountEditOutline } from '@mdi/js';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
@ -60,23 +60,16 @@
<Modal title={$t('edit_user')} size="small" icon={mdiAccountEditOutline} {onClose}> <Modal title={$t('edit_user')} size="small" icon={mdiAccountEditOutline} {onClose}>
<ModalBody> <ModalBody>
<form onsubmit={onSubmit} autocomplete="off" id="edit-user-form"> <form onsubmit={onSubmit} autocomplete="off" id="edit-user-form">
<div class="mb-4 flex flex-col gap-2"> <Field label={$t('email')} required>
<label class="immich-form-label" for="email">{$t('email')}</label> <Input type="email" bind:value={email} />
<input class="immich-form-input" id="email" name="email" type="email" bind:value={email} /> </Field>
</div>
<div class="my-4 flex flex-col gap-2"> <Field label={$t('name')} required class="mt-4">
<label class="immich-form-label" for="name">{$t('name')}</label> <Input bind:value={name} />
<input class="immich-form-input" id="name" name="name" type="text" required bind:value={name} /> </Field>
</div>
<div class="my-4 flex flex-col gap-2"> <div class="flex flex-col gap-1 mt-4">
<label class="flex items-center gap-2 immich-form-label" for="quotaSize"> <Label class="flex items-center gap-2" for="quotaSize">{$t('admin.quota_size_gib')}</Label>
{$t('admin.quota_size_gib')}
{#if quotaSizeWarning}
<p class="text-red-400 text-sm">{$t('errors.quota_higher_than_disk_size')}</p>
{/if}</label
>
<input <input
class="immich-form-input" class="immich-form-input"
id="quotaSize" id="quotaSize"
@ -87,29 +80,25 @@
min="0" min="0"
bind:value={quotaSize} bind:value={quotaSize}
/> />
{#if quotaSizeWarning}
<Text size="small" color="danger">{$t('errors.quota_higher_than_disk_size')}</Text>
{/if}
</div> </div>
<div class="my-4 flex flex-col gap-2"> <Field label={$t('storage_label')} class="mt-4">
<label class="immich-form-label" for="storage-label">{$t('storage_label')}</label> <Input bind:value={storageLabel} />
<input </Field>
class="immich-form-input"
id="storage-label"
name="storage-label"
type="text"
bind:value={storageLabel}
/>
<p> <Text size="small" class="mt-2" color="muted">
{$t('admin.note_apply_storage_label_previous_assets')} {$t('admin.note_apply_storage_label_previous_assets')}
<a href={AppRoute.ADMIN_JOBS} class="text-primary"> <Link href={AppRoute.ADMIN_JOBS}>
{$t('admin.storage_template_migration_job')} {$t('admin.storage_template_migration_job')}
</a> </Link>
</p> </Text>
</div>
{#if user.id !== $authUser.id} {#if user.id !== $authUser.id}
<Field label={$t('admin.admin_user')}> <Field label={$t('admin.admin_user')}>
<Switch bind:checked={isAdmin} /> <Switch bind:checked={isAdmin} class="mt-4" />
</Field> </Field>
{/if} {/if}
</form> </form>