Add card button component and enhance routing

This commit introduces the Card Button component to the UI package and improves URL matching by allowing end to be a boolean or function. Navigation menu components now support both cases. Additionally, changes have been made to improve the visual and functional aspects of various components throughout the application. This includes changes in pricing display, route active checking, and the introduction of new files such as HomeAddAccountButton and HomeAccountsList.
This commit is contained in:
giancarlo
2024-05-13 02:09:28 +07:00
parent f4e2b8cf75
commit 84271a31a8
15 changed files with 186 additions and 21 deletions

View File

@@ -161,7 +161,7 @@ function PricingItem(
data-cy={'subscription-plan'}
className={cn(
props.className,
`s-full relative flex flex-1 grow flex-col items-stretch justify-between
`s-full relative flex flex-1 grow flex-col items-stretch justify-between
self-stretch rounded-lg border p-8 lg:w-4/12 xl:max-w-[20rem]`,
{
['border-primary']: highlighted,
@@ -210,11 +210,9 @@ function PricingItem(
<div className={'flex flex-col space-y-1'}>
<Price>
{lineItem ? (
formatCurrency(props.product.currency, lineItem.cost)
) : (
<Trans i18nKey={'billing:custom'} />
)}
{lineItem
? formatCurrency(props.product.currency, lineItem.cost)
: props.plan.label ?? <Trans i18nKey={'billing:custom'} />}
</Price>
<If condition={props.plan.name}>
@@ -415,7 +413,7 @@ function DefaultCheckoutButton(
id: string;
name?: string | undefined;
href?: string;
label?: string;
buttonLabel?: string;
};
product: {
@@ -443,7 +441,7 @@ function DefaultCheckoutButton(
`${signUpPath}?plan=${planId}&next=${subscriptionPath}?plan=${planId}${redirectToCheckoutParam}` ??
'';
const label = props.plan.label ?? 'common:getStartedWithPlan';
const label = props.plan.buttonLabel ?? 'common:getStartedWithPlan';
return (
<Link className={'w-full'} href={linkHref}>