[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_244":245,"_246":247},"routes/_app.x.$handle.$name",{"_98":97,"_32":45,"_106":88,"_27":55,"_13":14,"_107":-5,"_11":108,"_109":110,"_111":112,"_113":114,"_115":116,"_20":-5,"_117":-5,"_118":-5,"_119":25,"_120":121,"_122":60,"_123":-5,"_124":-5,"_125":126},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":55,"_18":56,"_57":58,"_59":60,"_61":60,"_62":-5,"_63":64,"_65":66,"_67":-5,"_68":-5,"_69":-5,"_70":-5,"_71":72,"_73":72,"_74":75,"_76":75,"_77":75,"_78":72,"_79":72,"_80":81,"_82":83,"_84":85,"_86":25},"version",186,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":28,"_33":34,"_35":37,"_38":39,"_40":14,"_41":42,"_24":25},"previous",{"_30":31,"_32":28,"_33":34,"_35":36},"deleted",false,"deletedHere","path","middleware.ts","latestPath","fileId","83ef0a4e-b42e-11f0-a32e-0224a6c84d84","name","fileType","script","content","import {\n decodeState,\n encodeState,\n generatePKCE,\n getDefaultClientName,\n getOrCreateClient,\n getRedirectUri,\n} from \"./oauth.ts\";\nimport {\n createSessionData,\n decryptSession,\n encryptSession,\n SessionData,\n} from \"./session.ts\";\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport ValTown from \"npm:@valtown/sdk@3.10.0\";\n\nconst OAUTH_ISSUER = \"https://val.town\";\nconst DEFAULT_SCOPES = \"openid offline_access profile user_rw\";\nconst SESSION_COOKIE_NAME = \"vt_session\";\n\ntype AppFetch = (req: Request) => Promise | Response;\nexport type Options = {\n scopes?: string[];\n clientName?: string;\n};\n\n// Helper function to extract cookie from request\nfunction getCookie(req: Request, name: string): string | undefined {\n const cookieHeader = req.headers.get(\"Cookie\");\n if (!cookieHeader) return undefined;\n\n const cookies = cookieHeader.split(\";\").map((c) => c.trim());\n for (const cookie of cookies) {\n const [cookieName, ...cookieValue] = cookie.split(\"=\");\n if (cookieName === name) {\n return cookieValue.join(\"=\");\n }\n }\n return undefined;\n}\n\n/**\n * Extract OAuth user data from the encrypted session cookie\n * @param req - The Request object\n * @returns SessionData or null if not authenticated\n */\nexport async function getOAuthUserData(\n req: Request,\n): Promise {\n const sessionCookie = getCookie(req, SESSION_COOKIE_NAME);\n if (!sessionCookie) return null;\n\n try {\n const origin = new URL(req.url).origin;\n const redirectUri = `${origin}/auth/callback`;\n return await decryptSession(sessionCookie, redirectUri);\n } catch (error) {\n console.error(\"Failed to decrypt session:\", error);\n return null;\n }\n}\n\nexport function oauthMiddleware(appFetch: AppFetch): AppFetch;\nexport function oauthMiddleware(opts: Options, appFetch: AppFetch): AppFetch;\nexport function oauthMiddleware(\n optsOrAppFetch: Options | AppFetch,\n appFetch?: AppFetch,\n): AppFetch {\n if (typeof optsOrAppFetch === \"function\") {\n return createMiddleware(optsOrAppFetch, {});\n } else {\n return createMiddleware(appFetch, optsOrAppFetch);\n }\n}\n\n// Internal middleware creation function\nfunction createMiddleware(appFetch: AppFetch, opts: Options): AppFetch {\n return async (req: Request) => {\n const url = new URL(req.url);\n\n if (url.pathname === \"/auth/login\") return handleLogin(req, opts);\n if (url.pathname === \"/auth/callback\") return handleCallback(req);\n if (url.pathname === \"/auth/logout\") return handleLogout(req);\n\n return appFetch(req);\n };\n}\n\n// Home page - initiate OAuth flow\nasync function handleLogin(req: Request, opts: Options) {\n try {\n const redirectUri = getRedirectUri(req);\n const clientName = opts.clientName ?? getDefaultClientName();\n const clientId = await getOrCreateClient(redirectUri, clientName);\n\n const { codeVerifier, codeChallenge } = await generatePKCE();\n\n const state = await encodeState(codeVerifier, clientId, redirectUri);\n\n const scopes = opts.scopes?.join(\" \") ?? DEFAULT_SCOPES;\n\n const authUrl = new URL(`${OAUTH_ISSUER}/oauth/auth`);\n authUrl.searchParams.set(\"client_id\", clientId);\n authUrl.searchParams.set(\"redirect_uri\", redirectUri);\n authUrl.searchParams.set(\"response_type\", \"code\");\n authUrl.searchParams.set(\"scope\", scopes);\n authUrl.searchParams.set(\"code_challenge\", codeChallenge);\n authUrl.searchParams.set(\"code_challenge_method\", \"S256\");\n authUrl.searchParams.set(\"state\", state);\n authUrl.searchParams.set(\"prompt\", \"login consent\");\n\n // redirect to authURL\n return new Response(null, {\n headers: {\n Location: authUrl.toString(),\n },\n status: 302,\n });\n } catch (error) {\n console.error(\"OAuth error:\", error);\n const errorMsg = error?.message || error?.toString() || \"Unknown error\";\n const errorStack = error?.stack || \"\";\n return new Response(\n `\n \n \n OAuth Error\n \n \n

Registration Error

Failed to register OAuth client: ${errorMsg}

${errorStack}

Try again

\n \n \n `,\n { headers: { \"Content-Type\": \"text/html\" } },\n );\n }\n}\n\n// Decode JWT without verification (for ID token)\nfunction decodeJWT(token: string): any {\n const parts = token.split(\".\");\n if (parts.length !== 3) throw new Error(\"Invalid JWT\");\n\n const payload = parts[1];\n const decoded = atob(payload.replace(/-/g, \"+\").replace(/_/g, \"/\"));\n return JSON.parse(decoded);\n}\n\n// OAuth callback handler\nasync function handleCallback(req: Request) {\n const url = new URL(req.url);\n const code = url.searchParams.get(\"code\");\n const state = url.searchParams.get(\"state\");\n\n if (!code) return new Response(\"Missing code\", { status: 400 });\n if (!state) return new Response(\"Missing state\", { status: 400 });\n\n try {\n const redirectUri = getRedirectUri(req);\n const { codeVerifier, clientId } = await decodeState(state, redirectUri);\n\n // Exchange authorization code for tokens\n const tokenResponse = await fetch(`${OAUTH_ISSUER}/oauth/token`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/x-www-form-urlencoded\",\n },\n body: new URLSearchParams({\n grant_type: \"authorization_code\",\n code,\n redirect_uri: redirectUri,\n client_id: clientId,\n code_verifier: codeVerifier,\n }),\n });\n\n if (!tokenResponse.ok) {\n const error = await tokenResponse.text();\n return new Response(`Token exchange failed: ${error}`, { status: 500 });\n }\n\n const tokens = await tokenResponse.json();\n const client = new ValTown({ bearerToken: tokens.access_token });\n\n // Fetch profile and org memberships in parallel\n const orgHandle = parseVal().username;\n const [me, userOrgs] = await Promise.all([\n client.me.profile.retrieve(),\n Array.fromAsync(client.orgs.list({})),\n ]);\n const isOrgMember = me.username === orgHandle\n || userOrgs.some((o) => o.username === orgHandle);\n\n const sessionData = createSessionData(\n me,\n {\n ...tokens,\n isOrgMember,\n },\n );\n\n // Encrypt session for cookie\n const encryptedSession = await encryptSession(sessionData, redirectUri);\n\n // Set secure session cookie and redirect to home\n const headers = new Headers();\n headers.set(\"Location\", \"/\");\n headers.set(\n \"Set-Cookie\",\n `${SESSION_COOKIE_NAME}=${encryptedSession}; Path=/; HttpOnly; Secure; SameSite=Lax; Max-Age=${\n 30 * 24 * 60 * 60\n }`,\n );\n\n return new Response(null, {\n status: 302,\n headers,\n });\n } catch (error) {\n console.error(\"OAuth callback error:\", error);\n return new Response(`Authentication failed: ${error.message}`, {\n status: 500,\n });\n }\n}\n\n// Logout handler\nasync function handleLogout(req: Request) {\n if (req.method !== \"POST\") {\n return new Response(\"Method not allowed\", { status: 405 });\n }\n\n // Clear session cookie by setting Max-Age=0\n const headers = new Headers();\n headers.set(\"Location\", \"/\");\n headers.set(\n \"Set-Cookie\",\n `${SESSION_COOKIE_NAME}=; Path=/; HttpOnly; Secure; SameSite=Lax; Max-Age=0`,\n );\n\n return new Response(null, {\n status: 302,\n headers,\n });\n}","import {\n decodeState,\n encodeState,\n generatePKCE,\n getDefaultClientName,\n getOrCreateClient,\n getRedirectUri,\n} from \"./oauth.ts\";\nimport {\n createSessionData,\n decryptSession,\n encryptSession,\n SessionData,\n} from \"./session.ts\";\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport ValTown from \"npm:@valtown/sdk@3.10.0\";\n\nconst OAUTH_ISSUER = \"https://val.town\";\nconst DEFAULT_SCOPES = \"openid offline_access profile user_rw\";\nconst SESSION_COOKIE_NAME = \"vt_session\";\n\ntype AppFetch = (req: Request) => Promise | Response;\nexport type Options = {\n scopes?: string[];\n clientName?: string;\n};\n\n// Helper function to extract cookie from request\nfunction getCookie(req: Request, name: string): string | undefined {\n const cookieHeader = req.headers.get(\"Cookie\");\n if (!cookieHeader) return undefined;\n\n const cookies = cookieHeader.split(\";\").map((c) => c.trim());\n for (const cookie of cookies) {\n const [cookieName, ...cookieValue] = cookie.split(\"=\");\n if (cookieName === name) {\n return cookieValue.join(\"=\");\n }\n }\n return undefined;\n}\n\n/**\n * Extract OAuth user data from the encrypted session cookie\n * @param req - The Request object\n * @returns SessionData or null if not authenticated\n */\nexport async function getOAuthUserData(\n req: Request,\n): Promise {\n const sessionCookie = getCookie(req, SESSION_COOKIE_NAME);\n if (!sessionCookie) return null;\n\n try {\n const origin = new URL(req.url).origin;\n const redirectUri = `${origin}/auth/callback`;\n return await decryptSession(sessionCookie, redirectUri);\n } catch (error) {\n console.error(\"Failed to decrypt session:\", error);\n return null;\n }\n}\n\nexport function oauthMiddleware(appFetch: AppFetch): AppFetch;\nexport function oauthMiddleware(opts: Options, appFetch: AppFetch): AppFetch;\nexport function oauthMiddleware(\n optsOrAppFetch: Options | AppFetch,\n appFetch?: AppFetch,\n): AppFetch {\n if (typeof optsOrAppFetch === \"function\") {\n return createMiddleware(optsOrAppFetch, {});\n } else {\n return createMiddleware(appFetch, optsOrAppFetch);\n }\n}\n\n// Internal middleware creation function\nfunction createMiddleware(appFetch: AppFetch, opts: Options): AppFetch {\n return async (req: Request) => {\n const url = new URL(req.url);\n\n if (url.pathname === \"/auth/login\") return handleLogin(req, opts);\n if (url.pathname === \"/auth/callback\") return handleCallback(req);\n if (url.pathname === \"/auth/logout\") return handleLogout(req);\n\n return appFetch(req);\n };\n}\n\n// Home page - initiate OAuth flow\nasync function handleLogin(req: Request, opts: Options) {\n try {\n const redirectUri = getRedirectUri(req);\n const clientName = opts.clientName ?? getDefaultClientName();\n const clientId = await getOrCreateClient(redirectUri, clientName);\n\n const { codeVerifier, codeChallenge } = await generatePKCE();\n\n const state = await encodeState(codeVerifier, clientId, redirectUri);\n\n const scopes = opts.scopes?.join(\" \") ?? DEFAULT_SCOPES;\n\n const authUrl = new URL(`${OAUTH_ISSUER}/oauth/auth`);\n authUrl.searchParams.set(\"client_id\", clientId);\n authUrl.searchParams.set(\"redirect_uri\", redirectUri);\n authUrl.searchParams.set(\"response_type\", \"code\");\n authUrl.searchParams.set(\"scope\", scopes);\n authUrl.searchParams.set(\"code_challenge\", codeChallenge);\n authUrl.searchParams.set(\"code_challenge_method\", \"S256\");\n authUrl.searchParams.set(\"state\", state);\n authUrl.searchParams.set(\"prompt\", \"login consent\");\n\n // redirect to authURL\n return new Response(null, {\n headers: {\n Location: authUrl.toString(),\n },\n status: 302,\n });\n } catch (error) {\n console.error(\"OAuth error:\", error);\n const errorMsg = error?.message || error?.toString() || \"Unknown error\";\n const errorStack = error?.stack || \"\";\n return new Response(\n `\n \n \n OAuth Error\n \n \n

Registration Error

Failed to register OAuth client: ${errorMsg}

${errorStack}

Try again

\n \n \n `,\n { headers: { \"Content-Type\": \"text/html\" } },\n );\n }\n}\n\n// Decode JWT without verification (for ID token)\nfunction decodeJWT(token: string): any {\n const parts = token.split(\".\");\n if (parts.length !== 3) throw new Error(\"Invalid JWT\");\n\n const payload = parts[1];\n const decoded = atob(payload.replace(/-/g, \"+\").replace(/_/g, \"/\"));\n return JSON.parse(decoded);\n}\n\n// OAuth callback handler\nasync function handleCallback(req: Request) {\n const url = new URL(req.url);\n const code = url.searchParams.get(\"code\");\n const state = url.searchParams.get(\"state\");\n\n if (!code) return new Response(\"Missing code\", { status: 400 });\n if (!state) return new Response(\"Missing state\", { status: 400 });\n\n try {\n const redirectUri = getRedirectUri(req);\n const { codeVerifier, clientId } = await decodeState(state, redirectUri);\n\n // Exchange authorization code for tokens\n const tokenResponse = await fetch(`${OAUTH_ISSUER}/oauth/token`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/x-www-form-urlencoded\",\n },\n body: new URLSearchParams({\n grant_type: \"authorization_code\",\n code,\n redirect_uri: redirectUri,\n client_id: clientId,\n code_verifier: codeVerifier,\n }),\n });\n\n if (!tokenResponse.ok) {\n const error = await tokenResponse.text();\n return new Response(`Token exchange failed: ${error}`, { status: 500 });\n }\n\n const tokens = await tokenResponse.json();\n const client = new ValTown({ bearerToken: tokens.access_token });\n\n // Fetch profile and org memberships in parallel\n const orgHandle = parseVal().username;\n const [me, userOrgs] = await Promise.all([\n client.me.profile.retrieve(),\n Array.fromAsync(client.orgs.list({})),\n ]);\n const isOrgMember = me.username === orgHandle ||\n userOrgs.some((o) => o.username === orgHandle);\n\n const sessionData = createSessionData(\n me,\n {\n ...tokens,\n isOrgMember,\n },\n );\n\n // Encrypt session for cookie\n const encryptedSession = await encryptSession(sessionData, redirectUri);\n\n // Set secure session cookie and redirect to home\n const headers = new Headers();\n headers.set(\"Location\", \"/\");\n headers.set(\n \"Set-Cookie\",\n `${SESSION_COOKIE_NAME}=${encryptedSession}; Path=/; HttpOnly; Secure; SameSite=Lax; Max-Age=${\n 30 * 24 * 60 * 60\n }`,\n );\n\n return new Response(null, {\n status: 302,\n headers,\n });\n } catch (error) {\n console.error(\"OAuth callback error:\", error);\n return new Response(`Authentication failed: ${error.message}`, {\n status: 500,\n });\n }\n}\n\n// Logout handler\nasync function handleLogout(req: Request) {\n if (req.method !== \"POST\") {\n return new Response(\n \"Method not allowed. Only POST requests are allowed for logout..\",\n { status: 405 },\n );\n }\n\n // Clear session cookie by setting Max-Age=0\n const headers = new Headers();\n headers.set(\"Location\", \"/\");\n headers.set(\n \"Set-Cookie\",\n `${SESSION_COOKIE_NAME}=; Path=/; HttpOnly; Secure; SameSite=Lax; Max-Age=0`,\n );\n\n return new Response(null, {\n status: 302,\n headers,\n });\n}","createdAt",["D",1774758180857],"branchVersion","branchId","83eb3964-b42e-11f0-a32e-0224a6c84d84","id","83e9d146-b42e-11f0-a32e-0224a6c84d84","oauth",["D",1761677232251],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Login with Val Town OAuth Middleware","imageUrl","","a0bf3b31-15a5-4d5c-880e-4b1e22c9bc18","pinnedFileId","91178458-b42e-11f0-b6f3-0224a6c84d84","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",5,"orgId","c606f87f-4d7e-48c8-9c39-ef5ab94aec49","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_98":97,"_105":101},"org",{"_98":97,"_99":-5,"_100":101,"_18":-5,"_102":103,"_104":25},"branch",{"_13":87,"_32":88,"_43":42,"_89":44,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":45,"_96":97},"isOwned",233,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","std","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJVaVhpQ1BId3dscVpBbkdZVWlMNjJtcjkxWS5wbmcifQ","tier","pro","canRestrictVals","profileImageUrl","branchName","adoptOrgId",{"_43":44,"_32":45,"_38":240,"_47":-5,"_48":25,"_49":50,"_51":50,"_52":53,"_54":55,"_18":56,"_57":58,"_59":60,"_61":60,"_62":-5,"_63":64,"_65":66,"_67":-5,"_68":-5,"_69":-5,"_70":-5,"_71":72,"_73":72,"_74":75,"_76":75,"_77":75,"_78":72,"_79":72,"_80":241,"_82":242,"_84":243,"_86":25},"tree",[207,208,209,210,211,212,213,214],"files",[207,208,209,210,211,212,213,214],"counts",{"_195":196,"_197":198,"_199":196,"_200":201,"_202":203},"contents",[127,128,129,130,131,132,133,134],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_43":188,"_32":189,"_30":190,"_138":-5,"_41":42,"_40":149,"_140":25,"_38":191,"_13":192,"_33":20,"_35":193,"_24":25,"_144":-5,"_27":194},{"_43":181,"_32":182,"_30":183,"_138":-5,"_41":42,"_40":184,"_140":25,"_38":185,"_13":142,"_33":20,"_35":186,"_24":25,"_144":-5,"_27":187},{"_43":174,"_32":175,"_30":176,"_138":-5,"_41":42,"_40":177,"_140":60,"_38":178,"_13":151,"_33":34,"_35":179,"_24":25,"_144":-5,"_27":180},{"_43":167,"_32":168,"_30":58,"_138":-5,"_41":42,"_40":149,"_140":25,"_38":169,"_13":170,"_33":152,"_35":171,"_24":25,"_144":172,"_27":173},{"_43":163,"_32":28,"_30":31,"_138":-5,"_41":42,"_40":14,"_140":25,"_38":164,"_13":165,"_33":34,"_35":37,"_24":25,"_144":-5,"_27":166},{"_43":155,"_32":156,"_30":157,"_138":-5,"_41":42,"_40":158,"_140":25,"_38":159,"_13":160,"_33":34,"_35":161,"_24":25,"_144":-5,"_27":162},{"_43":146,"_32":147,"_30":148,"_138":-5,"_41":42,"_40":149,"_140":25,"_38":150,"_13":151,"_33":152,"_35":153,"_24":25,"_144":-5,"_27":154},{"_43":135,"_32":136,"_30":137,"_138":-5,"_41":42,"_40":139,"_140":60,"_38":141,"_13":142,"_33":34,"_35":143,"_24":25,"_144":-5,"_27":145},"97ca4d3a-2b16-11f1-9245-42dde27851f2","session.ts","602fa54e-b507-11f0-b16d-0224a6c84d84","parentId",180,"latest",["D",1774751146084],3,"// Session management using encrypted cookies\nimport { decrypt, encrypt } from \"./crypto.ts\";\nimport type ValTown from \"npm:@valtown/sdk@3.10.0\";\n\nexport interface SessionData {\n user: ValTown.Me.Profile.ProfileRetrieveResponse;\n accessToken: string;\n refreshToken?: string;\n idToken?: string;\n expiresAt: number; // Unix timestamp in milliseconds\n /** Whether the user is a member of this val's org, checked at login time */\n isOrgMember?: boolean;\n}\n\nconst SESSION_DURATION_MS = 30 * 24 * 60 * 60 * 1000; // 30 days\n\n/**\n * Encrypt session data into a cookie-safe string\n */\nexport async function encryptSession(\n data: SessionData,\n redirectUri: string,\n): Promise {\n const payload = JSON.stringify(data);\n return await encrypt(payload, redirectUri);\n}\n\n/**\n * Decrypt and validate a session cookie\n * Returns null if invalid or expired\n */\nexport async function decryptSession(\n encryptedSession: string,\n redirectUri: string,\n): Promise {\n try {\n const decrypted = await decrypt(encryptedSession, redirectUri);\n const session = JSON.parse(decrypted) as SessionData;\n\n // Validate expiry\n if (Date.now() >= session.expiresAt) {\n return null;\n }\n\n return session;\n } catch {\n return null;\n }\n}\n\n/**\n * Create a new session with default 30-day expiry\n */\nexport function createSessionData(\n user: ValTown.Me.Profile.ProfileRetrieveResponse,\n options: {\n accessToken: string;\n refreshToken?: string;\n idToken?: string;\n isOrgMember?: boolean;\n },\n): SessionData {\n return {\n user,\n accessToken: options.accessToken,\n refreshToken: options.refreshToken,\n idToken: options.idToken,\n isOrgMember: options.isOrgMember,\n expiresAt: Date.now() + SESSION_DURATION_MS,\n };\n}\n","label",[136],"d83b0ff2-2b26-11f1-979a-42dde27851f2","org.example.tsx","97c9def4-2b16-11f1-9245-42dde27851f2",185,["D",1774758126153],2,"http","/** @jsxImportSource https://esm.sh/hono/jsx */\nimport { Hono } from \"https://esm.sh/hono\";\nimport { getOAuthUserData, oauthMiddleware } from \"./middleware.ts\";\nimport type { SessionData } from \"./session.ts\";\n\ntype AuthEnv = { Variables: { session: SessionData } };\nconst app = new Hono();\n\n// Require login + org membership for all routes\napp.use(async (c, next) => {\n const session = await getOAuthUserData(c.req.raw);\n if (!session) {\n return c.html(\n

\n Log in\n

,\n );\n }\n if (!session.isOrgMember) {\n return c.html(\n

\n You are not a member of this org.\n

,\n );\n }\n c.set(\"session\", session);\n return next();\n});\n\napp.get(\"/\", (c) => {\n const session = c.get(\"session\");\n return c.html(\n \n

\n Logged in session:

{JSON.stringify(session, null, 2)}

\n ,\n );\n});\n\napp.onError((err) => Promise.reject(err));\nexport default oauthMiddleware(app.fetch);",[147],"36d88a04-2b17-11f1-9f21-42dde27851f2","oauth.ts","1744e9ae-b43d-11f0-999e-0224a6c84d84",181,["D",1774751412897],22,"import { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport { blob } from \"https://esm.town/v/std/blob\";\nimport { decrypt, encrypt } from \"./crypto.ts\";\n\nconst OAUTH_ISSUER = \"https://www.val.town\";\n\n// Client cache: stores most recent client in memory\nlet cachedClient: any = null;\n\nexport function getDefaultClientName(): string {\n try {\n const val = parseVal();\n return `${val.name} by ${val.username}`;\n } catch {\n return \"Generic Val Town App\";\n }\n}\n\n// Extract redirect URI from request\nexport function getRedirectUri(req: Request): string {\n const origin = new URL(req.url).origin;\n return `${origin}/auth/callback`;\n}\n\n// Generate PKCE code verifier and challenge\nexport async function generatePKCE() {\n const array = new Uint8Array(32);\n crypto.getRandomValues(array);\n const codeVerifier = btoa(String.fromCharCode(...array))\n .replace(/\\+/g, \"-\")\n .replace(/\\//g, \"_\")\n .replace(/=/g, \"\");\n\n const encoder = new TextEncoder();\n const data = encoder.encode(codeVerifier);\n const hash = await crypto.subtle.digest(\"SHA-256\", data);\n const codeChallenge = btoa(String.fromCharCode(...new Uint8Array(hash)))\n .replace(/\\+/g, \"-\")\n .replace(/\\//g, \"_\")\n .replace(/=/g, \"\");\n\n return { codeVerifier, codeChallenge };\n}\n\n// Encode state with embedded code_verifier, client_id, and timestamp\nexport async function encodeState(\n codeVerifier: string,\n clientId: string,\n redirectUri: string,\n): Promise {\n const payload = JSON.stringify({\n verifier: codeVerifier,\n clientId: clientId,\n timestamp: Date.now(),\n });\n return await encrypt(payload, redirectUri);\n}\n\n// Decode and validate state\nexport async function decodeState(\n state: string,\n redirectUri: string,\n): Promise<{ codeVerifier: string; clientId: string }> {\n const decrypted = await decrypt(state, redirectUri);\n const payload = JSON.parse(decrypted);\n\n // Validate timestamp (10 minute expiry)\n const age = Date.now() - payload.timestamp;\n if (age > 10 * 60 * 1000) {\n throw new Error(\"State expired - please restart the OAuth flow\");\n }\n\n return { codeVerifier: payload.verifier, clientId: payload.clientId };\n}\n\n// Get or create OAuth client with two-tier caching\nexport async function getOrCreateClient(\n redirectUri: string,\n clientName?: string,\n): Promise {\n // Check memory cache - if redirect URI matches, return immediately (no blob fetch needed)\n if (cachedClient?.redirect_uris?.[0] === redirectUri) {\n return cachedClient.client_id;\n }\n\n // Check blob storage\n const blobClient = await blob.getJSON(`oauth_client:${redirectUri}`);\n if (blobClient?.redirect_uris?.[0] === redirectUri) {\n cachedClient = blobClient;\n return blobClient.client_id;\n }\n\n // Register new client\n const newClient = await registerPublicClient(redirectUri, clientName);\n cachedClient = newClient;\n await blob.setJSON(`oauth_client:${redirectUri}`, newClient);\n return newClient.client_id;\n}\n\n// Register a new public OAuth client via Dynamic Client Registration\nexport async function registerPublicClient(\n redirectUri: string,\n clientName = getDefaultClientName(),\n): Promise {\n const response = await fetch(`${OAUTH_ISSUER}/oauth/reg`, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({\n redirect_uris: [redirectUri],\n grant_types: [\"authorization_code\", \"refresh_token\"],\n response_types: [\"code\"],\n client_name: clientName,\n token_endpoint_auth_method: \"none\", // Public client - no secret authentication\n }),\n });\n\n if (!response.ok) {\n const error = await response.text();\n throw new Error(`Client registration failed: ${error}`);\n }\n\n const clientData = await response.json();\n return clientData;\n}",[156],"f8d5589e-2b26-11f1-8be8-42dde27851f2",["D",1774758180857],84,[28],"d83ae400-2b26-11f1-979a-42dde27851f2","example.tsx",["D",1774758126153],38,"/** @jsxImportSource https://esm.sh/hono/jsx */\nimport { Hono } from \"https://esm.sh/hono\";\nimport { getOAuthUserData, oauthMiddleware } from \"./middleware.ts\";\n\nconst app = new Hono();\n\napp.get(\"/\", async (c) => {\n const { user } = (await getOAuthUserData(c.req.raw)) || {};\n\n return c.html(\n \n \n

Login with Val Town OAuth Demo

\n {user\n ? (\n <>\n

Logged in as: {user.username}

\n \n \n )\n : (\n

\n Log in\n

\n )}\n \n ,\n );\n});\n\napp.onError((err) => Promise.reject(err));\n\n// Export server\nexport default oauthMiddleware(app.fetch);","std-oauth",[168],"01f05f24-078b-11f1-86e0-42dde27851f2","crypto.ts","0560d0e4-b50b-11f0-aab9-0224a6c84d84",178,["D",1770842903945],"// Shared encryption utilities for OAuth state and session management\nimport { blob } from \"https://esm.town/v/std/blob\";\n\n// Encryption key cache: stores encryption key material in memory\nlet cachedEncryptionKey: string | null = null;\n\n// Get or create encryption key material with three-tier caching\nexport async function getOrCreateEncryptionKeyMaterial(\n redirectUri: string,\n): Promise {\n // Check memory cache\n if (cachedEncryptionKey) return cachedEncryptionKey;\n\n // Check environment variable (fastest - no I/O)\n const envKey = Deno.env.get(\"OAUTH_STATE_ENCRYPTION_KEY\");\n if (envKey) {\n cachedEncryptionKey = envKey;\n return envKey;\n }\n\n // Check blob storage (scoped to redirect URI)\n const blobKey = `oauth_encryption_key:${redirectUri}`;\n try {\n const storedKey = await blob.getJSON(blobKey) as string | null;\n if (storedKey) {\n cachedEncryptionKey = storedKey;\n return storedKey;\n }\n } catch (_error) {\n // Blob doesn't exist or is in old format, will create new one below\n }\n // Generate new random key (32 bytes = 256 bits)\n const randomBytes = new Uint8Array(32);\n crypto.getRandomValues(randomBytes);\n const newKey = btoa(String.fromCharCode(...randomBytes));\n // Store in blob for persistence\n await blob.setJSON(blobKey, newKey);\n cachedEncryptionKey = newKey;\n\n return newKey;\n}\n\n// Derive encryption key from key material\nexport async function getEncryptionKey(\n redirectUri: string,\n): Promise {\n const keyMaterialString = await getOrCreateEncryptionKeyMaterial(redirectUri);\n const encoder = new TextEncoder();\n const keyMaterial = encoder.encode(keyMaterialString);\n const keyHash = await crypto.subtle.digest(\"SHA-256\", keyMaterial);\n\n return await crypto.subtle.importKey(\n \"raw\",\n keyHash,\n { name: \"AES-GCM\" },\n false,\n [\"encrypt\", \"decrypt\"],\n );\n}\n\n// Encrypt data into a URL-safe string\nexport async function encrypt(\n data: string,\n redirectUri: string,\n): Promise {\n const key = await getEncryptionKey(redirectUri);\n const encoder = new TextEncoder();\n const iv = crypto.getRandomValues(new Uint8Array(12)); // 96-bit IV for GCM\n\n const encrypted = await crypto.subtle.encrypt(\n { name: \"AES-GCM\", iv },\n key,\n encoder.encode(data),\n );\n\n // Combine IV + encrypted data\n const combined = new Uint8Array(iv.length + encrypted.byteLength);\n combined.set(iv, 0);\n combined.set(new Uint8Array(encrypted), iv.length);\n\n // Base64url encode\n return btoa(String.fromCharCode(...combined))\n .replace(/\\+/g, \"-\")\n .replace(/\\//g, \"_\")\n .replace(/=/g, \"\");\n}\n\n// Decrypt URL-safe string back to data\nexport async function decrypt(\n encryptedData: string,\n redirectUri: string,\n): Promise {\n try {\n const key = await getEncryptionKey(redirectUri);\n\n // Base64url decode\n const combined = Uint8Array.from(\n atob(encryptedData.replace(/-/g, \"+\").replace(/_/g, \"/\")),\n (c) => c.charCodeAt(0),\n );\n\n // Extract IV and encrypted data\n const iv = combined.slice(0, 12);\n const encrypted = combined.slice(12);\n\n const decrypted = await crypto.subtle.decrypt(\n { name: \"AES-GCM\", iv },\n key,\n encrypted,\n );\n\n const decoder = new TextDecoder();\n return decoder.decode(decrypted);\n } catch {\n throw new Error(\"Failed to decrypt data - invalid or tampered\");\n }\n}",[175],"d948d716-b50c-11f0-990b-0224a6c84d84","TESTING.md","3a02d228-b4fe-11f0-815b-0224a6c84d84",166,["D",1761772723799],"# OAuth Testing Guide\n\nTest the @std/oauth library using Playwright MCP tools.\n\n## Prerequisites\n\n- Val Town MCP server access\n- Playwright MCP tools (`mcp__playwright__*`)\n- Test email: `stevekrouse-6ca82204b4fa11f0ad790224a6c84d84@valtown.email`\n- Login link retrieval: Use `@stevekrouse/login-to-val-town-shim` val\n\n## Find the Demo URL\n\nThe example app runs at the endpoint URL for `example.tsx` in the `std/oauth` val.\n\nUse Val Town MCP to get it:\n```javascript\nmcp__val-town__list_files({\n val: \"std/oauth\"\n});\n```\n\nLook for `example.tsx` in the results - the `endpoint` URL in its `links` object is the demo URL (typically `https://std--[id].web.val.run`).\n\n## Login to Val Town (if needed)\n\nIf not already logged in to Val Town in the browser:\n\n1. Navigate to sign-in:\n ```javascript\n mcp__playwright__browser_navigate({\n url: \"https://www.val.town/auth/signin/\"\n });\n ```\n\n2. Enter test email and click Continue\n\n3. Retrieve login link from SQLite:\n ```javascript\n mcp__val-town__sqlite_execute({\n sql: \"SELECT text, timestamp FROM login_to_val_town_shim_emails ORDER BY timestamp DESC LIMIT 1\"\n });\n ```\n\n4. Extract the `https://clerk.val.town/v1/verify?...` URL from the email text\n\n5. Navigate to login URL to complete sign-in\n\n## Test OAuth Flow\n\n### 1. Navigate to demo app\n\n```javascript\nmcp__playwright__browser_navigate({\n url: \"https://std--91178458b42e11f0b6f30224a6c84d84.web.val.run\"\n});\n```\n\n**Expected:** Page shows \"Not logged in\" with \"Log in\" link\n\n### 2. Click \"Log in\"\n\n```javascript\nmcp__playwright__browser_click({ \n element: \"Log in link\", \n ref: \"[ref from snapshot]\" \n});\n```\n\n**Expected:** Redirects to Val Town OAuth authorization page showing requested permissions\n\n### 3. Click \"Allow\"\n\n```javascript\nmcp__playwright__browser_click({ \n element: \"Allow button\", \n ref: \"[ref from snapshot]\" \n});\n```\n\n**Expected:** \n- Redirects back to demo app\n- Shows \"Logged in as: steve_test_claude_code\"\n- Shows User ID\n\n### 4. Verify session persists\n\nRefresh or navigate to home again - should still be logged in.\n\n### 5. Test logout\n\n```javascript\nmcp__playwright__browser_click({ \n element: \"Log out link\", \n ref: \"[ref from snapshot]\" \n});\n```\n\n**Expected:** Returns to \"Not logged in\" state\n\n## What's Being Tested\n\n- OAuth authorization code flow with PKCE\n- Dynamic client registration\n- Session cookie creation with encrypted data\n- Username fetched from `/v1/me` API\n- Session persistence across requests\n- Logout functionality\n\n## Scopes Required\n\nThe default scopes include:\n- `openid` - Basic OpenID Connect\n- `offline_access` - Refresh token\n- `profile` - Profile information\n- `user_r` - Read user data\n- `user_rw` - Write user data (needed for `/v1/me` access)\n",[182],"d83abf16-2b26-11f1-979a-42dde27851f2","README.md","9cbce088-b441-11f0-80ca-0224a6c84d84",["D",1774758126153],26,"# Login with Val Town OAuth Middleware\n\nOAuth authentication middleware for Val Town vals.\n\n## Features\n\n- OAuth 2.0 Authorization Code flow with PKCE\n- Dynamic client registration\n- Encrypted session cookies (stateless)\n- No database required\n- **Org membership** — `session.isOrgMember` is set at login for org-owned vals\n\n## Usage\n\n```tsx\n/** @jsxImportSource https://esm.sh/hono/jsx */\nimport { Hono } from \"https://esm.sh/hono\";\nimport {\n getOAuthUserData,\n oauthMiddleware,\n} from \"https://esm.town/v/std/oauth/middleware.ts\";\n\nconst app = new Hono();\n\napp.get(\"/\", async (c) => {\n const session = await getOAuthUserData(c.req.raw);\n\n return c.html(\n \n \n {session?.user\n ?

Logged in as {session.user.username}

\n : Log in}\n \n ,\n );\n});\n\n// Simple usage with defaults\nexport default oauthMiddleware(app.fetch);\n```\n\n### Org-only access\n\n`session.isOrgMember` tells you whether the logged-in user belongs to the val's\norg. See [org.example.tsx](./org.example.tsx) for a full example.\n\n```tsx\n/** @jsxImportSource https://esm.sh/hono/jsx */\nimport { Hono } from \"https://esm.sh/hono\";\nimport {\n getOAuthUserData,\n oauthMiddleware,\n} from \"https://esm.town/v/std/oauth/middleware.ts\";\n\nconst app = new Hono();\n\napp.get(\"/\", async (c) => {\n const session = await getOAuthUserData(c.req.raw);\n if (!session) return c.redirect(\"/auth/login\");\n if (!session.isOrgMember) {\n return c.text(\"You must be a member of this org to access this app.\", 403);\n }\n return c.text(`Welcome, ${session.user.username}!`);\n});\n\nexport default oauthMiddleware(app.fetch);\n```\n\n## API\n\n### `oauthMiddleware(appFetch)` or `oauthMiddleware(options, appFetch)`\n\nWraps your application to handle OAuth routes. Supports two calling styles:\n\n1. **Handler only** (backwards compatible): `oauthMiddleware(appFetch)`\n2. **Options first** (Deno.serve style): `oauthMiddleware(options, appFetch)`\n\n**Options:**\n\n- `scopes?: string[]` - OAuth scopes (default:\n `[\"openid\", \"offline_access\", \"profile\", \"user_rw\"]`)\n- `clientName?: string` - OAuth client name\n\n**Auto-handled routes:**\n\n- `/auth/login` - Start OAuth flow\n- `/auth/callback` - OAuth callback\n- `/auth/logout` - Clear session (POST only)\n\n### `getOAuthUserData(req: Request)`\n\nExtract user data from session cookie.\n\n**Returns:** `SessionData | null`\n\n```typescript\ninterface SessionData {\n user: {\n id: string;\n bio: string | null;\n email: string | null;\n links: {\n self: string;\n profileImageUrl: string | null;\n };\n tier: \"free\" | \"pro\" | null;\n type: \"user\" | \"org\";\n url: string;\n username: string | null;\n };\n accessToken: string;\n refreshToken?: string;\n idToken?: string;\n expiresAt: number;\n /** Whether the user is a member of this val's org (for org-owned vals) */\n isOrgMember?: boolean;\n}\n```\n\n## Environment Variables\n\n- `OAUTH_STATE_ENCRYPTION_KEY` (optional) - Encryption key for state and\n sessions\n - Auto-generated if not set\n - Set manually (e.g., `openssl rand -base64 32`) for better performance\n\n## How It Works\n\n1. User clicks `/auth/login`\n2. Redirects to Val Town OAuth\n3. User authorizes\n4. Callback receives code, exchanges for tokens\n5. User data fetched from `/v1/me` API using access token\n6. Org membership checked against this val's org\n7. Session encrypted and stored in cookie\n8. Use `getOAuthUserData(req)` to access user data and `session.isOrgMember`\n\nSessions last 30 days and are stored as encrypted cookies (no server-side\nstorage).\n\n## Security\n\nThis code falls under Val Town's\n[Vulnerability Disclosure Policy](https://docs.val.town/contact-us/security/).\nWe are actively soliciting bug reports and will pay bounties depending on the\nseverity of the issue found.\n\nIf you discover a vulnerability, please report it privately by emailing\n[security@val.town](mailto:security@val.town). Do not publish or reveal the\nissue until it has been resolved.",[189],"pulls",0,"branches",1,"forks","envVars",{"_204":196,"_206":196},"connections",{"_204":196,"_205":196},"count","unfilledCount","emptyCount",{"_43":188,"_32":189,"_30":190,"_138":-5,"_41":42,"_40":149,"_140":25,"_38":237,"_13":192,"_33":20,"_35":193,"_24":25,"_144":-5,"_216":238,"_27":239},{"_43":181,"_32":182,"_30":183,"_138":-5,"_41":42,"_40":184,"_140":25,"_38":234,"_13":142,"_33":20,"_35":186,"_24":25,"_144":-5,"_216":235,"_27":236},{"_43":174,"_32":175,"_30":176,"_138":-5,"_41":42,"_40":177,"_140":60,"_38":231,"_13":151,"_33":34,"_35":179,"_24":25,"_144":-5,"_216":232,"_27":233},{"_43":167,"_32":168,"_30":58,"_138":-5,"_41":42,"_40":149,"_140":25,"_38":228,"_13":170,"_33":152,"_35":171,"_24":25,"_144":172,"_216":229,"_27":230},{"_43":163,"_32":28,"_30":31,"_138":-5,"_41":42,"_40":14,"_140":25,"_38":225,"_13":165,"_33":34,"_35":37,"_24":25,"_144":-5,"_216":226,"_27":227},{"_43":155,"_32":156,"_30":157,"_138":-5,"_41":42,"_40":158,"_140":25,"_38":222,"_13":160,"_33":34,"_35":161,"_24":25,"_144":-5,"_216":223,"_27":224},{"_43":146,"_32":147,"_30":148,"_138":-5,"_41":42,"_40":149,"_140":25,"_38":219,"_13":151,"_33":152,"_35":153,"_24":25,"_144":-5,"_216":220,"_27":221},{"_43":135,"_32":136,"_30":137,"_138":-5,"_41":42,"_40":139,"_140":60,"_38":215,"_13":142,"_33":34,"_35":143,"_24":25,"_144":-5,"_216":217,"_27":218},["D",1774751146084],"children",[],[136],["D",1774758126153],[],[147],["D",1774751412897],[],[156],["D",1774758180857],[],[28],["D",1774758126153],[],[168],["D",1770842903945],[],[175],["D",1761772723799],[],[182],["D",1774758126153],[],[189],["D",1761677232251],{"_98":97,"_105":101},{"_98":97,"_99":-5,"_100":101,"_18":-5,"_102":103,"_104":25},{"_13":87,"_32":88,"_43":42,"_89":44,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":45,"_96":97},"ctx",{"_80":-5,"_124":277,"_278":279,"_280":281,"_282":25,"_283":25,"_284":25,"_285":60,"_286":-5,"_287":-7,"_288":-7,"_289":196,"_290":25,"_291":25,"_292":-5,"_293":25,"_294":25,"_295":25,"_296":-5},"ENV",{"_248":249,"_250":251,"_252":88,"_253":254,"_255":256,"_257":258,"_259":260,"_261":262,"_263":264,"_265":266,"_267":268,"_269":270,"_271":272,"_273":274,"_275":276},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v186