From f9ffdbc4c52b4d6e0027eee83209cf2c5794157a Mon Sep 17 00:00:00 2001 From: Baptiste Arnaud Date: Tue, 29 Nov 2022 13:17:46 +0100 Subject: [PATCH] :bug: (billing) Fix currency possible mismatch on sub update --- .../billing/components/ChangePlanForm/ChangePlanForm.tsx | 3 +++ .../billing/components/ChangePlanForm/ProPlanContent.tsx | 5 ++++- .../billing/components/ChangePlanForm/StarterPlanContent.tsx | 5 ++++- .../src/features/billing/hooks/useCurrentSubscriptionInfo.ts | 1 + .../src/features/billing/queries/upgradePlanQuery.tsx | 4 +++- apps/builder/src/pages/api/stripe/subscription.ts | 1 + packages/utils/pricing.ts | 4 ++-- 7 files changed, 18 insertions(+), 5 deletions(-) diff --git a/apps/builder/src/features/billing/components/ChangePlanForm/ChangePlanForm.tsx b/apps/builder/src/features/billing/components/ChangePlanForm/ChangePlanForm.tsx index 69db458bf0..e3ab90abf0 100644 --- a/apps/builder/src/features/billing/components/ChangePlanForm/ChangePlanForm.tsx +++ b/apps/builder/src/features/billing/components/ChangePlanForm/ChangePlanForm.tsx @@ -42,6 +42,7 @@ export const ChangePlanForm = () => { workspaceId: workspace.id, additionalChats: selectedChatsLimitIndex, additionalStorage: selectedStorageLimitIndex, + currency: data?.currency, }) if (typeof response === 'object' && response?.error) { showToast({ description: response.error.message }) @@ -75,6 +76,7 @@ export const ChangePlanForm = () => { onPayClick={(props) => handlePayClick({ ...props, plan: Plan.STARTER }) } + currency={data?.currency} /> { workspace?.plan === Plan.PRO ? data?.additionalStorageIndex : 0 } onPayClick={(props) => handlePayClick({ ...props, plan: Plan.PRO })} + currency={data?.currency} /> diff --git a/apps/builder/src/features/billing/components/ChangePlanForm/ProPlanContent.tsx b/apps/builder/src/features/billing/components/ChangePlanForm/ProPlanContent.tsx index af1cbc92d4..20a1ea92ea 100644 --- a/apps/builder/src/features/billing/components/ChangePlanForm/ProPlanContent.tsx +++ b/apps/builder/src/features/billing/components/ChangePlanForm/ProPlanContent.tsx @@ -32,6 +32,7 @@ import { MoreInfoTooltip } from '@/components/MoreInfoTooltip' type ProPlanContentProps = { initialChatsLimitIndex?: number initialStorageLimitIndex?: number + currency?: 'usd' | 'eur' onPayClick: (props: { selectedChatsLimitIndex: number selectedStorageLimitIndex: number @@ -41,6 +42,7 @@ type ProPlanContentProps = { export const ProPlanContent = ({ initialChatsLimitIndex, initialStorageLimitIndex, + currency, onPayClick, }: ProPlanContentProps) => { const { workspace } = useWorkspace() @@ -153,7 +155,8 @@ export const ProPlanContent = ({ Plan.PRO, selectedChatsLimitIndex ?? 0, selectedStorageLimitIndex ?? 0 - ) ?? NaN + ) ?? NaN, + currency )} / month diff --git a/apps/builder/src/features/billing/components/ChangePlanForm/StarterPlanContent.tsx b/apps/builder/src/features/billing/components/ChangePlanForm/StarterPlanContent.tsx index b08e34a269..e682a0be31 100644 --- a/apps/builder/src/features/billing/components/ChangePlanForm/StarterPlanContent.tsx +++ b/apps/builder/src/features/billing/components/ChangePlanForm/StarterPlanContent.tsx @@ -29,6 +29,7 @@ import { MoreInfoTooltip } from '@/components/MoreInfoTooltip' type StarterPlanContentProps = { initialChatsLimitIndex?: number initialStorageLimitIndex?: number + currency?: 'eur' | 'usd' onPayClick: (props: { selectedChatsLimitIndex: number selectedStorageLimitIndex: number @@ -38,6 +39,7 @@ type StarterPlanContentProps = { export const StarterPlanContent = ({ initialChatsLimitIndex, initialStorageLimitIndex, + currency, onPayClick, }: StarterPlanContentProps) => { const { workspace } = useWorkspace() @@ -126,7 +128,8 @@ export const StarterPlanContent = ({ Plan.STARTER, selectedChatsLimitIndex ?? 0, selectedStorageLimitIndex ?? 0 - ) ?? NaN + ) ?? NaN, + currency )} / month diff --git a/apps/builder/src/features/billing/hooks/useCurrentSubscriptionInfo.ts b/apps/builder/src/features/billing/hooks/useCurrentSubscriptionInfo.ts index 1669771fd3..0d30f8a439 100644 --- a/apps/builder/src/features/billing/hooks/useCurrentSubscriptionInfo.ts +++ b/apps/builder/src/features/billing/hooks/useCurrentSubscriptionInfo.ts @@ -13,6 +13,7 @@ export const useCurrentSubscriptionInfo = ({ { additionalChatsIndex: number additionalStorageIndex: number + currency?: 'eur' | 'usd' }, Error >( diff --git a/apps/builder/src/features/billing/queries/upgradePlanQuery.tsx b/apps/builder/src/features/billing/queries/upgradePlanQuery.tsx index 7cf0fb4c86..8d4058b686 100644 --- a/apps/builder/src/features/billing/queries/upgradePlanQuery.tsx +++ b/apps/builder/src/features/billing/queries/upgradePlanQuery.tsx @@ -15,6 +15,7 @@ type UpgradeProps = { workspaceId: string additionalChats: number additionalStorage: number + currency?: 'eur' | 'usd' } export const upgradePlanQuery = async ({ @@ -31,6 +32,7 @@ const updatePlan = async ({ workspaceId, additionalChats, additionalStorage, + currency, }: Omit): Promise<{ newPlan?: Plan; error?: Error }> => { const { data, error } = await sendRequest<{ message: string }>({ method: 'PUT', @@ -41,7 +43,7 @@ const updatePlan = async ({ stripeId, additionalChats, additionalStorage, - currency: guessIfUserIsEuropean() ? 'eur' : 'usd', + currency: currency ?? (guessIfUserIsEuropean() ? 'eur' : 'usd'), }, }) if (error || !data) return { error } diff --git a/apps/builder/src/pages/api/stripe/subscription.ts b/apps/builder/src/pages/api/stripe/subscription.ts index cd1a70ff73..681c9bcc80 100644 --- a/apps/builder/src/pages/api/stripe/subscription.ts +++ b/apps/builder/src/pages/api/stripe/subscription.ts @@ -63,6 +63,7 @@ const getSubscriptionDetails = (item) => item.price.id === process.env.STRIPE_ADDITIONAL_STORAGE_PRICE_ID )?.quantity ?? 0, + currency: subscriptions.data[0]?.currency, } } diff --git a/packages/utils/pricing.ts b/packages/utils/pricing.ts index b282ce55ff..ee6b7f218d 100644 --- a/packages/utils/pricing.ts +++ b/packages/utils/pricing.ts @@ -176,11 +176,11 @@ export const guessIfUserIsEuropean = () => : europeanUnionExclusiveLanguageCodes.includes(languageCode) }) -export const formatPrice = (price: number) => { +export const formatPrice = (price: number, currency?: 'eur' | 'usd') => { const isEuropean = guessIfUserIsEuropean() const formatter = new Intl.NumberFormat(isEuropean ? 'fr-FR' : 'en-US', { style: 'currency', - currency: isEuropean ? 'EUR' : 'USD', + currency: currency?.toUpperCase() ?? (isEuropean ? 'EUR' : 'USD'), maximumFractionDigits: 0, // (causes 2500.99 to be printed as $2,501) }) return formatter.format(price)