💬 Update annual benefit (#1289)

This commit is contained in:
Luke Vella 2024-08-31 11:44:52 +01:00 committed by GitHub
parent 5d8651740d
commit 5abb943676
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 33 additions and 32 deletions

View file

@ -28,6 +28,6 @@
"keepPollsIndefinitely": "Keep polls indefinitely", "keepPollsIndefinitely": "Keep polls indefinitely",
"whenPollInactive": "When does a poll become inactive?", "whenPollInactive": "When does a poll become inactive?",
"whenPollInactiveAnswer": "Polls become inactive when all date options are in the past AND the poll has not been accessed for over 30 days. Inactive polls are automatically deleted if you do not have a paid subscription.", "whenPollInactiveAnswer": "Polls become inactive when all date options are in the past AND the poll has not been accessed for over 30 days. Inactive polls are automatically deleted if you do not have a paid subscription.",
"discount": "Save {amount}", "yearlyBillingDescription": "per year",
"yearlyBillingDescription": "per year" "annualBenefit": "{count} months free"
} }

View file

@ -72,15 +72,6 @@ const PriceTables = ({
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="yearly" className="inline-flex gap-x-2.5"> <TabsTrigger value="yearly" className="inline-flex gap-x-2.5">
<Trans i18nKey="pricing:billingPeriodYearly" defaults="Yearly" /> <Trans i18nKey="pricing:billingPeriodYearly" defaults="Yearly" />
<Badge variant="green" className="inline-flex gap-2">
<Trans
i18nKey="pricing:discount"
defaults="Save {amount}"
values={{
amount: `$${(pricingData.monthly.amount * 12 - pricingData.yearly.amount) / 100}`,
}}
/>
</Badge>
</TabsTrigger> </TabsTrigger>
</TabsList> </TabsList>
</div> </div>
@ -137,9 +128,20 @@ const PriceTables = ({
</BillingPlanDescription> </BillingPlanDescription>
</BillingPlanHeader> </BillingPlanHeader>
<TabsContent value="yearly"> <TabsContent value="yearly">
<BillingPlanPrice> <div className="flex items-center gap-x-2">
${pricingData.yearly.amount / 100} <BillingPlanPrice>
</BillingPlanPrice> ${pricingData.yearly.amount / 100}
</BillingPlanPrice>
<Badge variant="green" className="inline-flex gap-2">
<Trans
i18nKey="pricing:annualBenefit"
defaults="{count} months free!"
values={{
count: 4,
}}
/>
</Badge>
</div>
<BillingPlanPeriod> <BillingPlanPeriod>
<Trans <Trans
i18nKey="pricing:yearlyBillingDescription" i18nKey="pricing:yearlyBillingDescription"

View file

@ -262,7 +262,6 @@
"pastEventsEmptyStateDescription": "When you schedule events, they will appear here.", "pastEventsEmptyStateDescription": "When you schedule events, they will appear here.",
"activePollCount": "{{activePollCount}} Live", "activePollCount": "{{activePollCount}} Live",
"createPoll": "Create poll", "createPoll": "Create poll",
"yearlyDiscount": "Save {amount}",
"yearlyBillingDescription": "per year", "yearlyBillingDescription": "per year",
"addToCalendar": "Add to Calendar", "addToCalendar": "Add to Calendar",
"microsoft365": "Microsoft 365", "microsoft365": "Microsoft 365",
@ -273,5 +272,6 @@
"timeZoneChangeDetectorTitle": "Timezone Change Detected", "timeZoneChangeDetectorTitle": "Timezone Change Detected",
"timeZoneChangeDetectorMessage": "Your timezone has changed to {currentTimeZone}. Do you want to update your preferences?", "timeZoneChangeDetectorMessage": "Your timezone has changed to {currentTimeZone}. Do you want to update your preferences?",
"yesUpdateTimezone": "Yes, update my timezone", "yesUpdateTimezone": "Yes, update my timezone",
"noKeepCurrentTimezone": "No, keep the current timezone" "noKeepCurrentTimezone": "No, keep the current timezone",
"annualBenefit": "{count} months free"
} }

View file

@ -41,19 +41,6 @@ export const BillingPlans = ({ pricingData }: { pricingData: PricingData }) => {
</TabsTrigger> </TabsTrigger>
<TabsTrigger value="yearly" className="inline-flex gap-x-2.5"> <TabsTrigger value="yearly" className="inline-flex gap-x-2.5">
<Trans i18nKey="billingPeriodYearly" /> <Trans i18nKey="billingPeriodYearly" />
<Badge variant="green">
<Trans
i18nKey="yearlyDiscount"
defaults="Save {amount}"
values={{
amount: `$${
(pricingData.monthly.amount * 12 -
pricingData.yearly.amount) /
100
}`,
}}
/>
</Badge>
</TabsTrigger> </TabsTrigger>
</TabsList> </TabsList>
</div> </div>
@ -109,9 +96,21 @@ export const BillingPlans = ({ pricingData }: { pricingData: PricingData }) => {
</div> </div>
<div className="flex"> <div className="flex">
<TabsContent value="yearly"> <TabsContent value="yearly">
<BillingPlanPrice> <div className="flex items-center gap-x-2">
${pricingData.yearly.amount / 100} <BillingPlanPrice>
</BillingPlanPrice> ${pricingData.yearly.amount / 100}
</BillingPlanPrice>
<Badge variant="green">
<Trans
i18nKey="annualBenefit"
defaults="{count} months free"
values={{
count: 4,
}}
/>
</Badge>
</div>
<BillingPlanPeriod> <BillingPlanPeriod>
<Trans <Trans
i18nKey="yearlyBillingDescription" i18nKey="yearlyBillingDescription"