wip: zen

Author: fwang

packages/console/app/src/routes/black/index.tsx

@@ -1,16 +1,21 @@
-import { A, useSearchParams } from "@solidjs/router"
+import { A, createAsync, query, useSearchParams } from "@solidjs/router"
 import { Title } from "@solidjs/meta"
 import { createMemo, createSignal, For, Match, onMount, Show, Switch } from "solid-js"
 import { PlanIcon, plans } from "./common"
 import { useI18n } from "~/context/i18n"
 import { useLanguage } from "~/context/language"
+import { Resource } from "@opencode-ai/console-resource"
 
-const paused = true
+const getPaused = query(async () => {
+  "use server"
+  return Resource.App.stage === "production"
+}, "black.paused")
 
 export default function Black() {
   const [params] = useSearchParams()
   const i18n = useI18n()
   const language = useLanguage()
+  const paused = createAsync(() => getPaused())
   const [selected, setSelected] = createSignal<string | null>((params.plan as string) || null)
   const [mounted, setMounted] = createSignal(false)
   const selectedPlan = createMemo(() => plans.find((p) => p.id === selected()))
@@ -44,7 +49,7 @@ export default function Black() {
     <>
       <Title>{i18n.t("black.title")}</Title>
       <section data-slot="cta">
-        <Show when={!paused} fallback={<p data-slot="paused">{i18n.t("black.paused")}</p>}>
+        <Show when={!paused()} fallback={<p data-slot="paused">{i18n.t("black.paused")}</p>}>
           <Switch>
             <Match when={!selected()}>
               <div data-slot="pricing">
@@ -108,7 +113,7 @@ export default function Black() {
             </Match>
           </Switch>
         </Show>
-        <Show when={!paused}>
+        <Show when={!paused()}>
           <p data-slot="fine-print" style={{ "view-transition-name": "fine-print" }}>
             {i18n.t("black.finePrint.beforeTerms")} ·{" "}
             <A href={language.route("/legal/terms-of-service")}>{i18n.t("black.finePrint.terms")}</A>

…p/src/routes/black/_subscribe/[plan].tsx …pp/src/routes/black/subscribe/[plan].tsxpackages/console/app/src/routes/black/_subscribe/[plan].tsx renamed to packages/console/app/src/routes/black/subscribe/[plan].tsx packages/console/app/src/routes/black/_subscribe/[plan].tsx renamed to packages/console/app/src/routes/black/subscribe/[plan].tsx

@@ -17,6 +17,12 @@ import { Billing } from "@opencode-ai/console-core/billing.js"
 import { useI18n } from "~/context/i18n"
 import { useLanguage } from "~/context/language"
 import { formError } from "~/lib/form-error"
+import { Resource } from "@opencode-ai/console-resource"
+
+const getEnabled = query(async () => {
+  "use server"
+  return Resource.App.stage !== "production"
+}, "black.subscribe.enabled")
 
 const plansMap = Object.fromEntries(plans.map((p) => [p.id, p])) as Record<PlanID, (typeof plans)[number]>
 const stripePromise = loadStripe(import.meta.env.VITE_STRIPE_PUBLISHABLE_KEY!)
@@ -269,6 +275,7 @@ export default function BlackSubscribe() {
   const params = useParams()
   const i18n = useI18n()
   const language = useLanguage()
+  const enabled = createAsync(() => getEnabled())
   const planData = plansMap[(params.plan as PlanID) ?? "20"] ?? plansMap["20"]
   const plan = planData.id
 
@@ -359,7 +366,7 @@ export default function BlackSubscribe() {
   }
 
   return (
-    <>
+    <Show when={enabled()}>
       <Title>{i18n.t("black.subscribe.title")}</Title>
       <section data-slot="subscribe-form">
         <div data-slot="form-card">
@@ -472,6 +479,6 @@ export default function BlackSubscribe() {
           <A href={language.route("/legal/terms-of-service")}>{i18n.t("black.finePrint.terms")}</A>
         </p>
       </section>
-    </>
+    </Show>
   )
 }