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

refactor: buy immich (#18289)

Browse Source 
* refactor: buy container

* refactor: buy immich
This commit is contained in:
Jason Rasmussen 2025-05-14 12:09:10 -04:00 committed by GitHub
parent 3944f5d73b
commit fac1beb7d8
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 52 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -4,6 +4,7 @@
import { purchaseStore } from '$lib/stores/purchase.store'; import { purchaseStore } from '$lib/stores/purchase.store';
import { handleError } from '$lib/utils/handle-error'; import { handleError } from '$lib/utils/handle-error';
import { activateProduct, getActivationKey } from '$lib/utils/license-utils'; import { activateProduct, getActivationKey } from '$lib/utils/license-utils';
import { Heading } from '@immich/ui';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
import UserPurchaseOptionCard from './individual-purchase-option-card.svelte'; import UserPurchaseOptionCard from './individual-purchase-option-card.svelte';
import ServerPurchaseOptionCard from './server-purchase-option-card.svelte'; import ServerPurchaseOptionCard from './server-purchase-option-card.svelte';
@ -36,12 +37,11 @@
}; };
</script> </script>
<section class="p-4"> <section>
<div>
{#if showTitle} {#if showTitle}
<h1 class="text-4xl font-bold tracking-wider"> <Heading color="primary" tag="h1" class="text-4xl font-bold tracking-wider">
{$t('purchase_option_title')} {$t('purchase_option_title')}
</h1> </Heading>
{/if} {/if}
{#if showMessage} {#if showMessage}
@ -83,5 +83,4 @@
> >
</form> </form>
</div> </div>
</div>
</section> </section>

24
web/src/routes/(user)/buy/+page.svelte
View File

@ -3,13 +3,13 @@
import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte'; import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
import LicenseActivationSuccess from '$lib/components/shared-components/purchasing/purchase-activation-success.svelte'; import LicenseActivationSuccess from '$lib/components/shared-components/purchasing/purchase-activation-success.svelte';
import LicenseContent from '$lib/components/shared-components/purchasing/purchase-content.svelte'; import LicenseContent from '$lib/components/shared-components/purchasing/purchase-content.svelte';
import SupporterBadge from '$lib/components/shared-components/side-bar/supporter-badge.svelte';
import { AppRoute } from '$lib/constants'; import { AppRoute } from '$lib/constants';
import { purchaseStore } from '$lib/stores/purchase.store';
import { Alert, Container, Stack } from '@immich/ui';
import { mdiAlertCircleOutline } from '@mdi/js';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
import type { PageData } from './$types'; import type { PageData } from './$types';
import Icon from '$lib/components/elements/icon.svelte';
import { mdiAlertCircleOutline } from '@mdi/js';
import { purchaseStore } from '$lib/stores/purchase.store';
import SupporterBadge from '$lib/components/shared-components/side-bar/supporter-badge.svelte';
interface Props { interface Props {
data: PageData; data: PageData;
@ -21,16 +21,10 @@
</script> </script>
<UserPageLayout title={$t('buy')}> <UserPageLayout title={$t('buy')}>
<section class="mx-4 flex place-content-center"> <Container size="medium" center>
<div class="w-full max-w-3xl"> <Stack gap={4} class="mt-4">
{#if data.isActivated === false} {#if data.isActivated === false}
<div <Alert icon={mdiAlertCircleOutline} color="danger" title={$t('purchase_failed_activation')} />
class="bg-red-100 text-red-700 px-4 py-3 rounded-md flex place-items-center place-content-center gap-2"
role="alert"
>
<Icon path={mdiAlertCircleOutline} size="18" />
<p>{$t('purchase_failed_activation')}</p>
</div>
{/if} {/if}
{#if $isPurchased} {#if $isPurchased}
@ -46,6 +40,6 @@
}} }}
/> />
{/if} {/if}
</div> </Stack>
</section> </Container>
</UserPageLayout> </UserPageLayout>