feat: Enable custom domains for shareable links

apps/web/app/dashboard/caps/components/CapCard.tsx

@@ -123,7 +123,7 @@ export const CapCard: React.FC<CapCardProps> = ({
         className="group block"
         href={
           activeSpace?.space.customDomain
-            ? `https://${activeSpace.space.customDomain}/${cap.id}`
+            ? `https://${activeSpace.space.customDomain}/s/${cap.id}`
             : clientEnv.NEXT_PUBLIC_IS_CAP && NODE_ENV === "production"
             ? `https://cap.link/${cap.id}`
             : `${clientEnv.NEXT_PUBLIC_WEB_URL}/s/${cap.id}`

apps/web/app/dashboard/caps/components/CapCardActions.tsx

@@ -2,7 +2,7 @@ import { serverEnv, clientEnv, NODE_ENV } from "@cap/env";
 import { LinkIcon, Trash } from "lucide-react";
 import { toast } from "react-hot-toast";
 import { Tooltip } from "react-tooltip";
-
+import { useSharedContext } from "../../_components/DynamicSharedLayout";
 interface CapCardActionsProps {
   capId: string;
   onDelete: (videoId: string) => Promise<void>;
@@ -12,9 +12,12 @@ export const CapCardActions: React.FC<CapCardActionsProps> = ({
   capId,
   onDelete,
 }) => {
+  const { activeSpace } = useSharedContext();
   const copyLink = () => {
     const link =
-      clientEnv.NEXT_PUBLIC_IS_CAP && NODE_ENV === "production"
+      activeSpace?.space.customDomain && activeSpace.space.domainVerified
+        ? `https://${activeSpace.space.customDomain}/s/${capId}`
+        : clientEnv.NEXT_PUBLIC_IS_CAP && NODE_ENV === "production"
         ? `https://cap.link/${capId}`
         : `${clientEnv.NEXT_PUBLIC_WEB_URL}/s/${capId}`;
 

apps/web/app/dashboard/shared-caps/components/SharedCapCard.tsx

@@ -41,8 +41,8 @@ export const SharedCapCard: React.FC<SharedCapCardProps> = ({
       <a
         className="group block"
         href={
-          activeSpace?.space.customDomain
-            ? `https://${activeSpace.space.customDomain}/${cap.id}`
+          activeSpace?.space.customDomain && activeSpace.space.domainVerified
+            ? `https://${activeSpace.space.customDomain}/s/${cap.id}`
             : clientEnv.NEXT_PUBLIC_IS_CAP && NODE_ENV === "production"
             ? `https://cap.link/${cap.id}`
             : `${clientEnv.NEXT_PUBLIC_WEB_URL}/s/${cap.id}`

apps/web/middleware.ts

@@ -0,0 +1,50 @@
+import { NextResponse } from 'next/server';
+import type { NextRequest } from 'next/server';
+import { db } from '@cap/database';
+import { spaces } from '@cap/database/schema';
+import { eq } from 'drizzle-orm';
+
+export async function middleware(request: NextRequest) {
+  const hostname = request.headers.get('host');
+  const path = request.nextUrl.pathname;
+
+  if (!hostname) return NextResponse.next();
+
+  // Skip for main domains
+  if (hostname.includes('cap.so') || hostname.includes('cap.link') || hostname.includes('localhost')) {
+    return NextResponse.next();
+  }
+
+  // We're on a custom domain at this point
+  // Only allow /s/ routes for custom domains
+  if (!path.startsWith('/s/')) {
+    const url = new URL(request.url);
+    url.hostname = 'cap.so';
+    return NextResponse.redirect(url);
+  }
+
+  try {
+    // Query the space with this custom domain
+    const [space] = await db
+      .select()
+      .from(spaces)
+      .where(eq(spaces.customDomain, hostname));
+
+    if (!space || !space.domainVerified) {
+      // If no verified custom domain found, redirect to main domain
+      const url = new URL(request.url);
+      url.hostname = 'cap.so';
+      return NextResponse.redirect(url);
+    }
+
+    // Allow the request to continue to the destination
+    return NextResponse.next();
+  } catch (error) {
+    console.error('Error in middleware:', error);
+    return NextResponse.next();
+  }
+}
+
+export const config = {
+  matcher: ['/((?!api|_next/static|_next/image|favicon.ico).*)']
+};

apps/web/next.config.mjs

@@ -50,6 +50,16 @@ const nextConfig = {
         source: "/r/:path*",
         destination: "https://dub.cap.link/:path*",
       },
+      {
+        source: '/s/:videoId',
+        destination: '/s/:videoId',
+        has: [
+          {
+            type: 'host',
+            value: '(?!cap\.so|cap\.link).*',
+          },
+        ],
+      }
     ];
   },
   async redirects() {