@lukoweb/apitogo-plugin-dev-portal-billing 0.2.35 → 0.2.37

package/dist/{CheckoutPage-CW_EBGog.mjs → CheckoutPage-DiYurW2O.mjs}

@@ -1,6 +1,6 @@
 import { o as PRICING_PATH, t as ACCOUNT_PLANS_PATH } from "./paths-ujy9wjVK.mjs";
 import { n as useDevPortalPreviewMode, r as useIsDemoSession, t as useDevPortalApiBaseUrl } from "./useDevPortalApiBaseUrl-CgygF2z5.mjs";
-import { t as FREE_CHECKOUT_MARKER } from "./billing-state-pnT0H1Lm.mjs";
+import { t as FREE_CHECKOUT_MARKER } from "./billing-state-CIZ0pR37.mjs";
 import { ShieldIcon } from "@lukoweb/apitogo/icons";
 import { Link, useNavigate, useSearchParams } from "@lukoweb/apitogo/router";
 import { useEffect } from "react";

package/dist/ChoosePlanNotice-DITJNrh1.mjs

@@ -0,0 +1,34 @@
+import { t as ACCOUNT_PLANS_PATH } from "./paths-ujy9wjVK.mjs";
+import { Link } from "@lukoweb/apitogo/router";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "@lukoweb/apitogo/ui/Button.js";
+
+//#region src/components/ChoosePlanNotice.tsx
+/** What a signed-in visitor without a plan reads, and the one thing to do next. Names no plan: a portal can sell only paid ones. */
+const CHOOSE_PLAN_TITLE = "Choose a plan to get started";
+const CHOOSE_PLAN_BODY = "An API key belongs to a plan. Choose a plan first, then come back here to create your key and call the API.";
+const ChoosePlanNotice = ({ className = "rounded-xl border border-dashed p-8 text-center", body = CHOOSE_PLAN_BODY }) => /* @__PURE__ */ jsxs("div", {
+	className,
+	"data-testid": "choose-plan-notice",
+	children: [
+		/* @__PURE__ */ jsx("h2", {
+			className: "text-lg font-semibold",
+			children: CHOOSE_PLAN_TITLE
+		}),
+		/* @__PURE__ */ jsx("p", {
+			className: "mt-2 text-muted-foreground",
+			children: body
+		}),
+		/* @__PURE__ */ jsx(Button, {
+			className: "mt-4",
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Link, {
+				to: ACCOUNT_PLANS_PATH,
+				children: "Choose a plan"
+			})
+		})
+	]
+});
+
+//#endregion
+export { ChoosePlanNotice as t };

package/dist/{CredentialsPage-CtIEboEy.mjs → CredentialsPage-Ir8Gf62T.mjs}

@@ -3,6 +3,7 @@ import { n as useDevPortalPreviewMode, r as useIsDemoSession, t as useDevPortalA
 import { n as useDevPortalBillingConfig } from "./DevPortalBillingContext-CR83s4LO.mjs";
 import { n as createDemoCredentials } from "./demo-session-Cez740bi.mjs";
 import { r as useApiKeys, t as ApiKeysPanel } from "./ApiKeysPanel-DrArkHXf.mjs";
+import { t as ChoosePlanNotice } from "./ChoosePlanNotice-DITJNrh1.mjs";
 import { Head } from "@lukoweb/apitogo/components";
 import { KeyRoundIcon } from "@lukoweb/apitogo/icons";
 import { Link as Link$1 } from "@lukoweb/apitogo/router";
@@ -110,11 +111,11 @@ const CredentialsPage = () => {
 				className: "text-muted-foreground",
 				children: "Loading credentials…"
 			}) : null,
-			!isPreview && !isDemoSession && auth.isAuthenticated && (error || keysError) ? /* @__PURE__ */ jsxs("div", {
+			!isPreview && !isDemoSession && auth.isAuthenticated && (error || keysError) ? error instanceof Error && error.message === "NO_ENTITLEMENT" || keysError instanceof Error && keysError.message === "NO_ENTITLEMENT" ? /* @__PURE__ */ jsx(ChoosePlanNotice, {}) : /* @__PURE__ */ jsxs("div", {
 				className: "rounded-xl border border-dashed p-8 text-center",
 				children: [/* @__PURE__ */ jsx("p", {
 					className: "text-muted-foreground",
-					children: error instanceof Error && error.message === "NO_ENTITLEMENT" || keysError instanceof Error && keysError.message === "NO_ENTITLEMENT" ? "No active subscription found. Choose a plan to get your API key." : "Unable to load API credentials. Try again in a moment."
+					children: "Unable to load API credentials. Try again in a moment."
 				}), /* @__PURE__ */ jsx(Button$1, {
 					className: "mt-4",
 					asChild: true,
@@ -126,20 +127,7 @@ const CredentialsPage = () => {
 			}) : null,
 			(isDemoSession || !isPreview) && auth.isAuthenticated && !error && !keysError && !isLoading && !keysLoading ? /* @__PURE__ */ jsxs("div", {
 				className: "space-y-6",
-				children: [plans.length === 0 ? /* @__PURE__ */ jsxs("div", {
-					className: "rounded-xl border border-dashed p-8 text-center",
-					children: [/* @__PURE__ */ jsx("p", {
-						className: "text-muted-foreground",
-						children: "Choose a plan to get your first API key."
-					}), /* @__PURE__ */ jsx(Button$1, {
-						className: "mt-4",
-						asChild: true,
-						children: /* @__PURE__ */ jsx(Link$1, {
-							to: ACCOUNT_PLANS_PATH,
-							children: "View plans"
-						})
-					})]
-				}) : plans.map((plan) => /* @__PURE__ */ jsx(ApiKeysPanel, {
+				children: [plans.length === 0 ? /* @__PURE__ */ jsx(ChoosePlanNotice, {}) : plans.map((plan) => /* @__PURE__ */ jsx(ApiKeysPanel, {
 					plan,
 					header,
 					readOnly: isDemoSession

package/dist/{PricingPage-MTslSnCh.mjs → PricingPage-DodoDd3h.mjs}

@@ -3,7 +3,7 @@ import { t as PricingCard } from "./PricingCard-Wra2FUX9.mjs";
 import { n as useDevPortalBillingConfig } from "./DevPortalBillingContext-CR83s4LO.mjs";
 import { t as usePlans } from "./usePlans-DUex2tzT.mjs";
 import { t as isPreviewPricingEnabled } from "./pricing-config-CfhRX9tk.mjs";
-import { i as isPricingLoading, n as buildCompareRows } from "./billing-state-pnT0H1Lm.mjs";
+import { a as isPricingLoading, n as buildCompareRows } from "./billing-state-CIZ0pR37.mjs";
 import { Head, Heading } from "@lukoweb/apitogo/components";
 import { Navigate } from "@lukoweb/apitogo/router";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";

package/dist/{SubscriptionsPage-9lXnVks7.mjs → SubscriptionsPage-CDmzL6QX.mjs}

@@ -1,10 +1,11 @@
 import { i as CREDENTIALS_PATH, t as ACCOUNT_PLANS_PATH } from "./paths-ujy9wjVK.mjs";
 import { c as isActiveSubscription, i as formatBillingPeriod, m as parseMonthlyQuotaCalls, o as formatPlanPrice, t as useDevPortalApiBaseUrl } from "./useDevPortalApiBaseUrl-CgygF2z5.mjs";
-import "./DevPortalBillingContext-CR83s4LO.mjs";
+import { n as useDevPortalBillingConfig } from "./DevPortalBillingContext-CR83s4LO.mjs";
 import { t as useMySubscriptions } from "./useMySubscriptions-CLh3eFY4.mjs";
 import { t as usePlans } from "./usePlans-DUex2tzT.mjs";
 import { t as useUsage } from "./useUsage-Cx2GB3wg.mjs";
-import { r as checkoutConfirmingText } from "./billing-state-pnT0H1Lm.mjs";
+import { i as hasPaymentProvider, r as checkoutConfirmingText } from "./billing-state-CIZ0pR37.mjs";
+import { t as ChoosePlanNotice } from "./ChoosePlanNotice-DITJNrh1.mjs";
 import { Head, Spinner } from "@lukoweb/apitogo/components";
 import { Link as Link$1, useSearchParams } from "@lukoweb/apitogo/router";
 import { useEffect } from "react";
@@ -37,6 +38,7 @@ function useBillingPortal() {
 //#endregion
 //#region src/pages/SubscriptionsPage.tsx
 const SubscriptionsPage = () => {
+	const { billing } = useDevPortalBillingConfig();
 	const auth = useAuth();
 	const [searchParams] = useSearchParams();
 	const checkoutSuccess = searchParams.get("checkout") === "success";
@@ -144,19 +146,9 @@ const SubscriptionsPage = () => {
 					}) : null
 				]
 			}) : null,
-			!isLoading && subscriptions.length === 0 ? /* @__PURE__ */ jsxs("div", {
+			!isLoading && subscriptions.length === 0 ? /* @__PURE__ */ jsx(ChoosePlanNotice, {
 				className: "mb-8 rounded-xl border border-dashed p-8 text-center",
-				children: [/* @__PURE__ */ jsx("p", {
-					className: "text-muted-foreground",
-					children: "You do not have an active subscription yet."
-				}), /* @__PURE__ */ jsx(Button$1, {
-					className: "mt-4",
-					asChild: true,
-					children: /* @__PURE__ */ jsx(Link$1, {
-						to: ACCOUNT_PLANS_PATH,
-						children: "View plans"
-					})
-				})]
+				body: "You do not have a plan yet. Choose one to start using the API; your billing details appear here afterwards."
 			}) : null,
 			!isLoading && subscriptions.length > 1 ? /* @__PURE__ */ jsx("div", {
 				className: "mb-8 space-y-4",
@@ -196,7 +188,7 @@ const SubscriptionsPage = () => {
 							children: "Change plan"
 						})
 					}),
-					auth.isAuthenticated ? /* @__PURE__ */ jsx(Button$1, {
+					auth.isAuthenticated && hasPaymentProvider(billing) ? /* @__PURE__ */ jsx(Button$1, {
 						variant: "default",
 						disabled: billingPortal.isPending,
 						onClick: () => {

package/dist/{billing-state-pnT0H1Lm.mjs → billing-state-CIZ0pR37.mjs}

@@ -8,6 +8,13 @@ function isPricingLoading(state) {
 	return state.authPending && !state.hasPlans && !state.plansFailed;
 }
 /**
+* Whether the project takes payments. A project whose plans service has billing `none` has no payment provider, so
+* the billing page must not offer "Manage payment & invoices". An unknown provider counts as having one.
+*/
+function hasPaymentProvider(billing) {
+	return billing !== "none";
+}
+/**
 * The line shown on the billing page while the subscription is being confirmed after checkout. A free plan has no
 * payment, so it must not claim one; the paid return from the payment provider carries no marker and says so.
 */
@@ -34,4 +41,4 @@ function buildCompareRows(input) {
 }
 
 //#endregion
-export { isPricingLoading as i, buildCompareRows as n, checkoutConfirmingText as r, FREE_CHECKOUT_MARKER as t };
+export { isPricingLoading as a, hasPaymentProvider as i, buildCompareRows as n, checkoutConfirmingText as r, FREE_CHECKOUT_MARKER as t };

package/dist/index.d.mts

@@ -41,7 +41,8 @@ type DevPortalBillingConfig = {
     subtitle?: string;
     compareRows?: DevPortalPricingCompareRow[];
     faqs?: DevPortalPricingFaq[];
-  }; /** Address of the plans backend; the portal's generated wrapper passes it. The plans request starts from it early. */
+  }; /** Billing provider of the plans service (`none`, `stripe`, ...). `none`: no payment is offered, so no payment page. */
+  billing?: string; /** Address of the plans backend; the portal's generated wrapper passes it. The plans request starts from it early. */
   apiBaseUrl?: string; /** Live gateway URL (publish bake or explicit plugin option). */
   gatewayBaseUrl?: string | null; /** Local preview plan catalog (from `apitogo.config.json` `plans`). */
   previewPlans?: Array<{

package/dist/index.mjs

@@ -327,15 +327,49 @@ function buildDevPortalHeaderNavigation({ navigation, pricingEnabled, authNavEna
 	return items;
 }
 
+//#endregion
+//#region src/utils/signed-in-identity.ts
+const SIGNED_IN_IDENTITY_ID = "signed-in-user";
+/**
+* The API reference's "Try it" identity for the signed-in visitor: the request carries the visitor's own token as
+* `Authorization: Bearer`, so an API behind the gateway's token check can be tried from the docs. The token comes from
+* the plans backend (`/api/v1/credentials`, answered from the session cookie) and is asked for when the identity list
+* is built. A visitor who is signed out or has no subscription gets no identity, and the playground offers none.
+*/
+async function getSignedInIdentities(apiBaseUrl, fetchImpl = fetch) {
+	if (!apiBaseUrl) return [];
+	try {
+		const response = await fetchImpl(`${apiBaseUrl}/api/v1/credentials`, {
+			method: "GET",
+			headers: { Accept: "application/json" },
+			credentials: "include"
+		});
+		if (!response.ok) return [];
+		const credentials = await response.json();
+		const token = credentials.accessToken ?? credentials.idToken;
+		if (!token) return [];
+		return [{
+			id: SIGNED_IN_IDENTITY_ID,
+			label: "Signed-in user",
+			authorizeRequest: (request) => {
+				request.headers.set("Authorization", `Bearer ${token}`);
+				return request;
+			}
+		}];
+	} catch {
+		return [];
+	}
+}
+
 //#endregion
 //#region src/DevPortalBillingPlugin.tsx
 const AccountPlansPage$1 = lazy(() => import("./AccountPlansPage-CXOfTwlX.mjs").then((n) => n.n));
-const CheckoutPage = lazy(() => import("./CheckoutPage-CW_EBGog.mjs"));
+const CheckoutPage = lazy(() => import("./CheckoutPage-DiYurW2O.mjs"));
 const ContactSalesPage = lazy(() => import("./ContactSalesPage-Vjzm-RxO.mjs"));
-const CredentialsPage = lazy(() => import("./CredentialsPage-CtIEboEy.mjs"));
-const PricingPage = lazy(() => import("./PricingPage-MTslSnCh.mjs"));
-const SubscriptionsPage = lazy(() => import("./SubscriptionsPage-9lXnVks7.mjs"));
-const UsagePage = lazy(() => import("./UsagePage--mg_NzrA.mjs"));
+const CredentialsPage = lazy(() => import("./CredentialsPage-Ir8Gf62T.mjs"));
+const PricingPage = lazy(() => import("./PricingPage-DodoDd3h.mjs"));
+const SubscriptionsPage = lazy(() => import("./SubscriptionsPage-CDmzL6QX.mjs"));
+const UsagePage = lazy(() => import("./UsagePage-C4K_arXh.mjs"));
 function resolvePricingEnabled(config) {
 	if (config.__meta?.pricingEnabled !== void 0) return config.__meta.pricingEnabled;
 	return isPreviewPricingEnabled();
@@ -359,6 +393,7 @@ const devPortalBillingPlugin = createPlugin((options = {}) => {
 				}
 			});
 		},
+		getIdentities: () => getSignedInIdentities(resolveDevPortalApiBaseUrl(options.apiBaseUrl)),
 		getProfileMenuItems: () => [{
 			label: "My Subscriptions",
 			path: SUBSCRIPTIONS_PATH,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lukoweb/apitogo-plugin-dev-portal-billing",
-  "version": "0.2.35",
+  "version": "0.2.37",
   "repository": {
     "type": "git",
     "url": "https://github.com/zuplo/zudoku",
@@ -46,8 +46,8 @@
     "react": "19.2.4",
     "react-dom": "19.2.4",
     "tsdown": "0.20.3",
-    "@lukoweb/apitogo": "0.2.35",
-    "@lukoweb/apitogo-module-user-panel": "0.2.35"
+    "@lukoweb/apitogo": "0.2.37",
+    "@lukoweb/apitogo-module-user-panel": "0.2.37"
   },
   "peerDependencies": {
     "react": ">=19.2.0",