gib/GibSend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: avoid crash on billing page when payment method missing (#221)

Browse Source
This commit is contained in:
KM Koushik
2025-09-09 21:05:46 +10:00
committed by GitHub
parent 7cf46107e6
commit 3d123dba1f
1 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
apps/web/src/app/(dashboard)/settings/billing/page.tsx
View File

@@ -19,7 +19,7 @@ export default function SettingsPage() {
const { data: subscription } = api.billing.getSubscriptionDetails.useQuery(); const { data: subscription } = api.billing.getSubscriptionDetails.useQuery();
const [isEditingEmail, setIsEditingEmail] = useState(false); const [isEditingEmail, setIsEditingEmail] = useState(false);
const [billingEmail, setBillingEmail] = useState( const [billingEmail, setBillingEmail] = useState(
currentTeam?.billingEmail || "" currentTeam?.billingEmail || "",
); );
const apiUtils = api.useUtils(); const apiUtils = api.useUtils();
@@ -46,7 +46,10 @@ export default function SettingsPage() {
} }
}; };
const paymentMethod = JSON.parse(subscription?.paymentMethod || "{}"); const paymentMethod =
subscription?.paymentMethod && subscription.paymentMethod !== "null"
? JSON.parse(subscription.paymentMethod)
: {};
if (!currentIsAdmin) { if (!currentIsAdmin) {
return null; return null;
@@ -89,14 +92,15 @@ export default function SettingsPage() {
{subscription ? ( {subscription ? (
<div className="mt-2"> <div className="mt-2">
<div className="text-lg font-mono uppercase flex items-center gap-2"> <div className="text-lg font-mono uppercase flex items-center gap-2">
{subscription.paymentMethod ? ( {subscription.paymentMethod &&
subscription.paymentMethod !== "null" ? (
<> <>
<span>💳</span> <span>💳</span>
<span className="capitalize"> <span className="capitalize">
{paymentMethod.card?.brand || ""} ••••{" "} {paymentMethod?.card?.brand || ""} ••••{" "}
{paymentMethod.card?.last4 || ""} {paymentMethod?.card?.last4 || ""}
</span> </span>
{paymentMethod.card && ( {paymentMethod?.card && (
<span className="text-sm text-muted-foreground lowercase"> <span className="text-sm text-muted-foreground lowercase">
(Expires: {paymentMethod.card.exp_month}/ (Expires: {paymentMethod.card.exp_month}/
{paymentMethod.card.exp_year}) {paymentMethod.card.exp_year})
@@ -112,7 +116,7 @@ export default function SettingsPage() {
{subscription.currentPeriodEnd {subscription.currentPeriodEnd
? format( ? format(
new Date(subscription.currentPeriodEnd), new Date(subscription.currentPeriodEnd),
"MMM dd, yyyy" "MMM dd, yyyy",
) )
: "N/A"} : "N/A"}
</div> </div>