Files
medreport_mrb2b/packages/features/notifications/src/components/success-notification.tsx

69 lines
1.6 KiB
TypeScript

import Image from 'next/image';
import { redirect } from 'next/navigation';
import { MedReportLogo } from '@/components/med-report-logo';
import { Button } from '@kit/ui/button';
import { Trans } from '@kit/ui/trans';
export const SuccessNotification = ({
showLogo = true,
title,
titleKey,
descriptionKey,
walletProps,
buttonProps,
}: {
showLogo?: boolean;
title?: string;
titleKey?: string;
descriptionKey?: string;
walletProps?: {
amount: string;
expiredAt: string;
};
buttonProps?: {
buttonTitleKey: string;
href: string;
};
}) => {
return (
<div className="border-border rounded-3xl border px-16 pt-4 pb-12">
{showLogo && <MedReportLogo />}
<div className="flex flex-col items-center px-4">
<Image
src="/assets/success.png"
alt="Success"
className="pt-6 pb-8"
width={326}
height={195}
/>
<h1 className="pb-2 text-center">
{title || <Trans i18nKey={titleKey} />}
</h1>
<p className="text-muted-foreground text-sm">
<Trans i18nKey={descriptionKey} />
</p>
</div>
{walletProps && (
<div>
<Trans i18nKey="common.wallet.balance" />
<p></p>
<Trans
i18nKey="common.wallet.expiredAt"
values={{ expiredAt: '12.12.2025' }}
/>
</div>
)}
{buttonProps && (
<Button
className="mt-8 w-full"
onClick={() => redirect(buttonProps.href)}
>
<Trans i18nKey={buttonProps.buttonTitleKey} />
</Button>
)}
</div>
);
};