diff --git a/web/public/static/langs/en.json b/web/public/static/langs/en.json
index efd877d3..06fe139e 100644
--- a/web/public/static/langs/en.json
+++ b/web/public/static/langs/en.json
@@ -219,6 +219,8 @@
"account_upgrade_dialog_title": "Change account tier",
"account_upgrade_dialog_interval_monthly": "Monthly",
"account_upgrade_dialog_interval_yearly": "Annually",
+ "account_upgrade_dialog_interval_yearly_discount_save": "save {{discount}}%",
+ "account_upgrade_dialog_interval_yearly_discount_save_up_to": "save up to {{discount}}%",
"account_upgrade_dialog_cancel_warning": "This will cancel your subscription, and downgrade your account on {{date}}. On that date, topic reservations as well as messages cached on the server will be deleted.",
"account_upgrade_dialog_proration_info": "Proration: When upgrading between paid plans, the price difference will be charged immediately. When downgrading to a lower tier, the balance will be used to pay for future billing periods.",
"account_upgrade_dialog_reservations_warning_one": "The selected tier allows fewer reserved topics than your current tier. Before changing your tier, please delete at least one reservation. You can remove reservations in the Settings.",
diff --git a/web/src/components/UpgradeDialog.js b/web/src/components/UpgradeDialog.js
index 447adab2..a46313ab 100644
--- a/web/src/components/UpgradeDialog.js
+++ b/web/src/components/UpgradeDialog.js
@@ -111,16 +111,21 @@ const UpgradeDialog = (props) => {
}
// Figure out discount
- let discount;
+ let discount = 0, upto = false;
if (newTier?.prices) {
discount = Math.round(((newTier.prices.month*12/newTier.prices.year)-1)*100);
} else {
+ let n = 0;
for (const t of tiers) {
if (t.prices) {
- discount = Math.round(((t.prices.month*12/t.prices.year)-1)*100);
- break;
+ const tierDiscount = Math.round(((t.prices.month*12/t.prices.year)-1)*100);
+ if (tierDiscount > discount) {
+ discount = tierDiscount;
+ n++;
+ }
}
}
+ upto = n > 1;
}
return (
@@ -145,7 +150,15 @@ const UpgradeDialog = (props) => {
onChange={(ev) => setInterval(ev.target.checked ? SubscriptionInterval.YEAR : SubscriptionInterval.MONTH)}
/>
{t("account_upgrade_dialog_interval_yearly")}
- {discount > 0 && }
+ {discount > 0 &&
+
+ }