\n \n

\n \n Val Town x Pipedream Connect\n \n

\n \n View source\n \n

\n\n

\n \n {user?.username}\n \n \n \n \n\n {isMenuOpen && (\n

\n \n New Action\n \n \n New Trigger\n \n \n My Triggers\n \n \n My Connections\n \n \n Logout\n \n

\n )}\n

\n\n

\n {/* Removed the welcome message since it's now in the profile menu */}\n

\n\n {children}\n

\n );\n}",[190,101,77],"d1861ea4-512e-11f0-9a15-f69ea79377d9",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\n\nexport function ExperimentalWarning() {\n return (\n

⚠️ Experimental Integration

\n We will email you if anything changes.\n

\n );\n}",[190,101,99],"d1861d1e-512e-11f0-9a15-f69ea79377d9",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\n\nexport function ErrorMessage({ error, onDismiss }) {\n if (!error) return null;\n\n return (\n

\n {error}\n {onDismiss && (\n \n ×\n \n )}\n

\n );\n}",[190,101,88],"d1861a94-512e-11f0-9a15-f69ea79377d9",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { toast } from \"https://esm.sh/react-toastify?deps=react@18.2.0,react-dom@18.2.0\";\n\nexport function CodeSnippet({ code }: { code: string }) {\n return (\n

\n {\n navigator.clipboard.writeText(code);\n toast(\"Copied!\");\n }}\n className=\"absolute right-3 top-3 px-3 py-1 text-xs font-medium text-gray-600 bg-gray-100 hover:bg-gray-200 border border-gray-300 rounded transition-colors z-10\"\n >\n Copy\n \n

\n        \n          {code}\n        \n

\n );\n}",[190,101,94],"pulls","branches","forks","envVars",{"_95":96,"_219":26},"connections",{"_95":26,"_218":26},"unfilledCount","emptyCount",{"_33":381,"_13":358,"_75":351,"_43":-5,"_35":36,"_184":40,"_185":24,"_37":382,"_39":26,"_78":102,"_187":-5,"_80":30,"_188":-5,"_248":383,"_17":384},{"_33":374,"_13":375,"_75":376,"_43":351,"_35":36,"_184":40,"_185":24,"_37":377,"_39":26,"_78":79,"_187":378,"_80":30,"_188":-5,"_248":379,"_17":380},{"_33":366,"_13":367,"_75":368,"_43":351,"_35":36,"_184":40,"_185":24,"_37":369,"_39":26,"_78":370,"_187":371,"_80":30,"_188":-5,"_248":372,"_17":373},{"_33":359,"_13":360,"_75":361,"_43":351,"_35":36,"_184":40,"_185":24,"_37":362,"_39":26,"_78":79,"_187":363,"_80":30,"_188":-5,"_248":364,"_17":365},{"_33":348,"_13":349,"_75":350,"_43":351,"_35":36,"_184":352,"_185":24,"_37":353,"_39":354,"_78":79,"_187":355,"_80":30,"_188":-5,"_248":356,"_17":357},{"_33":344,"_13":190,"_75":183,"_43":-5,"_35":36,"_184":40,"_185":24,"_37":345,"_39":26,"_78":102,"_187":-5,"_80":30,"_188":-5,"_248":346,"_17":347},{"_33":182,"_13":101,"_75":100,"_43":183,"_35":36,"_184":40,"_185":24,"_37":341,"_39":26,"_78":102,"_187":-5,"_80":30,"_188":-5,"_248":342,"_17":343},{"_33":207,"_13":94,"_75":93,"_43":100,"_35":36,"_184":40,"_185":24,"_37":338,"_39":26,"_78":79,"_187":209,"_80":30,"_188":-5,"_248":339,"_17":340},{"_33":203,"_13":88,"_75":87,"_43":100,"_35":36,"_184":40,"_185":24,"_37":335,"_39":26,"_78":79,"_187":205,"_80":30,"_188":-5,"_248":336,"_17":337},{"_33":199,"_13":99,"_75":98,"_43":100,"_35":36,"_184":40,"_185":24,"_37":332,"_39":26,"_78":79,"_187":201,"_80":30,"_188":-5,"_248":333,"_17":334},{"_33":195,"_13":77,"_75":76,"_43":100,"_35":36,"_184":40,"_185":24,"_37":329,"_39":26,"_78":79,"_187":197,"_80":30,"_188":-5,"_248":330,"_17":331},{"_33":325,"_13":280,"_75":275,"_43":183,"_35":36,"_184":40,"_185":24,"_37":326,"_39":26,"_78":102,"_187":-5,"_80":30,"_188":-5,"_248":327,"_17":328},{"_33":318,"_13":319,"_75":320,"_43":275,"_35":36,"_184":40,"_185":24,"_37":321,"_39":26,"_78":79,"_187":322,"_80":30,"_188":-5,"_248":323,"_17":324},{"_33":311,"_13":312,"_75":313,"_43":275,"_35":36,"_184":40,"_185":24,"_37":314,"_39":26,"_78":79,"_187":315,"_80":30,"_188":-5,"_248":316,"_17":317},{"_33":304,"_13":305,"_75":306,"_43":275,"_35":36,"_184":40,"_185":24,"_37":307,"_39":26,"_78":79,"_187":308,"_80":30,"_188":-5,"_248":309,"_17":310},{"_33":295,"_13":296,"_75":297,"_43":275,"_35":36,"_184":298,"_185":24,"_37":299,"_39":300,"_78":79,"_187":301,"_80":30,"_188":-5,"_248":302,"_17":303},{"_33":288,"_13":289,"_75":290,"_43":275,"_35":36,"_184":40,"_185":24,"_37":291,"_39":26,"_78":79,"_187":292,"_80":30,"_188":-5,"_248":293,"_17":294},{"_33":281,"_13":282,"_75":283,"_43":275,"_35":36,"_184":40,"_185":24,"_37":284,"_39":26,"_78":79,"_187":285,"_80":30,"_188":-5,"_248":286,"_17":287},{"_33":272,"_13":273,"_75":274,"_43":275,"_35":36,"_184":40,"_185":24,"_37":276,"_39":26,"_78":79,"_187":277,"_80":30,"_188":-5,"_248":278,"_17":279},{"_33":264,"_13":265,"_75":266,"_43":183,"_35":36,"_184":139,"_185":24,"_37":267,"_39":268,"_78":79,"_187":269,"_80":30,"_188":-5,"_248":270,"_17":271},{"_33":260,"_13":259,"_75":254,"_43":-5,"_35":36,"_184":40,"_185":24,"_37":261,"_39":26,"_78":102,"_187":-5,"_80":30,"_188":-5,"_248":262,"_17":263},{"_33":251,"_13":252,"_75":253,"_43":254,"_35":36,"_184":40,"_185":24,"_37":255,"_39":26,"_78":79,"_187":256,"_80":30,"_188":-5,"_248":257,"_17":258},{"_33":243,"_13":244,"_75":245,"_43":-5,"_35":36,"_184":40,"_185":24,"_37":246,"_39":26,"_78":21,"_187":247,"_80":30,"_188":-5,"_248":249,"_17":250},"d18645f0-512e-11f0-9a15-f69ea79377d9","README.md","37b976f5-6ae2-4d65-9b39-ee94bc474b89",["D",1750792197393],"# Val Town + Pipedream Connect Integration\n\nThis application allows Val Town users to authenticate and connect to external services via Pipedream Connect.\n\n## Misc todos\n\n- [ ] Automatically include `\"includeSentViaPipedream\": false` for Discord and Slack\n- [ ] Replace Discord & Slack apps with our own https://pipedream.com/docs/connect/managed-auth/oauth-clients/#using-a-custom-oauth-client\n - [ ] I made one for discord, but am struggling to figure out where to supply the `oauthAppId`. I asked Pipedream.\n- [ ] Would be neat if you could scroll more in the list of connections or see a grid of the top 100 connections\n- [ ] How do we teach Townie how to use this?\n - [ ] search for potential actions (maybe their mcp can help?)\n- [ ] (Maybe) Help users connect trigger to val more directly than copying endpoint (via val town sdk)\n\n## Authentication\n\nThis app uses Val Town API tokens for authentication. (Eventually, we'll swap\nthis for Val Town OAuth.)\n\nTo login, create and supply a Val Town API token with the `user:read` scope only. We store it in cookies.\n\nTo run actions on connected apps, you'll also need to supply a Val Town API\ntoken. If you're doing this from within Val Town, you can use\n`process.env.valtown`, which this app's client libraries will use by default.","children",[],[244],"d18642e4-512e-11f0-9a15-f69ea79377d9","sdk.ts","c35f9340-325e-45cd-843a-76d18990c7be","05e7a966-b7a5-451d-8aff-e6491f1e2a5e",["D",1750792197393],"export async function actionRun(args: any) {\n const response = await fetch(\n \"https://pipedream.val.run/api/pipedream/action\",\n {\n method: \"POST\",\n body: JSON.stringify(args),\n headers: {\n Cookie: \"vt_api_key=\" + Deno.env.get(\"valtown\"),\n },\n },\n );\n return response.json();\n}\n\nexport async function proxyRun(args: any) {\n const response = await fetch(\n \"https://pipedream.val.run/api/pipedream/proxy\",\n {\n method: \"POST\",\n body: JSON.stringify(args),\n headers: {\n Cookie: \"vt_api_key=\" + Deno.env.get(\"valtown\"),\n },\n },\n );\n return response.json();\n}",[],[259,252],"sdk","d1864474-512e-11f0-9a15-f69ea79377d9",["D",1750792197393],[241],[259],"aa08fe34-513b-11f0-8129-f69ea79377d9","useQueryState.tsx","ff4204a4-5136-11f0-be3c-f69ea79377d9",["D",1750797714604],11,"import { useCallback, useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\n/**\n * useQueryState – JSON-backed useState that keeps its value in the URL\n * and always uses history.replaceState (never pushState).\n */\nexport function useQueryState(\n key: string,\n initialValue: T,\n): [T, (v: T | ((prev: T) => T)) => void] {\n const read = (): T => {\n const raw = new URLSearchParams(window.location.search).get(key);\n if (raw === null) return initialValue;\n try {\n return JSON.parse(raw) as T;\n } catch {\n return initialValue;\n }\n };\n\n const [state, setState] = useState(read);\n\n // sync when the user navigates back / forward\n useEffect(() => {\n const onPop = () => setState(read());\n window.addEventListener(\"popstate\", onPop);\n return () => window.removeEventListener(\"popstate\", onPop);\n }, []);\n\n const write = (value: T) => {\n const params = new URLSearchParams(window.location.search);\n\n if (value === undefined) params.delete(key);\n else params.set(key, JSON.stringify(value));\n\n const url = window.location.pathname\n + (params.toString() ? `?${params}` : \"\")\n + window.location.hash;\n\n history.replaceState(null, \"\", url);\n };\n\n const set = useCallback(\n (v: T | ((prev: T) => T)) =>\n setState(prev => {\n const next = typeof v === \"function\" ? (v as (p: T) => T)(prev) : v;\n write(next);\n return next;\n }),\n [],\n );\n\n return [state, set];\n}",[],[190,265],"d1863cfe-512e-11f0-9a15-f69ea79377d9","TriggersPage.tsx","e5ca8c10-c39a-4b53-b531-2c61420559f1","760748ad-4487-4239-ac88-bc345d38c0fd",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\nimport { Layout } from \"../components/Layout.tsx\";\n\nexport default function({ triggers, user }) {\n return (\n \n

Your Triggers

\n {!Array.isArray(triggers) || triggers.length === 0\n ? (\n

\n No triggers yet.\n

\n )\n : (\n

\n {triggers.map((trigger) => (\n \n

\n {trigger.configurable_props.find(x => x.type === \"app\")?.name || \"Unknown App\"}\n

\n \n View events\n \n

\n Created at: {trigger.created_at\n ? new Date(trigger.created_at * 1000).toLocaleDateString()\n : \"Unknown\"}\n

\n {\n if (\n !confirm(\n `Are you sure you want to delete the triggers ${trigger.app?.name || \"this app\"}?`,\n )\n ) {\n e.preventDefault();\n }\n }}\n >\n \n Delete\n \n \n

\n ))}\n \n )}\n \n );\n}",[],[190,280,273],"pages","d1863a24-512e-11f0-9a15-f69ea79377d9","TriggerEventsPage.tsx","2d4fbb3c-12ce-410a-ac3a-cf7de766b094",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\nimport { Layout } from \"../components/Layout.tsx\";\n\nexport default function({ trigger, events, user }) {\n return (\n \n

Trigger

\n {trigger.configurable_props.find(x => x.type === \"app\")?.name || \"Unknown App\"}\n

\n Created at: {trigger.created_at\n ? new Date(trigger.created_at * 1000).toLocaleString(\"en-US\", {\n timeZoneName: \"short\",\n })\n : \"Unknown\"}\n

\n Trigger JSON\n

\n          {JSON.stringify(trigger, null, 2)}\n

Events

\n {!Array.isArray(events) || events.length === 0\n ? (\n

\n No events yet.\n

\n )\n : (\n

\n {events.map((event) => (\n

\n Event at {new Date(event.ts).toLocaleString(\"en-US\", {\n timeZoneName: \"short\",\n })}\n

\n                    {JSON.stringify(event, null, 2)}\n

\n ))}\n

\n )}\n \n );\n}",[],[190,280,282],"d1863574-512e-11f0-9a15-f69ea79377d9","NewTriggerPage.tsx","5cc16997-bb51-4510-a716-5d39bb61d173",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n ComponentForm,\n FrontendClientProvider,\n SelectApp,\n SelectComponent,\n} from \"https://esm.sh/@pipedream/connect-react?deps=react@18.2.0,react-dom@18.2.0\";\nimport { createFrontendClient } from \"https://esm.sh/@pipedream/sdk/browser?deps=react@18.2.0,react-dom@18.2.0\";\nimport { toast } from \"https://esm.sh/react-toastify?deps=react@18.2.0,react-dom@18.2.0\";\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { AccountsList } from \"../components/AccountsList.tsx\";\nimport { Layout } from \"../components/Layout.tsx\";\n\nexport default function({ user }: { user: any }) {\n const [selectedApp, setSelectedApp] = useState();\n const [selectedComponent, setSelectedComponent] = useState();\n const [configuredProps, setConfiguredProps] = useState({});\n const [sdkErrors, setSdkErrors] = useState();\n const [dynamicProps, setDynamicProps] = useState();\n const [webhookUrl, setWebhookUrl] = useState(\"\");\n\n const frontendClient = createFrontendClient({\n environment: \"production\",\n externalUserId: user.id,\n tokenCallback: async () => {\n const resp = await fetch(\"/api/pipedream/token\", {\n method: \"POST\",\n });\n const data = await resp.json();\n return data;\n },\n });\n\n const handleComponentSubmit = async (ctx) => {\n try {\n const result = await frontendClient.deployTrigger({\n externalUserId: user.id,\n triggerId: selectedComponent!.key,\n configuredProps: ctx.configuredProps,\n webhookUrl,\n dynamicPropsId: dynamicProps?.id,\n });\n toast(\"Trigger created! Redirecting to the list of triggers...\");\n window.location.href = \"/triggers\";\n } catch (error) {\n setSdkErrors(error);\n }\n };\n\n return (\n \n \n

New Trigger

\n\n

\n \n 1. Select an App:\n \n {\n setSelectedApp(app);\n setSelectedComponent(null); // Reset component when app changes\n }}\n />\n

\n\n {selectedApp && (\n

\n \n 2. Select an Trigger\n \n {\n setSelectedComponent(comp);\n }}\n />\n

\n )}\n\n {selectedComponent && (\n

\n \n 3. Webhook URL to trigger:\n \n setWebhookUrl(e.target.value)}\n autoFocus\n />\n

\n )}\n\n {webhookUrl && selectedComponent && (\n

\n \n 4. Configure Trigger:\n \n

\n \n

\n )}\n

\n \n \n );\n}",[],[190,280,289],"d3c5be8a-5139-11f0-b6d4-f69ea79377d9","NewActionPage.tsx","bdc3cf3a-b23e-4c20-a9f9-51e97aaac27d",66,["D",1750796925629],40,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport {\n ComponentForm,\n FrontendClientProvider,\n SelectApp,\n SelectComponent,\n} from \"https://esm.sh/@pipedream/connect-react?deps=react@18.2.0,react-dom@18.2.0\";\nimport { createFrontendClient } from \"https://esm.sh/@pipedream/sdk/browser\";\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { useUrlSearchParams } from \"use-url-search-params\";\nimport { AccountsList } from \"../components/AccountsList.tsx\";\nimport { CodeSnippet } from \"../components/CodeSnippet.tsx\";\nimport { Layout } from \"../components/Layout.tsx\";\nimport { useQueryState } from \"../useQueryState.tsx\";\n\nexport const compactProps = (props = {}) =>\n Object.fromEntries(Object.entries(props).filter(([_, v]) => v !== \"\" && v !== null && v !== false));\n\nexport default function({ user }) {\n const [selectedApp, setSelectedApp] = useQueryState(\"app\", null);\n const [selectedComponent, setSelectedComponent] = useQueryState(\"component\", null);\n const [configuredProps, setConfiguredProps] = useQueryState(\"props\", {});\n const [sdkErrors, setSdkErrors] = useQueryState(\"err\", null);\n const [dynamicProps, setDynamicProps] = useQueryState(\"dyn\", null);\n\n const frontendClient = createFrontendClient({\n environment: \"production\",\n externalUserId: user.id,\n tokenCallback: async () => {\n const resp = await fetch(\"/api/pipedream/token\", {\n method: \"POST\",\n });\n const data = await resp.json();\n return data;\n },\n });\n const handleComponentSubmit = async (ctx) => {\n try {\n const result = await frontendClient.actionRun({\n externalUserId: user.id,\n actionId: selectedComponent!.key,\n configuredProps: ctx.configuredProps,\n dynamicPropsId: dynamicProps?.id,\n });\n } catch (error) {\n setSdkErrors(error);\n }\n };\n\n const code = `import { actionRun } from \"https://esm.town/v/valdottown/pipedream-connect/sdk/sdk.ts\";\n\n// Configured at ${window.location.href}\nconst result = await actionRun(${\n JSON.stringify(\n {\n actionId: selectedComponent?.key,\n configuredProps,\n dynamicPropsId: dynamicProps?.id,\n },\n null,\n 2,\n )\n });\n\nconsole.log(result);`;\n\n return (\n \n \n

New Action

\n\n

\n \n 1. Select an App:\n \n {\n setSelectedApp(app);\n setSelectedComponent(null); // Reset component when app changes\n }}\n />\n

\n\n {selectedApp && (\n

\n \n 2. Select an Action\n \n {\n setSelectedComponent(comp);\n }}\n />\n

\n )}\n\n {selectedComponent && (\n

\n \n 3. Configure Action:\n \n

\n setConfiguredProps(compactProps(props))}\n onUpdateDynamicProps={props => setDynamicProps(compactProps(props))}\n onSubmit={handleComponentSubmit}\n sdkResponse={sdkErrors}\n />\n

\n )}\n\n {selectedComponent && (\n

\n \n 4. Copy code to use in Val Town:\n \n

\n \n

\n )}\n

\n \n \n );\n}",[],[190,280,296],"d1862d22-512e-11f0-9a15-f69ea79377d9","LoginPage.tsx","50be7040-0da4-47ee-80d0-9a2c56d85fe9",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\nimport { useState } from \"https://esm.sh/react@18.2.0?\";\nimport { ExperimentalWarning } from \"../components/ExperimentalWarning.tsx\";\n\nexport default function({ onLogin }) {\n const [apiKey, setApiKey] = useState(\"\");\n const [isLoading, setIsLoading] = useState(false);\n const [error, onError] = useState(\"\");\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n setIsLoading(true);\n onError(\"\");\n try {\n const response = await fetch(\"/auth/login\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ apiKey }),\n });\n if (response.ok) window.location.href = \"/\";\n } catch (err) {\n console.error(err);\n onError(err.message);\n } finally {\n setIsLoading(false);\n }\n };\n\n return (\n

Val Town + Pipedream Connect

\n \n View source\n \n

\n Pipedream Connect{\" \"}\n provides managed authentication for thousands of services, such as Slack, Discord, Google, etc. This app gives\n Val Town users access to Pipedream's OAuth library.\n

\n \n

\n\n {error && (\n

\n {error}\n

\n )}\n\n

\n );\n}",[],[190,280,305],"d1862b9c-512e-11f0-9a15-f69ea79377d9","HomePage.tsx","f0b4f09b-4e10-420e-88a4-016d7f4458c1",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { ExperimentalWarning } from \"../components/ExperimentalWarning.tsx\";\nimport { Layout } from \"../components/Layout.tsx\";\nexport default function({ user }) {\n return (\n \n

\n Pipedream Connect{\" \"}\n provides managed authentication for thousands of services. This application provides Val Town users access to\n Pipedream's OAuth library. Click on your username in the top-right corner of this page to get started.\n

\n \n

\n \n );\n}",[],[190,280,312],"d18628a4-512e-11f0-9a15-f69ea79377d9","ConnectionsPage.tsx","c5ce7b97-1c39-4ef6-a531-297021157018",["D",1750792197393],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\nimport { Layout } from \"../components/Layout.tsx\";\n\nexport default function({ accounts, user }) {\n console.log(accounts);\n return (\n \n

Your Connected Accounts

\n {!Array.isArray(accounts) || accounts.length === 0\n ? (\n

\n No connected accounts yet.\n

\n )\n : (\n

\n {accounts.map((account) => (\n \n

\n {account.app?.name || \"Unknown App\"}\n

\n {account.name || \"Connected Account\"}\n

\n Connected: {account.created_at\n ? new Date(account.created_at).toLocaleDateString()\n : \"Unknown\"}\n

\n \n {account.app?.auth_type || \"Unknown\"}\n \n {\n if (\n !confirm(\n `Are you sure you want to delete the connection to ${account.app?.name || \"this app\"}?`,\n )\n ) {\n e.preventDefault();\n }\n }}\n >\n \n Delete\n \n \n

\n ))}\n \n )}\n \n );\n}",[],[190,280,319],"d1863fe2-512e-11f0-9a15-f69ea79377d9",["D",1750792197393],[232,233,234,235,236,237,238],[190,280],["D",1750792197393],[],[190,101,77],["D",1750792197393],[],[190,101,99],["D",1750792197393],[],[190,101,88],["D",1750792197393],[],[190,101,94],["D",1750792197393],[227,228,229,230],[190,101],"d1864154-512e-11f0-9a15-f69ea79377d9",["D",1750792197393],[226,231,239],[190],"35c2fc4a-5137-11f0-9673-f69ea79377d9","render-react-page.tsx","12fc5e65-dd8f-40b2-81b7-e5b4b1d3a437","9fc48bc6-b71e-4cd3-9ed3-87c39eaebf82",45,["D",1750795801529],12,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { renderToReadableStream } from \"npm:react-dom@18.2.0/server\";\nimport serialize from \"npm:serialize-javascript\";\n\nexport async function renderPage({\n pageModuleURL,\n props = {},\n status = 200,\n title = \"\",\n extraHeaders = {},\n}: {\n pageModuleURL: string;\n props?: Record;\n status?: number;\n title?: string;\n extraHeaders?: HeadersInit;\n}): Promise {\n const safeJson = serialize(props, { isJSON: true });\n const renderScript = `import React from 'https://esm.sh/react@18.2.0';\nimport { createRoot } from 'https://esm.sh/react-dom@18.2.0/client';\nimport Page from '${pageModuleURL}';\nconst data = JSON.parse(document.getElementById('__DATA__').textContent);\ncreateRoot(document.getElementById('root')).render(\n React.createElement(Page, data)\n);`;\n const stream = await renderToReadableStream(\n \n \n \n \n {title}\n \n \n \n

\n \n \n \n \n ,\n );\n\n return new Response(stream, {\n status,\n headers: {\n \"content-type\": \"text/html; charset=utf-8\",\n ...extraHeaders,\n },\n });\n}",[],[358,349],"backend","d1861422-512e-11f0-9a15-f69ea79377d9","pipedream.tsx","90aadcb3-eaf0-48ad-b917-207dba4e3a68",["D",1750792197393],"import { createBackendClient } from \"npm:@pipedream/sdk/server\";\nimport { Hono } from \"npm:hono\";\nimport { getCurrentUser } from \"./auth.tsx\";\n\nconst app = new Hono();\nexport { app as pipedream };\n\nexport const pd = createBackendClient({\n environment: Deno.env.get(\"PIPEDREAM_PROJECT_ENVIRONMENT\"),\n credentials: {\n clientId: Deno.env.get(\"PIPEDREAM_CLIENT_ID\"),\n clientSecret: Deno.env.get(\"PIPEDREAM_CLIENT_SECRET\"),\n },\n projectId: Deno.env.get(\"PIPEDREAM_PROJECT_ID\"),\n});\n\napp.post(\"/token\", async (c) => {\n const user = await getCurrentUser(c);\n if (!user) {\n return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n const data = await pd\n .createConnectToken({\n external_user_id: user.id,\n allowed_origins: [new URL(c.req.url).origin],\n });\n console.log(data);\n return c.json(data);\n});\n\n// Pipedream Action Proxy\n// Authenicate with Val Town Bearer Token\n// Actually runs the pipedream action\napp.post(\"/action\", async (c) => {\n const user = await getCurrentUser(c);\n if (!user) {\n return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n try {\n const args = await c.req.json();\n if (args.externalUserId) {\n // To be doubly sure of authentication\n return c.json({ error: \"Do not include externalUserId\" }, 400);\n }\n\n const result = await pd.actionRun({\n ...args,\n externalUserId: user.id,\n });\n\n return c.json(result);\n } catch (error) {\n console.error(\"Failed to execute action:\", error);\n return c.json({ error: \"Failed to execute action\" }, 500);\n }\n});\n\n// Pipedream Proxy Proxy\n// https://pipedream.com/docs/connect/api-proxy/\napp.post(\"/proxy\", async (c) => {\n const user = await getCurrentUser(c);\n if (!user) {\n return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n try {\n const args = await c.req.json();\n const result = await pd.makeProxyRequest({\n searchParams: {\n account_id: args.account_id,\n external_user_id: user.id,\n },\n }, args.fetch);\n\n return c.json(result);\n } catch (error) {\n console.error(\"Failed to execute action:\", error);\n return c.json({ error: \"Failed to execute action\" }, 500);\n }\n});\n\napp.post(\"/connections/:id/delete\", async (c) => {\n const user = await getCurrentUser(c);\n if (!user) {\n return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n const id = c.req.param(\"id\");\n const account = await pd.getAccountById(id);\n if (account.external_id !== user.id) {\n return c.json({ error: \"Not authorized\" }, 401);\n }\n await pd.deleteAccount(id);\n return c.redirect(\"/connections\");\n});\n\napp.post(\"/triggers/:id/delete\", async (c) => {\n const user = await getCurrentUser(c);\n if (!user) {\n return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n const id = c.req.param(\"id\");\n // TODO: confirm with Pipedream that this enforces the correct externalUserId\n await pd.deleteTrigger({\n externalUserId: user.id,\n id,\n });\n return c.redirect(\"/triggers\");\n});",[],[358,360],"d1860f2c-512e-11f0-9a15-f69ea79377d9","main.tsx","9878e949-2ba8-4d8e-b001-7994fa8b47a8",["D",1750792197393],"http","import { serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { auth, getCurrentUser } from \"./auth.tsx\";\nimport { pd, pipedream } from \"./pipedream.tsx\";\nimport { renderPage } from \"./render-react-page.tsx\";\n\nconst app = new Hono();\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path, import.meta.url));\n\napp.route(\"/auth\", auth);\napp.route(\"/api/pipedream\", pipedream);\n\nconst title = \"Pipedream x Val Town Connect\";\n\napp.use(\"*\", async (c, next) => {\n const user = await getCurrentUser(c);\n if (!user) {\n return renderPage({\n pageModuleURL: \"/frontend/pages/LoginPage.tsx\",\n title,\n });\n } else {\n c.set(\"user\", user);\n await next();\n }\n});\n\napp.get(\"/\", async (c) => {\n return renderPage({\n pageModuleURL: \"/frontend/pages/HomePage.tsx\",\n title,\n props: {\n user: c.get(\"user\"),\n },\n });\n});\n\napp.get(\"/actions/new\", async (c) => {\n return renderPage({\n pageModuleURL: \"/frontend/pages/NewActionPage.tsx\",\n title,\n props: {\n user: c.get(\"user\"),\n },\n });\n});\n\napp.get(\"/triggers-new\", async (c) => {\n return renderPage({\n pageModuleURL: \"/frontend/pages/NewTriggerPage.tsx\",\n title,\n props: {\n user: c.get(\"user\"),\n },\n });\n});\n\napp.get(\"/triggers\", async (c) => {\n const triggers = await pd.getTriggers({\n externalUserId: c.get(\"user\").id,\n });\n return renderPage({\n pageModuleURL: \"/frontend/pages/TriggersPage.tsx\",\n title,\n props: {\n user: c.get(\"user\"),\n triggers: triggers.data,\n },\n });\n});\n\napp.get(\"/triggers/:id/events\", async (c) => {\n const [trigger, events] = await Promise.all([\n pd.getTrigger({\n externalUserId: c.get(\"user\").id,\n id: c.req.param(\"id\"),\n }),\n pd.getTriggerEvents({\n externalUserId: c.get(\"user\").id,\n id: c.req.param(\"id\"),\n }),\n ]);\n return renderPage({\n pageModuleURL: \"/frontend/pages/TriggerEventsPage.tsx\",\n title,\n props: {\n user: c.get(\"user\"),\n trigger: trigger.data,\n events: events.data,\n },\n });\n});\n\napp.get(\"/connections\", async (c) => {\n const accounts = await pd.getAccounts({\n external_user_id: c.get(\"user\").id,\n include_credentials: false, // only works for oauth clients we own\n });\n return renderPage({\n pageModuleURL: \"/frontend/pages/ConnectionsPage.tsx\",\n title,\n props: {\n user: c.get(\"user\"),\n accounts: accounts.data,\n },\n });\n});\n\n// Unwrap and rethrow Hono errors as the original error\n// If you delete this, all errors will be \"Internal Server Error\"\napp.onError((err, c) => Promise.reject(err));\nexport default app.fetch;",[],[358,367],"d18607d4-512e-11f0-9a15-f69ea79377d9","auth.tsx","31c66b93-2cb7-4bfd-a8be-1cca8734f329",["D",1750792197393],"import { ValTown } from \"npm:@valtown/sdk\";\nimport { Hono } from \"npm:hono\";\nimport { deleteCookie, getCookie, setCookie } from \"npm:hono/cookie\";\n\n// in-memory cache\nconst users = {};\nasync function getValTownUser(apiKey: string) {\n if (users[apiKey]) return users[apiKey];\n try {\n const vt = new ValTown({ bearerToken: apiKey });\n const user = await vt.me.profile.retrieve();\n users[apiKey] = user;\n return user;\n } catch (error) {\n console.error(error);\n return null;\n }\n}\n\n// Helper function to get current user from cookie\nexport function getCurrentUser(c: any) {\n const apiKey = getCookie(c, \"vt_api_key\");\n console.log(\"Cookie check - API key found:\", !!apiKey);\n if (!apiKey) return null;\n return getValTownUser(apiKey);\n}\n\nconst app = new Hono();\nexport { app as auth };\n\n// Login endpoint\napp.post(\"/login\", async (c) => {\n const { apiKey } = await c.req.json();\n\n if (!apiKey) {\n return c.json({ error: \"API key is required\" }, 400);\n }\n\n const user = await getValTownUser(apiKey);\n\n if (!user) {\n return c.json({ error: \"Invalid Val Town API key\" }, 401);\n }\n\n // Set secure cookie with API key\n setCookie(c, \"vt_api_key\", apiKey, {\n httpOnly: true,\n secure: true,\n sameSite: \"Lax\", // Changed from Strict to Lax for better compatibility\n maxAge: 60 * 60 * 24 * 30, // 30 days\n path: \"/\", // Ensure cookie is available for all paths\n });\n\n return c.json({\n success: true,\n user: user,\n });\n});\n\n// Logout endpoint\napp.post(\"/logout\", (c) => {\n deleteCookie(c, \"vt_api_key\");\n return c.json({ success: true });\n});",[],[358,375],"d1861904-512e-11f0-9a15-f69ea79377d9",["D",1750792197393],[221,222,223,224],[358],["D",1747682234550],{"_11":12,"_154":82},{"_11":12,"_149":150,"_81":82,"_31":-5,"_151":152,"_153":24},{"_39":139,"_13":16,"_33":36,"_140":104,"_141":71,"_142":143,"_144":108,"_145":104,"_146":42,"_147":14,"_148":12},"ctx",{"_52":-5,"_174":422,"_423":424,"_425":426,"_427":30,"_428":30,"_429":30,"_430":24,"_431":-5,"_432":-7,"_433":-7,"_434":26,"_435":30,"_436":30,"_437":-5,"_438":30,"_439":30,"_440":30,"_441":-5},"ENV",{"_393":394,"_395":396,"_397":72,"_398":399,"_400":401,"_402":403,"_404":405,"_406":407,"_408":409,"_410":411,"_412":413,"_414":415,"_416":417,"_418":419,"_420":421},"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"]

History · components