fix: stripe portal dead-end with callback return flow

Co-authored-by: userAdityaa <aditya.chaudhary1558@gmail.com>
Co-committed-by: userAdityaa <aditya.chaudhary1558@gmail.com>

backend/src/api.rs

@@ -3,7 +3,7 @@ use std::sync::Arc;
 use anyhow::{Result, anyhow};
 use axum::{
     Json, Router,
-    extract::{Path, State},
+    extract::{Path, Query as QueryParams, State},
     http::{HeaderMap, StatusCode},
     response::{IntoResponse, Response},
     routing::{get, post},
@@ -1101,10 +1101,16 @@ async fn get_invoice_bolt11(
     }
 }
 
+#[derive(serde::Deserialize)]
+struct StripeSessionParams {
+    return_url: Option<String>,
+}
+
 async fn create_stripe_session(
     State(state): State<AppState>,
     headers: HeaderMap,
     Path(pubkey): Path<String>,
+    QueryParams(params): QueryParams<StripeSessionParams>,
 ) -> std::result::Result<Response, ApiError> {
     let auth = state.api.extract_auth_pubkey(&headers)?;
     state.api.require_admin_or_tenant(&auth, &pubkey)?;
@@ -1113,7 +1119,7 @@ async fn create_stripe_session(
     match state
         .api
         .billing
-        .stripe_create_portal_session(&tenant.stripe_customer_id)
+        .stripe_create_portal_session(&tenant.stripe_customer_id, params.return_url.as_deref())
         .await
     {
         Ok(url) => Ok(ok(StatusCode::OK, serde_json::json!({ "url": url }))),

backend/src/billing.rs

@@ -151,7 +151,11 @@ impl Billing {
             return Ok(());
         }
 
-        tracing::info!(source, relay_count = relays.len(), "reconciling relay billing state");
+        tracing::info!(
+            source,
+            relay_count = relays.len(),
+            "reconciling relay billing state"
+        );
 
         for relay in relays {
             if let Err(error) = self.sync_relay_subscription_for_relay(&relay).await {
@@ -961,12 +965,20 @@ impl Billing {
         Ok(())
     }
 
-    pub async fn stripe_create_portal_session(&self, customer_id: &str) -> Result<String> {
+    pub async fn stripe_create_portal_session(
+        &self,
+        customer_id: &str,
+        return_url: Option<&str>,
+    ) -> Result<String> {
+        let mut params = vec![("customer", customer_id.to_string())];
+        if let Some(url) = return_url {
+            params.push(("return_url", url.to_string()));
+        }
         let resp = self
             .http
             .post(format!("{STRIPE_API}/billing_portal/sessions"))
             .bearer_auth(&self.stripe_secret_key)
-            .form(&[("customer", customer_id)])
+            .form(&params)
             .send()
             .await?;
 
@@ -998,8 +1010,7 @@ impl Billing {
         customer_id: &str,
         price_id: &str,
     ) -> Result<(String, String)> {
-        let idempotency_key =
+        let idempotency_key = self.idempotency_key(&["create_subscription", customer_id, price_id]);
-            self.idempotency_key(&["create_subscription", customer_id, price_id]);
         let resp = self
             .http
             .post(format!("{STRIPE_API}/subscriptions"))
@@ -1726,5 +1737,4 @@ mod tests {
         assert_eq!(billing.stripe_secret_key, "sk_test_dummy");
         assert_eq!(billing.stripe_webhook_secret, "whsec_test_dummy");
     }
-
 }

frontend/src/components/PaymentSetup.tsx

@@ -40,7 +40,7 @@ export default function PaymentSetup(props: PaymentSetupProps) {
     setRedirecting(true)
     setError("")
     try {
-      const { url } = await createPortalSession(account()!.pubkey)
+      const { url } = await createPortalSession(account()!.pubkey, window.location.href)
       window.location.href = url
     } catch (e) {
       setError(e instanceof Error ? e.message : "Failed to open billing portal")

frontend/src/lib/api.ts

@@ -253,8 +253,9 @@ export function reactivateRelay(id: string) {
   return callApi<undefined, void>("POST", `/relays/${id}/reactivate`)
 }
 
-export function createPortalSession(pubkey: string) {
+export function createPortalSession(pubkey: string, returnUrl?: string) {
-  return callApi<undefined, { url: string }>("GET", `/tenants/${pubkey}/stripe/session`)
+  const query = returnUrl ? `?return_url=${encodeURIComponent(returnUrl)}` : ""
+  return callApi<undefined, { url: string }>("GET", `/tenants/${pubkey}/stripe/session${query}`)
 }
 
 export function getInvoiceBolt11(invoiceId: string) {

frontend/src/lib/useRelayToggles.ts

@@ -1,5 +1,5 @@
 import { createSignal } from "solid-js"
-import { updateRelayById, deactivateRelayById, reactivateRelayById, getLatestOpenInvoice, type Relay } from "@/lib/hooks"
+import { updateRelayById, deactivateRelayById, reactivateRelayById, getLatestOpenInvoice, tenantNeedsPaymentSetup, type Relay } from "@/lib/hooks"
 import { setToastMessage } from "@/components/Toast"
 import type { Invoice, PlanId } from "@/lib/api"
 
@@ -31,6 +31,7 @@ export default function useRelayToggles(
 ) {
   const [busy, setBusy] = createSignal(false)
   const [pendingInvoice, setPendingInvoice] = createSignal<Invoice | undefined>()
+  const [pendingPaymentSetup, setPendingPaymentSetup] = createSignal(false)
 
   async function updateRelay(next: Relay, previous: Relay) {
     mutate(next)
@@ -101,8 +102,12 @@ export default function useRelayToggles(
     }
 
     if (plan !== "free") {
-      const invoice = await getLatestOpenInvoice()
+      const needsSetup = await tenantNeedsPaymentSetup()
-      if (invoice) setPendingInvoice(invoice)
+      if (needsSetup) {
+        const invoice = await getLatestOpenInvoice()
+        if (invoice) setPendingInvoice(invoice)
+        setPendingPaymentSetup(true)
+      }
     }
   }
 
@@ -116,5 +121,5 @@ export default function useRelayToggles(
     onToggleLivekitSupport: () => toggle("livekit_enabled", relay()?.plan !== "free"),
   }
 
-  return { busy, handleDeactivate, handleReactivate, handleUpdatePlan, pendingInvoice, clearPendingInvoice: () => setPendingInvoice(undefined), toggles }
+  return { busy, handleDeactivate, handleReactivate, handleUpdatePlan, pendingInvoice, clearPendingInvoice: () => setPendingInvoice(undefined), pendingPaymentSetup, clearPendingPaymentSetup: () => setPendingPaymentSetup(false), toggles }
 }

frontend/src/pages/Account.tsx

@@ -49,7 +49,7 @@ export default function Account() {
   async function openPortal() {
     setPortalLoading(true)
     try {
-      const { url } = await createPortalSession(account()!.pubkey)
+      const { url } = await createPortalSession(account()!.pubkey, window.location.href)
       window.location.href = url
     } catch (e) {
       setError(e instanceof Error ? e.message : "Failed to open billing portal")

frontend/src/pages/relays/RelayDetail.tsx

@@ -1,5 +1,5 @@
 import { useParams } from "@solidjs/router"
-import { createMemo, createResource, createSignal, Show } from "solid-js"
+import { createEffect, createMemo, createResource, createSignal, Show } from "solid-js"
 import BackLink from "@/components/BackLink"
 import PageContainer from "@/components/PageContainer"
 import PaymentDialog from "@/components/PaymentDialog"
@@ -28,13 +28,20 @@ export default function RelayDetail() {
   })
   const loading = useMinLoading(() => relay.loading && !relay())
   const [activity] = useRelayActivity(relayId)
-  const { busy, handleDeactivate, handleReactivate, handleUpdatePlan, pendingInvoice, clearPendingInvoice, toggles } = useRelayToggles(relayId, relay, { refetch, mutate })
+  const { busy, handleDeactivate, handleReactivate, handleUpdatePlan, pendingInvoice, clearPendingInvoice, pendingPaymentSetup, clearPendingPaymentSetup, toggles } = useRelayToggles(relayId, relay, { refetch, mutate })
 
   const [tenant, { refetch: refetchTenant }] = useTenant()
   const [paymentSetupOpen, setPaymentSetupOpen] = createSignal(false)
   const [invoiceDialogOpen, setInvoiceDialogOpen] = createSignal(false)
   const [paymentBannerDismissed, setPaymentBannerDismissed] = createSignal(false)
 
+  createEffect(() => {
+    if (pendingPaymentSetup() && !pendingInvoice()) {
+      setPaymentSetupOpen(true)
+      clearPendingPaymentSetup()
+    }
+  })
+
   const isPaidRelay = createMemo(() => {
     const r = relay()
     if (!r) return false

frontend/src/pages/relays/RelayNew.tsx

@@ -3,13 +3,15 @@ import { useNavigate } from "@solidjs/router"
 import BackLink from "@/components/BackLink"
 import PageContainer from "@/components/PageContainer"
 import PaymentDialog from "@/components/PaymentDialog"
+import PaymentSetup from "@/components/PaymentSetup"
 import RelayForm, { type RelayFormValues } from "@/components/RelayForm"
-import { createRelayForActiveTenant, getLatestOpenInvoice } from "@/lib/hooks"
+import { createRelayForActiveTenant, getLatestOpenInvoice, tenantNeedsPaymentSetup } from "@/lib/hooks"
 import type { Invoice } from "@/lib/api"
 
 export default function RelayNew() {
   const navigate = useNavigate()
   const [pendingInvoice, setPendingInvoice] = createSignal<Invoice | undefined>()
+  const [paymentSetupOpen, setPaymentSetupOpen] = createSignal(false)
   let createdRelayId = ""
 
   async function handleSubmit(values: RelayFormValues) {
@@ -17,9 +19,14 @@ export default function RelayNew() {
     createdRelayId = relay.id
 
     if (values.plan !== "free") {
-      const invoice = await getLatestOpenInvoice()
+      const needsSetup = await tenantNeedsPaymentSetup()
-      if (invoice) {
+      if (needsSetup) {
-        setPendingInvoice(invoice)
+        const invoice = await getLatestOpenInvoice()
+        if (invoice) {
+          setPendingInvoice(invoice)
+          return
+        }
+        setPaymentSetupOpen(true)
         return
       }
     }
@@ -27,8 +34,13 @@ export default function RelayNew() {
     navigate(`/relays/${relay.id}`)
   }
 
-  function handleDialogClose() {
+  function handleInvoiceClose() {
     setPendingInvoice(undefined)
+    setPaymentSetupOpen(true)
+  }
+
+  function handleSetupClose() {
+    setPaymentSetupOpen(false)
     navigate(`/relays/${createdRelayId}`)
   }
 
@@ -47,10 +59,14 @@ export default function RelayNew() {
           <PaymentDialog
             invoice={inv()}
             open={true}
-            onClose={handleDialogClose}
+            onClose={handleInvoiceClose}
           />
         )}
       </Show>
+      <PaymentSetup
+        open={paymentSetupOpen()}
+        onClose={handleSetupClose}
+      />
     </PageContainer>
   )
 }