[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_346":347,"_348":349},"routes/_app.x.$handle.$name",{"_98":97,"_33":47,"_107":88,"_28":108,"_13":14,"_109":-5,"_11":110,"_111":112,"_113":114,"_115":116,"_117":118,"_20":-5,"_119":-5,"_120":-5,"_121":27,"_122":123,"_124":25,"_125":-5,"_126":-5,"_127":128},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_45":46,"_33":47,"_40":48,"_49":-5,"_50":27,"_51":52,"_53":52,"_54":55,"_56":-5,"_18":57,"_58":59,"_60":25,"_61":25,"_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":27},"version",54,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":27,"_28":29,"_30":29},"file",{"_31":32,"_33":34,"_35":36,"_37":39,"_40":41,"_42":14,"_43":44,"_24":27},"previous",{"_31":32,"_33":34,"_35":36,"_37":38},"deleted",true,"deletedHere",false,"path","scratchpad/discord.tsx","latestPath","fileId","fa61a008-3817-11f0-972c-9e149126039e","name","discord.tsx","fileType","script","content","import { createBackendClient } from \"npm:@pipedream/sdk/server\";\n\nconst authProvisionId = \"apn_pxhxlwV\"; // val town discord server oauth by steve\nconst externalUserId = \"bb89e6f6-754a-445c-8647-65845a173c3e\"; // @valdottown val town account id\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\nconst resp = await pd.deployTrigger({\n externalUserId,\n id: \"discord-reaction-added\",\n configuredProps: {\n discord: {\n authProvisionId,\n channelId: \"1063180396931592192\", // val town bugs discord channel id\n },\n projectId: Deno.env.get(\"PIPEDREAM_PROJECT_ID\"),\n },\n webhookUrl: \"https://valdottown--320389c0381511f082029e149126039e.web.val.run\",\n});\n\nconsole.log(resp);","import { createBackendClient } from \"npm:@pipedream/sdk/server\";\n\nconst authProvisionId = \"apn_pxhxlwV\"; // val town discord server oauth'd by steve\nconst externalUserId = \"bb89e6f6-754a-445c-8647-65845a173c3e\"; // @valdottown val town account id\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\nconst resp = await pd.deployTrigger({\n externalUserId,\n id: \"discord-reaction-added\",\n configuredProps: {\n discord: {\n authProvisionId,\n channelId: \"1063180396931592192\", // val town bugs discord channel id\n },\n projectId: Deno.env.get(\"PIPEDREAM_PROJECT_ID\"),\n },\n webhookUrl: \"https://valdottown--320389c0381511f082029e149126039e.web.val.run\",\n});\n\nconsole.log(resp);","createdAt",["D",1749052021535],"branchVersion","branchId","df36932c-34e5-11f0-ba03-9e149126039e","id","df364c6e-34e5-11f0-ba03-9e149126039e","pipedream-connect",["D",1747682234550],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","OAuth to everything","imageUrl","bb89e6f6-754a-445c-8647-65845a173c3e","pinnedFileId","6d6d5536-34e6-11f0-a1d9-9e149126039e","pinPreview","pinMigrated","screenshotVersion","likeCount",0,"orgId","ba7bb5fb-1abb-4ffb-8f3d-7c244782e5f7","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_98":97,"_106":102},"org",{"_98":97,"_99":100,"_101":102,"_18":-5,"_103":104,"_105":25},"branch",{"_13":87,"_33":88,"_45":44,"_89":46,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":47,"_96":97},"isOwned",803,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","valdottown","handle","displayName","Val Town ","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJyWnQ5cFE0c3pleVRCSEVTWmxzaXJsTUlGciJ9","tier","business","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_45":46,"_33":47,"_40":342,"_49":-5,"_50":27,"_51":52,"_53":52,"_54":55,"_56":-5,"_18":57,"_58":59,"_60":25,"_61":25,"_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":343,"_82":344,"_84":345,"_86":27},"tree",[186,188,199,201,205,207],"files",[186,187,188,189,190,191,192,193,194,195,196,197,198,199,200,201,202,203,204,205,206,207],"counts",{"_175":64,"_176":177,"_178":161,"_179":180,"_181":182},"contents",[129,130,131,132,133,134],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_45":169,"_33":170,"_31":171,"_138":-5,"_43":44,"_42":172,"_140":25,"_40":173,"_13":161,"_35":149,"_37":-5,"_24":27,"_143":-5,"_28":174},{"_45":163,"_33":164,"_31":165,"_138":-5,"_43":44,"_42":166,"_140":25,"_40":167,"_13":161,"_35":149,"_37":-5,"_24":27,"_143":-5,"_28":168},{"_45":156,"_33":157,"_31":158,"_138":-5,"_43":44,"_42":159,"_140":27,"_40":160,"_13":161,"_35":149,"_37":-5,"_24":27,"_143":-5,"_28":162},{"_45":151,"_33":152,"_31":153,"_138":-5,"_43":44,"_42":139,"_140":27,"_40":154,"_13":64,"_35":149,"_37":-5,"_24":27,"_143":-5,"_28":155},{"_45":145,"_33":146,"_31":147,"_138":-5,"_43":44,"_42":139,"_140":27,"_40":148,"_13":64,"_35":149,"_37":-5,"_24":27,"_143":-5,"_28":150},{"_45":135,"_33":136,"_31":137,"_138":-5,"_43":44,"_42":139,"_140":27,"_40":141,"_13":64,"_35":20,"_37":142,"_24":27,"_143":-5,"_28":144},"fa6198ec-3817-11f0-972c-9e149126039e","README.md","fa619964-3817-11f0-972c-9e149126039e","parentId",52,"latest",["D",1748033608415],"# Val Town + Pipedream Connect Integration\n\nThis application allows Val Town users to authenticate and connect to external services via Pipedream Connect.\n\n## Features\n\n### ✅ Implemented (Part 1)\n\n1. **Val Town Authentication**\n - Login page for Val Town API key input\n - Secure cookie-based session storage\n - Server-side validation using Val Town SDK\n - User profile retrieval and display\n\n2. **Pipedream Integration**\n - Uses Val Town user ID as Pipedream external user ID\n - Automatic Pipedream connect token generation\n - Official Pipedream React components for app selection and workflow building\n - Configurable component type selection (Actions or Triggers)\n - Connected accounts management and display\n - Action and trigger execution with dynamic form generation\n\n3. **Security Features**\n - HTTP-only, secure cookies for API key storage\n - Server-side API key validation\n - Protected API endpoints requiring authentication\n\n## Project Structure\n\n```\n├── backend/\n│ ├── main.tsx # Main Hono server with auth & API routes\n│ └── scratch.tsx # Development/testing file\n├── frontend/\n│ ├── components/\n│ │ ├── Home.tsx # Main container component\n│ │ ├── LoginForm.tsx # Authentication form\n│ │ ├── Dashboard.tsx # Authenticated user dashboard with Pipedream components\n│ │ ├── AccountsList.tsx # Connected accounts display\n│ │ └── ErrorMessage.tsx # Reusable error display\n│ ├── index.html # HTML template with styling\n│ └── index.tsx # React app entry point\n├── shared/\n│ └── types.ts # Shared TypeScript interfaces\n├── reference/\n│ └── pipedream-connect.md # Pipedream Connect documentation\n└── README.md # This file\n```\n\n## API Endpoints\n\n### Authentication\n- `POST /api/login` - Authenticate with Val Town API key\n- `POST /api/logout` - Clear authentication session\n- `GET /api/user` - Get current authenticated user\n\n### Pipedream Integration\n- `GET /api/pipedream/token` - Get connect token for authenticated user\n- `GET /api/pipedream/accounts` - List user's connected accounts\n- `POST /api/pipedream/action` - Execute a Pipedream action\n- `POST /api/pipedream/trigger` - Execute a Pipedream trigger\n\n## Environment Variables Required\n\n```\nPIPEDREAM_CLIENT_ID=your_client_id\nPIPEDREAM_CLIENT_SECRET=your_client_secret\nPIPEDREAM_PROJECT_ID=your_project_id\nPIPEDREAM_PROJECT_ENVIRONMENT=development\n```\n\n## Usage Flow\n\n1. **Login**: User enters their Val Town API key\n2. **Validation**: Server validates key with Val Town API\n3. **Session**: API key stored in secure cookie\n4. **App Selection**: User chooses from available apps using Pipedream's SelectApp component\n5. **Component Type Selection**: User selects between Actions or Triggers\n6. **Component Configuration**: User selects and configures actions/triggers using Pipedream's ComponentForm\n7. **Execution**: Actions/triggers are executed directly through Pipedream SDK\n8. **Management**: User can view and manage connected accounts\n\n## Technical Implementation\n\n### Component Architecture\nThe frontend is now organized into focused, reusable components:\n\n- **Home.tsx**: Main container managing authentication state\n- **LoginForm.tsx**: Handles Val Town API key authentication\n- **Dashboard.tsx**: Main authenticated user interface with Pipedream React components\n- **AccountsList.tsx**: Display of connected accounts\n- **ErrorMessage.tsx**: Reusable error display with dismiss functionality\n\n### Authentication Flow\n1. User submits Val Town API key via form\n2. Server validates key using `@valtown/sdk`\n3. On success, API key stored in HTTP-only cookie\n4. User's Val Town ID used as Pipedream external user ID\n\n### Pipedream Integration\n1. Server creates connect tokens using user's Val Town ID\n2. Frontend uses official Pipedream React components for app selection and workflow building\n3. Users can select between Actions and Triggers via dropdown\n4. Connected accounts fetched and displayed\n5. Actions and triggers executed directly through Pipedream SDK with dynamic form generation\n\n### Security Considerations\n- API keys never exposed to client-side JavaScript\n- Secure, HTTP-only cookies with proper flags\n- Server-side validation for all protected endpoints\n- CORS handled automatically by Val Town platform\n\n## Next Steps (Future Parts)\n\n- **Part 2**: Action and trigger configuration\n- **Part 3**: Workflow builder interface\n- **Part 4**: Webhook handling and event processing\n- **Part 5**: Advanced features and monitoring\n\n## Development\n\nThe app is built for Val Town's serverless environment using:\n- **Backend**: Hono framework with TypeScript\n- **Frontend**: React 18 with TypeScript\n- **Authentication**: Val Town SDK + secure cookies\n- **Integration**: Pipedream Connect SDK\n\nTo test the authentication flow, you'll need a valid Val Town API key from:\nhttps://www.val.town/settings/api","label",[136],"fa61a74c-3817-11f0-972c-9e149126039e","shared","9441329a-1a83-4878-853a-9a3043896460",["D",1748033608415],"directory",[146],"fa61a5b2-3817-11f0-972c-9e149126039e","scratchpad","5f8258b8-a2cc-4934-8fc8-2b9914bda102",["D",1748033608415],[152],"02c30d2c-3804-11f0-8e9e-9e149126039e","reference","015a29ac-3804-11f0-a5b3-9e149126039e",47,["D",1748025032578],1,[157],"3ab12b04-34e6-11f0-9354-9e149126039e","frontend","399a029a-34e6-11f0-a8de-9e149126039e",2,["D",1747682388024],[164],"4181f08a-34e6-11f0-b465-9e149126039e","backend","3bc97898-34e6-11f0-9e62-9e149126039e",6,["D",1747682399458],[170],"pulls","branches",4,"forks","envVars",{"_183":177,"_185":64},"connections",{"_183":64,"_184":64},"count","unfilledCount","emptyCount",{"_45":169,"_33":170,"_31":171,"_138":-5,"_43":44,"_42":172,"_140":25,"_40":339,"_13":161,"_35":149,"_37":-5,"_24":27,"_143":-5,"_209":340,"_28":341},{"_45":331,"_33":332,"_31":59,"_138":171,"_43":44,"_42":139,"_140":27,"_40":333,"_13":334,"_35":237,"_37":335,"_24":27,"_143":336,"_209":337,"_28":338},{"_45":163,"_33":164,"_31":165,"_138":-5,"_43":44,"_42":166,"_140":25,"_40":328,"_13":161,"_35":149,"_37":-5,"_24":27,"_143":-5,"_209":329,"_28":330},{"_45":323,"_33":293,"_31":288,"_138":165,"_43":44,"_42":324,"_140":25,"_40":325,"_13":161,"_35":149,"_37":-5,"_24":27,"_143":-5,"_209":326,"_28":327},{"_45":316,"_33":317,"_31":318,"_138":288,"_43":44,"_42":139,"_140":27,"_40":319,"_13":64,"_35":36,"_37":320,"_24":27,"_143":-5,"_209":321,"_28":322},{"_45":309,"_33":310,"_31":311,"_138":288,"_43":44,"_42":139,"_140":27,"_40":312,"_13":64,"_35":36,"_37":313,"_24":27,"_143":-5,"_209":314,"_28":315},{"_45":302,"_33":303,"_31":304,"_138":288,"_43":44,"_42":139,"_140":27,"_40":305,"_13":64,"_35":36,"_37":306,"_24":27,"_143":-5,"_209":307,"_28":308},{"_45":294,"_33":295,"_31":296,"_138":288,"_43":44,"_42":139,"_140":27,"_40":297,"_13":298,"_35":36,"_37":299,"_24":27,"_143":-5,"_209":300,"_28":301},{"_45":285,"_33":286,"_31":287,"_138":288,"_43":44,"_42":139,"_140":27,"_40":289,"_13":64,"_35":36,"_37":290,"_24":27,"_143":-5,"_209":291,"_28":292},{"_45":281,"_33":280,"_31":275,"_138":165,"_43":44,"_42":139,"_140":27,"_40":282,"_13":64,"_35":149,"_37":-5,"_24":27,"_143":-5,"_209":283,"_28":284},{"_45":272,"_33":273,"_31":274,"_138":275,"_43":44,"_42":139,"_140":27,"_40":276,"_13":64,"_35":36,"_37":277,"_24":27,"_143":-5,"_209":278,"_28":279},{"_45":264,"_33":265,"_31":266,"_138":165,"_43":44,"_42":139,"_140":27,"_40":267,"_13":268,"_35":20,"_37":269,"_24":27,"_143":-5,"_209":270,"_28":271},{"_45":256,"_33":257,"_31":258,"_138":165,"_43":44,"_42":259,"_140":27,"_40":260,"_13":249,"_35":36,"_37":261,"_24":27,"_143":-5,"_209":262,"_28":263},{"_45":156,"_33":157,"_31":158,"_138":-5,"_43":44,"_42":159,"_140":27,"_40":253,"_13":161,"_35":149,"_37":-5,"_24":27,"_143":-5,"_209":254,"_28":255},{"_45":244,"_33":245,"_31":246,"_138":158,"_43":44,"_42":247,"_140":27,"_40":248,"_13":249,"_35":20,"_37":250,"_24":27,"_143":-5,"_209":251,"_28":252},{"_45":151,"_33":152,"_31":153,"_138":-5,"_43":44,"_42":139,"_140":27,"_40":241,"_13":64,"_35":149,"_37":-5,"_24":27,"_143":-5,"_209":242,"_28":243},{"_45":233,"_33":234,"_31":235,"_138":153,"_43":44,"_42":139,"_140":27,"_40":236,"_13":64,"_35":237,"_37":238,"_24":27,"_143":-5,"_209":239,"_28":240},{"_45":229,"_33":34,"_31":32,"_138":153,"_43":44,"_42":14,"_140":27,"_40":230,"_13":166,"_35":36,"_37":39,"_24":27,"_143":-5,"_209":231,"_28":232},{"_45":222,"_33":223,"_31":224,"_138":153,"_43":44,"_42":139,"_140":27,"_40":225,"_13":64,"_35":36,"_37":226,"_24":27,"_143":-5,"_209":227,"_28":228},{"_45":145,"_33":146,"_31":147,"_138":-5,"_43":44,"_42":139,"_140":27,"_40":219,"_13":64,"_35":149,"_37":-5,"_24":27,"_143":-5,"_209":220,"_28":221},{"_45":212,"_33":213,"_31":214,"_138":147,"_43":44,"_42":139,"_140":27,"_40":215,"_13":64,"_35":36,"_37":216,"_24":27,"_143":-5,"_209":217,"_28":218},{"_45":135,"_33":136,"_31":137,"_138":-5,"_43":44,"_42":139,"_140":27,"_40":208,"_13":64,"_35":20,"_37":142,"_24":27,"_143":-5,"_209":210,"_28":211},["D",1748033608415],"children",[],[136],"fa61a2ba-3817-11f0-972c-9e149126039e","types.ts","fa61a332-3817-11f0-972c-9e149126039e",["D",1748033608415],"export interface User {\n id: string;\n username: string;\n email?: string;\n}\n\nexport interface Account {\n id: string;\n app: {\n name_slug: string;\n name: string;\n description?: string;\n auth_type: string;\n };\n name?: string;\n created_at: string;\n}\n\nexport interface PipedreamTokenData {\n token: string;\n expires_at: string;\n connect_link_url: string;\n}\n\nexport interface InitialData {\n user: User | null;\n isAuthenticated: boolean;\n pipedream?: PipedreamTokenData;\n}",[],[146,213],["D",1748033608415],[206],[146],"fa61a148-3817-11f0-972c-9e149126039e","google-sheets.tsx","fa61a1c0-3817-11f0-972c-9e149126039e",["D",1748033608415],"import { createBackendClient } from \"npm:@pipedream/sdk/server\";\n\nconst account_id = \"apn_yghMOEY\"; // steve google sheets\nconst external_user_id = \"6092027c-c397-4bd1-b8d4-ee93ab0fbf33\"; // steve google sheets\nconst sheet_id = \"17Ai5I7FOTpdVownUNocc7ESgR9eQdyP6k3wTzqlrPbU\";\nconst range = \"A1:C1\"; // what you want to read\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\nconst resp = await pd.makeProxyRequest(\n {\n searchParams: {\n account_id,\n external_user_id,\n },\n },\n {\n url: `https://sheets.googleapis.com/v4/spreadsheets/${sheet_id}/values/${\n encodeURIComponent(range)\n }?majorDimension=ROWS`,\n options: {\n method: \"GET\",\n },\n },\n);\n\n// Parse and return the data you need\nconsole.log(resp);",[],[152,223],"27e22ace-415b-11f0-b654-76b3cceeab13",["D",1749052021535],[],[152,34],"fa619e0a-3817-11f0-972c-9e149126039e","discord-webhook.tsx","fa619e82-3817-11f0-972c-9e149126039e",["D",1748033608415],"http","export default async function (req: Request): Promise {\n return Response.json({ ok: true })\n}",[],[152,234],["D",1748033608415],[202,203,204],[152],"1d658a92-3804-11f0-9411-9e149126039e","pipedream-connect.md","03c89f70-3804-11f0-addf-9e149126039e",51,["D",1748025077260],3,"# Pipedream Connect Implementation Guide\n\n## Overview\n\nPipedream Connect allows you to embed OAuth and API key authentication flows into your application, enabling your users to connect their accounts from thousands of integrated apps.\n\n## Core Concepts\n\n### 1. External User ID\n- A unique identifier from YOUR system that identifies each user\n- Used to associate connected accounts with your users\n- Must be consistent across all API calls for the same user\n\n### 2. Connect Token\n- Short-lived, one-time use token for secure authentication\n- Generated server-side using your Pipedream credentials\n- Valid for a limited time (check `expires_at`)\n\n### 3. Apps and Components\n- **Apps**: Services like Google Sheets, Slack, etc. (identified by `name_slug`)\n- **Components**: Pre-built actions (e.g., \"add row to sheet\") and triggers\n- Components are identified by keys like `google_sheets-add-single-row`\n\n## Backend Implementation\n\n### Environment Variables Required\n```\nPIPEDREAM_CLIENT_ID=your_client_id\nPIPEDREAM_CLIENT_SECRET=your_client_secret\nPIPEDREAM_PROJECT_ID=your_project_id\nPIPEDREAM_PROJECT_ENVIRONMENT=development # or production\nPIPEDREAM_API_HOST=api.pipedream.com # optional\n```\n\n### Initialize Backend Client\n```ts\nimport { createBackendClient } from \"@pipedream/sdk/server\"\n\nconst backendClient = createBackendClient({\n projectId: process.env.PIPEDREAM_PROJECT_ID,\n environment: process.env.PIPEDREAM_PROJECT_ENVIRONMENT,\n credentials: {\n clientId: process.env.PIPEDREAM_CLIENT_ID,\n clientSecret: process.env.PIPEDREAM_CLIENT_SECRET,\n },\n apiHost: process.env.PIPEDREAM_API_HOST, // optional\n})\n```\n\n### Core Backend Operations\n\n#### 1. Generate Connect Token\n```ts\nconst tokenResponse = await backendClient.createConnectToken({\n external_user_id: \"user-123\", // Your user's ID\n allowed_origins: [\"https://yourdomain.com\"], // For CORS (optional)\n webhook_uri: \"https://yourdomain.com/webhooks\", // For triggers (optional)\n})\n\n// Returns:\n{\n token: \"connect_token_xxx\",\n connect_link_url: \"https://connect.pipedream.com/connect?token=xxx\",\n expires_at: \"2024-01-01T00:00:00Z\"\n}\n```\n\n#### 2. List User's Connected Accounts\n```ts\nconst accounts = await backendClient.getAccounts({\n external_user_id: \"user-123\",\n include_credentials: false, // Set true to get OAuth tokens (server-side only!)\n})\n\n// Returns array of connected accounts with app info\n```\n\n#### 3. Get Specific Account Details\n```ts\nconst account = await backendClient.getAccountById(\"account_id\", {\n include_credentials: true // Gets OAuth tokens for making API calls\n})\n```\n\n#### 4. Get App Information\n```ts\nconst appInfo = await backendClient.app(\"google_sheets\")\n// Returns app details including auth_type, name, etc.\n```\n\n#### 5. Execute Actions\n```ts\nconst result = await backendClient.actionRun({\n userId: \"user-123\",\n actionId: \"google_sheets-add-single-row\",\n configuredProps: {\n drive: \"drive_id\",\n spreadsheet: \"spreadsheet_id\",\n worksheet: \"worksheet_id\",\n row: { \"Column1\": \"Value1\", \"Column2\": \"Value2\" }\n },\n dynamicPropsId: \"optional_id\" // For dynamic form fields\n})\n```\n\n#### 6. Deploy Triggers\n```ts\nconst trigger = await backendClient.deployTrigger({\n userId: \"user-123\",\n triggerId: \"slack-new-message\",\n configuredProps: {\n channel: \"channel_id\"\n },\n webhookUrl: \"https://yourdomain.com/webhook/receive\",\n dynamicPropsId: \"optional_id\"\n})\n```\n\n## Frontend Implementation\n\n### Two Connection Methods\n\n#### Method 1: Connect Link (Simplest)\nNo JavaScript required - just redirect users to the connect URL:\n\n```ts\n// Server-side: Generate token and get connect_link_url\nconst { connect_link_url } = await backendClient.createConnectToken({\n external_user_id: \"user-123\"\n})\n\n// Add app parameter to the URL\nconst fullConnectUrl = `${connect_link_url}&app=google_sheets`\n\n// For custom OAuth clients, add:\nconst urlWithOAuth = `${fullConnectUrl}&oauthAppId=oa_xxxxx`\n\n// Redirect user to this URL\n```\n\n#### Method 2: Embedded SDK (JavaScript)\n```ts\nimport { createFrontendClient } from \"@pipedream/sdk/browser\"\n\n// Initialize client\nconst frontendClient = createFrontendClient({\n environment: \"development\", // or \"production\"\n externalUserId: \"user-123\",\n tokenCallback: async (opts) => {\n // Fetch token from your backend\n const response = await fetch(\"/api/pipedream/token\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ \n externalUserId: opts.externalUserId \n })\n })\n return response.json()\n }\n})\n\n// Connect an account (opens iframe)\nfrontendClient.connectAccount({\n app: \"google_sheets\",\n token: \"connect_token_xxx\", // From your backend\n oauthAppId: \"oa_xxxxx\", // Optional: custom OAuth client\n onSuccess: ({ id }) => {\n console.log(\"Account connected:\", id)\n // Save account ID, refresh account list, etc.\n }\n})\n```\n\n### Using React Components\n```ts\nimport { \n FrontendClientProvider, \n ComponentForm,\n SelectApp,\n SelectComponent \n} from \"@pipedream/connect-react\"\n\n// Wrap your app\n\n {/* Select an app */}\n setSelectedApp(app)}\n />\n \n {/* Select a component (action/trigger) */}\n setSelectedComponent(comp)}\n />\n \n {/* Render dynamic form for component */}\n {\n // Execute the action\n const result = await frontendClient.actionRun({\n userId: \"user-123\",\n actionId: selectedComponent.key,\n configuredProps\n })\n }}\n />\n\n```\n\n## Making API Requests with Connected Accounts\n\nOnce users have connected their accounts, you can make API requests on their behalf:\n\n```ts\n// 1. Get account with credentials (server-side only!)\nconst account = await backendClient.getAccountById(\"account_id\", {\n include_credentials: true\n})\n\n// 2. For OAuth apps:\nconst headers = {\n 'Authorization': `Bearer ${account.credentials.oauth_access_token}`\n}\n\n// 3. For Basic Auth apps:\nconst username = account.credentials.username // Field names vary by app\nconst password = account.credentials.password\nconst basicAuth = Buffer.from(`${username}:${password}`).toString('base64')\nconst headers = {\n 'Authorization': `Basic ${basicAuth}`\n}\n\n// 4. Make your API request\nconst response = await fetch(\"https://api.example.com/endpoint\", {\n headers\n})\n```\n\n## Webhook Handling for Triggers\n\nWhen deploying triggers, Pipedream will send events to your webhook URL:\n\n```ts\n// Your webhook endpoint\napp.post('/webhooks/pipedream', (req, res) => {\n const event = req.body\n \n // Event structure:\n {\n trigger_id: \"trigger_deployment_id\",\n event: {\n // Event-specific data\n },\n metadata: {\n // Additional context\n }\n }\n \n // Process the event\n processEvent(event)\n \n res.status(200).send('OK')\n})\n```\n\n## Component Properties\n\nComponents have configurable properties that can be:\n- Required or optional\n- Different types: string, integer, boolean, array, object, app (for account selection)\n- Dynamic: Some props depend on values of other props\n\nExample component configuration:\n```ts\n{\n drive: \"drive_id\", // App account reference\n spreadsheet: \"sheet_id\", // Dynamic: loaded based on drive\n worksheet: \"worksheet_id\", // Dynamic: loaded based on spreadsheet\n row: { // Object with column values\n \"Name\": \"John Doe\",\n \"Email\": \"john@example.com\"\n }\n}\n```\n\n## Testing Workflow\n\n1. Generate external user ID (or use existing user ID)\n2. Create connect token server-side\n3. User connects account via Connect Link or embedded SDK\n4. List user's connected accounts\n5. Select a component (action/trigger)\n6. Configure component properties\n7. Execute action or deploy trigger\n8. Handle results/events\n\nThis implementation pattern allows you to integrate thousands of apps into your platform while Pipedream handles the authentication, API complexity, and infrastructure.",[],[157,245],["D",1748025032578],[200],[157],"a9da974a-34e6-11f0-b615-9e149126039e","index.tsx","8855cee6-34e6-11f0-a974-9e149126039e",26,["D",1747682574523],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { Home } from \"./components/Home.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[164,257],"fa61b890-3817-11f0-972c-9e149126039e","index.html","8f915482-34e6-11f0-b615-9e149126039e",["D",1748033608415],5,"\n\n \n \n \n Val Town + Pipedream Connect\n \n \n

\n \n \n \n",[],[164,265],"fa619644-3817-11f0-972c-9e149126039e","auth.ts","fa6196c6-3817-11f0-972c-9e149126039e","cb9f25b6-f192-4c8d-8397-4d45cae135bc",["D",1748033608415],"// Authentication utilities for client-side storage\n// Fallback to localStorage if cookies don't work properly\n\nexport const AUTH_STORAGE_KEY = 'vt_auth_data';\n\nexport interface AuthData {\n apiKey: string;\n user: any;\n timestamp: number;\n}\n\nexport function saveAuthData(apiKey: string, user: any) {\n const authData: AuthData = {\n apiKey,\n user,\n timestamp: Date.now()\n };\n \n try {\n localStorage.setItem(AUTH_STORAGE_KEY, JSON.stringify(authData));\n return true;\n } catch (error) {\n console.error('Failed to save auth data:', error);\n return false;\n }\n}\n\nexport function getAuthData(): AuthData | null {\n try {\n const stored = localStorage.getItem(AUTH_STORAGE_KEY);\n if (!stored) return null;\n \n const authData: AuthData = JSON.parse(stored);\n \n // Check if data is older than 30 days\n const thirtyDaysMs = 30 * 24 * 60 * 60 * 1000;\n if (Date.now() - authData.timestamp > thirtyDaysMs) {\n clearAuthData();\n return null;\n }\n \n return authData;\n } catch (error) {\n console.error('Failed to get auth data:', error);\n return null;\n }\n}\n\nexport function clearAuthData() {\n try {\n localStorage.removeItem(AUTH_STORAGE_KEY);\n } catch (error) {\n console.error('Failed to clear auth data:', error);\n }\n}\n\nexport async function validateStoredAuth(): Promise<{ valid: boolean; user?: any }> {\n const authData = getAuthData();\n if (!authData) return { valid: false };\n \n try {\n // Validate the stored API key with the server\n const response = await fetch('/api/validate-key', {\n method: 'POST',\n headers: { 'Content-Type': 'application/json' },\n body: JSON.stringify({ apiKey: authData.apiKey })\n });\n \n if (response.ok) {\n const data = await response.json();\n return { valid: true, user: data.user };\n } else {\n clearAuthData();\n return { valid: false };\n }\n } catch (error) {\n console.error('Failed to validate stored auth:', error);\n return { valid: false };\n }\n}",[],[164,280,273],"utils","fa61a42c-3817-11f0-972c-9e149126039e",["D",1748033608415],[196],[164,280],"fa61919e-3817-11f0-972c-9e149126039e","LoginForm.tsx","fa619216-3817-11f0-972c-9e149126039e","43c67abe-34e6-11f0-ad7f-9e149126039e",["D",1748033608415],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\nimport type { User } from \"../../shared/types.ts\";\nimport { saveAuthData } from \"../utils/auth.ts\";\n\ninterface LoginFormProps {\n onLogin: (user: User) => void;\n onError: (error: string) => void;\n}\n\nexport function LoginForm({ onLogin, onError }: LoginFormProps) {\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(\"/api/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 \n // Save auth data to localStorage as fallback\n if (data.apiKey) {\n saveAuthData(data.apiKey, data.user);\n }\n \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}",[],[164,293,286],"components","fa61b2dc-3817-11f0-972c-9e149126039e","Home.tsx","4646f64c-34e6-11f0-ad7f-9e149126039e",["D",1748033608415],11,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { LoginForm } from \"./LoginForm.tsx\";\nimport { Dashboard } from \"./Dashboard.tsx\";\nimport { ErrorMessage } from \"./ErrorMessage.tsx\";\nimport type { User, InitialData } from \"../../shared/types.ts\";\nimport { validateStoredAuth, clearAuthData } from \"../utils/auth.ts\";\n\nexport function Home() {\n const [user, setUser] = useState(null);\n const [isAuthenticated, setIsAuthenticated] = useState(false);\n const [isCheckingAuth, setIsCheckingAuth] = useState(true);\n const [error, setError] = useState(\"\");\n const [pipedreamToken, setPipedreamToken] = useState(\"\");\n\n useEffect(() => {\n // Check initial authentication state from server\n const initialData = (window as any).__INITIAL_DATA__ as InitialData;\n if (initialData?.isAuthenticated && initialData?.user) {\n setUser(initialData.user);\n setIsAuthenticated(true);\n if (initialData.pipedream?.token) {\n setPipedreamToken(initialData.pipedream.token);\n }\n setIsCheckingAuth(false);\n } else {\n // If not authenticated from server, check if we have a valid session\n checkAuthStatus();\n }\n }, []);\n\n const checkAuthStatus = async () => {\n try {\n // First try server-side cookie authentication\n const response = await fetch(\"/api/user\");\n if (response.ok) {\n const data = await response.json();\n setUser(data.user);\n setIsAuthenticated(true);\n \n // Get Pipedream token\n const tokenResponse = await fetch(\"/api/pipedream/token\");\n const tokenData = await tokenResponse.json();\n if (tokenData.token) {\n setPipedreamToken(tokenData.token);\n }\n return;\n }\n \n // If server auth fails, try localStorage fallback\n const authResult = await validateStoredAuth();\n if (authResult.valid && authResult.user) {\n setUser(authResult.user);\n setIsAuthenticated(true);\n \n // Get Pipedream token using stored auth\n const tokenResponse = await fetch(\"/api/pipedream/token\");\n const tokenData = await tokenResponse.json();\n if (tokenData.token) {\n setPipedreamToken(tokenData.token);\n }\n }\n } catch (err) {\n // User is not authenticated, which is fine\n console.log(\"No valid session found\");\n } finally {\n setIsCheckingAuth(false);\n }\n };\n\n const handleLogin = async (userData: User) => {\n setUser(userData);\n setIsAuthenticated(true);\n \n // Get Pipedream token\n try {\n const tokenResponse = await fetch(\"/api/pipedream/token\");\n const tokenData = await tokenResponse.json();\n if (tokenData.token) {\n setPipedreamToken(tokenData.token);\n }\n } catch (err) {\n console.error(\"Failed to get Pipedream token:\", err);\n setError(\"Failed to initialize Pipedream connection\");\n }\n };\n\n const handleLogout = async () => {\n try {\n await fetch(\"/api/logout\", { method: \"POST\" });\n clearAuthData(); // Clear localStorage as well\n setUser(null);\n setIsAuthenticated(false);\n setPipedreamToken(\"\");\n setError(\"\");\n } catch (err) {\n console.error(\"Logout error:\", err);\n setError(\"Failed to logout properly\");\n }\n };\n\n const handleError = (errorMessage: string) => {\n setError(errorMessage);\n };\n\n const dismissError = () => {\n setError(\"\");\n };\n\n if (isCheckingAuth) {\n return (\n

Checking authentication...

\n \n

\n );\n }\n\n if (!isAuthenticated) {\n return (\n <>\n \n \n \n );\n }\n\n return (\n <>\n \n \n \n );\n}",[],[164,293,295],"fa618ec4-3817-11f0-972c-9e149126039e","ErrorMessage.tsx","fa618f50-3817-11f0-972c-9e149126039e",["D",1748033608415],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface ErrorMessageProps {\n error: string;\n onDismiss?: () => void;\n}\n\nexport function ErrorMessage({ error, onDismiss }: ErrorMessageProps) {\n if (!error) return null;\n\n return (\n \n {error}\n {onDismiss && (\n \n ×\n \n )}\n \n );\n}",[],[164,293,303],"fa617eca-3817-11f0-972c-9e149126039e","Dashboard.tsx","fa617f4c-3817-11f0-972c-9e149126039e",["D",1748033608415],"/** @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 type { Account, User } from \"../../shared/types.ts\";\nimport { AccountsList } from \"./AccountsList.tsx\";\n\ninterface DashboardProps {\n user: User;\n pipedreamToken: string;\n onLogout: () => void;\n onError: (error: string) => void;\n}\n\nexport function Dashboard({ user, pipedreamToken, onLogout, onError }: DashboardProps) {\n const [accounts, setAccounts] = useState([]);\n const [selectedApp, setSelectedApp] = useState(null);\n const [selectedComponent, setSelectedComponent] = useState(null);\n const [componentType, setComponentType] = useState<\"action\" | \"trigger\">(\"action\");\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 handleConnectionSuccess = () => {\n loadAccounts(); // Refresh the accounts list\n setSelectedApp(null); // Reset selection\n setSelectedComponent(null);\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 (configuredProps: any) => {\n try {\n const endpoint = componentType === \"action\" ? \"/api/pipedream/action\" : \"/api/pipedream/trigger\";\n const response = await fetch(endpoint, {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({\n [componentType === \"action\" ? \"actionId\" : \"triggerId\"]: selectedComponent.key,\n configuredProps,\n }),\n });\n\n const data = await response.json();\n\n if (!response.ok) {\n throw new Error(data.error || `Failed to execute ${componentType}`);\n }\n\n console.log(`${componentType} executed successfully:`, data.result);\n // You might want to show a success message or update the UI\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

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 handleComponentTypeChange(e.target.value as \"action\" | \"trigger\")}\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 {componentType === \"action\" ? \"an Action\" : \"a Trigger\"}:\n \n {\n setSelectedComponent(comp);\n console.log(comp);\n }}\n />\n

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

\n \n 4. Configure {componentType === \"action\" ? \"Action\" : \"Trigger\"}:\n \n \n console.log(x)}\n onUpdateDynamicProps={x => console.log(x)}\n enableDebugging={true}\n />\n

\n )}\n \n \n\n \n \n );\n}",[],[164,293,310],"fa61754c-3817-11f0-972c-9e149126039e","AccountsList.tsx","fa61761e-3817-11f0-972c-9e149126039e",["D",1748033608415],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport type { App, Account } from \"../../shared/types.ts\";\n\ninterface AccountsListProps {\n accounts: Account[];\n}\n\nexport function AccountsList({ accounts }: AccountsListProps) {\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

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

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

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

\n \n {account.app?.auth_type || \"Unknown\"}\n \n

\n ))}\n \n )}\n

\n );\n}",[],[164,293,317],"48823462-34e6-11f0-afbf-9e149126039e",10,["D",1747682411203],[190,191,192,193,194],[164,293],["D",1747682388024],[189,195,197,198],[164],"fa61aa80-3817-11f0-972c-9e149126039e","main.tsx",["D",1748033608415],7,"import { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { createBackendClient } from \"npm:@pipedream/sdk/server\";\nimport { ValTown } from \"npm:@valtown/sdk\";\nimport { Hono } from \"npm:hono\";\nimport { deleteCookie, getCookie, setCookie } from \"npm:hono/cookie\";\n\nconst app = new Hono();\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// Helper function to validate Val Town API key and get user info\nasync function validateValTownUser(apiKey: string) {\n try {\n const vt = new ValTown({ bearerToken: apiKey });\n const user = await vt.me.profile.retrieve();\n return { success: true, user };\n } catch (error) {\n console.log(error);\n return { success: false, error: error.message };\n }\n}\n\n// Helper function to get current user from cookie\nasync 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\n const result = await validateValTownUser(apiKey);\n return result.success ? { apiKey, user: result.user } : null;\n}\n\n// Login endpoint\napp.post(\"/api/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 validateValTownUser(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: false, // Set to false for development, true for production\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 apiKey, // Return API key for client-side storage as fallback\n });\n});\n\n// Validate API key endpoint (for client-side auth checking)\napp.post(\"/api/validate-key\", 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 validateValTownUser(apiKey);\n\n if (!result.success) {\n return c.json({ error: \"Invalid API key\" }, 401);\n }\n\n return c.json({\n success: true,\n user: result.user,\n });\n});\n\n// Logout endpoint\napp.post(\"/api/logout\", async c => {\n deleteCookie(c, \"vt_api_key\");\n return c.json({ success: true });\n});\n\n// Get current user endpoint\napp.get(\"/api/user\", async c => {\n const currentUser = await getCurrentUser(c);\n\n if (!currentUser) {\n return c.json({ error: \"Not authenticated\" }, 401);\n }\n\n return c.json({ user: currentUser.user });\n});\n\n// Get Pipedream connect token for authenticated user\napp.get(\"/api/pipedream/token\", 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 { token, expires_at, connect_link_url } = await pd.createConnectToken({\n external_user_id: currentUser.user.id,\n allowed_origins: [new URL(c.req.url).origin],\n });\n\n return c.json({ token, expires_at, connect_link_url });\n } catch (error) {\n return c.json({ error: \"Failed to create connect token\" }, 500);\n }\n});\n\n// Get user's Pipedream connections\napp.get(\"/api/pipedream/accounts\", 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 accounts = await pd.getAccounts({\n external_user_id: currentUser.user.id,\n include_credentials: false,\n });\n\n return c.json({ accounts: Array.isArray(accounts) ? accounts : [] });\n } catch (error) {\n console.error(\"Failed to fetch accounts:\", error);\n return c.json({ accounts: [], error: \"Failed to fetch accounts\" });\n }\n});\n\n// Execute Pipedream action\napp.post(\"/api/pipedream/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});\n\n// Execute Pipedream trigger\napp.post(\"/api/pipedream/trigger\", 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 { triggerId, configuredProps, dynamicPropsId } = await c.req.json();\n\n console.log({ triggerId, configuredProps, dynamicPropsId });\n\n return c.json({ result });\n } catch (error) {\n console.error(\"Failed to execute trigger:\", error);\n return c.json({ error: \"Failed to execute trigger\" }, 500);\n }\n});\n\n// Serve index.html at the root /\napp.get(\"/\", async c => {\n const currentUser = await getCurrentUser(c);\n\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n\n // Inject initial data\n const initialData = {\n user: currentUser?.user || null,\n isAuthenticated: !!currentUser,\n };\n\n // If user is authenticated, also get Pipedream token\n if (currentUser) {\n try {\n const { token, expires_at, connect_link_url } = await pd.createConnectToken({\n external_user_id: currentUser.user.id,\n allowed_origins: [new URL(c.req.url).origin],\n });\n initialData.pipedream = { token, expires_at, connect_link_url };\n } catch (error) {\n console.error(\"Failed to create Pipedream token:\", error);\n }\n }\n\n const dataScript = ``;\n\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// Add your API routes here\n// app.get(\"/api/data\", c => c.json({ hello: \"world\" }));\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) => {\n throw err;\n});\n\n// HTTP vals expect an exported \"fetch handler\"\n// This is how you \"run the server\" in Val Town with Hono\nexport default app.fetch;","pipedream",[],[170,332],["D",1747682399458],[187],[170],["D",1747682234550],{"_98":97,"_106":102},{"_98":97,"_99":100,"_101":102,"_18":-5,"_103":104,"_105":25},{"_13":87,"_33":88,"_45":44,"_89":46,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":-5,"_95":47,"_96":97},"ctx",{"_80":-5,"_126":379,"_380":381,"_382":383,"_384":27,"_385":27,"_386":27,"_387":25,"_388":-5,"_389":-7,"_390":-7,"_391":64,"_392":27,"_393":27,"_394":-5,"_395":27,"_396":27,"_397":27,"_398":-5},"ENV",{"_350":351,"_352":353,"_354":88,"_355":356,"_357":358,"_359":360,"_361":362,"_363":364,"_365":366,"_367":368,"_369":370,"_371":372,"_373":374,"_375":376,"_377":378},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","518c05f2c13b243481ef29134a5672756425e459","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 · v54