From e339cc9bca7648d02a2a53cb2205dcf24cffd3d5 Mon Sep 17 00:00:00 2001
From: chronark <dev@chronark.com>
Date: Mon, 23 Dec 2024 19:58:24 +0100
Subject: [PATCH] feat: add rewrites and upserts for gateway.new

---
 .../app/(app)/apis/create-api-button.tsx      | 14 ++++++--
 apps/dashboard/app/(app)/apis/page.tsx        | 11 ++++--
 apps/dashboard/app/(app)/gateway-new/page.tsx | 35 +++++++++++++++++++
 apps/dashboard/middleware.ts                  |  1 +
 apps/dashboard/next.config.js                 | 12 ++++++-
 5 files changed, 68 insertions(+), 5 deletions(-)
 create mode 100644 apps/dashboard/app/(app)/gateway-new/page.tsx

diff --git a/apps/dashboard/app/(app)/apis/create-api-button.tsx b/apps/dashboard/app/(app)/apis/create-api-button.tsx
index f29a5952d7..207f2c5674 100644
--- a/apps/dashboard/app/(app)/apis/create-api-button.tsx
+++ b/apps/dashboard/app/(app)/apis/create-api-button.tsx
@@ -19,6 +19,7 @@ import { Button } from "@unkey/ui";
 import { Plus } from "lucide-react";
 import { useRouter } from "next/navigation";
 import type React from "react";
+import { useState } from "react";
 import { useForm } from "react-hook-form";
 import { z } from "zod";
 
@@ -26,11 +27,20 @@ const formSchema = z.object({
   name: z.string().trim().min(3, "Name must be at least 3 characters long").max(50),
 });
 
-export const CreateApiButton = ({ ...rest }: React.ButtonHTMLAttributes<HTMLButtonElement>) => {
+type Props = {
+  defaultOpen?: boolean;
+};
+
+export const CreateApiButton = ({
+  defaultOpen,
+  ...rest
+}: React.ButtonHTMLAttributes<HTMLButtonElement> & Props) => {
   const form = useForm<z.infer<typeof formSchema>>({
     resolver: zodResolver(formSchema),
   });
 
+  const [open, setOpen] = useState(defaultOpen ?? false);
+
   const create = trpc.api.create.useMutation({
     async onSuccess(res) {
       toast.success("Your API has been created");
@@ -49,7 +59,7 @@ export const CreateApiButton = ({ ...rest }: React.ButtonHTMLAttributes<HTMLButt
 
   return (
     <>
-      <Dialog>
+      <Dialog open={open} onOpenChange={(o) => setOpen(o)}>
         <DialogTrigger asChild>
           <Button variant="primary" {...rest}>
             <Plus />
diff --git a/apps/dashboard/app/(app)/apis/page.tsx b/apps/dashboard/app/(app)/apis/page.tsx
index 7aaaf7413d..490553541f 100644
--- a/apps/dashboard/app/(app)/apis/page.tsx
+++ b/apps/dashboard/app/(app)/apis/page.tsx
@@ -12,7 +12,11 @@ import { ApiList } from "./client";
 export const dynamic = "force-dynamic";
 export const runtime = "edge";
 
-export default async function ApisOverviewPage() {
+type Props = {
+  searchParams: { new?: boolean };
+};
+
+export default async function ApisOverviewPage(props: Props) {
   const tenantId = getTenantId();
   const workspace = await db.query.workspaces.findFirst({
     where: (table, { and, eq, isNull }) =>
@@ -48,7 +52,10 @@ export default async function ApisOverviewPage() {
           <Navbar.Breadcrumbs.Link href="/apis">APIs</Navbar.Breadcrumbs.Link>
         </Navbar.Breadcrumbs>
         <Navbar.Actions>
-          <CreateApiButton key="createApi" />
+          <CreateApiButton
+            key="createApi"
+            defaultOpen={apis.length === 0 || props.searchParams.new}
+          />
         </Navbar.Actions>
       </Navbar>
       <PageContent>
diff --git a/apps/dashboard/app/(app)/gateway-new/page.tsx b/apps/dashboard/app/(app)/gateway-new/page.tsx
new file mode 100644
index 0000000000..91ddcc4c3c
--- /dev/null
+++ b/apps/dashboard/app/(app)/gateway-new/page.tsx
@@ -0,0 +1,35 @@
+/**
+ * This route creates a shortcut for onboarding
+ *
+ * We need this for compliance of our gateway.new domain.
+ * 1. A user will enter "gateway.new" in the browser
+ * 2. Vercel will detect the host and rewrite the request to this page
+ * 3. A workspace is upserted
+ * 4. The user is redirected to create their API
+ */
+
+import { getTenantId } from "@/lib/auth";
+import { db, schema } from "@/lib/db";
+import { newId } from "@unkey/id";
+import { redirect } from "next/navigation";
+
+export default async function Page() {
+  const tenantId = getTenantId();
+
+  const ws = await db.query.workspaces.findFirst({
+    where: (table, { eq, isNull, and }) =>
+      and(eq(table.tenantId, tenantId), isNull(table.deletedAt)),
+  });
+
+  if (!ws) {
+    await db.insert(schema.workspaces).values({
+      id: newId("workspace"),
+      name: "Personal Workspace",
+      tenantId,
+      betaFeatures: {},
+      features: {},
+    });
+  }
+
+  return redirect("/apis?new=true");
+}
diff --git a/apps/dashboard/middleware.ts b/apps/dashboard/middleware.ts
index 60f483a49d..bc6bccb5f6 100644
--- a/apps/dashboard/middleware.ts
+++ b/apps/dashboard/middleware.ts
@@ -73,6 +73,7 @@ export const config = {
     "/success",
     "/success/(.*)",
     "/auth/(.*)",
+    "/gateway-new",
     "/(api|trpc)(.*)",
     "/((?!.+\\.[\\w]+$|_next).*)",
     "/((?!_next/static|_next/image|images|favicon.ico|$).*)",
diff --git a/apps/dashboard/next.config.js b/apps/dashboard/next.config.js
index b3240c0fc0..26fdb8eabe 100644
--- a/apps/dashboard/next.config.js
+++ b/apps/dashboard/next.config.js
@@ -1,5 +1,4 @@
 /** @type {import('next').NextConfig} */
-
 const securityHeaders = [
   {
     key: "X-Frame-Options",
@@ -51,6 +50,17 @@ const nextConfig = {
       source: "/engineering/:match*",
       destination: "https://unkey-engineering.mintlify.dev/engineering/:match*",
     },
+    // Powers our gateway.new compliant domain
+    {
+      source: "/:path",
+      has: [
+        {
+          type: "host",
+          value: "gateway.new",
+        },
+      ],
+      destination: "/gateway-new",
+    },
   ],
 };