Initial OSS scaffold from Songs2VID (pre-strip)

components/UpgradeProButton.tsx

@@ -0,0 +1,52 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+type Props = {
+  className?: string;
+  label?: string;
+};
+
+/** Starts Pro Checkout (€5/mo) or applies a dev mock upgrade. */
+export function UpgradeProButton({
+  className = "text-accent hover:underline",
+  label = "Upgrade to Pro",
+}: Props) {
+  const router = useRouter();
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  async function handleUpgrade() {
+    setLoading(true);
+    setError(null);
+    try {
+      const res = await fetch("/api/account/subscribe", { method: "POST" });
+      const data = await res.json();
+      if (!res.ok) throw new Error(data.error || "Upgrade failed");
+      if (data.mocked) {
+        router.refresh();
+        return;
+      }
+      if (!data.url) throw new Error("No checkout URL returned");
+      window.location.href = data.url;
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Upgrade failed");
+      setLoading(false);
+    }
+  }
+
+  return (
+    <span className="inline">
+      <button
+        type="button"
+        onClick={handleUpgrade}
+        disabled={loading}
+        className={className}
+      >
+        {loading ? "Starting…" : label}
+      </button>
+      {error && <span className="ml-2 text-sm text-red-400">{error}</span>}
+    </span>
+  );
+}