a3fc153207
Changes include updating the user and team billing specs to increase visibility timeout and alter navigation route post-billing. Minor adjustments have been made to the page aesthetics and redirection logic. Also, refactored import statements for code organization purposes. Changes in the build script are also reflected in the commit.
72 lines
1.9 KiB
TypeScript
72 lines
1.9 KiB
TypeScript
import { Check, ChevronRight } from 'lucide-react';
|
|
|
|
import { Button } from '@kit/ui/button';
|
|
import { Heading } from '@kit/ui/heading';
|
|
import { Trans } from '@kit/ui/trans';
|
|
|
|
/**
|
|
* Retrieves the session status for a Stripe checkout session.
|
|
* Since we should only arrive here for a successful checkout, we only check
|
|
* for the `paid` status.
|
|
**/
|
|
export function BillingSessionStatus({
|
|
customerEmail,
|
|
onRedirect,
|
|
}: React.PropsWithChildren<{
|
|
customerEmail: string;
|
|
onRedirect: () => void;
|
|
}>) {
|
|
return (
|
|
<section
|
|
data-test={'payment-return-success'}
|
|
className={
|
|
'fade-in dark:border-border mx-auto max-w-xl rounded-xl border border-transparent p-16 xl:drop-shadow-2xl' +
|
|
' bg-background animate-in slide-in-from-bottom-8 ease-out' +
|
|
' zoom-in-50 dark:shadow-primary/20 duration-1000 dark:shadow-2xl'
|
|
}
|
|
>
|
|
<div
|
|
className={
|
|
'flex flex-col items-center justify-center space-y-6 text-center'
|
|
}
|
|
>
|
|
<Check
|
|
className={
|
|
'h-16 w-16 rounded-full bg-green-500 p-1 text-white ring-8' +
|
|
' ring-green-500/30 dark:ring-green-500/50'
|
|
}
|
|
/>
|
|
|
|
<Heading level={3}>
|
|
<span className={'mr-4 font-semibold'}>
|
|
<Trans i18nKey={'billing:checkoutSuccessTitle'} />
|
|
</span>
|
|
🎉
|
|
</Heading>
|
|
|
|
<div className={'text-muted-foreground flex flex-col space-y-4'}>
|
|
<p>
|
|
<Trans
|
|
i18nKey={'billing:checkoutSuccessDescription'}
|
|
values={{ customerEmail }}
|
|
/>
|
|
</p>
|
|
</div>
|
|
|
|
<form>
|
|
<Button
|
|
data-test={'checkout-success-back-link'}
|
|
formAction={onRedirect}
|
|
>
|
|
<span>
|
|
<Trans i18nKey={'billing:checkoutSuccessBackButton'} />
|
|
</span>
|
|
|
|
<ChevronRight className={'h-4'} />
|
|
</Button>
|
|
</form>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|