-
+
+
+
+
+
+ {(plan) => (
+
+ )}
+
+
+ Prices shown don't include applicable tax · Terms of Service
+
+
+
+ {(plan) => (
+
+
+
-
- Prices shown don't include applicable tax · Terms of Service
+
+ ${plan().id}{" "}
+ per person billed monthly
+
+ {plan().multiplier}
+
+
+ - Your subscription will not start immediately
+ - You will be added to the waitlist and activated soon
+ - Your card will be only charged when your subscription is activated
+ - Usage limits apply, heavily automated use may reach limits sooner
+ - Subscriptions for individuals, contact Enterprise for teams
+ - Limits may be adjusted and plans may be discontinued in the future
+ - Cancel your subscription at anytime
+
+
+
+
+ Continue
+
+
- )}
-
-
-
-
-
-
+ Prices shown don't include applicable tax · Terms of Service
+
+
+ )}
+
+
+
+
)
}
diff --git a/packages/console/app/src/routes/black/subscribe/[plan].tsx b/packages/console/app/src/routes/black/subscribe/[plan].tsx
new file mode 100644
index 000000000..5e13799dd
--- /dev/null
+++ b/packages/console/app/src/routes/black/subscribe/[plan].tsx
@@ -0,0 +1,450 @@
+import { A, createAsync, query, redirect, useParams } from "@solidjs/router"
+import { Title } from "@solidjs/meta"
+import { createEffect, createSignal, For, Match, Show, Switch } from "solid-js"
+import { type Stripe, type PaymentMethod, loadStripe } from "@stripe/stripe-js"
+import { Elements, PaymentElement, useStripe, useElements, AddressElement } from "solid-stripe"
+import { PlanID, plans } from "../common"
+import { getActor, useAuthSession } from "~/context/auth"
+import { withActor } from "~/context/auth.withActor"
+import { Actor } from "@opencode-ai/console-core/actor.js"
+import { and, Database, eq, isNull } from "@opencode-ai/console-core/drizzle/index.js"
+import { WorkspaceTable } from "@opencode-ai/console-core/schema/workspace.sql.js"
+import { UserTable } from "@opencode-ai/console-core/schema/user.sql.js"
+import { createList } from "solid-list"
+import { Modal } from "~/component/modal"
+import { BillingTable } from "@opencode-ai/console-core/schema/billing.sql.js"
+import { Billing } from "@opencode-ai/console-core/billing.js"
+
+const plansMap = Object.fromEntries(plans.map((p) => [p.id, p])) as Record
+const stripePromise = loadStripe(import.meta.env.VITE_STRIPE_PUBLISHABLE_KEY!)
+
+const getWorkspaces = query(async () => {
+ "use server"
+ const actor = await getActor()
+ if (actor.type === "public") throw redirect("/auth/authorize?continue=/black/subscribe")
+ return withActor(async () => {
+ return Database.use((tx) =>
+ tx
+ .select({
+ id: WorkspaceTable.id,
+ name: WorkspaceTable.name,
+ slug: WorkspaceTable.slug,
+ billing: {
+ customerID: BillingTable.customerID,
+ paymentMethodID: BillingTable.paymentMethodID,
+ paymentMethodType: BillingTable.paymentMethodType,
+ paymentMethodLast4: BillingTable.paymentMethodLast4,
+ subscriptionID: BillingTable.subscriptionID,
+ timeSubscriptionBooked: BillingTable.timeSubscriptionBooked,
+ },
+ })
+ .from(UserTable)
+ .innerJoin(WorkspaceTable, eq(UserTable.workspaceID, WorkspaceTable.id))
+ .innerJoin(BillingTable, eq(WorkspaceTable.id, BillingTable.workspaceID))
+ .where(
+ and(
+ eq(UserTable.accountID, Actor.account()),
+ isNull(WorkspaceTable.timeDeleted),
+ isNull(UserTable.timeDeleted),
+ ),
+ ),
+ )
+ })
+}, "black.subscribe.workspaces")
+
+const createSetupIntent = async (input: { plan: string; workspaceID: string }) => {
+ "use server"
+ const { plan, workspaceID } = input
+
+ if (!plan || !["20", "100", "200"].includes(plan)) return { error: "Invalid plan" }
+ if (!workspaceID) return { error: "Workspace ID is required" }
+
+ return withActor(async () => {
+ const session = await useAuthSession()
+ const account = session.data.account?.[session.data.current ?? ""]
+ const email = account?.email
+
+ const customer = await Database.use((tx) =>
+ tx
+ .select({
+ customerID: BillingTable.customerID,
+ subscriptionID: BillingTable.subscriptionID,
+ })
+ .from(BillingTable)
+ .where(eq(BillingTable.workspaceID, workspaceID))
+ .then((rows) => rows[0]),
+ )
+ if (customer?.subscriptionID) {
+ return { error: "This workspace already has a subscription" }
+ }
+
+ let customerID = customer?.customerID
+ if (!customerID) {
+ const customer = await Billing.stripe().customers.create({
+ email,
+ metadata: {
+ workspaceID,
+ },
+ })
+ customerID = customer.id
+ await Database.use((tx) =>
+ tx
+ .update(BillingTable)
+ .set({
+ customerID,
+ })
+ .where(eq(BillingTable.workspaceID, workspaceID)),
+ )
+ }
+
+ const intent = await Billing.stripe().setupIntents.create({
+ customer: customerID,
+ payment_method_types: ["card"],
+ metadata: {
+ workspaceID,
+ },
+ })
+
+ return { clientSecret: intent.client_secret ?? undefined }
+ }, workspaceID)
+}
+
+const bookSubscription = async (input: {
+ workspaceID: string
+ plan: PlanID
+ paymentMethodID: string
+ paymentMethodType: string
+ paymentMethodLast4?: string
+}) => {
+ "use server"
+ return withActor(
+ () =>
+ Database.use((tx) =>
+ tx
+ .update(BillingTable)
+ .set({
+ paymentMethodID: input.paymentMethodID,
+ paymentMethodType: input.paymentMethodType,
+ paymentMethodLast4: input.paymentMethodLast4,
+ subscriptionPlan: input.plan,
+ timeSubscriptionBooked: new Date(),
+ })
+ .where(eq(BillingTable.workspaceID, input.workspaceID)),
+ ),
+ input.workspaceID,
+ )
+}
+
+interface SuccessData {
+ plan: string
+ paymentMethodType: string
+ paymentMethodLast4?: string
+}
+
+function Failure(props: { message: string }) {
+ return (
+
+
Uh oh! {props.message}
+
+
You're on the OpenCode Black waitlist
+
+
+
- Subscription plan
+ - OpenCode Black {props.plan}
+
+
+
- Amount
+ - ${props.plan} per month
+
+
+
- Payment method
+ -
+ {props.paymentMethodType}}>
+
+ {props.paymentMethodType} - {props.paymentMethodLast4}
+
+
+
+
+
+
- Date joined
+ - {new Date().toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" })}
+
+
+
Your card will be charged when your subscription is activated
+
+
+ {(data) => }
+ {(data) => }
+
+ <>
+
+
Subscribe to OpenCode Black
+
+ ${planData.id} per month
+
+ {planData.multiplier}
+
+
+
Payment method
+
+
+ {selectedWorkspace() ? "Loading payment form..." : "Select a workspace to continue"}
+