fix: improve plan change UX with card charge confirmation and fix paid-to-free downgrade
This commit is contained in:
@@ -1347,8 +1347,8 @@
|
|||||||
showConfirmModal({
|
showConfirmModal({
|
||||||
title: 'Change Subscription Plan',
|
title: 'Change Subscription Plan',
|
||||||
body: isDowngrade
|
body: isDowngrade
|
||||||
? `You are downgrading from ${currentLabel} to ${planLabel}. Any price difference will be credited to your account and applied to future renewals. Your subscription will continue without interruption.`
|
? `<strong>Your card will be charged for any price difference.</strong><br><br>You are downgrading from ${currentLabel} to ${planLabel}. Any price difference will be credited to your account and applied to future renewals. Your subscription will continue without interruption.`
|
||||||
: `You are upgrading from ${currentLabel} to ${planLabel}. You will be charged the difference for the current billing period. Your subscription will update immediately.`,
|
: `<strong>Your card will be charged for the price difference.</strong><br><br>You are upgrading from ${currentLabel} to ${planLabel}. You will be charged the difference for the current billing period. Your subscription will update immediately.`,
|
||||||
icon: 'info',
|
icon: 'info',
|
||||||
onConfirm: async () => {
|
onConfirm: async () => {
|
||||||
setStatus('Changing subscription plan...');
|
setStatus('Changing subscription plan...');
|
||||||
@@ -1381,7 +1381,7 @@
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Handle paid-to-free downgrade (schedule cancellation at period end)
|
// Handle paid-to-free downgrade (use same cancel endpoint as cancel button)
|
||||||
if (isPaidToFree) {
|
if (isPaidToFree) {
|
||||||
const renewsAt = account?.subscriptionRenewsAt;
|
const renewsAt = account?.subscriptionRenewsAt;
|
||||||
const dateStr = renewsAt ? new Date(renewsAt).toLocaleDateString(undefined, { year: 'numeric', month: 'long', day: 'numeric' }) : 'the end of your billing period';
|
const dateStr = renewsAt ? new Date(renewsAt).toLocaleDateString(undefined, { year: 'numeric', month: 'long', day: 'numeric' }) : 'the end of your billing period';
|
||||||
@@ -1393,19 +1393,13 @@
|
|||||||
onConfirm: async () => {
|
onConfirm: async () => {
|
||||||
setStatus('Scheduling cancellation...');
|
setStatus('Scheduling cancellation...');
|
||||||
try {
|
try {
|
||||||
const resp = await fetch('/api/account', {
|
const resp = await fetch('/api/subscription/cancel', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
'Content-Type': 'application/json',
|
'Content-Type': 'application/json',
|
||||||
'X-CSRF-Token': csrfToken,
|
'X-CSRF-Token': csrfToken,
|
||||||
},
|
},
|
||||||
credentials: 'same-origin',
|
credentials: 'same-origin',
|
||||||
body: JSON.stringify({
|
|
||||||
plan: newPlan,
|
|
||||||
billingCycle: newBillingCycle,
|
|
||||||
currency: newCurrency,
|
|
||||||
billingEmail: newBillingEmail,
|
|
||||||
}),
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const data = await resp.json().catch(() => ({}));
|
const data = await resp.json().catch(() => ({}));
|
||||||
|
|||||||
Reference in New Issue
Block a user