Billing rework

src/components/onboarding/wizard.tsx

@@ -16,7 +16,26 @@ import {
 
 type Step = "welcome" | "configure" | "billing" | "confirm";
 
-const STEPS: Step[] = ["welcome", "configure", "billing", "confirm"];
+// The step list. Composed once and used to compute "next/prev" arrows
+// and progress indicator. Bug 35: the billing step is conditional —
+// orgs that already have billing on file (subsequent tenants, or
+// pre-filled via /settings/billing) skip it. The wizard's submit
+// payload omits billingAddress in that case; the API picks up the
+// existing org_billing row server-side.
+function makeSteps(opts: {
+  hasOrgBilling: boolean;
+  isEditing: boolean;
+}): Step[] {
+  const base: Step[] = ["welcome", "configure", "billing", "confirm"];
+  // Edit mode currently still shows the billing step because we want
+  // the customer to be able to fix billing on a still-pending request
+  // BEFORE it reaches admin. Once approved, edits go through
+  // /settings/billing instead. Same step set for editing as new for now.
+  if (opts.hasOrgBilling && !opts.isEditing) {
+    return base.filter((s) => s !== "billing");
+  }
+  return base;
+}
 
 // Inline fallbacks — only used if the API call to /api/workspace-defaults fails
 const FALLBACK_SOUL = `# AI Assistant
@@ -64,6 +83,18 @@ interface WizardProps {
    */
   userName?: string;
   userEmail?: string;
+  /**
+   * Bug 35: when true, the wizard skips the billing step. The org
+   * already has billing on file (captured during a previous tenant's
+   * onboarding, or set directly via /settings/billing), and we don't
+   * re-prompt for it. The submit payload omits billingAddress in that
+   * case; the API picks up the existing record server-side.
+   *
+   * In edit mode this is ignored — the wizard re-renders the step
+   * with the request's original billingAddress so the customer can
+   * fix it before admin approves.
+   */
+  hasOrgBilling?: boolean;
   /**
    * Bug 6: when present, the wizard renders in "edit" mode — fields
    * are pre-populated from the request, the SOUL.md auto-fetch is
@@ -90,6 +121,7 @@ interface WizardProps {
       city?: string;
       postalCode?: string;
       country?: string;
+      vatNumber?: string;
     };
     billingNotes: string;
   };
@@ -100,6 +132,7 @@ export function OnboardingWizard({
   orgName,
   userName,
   userEmail,
+  hasOrgBilling,
   editingRequest,
   onComplete,
 }: WizardProps) {
@@ -122,6 +155,13 @@ export function OnboardingWizard({
     isPersonal,
   });
   const isEditing = Boolean(editingRequest);
+  // STEPS is recomputed from props so toggling hasOrgBilling at the
+  // server level (e.g. between renders if the customer just saved
+  // billing on /settings/billing in another tab) flows through. Cheap.
+  const STEPS = makeSteps({
+    hasOrgBilling: Boolean(hasOrgBilling),
+    isEditing,
+  });
 
   // Edit mode jumps straight to the configure step — the welcome step
   // is a first-time onboarding affordance and only adds friction when
@@ -148,6 +188,7 @@ export function OnboardingWizard({
           city: editingRequest.billingAddress.city ?? "",
           postalCode: editingRequest.billingAddress.postalCode ?? "",
           country: editingRequest.billingAddress.country ?? "CH",
+          vatNumber: editingRequest.billingAddress.vatNumber ?? "",
         },
         billingNotes: editingRequest.billingNotes,
       };
@@ -167,6 +208,7 @@ export function OnboardingWizard({
         city: "",
         postalCode: "",
         country: "CH",
+        vatNumber: "",
       },
       billingNotes: "",
     };
@@ -372,11 +414,25 @@ export function OnboardingWizard({
         : "/api/onboarding";
       const method = editingRequest ? "PATCH" : "POST";
 
+      // Bug 35: when the org already has billing on file, the wizard
+      // skipped the billing step and `config.billingAddress` is the
+      // empty default. Strip it from the payload so the API picks up
+      // the existing org_billing record server-side rather than
+      // validating the empty form against billingStepSchema (which
+      // would reject for a company org).
+      const submitConfig = hasOrgBilling
+        ? (() => {
+            const { billingAddress: _bill, billingNotes: _notes, ...rest } =
+              config;
+            return rest;
+          })()
+        : config;
+
       const res = await fetch(url, {
         method,
         headers: { "Content-Type": "application/json" },
         body: JSON.stringify({
-          ...config,
+          ...submitConfig,
           packageSecrets:
             Object.keys(secretsPayload).length > 0
               ? secretsPayload
@@ -906,6 +962,39 @@ export function OnboardingWizard({
               </select>
             </FieldWithError>
 
+            {/* Bug 35: VAT identifier. Required for company customers
+                (B2B). Hidden entirely for personal customers (B2C —
+                private individuals don't have a VAT number); the API
+                enforces the same rule. Editable later via
+                /settings/billing for company customers if their VAT
+                id changes. */}
+            {!isPersonal && (
+              <FieldWithError error={errors["billingAddress.vatNumber"]}>
+                <label className="block text-xs font-semibold uppercase tracking-wider text-text-muted mb-1.5">
+                  {t("billingVatNumber")} <RequiredMark />
+                </label>
+                <input
+                  type="text"
+                  value={config.billingAddress.vatNumber ?? ""}
+                  onChange={(e) => {
+                    clearError("billingAddress.vatNumber");
+                    setConfig((prev) => ({
+                      ...prev,
+                      billingAddress: {
+                        ...prev.billingAddress,
+                        vatNumber: e.target.value,
+                      },
+                    }));
+                  }}
+                  placeholder="CHE-123.456.789 MWST"
+                  className={inputClass(errors["billingAddress.vatNumber"])}
+                />
+                <p className="text-xs text-text-muted mt-1">
+                  {t("billingVatHelp")}
+                </p>
+              </FieldWithError>
+            )}
+
             <div>
               <label className="block text-xs font-semibold uppercase tracking-wider text-text-muted mb-1.5">
                 {t("billingNotes")}