immich-app/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-12-20 09:15:35 +03:00
Code Issues Packages Projects Releases 18 Wiki Activity

refactor: side bar modals (#18134)

Browse Source
This commit is contained in:
Daniel Dietzler
2025-05-07 16:01:51 +02:00
committed by GitHub
parent 867f6e64f9
commit bbd8de177b
8 changed files with 41 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/lib/components/shared-components/purchasing/purchase-activation-success.svelte
View File

@@ -1,11 +1,11 @@
<script lang="ts">
import Button from '$lib/components/elements/buttons/button.svelte';
import Icon from '$lib/components/elements/icon.svelte';
import { t } from 'svelte-i18n';
import { mdiPartyPopper } from '@mdi/js';
import SettingSwitch from '$lib/components/shared-components/settings/setting-switch.svelte';
import { preferences } from '$lib/stores/user.store';
import { setSupportBadgeVisibility } from '$lib/utils/purchase-utils';
import { mdiPartyPopper } from '@mdi/js';
import { t } from 'svelte-i18n';
interface Props {
onDone: () => void;
@@ -14,7 +14,7 @@
let { onDone }: Props = $props();
</script>
<div class="m-auto w-3/4 text-center flex flex-col place-content-center place-items-center dark:text-white my-6">
<div class="m-auto w-3/4 text-center flex flex-col place-content-center place-items-center my-6">
<Icon path={mdiPartyPopper} class="text-immich-primary dark:text-immich-dark-primary" size="96" />
<p class="text-4xl mt-8 font-bold">{$t('purchase_activated_title')}</p>
<p class="text-lg mt-6">{$t('purchase_activated_subtitle')}</p>

12
web/src/lib/components/shared-components/purchasing/purchase-content.svelte
View File

@@ -1,12 +1,12 @@
<script lang="ts">
import { handleError } from '$lib/utils/handle-error';
import ServerPurchaseOptionCard from './server-purchase-option-card.svelte';
import UserPurchaseOptionCard from './individual-purchase-option-card.svelte';
import { activateProduct, getActivationKey } from '$lib/utils/license-utils';
import Button from '$lib/components/elements/buttons/button.svelte';
import LoadingSpinner from '$lib/components/shared-components/loading-spinner.svelte';
import { purchaseStore } from '$lib/stores/purchase.store';
import { handleError } from '$lib/utils/handle-error';
import { activateProduct, getActivationKey } from '$lib/utils/license-utils';
import { t } from 'svelte-i18n';
import UserPurchaseOptionCard from './individual-purchase-option-card.svelte';
import ServerPurchaseOptionCard from './server-purchase-option-card.svelte';
interface Props {
onActivate: () => void;
@@ -39,13 +39,13 @@
<section class="p-4">
<div>
{#if showTitle}
<h1 class="text-4xl font-bold text-immich-primary dark:text-immich-dark-primary tracking-wider">
<h1 class="text-4xl font-bold tracking-wider">
{$t('purchase_option_title')}
</h1>
{/if}
{#if showMessage}
<div class="mt-2 dark:text-immich-gray">
<div class="mt-2">
<p>
{$t('purchase_panel_info_1')}
</p>

30
web/src/lib/components/shared-components/purchasing/purchase-modal.svelte
View File

@@ -1,30 +0,0 @@
<script lang="ts">
import FullScreenModal from '$lib/components/shared-components/full-screen-modal.svelte';
import PurchaseActivationSuccess from '$lib/components/shared-components/purchasing/purchase-activation-success.svelte';
import PurchaseContent from '$lib/components/shared-components/purchasing/purchase-content.svelte';
import Portal from '$lib/components/shared-components/portal/portal.svelte';
interface Props {
onClose: () => void;
}
let { onClose }: Props = $props();
let showProductActivated = $state(false);
</script>
<Portal>
<FullScreenModal showLogo title="" {onClose} width="wide">
{#if showProductActivated}
<PurchaseActivationSuccess onDone={onClose} />
{:else}
<PurchaseContent
onActivate={() => {
showProductActivated = true;
}}
showMessage={false}
/>
{/if}
</FullScreenModal>
</Portal>