Cutlery/immich
1
0
Fork 1
mirror of https://github.com/immich-app/immich.git synced 2025-05-31 20:25:32 -04:00
Code Issues Packages Projects Releases Wiki Activity

refactor: password reset success modal (#18239)

Browse Source
This commit is contained in:
Jason Rasmussen 2025-05-12 18:18:13 -04:00 committed by GitHub
parent 7280331b76
commit bb775110ef
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 23 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
web/src/lib/modals/ConfirmModal.svelte
View File

@ -10,7 +10,6 @@
confirmColor?: Color; confirmColor?: Color;
cancelText?: string; cancelText?: string;
cancelColor?: Color; cancelColor?: Color;
hideCancelButton?: boolean;
disabled?: boolean; disabled?: boolean;
size?: 'small' | 'medium'; size?: 'small' | 'medium';
onClose: (confirmed: boolean) => void; onClose: (confirmed: boolean) => void;
@ -24,7 +23,6 @@
confirmColor = 'danger', confirmColor = 'danger',
cancelText = $t('cancel'), cancelText = $t('cancel'),
cancelColor = 'secondary', cancelColor = 'secondary',
hideCancelButton = false,
disabled = false, disabled = false,
size = 'small', size = 'small',
onClose, onClose,
@ -45,11 +43,9 @@
<ModalFooter> <ModalFooter>
<div class="flex gap-3 w-full"> <div class="flex gap-3 w-full">
{#if !hideCancelButton} <Button shape="round" color={cancelColor} fullWidth onclick={() => onClose(false)}>
<Button shape="round" color={cancelColor} fullWidth onclick={() => onClose(false)}> {cancelText}
{cancelText} </Button>
</Button>
{/if}
<Button shape="round" color={confirmColor} fullWidth onclick={handleConfirm} {disabled}> <Button shape="round" color={confirmColor} fullWidth onclick={handleConfirm} {disabled}>
{confirmText} {confirmText}
</Button> </Button>

29
web/src/lib/forms/password-reset-success.svelte → web/src/lib/modals/PasswordResetSuccessModal.svelte
View File

@ -1,8 +1,7 @@
<script lang="ts"> <script lang="ts">
import ConfirmModal from '$lib/modals/ConfirmModal.svelte';
import { copyToClipboard } from '$lib/utils'; import { copyToClipboard } from '$lib/utils';
import { Code, IconButton, Text } from '@immich/ui'; import { Button, Code, IconButton, Modal, ModalBody, ModalFooter, Text } from '@immich/ui';
import { mdiContentCopy } from '@mdi/js'; import { mdiCheck, mdiContentCopy } from '@mdi/js';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
type Props = { type Props = {
@ -13,14 +12,14 @@
const { onClose, newPassword }: Props = $props(); const { onClose, newPassword }: Props = $props();
</script> </script>
<ConfirmModal <Modal
title={$t('password_reset_success')} title={$t('password_reset_success')}
confirmText={$t('done')} icon={mdiCheck}
{onClose} onClose={() => onClose()}
hideCancelButton={true} size="small"
confirmColor="success" class="bg-light text-dark"
> >
{#snippet promptSnippet()} <ModalBody>
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<Text>{$t('admin.user_password_has_been_reset')}</Text> <Text>{$t('admin.user_password_has_been_reset')}</Text>
@ -39,5 +38,13 @@
<Text>{$t('admin.user_password_reset_description')}</Text> <Text>{$t('admin.user_password_reset_description')}</Text>
</div> </div>
{/snippet} </ModalBody>
</ConfirmModal>
<ModalFooter>
<div class="flex gap-3 w-full">
<Button shape="round" color="primary" fullWidth onclick={() => onClose()}>
{$t('done')}
</Button>
</div>
</ModalFooter>
</Modal>

4
web/src/routes/admin/users/[id]/+page.svelte
View File

@ -8,8 +8,8 @@
} from '$lib/components/shared-components/notification/notification'; } from '$lib/components/shared-components/notification/notification';
import UserAvatar from '$lib/components/shared-components/user-avatar.svelte'; import UserAvatar from '$lib/components/shared-components/user-avatar.svelte';
import { AppRoute } from '$lib/constants'; import { AppRoute } from '$lib/constants';
import PasswordResetSuccess from '$lib/forms/password-reset-success.svelte';
import { modalManager } from '$lib/managers/modal-manager.svelte'; import { modalManager } from '$lib/managers/modal-manager.svelte';
import PasswordResetSuccessModal from '$lib/modals/PasswordResetSuccessModal.svelte';
import UserDeleteConfirmModal from '$lib/modals/UserDeleteConfirmModal.svelte'; import UserDeleteConfirmModal from '$lib/modals/UserDeleteConfirmModal.svelte';
import UserEditModal from '$lib/modals/UserEditModal.svelte'; import UserEditModal from '$lib/modals/UserEditModal.svelte';
import { locale } from '$lib/stores/preferences.store'; import { locale } from '$lib/stores/preferences.store';
@ -116,7 +116,7 @@
}, },
}); });
await modalManager.show(PasswordResetSuccess, { newPassword }); await modalManager.show(PasswordResetSuccessModal, { newPassword });
} catch (error) { } catch (error) {
handleError(error, $t('errors.unable_to_reset_password')); handleError(error, $t('errors.unable_to_reset_password'));
} }