\n \n \n \n",[],[125,173],"c7b108f2-536e-11f0-a449-f69ea79377d9","LoginForm.tsx","1ce7334f-3c08-4cca-a088-25d7b07f217e","8949cedd-181a-4965-bd37-ffe5a24c1e17",["D",1751039570946],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\nimport { useState } from \"https://esm.sh/react@18.2.0?\";\n\nexport function LoginForm({ onLogin, onError }) {\n const [apiKey, setApiKey] = useState(\"\");\n const [isLoading, setIsLoading] = useState(false);\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n setIsLoading(true);\n onError(\"\"); // Clear any previous errors\n\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\n const data = await response.json();\n\n if (data.success) {\n setApiKey(\"\");\n onLogin(data.user);\n } else {\n onError(data.error || \"Login failed\");\n }\n } catch (err) {\n onError(\"Network error. Please try again.\");\n } finally {\n setIsLoading(false);\n }\n };\n\n return (\n

Val Town + Pipedream Connect

Please enter your Val Town API key to get started.

\n\n

\n );\n}",[],[125,187,180],"components","c7b10744-536e-11f0-a449-f69ea79377d9","Home.tsx","3f7b5ff5-6700-4c9e-ba4e-307389117eb4",["D",1751039570946],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\nimport { useState } from \"https://esm.sh/react@18.2.0?\";\nimport { Dashboard } from \"./Dashboard.tsx\";\nimport { ErrorMessage } from \"./ErrorMessage.tsx\";\nimport { LoginForm } from \"./LoginForm.tsx\";\n\nexport function Home({ user, pipedreamToken }) {\n const [error, setError] = useState(\"\");\n\n const handleLogout = async () => {\n await fetch(\"/auth/logout\", { method: \"POST\" });\n window.location.href = \"/\";\n };\n\n const handleError = (errorMessage: string) => {\n setError(errorMessage);\n };\n\n const dismissError = () => {\n setError(\"\");\n };\n\n if (!user) {\n return (\n <>\n \n console.log(x)} onError={handleError} />\n \n );\n }\n\n return (\n <>\n \n \n \n );\n}",[],[125,187,189],"c7b1051e-536e-11f0-a449-f69ea79377d9","ErrorMessage.tsx","7343ac5c-9a95-4303-9f4f-5f37fdd3e111",["D",1751039570946],"/** @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}",[],[125,187,196],"c7b0f362-536e-11f0-a449-f69ea79377d9","Dashboard.tsx","fe7eef6b-50cf-4b77-aa82-d2f13feb2c77",["D",1751039570946],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\nimport {\n ComponentForm\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 { AccountsList } from \"./AccountsList.tsx\";\n\nexport function Dashboard(\n { user, pipedreamToken, onLogout, onError },\n) {\n const [accounts, setAccounts] = useState([]);\n const [selectedApp, setSelectedApp] = useState(null);\n const [selectedComponent, setSelectedComponent] = useState(null);\n const [componentType, setComponentType] = useState<\"action\" | \"trigger\">(\n \"action\",\n );\n const [configuredProps, setConfiguredProps] = useState({});\n\n // Create Pipedream frontend client\n const frontendClient = createFrontendClient({\n environment: \"development\", // TODO: Make this configurable\n externalUserId: user.id,\n tokenCallback: async () => {\n // Return the token that was passed as a prop\n return { token: pipedreamToken };\n },\n });\n\n useEffect(() => {\n loadAccounts();\n }, []);\n\n const loadAccounts = async () => {\n try {\n // Load user's connected accounts\n const accountsResponse = await fetch(\"/api/pipedream/accounts\");\n const accountsData = await accountsResponse.json();\n if (accountsData.accounts && Array.isArray(accountsData.accounts)) {\n setAccounts(accountsData.accounts);\n } else {\n console.warn(\"Accounts data is not an array:\", accountsData);\n setAccounts([]);\n }\n } catch (err) {\n console.error(\"Failed to load accounts:\", err);\n onError(\"Failed to load accounts. Please try refreshing the page.\");\n setAccounts([]);\n }\n };\n\n const handleComponentTypeChange = (newType: \"action\" | \"trigger\") => {\n setComponentType(newType);\n setSelectedComponent(null); // Reset component when type changes\n };\n\n const handleComponentSubmit = async (ctx) => {\n try {\n if (componentType === \"action\" ) {\n const result = await frontendClient.actionRun({\n externalUserId: user.id,\n actionId: selectedComponent.key,\n configuredProps: ctx.configuredProps,\n })\n };\n // TODO trigger\n } catch (error) {\n console.error(`Failed to execute ${componentType}:`, error);\n onError(`Failed to execute ${componentType}: ${error.message}`);\n }\n };\n\n return (\n

\n \n

Pipedream Connect

Welcome, {user?.username}!

\n \n Logout\n \n \n\n \n

Connect Apps & Build Workflows

\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 Component Type:\n \n \n handleComponentTypeChange(\n e.target.value as \"action\" | \"trigger\",\n )}\n style={{\n width: \"100%\",\n padding: \"8px 12px\",\n border: \"1px solid #ddd\",\n borderRadius: \"4px\",\n fontSize: \"14px\",\n backgroundColor: \"white\",\n cursor: \"pointer\",\n }}\n >\n \n \n \n

\n )}\n\n {selectedApp && (\n

\n \n 3. Select{\" \"}\n {componentType === \"action\" ? \"an Action\" : \"a Trigger\"}:\n \n {\n setSelectedComponent(comp);\n }}\n />\n

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

\n \n 4. Configure{\" \"}\n {componentType === \"action\" ? \"Action\" : \"Trigger\"}:\n \n \n \n

\n                 const result = await frontendClient.actionRun(\n                {JSON.stringify({\n                    externalUserId: user.id,\n                    actionId: selectedComponent.key,\n                    configuredProps: configuredProps,\n                  }, null, 2)}\n                 )\n

\n )}\n \n \n\n \n \n );\n}",[],[125,187,203],"c7b0eeb2-536e-11f0-a449-f69ea79377d9","AccountsList.tsx","348e0b37-1ca8-4196-854a-1d1723cecf5f",["D",1751039570946],"/** @jsxImportSource https://esm.sh/react@18.2.0? */\nexport function AccountsList({ accounts }) {\n return (\n

Your Connected Accounts

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

\n No connected accounts yet. Connect an app above to get started.\n

\n )\n : (\n

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

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

\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 \n ))}\n \n )}\n

\n );\n}",[],[125,187,210],"c7b10d66-536e-11f0-a449-f69ea79377d9",["D",1751039570946],[152,153,154,155,156],[125,187],["D",1751039570946],[151,157,158],[125],"c7b0eb4c-536e-11f0-a449-f69ea79377d9","pipedream.tsx","ea128e0e-ef97-4d9d-abec-a1de4e680a9a",["D",1751039570946],"import { Hono } from \"npm:hono\";\nimport { createBackendClient } from \"npm:@pipedream/sdk/server\";\nimport { getCurrentUser } from \"./auth.tsx\";\n\nconst app = new Hono();\nexport { app as pipedream };\n\nconst 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\n// Get user's Pipedream connections\napp.get(\"/accounts\", async (c) => {\n const currentUser = await getCurrentUser(c);\n\n if (!currentUser) {\n return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n const accounts = await pd.getAccounts({\n external_user_id: currentUser.user.id,\n include_credentials: false,\n });\n\n return c.json({ accounts: accounts.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 currentUser = await getCurrentUser(c);\n\n if (!currentUser) {\n return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n try {\n const { actionId, configuredProps, dynamicPropsId } = await c.req.json();\n\n const result = await pd.actionRun({\n userId: currentUser.user.id,\n actionId,\n configuredProps,\n dynamicPropsId,\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});",[],[131,224],"c7b0e714-536e-11f0-a449-f69ea79377d9","main.tsx",["D",1751039570946],"http","import { readFile, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { createBackendClient } from \"npm:@pipedream/sdk/server\";\nimport { Hono } from \"npm:hono\";\nimport { auth, getCurrentUser } from \"./auth.tsx\";\nimport { pipedream } from \"./pipedream.tsx\";\n\nconst app = new Hono();\n\napp.route(\"/auth\", auth);\napp.route(\"/api/pipedream\", pipedream);\n\napp.get(\"/\", async (c) => {\n // Inject initial data\n // TODO - prevent XSS attack, do more escaping\n const user = await getCurrentUser(c);\n const initialData = { user };\n if (user) {\n initialData.pipedream = await pd\n .createConnectToken({\n external_user_id: user.id,\n allowed_origins: [new URL(c.req.url).origin],\n });\n }\n const dataScript = ``;\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n html = html.replace(\"\", `${dataScript}`);\n\n return c.html(html);\n});\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path, import.meta.url));\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;",[],[131,231],"c7b0de86-536e-11f0-a449-f69ea79377d9","auth.tsx","4243292f-b6cc-4c91-9aa5-ab29d4763da1",["D",1751039570946],"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 async 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 result = await validateVeaalTownUser(apiKey);\n\n if (!result.success) {\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: result.user,\n });\n});\n\n// Logout endpoint\napp.post(\"/logout\", (c) => {\n deleteCookie(c, \"vt_api_key\");\n return c.json({ success: true });\n});",[],[131,238],["D",1751039570946],[147,148,149],[131],["D",1751039570946],{"_16":17,"_82":78},{"_16":17,"_76":-5,"_77":78,"_32":33,"_79":80,"_81":26},{"_64":65,"_20":66,"_18":67,"_68":19,"_69":-5,"_70":-5,"_71":-5,"_72":-5,"_73":-5,"_74":21,"_75":17},"ctx",{"_57":-5,"_103":284,"_285":286,"_287":288,"_289":26,"_290":26,"_291":26,"_292":37,"_293":-5,"_294":-7,"_295":-7,"_296":41,"_297":26,"_298":26,"_299":-5,"_300":26,"_301":26,"_302":26,"_303":-5},"ENV",{"_255":256,"_257":258,"_259":66,"_260":261,"_262":263,"_264":265,"_266":267,"_268":269,"_270":271,"_272":273,"_274":275,"_276":277,"_278":279,"_280":281,"_282":283},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","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"]

Search