Handle embed

api/.env.production

@@ -5,7 +5,7 @@ STREAM_CHAT_API_KEY=v4yf8rs94aa8
 STREAM_CHAT_API_SECRET=jq2szvv73ua7sz9tvr9y24dxg37sw8ue8t576fu7ggr4h6wvcmunby4gvte8tm8f
 
 XTABLO_URL=https://app.xtablo.com
-CORS_ORIGIN="https://app.xtablo.com"
+CORS_ORIGIN="https://app.xtablo.com,https://embed.xtablo.com"
 
 R2_ACCOUNT_ID="9715fa14c5e5d1612301572cf1c6bbee"
 R2_ACCESS_KEY_ID="caeb987bbcd601708a93c6aa562064ef"

apps/external/package.json

@@ -6,13 +6,14 @@
   "scripts": {
     "dev": "vite dev",
     "build": "tsc -b && vite build",
+    "deploy": "wrangler deploy",
     "typecheck": "tsc --noEmit",
     "lint": "biome check .",
     "lint:fix": "biome check --write .",
     "format": "biome format --write .",
     "preview": "vite preview",
-    "deploy": "echo 'Configure deployment command for external app (e.g., wrangler pages deploy dist, vercel deploy, etc.)'",
+    "clean": "rm -rf dist .vite tsconfig.tsbuildinfo node_modules/.vite",
-    "clean": "rm -rf dist .vite tsconfig.tsbuildinfo node_modules/.vite"
+    "cf-typegen": "wrangler types"
   },
   "devDependencies": {
     "@biomejs/biome": "2.2.5",
@@ -24,7 +25,8 @@
     "tw-animate-css": "^1.4.0",
     "typescript": "^5.7.0",
     "vite": "^6.2.2",
-    "vite-tsconfig-paths": "^5.1.4"
+    "vite-tsconfig-paths": "^5.1.4",
+    "wrangler": "^4.24.3"
   },
   "dependencies": {
     "@xtablo/ui": "workspace:*",

apps/external/src/EmbeddedBookingPage.tsx

@@ -213,8 +213,7 @@ export function EmbeddedBookingPage() {
 
   const shortUserId = userInfo?.substring(userInfo.lastIndexOf("-") + 1);
 
-  console.log({ shortUserId, eventTypeStandardName });
+  const { data: publicSlots } = usePublicSlots(
-  const { data: publicSlots, isLoading: isLoadingSlots } = usePublicSlots(
     api,
     shortUserId || "",
     eventTypeStandardName || ""

apps/external/src/FloatingBookingWidget.tsx

@@ -125,7 +125,7 @@ export function FloatingBookingWidget() {
   // Get color schemes based on variants
   const btnColors = buttonColors[buttonVariant];
 
-  const { data: publicSlots, isLoading: isLoadingSlots } = usePublicSlots(
+  const { data: publicSlots } = usePublicSlots(
     api,
     shortUserId || "",
     eventTypeStandardName || ""

apps/external/tsconfig.tsbuildinfo

@@ -0,0 +1 @@
+{"root":["./src/custommodal.tsx","./src/embeddedbookingpage.tsx","./src/floatingbookingwidget.tsx","./src/userstoreprovider.tsx","./src/main.tsx","./src/routes.tsx","./src/vite-env.d.ts","./src/lib/api.ts","./src/lib/supabase.ts"],"version":"5.9.3"}

apps/external/turbo.json

@@ -0,0 +1,12 @@
+{
+  "$schema": "https://turbo.build/schema.json",
+  "extends": ["//"],
+  "tasks": {
+    "deploy": {
+      "dependsOn": ["build"],
+      "cache": false,
+      "outputLogs": "new-only"
+    }
+  }
+}
+

apps/external/worker/index.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+  fetch(request: any): Response;
+};
+export default _default;

apps/external/worker/index.ts

@@ -0,0 +1,16 @@
+// @ts-nocheck
+// biome-ignore-file: Worker entry point with dynamic imports
+/* eslint-disable */
+
+export default {
+  fetch(request) {
+    const url = new URL(request.url);
+
+    if (url.pathname.startsWith("/api/")) {
+      return Response.json({
+        name: "Cloudflare",
+      });
+    }
+    return new Response(null, { status: 404 });
+  },
+};

apps/external/wrangler.toml

@@ -0,0 +1,17 @@
+name = "xtablo-embeds"
+main = "worker/index.ts"
+compatibility_date = "2025-07-09"
+
+[assets]
+directory = "./dist/"
+not_found_handling = "single-page-application"
+
+[observability]
+enabled = true
+
+[vars]
+PYTHON_VERSION = "3.11.5"
+
+[[routes]]
+pattern = "embed.xtablo.com"
+custom_domain = true

pnpm-lock.yaml

@@ -88,6 +88,9 @@ importers:
       vite-tsconfig-paths:
         specifier: ^5.1.4
         version: 5.1.4(typescript@5.9.3)(vite@6.4.1(@types/node@22.18.12)(jiti@2.6.1)(lightningcss@1.30.2))
+      wrangler:
+        specifier: ^4.24.3
+        version: 4.44.0
 
   apps/main:
     dependencies: