veryfront 0.1.216 → 0.1.217

package/esm/cli/templates/manifest.js

@@ -209,7 +209,8 @@ export default {
                 "lib/oauth.ts": "import { type OAuthToken, tokenStore } from \"./token-store.ts\";\n\nexport interface OAuthProvider {\n  name: string;\n  authorizationUrl: string;\n  tokenUrl: string;\n  clientId: string;\n  clientSecret: string;\n  scopes: string[];\n  callbackPath: string;\n}\n\nfunction getExpiresAt(expiresIn: unknown): number | undefined {\n  if (typeof expiresIn !== \"number\" || expiresIn <= 0) return undefined;\n  return Date.now() + expiresIn * 1000;\n}\n\nasync function postTokenRequest(\n  provider: OAuthProvider,\n  body: Record<string, string>,\n  errorPrefix: string,\n): Promise<any> {\n  const response = await fetch(provider.tokenUrl, {\n    method: \"POST\",\n    headers: { \"Content-Type\": \"application/x-www-form-urlencoded\" },\n    body: new URLSearchParams(body),\n  });\n\n  if (response.ok) return response.json();\n\n  const error = await response.text();\n  throw new Error(`${errorPrefix}: ${response.status} - ${error}`);\n}\n\nexport function getAuthorizationUrl(\n  provider: OAuthProvider,\n  state: string,\n  redirectUri: string,\n): string {\n  const params = new URLSearchParams({\n    client_id: provider.clientId,\n    redirect_uri: redirectUri,\n    response_type: \"code\",\n    scope: provider.scopes.join(\" \"),\n    state,\n    access_type: \"offline\",\n    prompt: \"consent\",\n  });\n\n  return `${provider.authorizationUrl}?${params.toString()}`;\n}\n\nexport async function exchangeCodeForTokens(\n  provider: OAuthProvider,\n  code: string,\n  redirectUri: string,\n): Promise<OAuthToken> {\n  const data = await postTokenRequest(\n    provider,\n    {\n      client_id: provider.clientId,\n      client_secret: provider.clientSecret,\n      code,\n      grant_type: \"authorization_code\",\n      redirect_uri: redirectUri,\n    },\n    \"Token exchange failed\",\n  );\n\n  return {\n    accessToken: data.access_token,\n    refreshToken: data.refresh_token,\n    expiresAt: getExpiresAt(data.expires_in),\n    tokenType: data.token_type ?? \"Bearer\",\n    scope: data.scope,\n  };\n}\n\nexport async function refreshAccessToken(\n  provider: OAuthProvider,\n  refreshToken: string,\n): Promise<OAuthToken> {\n  const data = await postTokenRequest(\n    provider,\n    {\n      client_id: provider.clientId,\n      client_secret: provider.clientSecret,\n      refresh_token: refreshToken,\n      grant_type: \"refresh_token\",\n    },\n    \"Token refresh failed\",\n  );\n\n  return {\n    accessToken: data.access_token,\n    refreshToken: data.refresh_token ?? refreshToken,\n    expiresAt: getExpiresAt(data.expires_in),\n    tokenType: data.token_type ?? \"Bearer\",\n    scope: data.scope,\n  };\n}\n\nexport async function getValidToken(\n  provider: OAuthProvider,\n  userId: string,\n  service: string,\n): Promise<string | null> {\n  const token = await tokenStore.getToken(userId, service);\n  if (!token) return null;\n\n  const isExpired = token.expiresAt\n    ? token.expiresAt < Date.now() + 5 * 60 * 1000\n    : false;\n\n  if (!isExpired || !token.refreshToken) return token.accessToken;\n\n  try {\n    const newToken = await refreshAccessToken(provider, token.refreshToken);\n    await tokenStore.setToken(userId, service, newToken);\n    return newToken.accessToken;\n  } catch {\n    await tokenStore.revokeToken(userId, service);\n    return null;\n  }\n}\n",
                 "lib/token-store-examples.ts": "/****\n * Production Token Store Examples\n *\n * Copy-paste implementations for different storage backends.\n * Each example includes encryption support via TOKEN_ENCRYPTION_KEY.\n *\n * @module\n */\n\nimport { createTokenStore, tokenStore, type TokenStore } from \"./token-store.ts\";\n\n// ============================================================================\n// Vercel KV Store\n// ============================================================================\n\n/**\n * Token store using Vercel KV (Redis-compatible)\n *\n * Required environment variables:\n * - KV_REST_API_URL\n * - KV_REST_API_TOKEN\n * - TOKEN_ENCRYPTION_KEY (recommended)\n *\n * @example\n * ```typescript\n * // lib/token-store.ts\n * import { createVercelKVStore } from './token-store-examples';\n * export const tokenStore = createVercelKVStore();\n * ```\n */\nexport function createVercelKVStore(): TokenStore {\n  type VercelKV = typeof import(\"@vercel/kv\");\n  let kvPromise: Promise<VercelKV> | null = null;\n\n  async function getKV(): Promise<VercelKV[\"kv\"]> {\n    kvPromise ??= import(\"@vercel/kv\");\n    return (await kvPromise).kv;\n  }\n\n  return createTokenStore({\n    async get(key: string): Promise<string | null> {\n      const kv = await getKV();\n      return kv.get<string>(key);\n    },\n    async set(key: string, value: string): Promise<void> {\n      const kv = await getKV();\n      await kv.set(key, value);\n    },\n    async delete(key: string): Promise<void> {\n      const kv = await getKV();\n      await kv.del(key);\n    },\n  });\n}\n\n// ============================================================================\n// Redis Store\n// ============================================================================\n\n/**\n * Token store using Redis\n *\n * Required environment variables:\n * - REDIS_URL (e.g., redis://localhost:6379)\n * - TOKEN_ENCRYPTION_KEY (recommended)\n *\n * @example\n * ```typescript\n * // lib/token-store.ts\n * import { createRedisStore } from './token-store-examples';\n * export const tokenStore = createRedisStore();\n * ```\n */\nexport function createRedisStore(): TokenStore {\n  let clientPromise: Promise<ReturnType<(typeof import(\"redis\"))[\"createClient\"]>> | null = null;\n\n  async function getClient(): Promise<ReturnType<(typeof import(\"redis\"))[\"createClient\"]>> {\n    clientPromise ??= (async () => {\n      const { createClient } = await import(\"redis\");\n      const client = createClient({ url: process.env.REDIS_URL });\n      await client.connect();\n      return client;\n    })();\n\n    return clientPromise;\n  }\n\n  return createTokenStore({\n    async get(key: string): Promise<string | null> {\n      const client = await getClient();\n      return client.get(key);\n    },\n    async set(key: string, value: string): Promise<void> {\n      const client = await getClient();\n      await client.set(key, value);\n    },\n    async delete(key: string): Promise<void> {\n      const client = await getClient();\n      await client.del(key);\n    },\n  });\n}\n\n// ============================================================================\n// PostgreSQL Store\n// ============================================================================\n\n/**\n * Token store using PostgreSQL\n *\n * Required environment variables:\n * - DATABASE_URL (e.g., postgres://user:pass@host:5432/db)\n * - TOKEN_ENCRYPTION_KEY (recommended)\n *\n * Required table (create with migration):\n * ```sql\n * CREATE TABLE oauth_tokens (\n *   key VARCHAR(255) PRIMARY KEY,\n *   value TEXT NOT NULL,\n *   created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,\n *   updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP\n * );\n * CREATE INDEX idx_oauth_tokens_key ON oauth_tokens(key);\n * ```\n *\n * @example\n * ```typescript\n * // lib/token-store.ts\n * import { createPostgresStore } from './token-store-examples';\n * export const tokenStore = createPostgresStore();\n * ```\n */\nexport function createPostgresStore(): TokenStore {\n  let poolPromise: Promise<import(\"pg\").Pool> | null = null;\n\n  async function getPool(): Promise<import(\"pg\").Pool> {\n    poolPromise ??= (async () => {\n      const { Pool } = await import(\"pg\");\n      return new Pool({ connectionString: process.env.DATABASE_URL });\n    })();\n\n    return poolPromise;\n  }\n\n  return createTokenStore({\n    async get(key: string): Promise<string | null> {\n      const pool = await getPool();\n      const result = await pool.query(\"SELECT value FROM oauth_tokens WHERE key = $1\", [key]);\n      return result.rows[0]?.value ?? null;\n    },\n    async set(key: string, value: string): Promise<void> {\n      const pool = await getPool();\n      await pool.query(\n        `INSERT INTO oauth_tokens (key, value, updated_at)\n         VALUES ($1, $2, NOW())\n         ON CONFLICT (key) DO UPDATE SET value = $2, updated_at = NOW()`,\n        [key, value],\n      );\n    },\n    async delete(key: string): Promise<void> {\n      const pool = await getPool();\n      await pool.query(\"DELETE FROM oauth_tokens WHERE key = $1\", [key]);\n    },\n  });\n}\n\n// ============================================================================\n// SQLite Store (for edge/serverless with D1, Turso, etc.)\n// ============================================================================\n\n/**\n * Token store using SQLite (Cloudflare D1, Turso, better-sqlite3)\n *\n * Required table:\n * ```sql\n * CREATE TABLE oauth_tokens (\n *   key TEXT PRIMARY KEY,\n *   value TEXT NOT NULL,\n *   updated_at INTEGER DEFAULT (strftime('%s', 'now'))\n * );\n * ```\n *\n * @param db - SQLite database instance (D1Database, Connection, or Database)\n *\n * @example With Cloudflare D1\n * ```typescript\n * // In your API route\n * export async function GET(request: Request, { env }) {\n *   const tokenStore = createSQLiteStore(env.DB);\n *   // ...\n * }\n * ```\n *\n * @example With Turso\n * ```typescript\n * import { createClient } from '@libsql/client';\n * const db = createClient({ url: process.env.TURSO_URL, authToken: process.env.TURSO_AUTH_TOKEN });\n * export const tokenStore = createSQLiteStore(db);\n * ```\n */\nexport function createSQLiteStore(db: {\n  prepare(sql: string): {\n    bind(...args: unknown[]): { first(): Promise<{ value?: string } | null>; run(): Promise<void> };\n  };\n}): TokenStore {\n  return createTokenStore({\n    async get(key: string): Promise<string | null> {\n      const result = await db.prepare(\"SELECT value FROM oauth_tokens WHERE key = ?\").bind(key).first();\n      return result?.value ?? null;\n    },\n    async set(key: string, value: string): Promise<void> {\n      await db\n        .prepare(\n          `INSERT OR REPLACE INTO oauth_tokens (key, value, updated_at)\n           VALUES (?, ?, strftime('%s', 'now'))`,\n        )\n        .bind(key, value)\n        .run();\n    },\n    async delete(key: string): Promise<void> {\n      await db.prepare(\"DELETE FROM oauth_tokens WHERE key = ?\").bind(key).run();\n    },\n  });\n}\n\n// ============================================================================\n// Cloudflare Workers KV Store\n// ============================================================================\n\n/**\n * Token store using Cloudflare Workers KV\n *\n * @param kv - KV namespace binding from worker environment\n *\n * @example\n * ```typescript\n * // In your worker\n * export default {\n *   async fetch(request, env) {\n *     const tokenStore = createWorkersKVStore(env.OAUTH_TOKENS);\n *     // ...\n *   }\n * };\n * ```\n */\nexport function createWorkersKVStore(kv: {\n  get(key: string): Promise<string | null>;\n  put(key: string, value: string): Promise<void>;\n  delete(key: string): Promise<void>;\n}): TokenStore {\n  return createTokenStore({\n    get(key: string): Promise<string | null> {\n      return kv.get(key);\n    },\n    set(key: string, value: string): Promise<void> {\n      return kv.put(key, value);\n    },\n    delete(key: string): Promise<void> {\n      return kv.delete(key);\n    },\n  });\n}\n\n// ============================================================================\n// Prisma Store\n// ============================================================================\n\n/**\n * Token store using Prisma ORM\n *\n * Required Prisma schema:\n * ```prisma\n * model OAuthToken {\n *   key       String   @id\n *   value     String\n *   updatedAt DateTime @updatedAt\n * }\n * ```\n *\n * @example\n * ```typescript\n * import { PrismaClient } from '@prisma/client';\n * const prisma = new PrismaClient();\n * export const tokenStore = createPrismaStore(prisma);\n * ```\n */\nexport function createPrismaStore(prisma: {\n  oAuthToken: {\n    findUnique(args: { where: { key: string } }): Promise<{ value: string } | null>;\n    upsert(args: {\n      where: { key: string };\n      update: { value: string };\n      create: { key: string; value: string };\n    }): Promise<unknown>;\n    delete(args: { where: { key: string } }): Promise<unknown>;\n  };\n}): TokenStore {\n  return createTokenStore({\n    async get(key: string): Promise<string | null> {\n      const record = await prisma.oAuthToken.findUnique({ where: { key } });\n      return record?.value ?? null;\n    },\n    async set(key: string, value: string): Promise<void> {\n      await prisma.oAuthToken.upsert({\n        where: { key },\n        update: { value },\n        create: { key, value },\n      });\n    },\n    async delete(key: string): Promise<void> {\n      try {\n        await prisma.oAuthToken.delete({ where: { key } });\n      } catch {\n        // Ignore if not found\n      }\n    },\n  });\n}\n\n// ============================================================================\n// Drizzle ORM Store\n// ============================================================================\n\n/**\n * Token store using Drizzle ORM\n *\n * Required schema:\n * ```typescript\n * import { pgTable, text, timestamp } from 'drizzle-orm/pg-core';\n *\n * export const oauthTokens = pgTable('oauth_tokens', {\n *   key: text('key').primaryKey(),\n *   value: text('value').notNull(),\n *   updatedAt: timestamp('updated_at').defaultNow(),\n * });\n * ```\n *\n * @example\n * ```typescript\n * import { drizzle } from 'drizzle-orm/postgres-js';\n * import postgres from 'postgres';\n * import { oauthTokens } from './schema';\n *\n * const client = postgres(process.env.DATABASE_URL!);\n * const db = drizzle(client);\n * export const tokenStore = createDrizzleStore(db, oauthTokens);\n * ```\n */\nexport function createDrizzleStore<T extends { key: unknown; value: unknown }>(\n  db: {\n    select(): {\n      from(table: T): { where(condition: unknown): { get(): Promise<{ value: string } | undefined> } };\n    };\n    insert(table: T): {\n      values(data: { key: string; value: string }): {\n        onConflictDoUpdate(args: { target: unknown; set: { value: string } }): { execute(): Promise<void> };\n      };\n    };\n    delete(table: T): { where(condition: unknown): { execute(): Promise<void> } };\n  },\n  table: T & { key: unknown; value: unknown },\n  eq: (col: unknown, val: unknown) => unknown,\n): TokenStore {\n  return createTokenStore({\n    async get(key: string): Promise<string | null> {\n      const result = await db.select().from(table).where(eq(table.key, key)).get();\n      return result?.value ?? null;\n    },\n    async set(key: string, value: string): Promise<void> {\n      await db\n        .insert(table)\n        .values({ key, value })\n        .onConflictDoUpdate({ target: table.key, set: { value } })\n        .execute();\n    },\n    async delete(key: string): Promise<void> {\n      await db.delete(table).where(eq(table.key, key)).execute();\n    },\n  });\n}\n\n// ============================================================================\n// Auto-Select Store (Recommended)\n// ============================================================================\n\n/**\n * Automatically selects the appropriate token store based on environment\n *\n * Detection order:\n * 1. DATABASE_URL -> PostgreSQL\n * 2. KV_REST_API_URL -> Vercel KV\n * 3. REDIS_URL -> Redis\n * 4. Fallback -> In-memory (development only)\n *\n * @example\n * ```typescript\n * // lib/token-store.ts\n * import { createAutoStore } from './token-store-examples';\n * export const tokenStore = createAutoStore();\n * ```\n */\nexport function createAutoStore(): TokenStore {\n  const env = process.env;\n\n  if (env.DATABASE_URL) {\n    console.log(\"[Token Store] Using PostgreSQL storage\");\n    return createPostgresStore();\n  }\n\n  if (env.KV_REST_API_URL && env.KV_REST_API_TOKEN) {\n    console.log(\"[Token Store] Using Vercel KV storage\");\n    return createVercelKVStore();\n  }\n\n  if (env.REDIS_URL) {\n    console.log(\"[Token Store] Using Redis storage\");\n    return createRedisStore();\n  }\n\n  console.warn(\n    \"[Token Store] No production storage configured. \" +\n      \"Using in-memory storage (tokens will be lost on restart). \" +\n      \"Set DATABASE_URL, KV_REST_API_URL, or REDIS_URL for production.\",\n  );\n\n  return tokenStore;\n}\n",
                 "lib/token-store.ts": "/********************************************************************************\n * OAuth Token Store\n *\n * Manages OAuth tokens for connected services.\n *\n * ## Storage Modes\n *\n * **Development (default)**: In-memory storage - tokens are lost on restart.\n * **Production**: Configure via environment variables:\n *   - DATABASE_URL: Uses database storage (Postgres, SQLite, MySQL)\n *   - KV_REST_API_URL + KV_REST_API_TOKEN: Uses Vercel KV\n *   - REDIS_URL: Uses Redis\n *   - TOKEN_ENCRYPTION_KEY: Enables AES-256-GCM encryption (recommended)\n *\n * ## Security\n *\n * Tokens contain sensitive OAuth credentials. In production:\n * 1. Always use encrypted storage (set TOKEN_ENCRYPTION_KEY)\n * 2. Use HTTPS for all connections\n * 3. Implement proper access control\n * 4. Rotate encryption keys periodically\n *\n * @see lib/token-store-examples.ts for complete production implementations\n ********************************************************************************/\n\nexport interface OAuthToken {\n  accessToken: string;\n  refreshToken?: string;\n  expiresAt?: number;\n  tokenType?: string;\n  scope?: string;\n}\n\nexport interface TokenStore {\n  getToken(userId: string, service: string): Promise<OAuthToken | null>;\n  setToken(userId: string, service: string, token: OAuthToken): Promise<void>;\n  revokeToken(userId: string, service: string): Promise<void>;\n  isConnected(userId: string, service: string): Promise<boolean>;\n}\n\n/** Token store configuration for production backends */\nexport interface TokenStoreConfig {\n  get: (key: string) => Promise<string | null>;\n  set: (key: string, value: string) => Promise<void>;\n  delete: (key: string) => Promise<void>;\n}\n\nconst AUTO_KEY_STORAGE = \"__veryfront_auto_encryption_key__\";\nconst TOKENS_KEY = \"__veryfront_oauth_tokens__\";\n\nconst globalStore = globalThis as Record<string, unknown>;\n\n// ============================================================================\n// Encryption Utilities\n// ============================================================================\n\nexport async function encryptToken(token: OAuthToken): Promise<string> {\n  const key = getEncryptionKey();\n  if (!key) return JSON.stringify(token);\n\n  const data = new TextEncoder().encode(JSON.stringify(token));\n  const iv = crypto.getRandomValues(new Uint8Array(12));\n\n  const cryptoKey = await crypto.subtle.importKey(\"raw\", key, \"AES-GCM\", false, [\"encrypt\"]);\n  const encrypted = await crypto.subtle.encrypt({ name: \"AES-GCM\", iv }, cryptoKey, data);\n\n  const combined = new Uint8Array(iv.length + encrypted.byteLength);\n  combined.set(iv);\n  combined.set(new Uint8Array(encrypted), iv.length);\n\n  return `encrypted:${btoa(String.fromCharCode(...combined))}`;\n}\n\nexport async function decryptToken(encrypted: string): Promise<OAuthToken | null> {\n  if (!encrypted.startsWith(\"encrypted:\")) {\n    try {\n      return JSON.parse(encrypted) as OAuthToken;\n    } catch {\n      return null;\n    }\n  }\n\n  const key = getEncryptionKey();\n  if (!key) {\n    console.error(\"[Token Store] Cannot decrypt: TOKEN_ENCRYPTION_KEY not set\");\n    return null;\n  }\n\n  try {\n    const base64 = encrypted.slice(\"encrypted:\".length);\n    const combined = Uint8Array.from(atob(base64), (c) => c.charCodeAt(0));\n\n    const iv = combined.slice(0, 12);\n    const ciphertext = combined.slice(12);\n\n    const cryptoKey = await crypto.subtle.importKey(\"raw\", key, \"AES-GCM\", false, [\"decrypt\"]);\n    const decrypted = await crypto.subtle.decrypt({ name: \"AES-GCM\", iv }, cryptoKey, ciphertext);\n\n    return JSON.parse(new TextDecoder().decode(decrypted)) as OAuthToken;\n  } catch {\n    console.error(\"[Token Store] Decryption failed\");\n    return null;\n  }\n}\n\nexport function generateEncryptionKey(): string {\n  const bytes = crypto.getRandomValues(new Uint8Array(32));\n  return Array.from(bytes)\n    .map((b) => b.toString(16).padStart(2, \"0\"))\n    .join(\"\");\n}\n\nfunction getEnvVar(name: string): string | undefined {\n  if (typeof process !== \"undefined\") return process.env?.[name];\n  return (globalThis as { Deno?: { env?: { get?: (key: string) => string | undefined } } }).Deno?.env?.get?.(name);\n}\n\nfunction hexToKeyBytes(keyHex: string): Uint8Array | null {\n  if (keyHex.length !== 64) {\n    console.error(\"[Token Store] TOKEN_ENCRYPTION_KEY must be 64 hex characters (32 bytes)\");\n    return null;\n  }\n\n  const key = new Uint8Array(32);\n  for (let i = 0; i < 32; i++) {\n    key[i] = parseInt(keyHex.slice(i * 2, i * 2 + 2), 16);\n  }\n  return key;\n}\n\n/** Get encryption key from environment or auto-generate for development */\nfunction getEncryptionKey(): Uint8Array | null {\n  const keyHex = getEnvVar(\"TOKEN_ENCRYPTION_KEY\");\n  if (keyHex) return hexToKeyBytes(keyHex);\n\n  if (!globalStore[AUTO_KEY_STORAGE]) {\n    globalStore[AUTO_KEY_STORAGE] = generateEncryptionKey();\n  }\n\n  return hexToKeyBytes(globalStore[AUTO_KEY_STORAGE] as string);\n}\n\n// ============================================================================\n// Storage Mode Detection\n// ============================================================================\n\nexport type StorageMode = \"memory\" | \"database\" | \"kv\" | \"redis\" | \"custom\";\n\nexport function getStorageMode(): StorageMode {\n  const env =\n    typeof process !== \"undefined\"\n      ? process.env\n      : (globalThis as { Deno?: { env?: { toObject?: () => Record<string, string> } } }).Deno?.env?.toObject?.() ?? {};\n\n  if (env.DATABASE_URL) return \"database\";\n  if (env.KV_REST_API_URL) return \"kv\";\n  if (env.REDIS_URL) return \"redis\";\n  return \"memory\";\n}\n\nexport function isEncryptionEnabled(): boolean {\n  return getEncryptionKey() !== null;\n}\n\n// ============================================================================\n// In-Memory Store (Development)\n// ============================================================================\n\nconst tokens = (globalStore[TOKENS_KEY] as Map<string, OAuthToken> | undefined) ?? new Map<string, OAuthToken>();\nglobalStore[TOKENS_KEY] = tokens;\n\nfunction getKey(userId: string, service: string): string {\n  return `${userId}:${service}`;\n}\n\nasync function isConnected(\n  store: Pick<TokenStore, \"getToken\">,\n  userId: string,\n  service: string,\n): Promise<boolean> {\n  const token = await store.getToken(userId, service);\n  return !!token && (!token.expiresAt || token.expiresAt > Date.now());\n}\n\nconst inMemoryStore: TokenStore = {\n  async getToken(userId: string, service: string): Promise<OAuthToken | null> {\n    return tokens.get(getKey(userId, service)) ?? null;\n  },\n\n  async setToken(userId: string, service: string, token: OAuthToken): Promise<void> {\n    tokens.set(getKey(userId, service), token);\n  },\n\n  async revokeToken(userId: string, service: string): Promise<void> {\n    tokens.delete(getKey(userId, service));\n  },\n\n  async isConnected(userId: string, service: string): Promise<boolean> {\n    return isConnected(this, userId, service);\n  },\n};\n\n// ============================================================================\n// Token Store Factory\n// ============================================================================\n\nexport function createTokenStore(config: TokenStoreConfig): TokenStore {\n  return {\n    async getToken(userId: string, service: string): Promise<OAuthToken | null> {\n      const data = await config.get(getKey(userId, service));\n      if (!data) return null;\n      return decryptToken(data);\n    },\n\n    async setToken(userId: string, service: string, token: OAuthToken): Promise<void> {\n      await config.set(getKey(userId, service), await encryptToken(token));\n    },\n\n    async revokeToken(userId: string, service: string): Promise<void> {\n      await config.delete(getKey(userId, service));\n    },\n\n    async isConnected(userId: string, service: string): Promise<boolean> {\n      return isConnected(this, userId, service);\n    },\n  };\n}\n\n// ============================================================================\n// Default Export (Auto-detects environment)\n// ============================================================================\n\nexport const tokenStore: TokenStore = inMemoryStore;\n\nif (typeof process !== \"undefined\" && process.env?.NODE_ENV !== \"production\" && getStorageMode() === \"memory\") {\n  console.warn(\n    \"[Token Store] Using in-memory storage (development mode). \" +\n      \"Tokens will be lost on restart. \" +\n      \"Set DATABASE_URL, KV_REST_API_URL, or REDIS_URL for production.\",\n  );\n}\n",
-                "app/setup/page.tsx": "\"use client\";\n\nimport { useEffect, useMemo, useState } from \"react\";\n\ninterface Integration {\n  id: string;\n  name: string;\n  icon: string;\n  connected: boolean;\n  connectUrl: string;\n}\n\ninterface SetupStep {\n  id: string;\n  title: string;\n  description: string;\n  completed: boolean;\n  action?: () => void;\n  link?: string;\n}\n\ninterface SetupGuide {\n  title: string;\n  steps: string[];\n  link: string;\n  envVars: string[];\n  category: string;\n}\n\ninterface TokenStorageStatus {\n  mode: \"memory\" | \"database\" | \"kv\" | \"redis\" | \"custom\";\n  encrypted: boolean;\n  autoGenerated?: boolean;\n}\n\nconst CATEGORIES = [\n  { id: \"google\", name: \"Google Services\", icon: \"google\" },\n  { id: \"microsoft\", name: \"Microsoft Services\", icon: \"microsoft\" },\n  { id: \"atlassian\", name: \"Atlassian\", icon: \"atlassian\" },\n  { id: \"communication\", name: \"Communication\", icon: \"chat\" },\n  { id: \"development\", name: \"Development\", icon: \"code\" },\n  { id: \"productivity\", name: \"Productivity\", icon: \"tasks\" },\n  { id: \"storage\", name: \"Storage\", icon: \"folder\" },\n  { id: \"infrastructure\", name: \"Infrastructure\", icon: \"server\" },\n  { id: \"sales\", name: \"Sales & CRM\", icon: \"users\" },\n  { id: \"support\", name: \"Support\", icon: \"headset\" },\n  { id: \"finance\", name: \"Finance\", icon: \"dollar\" },\n  { id: \"marketing\", name: \"Marketing\", icon: \"megaphone\" },\n  { id: \"design\", name: \"Design\", icon: \"palette\" },\n  { id: \"ai\", name: \"AI Providers\", icon: \"brain\" },\n] as const;\n\nconst OAUTH_SETUP_GUIDES: Record<string, SetupGuide> = {\n  gmail: {\n    title: \"Google OAuth Setup (Gmail)\",\n    category: \"google\",\n    steps: [\n      \"Go to Google Cloud Console\",\n      \"Create a new project or select existing one\",\n      \"Enable Gmail API in APIs & Services > Library\",\n      \"Go to APIs & Services > Credentials\",\n      \"Create OAuth 2.0 credentials (Web application)\",\n      \"Add redirect URI: http://localhost:3000/api/auth/gmail/callback\",\n      \"Copy Client ID and Secret to your .env file\",\n    ],\n    link: \"https://console.cloud.google.com/apis/credentials\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  calendar: {\n    title: \"Google Calendar Setup\",\n    category: \"google\",\n    steps: [\n      \"Uses same Google OAuth credentials as Gmail\",\n      \"Enable Calendar API in Google Cloud Console\",\n      \"Add redirect URI: http://localhost:3000/api/auth/calendar/callback\",\n    ],\n    link: \"https://console.cloud.google.com/apis/library/calendar-json.googleapis.com\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  drive: {\n    title: \"Google Drive Setup\",\n    category: \"google\",\n    steps: [\n      \"Uses same Google OAuth credentials\",\n      \"Enable Drive API in Google Cloud Console\",\n      \"Add redirect URI: http://localhost:3000/api/auth/drive/callback\",\n    ],\n    link: \"https://console.cloud.google.com/apis/library/drive.googleapis.com\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  sheets: {\n    title: \"Google Sheets Setup\",\n    category: \"google\",\n    steps: [\n      \"Uses same Google OAuth credentials\",\n      \"Enable Sheets API in Google Cloud Console\",\n      \"Add redirect URI: http://localhost:3000/api/auth/sheets/callback\",\n    ],\n    link: \"https://console.cloud.google.com/apis/library/sheets.googleapis.com\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  \"docs-google\": {\n    title: \"Google Docs Setup\",\n    category: \"google\",\n    steps: [\n      \"Uses same Google OAuth credentials\",\n      \"Enable Docs API in Google Cloud Console\",\n      \"Add redirect URI: http://localhost:3000/api/auth/docs-google/callback\",\n    ],\n    link: \"https://console.cloud.google.com/apis/library/docs.googleapis.com\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n\n  outlook: {\n    title: \"Microsoft Outlook Setup\",\n    category: \"microsoft\",\n    steps: [\n      \"Go to Azure Portal > Azure Active Directory\",\n      \"Click App registrations > New registration\",\n      \"Set redirect URI: http://localhost:3000/api/auth/outlook/callback\",\n      \"Go to API permissions > Add Microsoft Graph permissions\",\n      \"Add: Mail.Read, Mail.Send, Mail.ReadWrite\",\n      \"Go to Certificates & secrets > New client secret\",\n      \"Copy Application ID and Secret to .env\",\n    ],\n    link: \"https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade\",\n    envVars: [\"MICROSOFT_CLIENT_ID\", \"MICROSOFT_CLIENT_SECRET\"],\n  },\n  teams: {\n    title: \"Microsoft Teams Setup\",\n    category: \"microsoft\",\n    steps: [\n      \"Uses same Microsoft OAuth credentials as Outlook\",\n      \"Add Teams permissions: Chat.Read, Chat.ReadWrite, Channel.ReadBasic.All\",\n      \"Add redirect URI: http://localhost:3000/api/auth/teams/callback\",\n    ],\n    link: \"https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade\",\n    envVars: [\"MICROSOFT_CLIENT_ID\", \"MICROSOFT_CLIENT_SECRET\"],\n  },\n  onedrive: {\n    title: \"Microsoft OneDrive Setup\",\n    category: \"microsoft\",\n    steps: [\n      \"Uses same Microsoft OAuth credentials\",\n      \"Add permissions: Files.Read, Files.ReadWrite\",\n      \"Add redirect URI: http://localhost:3000/api/auth/onedrive/callback\",\n    ],\n    link: \"https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade\",\n    envVars: [\"MICROSOFT_CLIENT_ID\", \"MICROSOFT_CLIENT_SECRET\"],\n  },\n  sharepoint: {\n    title: \"Microsoft SharePoint Setup\",\n    category: \"microsoft\",\n    steps: [\n      \"Uses same Microsoft OAuth credentials\",\n      \"Add permissions: Sites.Read.All, Sites.ReadWrite.All\",\n      \"Add redirect URI: http://localhost:3000/api/auth/sharepoint/callback\",\n    ],\n    link: \"https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade\",\n    envVars: [\"MICROSOFT_CLIENT_ID\", \"MICROSOFT_CLIENT_SECRET\"],\n  },\n\n  jira: {\n    title: \"Atlassian Jira Setup\",\n    category: \"atlassian\",\n    steps: [\n      \"Go to Atlassian Developer Console\",\n      \"Click Create > OAuth 2.0 integration\",\n      \"Add Jira API scopes: read:jira-work, write:jira-work\",\n      \"Set callback URL: http://localhost:3000/api/auth/jira/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.atlassian.com/console/myapps/\",\n    envVars: [\"ATLASSIAN_CLIENT_ID\", \"ATLASSIAN_CLIENT_SECRET\"],\n  },\n  confluence: {\n    title: \"Atlassian Confluence Setup\",\n    category: \"atlassian\",\n    steps: [\n      \"Uses same Atlassian OAuth credentials as Jira\",\n      \"Add Confluence scopes: read:confluence-content.all, write:confluence-content\",\n      \"Add callback URL: http://localhost:3000/api/auth/confluence/callback\",\n    ],\n    link: \"https://developer.atlassian.com/console/myapps/\",\n    envVars: [\"ATLASSIAN_CLIENT_ID\", \"ATLASSIAN_CLIENT_SECRET\"],\n  },\n  bitbucket: {\n    title: \"Atlassian Bitbucket Setup\",\n    category: \"atlassian\",\n    steps: [\n      \"Go to Bitbucket Settings > OAuth consumers\",\n      \"Click Add consumer\",\n      \"Set callback URL: http://localhost:3000/api/auth/bitbucket/callback\",\n      \"Add permissions: repository:read, repository:write\",\n      \"Copy Key and Secret to .env\",\n    ],\n    link: \"https://bitbucket.org/account/settings/app-passwords/\",\n    envVars: [\"BITBUCKET_CLIENT_ID\", \"BITBUCKET_CLIENT_SECRET\"],\n  },\n\n  slack: {\n    title: \"Slack App Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Slack API Apps page\",\n      \"Click Create New App > From scratch\",\n      \"Go to OAuth & Permissions\",\n      \"Add scopes: channels:read, chat:write, users:read, channels:history\",\n      \"Add redirect URL: http://localhost:3000/api/auth/slack/callback\",\n      \"Install to Workspace\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://api.slack.com/apps\",\n    envVars: [\"SLACK_CLIENT_ID\", \"SLACK_CLIENT_SECRET\"],\n  },\n  discord: {\n    title: \"Discord App Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Discord Developer Portal\",\n      \"Click New Application\",\n      \"Go to OAuth2 section\",\n      \"Add redirect: http://localhost:3000/api/auth/discord/callback\",\n      \"Copy Client ID and Secret to .env\",\n      \"Add bot permissions as needed\",\n    ],\n    link: \"https://discord.com/developers/applications\",\n    envVars: [\"DISCORD_CLIENT_ID\", \"DISCORD_CLIENT_SECRET\"],\n  },\n  zoom: {\n    title: \"Zoom App Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Zoom App Marketplace\",\n      \"Click Develop > Build App\",\n      \"Choose OAuth app type\",\n      \"Add redirect URL: http://localhost:3000/api/auth/zoom/callback\",\n      \"Add scopes: meeting:read, meeting:write, user:read\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://marketplace.zoom.us/develop/create\",\n    envVars: [\"ZOOM_CLIENT_ID\", \"ZOOM_CLIENT_SECRET\"],\n  },\n  webex: {\n    title: \"Webex Integration Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Webex Developer Portal\",\n      \"Create a new integration\",\n      \"Add redirect URI: http://localhost:3000/api/auth/webex/callback\",\n      \"Select required scopes\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.webex.com/my-apps\",\n    envVars: [\"WEBEX_CLIENT_ID\", \"WEBEX_CLIENT_SECRET\"],\n  },\n  twilio: {\n    title: \"Twilio Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Twilio Console\",\n      \"Copy Account SID and Auth Token\",\n      \"Get a phone number for SMS\",\n      \"Add credentials to .env\",\n    ],\n    link: \"https://console.twilio.com/\",\n    envVars: [\"TWILIO_ACCOUNT_SID\", \"TWILIO_AUTH_TOKEN\", \"TWILIO_PHONE_NUMBER\"],\n  },\n\n  github: {\n    title: \"GitHub OAuth App Setup\",\n    category: \"development\",\n    steps: [\n      \"Go to GitHub Developer Settings\",\n      \"Click OAuth Apps > New OAuth App\",\n      \"Set Homepage URL: http://localhost:3000\",\n      \"Set callback URL: http://localhost:3000/api/auth/github/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://github.com/settings/developers\",\n    envVars: [\"GITHUB_CLIENT_ID\", \"GITHUB_CLIENT_SECRET\"],\n  },\n  gitlab: {\n    title: \"GitLab OAuth Setup\",\n    category: \"development\",\n    steps: [\n      \"Go to GitLab User Settings > Applications\",\n      \"Create new application\",\n      \"Add redirect URI: http://localhost:3000/api/auth/gitlab/callback\",\n      \"Select scopes: api, read_user, read_repository\",\n      \"Copy Application ID and Secret to .env\",\n    ],\n    link: \"https://gitlab.com/-/profile/applications\",\n    envVars: [\"GITLAB_CLIENT_ID\", \"GITLAB_CLIENT_SECRET\"],\n  },\n  sentry: {\n    title: \"Sentry Setup\",\n    category: \"development\",\n    steps: [\n      \"Go to Sentry Settings > Developer Settings\",\n      \"Create new integration\",\n      \"Add redirect URL: http://localhost:3000/api/auth/sentry/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://sentry.io/settings/developer-settings/\",\n    envVars: [\"SENTRY_CLIENT_ID\", \"SENTRY_CLIENT_SECRET\"],\n  },\n  posthog: {\n    title: \"PostHog Setup\",\n    category: \"development\",\n    steps: [\"Go to PostHog Project Settings\", \"Copy your Project API Key\", \"Add to .env file\"],\n    link: \"https://app.posthog.com/project/settings\",\n    envVars: [\"POSTHOG_API_KEY\", \"POSTHOG_HOST\"],\n  },\n  mixpanel: {\n    title: \"Mixpanel Setup\",\n    category: \"development\",\n    steps: [\n      \"Go to Mixpanel Project Settings\",\n      \"Copy your Project Token\",\n      \"For API access, create a Service Account\",\n      \"Add credentials to .env\",\n    ],\n    link: \"https://mixpanel.com/settings/project\",\n    envVars: [\"MIXPANEL_TOKEN\", \"MIXPANEL_API_SECRET\"],\n  },\n\n  notion: {\n    title: \"Notion Integration Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to Notion Integrations page\",\n      \"Click New integration\",\n      \"Name your integration and select workspace\",\n      \"Copy the Internal Integration Token\",\n      \"Share desired pages/databases with your integration\",\n      \"Add token to .env\",\n    ],\n    link: \"https://www.notion.so/my-integrations\",\n    envVars: [\"NOTION_API_KEY\"],\n  },\n  linear: {\n    title: \"Linear OAuth Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to Linear Settings > API\",\n      \"Create new OAuth application\",\n      \"Add redirect URI: http://localhost:3000/api/auth/linear/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://linear.app/settings/api\",\n    envVars: [\"LINEAR_CLIENT_ID\", \"LINEAR_CLIENT_SECRET\"],\n  },\n  asana: {\n    title: \"Asana OAuth Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to Asana Developer Console\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/asana/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://app.asana.com/0/developer-console\",\n    envVars: [\"ASANA_CLIENT_ID\", \"ASANA_CLIENT_SECRET\"],\n  },\n  trello: {\n    title: \"Trello Power-Up Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to Trello Power-Ups Admin\",\n      \"Create new Power-Up\",\n      \"Add redirect URI: http://localhost:3000/api/auth/trello/callback\",\n      \"Copy API Key and Secret to .env\",\n    ],\n    link: \"https://trello.com/power-ups/admin\",\n    envVars: [\"TRELLO_API_KEY\", \"TRELLO_API_SECRET\"],\n  },\n  monday: {\n    title: \"Monday.com App Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to monday.com Developers\",\n      \"Create new app\",\n      \"Add OAuth redirect: http://localhost:3000/api/auth/monday/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://monday.com/developers/apps\",\n    envVars: [\"MONDAY_CLIENT_ID\", \"MONDAY_CLIENT_SECRET\"],\n  },\n  clickup: {\n    title: \"ClickUp OAuth Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to ClickUp Settings > Apps\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/clickup/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://app.clickup.com/settings/apps\",\n    envVars: [\"CLICKUP_CLIENT_ID\", \"CLICKUP_CLIENT_SECRET\"],\n  },\n\n  dropbox: {\n    title: \"Dropbox App Setup\",\n    category: \"storage\",\n    steps: [\n      \"Go to Dropbox App Console\",\n      \"Create new app\",\n      \"Choose Scoped access and Full Dropbox\",\n      \"Add redirect URI: http://localhost:3000/api/auth/dropbox/callback\",\n      \"Copy App Key and Secret to .env\",\n    ],\n    link: \"https://www.dropbox.com/developers/apps\",\n    envVars: [\"DROPBOX_CLIENT_ID\", \"DROPBOX_CLIENT_SECRET\"],\n  },\n  box: {\n    title: \"Box App Setup\",\n    category: \"storage\",\n    steps: [\n      \"Go to Box Developer Console\",\n      \"Create new app with OAuth 2.0\",\n      \"Add redirect URI: http://localhost:3000/api/auth/box/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://app.box.com/developers/console\",\n    envVars: [\"BOX_CLIENT_ID\", \"BOX_CLIENT_SECRET\"],\n  },\n  airtable: {\n    title: \"Airtable OAuth Setup\",\n    category: \"storage\",\n    steps: [\n      \"Go to Airtable Developer Hub\",\n      \"Create new OAuth integration\",\n      \"Add redirect URI: http://localhost:3000/api/auth/airtable/callback\",\n      \"Select required scopes\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://airtable.com/create/oauth\",\n    envVars: [\"AIRTABLE_CLIENT_ID\", \"AIRTABLE_CLIENT_SECRET\"],\n  },\n\n  supabase: {\n    title: \"Supabase Setup\",\n    category: \"infrastructure\",\n    steps: [\n      \"Go to Supabase Dashboard\",\n      \"Create new project or select existing\",\n      \"Go to Settings > API\",\n      \"Copy Project URL and anon/service_role keys\",\n      \"Add to .env file\",\n    ],\n    link: \"https://supabase.com/dashboard\",\n    envVars: [\"SUPABASE_URL\", \"SUPABASE_ANON_KEY\", \"SUPABASE_SERVICE_ROLE_KEY\"],\n  },\n  neon: {\n    title: \"Neon Database Setup\",\n    category: \"infrastructure\",\n    steps: [\n      \"Go to Neon Console\",\n      \"Create new project\",\n      \"Copy connection string from Dashboard\",\n      \"Add to .env file\",\n    ],\n    link: \"https://console.neon.tech/\",\n    envVars: [\"DATABASE_URL\"],\n  },\n  snowflake: {\n    title: \"Snowflake Setup\",\n    category: \"infrastructure\",\n    steps: [\n      \"Go to Snowflake Console\",\n      \"Create a service account or use existing credentials\",\n      \"Note your account identifier, warehouse, database\",\n      \"Add credentials to .env\",\n    ],\n    link: \"https://app.snowflake.com/\",\n    envVars: [\"SNOWFLAKE_ACCOUNT\", \"SNOWFLAKE_USER\", \"SNOWFLAKE_PASSWORD\", \"SNOWFLAKE_WAREHOUSE\"],\n  },\n  aws: {\n    title: \"AWS Setup\",\n    category: \"infrastructure\",\n    steps: [\n      \"Go to AWS IAM Console\",\n      \"Create new IAM user with programmatic access\",\n      \"Attach required policies (S3, Lambda, DynamoDB)\",\n      \"Copy Access Key ID and Secret\",\n      \"Add to .env file\",\n    ],\n    link: \"https://console.aws.amazon.com/iam/\",\n    envVars: [\"AWS_ACCESS_KEY_ID\", \"AWS_SECRET_ACCESS_KEY\", \"AWS_REGION\"],\n  },\n\n  salesforce: {\n    title: \"Salesforce Connected App Setup\",\n    category: \"sales\",\n    steps: [\n      \"Go to Salesforce Setup > App Manager\",\n      \"Create new Connected App\",\n      \"Enable OAuth Settings\",\n      \"Add callback URL: http://localhost:3000/api/auth/salesforce/callback\",\n      \"Select OAuth scopes: api, refresh_token\",\n      \"Copy Consumer Key and Secret to .env\",\n    ],\n    link: \"https://login.salesforce.com/\",\n    envVars: [\"SALESFORCE_CLIENT_ID\", \"SALESFORCE_CLIENT_SECRET\"],\n  },\n  hubspot: {\n    title: \"HubSpot App Setup\",\n    category: \"sales\",\n    steps: [\n      \"Go to HubSpot Developer Portal\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/hubspot/callback\",\n      \"Select required scopes\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developers.hubspot.com/\",\n    envVars: [\"HUBSPOT_CLIENT_ID\", \"HUBSPOT_CLIENT_SECRET\"],\n  },\n  pipedrive: {\n    title: \"Pipedrive OAuth Setup\",\n    category: \"sales\",\n    steps: [\n      \"Go to Pipedrive Developer Hub\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/pipedrive/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developers.pipedrive.com/\",\n    envVars: [\"PIPEDRIVE_CLIENT_ID\", \"PIPEDRIVE_CLIENT_SECRET\"],\n  },\n\n  zendesk: {\n    title: \"Zendesk OAuth Setup\",\n    category: \"support\",\n    steps: [\n      \"Go to Zendesk Admin > API > OAuth Clients\",\n      \"Add new OAuth client\",\n      \"Set redirect URI: http://localhost:3000/api/auth/zendesk/callback\",\n      \"Copy Client ID and Secret to .env\",\n      \"Add your Zendesk subdomain\",\n    ],\n    link: \"https://support.zendesk.com/hc/en-us/articles/4408845965210\",\n    envVars: [\"ZENDESK_CLIENT_ID\", \"ZENDESK_CLIENT_SECRET\", \"ZENDESK_SUBDOMAIN\"],\n  },\n  intercom: {\n    title: \"Intercom OAuth Setup\",\n    category: \"support\",\n    steps: [\n      \"Go to Intercom Developer Hub\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/intercom/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developers.intercom.com/\",\n    envVars: [\"INTERCOM_CLIENT_ID\", \"INTERCOM_CLIENT_SECRET\"],\n  },\n  freshdesk: {\n    title: \"Freshdesk OAuth Setup\",\n    category: \"support\",\n    steps: [\n      \"Go to Freshdesk Admin > Apps > Custom Apps\",\n      \"Create new OAuth application\",\n      \"Add redirect URI: http://localhost:3000/api/auth/freshdesk/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developers.freshdesk.com/\",\n    envVars: [\"FRESHDESK_CLIENT_ID\", \"FRESHDESK_CLIENT_SECRET\", \"FRESHDESK_DOMAIN\"],\n  },\n  servicenow: {\n    title: \"ServiceNow OAuth Setup\",\n    category: \"support\",\n    steps: [\n      \"Go to ServiceNow System OAuth > Application Registry\",\n      \"Create OAuth API endpoint for external clients\",\n      \"Add redirect URL: http://localhost:3000/api/auth/servicenow/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://docs.servicenow.com/\",\n    envVars: [\"SERVICENOW_CLIENT_ID\", \"SERVICENOW_CLIENT_SECRET\", \"SERVICENOW_INSTANCE\"],\n  },\n\n  stripe: {\n    title: \"Stripe Setup\",\n    category: \"finance\",\n    steps: [\n      \"Go to Stripe Dashboard\",\n      \"Go to Developers > API keys\",\n      \"Copy Publishable and Secret keys\",\n      \"For Connect, set up OAuth in Connect settings\",\n      \"Add to .env file\",\n    ],\n    link: \"https://dashboard.stripe.com/apikeys\",\n    envVars: [\"STRIPE_SECRET_KEY\", \"STRIPE_PUBLISHABLE_KEY\"],\n  },\n  quickbooks: {\n    title: \"QuickBooks OAuth Setup\",\n    category: \"finance\",\n    steps: [\n      \"Go to Intuit Developer Portal\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/quickbooks/callback\",\n      \"Select Accounting scope\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.intuit.com/app/developer/dashboard\",\n    envVars: [\"QUICKBOOKS_CLIENT_ID\", \"QUICKBOOKS_CLIENT_SECRET\"],\n  },\n  xero: {\n    title: \"Xero OAuth Setup\",\n    category: \"finance\",\n    steps: [\n      \"Go to Xero Developer Portal\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/xero/callback\",\n      \"Select required scopes\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.xero.com/app/manage\",\n    envVars: [\"XERO_CLIENT_ID\", \"XERO_CLIENT_SECRET\"],\n  },\n\n  mailchimp: {\n    title: \"Mailchimp OAuth Setup\",\n    category: \"marketing\",\n    steps: [\n      \"Go to Mailchimp Developer Portal\",\n      \"Register new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/mailchimp/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://admin.mailchimp.com/account/oauth2/\",\n    envVars: [\"MAILCHIMP_CLIENT_ID\", \"MAILCHIMP_CLIENT_SECRET\"],\n  },\n  shopify: {\n    title: \"Shopify App Setup\",\n    category: \"marketing\",\n    steps: [\n      \"Go to Shopify Partners Dashboard\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/shopify/callback\",\n      \"Copy API Key and Secret to .env\",\n    ],\n    link: \"https://partners.shopify.com/\",\n    envVars: [\"SHOPIFY_API_KEY\", \"SHOPIFY_API_SECRET\"],\n  },\n  twitter: {\n    title: \"Twitter/X OAuth Setup\",\n    category: \"marketing\",\n    steps: [\n      \"Go to Twitter Developer Portal\",\n      \"Create new project and app\",\n      \"Enable OAuth 2.0\",\n      \"Add redirect URI: http://localhost:3000/api/auth/twitter/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.twitter.com/en/portal/dashboard\",\n    envVars: [\"TWITTER_CLIENT_ID\", \"TWITTER_CLIENT_SECRET\"],\n  },\n\n  figma: {\n    title: \"Figma OAuth Setup\",\n    category: \"design\",\n    steps: [\n      \"Go to Figma Developer Settings\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/figma/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://www.figma.com/developers/apps\",\n    envVars: [\"FIGMA_CLIENT_ID\", \"FIGMA_CLIENT_SECRET\"],\n  },\n\n  anthropic: {\n    title: \"Anthropic API Setup\",\n    category: \"ai\",\n    steps: [\"Go to Anthropic Console\", \"Create new API key\", \"Copy API key to .env\"],\n    link: \"https://console.anthropic.com/\",\n    envVars: [\"ANTHROPIC_API_KEY\"],\n  },\n};\n\nexport default function SetupPage(): React.JSX.Element {\n  const [integrations, setIntegrations] = useState<Integration[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [expandedGuide, setExpandedGuide] = useState<string | null>(null);\n  const [envChecked, setEnvChecked] = useState(false);\n  const [searchQuery, setSearchQuery] = useState(\"\");\n  const [selectedCategory, setSelectedCategory] = useState<string | null>(null);\n  const [tokenStorage, setTokenStorage] = useState<TokenStorageStatus | null>(null);\n\n  useEffect(() => {\n    void fetchStatus();\n    void fetchTokenStorage();\n  }, []);\n\n  async function fetchStatus(): Promise<void> {\n    try {\n      const res = await fetch(\"/api/integrations/status\");\n      if (!res.ok) {\n        console.error(\"Failed to fetch integration status:\", res.status);\n        setIntegrations([]);\n        return;\n      }\n\n      const data = await res.json();\n      setIntegrations(data.integrations ?? []);\n    } catch (error) {\n      console.error(\"Failed to fetch integration status:\", error);\n      setIntegrations([]);\n    } finally {\n      setLoading(false);\n    }\n  }\n\n  async function fetchTokenStorage(): Promise<void> {\n    const fallback: TokenStorageStatus = { mode: \"memory\", encrypted: false };\n\n    try {\n      const res = await fetch(\"/api/integrations/token-storage\");\n      if (!res.ok) {\n        setTokenStorage(fallback);\n        return;\n      }\n      const data = await res.json();\n      setTokenStorage(data);\n    } catch {\n      setTokenStorage(fallback);\n    }\n  }\n\n  const filteredIntegrations = useMemo(() => {\n    const query = searchQuery.toLowerCase();\n\n    return integrations.filter((integration) => {\n      const guide = OAUTH_SETUP_GUIDES[integration.id];\n\n      const matchesSearch =\n        query === \"\" ||\n        integration.name.toLowerCase().includes(query) ||\n        integration.id.toLowerCase().includes(query);\n\n      const matchesCategory = selectedCategory === null || guide?.category === selectedCategory;\n\n      return matchesSearch && matchesCategory;\n    });\n  }, [integrations, searchQuery, selectedCategory]);\n\n  const groupedIntegrations = useMemo(() => {\n    const groups: Record<string, Integration[]> = {};\n\n    for (const integration of filteredIntegrations) {\n      const category = OAUTH_SETUP_GUIDES[integration.id]?.category ?? \"other\";\n      (groups[category] ??= []).push(integration);\n    }\n\n    return groups;\n  }, [filteredIntegrations]);\n\n  const connectedCount = integrations.filter((i) => i.connected).length;\n  const totalCount = integrations.length;\n  const progress = totalCount > 0 ? (connectedCount / totalCount) * 100 : 0;\n\n  const allConnected = connectedCount === totalCount && totalCount > 0;\n\n  const setupSteps: SetupStep[] = [\n    {\n      id: \"env\",\n      title: \"Configure Environment Variables\",\n      description: \"Add your OAuth credentials to the .env file\",\n      completed: envChecked,\n      action: () => setEnvChecked(true),\n    },\n    {\n      id: \"oauth\",\n      title: \"Create OAuth Apps\",\n      description: \"Set up OAuth applications for each service\",\n      completed: false,\n    },\n    {\n      id: \"connect\",\n      title: \"Connect Services\",\n      description: \"Authorize your app to access each service\",\n      completed: allConnected,\n    },\n  ];\n\n  const tokenStorageStyles = useMemo(() => {\n    if (!tokenStorage) return null;\n\n    const isMemory = tokenStorage.mode === \"memory\";\n\n    return {\n      container: `rounded-2xl p-6 shadow-sm border mb-8 ${\n        isMemory\n          ? \"bg-amber-50 dark:bg-amber-900/20 border-amber-200 dark:border-amber-800\"\n          : \"bg-green-50 dark:bg-green-900/20 border-green-200 dark:border-green-800\"\n      }`,\n      iconWrapper: `w-10 h-10 rounded-full flex items-center justify-center ${\n        isMemory ? \"bg-amber-100 dark:bg-amber-900\" : \"bg-green-100 dark:bg-green-900\"\n      }`,\n      title: `font-semibold ${\n        isMemory ? \"text-amber-800 dark:text-amber-200\" : \"text-green-800 dark:text-green-200\"\n      }`,\n      text: `text-sm mt-1 ${\n        isMemory ? \"text-amber-700 dark:text-amber-300\" : \"text-green-700 dark:text-green-300\"\n      }`,\n      isMemory,\n    };\n  }, [tokenStorage]);\n\n  return (\n    <div className=\"min-h-screen bg-neutral-50 dark:bg-neutral-900\">\n      <div className=\"max-w-4xl mx-auto px-4 py-12\">\n        <div className=\"text-center mb-12\">\n          <h1 className=\"text-4xl font-bold text-neutral-900 dark:text-white mb-4\">\n            Setup Your AI Agent\n          </h1>\n          <p className=\"text-lg text-neutral-600 dark:text-neutral-400\">\n            Connect your services to enable AI-powered automation\n          </p>\n        </div>\n\n        <div className=\"bg-white dark:bg-neutral-800 rounded-2xl p-6 shadow-sm border border-neutral-200 dark:border-neutral-700 mb-8\">\n          <div className=\"flex items-center justify-between mb-2\">\n            <span className=\"text-sm font-medium text-neutral-600 dark:text-neutral-400\">\n              Setup Progress\n            </span>\n            <span className=\"text-sm font-medium text-neutral-900 dark:text-white\">\n              {connectedCount} / {totalCount} services connected\n            </span>\n          </div>\n          <div className=\"w-full bg-neutral-200 dark:bg-neutral-700 rounded-full h-3\">\n            <div\n              className=\"bg-gradient-to-r from-green-500 to-emerald-500 h-3 rounded-full transition-all duration-500\"\n              style={{ width: `${progress}%` }}\n            />\n          </div>\n        </div>\n\n        {tokenStorage && tokenStorageStyles && (\n          <div className={tokenStorageStyles.container}>\n            <div className=\"flex items-start gap-4\">\n              <div className={tokenStorageStyles.iconWrapper}>\n                {tokenStorageStyles.isMemory ? (\n                  <svg\n                    className=\"w-5 h-5 text-amber-600 dark:text-amber-400\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    viewBox=\"0 0 24 24\"\n                  >\n                    <path\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      strokeWidth={2}\n                      d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n                    />\n                  </svg>\n                ) : (\n                  <svg\n                    className=\"w-5 h-5 text-green-600 dark:text-green-400\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    viewBox=\"0 0 24 24\"\n                  >\n                    <path\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      strokeWidth={2}\n                      d=\"M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z\"\n                    />\n                  </svg>\n                )}\n              </div>\n\n              <div className=\"flex-1\">\n                <h3 className={tokenStorageStyles.title}>\n                  Token Storage:{\" \"}\n                  {tokenStorageStyles.isMemory\n                    ? \"Development Mode\"\n                    : `${tokenStorage.mode.charAt(0).toUpperCase()}${tokenStorage.mode.slice(\n                        1,\n                      )} Storage`}\n                </h3>\n\n                <p className={tokenStorageStyles.text}>\n                  {tokenStorageStyles.isMemory ? (\n                    <>Tokens are stored in memory and will be lost on restart.</>\n                  ) : (\n                    <>Tokens are persisted to {tokenStorage.mode} storage.</>\n                  )}\n                </p>\n\n                <div className=\"mt-2 flex items-center gap-1.5 text-sm text-green-600 dark:text-green-400\">\n                  <svg className=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n                    <path\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      strokeWidth={2}\n                      d=\"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z\"\n                    />\n                  </svg>\n                  <span>Encryption enabled {tokenStorage.autoGenerated && \"(auto-generated key)\"}</span>\n                </div>\n\n                {tokenStorageStyles.isMemory && (\n                  <div className=\"mt-4 pt-4 border-t border-amber-200 dark:border-amber-800\">\n                    <p className=\"text-sm font-medium text-amber-800 dark:text-amber-200 mb-3\">\n                      For production, add one of these to your{\" \"}\n                      <code className=\"px-1 py-0.5 bg-amber-100 dark:bg-amber-900 rounded text-xs\">\n                        .env\n                      </code>\n                      :\n                    </p>\n                    <div className=\"grid gap-2\">\n                      <a\n                        href=\"https://upstash.com/docs/redis/overall/getstarted\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-green-200 dark:border-green-700 hover:border-green-400 dark:hover:border-green-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">\n                            Upstash\n                          </span>\n                          <span className=\"text-green-600 dark:text-green-400 text-xs ml-2 font-medium\">\n                            Recommended\n                          </span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Serverless Redis, scales horizontally\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          REDIS_URL\n                        </code>\n                      </a>\n\n                      <a\n                        href=\"https://docs.turso.tech/quickstart\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-amber-200 dark:border-amber-700 hover:border-amber-400 dark:hover:border-amber-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">\n                            Turso / libSQL\n                          </span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Edge SQLite, fast reads globally\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          DATABASE_URL\n                        </code>\n                      </a>\n\n                      <a\n                        href=\"https://vercel.com/docs/storage/vercel-kv/quickstart\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-amber-200 dark:border-amber-700 hover:border-amber-400 dark:hover:border-amber-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">\n                            Vercel KV\n                          </span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Built-in if using Vercel\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          KV_REST_API_URL\n                        </code>\n                      </a>\n\n                      <a\n                        href=\"https://neon.tech/docs/get-started-with-neon/connect-neon\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-amber-200 dark:border-amber-700 hover:border-amber-400 dark:hover:border-amber-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">Neon</span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Serverless Postgres\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          DATABASE_URL\n                        </code>\n                      </a>\n\n                      <a\n                        href=\"https://www.sqlite.org/index.html\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-amber-200 dark:border-amber-700 hover:border-amber-400 dark:hover:border-amber-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">\n                            SQLite\n                          </span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Local file, single instance only\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          DATABASE_URL=file:./data.db\n                        </code>\n                      </a>\n                    </div>\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n        )}\n\n        <div className=\"bg-white dark:bg-neutral-800 rounded-2xl shadow-sm border border-neutral-200 dark:border-neutral-700 mb-8 overflow-hidden\">\n          <div className=\"p-6 border-b border-neutral-200 dark:border-neutral-700\">\n            <h2 className=\"text-xl font-semibold text-neutral-900 dark:text-white\">\n              Quick Start Guide\n            </h2>\n          </div>\n          <div className=\"divide-y divide-neutral-200 dark:divide-neutral-700\">\n            {setupSteps.map((step, index) => (\n              <div key={step.id} className=\"p-6 flex items-start gap-4\">\n                <div\n                  className={`w-8 h-8 rounded-full flex items-center justify-center flex-shrink-0 ${\n                    step.completed\n                      ? \"bg-green-500 text-white\"\n                      : \"bg-neutral-200 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-400\"\n                  }`}\n                >\n                  {step.completed ? (\n                    <svg className=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n                      <path\n                        strokeLinecap=\"round\"\n                        strokeLinejoin=\"round\"\n                        strokeWidth={2}\n                        d=\"M5 13l4 4L19 7\"\n                      />\n                    </svg>\n                  ) : (\n                    <span className=\"font-semibold\">{index + 1}</span>\n                  )}\n                </div>\n                <div className=\"flex-1\">\n                  <h3 className=\"font-semibold text-neutral-900 dark:text-white\">{step.title}</h3>\n                  <p className=\"text-sm text-neutral-600 dark:text-neutral-400 mt-1\">\n                    {step.description}\n                  </p>\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n\n        <div className=\"bg-white dark:bg-neutral-800 rounded-2xl shadow-sm border border-neutral-200 dark:border-neutral-700 overflow-hidden\">\n          <div className=\"p-6 border-b border-neutral-200 dark:border-neutral-700\">\n            <h2 className=\"text-xl font-semibold text-neutral-900 dark:text-white\">\n              Service Connections\n            </h2>\n            <p className=\"text-sm text-neutral-600 dark:text-neutral-400 mt-1\">\n              Click on a service to see setup instructions or connect\n            </p>\n\n            <div className=\"mt-4\">\n              <input\n                type=\"text\"\n                placeholder=\"Search services...\"\n                value={searchQuery}\n                onChange={(e) => setSearchQuery(e.target.value)}\n                className=\"w-full px-4 py-2 bg-neutral-100 dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-700 rounded-xl text-neutral-900 dark:text-white placeholder-neutral-500 focus:outline-none focus:ring-2 focus:ring-blue-500\"\n              />\n            </div>\n\n            <div className=\"mt-4 flex flex-wrap gap-2\">\n              <button\n                type=\"button\"\n                onClick={() => setSelectedCategory(null)}\n                className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors ${\n                  selectedCategory === null\n                    ? \"bg-neutral-900 dark:bg-white text-white dark:text-neutral-900\"\n                    : \"bg-neutral-100 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300 hover:bg-neutral-200 dark:hover:bg-neutral-600\"\n                }`}\n              >\n                All\n              </button>\n\n              {CATEGORIES.map((category) => (\n                <button\n                  key={category.id}\n                  type=\"button\"\n                  onClick={() =>\n                    setSelectedCategory(selectedCategory === category.id ? null : category.id)\n                  }\n                  className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors ${\n                    selectedCategory === category.id\n                      ? \"bg-neutral-900 dark:bg-white text-white dark:text-neutral-900\"\n                      : \"bg-neutral-100 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300 hover:bg-neutral-200 dark:hover:bg-neutral-600\"\n                  }`}\n                >\n                  {category.name}\n                </button>\n              ))}\n            </div>\n          </div>\n\n          {loading ? (\n            <div className=\"p-12 text-center text-neutral-500\">Loading...</div>\n          ) : filteredIntegrations.length === 0 ? (\n            <div className=\"p-12 text-center text-neutral-500\">\n              No services found matching your search\n            </div>\n          ) : (\n            <div>\n              {CATEGORIES.filter((cat) => groupedIntegrations[cat.id]?.length > 0).map(\n                (category) => (\n                  <div key={category.id}>\n                    <div className=\"px-6 py-3 bg-neutral-50 dark:bg-neutral-900 border-b border-neutral-200 dark:border-neutral-700\">\n                      <h3 className=\"text-sm font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider\">\n                        {category.name}\n                      </h3>\n                    </div>\n\n                    <div className=\"divide-y divide-neutral-200 dark:divide-neutral-700\">\n                      {groupedIntegrations[category.id]?.map((integration) => {\n                        const guide = OAUTH_SETUP_GUIDES[integration.id];\n                        const isExpanded = expandedGuide === integration.id;\n\n                        return (\n                          <div key={integration.id}>\n                            <div className=\"p-6 flex items-center justify-between\">\n                              <div className=\"flex items-center gap-4\">\n                                <div className=\"w-12 h-12 bg-neutral-100 dark:bg-neutral-700 rounded-xl flex items-center justify-center\">\n                                  <ServiceIcon name={integration.icon} />\n                                </div>\n                                <div>\n                                  <h3 className=\"font-semibold text-neutral-900 dark:text-white\">\n                                    {integration.name}\n                                  </h3>\n                                  <p\n                                    className={`text-sm ${\n                                      integration.connected\n                                        ? \"text-green-600 dark:text-green-400\"\n                                        : \"text-neutral-500\"\n                                    }`}\n                                  >\n                                    {integration.connected ? \"Connected\" : \"Not connected\"}\n                                  </p>\n                                </div>\n                              </div>\n\n                              <div className=\"flex items-center gap-3\">\n                                {guide && (\n                                  <button\n                                    type=\"button\"\n                                    onClick={() =>\n                                      setExpandedGuide(isExpanded ? null : integration.id)\n                                    }\n                                    className=\"px-4 py-2 text-sm font-medium text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white\"\n                                  >\n                                    {isExpanded ? \"Hide Guide\" : \"Setup Guide\"}\n                                  </button>\n                                )}\n\n                                {integration.connected ? (\n                                  <span className=\"inline-flex items-center gap-1.5 px-4 py-2 bg-green-50 dark:bg-green-900/20 text-green-700 dark:text-green-400 rounded-xl text-sm font-medium\">\n                                    <span className=\"w-2 h-2 bg-green-500 rounded-full\" />\n                                    Connected\n                                  </span>\n                                ) : (\n                                  <a\n                                    href={integration.connectUrl}\n                                    className=\"px-4 py-2 bg-neutral-900 dark:bg-white text-white dark:text-neutral-900 rounded-xl text-sm font-medium hover:opacity-90 transition-opacity\"\n                                  >\n                                    Connect\n                                  </a>\n                                )}\n                              </div>\n                            </div>\n\n                            {isExpanded && guide && (\n                              <div className=\"px-6 pb-6\">\n                                <div className=\"bg-neutral-50 dark:bg-neutral-900 rounded-xl p-6 border border-neutral-200 dark:border-neutral-700\">\n                                  <h4 className=\"font-semibold text-neutral-900 dark:text-white mb-4\">\n                                    {guide.title}\n                                  </h4>\n\n                                  <ol className=\"space-y-3 mb-6\">\n                                    {guide.steps.map((step, i) => (\n                                      <li key={i} className=\"flex items-start gap-3\">\n                                        <span className=\"w-6 h-6 bg-neutral-200 dark:bg-neutral-700 rounded-full flex items-center justify-center text-sm font-medium text-neutral-600 dark:text-neutral-400 flex-shrink-0\">\n                                          {i + 1}\n                                        </span>\n                                        <span className=\"text-neutral-700 dark:text-neutral-300\">\n                                          {step}\n                                        </span>\n                                      </li>\n                                    ))}\n                                  </ol>\n\n                                  <div className=\"mb-4 p-4 bg-neutral-100 dark:bg-neutral-800 rounded-lg\">\n                                    <h5 className=\"text-sm font-semibold text-neutral-700 dark:text-neutral-300 mb-2\">\n                                      Required Environment Variables:\n                                    </h5>\n                                    <pre className=\"text-sm text-neutral-600 dark:text-neutral-400 font-mono whitespace-pre-wrap\">\n                                      {guide.envVars.map((v) => `${v}=your_value`).join(\"\\n\")}\n                                    </pre>\n                                  </div>\n\n                                  <a\n                                    href={guide.link}\n                                    target=\"_blank\"\n                                    rel=\"noopener noreferrer\"\n                                    className=\"inline-flex items-center gap-2 text-blue-600 dark:text-blue-400 text-sm font-medium hover:underline\"\n                                  >\n                                    Open Developer Console\n                                    <svg\n                                      className=\"w-4 h-4\"\n                                      fill=\"none\"\n                                      stroke=\"currentColor\"\n                                      viewBox=\"0 0 24 24\"\n                                    >\n                                      <path\n                                        strokeLinecap=\"round\"\n                                        strokeLinejoin=\"round\"\n                                        strokeWidth={2}\n                                        d=\"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14\"\n                                      />\n                                    </svg>\n                                  </a>\n                                </div>\n                              </div>\n                            )}\n                          </div>\n                        );\n                      })}\n                    </div>\n                  </div>\n                ),\n              )}\n            </div>\n          )}\n        </div>\n\n        {allConnected && (\n          <div className=\"mt-8 bg-gradient-to-r from-green-50 to-emerald-50 dark:from-green-900/20 dark:to-emerald-900/20 rounded-2xl p-6 border border-green-200 dark:border-green-800 text-center\">\n            <div className=\"text-4xl mb-4\">🎉</div>\n            <h3 className=\"text-xl font-semibold text-green-800 dark:text-green-200 mb-2\">\n              All Services Connected!\n            </h3>\n            <p className=\"text-green-700 dark:text-green-300 mb-4\">\n              Your AI agent is ready to use. Start chatting to automate your workflows.\n            </p>\n            <a\n              href=\"/\"\n              className=\"inline-flex items-center gap-2 px-6 py-3 bg-green-600 text-white rounded-xl font-medium hover:bg-green-700 transition-colors\"\n            >\n              Start Using Your Agent\n              <svg className=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  strokeWidth={2}\n                  d=\"M13 7l5 5m0 0l-5 5m5-5H6\"\n                />\n              </svg>\n            </a>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\nfunction ServiceIcon({ name }: { name: string }): React.JSX.Element {\n  const iconMap: Record<string, React.JSX.Element> = {\n    mail: (\n      <svg className=\"w-6 h-6 text-red-500\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n        <path\n          d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          fill=\"none\"\n        />\n      </svg>\n    ),\n    slack: (\n      <svg className=\"w-6 h-6\" viewBox=\"0 0 24 24\" fill=\"none\">\n        <path\n          d=\"M5.042 15.165a2.528 2.528 0 0 1-2.52 2.523A2.528 2.528 0 0 1 0 15.165a2.527 2.527 0 0 1 2.522-2.52h2.52v2.52zM6.313 15.165a2.527 2.527 0 0 1 2.521-2.52 2.527 2.527 0 0 1 2.521 2.52v6.313A2.528 2.528 0 0 1 8.834 24a2.528 2.528 0 0 1-2.521-2.522v-6.313z\"\n          fill=\"#E01E5A\"\n        />\n        <path\n          d=\"M8.834 5.042a2.528 2.528 0 0 1-2.521-2.52A2.528 2.528 0 0 1 8.834 0a2.528 2.528 0 0 1 2.521 2.522v2.52H8.834zM8.834 6.313a2.528 2.528 0 0 1 2.521 2.521 2.528 2.528 0 0 1-2.521 2.521H2.522A2.528 2.528 0 0 1 0 8.834a2.528 2.528 0 0 1 2.522-2.521h6.312z\"\n          fill=\"#36C5F0\"\n        />\n        <path\n          d=\"M18.956 8.834a2.528 2.528 0 0 1 2.522-2.521A2.528 2.528 0 0 1 24 8.834a2.528 2.528 0 0 1-2.522 2.521h-2.522V8.834zM17.688 8.834a2.528 2.528 0 0 1-2.523 2.521 2.527 2.527 0 0 1-2.52-2.521V2.522A2.527 2.527 0 0 1 15.165 0a2.528 2.528 0 0 1 2.523 2.522v6.312z\"\n          fill=\"#2EB67D\"\n        />\n        <path\n          d=\"M15.165 18.956a2.528 2.528 0 0 1 2.523 2.522A2.528 2.528 0 0 1 15.165 24a2.527 2.527 0 0 1-2.52-2.522v-2.522h2.52zM15.165 17.688a2.527 2.527 0 0 1-2.52-2.523 2.526 2.526 0 0 1 2.52-2.52h6.313A2.527 2.527 0 0 1 24 15.165a2.528 2.528 0 0 1-2.522 2.523h-6.313z\"\n          fill=\"#ECB22E\"\n        />\n      </svg>\n    ),\n    calendar: (\n      <svg\n        className=\"w-6 h-6 text-blue-500\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n      >\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\"\n        />\n      </svg>\n    ),\n    github: (\n      <svg className=\"w-6 h-6\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n        <path\n          fillRule=\"evenodd\"\n          d=\"M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z\"\n          clipRule=\"evenodd\"\n        />\n      </svg>\n    ),\n    jira: (\n      <svg className=\"w-6 h-6\" viewBox=\"0 0 24 24\">\n        <defs>\n          <linearGradient id=\"jira-gradient\" x1=\"98.031%\" x2=\"58.888%\" y1=\".161%\" y2=\"40.766%\">\n            <stop offset=\"0%\" stopColor=\"#0052CC\" />\n            <stop offset=\"100%\" stopColor=\"#2684FF\" />\n          </linearGradient>\n        </defs>\n        <path\n          fill=\"url(#jira-gradient)\"\n          d=\"M11.571 11.513H0a5.218 5.218 0 005.232 5.215h2.13v2.057A5.215 5.215 0 0012.575 24V12.518a1.005 1.005 0 00-1.005-1.005z\"\n        />\n        <path\n          fill=\"#2684FF\"\n          d=\"M17.151 5.97H5.58a5.215 5.215 0 005.215 5.214h2.129v2.058a5.218 5.218 0 005.232 5.215V6.975a1.005 1.005 0 00-1.005-1.005z\"\n        />\n        <path\n          fill=\"#2684FF\"\n          d=\"M22.723.426H11.152a5.215 5.215 0 005.215 5.215h2.129v2.057a5.218 5.218 0 005.232 5.215V1.431a1.005 1.005 0 00-1.005-1.005z\"\n        />\n      </svg>\n    ),\n    notion: (\n      <svg className=\"w-6 h-6\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n        <path d=\"M4.459 4.208c.746.606 1.026.56 2.428.466l13.215-.793c.28 0 .047-.28-.046-.326L17.86 1.968c-.42-.326-.98-.7-2.055-.607L3.01 2.295c-.466.046-.56.28-.374.466l1.823 1.447zm.793 3.08v13.904c0 .747.373 1.027 1.214.98l14.523-.84c.84-.046.933-.56.933-1.167V6.354c0-.606-.233-.933-.746-.886l-15.177.887c-.56.046-.747.326-.747.933zm14.337.745c.093.42 0 .84-.42.888l-.7.14v10.264c-.608.327-1.168.514-1.635.514-.746 0-.933-.234-1.495-.933l-4.577-7.186v6.952L12.21 19s0 .84-1.168.84l-3.222.186c-.093-.186 0-.653.327-.746l.84-.233V9.854L7.822 9.76c-.094-.42.14-1.026.793-1.073l3.456-.233 4.764 7.279v-6.44l-1.215-.14c-.093-.514.28-.886.747-.933l3.222-.186zM1.936 1.035l13.31-.98c1.634-.14 2.055-.047 3.082.7l4.249 2.986c.7.513.933.653.933 1.213v16.378c0 1.026-.373 1.634-1.68 1.726l-15.458.934c-.98.047-1.448-.093-1.962-.747l-3.129-4.06c-.56-.747-.793-1.306-.793-1.96V2.667c0-.839.374-1.54 1.448-1.632z\" />\n      </svg>\n    ),\n    default: (\n      <svg\n        className=\"w-6 h-6 text-neutral-400\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n      >\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M13 10V3L4 14h7v7l9-11h-7z\"\n        />\n      </svg>\n    ),\n  };\n\n  return iconMap[name] ?? iconMap.default;\n}\n",
+                "app/setup/page.tsx": "\"use client\";\n\nimport { useEffect, useMemo, useState } from \"react\";\nimport {\n  buildSetupSteps,\n  CATEGORIES,\n  filterIntegrations,\n  getTokenStorageStyles,\n  groupIntegrationsByCategory,\n  type Integration,\n  OAUTH_SETUP_GUIDES,\n  ServiceIcon,\n  type TokenStorageStatus,\n} from \"./page-helpers\";\n\nexport default function SetupPage(): React.JSX.Element {\n  const [integrations, setIntegrations] = useState<Integration[]>([]);\n  const [loading, setLoading] = useState(true);\n  const [expandedGuide, setExpandedGuide] = useState<string | null>(null);\n  const [envChecked, setEnvChecked] = useState(false);\n  const [searchQuery, setSearchQuery] = useState(\"\");\n  const [selectedCategory, setSelectedCategory] = useState<string | null>(null);\n  const [tokenStorage, setTokenStorage] = useState<TokenStorageStatus | null>(null);\n\n  useEffect(() => {\n    void fetchStatus();\n    void fetchTokenStorage();\n  }, []);\n\n  async function fetchStatus(): Promise<void> {\n    try {\n      const res = await fetch(\"/api/integrations/status\");\n      if (!res.ok) {\n        console.error(\"Failed to fetch integration status:\", res.status);\n        setIntegrations([]);\n        return;\n      }\n\n      const data = await res.json();\n      setIntegrations(data.integrations ?? []);\n    } catch (error) {\n      console.error(\"Failed to fetch integration status:\", error);\n      setIntegrations([]);\n    } finally {\n      setLoading(false);\n    }\n  }\n\n  async function fetchTokenStorage(): Promise<void> {\n    const fallback: TokenStorageStatus = { mode: \"memory\", encrypted: false };\n\n    try {\n      const res = await fetch(\"/api/integrations/token-storage\");\n      if (!res.ok) {\n        setTokenStorage(fallback);\n        return;\n      }\n      const data = await res.json();\n      setTokenStorage(data);\n    } catch {\n      setTokenStorage(fallback);\n    }\n  }\n\n  const filteredIntegrations = useMemo(\n    () => filterIntegrations(integrations, searchQuery, selectedCategory),\n    [integrations, searchQuery, selectedCategory],\n  );\n\n  const groupedIntegrations = useMemo(\n    () => groupIntegrationsByCategory(filteredIntegrations),\n    [filteredIntegrations],\n  );\n\n  const connectedCount = integrations.filter((i) => i.connected).length;\n  const totalCount = integrations.length;\n  const progress = totalCount > 0 ? (connectedCount / totalCount) * 100 : 0;\n\n  const allConnected = connectedCount === totalCount && totalCount > 0;\n\n  const setupSteps = useMemo(\n    () => buildSetupSteps(envChecked, allConnected, () => setEnvChecked(true)),\n    [allConnected, envChecked],\n  );\n\n  const tokenStorageStyles = useMemo(() => getTokenStorageStyles(tokenStorage), [tokenStorage]);\n\n  return (\n    <div className=\"min-h-screen bg-neutral-50 dark:bg-neutral-900\">\n      <div className=\"max-w-4xl mx-auto px-4 py-12\">\n        <div className=\"text-center mb-12\">\n          <h1 className=\"text-4xl font-bold text-neutral-900 dark:text-white mb-4\">\n            Setup Your AI Agent\n          </h1>\n          <p className=\"text-lg text-neutral-600 dark:text-neutral-400\">\n            Connect your services to enable AI-powered automation\n          </p>\n        </div>\n\n        <div className=\"bg-white dark:bg-neutral-800 rounded-2xl p-6 shadow-sm border border-neutral-200 dark:border-neutral-700 mb-8\">\n          <div className=\"flex items-center justify-between mb-2\">\n            <span className=\"text-sm font-medium text-neutral-600 dark:text-neutral-400\">\n              Setup Progress\n            </span>\n            <span className=\"text-sm font-medium text-neutral-900 dark:text-white\">\n              {connectedCount} / {totalCount} services connected\n            </span>\n          </div>\n          <div className=\"w-full bg-neutral-200 dark:bg-neutral-700 rounded-full h-3\">\n            <div\n              className=\"bg-gradient-to-r from-green-500 to-emerald-500 h-3 rounded-full transition-all duration-500\"\n              style={{ width: `${progress}%` }}\n            />\n          </div>\n        </div>\n\n        {tokenStorage && tokenStorageStyles && (\n          <div className={tokenStorageStyles.container}>\n            <div className=\"flex items-start gap-4\">\n              <div className={tokenStorageStyles.iconWrapper}>\n                {tokenStorageStyles.isMemory ? (\n                  <svg\n                    className=\"w-5 h-5 text-amber-600 dark:text-amber-400\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    viewBox=\"0 0 24 24\"\n                  >\n                    <path\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      strokeWidth={2}\n                      d=\"M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z\"\n                    />\n                  </svg>\n                ) : (\n                  <svg\n                    className=\"w-5 h-5 text-green-600 dark:text-green-400\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    viewBox=\"0 0 24 24\"\n                  >\n                    <path\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      strokeWidth={2}\n                      d=\"M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z\"\n                    />\n                  </svg>\n                )}\n              </div>\n\n              <div className=\"flex-1\">\n                <h3 className={tokenStorageStyles.title}>\n                  Token Storage:{\" \"}\n                  {tokenStorageStyles.isMemory\n                    ? \"Development Mode\"\n                    : `${tokenStorage.mode.charAt(0).toUpperCase()}${tokenStorage.mode.slice(\n                        1,\n                      )} Storage`}\n                </h3>\n\n                <p className={tokenStorageStyles.text}>\n                  {tokenStorageStyles.isMemory ? (\n                    <>Tokens are stored in memory and will be lost on restart.</>\n                  ) : (\n                    <>Tokens are persisted to {tokenStorage.mode} storage.</>\n                  )}\n                </p>\n\n                <div className=\"mt-2 flex items-center gap-1.5 text-sm text-green-600 dark:text-green-400\">\n                  <svg className=\"w-4 h-4\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n                    <path\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      strokeWidth={2}\n                      d=\"M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z\"\n                    />\n                  </svg>\n                  <span>Encryption enabled {tokenStorage.autoGenerated && \"(auto-generated key)\"}</span>\n                </div>\n\n                {tokenStorageStyles.isMemory && (\n                  <div className=\"mt-4 pt-4 border-t border-amber-200 dark:border-amber-800\">\n                    <p className=\"text-sm font-medium text-amber-800 dark:text-amber-200 mb-3\">\n                      For production, add one of these to your{\" \"}\n                      <code className=\"px-1 py-0.5 bg-amber-100 dark:bg-amber-900 rounded text-xs\">\n                        .env\n                      </code>\n                      :\n                    </p>\n                    <div className=\"grid gap-2\">\n                      <a\n                        href=\"https://upstash.com/docs/redis/overall/getstarted\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-green-200 dark:border-green-700 hover:border-green-400 dark:hover:border-green-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">\n                            Upstash\n                          </span>\n                          <span className=\"text-green-600 dark:text-green-400 text-xs ml-2 font-medium\">\n                            Recommended\n                          </span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Serverless Redis, scales horizontally\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          REDIS_URL\n                        </code>\n                      </a>\n\n                      <a\n                        href=\"https://docs.turso.tech/quickstart\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-amber-200 dark:border-amber-700 hover:border-amber-400 dark:hover:border-amber-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">\n                            Turso / libSQL\n                          </span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Edge SQLite, fast reads globally\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          DATABASE_URL\n                        </code>\n                      </a>\n\n                      <a\n                        href=\"https://vercel.com/docs/storage/vercel-kv/quickstart\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-amber-200 dark:border-amber-700 hover:border-amber-400 dark:hover:border-amber-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">\n                            Vercel KV\n                          </span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Built-in if using Vercel\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          KV_REST_API_URL\n                        </code>\n                      </a>\n\n                      <a\n                        href=\"https://neon.tech/docs/get-started-with-neon/connect-neon\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-amber-200 dark:border-amber-700 hover:border-amber-400 dark:hover:border-amber-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">Neon</span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Serverless Postgres\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          DATABASE_URL\n                        </code>\n                      </a>\n\n                      <a\n                        href=\"https://www.sqlite.org/index.html\"\n                        target=\"_blank\"\n                        rel=\"noopener noreferrer\"\n                        className=\"flex items-center justify-between p-3 bg-white dark:bg-neutral-800 rounded-lg border border-amber-200 dark:border-amber-700 hover:border-amber-400 dark:hover:border-amber-500 transition-colors group\"\n                      >\n                        <div>\n                          <span className=\"font-medium text-neutral-900 dark:text-white\">\n                            SQLite\n                          </span>\n                          <span className=\"text-neutral-500 dark:text-neutral-400 text-sm ml-2\">\n                            Local file, single instance only\n                          </span>\n                        </div>\n                        <code className=\"text-xs bg-neutral-100 dark:bg-neutral-700 px-2 py-1 rounded text-neutral-600 dark:text-neutral-300\">\n                          DATABASE_URL=file:./data.db\n                        </code>\n                      </a>\n                    </div>\n                  </div>\n                )}\n              </div>\n            </div>\n          </div>\n        )}\n\n        <div className=\"bg-white dark:bg-neutral-800 rounded-2xl shadow-sm border border-neutral-200 dark:border-neutral-700 mb-8 overflow-hidden\">\n          <div className=\"p-6 border-b border-neutral-200 dark:border-neutral-700\">\n            <h2 className=\"text-xl font-semibold text-neutral-900 dark:text-white\">\n              Quick Start Guide\n            </h2>\n          </div>\n          <div className=\"divide-y divide-neutral-200 dark:divide-neutral-700\">\n            {setupSteps.map((step, index) => (\n              <div key={step.id} className=\"p-6 flex items-start gap-4\">\n                <div\n                  className={`w-8 h-8 rounded-full flex items-center justify-center flex-shrink-0 ${\n                    step.completed\n                      ? \"bg-green-500 text-white\"\n                      : \"bg-neutral-200 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-400\"\n                  }`}\n                >\n                  {step.completed ? (\n                    <svg className=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n                      <path\n                        strokeLinecap=\"round\"\n                        strokeLinejoin=\"round\"\n                        strokeWidth={2}\n                        d=\"M5 13l4 4L19 7\"\n                      />\n                    </svg>\n                  ) : (\n                    <span className=\"font-semibold\">{index + 1}</span>\n                  )}\n                </div>\n                <div className=\"flex-1\">\n                  <h3 className=\"font-semibold text-neutral-900 dark:text-white\">{step.title}</h3>\n                  <p className=\"text-sm text-neutral-600 dark:text-neutral-400 mt-1\">\n                    {step.description}\n                  </p>\n                </div>\n              </div>\n            ))}\n          </div>\n        </div>\n\n        <div className=\"bg-white dark:bg-neutral-800 rounded-2xl shadow-sm border border-neutral-200 dark:border-neutral-700 overflow-hidden\">\n          <div className=\"p-6 border-b border-neutral-200 dark:border-neutral-700\">\n            <h2 className=\"text-xl font-semibold text-neutral-900 dark:text-white\">\n              Service Connections\n            </h2>\n            <p className=\"text-sm text-neutral-600 dark:text-neutral-400 mt-1\">\n              Click on a service to see setup instructions or connect\n            </p>\n\n            <div className=\"mt-4\">\n              <input\n                type=\"text\"\n                placeholder=\"Search services...\"\n                value={searchQuery}\n                onChange={(e) => setSearchQuery(e.target.value)}\n                className=\"w-full px-4 py-2 bg-neutral-100 dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-700 rounded-xl text-neutral-900 dark:text-white placeholder-neutral-500 focus:outline-none focus:ring-2 focus:ring-blue-500\"\n              />\n            </div>\n\n            <div className=\"mt-4 flex flex-wrap gap-2\">\n              <button\n                type=\"button\"\n                onClick={() => setSelectedCategory(null)}\n                className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors ${\n                  selectedCategory === null\n                    ? \"bg-neutral-900 dark:bg-white text-white dark:text-neutral-900\"\n                    : \"bg-neutral-100 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300 hover:bg-neutral-200 dark:hover:bg-neutral-600\"\n                }`}\n              >\n                All\n              </button>\n\n              {CATEGORIES.map((category) => (\n                <button\n                  key={category.id}\n                  type=\"button\"\n                  onClick={() =>\n                    setSelectedCategory(selectedCategory === category.id ? null : category.id)\n                  }\n                  className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors ${\n                    selectedCategory === category.id\n                      ? \"bg-neutral-900 dark:bg-white text-white dark:text-neutral-900\"\n                      : \"bg-neutral-100 dark:bg-neutral-700 text-neutral-600 dark:text-neutral-300 hover:bg-neutral-200 dark:hover:bg-neutral-600\"\n                  }`}\n                >\n                  {category.name}\n                </button>\n              ))}\n            </div>\n          </div>\n\n          {loading ? (\n            <div className=\"p-12 text-center text-neutral-500\">Loading...</div>\n          ) : filteredIntegrations.length === 0 ? (\n            <div className=\"p-12 text-center text-neutral-500\">\n              No services found matching your search\n            </div>\n          ) : (\n            <div>\n              {CATEGORIES.filter((cat) => groupedIntegrations[cat.id]?.length > 0).map(\n                (category) => (\n                  <div key={category.id}>\n                    <div className=\"px-6 py-3 bg-neutral-50 dark:bg-neutral-900 border-b border-neutral-200 dark:border-neutral-700\">\n                      <h3 className=\"text-sm font-semibold text-neutral-500 dark:text-neutral-400 uppercase tracking-wider\">\n                        {category.name}\n                      </h3>\n                    </div>\n\n                    <div className=\"divide-y divide-neutral-200 dark:divide-neutral-700\">\n                      {groupedIntegrations[category.id]?.map((integration) => {\n                        const guide = OAUTH_SETUP_GUIDES[integration.id];\n                        const isExpanded = expandedGuide === integration.id;\n\n                        return (\n                          <div key={integration.id}>\n                            <div className=\"p-6 flex items-center justify-between\">\n                              <div className=\"flex items-center gap-4\">\n                                <div className=\"w-12 h-12 bg-neutral-100 dark:bg-neutral-700 rounded-xl flex items-center justify-center\">\n                                  <ServiceIcon name={integration.icon} />\n                                </div>\n                                <div>\n                                  <h3 className=\"font-semibold text-neutral-900 dark:text-white\">\n                                    {integration.name}\n                                  </h3>\n                                  <p\n                                    className={`text-sm ${\n                                      integration.connected\n                                        ? \"text-green-600 dark:text-green-400\"\n                                        : \"text-neutral-500\"\n                                    }`}\n                                  >\n                                    {integration.connected ? \"Connected\" : \"Not connected\"}\n                                  </p>\n                                </div>\n                              </div>\n\n                              <div className=\"flex items-center gap-3\">\n                                {guide && (\n                                  <button\n                                    type=\"button\"\n                                    onClick={() =>\n                                      setExpandedGuide(isExpanded ? null : integration.id)\n                                    }\n                                    className=\"px-4 py-2 text-sm font-medium text-neutral-600 dark:text-neutral-400 hover:text-neutral-900 dark:hover:text-white\"\n                                  >\n                                    {isExpanded ? \"Hide Guide\" : \"Setup Guide\"}\n                                  </button>\n                                )}\n\n                                {integration.connected ? (\n                                  <span className=\"inline-flex items-center gap-1.5 px-4 py-2 bg-green-50 dark:bg-green-900/20 text-green-700 dark:text-green-400 rounded-xl text-sm font-medium\">\n                                    <span className=\"w-2 h-2 bg-green-500 rounded-full\" />\n                                    Connected\n                                  </span>\n                                ) : (\n                                  <a\n                                    href={integration.connectUrl}\n                                    className=\"px-4 py-2 bg-neutral-900 dark:bg-white text-white dark:text-neutral-900 rounded-xl text-sm font-medium hover:opacity-90 transition-opacity\"\n                                  >\n                                    Connect\n                                  </a>\n                                )}\n                              </div>\n                            </div>\n\n                            {isExpanded && guide && (\n                              <div className=\"px-6 pb-6\">\n                                <div className=\"bg-neutral-50 dark:bg-neutral-900 rounded-xl p-6 border border-neutral-200 dark:border-neutral-700\">\n                                  <h4 className=\"font-semibold text-neutral-900 dark:text-white mb-4\">\n                                    {guide.title}\n                                  </h4>\n\n                                  <ol className=\"space-y-3 mb-6\">\n                                    {guide.steps.map((step, i) => (\n                                      <li key={i} className=\"flex items-start gap-3\">\n                                        <span className=\"w-6 h-6 bg-neutral-200 dark:bg-neutral-700 rounded-full flex items-center justify-center text-sm font-medium text-neutral-600 dark:text-neutral-400 flex-shrink-0\">\n                                          {i + 1}\n                                        </span>\n                                        <span className=\"text-neutral-700 dark:text-neutral-300\">\n                                          {step}\n                                        </span>\n                                      </li>\n                                    ))}\n                                  </ol>\n\n                                  <div className=\"mb-4 p-4 bg-neutral-100 dark:bg-neutral-800 rounded-lg\">\n                                    <h5 className=\"text-sm font-semibold text-neutral-700 dark:text-neutral-300 mb-2\">\n                                      Required Environment Variables:\n                                    </h5>\n                                    <pre className=\"text-sm text-neutral-600 dark:text-neutral-400 font-mono whitespace-pre-wrap\">\n                                      {guide.envVars.map((v) => `${v}=your_value`).join(\"\\n\")}\n                                    </pre>\n                                  </div>\n\n                                  <a\n                                    href={guide.link}\n                                    target=\"_blank\"\n                                    rel=\"noopener noreferrer\"\n                                    className=\"inline-flex items-center gap-2 text-blue-600 dark:text-blue-400 text-sm font-medium hover:underline\"\n                                  >\n                                    Open Developer Console\n                                    <svg\n                                      className=\"w-4 h-4\"\n                                      fill=\"none\"\n                                      stroke=\"currentColor\"\n                                      viewBox=\"0 0 24 24\"\n                                    >\n                                      <path\n                                        strokeLinecap=\"round\"\n                                        strokeLinejoin=\"round\"\n                                        strokeWidth={2}\n                                        d=\"M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14\"\n                                      />\n                                    </svg>\n                                  </a>\n                                </div>\n                              </div>\n                            )}\n                          </div>\n                        );\n                      })}\n                    </div>\n                  </div>\n                ),\n              )}\n            </div>\n          )}\n        </div>\n\n        {allConnected && (\n          <div className=\"mt-8 bg-gradient-to-r from-green-50 to-emerald-50 dark:from-green-900/20 dark:to-emerald-900/20 rounded-2xl p-6 border border-green-200 dark:border-green-800 text-center\">\n            <div className=\"text-4xl mb-4\">🎉</div>\n            <h3 className=\"text-xl font-semibold text-green-800 dark:text-green-200 mb-2\">\n              All Services Connected!\n            </h3>\n            <p className=\"text-green-700 dark:text-green-300 mb-4\">\n              Your AI agent is ready to use. Start chatting to automate your workflows.\n            </p>\n            <a\n              href=\"/\"\n              className=\"inline-flex items-center gap-2 px-6 py-3 bg-green-600 text-white rounded-xl font-medium hover:bg-green-700 transition-colors\"\n            >\n              Start Using Your Agent\n              <svg className=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  strokeWidth={2}\n                  d=\"M13 7l5 5m0 0l-5 5m5-5H6\"\n                />\n              </svg>\n            </a>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n",
+                "app/setup/page-helpers.tsx": "import type { JSX } from \"react\";\n\nexport interface Integration {\n  id: string;\n  name: string;\n  icon: string;\n  connected: boolean;\n  connectUrl: string;\n}\n\nexport interface SetupStep {\n  id: string;\n  title: string;\n  description: string;\n  completed: boolean;\n  action?: () => void;\n  link?: string;\n}\n\ninterface SetupGuide {\n  title: string;\n  steps: string[];\n  link: string;\n  envVars: string[];\n  category: string;\n}\n\nexport interface TokenStorageStatus {\n  mode: \"memory\" | \"database\" | \"kv\" | \"redis\" | \"custom\";\n  encrypted: boolean;\n  autoGenerated?: boolean;\n}\n\nexport type TokenStorageStyles = {\n  container: string;\n  iconWrapper: string;\n  title: string;\n  text: string;\n  isMemory: boolean;\n};\n\nexport const CATEGORIES = [\n  { id: \"google\", name: \"Google Services\", icon: \"google\" },\n  { id: \"microsoft\", name: \"Microsoft Services\", icon: \"microsoft\" },\n  { id: \"atlassian\", name: \"Atlassian\", icon: \"atlassian\" },\n  { id: \"communication\", name: \"Communication\", icon: \"chat\" },\n  { id: \"development\", name: \"Development\", icon: \"code\" },\n  { id: \"productivity\", name: \"Productivity\", icon: \"tasks\" },\n  { id: \"storage\", name: \"Storage\", icon: \"folder\" },\n  { id: \"infrastructure\", name: \"Infrastructure\", icon: \"server\" },\n  { id: \"sales\", name: \"Sales & CRM\", icon: \"users\" },\n  { id: \"support\", name: \"Support\", icon: \"headset\" },\n  { id: \"finance\", name: \"Finance\", icon: \"dollar\" },\n  { id: \"marketing\", name: \"Marketing\", icon: \"megaphone\" },\n  { id: \"design\", name: \"Design\", icon: \"palette\" },\n  { id: \"ai\", name: \"AI Providers\", icon: \"brain\" },\n] as const;\n\nexport const OAUTH_SETUP_GUIDES: Record<string, SetupGuide> = {\n  gmail: {\n    title: \"Google OAuth Setup (Gmail)\",\n    category: \"google\",\n    steps: [\n      \"Go to Google Cloud Console\",\n      \"Create a new project or select existing one\",\n      \"Enable Gmail API in APIs & Services > Library\",\n      \"Go to APIs & Services > Credentials\",\n      \"Create OAuth 2.0 credentials (Web application)\",\n      \"Add redirect URI: http://localhost:3000/api/auth/gmail/callback\",\n      \"Copy Client ID and Secret to your .env file\",\n    ],\n    link: \"https://console.cloud.google.com/apis/credentials\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  calendar: {\n    title: \"Google Calendar Setup\",\n    category: \"google\",\n    steps: [\n      \"Uses same Google OAuth credentials as Gmail\",\n      \"Enable Calendar API in Google Cloud Console\",\n      \"Add redirect URI: http://localhost:3000/api/auth/calendar/callback\",\n    ],\n    link: \"https://console.cloud.google.com/apis/library/calendar-json.googleapis.com\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  drive: {\n    title: \"Google Drive Setup\",\n    category: \"google\",\n    steps: [\n      \"Uses same Google OAuth credentials\",\n      \"Enable Drive API in Google Cloud Console\",\n      \"Add redirect URI: http://localhost:3000/api/auth/drive/callback\",\n    ],\n    link: \"https://console.cloud.google.com/apis/library/drive.googleapis.com\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  sheets: {\n    title: \"Google Sheets Setup\",\n    category: \"google\",\n    steps: [\n      \"Uses same Google OAuth credentials\",\n      \"Enable Sheets API in Google Cloud Console\",\n      \"Add redirect URI: http://localhost:3000/api/auth/sheets/callback\",\n    ],\n    link: \"https://console.cloud.google.com/apis/library/sheets.googleapis.com\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  \"docs-google\": {\n    title: \"Google Docs Setup\",\n    category: \"google\",\n    steps: [\n      \"Uses same Google OAuth credentials\",\n      \"Enable Docs API in Google Cloud Console\",\n      \"Add redirect URI: http://localhost:3000/api/auth/docs-google/callback\",\n    ],\n    link: \"https://console.cloud.google.com/apis/library/docs.googleapis.com\",\n    envVars: [\"GOOGLE_CLIENT_ID\", \"GOOGLE_CLIENT_SECRET\"],\n  },\n  outlook: {\n    title: \"Microsoft Outlook Setup\",\n    category: \"microsoft\",\n    steps: [\n      \"Go to Azure Portal > Azure Active Directory\",\n      \"Click App registrations > New registration\",\n      \"Set redirect URI: http://localhost:3000/api/auth/outlook/callback\",\n      \"Go to API permissions > Add Microsoft Graph permissions\",\n      \"Add: Mail.Read, Mail.Send, Mail.ReadWrite\",\n      \"Go to Certificates & secrets > New client secret\",\n      \"Copy Application ID and Secret to .env\",\n    ],\n    link: \"https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade\",\n    envVars: [\"MICROSOFT_CLIENT_ID\", \"MICROSOFT_CLIENT_SECRET\"],\n  },\n  teams: {\n    title: \"Microsoft Teams Setup\",\n    category: \"microsoft\",\n    steps: [\n      \"Uses same Microsoft OAuth credentials as Outlook\",\n      \"Add Teams permissions: Chat.Read, Chat.ReadWrite, Channel.ReadBasic.All\",\n      \"Add redirect URI: http://localhost:3000/api/auth/teams/callback\",\n    ],\n    link: \"https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade\",\n    envVars: [\"MICROSOFT_CLIENT_ID\", \"MICROSOFT_CLIENT_SECRET\"],\n  },\n  onedrive: {\n    title: \"Microsoft OneDrive Setup\",\n    category: \"microsoft\",\n    steps: [\n      \"Uses same Microsoft OAuth credentials\",\n      \"Add permissions: Files.Read, Files.ReadWrite\",\n      \"Add redirect URI: http://localhost:3000/api/auth/onedrive/callback\",\n    ],\n    link: \"https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade\",\n    envVars: [\"MICROSOFT_CLIENT_ID\", \"MICROSOFT_CLIENT_SECRET\"],\n  },\n  sharepoint: {\n    title: \"Microsoft SharePoint Setup\",\n    category: \"microsoft\",\n    steps: [\n      \"Uses same Microsoft OAuth credentials\",\n      \"Add permissions: Sites.Read.All, Sites.ReadWrite.All\",\n      \"Add redirect URI: http://localhost:3000/api/auth/sharepoint/callback\",\n    ],\n    link: \"https://portal.azure.com/#blade/Microsoft_AAD_RegisteredApps/ApplicationsListBlade\",\n    envVars: [\"MICROSOFT_CLIENT_ID\", \"MICROSOFT_CLIENT_SECRET\"],\n  },\n  jira: {\n    title: \"Atlassian Jira Setup\",\n    category: \"atlassian\",\n    steps: [\n      \"Go to Atlassian Developer Console\",\n      \"Click Create > OAuth 2.0 integration\",\n      \"Add Jira API scopes: read:jira-work, write:jira-work\",\n      \"Set callback URL: http://localhost:3000/api/auth/jira/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.atlassian.com/console/myapps/\",\n    envVars: [\"ATLASSIAN_CLIENT_ID\", \"ATLASSIAN_CLIENT_SECRET\"],\n  },\n  confluence: {\n    title: \"Atlassian Confluence Setup\",\n    category: \"atlassian\",\n    steps: [\n      \"Uses same Atlassian OAuth credentials as Jira\",\n      \"Add Confluence scopes: read:confluence-content.all, write:confluence-content\",\n      \"Add callback URL: http://localhost:3000/api/auth/confluence/callback\",\n    ],\n    link: \"https://developer.atlassian.com/console/myapps/\",\n    envVars: [\"ATLASSIAN_CLIENT_ID\", \"ATLASSIAN_CLIENT_SECRET\"],\n  },\n  bitbucket: {\n    title: \"Atlassian Bitbucket Setup\",\n    category: \"atlassian\",\n    steps: [\n      \"Go to Bitbucket Settings > OAuth consumers\",\n      \"Click Add consumer\",\n      \"Set callback URL: http://localhost:3000/api/auth/bitbucket/callback\",\n      \"Add permissions: repository:read, repository:write\",\n      \"Copy Key and Secret to .env\",\n    ],\n    link: \"https://bitbucket.org/account/settings/app-passwords/\",\n    envVars: [\"BITBUCKET_CLIENT_ID\", \"BITBUCKET_CLIENT_SECRET\"],\n  },\n  slack: {\n    title: \"Slack App Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Slack API Apps page\",\n      \"Click Create New App > From scratch\",\n      \"Go to OAuth & Permissions\",\n      \"Add scopes: channels:read, chat:write, users:read, channels:history\",\n      \"Add redirect URL: http://localhost:3000/api/auth/slack/callback\",\n      \"Install to Workspace\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://api.slack.com/apps\",\n    envVars: [\"SLACK_CLIENT_ID\", \"SLACK_CLIENT_SECRET\"],\n  },\n  discord: {\n    title: \"Discord App Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Discord Developer Portal\",\n      \"Click New Application\",\n      \"Go to OAuth2 section\",\n      \"Add redirect: http://localhost:3000/api/auth/discord/callback\",\n      \"Copy Client ID and Secret to .env\",\n      \"Add bot permissions as needed\",\n    ],\n    link: \"https://discord.com/developers/applications\",\n    envVars: [\"DISCORD_CLIENT_ID\", \"DISCORD_CLIENT_SECRET\"],\n  },\n  zoom: {\n    title: \"Zoom App Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Zoom App Marketplace\",\n      \"Click Develop > Build App\",\n      \"Choose OAuth app type\",\n      \"Add redirect URL: http://localhost:3000/api/auth/zoom/callback\",\n      \"Add scopes: meeting:read, meeting:write, user:read\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://marketplace.zoom.us/develop/create\",\n    envVars: [\"ZOOM_CLIENT_ID\", \"ZOOM_CLIENT_SECRET\"],\n  },\n  webex: {\n    title: \"Webex Integration Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Webex Developer Portal\",\n      \"Create a new integration\",\n      \"Add redirect URI: http://localhost:3000/api/auth/webex/callback\",\n      \"Select required scopes\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.webex.com/my-apps\",\n    envVars: [\"WEBEX_CLIENT_ID\", \"WEBEX_CLIENT_SECRET\"],\n  },\n  twilio: {\n    title: \"Twilio Setup\",\n    category: \"communication\",\n    steps: [\n      \"Go to Twilio Console\",\n      \"Copy Account SID and Auth Token\",\n      \"Get a phone number for SMS\",\n      \"Add credentials to .env\",\n    ],\n    link: \"https://console.twilio.com/\",\n    envVars: [\"TWILIO_ACCOUNT_SID\", \"TWILIO_AUTH_TOKEN\", \"TWILIO_PHONE_NUMBER\"],\n  },\n  github: {\n    title: \"GitHub OAuth App Setup\",\n    category: \"development\",\n    steps: [\n      \"Go to GitHub Developer Settings\",\n      \"Click OAuth Apps > New OAuth App\",\n      \"Set Homepage URL: http://localhost:3000\",\n      \"Set callback URL: http://localhost:3000/api/auth/github/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://github.com/settings/developers\",\n    envVars: [\"GITHUB_CLIENT_ID\", \"GITHUB_CLIENT_SECRET\"],\n  },\n  gitlab: {\n    title: \"GitLab OAuth Setup\",\n    category: \"development\",\n    steps: [\n      \"Go to GitLab User Settings > Applications\",\n      \"Create new application\",\n      \"Add redirect URI: http://localhost:3000/api/auth/gitlab/callback\",\n      \"Select scopes: api, read_user, read_repository\",\n      \"Copy Application ID and Secret to .env\",\n    ],\n    link: \"https://gitlab.com/-/profile/applications\",\n    envVars: [\"GITLAB_CLIENT_ID\", \"GITLAB_CLIENT_SECRET\"],\n  },\n  sentry: {\n    title: \"Sentry Setup\",\n    category: \"development\",\n    steps: [\n      \"Go to Sentry Settings > Developer Settings\",\n      \"Create new integration\",\n      \"Add redirect URL: http://localhost:3000/api/auth/sentry/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://sentry.io/settings/developer-settings/\",\n    envVars: [\"SENTRY_CLIENT_ID\", \"SENTRY_CLIENT_SECRET\"],\n  },\n  posthog: {\n    title: \"PostHog Setup\",\n    category: \"development\",\n    steps: [\"Go to PostHog Project Settings\", \"Copy your Project API Key\", \"Add to .env file\"],\n    link: \"https://app.posthog.com/project/settings\",\n    envVars: [\"POSTHOG_API_KEY\", \"POSTHOG_HOST\"],\n  },\n  mixpanel: {\n    title: \"Mixpanel Setup\",\n    category: \"development\",\n    steps: [\n      \"Go to Mixpanel Project Settings\",\n      \"Copy your Project Token\",\n      \"For API access, create a Service Account\",\n      \"Add credentials to .env\",\n    ],\n    link: \"https://mixpanel.com/settings/project\",\n    envVars: [\"MIXPANEL_TOKEN\", \"MIXPANEL_API_SECRET\"],\n  },\n  notion: {\n    title: \"Notion Integration Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to Notion Integrations page\",\n      \"Click New integration\",\n      \"Name your integration and select workspace\",\n      \"Copy the Internal Integration Token\",\n      \"Share desired pages/databases with your integration\",\n      \"Add token to .env\",\n    ],\n    link: \"https://www.notion.so/my-integrations\",\n    envVars: [\"NOTION_API_KEY\"],\n  },\n  linear: {\n    title: \"Linear OAuth Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to Linear Settings > API\",\n      \"Create new OAuth application\",\n      \"Add redirect URI: http://localhost:3000/api/auth/linear/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://linear.app/settings/api\",\n    envVars: [\"LINEAR_CLIENT_ID\", \"LINEAR_CLIENT_SECRET\"],\n  },\n  asana: {\n    title: \"Asana OAuth Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to Asana Developer Console\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/asana/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://app.asana.com/0/developer-console\",\n    envVars: [\"ASANA_CLIENT_ID\", \"ASANA_CLIENT_SECRET\"],\n  },\n  trello: {\n    title: \"Trello Power-Up Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to Trello Power-Ups Admin\",\n      \"Create new Power-Up\",\n      \"Add redirect URI: http://localhost:3000/api/auth/trello/callback\",\n      \"Copy API Key and Secret to .env\",\n    ],\n    link: \"https://trello.com/power-ups/admin\",\n    envVars: [\"TRELLO_API_KEY\", \"TRELLO_API_SECRET\"],\n  },\n  monday: {\n    title: \"Monday.com App Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to monday.com Developers\",\n      \"Create new app\",\n      \"Add OAuth redirect: http://localhost:3000/api/auth/monday/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://monday.com/developers/apps\",\n    envVars: [\"MONDAY_CLIENT_ID\", \"MONDAY_CLIENT_SECRET\"],\n  },\n  clickup: {\n    title: \"ClickUp OAuth Setup\",\n    category: \"productivity\",\n    steps: [\n      \"Go to ClickUp Settings > Apps\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/clickup/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://app.clickup.com/settings/apps\",\n    envVars: [\"CLICKUP_CLIENT_ID\", \"CLICKUP_CLIENT_SECRET\"],\n  },\n  dropbox: {\n    title: \"Dropbox App Setup\",\n    category: \"storage\",\n    steps: [\n      \"Go to Dropbox App Console\",\n      \"Create new app\",\n      \"Choose Scoped access and Full Dropbox\",\n      \"Add redirect URI: http://localhost:3000/api/auth/dropbox/callback\",\n      \"Copy App Key and Secret to .env\",\n    ],\n    link: \"https://www.dropbox.com/developers/apps\",\n    envVars: [\"DROPBOX_CLIENT_ID\", \"DROPBOX_CLIENT_SECRET\"],\n  },\n  box: {\n    title: \"Box App Setup\",\n    category: \"storage\",\n    steps: [\n      \"Go to Box Developer Console\",\n      \"Create new app with OAuth 2.0\",\n      \"Add redirect URI: http://localhost:3000/api/auth/box/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://app.box.com/developers/console\",\n    envVars: [\"BOX_CLIENT_ID\", \"BOX_CLIENT_SECRET\"],\n  },\n  airtable: {\n    title: \"Airtable OAuth Setup\",\n    category: \"storage\",\n    steps: [\n      \"Go to Airtable Developer Hub\",\n      \"Create new OAuth integration\",\n      \"Add redirect URI: http://localhost:3000/api/auth/airtable/callback\",\n      \"Select required scopes\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://airtable.com/create/oauth\",\n    envVars: [\"AIRTABLE_CLIENT_ID\", \"AIRTABLE_CLIENT_SECRET\"],\n  },\n  supabase: {\n    title: \"Supabase Setup\",\n    category: \"infrastructure\",\n    steps: [\n      \"Go to Supabase Dashboard\",\n      \"Create new project or select existing\",\n      \"Go to Settings > API\",\n      \"Copy Project URL and anon/service_role keys\",\n      \"Add to .env file\",\n    ],\n    link: \"https://supabase.com/dashboard\",\n    envVars: [\"SUPABASE_URL\", \"SUPABASE_ANON_KEY\", \"SUPABASE_SERVICE_ROLE_KEY\"],\n  },\n  neon: {\n    title: \"Neon Database Setup\",\n    category: \"infrastructure\",\n    steps: [\n      \"Go to Neon Console\",\n      \"Create new project\",\n      \"Copy connection string from Dashboard\",\n      \"Add to .env file\",\n    ],\n    link: \"https://console.neon.tech/\",\n    envVars: [\"DATABASE_URL\"],\n  },\n  snowflake: {\n    title: \"Snowflake Setup\",\n    category: \"infrastructure\",\n    steps: [\n      \"Go to Snowflake Console\",\n      \"Create a service account or use existing credentials\",\n      \"Note your account identifier, warehouse, database\",\n      \"Add credentials to .env\",\n    ],\n    link: \"https://app.snowflake.com/\",\n    envVars: [\"SNOWFLAKE_ACCOUNT\", \"SNOWFLAKE_USER\", \"SNOWFLAKE_PASSWORD\", \"SNOWFLAKE_WAREHOUSE\"],\n  },\n  aws: {\n    title: \"AWS Setup\",\n    category: \"infrastructure\",\n    steps: [\n      \"Go to AWS IAM Console\",\n      \"Create new IAM user with programmatic access\",\n      \"Attach required policies (S3, Lambda, DynamoDB)\",\n      \"Copy Access Key ID and Secret\",\n      \"Add to .env file\",\n    ],\n    link: \"https://console.aws.amazon.com/iam/\",\n    envVars: [\"AWS_ACCESS_KEY_ID\", \"AWS_SECRET_ACCESS_KEY\", \"AWS_REGION\"],\n  },\n  salesforce: {\n    title: \"Salesforce Connected App Setup\",\n    category: \"sales\",\n    steps: [\n      \"Go to Salesforce Setup > App Manager\",\n      \"Create new Connected App\",\n      \"Enable OAuth Settings\",\n      \"Add callback URL: http://localhost:3000/api/auth/salesforce/callback\",\n      \"Select OAuth scopes: api, refresh_token\",\n      \"Copy Consumer Key and Secret to .env\",\n    ],\n    link: \"https://login.salesforce.com/\",\n    envVars: [\"SALESFORCE_CLIENT_ID\", \"SALESFORCE_CLIENT_SECRET\"],\n  },\n  hubspot: {\n    title: \"HubSpot App Setup\",\n    category: \"sales\",\n    steps: [\n      \"Go to HubSpot Developer Portal\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/hubspot/callback\",\n      \"Select required scopes\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developers.hubspot.com/\",\n    envVars: [\"HUBSPOT_CLIENT_ID\", \"HUBSPOT_CLIENT_SECRET\"],\n  },\n  pipedrive: {\n    title: \"Pipedrive OAuth Setup\",\n    category: \"sales\",\n    steps: [\n      \"Go to Pipedrive Developer Hub\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/pipedrive/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developers.pipedrive.com/\",\n    envVars: [\"PIPEDRIVE_CLIENT_ID\", \"PIPEDRIVE_CLIENT_SECRET\"],\n  },\n  zendesk: {\n    title: \"Zendesk OAuth Setup\",\n    category: \"support\",\n    steps: [\n      \"Go to Zendesk Admin > API > OAuth Clients\",\n      \"Add new OAuth client\",\n      \"Set redirect URI: http://localhost:3000/api/auth/zendesk/callback\",\n      \"Copy Client ID and Secret to .env\",\n      \"Add your Zendesk subdomain\",\n    ],\n    link: \"https://support.zendesk.com/hc/en-us/articles/4408845965210\",\n    envVars: [\"ZENDESK_CLIENT_ID\", \"ZENDESK_CLIENT_SECRET\", \"ZENDESK_SUBDOMAIN\"],\n  },\n  intercom: {\n    title: \"Intercom OAuth Setup\",\n    category: \"support\",\n    steps: [\n      \"Go to Intercom Developer Hub\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/intercom/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developers.intercom.com/\",\n    envVars: [\"INTERCOM_CLIENT_ID\", \"INTERCOM_CLIENT_SECRET\"],\n  },\n  freshdesk: {\n    title: \"Freshdesk OAuth Setup\",\n    category: \"support\",\n    steps: [\n      \"Go to Freshdesk Admin > Apps > Custom Apps\",\n      \"Create new OAuth application\",\n      \"Add redirect URI: http://localhost:3000/api/auth/freshdesk/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developers.freshdesk.com/\",\n    envVars: [\"FRESHDESK_CLIENT_ID\", \"FRESHDESK_CLIENT_SECRET\", \"FRESHDESK_DOMAIN\"],\n  },\n  servicenow: {\n    title: \"ServiceNow OAuth Setup\",\n    category: \"support\",\n    steps: [\n      \"Go to ServiceNow System OAuth > Application Registry\",\n      \"Create OAuth API endpoint for external clients\",\n      \"Add redirect URL: http://localhost:3000/api/auth/servicenow/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://docs.servicenow.com/\",\n    envVars: [\"SERVICENOW_CLIENT_ID\", \"SERVICENOW_CLIENT_SECRET\", \"SERVICENOW_INSTANCE\"],\n  },\n  stripe: {\n    title: \"Stripe Setup\",\n    category: \"finance\",\n    steps: [\n      \"Go to Stripe Dashboard\",\n      \"Go to Developers > API keys\",\n      \"Copy Publishable and Secret keys\",\n      \"For Connect, set up OAuth in Connect settings\",\n      \"Add to .env file\",\n    ],\n    link: \"https://dashboard.stripe.com/apikeys\",\n    envVars: [\"STRIPE_SECRET_KEY\", \"STRIPE_PUBLISHABLE_KEY\"],\n  },\n  quickbooks: {\n    title: \"QuickBooks OAuth Setup\",\n    category: \"finance\",\n    steps: [\n      \"Go to Intuit Developer Portal\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/quickbooks/callback\",\n      \"Select Accounting scope\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.intuit.com/app/developer/dashboard\",\n    envVars: [\"QUICKBOOKS_CLIENT_ID\", \"QUICKBOOKS_CLIENT_SECRET\"],\n  },\n  xero: {\n    title: \"Xero OAuth Setup\",\n    category: \"finance\",\n    steps: [\n      \"Go to Xero Developer Portal\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/xero/callback\",\n      \"Select required scopes\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.xero.com/app/manage\",\n    envVars: [\"XERO_CLIENT_ID\", \"XERO_CLIENT_SECRET\"],\n  },\n  mailchimp: {\n    title: \"Mailchimp OAuth Setup\",\n    category: \"marketing\",\n    steps: [\n      \"Go to Mailchimp Developer Portal\",\n      \"Register new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/mailchimp/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://admin.mailchimp.com/account/oauth2/\",\n    envVars: [\"MAILCHIMP_CLIENT_ID\", \"MAILCHIMP_CLIENT_SECRET\"],\n  },\n  shopify: {\n    title: \"Shopify App Setup\",\n    category: \"marketing\",\n    steps: [\n      \"Go to Shopify Partners Dashboard\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/shopify/callback\",\n      \"Copy API Key and Secret to .env\",\n    ],\n    link: \"https://partners.shopify.com/\",\n    envVars: [\"SHOPIFY_API_KEY\", \"SHOPIFY_API_SECRET\"],\n  },\n  twitter: {\n    title: \"Twitter/X OAuth Setup\",\n    category: \"marketing\",\n    steps: [\n      \"Go to Twitter Developer Portal\",\n      \"Create new project and app\",\n      \"Enable OAuth 2.0\",\n      \"Add redirect URI: http://localhost:3000/api/auth/twitter/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://developer.twitter.com/en/portal/dashboard\",\n    envVars: [\"TWITTER_CLIENT_ID\", \"TWITTER_CLIENT_SECRET\"],\n  },\n  figma: {\n    title: \"Figma OAuth Setup\",\n    category: \"design\",\n    steps: [\n      \"Go to Figma Developer Settings\",\n      \"Create new app\",\n      \"Add redirect URI: http://localhost:3000/api/auth/figma/callback\",\n      \"Copy Client ID and Secret to .env\",\n    ],\n    link: \"https://www.figma.com/developers/apps\",\n    envVars: [\"FIGMA_CLIENT_ID\", \"FIGMA_CLIENT_SECRET\"],\n  },\n  anthropic: {\n    title: \"Anthropic API Setup\",\n    category: \"ai\",\n    steps: [\"Go to Anthropic Console\", \"Create new API key\", \"Copy API key to .env\"],\n    link: \"https://console.anthropic.com/\",\n    envVars: [\"ANTHROPIC_API_KEY\"],\n  },\n};\n\nexport function filterIntegrations(\n  integrations: Integration[],\n  searchQuery: string,\n  selectedCategory: string | null,\n): Integration[] {\n  const query = searchQuery.toLowerCase();\n\n  return integrations.filter((integration) => {\n    const guide = OAUTH_SETUP_GUIDES[integration.id];\n\n    const matchesSearch =\n      query === \"\" ||\n      integration.name.toLowerCase().includes(query) ||\n      integration.id.toLowerCase().includes(query);\n\n    const matchesCategory = selectedCategory === null || guide?.category === selectedCategory;\n\n    return matchesSearch && matchesCategory;\n  });\n}\n\nexport function groupIntegrationsByCategory(\n  integrations: Integration[],\n): Record<string, Integration[]> {\n  const groups: Record<string, Integration[]> = {};\n\n  for (const integration of integrations) {\n    const category = OAUTH_SETUP_GUIDES[integration.id]?.category ?? \"other\";\n    (groups[category] ??= []).push(integration);\n  }\n\n  return groups;\n}\n\nexport function buildSetupSteps(\n  envChecked: boolean,\n  allConnected: boolean,\n  markEnvChecked: () => void,\n): SetupStep[] {\n  return [\n    {\n      id: \"env\",\n      title: \"Configure Environment Variables\",\n      description: \"Add your OAuth credentials to the .env file\",\n      completed: envChecked,\n      action: markEnvChecked,\n    },\n    {\n      id: \"oauth\",\n      title: \"Create OAuth Apps\",\n      description: \"Set up OAuth applications for each service\",\n      completed: false,\n    },\n    {\n      id: \"connect\",\n      title: \"Connect Services\",\n      description: \"Authorize your app to access each service\",\n      completed: allConnected,\n    },\n  ];\n}\n\nexport function getTokenStorageStyles(\n  tokenStorage: TokenStorageStatus | null,\n): TokenStorageStyles | null {\n  if (!tokenStorage) return null;\n\n  const isMemory = tokenStorage.mode === \"memory\";\n\n  return {\n    container: `rounded-2xl p-6 shadow-sm border mb-8 ${\n      isMemory\n        ? \"bg-amber-50 dark:bg-amber-900/20 border-amber-200 dark:border-amber-800\"\n        : \"bg-green-50 dark:bg-green-900/20 border-green-200 dark:border-green-800\"\n    }`,\n    iconWrapper: `w-10 h-10 rounded-full flex items-center justify-center ${\n      isMemory ? \"bg-amber-100 dark:bg-amber-900\" : \"bg-green-100 dark:bg-green-900\"\n    }`,\n    title: `font-semibold ${\n      isMemory ? \"text-amber-800 dark:text-amber-200\" : \"text-green-800 dark:text-green-200\"\n    }`,\n    text: `text-sm mt-1 ${\n      isMemory ? \"text-amber-700 dark:text-amber-300\" : \"text-green-700 dark:text-green-300\"\n    }`,\n    isMemory,\n  };\n}\n\nexport function ServiceIcon({ name }: { name: string }): JSX.Element {\n  const iconMap: Record<string, JSX.Element> = {\n    mail: (\n      <svg className=\"w-6 h-6 text-red-500\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n        <path\n          d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          fill=\"none\"\n        />\n      </svg>\n    ),\n    slack: (\n      <svg className=\"w-6 h-6\" viewBox=\"0 0 24 24\" fill=\"none\">\n        <path\n          d=\"M5.042 15.165a2.528 2.528 0 0 1-2.52 2.523A2.528 2.528 0 0 1 0 15.165a2.527 2.527 0 0 1 2.522-2.52h2.52v2.52zM6.313 15.165a2.527 2.527 0 0 1 2.521-2.52 2.527 2.527 0 0 1 2.521 2.52v6.313A2.528 2.528 0 0 1 8.834 24a2.528 2.528 0 0 1-2.521-2.522v-6.313z\"\n          fill=\"#E01E5A\"\n        />\n        <path\n          d=\"M8.834 5.042a2.528 2.528 0 0 1-2.521-2.52A2.528 2.528 0 0 1 8.834 0a2.528 2.528 0 0 1 2.521 2.522v2.52H8.834zM8.834 6.313a2.528 2.528 0 0 1 2.521 2.521 2.528 2.528 0 0 1-2.521 2.521H2.522A2.528 2.528 0 0 1 0 8.834a2.528 2.528 0 0 1 2.522-2.521h6.312z\"\n          fill=\"#36C5F0\"\n        />\n        <path\n          d=\"M18.956 8.834a2.528 2.528 0 0 1 2.522-2.521A2.528 2.528 0 0 1 24 8.834a2.528 2.528 0 0 1-2.522 2.521h-2.522V8.834zM17.688 8.834a2.528 2.528 0 0 1-2.523 2.521 2.527 2.527 0 0 1-2.52-2.521V2.522A2.527 2.527 0 0 1 15.165 0a2.528 2.528 0 0 1 2.523 2.522v6.312z\"\n          fill=\"#2EB67D\"\n        />\n        <path\n          d=\"M15.165 18.956a2.528 2.528 0 0 1 2.523 2.522A2.528 2.528 0 0 1 15.165 24a2.527 2.527 0 0 1-2.52-2.522v-2.522h2.52zM15.165 17.688a2.527 2.527 0 0 1-2.52-2.523 2.526 2.526 0 0 1 2.52-2.52h6.313A2.527 2.527 0 0 1 24 15.165a2.528 2.528 0 0 1-2.522 2.523h-6.313z\"\n          fill=\"#ECB22E\"\n        />\n      </svg>\n    ),\n    calendar: (\n      <svg\n        className=\"w-6 h-6 text-blue-500\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n      >\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z\"\n        />\n      </svg>\n    ),\n    github: (\n      <svg className=\"w-6 h-6\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n        <path\n          fillRule=\"evenodd\"\n          d=\"M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z\"\n          clipRule=\"evenodd\"\n        />\n      </svg>\n    ),\n    jira: (\n      <svg className=\"w-6 h-6\" viewBox=\"0 0 24 24\">\n        <defs>\n          <linearGradient id=\"jira-gradient\" x1=\"98.031%\" x2=\"58.888%\" y1=\".161%\" y2=\"40.766%\">\n            <stop offset=\"0%\" stopColor=\"#0052CC\" />\n            <stop offset=\"100%\" stopColor=\"#2684FF\" />\n          </linearGradient>\n        </defs>\n        <path\n          fill=\"url(#jira-gradient)\"\n          d=\"M11.571 11.513H0a5.218 5.218 0 005.232 5.215h2.13v2.057A5.215 5.215 0 0012.575 24V12.518a1.005 1.005 0 00-1.005-1.005z\"\n        />\n        <path\n          fill=\"#2684FF\"\n          d=\"M17.151 5.97H5.58a5.215 5.215 0 005.215 5.214h2.129v2.058a5.218 5.218 0 005.232 5.215V6.975a1.005 1.005 0 00-1.005-1.005z\"\n        />\n        <path\n          fill=\"#2684FF\"\n          d=\"M22.723.426H11.152a5.215 5.215 0 005.215 5.215h2.129v2.057a5.218 5.218 0 005.232 5.215V1.431a1.005 1.005 0 00-1.005-1.005z\"\n        />\n      </svg>\n    ),\n    notion: (\n      <svg className=\"w-6 h-6\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n        <path d=\"M4.459 4.208c.746.606 1.026.56 2.428.466l13.215-.793c.28 0 .047-.28-.046-.326L17.86 1.968c-.42-.326-.98-.7-2.055-.607L3.01 2.295c-.466.046-.56.28-.374.466l1.823 1.447zm.793 3.08v13.904c0 .747.373 1.027 1.214.98l14.523-.84c.84-.046.933-.56.933-1.167V6.354c0-.606-.233-.933-.746-.886l-15.177.887c-.56.046-.747.326-.747.933zm14.337.745c.093.42 0 .84-.42.888l-.7.14v10.264c-.608.327-1.168.514-1.635.514-.746 0-.933-.234-1.495-.933l-4.577-7.186v6.952L12.21 19s0 .84-1.168.84l-3.222.186c-.093-.186 0-.653.327-.746l.84-.233V9.854L7.822 9.76c-.094-.42.14-1.026.793-1.073l3.456-.233 4.764 7.279v-6.44l-1.215-.14c-.093-.514.28-.886.747-.933l3.222-.186zM1.936 1.035l13.31-.98c1.634-.14 2.055-.047 3.082.7l4.249 2.986c.7.513.933.653.933 1.213v16.378c0 1.026-.373 1.634-1.68 1.726l-15.458.934c-.98.047-1.448-.093-1.962-.747l-3.129-4.06c-.56-.747-.793-1.306-.793-1.96V2.667c0-.839.374-1.54 1.448-1.632z\" />\n      </svg>\n    ),\n    default: (\n      <svg\n        className=\"w-6 h-6 text-neutral-400\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        viewBox=\"0 0 24 24\"\n      >\n        <path\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n          strokeWidth={2}\n          d=\"M13 10V3L4 14h7v7l9-11h-7z\"\n        />\n      </svg>\n    ),\n  };\n\n  return iconMap[name] ?? iconMap.default;\n}\n",
                 "app/components/ServiceConnections.tsx": "\"use client\";\n\nimport { useEffect, useState } from \"react\";\n\ninterface Service {\n  id: string;\n  name: string;\n  connected: boolean;\n  authUrl: string;\n}\n\ninterface ServiceConnectionsProps {\n  services: Array<{\n    id: string;\n    name: string;\n    authUrl: string;\n  }>;\n  className?: string;\n}\n\nfunction useIntegrationStatus(): { status: Record<string, boolean>; loading: boolean } {\n  const [status, setStatus] = useState<Record<string, boolean>>({});\n  const [loading, setLoading] = useState<boolean>(true);\n\n  useEffect(() => {\n    async function checkStatus(): Promise<void> {\n      try {\n        const res = await fetch(\"/api/integrations/status\");\n        if (!res.ok) return;\n\n        const data = await res.json();\n        const integrations = data?.integrations ?? [];\n\n        const statusMap: Record<string, boolean> = {};\n        for (const integration of integrations) {\n          statusMap[integration.id] = integration.connected;\n        }\n\n        setStatus(statusMap);\n      } catch (error) {\n        console.error(\"Failed to check service status:\", error);\n      } finally {\n        setLoading(false);\n      }\n    }\n\n    checkStatus();\n  }, []);\n\n  return { status, loading };\n}\n\nfunction withStatus(\n  services: ServiceConnectionsProps[\"services\"],\n  status: Record<string, boolean>,\n): Service[] {\n  return services.map((service) => ({\n    ...service,\n    connected: status[service.id] ?? false,\n  }));\n}\n\nexport function ServiceConnections({\n  services,\n  className = \"\",\n}: ServiceConnectionsProps): React.ReactElement {\n  const { status, loading } = useIntegrationStatus();\n\n  if (loading) {\n    return (\n      <div className={`flex items-center gap-2 ${className}`}>\n        <div className=\"animate-pulse h-6 w-32 bg-neutral-200 dark:bg-neutral-700 rounded\" />\n      </div>\n    );\n  }\n\n  const servicesWithStatus = withStatus(services, status);\n  const connectedCount = servicesWithStatus.reduce(\n    (count, service) => count + (service.connected ? 1 : 0),\n    0,\n  );\n\n  return (\n    <div className={`flex items-center gap-2 ${className}`}>\n      {servicesWithStatus.map((service) => (\n        <ServiceBadge key={service.id} service={service} />\n      ))}\n      {connectedCount < services.length && (\n        <span className=\"text-xs text-neutral-500 dark:text-neutral-400 ml-1\">\n          {connectedCount}/{services.length} connected\n        </span>\n      )}\n    </div>\n  );\n}\n\nfunction ServiceBadge({ service }: { service: Service }): React.ReactElement {\n  if (service.connected) {\n    return (\n      <span\n        className=\"inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400\"\n        title={`${service.name} connected`}\n      >\n        <span className=\"w-1.5 h-1.5 rounded-full bg-green-500\" />\n        {service.name}\n      </span>\n    );\n  }\n\n  const handleConnect = (): void => {\n    globalThis.location.href = service.authUrl;\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={handleConnect}\n      className=\"inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full text-xs font-medium bg-neutral-100 text-neutral-600 hover:bg-neutral-200 dark:bg-neutral-800 dark:text-neutral-400 dark:hover:bg-neutral-700 transition-colors\"\n      title={`Connect ${service.name}`}\n    >\n      <span className=\"w-1.5 h-1.5 rounded-full bg-neutral-400\" />\n      {service.name}\n    </button>\n  );\n}\n\nexport function ServiceConnectionsCard({\n  services,\n  className = \"\",\n}: ServiceConnectionsProps): React.ReactElement | null {\n  const { status, loading } = useIntegrationStatus();\n\n  if (loading) return null;\n\n  const disconnectedServices = withStatus(services, status).filter((service) => !service.connected);\n  if (disconnectedServices.length === 0) return null;\n\n  return (\n    <div\n      className={`rounded-lg border border-amber-200 dark:border-amber-900/50 bg-amber-50 dark:bg-amber-900/20 p-4 ${className}`}\n    >\n      <h3 className=\"font-medium text-amber-900 dark:text-amber-200 mb-2\">\n        Connect your services\n      </h3>\n      <p className=\"text-sm text-amber-700 dark:text-amber-300/80 mb-3\">\n        Connect the following services to unlock all features:\n      </p>\n      <div className=\"flex flex-wrap gap-2\">\n        {disconnectedServices.map((service) => (\n          <a\n            key={service.id}\n            href={service.authUrl}\n            className=\"inline-flex items-center gap-2 px-3 py-1.5 rounded-md text-sm font-medium bg-amber-100 text-amber-800 hover:bg-amber-200 dark:bg-amber-900/40 dark:text-amber-200 dark:hover:bg-amber-900/60 transition-colors\"\n          >\n            Connect {service.name}\n          </a>\n        ))}\n      </div>\n    </div>\n  );\n}\n",
                 "app/page.tsx": "'use client'\n\nimport { useEffect, useState } from 'react'\nimport { Chat, useChat } from 'veryfront/chat'\n\ninterface Integration {\n  id: string\n  name: string\n  connected: boolean\n  connectUrl: string\n}\n\nexport default function ChatPage(): React.ReactElement {\n  const chat = useChat({ api: '/api/chat' })\n\n  return (\n    <div className=\"flex flex-col h-screen bg-white dark:bg-neutral-900\">\n      <header className=\"sticky top-0 z-10 flex-shrink-0 border-b border-neutral-200 dark:border-neutral-800 bg-white dark:bg-neutral-900\">\n        <div className=\"px-4 py-3 flex items-center justify-between\">\n          <h1 className=\"font-medium text-neutral-900 dark:text-white\">AI Agent</h1>\n          <div className=\"flex items-center gap-4\">\n            <ServiceStatusFromAPI />\n            <a\n              href=\"/setup\"\n              className=\"text-sm text-neutral-500 hover:text-neutral-700 dark:text-neutral-400 dark:hover:text-neutral-200\"\n            >\n              Setup\n            </a>\n          </div>\n        </div>\n      </header>\n\n      <Chat {...chat} className=\"flex-1 min-h-0\" placeholder=\"Message\" />\n    </div>\n  )\n}\n\nfunction ServiceStatusFromAPI(): React.ReactElement | null {\n  const [integrations, setIntegrations] = useState<Integration[]>([])\n  const [loading, setLoading] = useState<boolean>(true)\n\n  useEffect((): void => {\n    async function fetchStatus(): Promise<void> {\n      try {\n        const res = await fetch('/api/integrations/status')\n        if (!res.ok) return\n\n        const data = await res.json()\n        setIntegrations(data.integrations ?? [])\n      } catch (error) {\n        console.error('Failed to fetch integration status:', error)\n      } finally {\n        setLoading(false)\n      }\n    }\n\n    void fetchStatus()\n  }, [])\n\n  if (loading) {\n    return (\n      <div className=\"flex items-center gap-2\">\n        <div className=\"animate-pulse h-6 w-24 bg-neutral-200 dark:bg-neutral-700 rounded-full\" />\n      </div>\n    )\n  }\n\n  if (integrations.length === 0) return null\n\n  const connected: Integration[] = []\n  const disconnected: Integration[] = []\n\n  for (const integration of integrations) {\n    if (integration.connected) connected.push(integration)\n    else disconnected.push(integration)\n  }\n\n  return (\n    <div className=\"flex items-center gap-2\">\n      {connected.map(service => (\n        <span\n          key={service.id}\n          className=\"inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full text-xs font-medium bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-400\"\n          title={`${service.name} connected`}\n        >\n          <span className=\"w-1.5 h-1.5 rounded-full bg-green-500\" />\n          {service.name}\n        </span>\n      ))}\n\n      {disconnected.map(service => (\n        <a\n          key={service.id}\n          href={service.connectUrl}\n          className=\"inline-flex items-center gap-1.5 px-2.5 py-1 rounded-full text-xs font-medium bg-neutral-100 text-neutral-600 hover:bg-neutral-200 dark:bg-neutral-800 dark:text-neutral-400 dark:hover:bg-neutral-700 transition-colors\"\n          title={`Connect ${service.name}`}\n        >\n          <span className=\"w-1.5 h-1.5 rounded-full bg-neutral-400\" />\n          {service.name}\n        </a>\n      ))}\n\n      {disconnected.length > 0 && (\n        <span className=\"text-xs text-neutral-500 dark:text-neutral-400\">\n          {connected.length}/{integrations.length}\n        </span>\n      )}\n    </div>\n  )\n}\n",
                 "app/api/integrations/status/route.ts": "import { tokenStore } from \"../../../../lib/token-store.ts\";\n\nconst INTEGRATIONS = [\n  { id: \"gmail\", name: \"Gmail\", icon: \"mail\" },\n  { id: \"slack\", name: \"Slack\", icon: \"slack\" },\n  { id: \"calendar\", name: \"Calendar\", icon: \"calendar\" },\n  { id: \"github\", name: \"GitHub\", icon: \"github\" },\n  { id: \"jira\", name: \"Jira\", icon: \"jira\" },\n  { id: \"notion\", name: \"Notion\", icon: \"notion\" },\n];\n\nexport async function GET(_req: Request): Promise<Response> {\n  const userId = \"current-user\";\n\n  const integrations = await Promise.all(\n    INTEGRATIONS.map(async (integration) => {\n      const { id, name, icon } = integration;\n\n      return {\n        id,\n        name,\n        icon,\n        connected: await tokenStore.isConnected(userId, id),\n        connectUrl: `/api/auth/${id}`,\n      };\n    }),\n  );\n\n  return Response.json({ integrations });\n}\n",

package/esm/deno.js

@@ -1,6 +1,6 @@
 export default {
     "name": "veryfront",
-    "version": "0.1.216",
+    "version": "0.1.217",
     "license": "Apache-2.0",
     "nodeModulesDir": "auto",
     "exclude": [
@@ -339,7 +339,7 @@ export default {
         "lint:style": "deno run --allow-read scripts/lint/enforce-style-conventions.ts",
         "lint:cli-boundary": "deno run --allow-read scripts/lint/enforce-cli-boundary.ts",
         "validate:architecture": "deno run --allow-read scripts/lint/validate-architecture.ts",
-        "lint:check-awaits": "deno run --allow-read scripts/lint/check-unawaited-promises.ts",
+        "lint:check-awaits": "deno run --allow-read --allow-env scripts/lint/check-unawaited-promises.ts",
         "dupes": "deno run --allow-read scripts/lint/find-duplicate-functions.ts",
         "lint:platform": "deno run --allow-read scripts/lint/lint-platform-agnostic.ts",
         "lint:wildcard-exports": "deno run --allow-read scripts/lint/ban-wildcard-exports.ts",

package/esm/src/agent/runtime/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/src/agent/runtime/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/src/agent/runtime/index.ts"],"names":[],"mappings":"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"}