\n {block.heading_2?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n

\n {block.heading_3?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n

\n {block.bulleted_list_item?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n

\n {block.numbered_list_item?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n

\n \n \n {block.to_do?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n \n

\n \n {block.code?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n \n

\n Unsupported block type: {block.type}\n

{renderBlockContent()}

{value}

\n {Array.isArray(value) && value.map((item: string, i: number) => (\n \n {item}\n \n ))}\n

\n {value ? new Date(value).toLocaleDateString() : '-'}\n

\n );\n\n case 'url':\n return (\n \n {value}\n \n );\n\n case 'email':\n return (\n \n {value}\n \n );\n\n case 'phone_number':\n return (\n \n {value}\n \n );\n\n case 'status':\n return {value};\n\n default:\n return (\n \n Unsupported: {property.type}\n \n );\n }\n };\n\n return (\n

\n {name}: {renderValue()}\n

\n );\n}\n",[],[547,553,575],[547,553],{"_105":583,"_96":538,"_161":584,"_163":548,"_164":142,"_165":166,"_167":119,"_107":585,"_101":32,"_169":181,"_171":586,"_172":22,"_173":-5,"_174":587,"_99":588},"1cb97072-b360-11f0-bc6f-0224a6c84d84","019a26dc-99bf-7269-a8f6-463e83dc952c",["D",1761588582800],"# Frontend\n\nThis directory contains the React frontend for the Notion webhook integration application.\n\n## Structure\n\n- **index.html** - HTML shell that loads the React app\n- **index.tsx** - React app entry point\n- **components/** - React components\n - **App.tsx** - Main application component\n - **NotionBlock.tsx** - Renders Notion block content\n - **NotionProperty.tsx** - Displays Notion page properties\n\n## React Configuration\n\n**IMPORTANT**: All React files must:\n1. Include `/** @jsxImportSource https://esm.sh/react@18.2.0 */` at the top\n2. Pin React dependencies to version 18.2.0: `?deps=react@18.2.0`\n3. Use consistent React version across all imports\n\n## Styling\n\nUses Pico CSS (classless CSS framework loaded from CDN in index.html). Pico automatically styles semantic HTML elements without requiring CSS classes, keeping markup clean and maintainable.\n\n## API Communication\n\n- Fetch data from `/api/*` endpoints\n- Use shared types from `../shared/types.ts`\n- Handle loading and error states in components\n\n## Error Handling\n\nThe error catching script is included in index.html to capture client-side errors for better debugging.\n\n## Development\n\nSince this is a Val Town project, the frontend is served through Hono routes defined in `main.http.tsx`.\n",[],[547,538],{"_105":590,"_96":591,"_161":592,"_163":548,"_164":142,"_165":222,"_167":22,"_107":593,"_101":166,"_169":181,"_171":594,"_172":22,"_173":-5,"_174":595,"_99":596},"43d13ac0-b962-11f0-8efb-0224a6c84d84","index.html","019a26dc-99bf-7269-a8f6-489546010958",["D",1762249214392],"\n\n \n \n \n Todo Sweeper - Recent Pages\n\n \n \n \n\n \n \n \n \n

\n\n \n \n \n\n",[],[547,591],{"_105":598,"_96":599,"_161":600,"_163":548,"_164":142,"_165":166,"_167":119,"_107":601,"_101":32,"_169":205,"_171":602,"_172":22,"_173":-5,"_174":603,"_99":604},"1cb97342-b360-11f0-bc6f-0224a6c84d84","index.tsx","019a26dc-99bf-7269-a8f6-4e21b80e62ce",["D",1761588582800],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React from \"https://esm.sh/react@18.2.0\";\nimport ReactDOM from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = ReactDOM.createRoot(document.getElementById(\"root\")!);\nroot.render(\n \n \n \n);\n",[],[547,599],[547],{"_105":607,"_96":608,"_161":609,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":610,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":611,"_99":636},"1cb981de-b360-11f0-bc6f-0224a6c84d84","shared","019a26dc-99bf-7269-a8f6-63c6fd1d84b1",["D",1761588582800],[612,619,628],{"_105":613,"_96":538,"_161":614,"_163":609,"_164":142,"_165":166,"_167":119,"_107":615,"_101":32,"_169":181,"_171":616,"_172":22,"_173":-5,"_174":617,"_99":618},"1cb975e0-b360-11f0-bc6f-0224a6c84d84","019a26dc-99bf-7269-a8f6-57913e4eabdf",["D",1761588582800],"# Shared\n\nThis directory contains code shared between frontend (browser) and backend (Deno).\n\n## Files\n\n- **types.ts** - TypeScript interfaces and types\n - Controller response format\n - Notion data structures\n - API request/response types\n\n- **utils.ts** - Utility functions\n - Must work in both browser AND Deno\n - ❌ **NEVER use Deno APIs** (won't work in browser)\n - ✅ Only use standard JavaScript/TypeScript\n\n## Guidelines\n\n### Adding Types\n- Define interfaces for data shared between layers\n- Use clear, descriptive names (PascalCase)\n- Document complex types with comments\n\n### Adding Utils\n- Test that functions work in both environments\n- Avoid platform-specific APIs (Deno, Node, browser-only)\n- Use pure functions when possible\n\n## Example\n\n```typescript\n// ✅ Good - works everywhere\nexport function formatDate(date: string): string {\n return new Date(date).toLocaleDateString();\n}\n\n// ❌ Bad - Deno-specific\nexport function readConfig() {\n return Deno.env.get('CONFIG'); // Won't work in browser!\n}\n```\n",[],[608,538],{"_105":620,"_96":621,"_161":622,"_163":609,"_164":142,"_165":623,"_167":22,"_107":624,"_101":439,"_169":205,"_171":625,"_172":22,"_173":-5,"_174":626,"_99":627},"0e3f7b02-cc80-11f0-ade6-42dde27851f2","types.ts","019a26dc-99bf-7269-a8f6-5917ad49537e",51,["D",1764351081532],"/**\n * Shared TypeScript types and interfaces\n * These work in both frontend (browser) and backend (Deno)\n */\n\n/**\n * Standard response format for all controller functions\n */\nexport interface ControllerResponse {\n success: boolean;\n data: T | null;\n error: string | null;\n details?: string;\n}\n\n/**\n * Notion page response (simplified)\n * For full types, use @notionhq/client types in backend\n */\nexport interface NotionPage {\n id: string;\n object: 'page';\n created_time: string;\n last_edited_time: string;\n properties: Record;\n parent: {\n type: string;\n database_id?: string;\n page_id?: string;\n };\n url: string;\n}\n\n/**\n * Notion database response (simplified)\n */\nexport interface NotionDatabase {\n id: string;\n object: 'database';\n created_time: string;\n last_edited_time: string;\n title: Array<{\n type: string;\n plain_text: string;\n }>;\n properties: Record;\n}\n\n/**\n * Notion webhook payload\n */\nexport interface NotionWebhookPayload {\n type: 'page' | 'database';\n page?: NotionPage;\n database?: NotionDatabase;\n}\n\n/**\n * Common page properties (extend as needed)\n */\nexport interface PageProperties {\n [key: string]: any;\n}\n\n/**\n * API request/response types\n */\nexport interface UpdatePageRequest {\n properties: PageProperties;\n}\n\nexport interface CreatePageRequest {\n databaseId: string;\n properties: PageProperties;\n}\n\nexport interface PageResponse {\n page: NotionPage;\n}\n\nexport interface PagesListResponse {\n pages: NotionPage[];\n}\n\n/**\n * Faviconizer API response\n */\nexport interface FaviconizerResponse {\n domain: string;\n faviconUrl: string;\n success: boolean;\n source: string;\n contentType: string;\n}\n\n/**\n * Favicon update result\n */\nexport interface FaviconUpdateResult {\n success: boolean;\n iconUpdated?: boolean;\n errorNoteAdded?: boolean;\n successNoteAdded?: boolean;\n error?: string;\n details?: string;\n}\n\n/**\n * Todo search result\n */\nexport interface TodoSearchResult {\n success: boolean;\n blocksFound: number;\n blockIds: string[];\n error?: string;\n details?: string;\n}\n\n/**\n * Sync metadata for blob storage optimization\n */\nexport interface SyncMetadata {\n synced: boolean; // true = already synced, false = needs sync\n notion_page_id?: string; // Cached Notion page ID (avoids query on update)\n}\n\n/**\n * Reduced/transformed Notion block structure\n */\nexport interface ReducedNotionBlock {\n todo_string: string;\n block_id: string;\n block_url: string;\n page_url?: string; // Source page URL where the todo block was found\n parent_id?: string | null; // Parent block ID for traversal (null if parent is page)\n last_edited_time: string;\n people_mentions: Array<{\n id: string;\n name: string;\n email: string | null;\n }>;\n date_mentions: string[];\n link_mentions: Array<{\n text: string;\n url: string;\n }>;\n sync_metadata?: SyncMetadata; // Optional sync tracking metadata\n}\n\n/**\n * Blob storage save result\n */\nexport interface BlobSaveResult {\n success: boolean;\n key: string | null;\n error: string | null;\n}\n\n/**\n * Todo save to Notion result\n */\nexport interface TodoSaveResult {\n success: boolean;\n totalBlobs: number;\n pagesCreated: number;\n pagesUpdated: number;\n pagesSkipped: number;\n pagesFailed: number;\n failures: Array<{\n blockId: string;\n error: string;\n }>;\n error?: string;\n details?: string;\n}\n",[],[608,621],{"_105":629,"_96":630,"_161":631,"_163":609,"_164":142,"_165":222,"_167":119,"_107":632,"_101":166,"_169":205,"_171":633,"_172":22,"_173":-5,"_174":634,"_99":635},"43d13cc8-b962-11f0-8efb-0224a6c84d84","utils.ts","019a26dc-99bf-7269-a8f6-5e2af0c9fdd2",["D",1762249214392],"/**\n * Shared utility functions\n * IMPORTANT: These must work in both browser AND Deno (no Deno APIs allowed)\n */\n\n/**\n * Check if a string is a valid Notion page ID format\n */\nexport function isValidPageId(pageId: string): boolean {\n if (!pageId || typeof pageId !== 'string') {\n return false;\n }\n\n // Notion IDs are 32 characters (with or without hyphens)\n const cleanId = pageId.replace(/-/g, '');\n return cleanId.length === 32 && /^[a-f0-9]+$/i.test(cleanId);\n}\n\n/**\n * Normalize a Notion page ID (remove hyphens)\n */\nexport function normalizePageId(pageId: string): string {\n return pageId.replace(/-/g, '');\n}\n\n/**\n * Format a Notion page ID with hyphens in standard format\n * 8-4-4-4-12\n */\nexport function formatPageId(pageId: string): string {\n const clean = normalizePageId(pageId);\n return `${clean.slice(0, 8)}-${clean.slice(8, 12)}-${clean.slice(12, 16)}-${clean.slice(16, 20)}-${clean.slice(20)}`;\n}\n\n/**\n * Extract plain text from Notion rich text array\n */\nexport function getPlainText(richText: any[]): string {\n if (!Array.isArray(richText)) {\n return '';\n }\n return richText.map(text => text.plain_text || '').join('');\n}\n\n/**\n * Safely get a property value from Notion page properties\n */\nexport function getPropertyValue(properties: any, propertyName: string): any {\n const property = properties[propertyName];\n if (!property) {\n return null;\n }\n\n // Extract value based on property type\n switch (property.type) {\n case 'title':\n return getPlainText(property.title);\n case 'rich_text':\n return getPlainText(property.rich_text);\n case 'number':\n return property.number;\n case 'select':\n return property.select?.name || null;\n case 'multi_select':\n return property.multi_select?.map((s: any) => s.name) || [];\n case 'date':\n return property.date?.start || null;\n case 'checkbox':\n return property.checkbox;\n case 'url':\n return property.url;\n case 'email':\n return property.email;\n case 'phone_number':\n return property.phone_number;\n case 'status':\n return property.status?.name || null;\n default:\n return property;\n }\n}\n\n/**\n * Format an ISO timestamp to relative time\n * Examples: \"2 hours ago\", \"Yesterday\", \"3 days ago\"\n *\n * @param isoString - ISO 8601 timestamp string\n * @returns Human-readable relative time string\n */\nexport function formatRelativeTime(isoString: string): string {\n try {\n const date = new Date(isoString);\n const now = new Date();\n const diffMs = now.getTime() - date.getTime();\n const diffMinutes = Math.floor(diffMs / (1000 * 60));\n const diffHours = Math.floor(diffMs / (1000 * 60 * 60));\n const diffDays = Math.floor(diffMs / (1000 * 60 * 60 * 24));\n\n // Less than 1 minute\n if (diffMinutes < 1) {\n return \"Just now\";\n }\n\n // Less than 1 hour\n if (diffMinutes < 60) {\n return `${diffMinutes} minute${diffMinutes === 1 ? '' : 's'} ago`;\n }\n\n // Less than 24 hours\n if (diffHours < 24) {\n return `${diffHours} hour${diffHours === 1 ? '' : 's'} ago`;\n }\n\n // Less than 2 days (show \"Yesterday\")\n if (diffDays === 1) {\n return \"Yesterday\";\n }\n\n // Less than 7 days\n if (diffDays < 7) {\n return `${diffDays} days ago`;\n }\n\n // More than 7 days - show date\n return date.toLocaleDateString('en-US', {\n month: 'short',\n day: 'numeric',\n year: date.getFullYear() !== now.getFullYear() ? 'numeric' : undefined\n });\n\n } catch (err) {\n return isoString; // Fallback to original string\n }\n}\n",[],[608,630],[608],{"_105":638,"_96":639,"_161":640,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":641,"_101":32,"_169":181,"_171":642,"_172":22,"_173":-5,"_174":643,"_99":644},"1cb9830a-b360-11f0-bc6f-0224a6c84d84",".vtignore","019a26dc-99bf-7269-a8f6-6555ae856e94",["D",1761588582800],".git\n.vscode\n.cursorrules\n.DS_Store\nnode_modules\nvendor\nvars.env",[],[639],{"_105":646,"_96":647,"_161":648,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":649,"_101":32,"_169":181,"_171":650,"_172":22,"_173":-5,"_174":651,"_99":652},"1cb98422-b360-11f0-bc6f-0224a6c84d84","AGENTS.md","019a26dc-99bf-7269-a8f6-692ef14e0fe6",["D",1761588582800],"You are an advanced assistant specialized in generating Val Town code.\n\n## Core Guidelines\n\n- Ask clarifying questions when requirements are ambiguous\n- Provide complete, functional solutions rather than skeleton implementations\n- Test your logic against edge cases before presenting the final solution\n- Ensure all code follows Val Town's specific platform requirements\n- If a section of code that you're working on is getting too complex, consider refactoring it into subcomponents\n\n## Code Standards\n\n- Generate code in TypeScript or TSX\n- Add appropriate TypeScript types and interfaces for all data structures\n- Prefer official SDKs or libraries than writing API calls directly\n- Ask the user to supply API or library documentation if you are at all unsure about it\n- **Never bake in secrets into the code** - always use environment variables\n- Include comments explaining complex logic (avoid commenting obvious operations)\n- Follow modern ES6+ conventions and functional programming practices if possible\n\n## Types of triggers\n\n### 1. HTTP Trigger\n\n- Create web APIs and endpoints\n- Handle HTTP requests and responses\n- Example structure:\n\n```ts\nexport default async function (req: Request) {\n return new Response(\"Hello World\");\n}\n```\n\nFiles that are HTTP triggers have http in their name like `foobar.http.tsx`\n\n### 2. Cron Triggers\n\n- Run on a schedule\n- Use cron expressions for timing\n- Example structure:\n\n```ts\nexport default async function () {\n // Scheduled task code\n}\n```\n\nFiles that are Cron triggers have cron in their name like `foobar.cron.tsx`\n\n### 3. Email Triggers\n\n- Process incoming emails\n- Handle email-based workflows\n- Example structure:\n\n```ts\nexport default async function (email: Email) {\n // Process email\n}\n```\n\nFiles that are Email triggers have email in their name like `foobar.email.tsx`\n\n\n## Val Town Standard Libraries\n\nVal Town provides several hosted services and utility functions.\n\n### Blob Storage\n\n```ts\nimport { blob } from \"https://esm.town/v/std/blob\";\nawait blob.setJSON(\"myKey\", { hello: \"world\" });\nlet blobDemo = await blob.getJSON(\"myKey\");\nlet appKeys = await blob.list(\"app_\");\nawait blob.delete(\"myKey\");\n```\n\n### SQLite\n\n```ts\nimport { sqlite } from \"https://esm.town/v/stevekrouse/sqlite\";\nconst TABLE_NAME = 'todo_app_users_2';\n// Create table - do this before usage and change table name when modifying schema\nawait sqlite.execute(`CREATE TABLE IF NOT EXISTS ${TABLE_NAME} (\n id INTEGER PRIMARY KEY AUTOINCREMENT,\n name TEXT NOT NULL\n)`);\n// Query data\nconst result = await sqlite.execute(`SELECT * FROM ${TABLE_NAME} WHERE id = ?`, [1]);\n```\n\nNote: When changing a SQLite table's schema, change the table's name (e.g., add _2 or _3) to create a fresh table.\n\n### OpenAI\n\n```ts\nimport { OpenAI } from \"https://esm.town/v/std/openai\";\nconst openai = new OpenAI();\nconst completion = await openai.chat.completions.create({\n messages: [\n { role: \"user\", content: \"Say hello in a creative way\" },\n ],\n model: \"gpt-4o-mini\",\n max_tokens: 30,\n});\n```\n\n### Email\n\n```ts\nimport { email } from \"https://esm.town/v/std/email\";\n// By default emails the owner of the val\nawait email({ \n subject: \"Hi\", \n text: \"Hi\", \n html: \"

Hi

\"\n});\n```\n\n## Val Town Utility Functions\n\nVal Town provides several utility functions to help with common project tasks.\n\n### Importing Utilities\n\nAlways import utilities with version pins to avoid breaking changes:\n\n```ts\nimport { parseProject, readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n```\n\n### Available Utilities\n\n\n#### **serveFile** - Serve project files with proper content types\n\nFor example, in Hono:\n\n```ts\n// serve all files in frontend/ and shared/\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n```\n\n#### **readFile** - Read files from within the project:\n\n```ts\n// Read a file from the project\nconst fileContent = await readFile(\"/frontend/index.html\", import.meta.url);\n```\n\n#### **listFiles** - List all files in the project\n\n```ts\nconst files = await listFiles(import.meta.url);\n```\n\n#### **parseProject** - Extract information about the current project from import.meta.url\n\nThis is useful for including info for linking back to a val, ie in \"view source\" urls:\n\n```ts\nconst projectVal = parseProject(import.meta.url);\nconsole.log(projectVal.username); // Owner of the project\nconsole.log(projectVal.name); // Project name\nconsole.log(projectVal.version); // Version number\nconsole.log(projectVal.branch); // Branch name\nconsole.log(projectVal.links.self.project); // URL to the project page\n```\n\nHowever, it's *extremely importing* to note that `parseProject` and other Standard Library utilities ONLY RUN ON THE SERVER.\nIf you need access to this data on the client, run it in the server and pass it to the client by splicing it into the HTML page\nor by making an API request for it.\n\n## Val Town Platform Specifics\n\n- **Redirects:** Use `return new Response(null, { status: 302, headers: { Location: \"/place/to/redirect\" }})` instead of `Response.redirect` which is broken\n- **Images:** Avoid external images or base64 images. Use emojis, unicode symbols, or icon fonts/libraries instead\n- **AI Image:** To inline generate an AI image use: `

`\n- **Storage:** DO NOT use the Deno KV module for storage\n- **Browser APIs:** DO NOT use the `alert()`, `prompt()`, or `confirm()` methods\n- **Weather Data:** Use open-meteo for weather data (doesn't require API keys) unless otherwise specified\n- **View Source:** Add a view source link by importing & using `import.meta.url.replace(\"ems.sh\", \"val.town)\"` (or passing this data to the client) and include `target=\"_top\"` attribute\n- **Error Debugging:** Add `` to HTML to capture client-side errors\n- **Error Handling:** Only use try...catch when there's a clear local resolution; Avoid catches that merely log or return 500s. Let errors bubble up with full context\n- **Environment Variables:** Use `Deno.env.get('keyname')` when you need to, but generally prefer APIs that don't require keys\n- **Imports:** Use `https://esm.sh` for npm and Deno dependencies to ensure compatibility on server and browser\n- **Storage Strategy:** Only use backend storage if explicitly required; prefer simple static client-side sites\n- **React Configuration:** When using React libraries, pin versions with `?deps=react@18.2.0,react-dom@18.2.0` and start the file with `/** @jsxImportSource https://esm.sh/react@18.2.0 */`\n- Ensure all React dependencies and sub-dependencies are pinned to the same version\n- **Styling:** Default to using TailwindCSS via `` unless otherwise specified\n\n## Project Structure and Design Patterns\n\n### Recommended Directory Structure\n```\n├── backend/\n│ ├── database/\n│ │ ├── migrations.ts # Schema definitions\n│ │ ├── queries.ts # DB query functions\n│ │ └── README.md\n│ └── routes/ # Route modules\n│ ├── [route].ts\n│ └── static.ts # Static file serving\n│ ├── index.ts # Main entry point\n│ └── README.md\n├── frontend/\n│ ├── components/\n│ │ ├── App.tsx\n│ │ └── [Component].tsx\n│ ├── favicon.svg\n│ ├── index.html # Main HTML template\n│ ├── index.tsx # Frontend JS entry point\n│ ├── README.md\n│ └── style.css\n├── README.md\n└── shared/\n ├── README.md\n └── utils.ts # Shared types and functions\n```\n\n### Backend (Hono) Best Practices\n\n- Hono is the recommended API framework\n- Main entry point should be `backend/index.ts`\n- **Static asset serving:** Use the utility functions to read and serve project files:\n ```ts\n import { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n \n // serve all files in frontend/ and shared/\n app.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\n app.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n \n // For index.html, often you'll want to bootstrap with initial data\n app.get(\"/\", async c => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n \n // Inject data to avoid extra round-trips\n const initialData = await fetchInitialData();\n const dataScript = ``;\n \n html = html.replace(\"\", `${dataScript}`);\n return c.html(html);\n });\n ```\n- Create RESTful API routes for CRUD operations\n- Always include this snippet at the top-level Hono app to re-throwing errors to see full stack traces:\n ```ts\n // Unwrap Hono errors to see original error details\n app.onError((err, c) => {\n throw err;\n });\n ```\n\n### Database Patterns\n- Run migrations on startup or comment out for performance\n- Change table names when modifying schemas rather than altering\n- Export clear query functions with proper TypeScript typing\n\n## Common Gotchas and Solutions\n\n1. **Environment Limitations:** \n - Val Town runs on Deno in a serverless context, not Node.js\n - Code in `shared/` must work in both frontend and backend environments\n - Cannot use `Deno` keyword in shared code\n - Use `https://esm.sh` for imports that work in both environments\n\n2. **SQLite Peculiarities:**\n - Limited support for ALTER TABLE operations\n - Create new tables with updated schemas and copy data when needed\n - Always run table creation before querying\n\n3. **React Configuration:**\n - All React dependencies must be pinned to 18.2.0\n - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of React files\n - Rendering issues often come from mismatched React versions\n\n4. **File Handling:**\n - Val Town only supports text files, not binary\n - Use the provided utilities to read files across branches and forks\n - For files in the project, use `readFile` helpers\n\n5. **API Design:**\n - `fetch` handler is the entry point for HTTP vals\n - Run the Hono app with `export default app.fetch // This is the entry point for HTTP vals`\n\n",[],[647],{"_105":654,"_96":655,"_161":656,"_163":-5,"_164":142,"_165":166,"_167":22,"_107":657,"_101":32,"_169":181,"_171":658,"_172":22,"_173":-5,"_174":659,"_99":660},"1cb99142-b360-11f0-bc6f-0224a6c84d84","CLAUDE.md","019a26dc-99bf-7269-a8f6-6d9f40f7cf8b",["D",1761588582800],"# CLAUDE.md\n\nThis file provides project-specific guidance to Claude Code when working with this Val Town application.\n\n**Note**: For general Val Town platform guidelines, see `AGENTS.md`. This file contains architecture rules specific to THIS val.\n\n## Project Identity\n\nThis is a **Notion webhook integration application** that:\n- Receives webhooks from Notion when pages/databases change\n- Processes Notion data and integrates with external services (Firecrawler, etc.)\n- Saves processed results back to Notion\n- Provides a React frontend for viewing and managing Notion data\n\n## Scaffolding a New Val\n\nIf you're starting from scratch, follow these steps to scaffold the complete val structure:\n\n### 1. Create Directory Structure\n\n```bash\nmkdir -p backend/controllers backend/routes/api backend/routes/tasks backend/routes/views backend/services\nmkdir -p frontend/components\nmkdir -p shared\n```\n\n### 2. Create main.http.tsx (Hono Entry Point)\n\nCreate `main.http.tsx` with:\n- **IMPORTANT**: Use `.http.tsx` extension - this tells Val Town it's an HTTP trigger\n- Hono app initialization\n- Error unwrapper: `app.onError((err, c) => { throw err; })`\n- Static file serving for frontend and shared directories\n- Root route serving `frontend/index.html`\n- Commented route mounting examples\n- Export: `export default app.fetch`\n\n**Val Town Trigger Naming:**\n- HTTP triggers: `filename.http.tsx` (or `.http.ts`)\n- Cron triggers: `filename.cron.tsx`\n- Email triggers: `filename.email.tsx`\n\n### 3. Create Backend Service Files\n\nOrganize services by external API. For Notion, create a directory structure:\n\n**backend/services/notion/index.ts**:\n- Import Notion client: `import { Client } from \"npm:@notionhq/client@2\"`\n- Initialize and export client: `export const notion = new Client({ auth: Deno.env.get(\"NOTION_API_KEY\") })`\n- Re-export all functions from submodules:\n - `export * from \"./pages.ts\"`\n - `export * from \"./databases.ts\"`\n\n**backend/services/notion/pages.ts**:\n- Import shared client: `import { notion } from \"./index.ts\"`\n- Export page-related functions:\n - `getNotionPage(pageId)` - Fetch page by ID\n - `updateNotionPage(pageId, properties)` - Update page properties\n - `createNotionPage(databaseId, properties)` - Create new page\n - `getPageBlocks(pageId)` - Get page content blocks\n\n**backend/services/notion/databases.ts**:\n- Import shared client: `import { notion } from \"./index.ts\"`\n- Export database-related functions:\n - `queryNotionDatabase(databaseId, filter?, sorts?)` - Query database\n - `getNotionDatabase(databaseId)` - Get database info\n\n**Service function rules:**\n- All functions return `{success, data, error}` format\n- Catch errors and return error objects (don't throw)\n- Use the shared `notion` client from index.ts\n\n### 4. Create Backend Controller Files\n\n**backend/controllers/pageController.ts**:\n- Import Notion service: `import * as notionService from '../services/notion/index.ts'`\n- Export controller functions:\n - `getPage(pageId)` - Get page with validation\n - `updatePage(pageId, properties)` - Update with validation\n - `createPage(databaseId, properties)` - Create with validation\n - `getPageContent(pageId)` - Get blocks with validation\n- All functions return `{success, data, error, details?}` format\n- Include `filterSensitiveProperties()` helper to remove button properties\n- Validate inputs before calling services\n\n### 5. Create Authentication Middleware\n\n**backend/routes/authCheck.ts**:\n- Import Hono types: `import { Context, Next } from \"npm:hono@4\"`\n- Export `authCheck(c, next)` function:\n - Check for API key in `x-api-key` header\n - Compare with `Deno.env.get('API_KEY')`\n - Return 401 if invalid\n - Call `await next()` if valid\n- Export `verifyNotionWebhook(c, next)` for webhook signature verification\n\n### 6. Create Shared Types\n\n**shared/types.ts**:\n- Define `ControllerResponse` interface with `{success, data, error, details?}`\n- Define Notion types: `NotionPage`, `NotionDatabase`, `NotionWebhookPayload`\n- Define API types: `UpdatePageRequest`, `CreatePageRequest`, etc.\n- Use generic types that work in browser and Deno\n\n### 7. Create Shared Utils\n\n**shared/utils.ts**:\n- Export utility functions:\n - `isValidPageId(pageId)` - Validate Notion ID format\n - `normalizePageId(pageId)` - Remove hyphens\n - `formatPageId(pageId)` - Add hyphens in 8-4-4-4-12 format\n - `getPlainText(richText)` - Extract text from Notion rich text\n - `getPropertyValue(properties, name)` - Get value by property type\n- ONLY use standard JavaScript (no Deno or browser-specific APIs)\n\n### 8. Create Frontend Files\n\n**frontend/index.html**:\n- Include Pico CSS: ``\n- Include error catching: ``\n- Root div: `

`\n- Load React: ``\n\n**frontend/index.tsx**:\n- JSX import source: `/** @jsxImportSource https://esm.sh/react@18.2.0 */`\n- Import React and ReactDOM with pinned versions\n- Import App component\n- Render `` to root element\n\n**frontend/components/App.tsx**:\n- JSX import source and pinned React imports\n- Basic UI with example API call\n- State management for data fetching\n- Error and loading states\n\n**frontend/components/NotionBlock.tsx**:\n- Render different Notion block types (paragraph, heading, lists, code, etc.)\n- Use semantic HTML (Pico CSS provides automatic styling)\n\n**frontend/components/NotionProperty.tsx**:\n- Import `getPropertyValue` from shared/utils\n- Render different property types (title, select, date, checkbox, etc.)\n- Use semantic HTML (Pico CSS provides automatic styling)\n\n### 9. Create README Files\n\nCreate README.md in:\n- Project root - Overview and architecture\n- `backend/` - Backend structure and guidelines\n- `frontend/` - Frontend structure and React guidelines\n- `shared/` - Shared code guidelines\n\n### 10. Environment Variables\n\nDocument required environment variables:\n- `NOTION_API_KEY` - Notion integration token (required)\n- `API_KEY` - API authentication (optional)\n- `NOTION_WEBHOOK_SECRET` - Webhook verification (optional)\n- Add service-specific keys as needed (e.g., `FIRECRAWLER_API_KEY`)\n\n### 11. Verify Scaffold\n\nAfter scaffolding, verify:\n- ✅ All directories exist\n- ✅ main.http.tsx exports `app.fetch`\n- ✅ Service functions return `{success, data, error}`\n- ✅ Controller functions return `{success, data, error, details?}`\n- ✅ Frontend has JSX import source and pinned React versions\n- ✅ Shared code has no Deno/browser-specific APIs\n- ✅ README files explain each directory's purpose\n\n## Import Patterns\n\nThis val runs in different environments, so import patterns matter.\n\n### Backend Imports (Deno only)\n\nFor code that ONLY runs in the backend (controllers, services, routes, main.http.tsx):\n\n**Use `npm:` specifier:**\n```typescript\nimport { Hono } from \"npm:hono@4\";\nimport { Client } from \"npm:@notionhq/client@2\";\n```\n\n**Benefits:**\n- ✅ Modern Deno way\n- ✅ Faster resolution (no CDN roundtrip)\n- ✅ Better caching\n- ✅ More explicit about npm packages\n\n**Val Town utilities still use URLs:**\n```typescript\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n```\n\n### Frontend/Shared Imports (Browser compatible)\n\nFor code in `frontend/` and `shared/` that runs in the BROWSER:\n\n**Use `esm.sh` with version pins:**\n```typescript\n// Frontend React components\nimport { useState } from \"https://esm.sh/react@18.2.0?deps=react@18.2.0\";\n\n// Shared utilities (work in both browser and Deno)\nimport { getPropertyValue } from \"../../shared/utils.ts\";\n```\n\n**Why esm.sh for frontend:**\n- ✅ Works in browser (no `npm:` support)\n- ✅ CDN delivery for client-side\n- ✅ Automatic bundling and transpilation\n\n### Quick Reference\n\n| Location | Environment | Import Pattern | Example |\n|----------|-------------|----------------|---------|\n| `backend/` | Deno only | `npm:package@version` | `npm:hono@4` |\n| `main.http.tsx` | Deno only | `npm:package@version` | `npm:hono@4` |\n| `frontend/` | Browser | `https://esm.sh/package@version` | `https://esm.sh/react@18.2.0` |\n| `shared/` | Both | `https://esm.sh/package@version` | `https://esm.sh/date-fns@3` |\n| Val Town utils | Deno | `https://esm.town/v/...` | Val Town standard library |\n\n### Common Packages\n\n**Backend (use `npm:`):**\n- Hono: `npm:hono@4`\n- Notion: `npm:@notionhq/client@2`\n- Database drivers, server-only utilities\n\n**Frontend (use `esm.sh`):**\n- React: `https://esm.sh/react@18.2.0`\n- React DOM: `https://esm.sh/react-dom@18.2.0/client`\n- Browser-compatible libraries\n\n**Shared (use `esm.sh`):**\n- Date utilities: `https://esm.sh/date-fns@3`\n- Validation libraries: `https://esm.sh/zod@3`\n- Any package used in both frontend and backend\n\n## Strict MVC Architecture\n\nThis val follows a **3-layer architecture**. Every feature MUST follow this pattern. **NEVER skip layers**.\n\n```\nRequest → Route → Controller → Service → External API\n ↓\nResponse ← Format ← Standard Response ← Result\n```\n\n### Layer 1: Routes (`backend/routes/`)\n\n**Location:**\n- `routes/api/` - API endpoints for data operations\n- `routes/tasks/` - Notion webhook handlers\n- `routes/views/` - User-facing HTML/React views\n\n**Responsibility: HTTP ONLY**\n- Extract request parameters (query, body, headers)\n- Apply authentication middleware from `authCheck.ts`\n- Call controller functions\n- Format controller responses into HTTP responses\n- Map success/error to HTTP status codes\n\n**Rules:**\n- ❌ NO business logic in routes\n- ❌ NEVER call services directly from routes\n- ✅ Routes are thin wrappers around controllers\n- ✅ Always return proper HTTP responses with status codes:\n - `200` - Success\n - `400` - Validation errors, bad request\n - `401` - Authentication failures\n - `500` - Server/external service errors\n\n**Example pattern:**\n```typescript\napp.post('/api/tasks/:id', async (c) => {\n const pageId = c.req.param('id');\n const body = await c.req.json();\n\n const result = await pageController.updatePage(pageId, body);\n\n if (!result.success) {\n return c.json({ error: result.error, details: result.details }, 400);\n }\n\n return c.json(result.data);\n});\n```\n\n### Layer 2: Controllers (`backend/controllers/`)\n\n**Responsibility: Business logic and orchestration**\n- Validate request data\n- Orchestrate multiple service calls\n- Transform and filter data\n- Remove sensitive information\n\n**IMPORTANT: Work with Notion pages generically**\n- The fundamental object in Notion is a **page** (not task, project, etc.)\n- Controllers and services should use `pageId` and work with any Notion page\n- Routes can be domain-specific (e.g., `/api/tasks/:id`), but they should call generic page controllers\n- This allows the architecture to handle any type of Notion page (tasks, projects, notes, etc.)\n\n**MUST return this exact structure:**\n```typescript\n{\n success: boolean,\n data: any | null,\n error: string | null,\n details?: string // Additional error context\n}\n```\n\n**Rules:**\n- ❌ NEVER return HTTP responses (controllers are HTTP-agnostic)\n- ❌ NEVER call external APIs directly\n- ✅ Always call service layer functions\n- ✅ Return standardized response structure\n- ✅ Validate all input data\n- ✅ Filter sensitive data (e.g., button properties)\n\n**Example pattern:**\n```typescript\nexport async function updatePage(pageId: string, properties: any) {\n // Validate\n if (!pageId || !properties) {\n return {\n success: false,\n data: null,\n error: \"Invalid input\",\n details: \"pageId and properties are required\"\n };\n }\n\n // Call service\n const result = await notionService.updatePage(pageId, properties);\n\n if (!result.success) {\n return {\n success: false,\n data: null,\n error: \"Failed to update page\",\n details: result.error\n };\n }\n\n return {\n success: true,\n data: result.data,\n error: null\n };\n}\n```\n\n### Layer 3: Services (`backend/services/`)\n\n**Responsibility: External API calls ONLY**\n- Make HTTP requests to external APIs\n- Handle API authentication\n- Parse and normalize API responses\n- Manage retries and API-specific error handling\n\n**Create services for:**\n- Notion API (`notionService.ts`)\n- Firecrawler (`firecrawlerService.ts`)\n- Val Town blob storage (`blobService.ts`)\n- Any other external service\n\n**Rules:**\n- ✅ Return structured results with `{success, data, error}`\n- ✅ Handle all API errors gracefully (don't throw)\n- ✅ Use environment variables for API keys\n- ✅ Export typed functions\n\n**Example pattern:**\n```typescript\nexport async function getNotionPage(pageId: string) {\n try {\n const notion = new Client({ auth: Deno.env.get('NOTION_API_KEY') });\n const page = await notion.pages.retrieve({ page_id: pageId });\n\n return {\n success: true,\n data: page,\n error: null\n };\n } catch (err) {\n return {\n success: false,\n data: null,\n error: err.message\n };\n }\n}\n```\n\n## Adding New Endpoints - Step-by-Step\n\nWhen asked to \"build a /tasks/ endpoint\" or any new feature, follow this checklist:\n\n1. ✅ **Create route file** in appropriate directory:\n - Webhook handlers → `routes/tasks/`\n - API endpoints → `routes/api/`\n - Views → `routes/views/`\n\n2. ✅ **Extract request data** in route (params, query, body)\n\n3. ✅ **Apply authentication** if needed using `authCheck.ts` middleware\n\n4. ✅ **Create controller function** in `backend/controllers/[feature].ts`\n - Implement validation\n - Implement business logic\n - Orchestrate service calls\n\n5. ✅ **Create/update service functions** in `backend/services/[service].ts`\n - Make external API calls\n - Return `{success, data, error}` structure\n\n6. ✅ **Return standardized response** from controller\n\n7. ✅ **Format HTTP response** in route based on controller result\n\n8. ✅ **Add TypeScript types** to `shared/types.ts` if data is shared across layers\n\n9. ✅ **Import route** into `main.http.tsx` and mount on Hono app\n\n10. ✅ **Test the endpoint** with curl or similar tool\n\n## Notion Integration Patterns\n\n### Webhook Handlers (`routes/tasks/`)\n\nAll Notion webhooks live in `routes/tasks/`. When creating webhook handlers:\n\n- Validate webhook signature/authentication\n- Extract Notion event data\n- Call appropriate controller\n- Return `200` status quickly (webhooks timeout)\n- Use async processing for slow operations\n\n### Notion Service Functions\n\nCreate dedicated service functions for common Notion operations:\n\n```typescript\n// backend/services/notionService.ts\n\nexport async function getNotionPage(pageId: string) { /* ... */ }\nexport async function updateNotionPage(pageId: string, properties: any) { /* ... */ }\nexport async function queryNotionDatabase(databaseId: string, filter?: any) { /* ... */ }\nexport async function createNotionPage(databaseId: string, properties: any) { /* ... */ }\n```\n\n**Always:**\n- Use official Notion SDK: `https://esm.sh/@notionhq/client`\n- Use environment variable: `Deno.env.get('NOTION_API_KEY')`\n- Return standardized `{success, data, error}` structure\n\n## External Service Integration Pattern\n\n### For Simple Services (Single File)\n\nWhen integrating a simple external service (like Firecrawler):\n\n1. **Create service file**: `backend/services/[serviceName].ts`\n\n2. **Initialize client and export typed functions**:\n```typescript\nimport { SomeClient } from \"npm:some-client@1\";\n\nexport const client = new SomeClient({ apiKey: Deno.env.get('SERVICE_API_KEY') });\n\nexport async function fetchFromService(params: ServiceParams) {\n try {\n const result = await client.fetch(params);\n return { success: true, data: result, error: null };\n } catch (err: any) {\n return { success: false, data: null, error: err.message };\n }\n}\n```\n\n### For Complex Services (Directory Structure)\n\nWhen integrating a complex service with multiple concerns (like Notion with pages, databases, blocks):\n\n1. **Create service directory**: `backend/services/[serviceName]/`\n\n2. **Create index.ts** - Initialize client and re-export:\n```typescript\nimport { Client } from \"npm:@servicename/client@2\";\n\nexport const client = new Client({ auth: Deno.env.get(\"SERVICE_API_KEY\") });\n\nexport * from \"./pages.ts\";\nexport * from \"./databases.ts\";\n```\n\n3. **Create feature files** - Import shared client:\n```typescript\n// backend/services/notion/pages.ts\nimport { client } from \"./index.ts\";\n\nexport async function getPage(id: string) {\n try {\n const result = await client.pages.get(id);\n return { success: true, data: result, error: null };\n } catch (err: any) {\n return { success: false, data: null, error: err.message };\n }\n}\n```\n\n### Service Rules\n\n- **Store API keys in environment**: `Deno.env.get('SERVICE_API_KEY')`\n- **Handle errors gracefully**: Return error objects, don't throw\n- **Add types to `shared/types.ts`** if data is used across layers\n- **Call service from controller**, never from routes\n- **One client instance**: Initialize once, reuse everywhere\n\n## File Organization\n\n### Naming Conventions\n\n- **Files**: camelCase (e.g., `notionService.ts`, `pageController.ts`)\n- **Functions**: camelCase, verb-first (e.g., `getNotionPage`, `updatePage`)\n- **Types/Interfaces**: PascalCase (e.g., `NotionWebhookPayload`, `PageResponse`)\n- **Routes**: kebab-case URLs (e.g., `/api/notion-tasks`, `/tasks/webhook-handler`)\n\n### File Placement\n\n- **Controllers**: Use generic page controllers\n - `pageController.ts` - Generic Notion page operations (get, update, create)\n - `webhookController.ts` - Webhook processing logic\n - Note: Controllers should work with `pageId` generically, not task/project-specific\n\n- **Services**: Organize by external API\n - For complex services, use directories:\n - `notion/` - Notion API integration\n - `index.ts` - Client initialization and re-exports\n - `pages.ts` - Page operations\n - `databases.ts` - Database operations\n - For simple services, use single files:\n - `firecrawlerService.ts` - Firecrawler integration\n - `blobService.ts` - Val Town blob storage\n\n- **Routes**: Organize by purpose\n - `routes/api/` - RESTful API endpoints (`/api/tasks`, `/api/tasks/:id`)\n - `routes/tasks/` - Webhook handlers (`/tasks/notion-webhook`)\n - `routes/views/` - User-facing pages (`/views/dashboard`)\n\n- **Shared**: Cross-layer code\n - `shared/types.ts` - TypeScript interfaces\n - `shared/utils.ts` - Pure utility functions (work in browser AND Deno)\n\n## Error Handling Strategy\n\n**Services**: Return errors, don't throw\n```typescript\nreturn { success: false, data: null, error: \"API call failed\" };\n```\n\n**Controllers**: Add context to service errors\n```typescript\nif (!result.success) {\n return {\n success: false,\n data: null,\n error: \"Failed to update page\",\n details: result.error\n };\n}\n```\n\n**Routes**: Map to HTTP status codes\n```typescript\nif (!result.success) {\n return c.json({ error: result.error, details: result.details }, 400);\n}\n```\n\n**Add to main.http.tsx**: Hono error unwrapper for better stack traces\n```typescript\napp.onError((err, c) => {\n throw err;\n});\n```\n\n## Authentication Rules\n\n- Auth middleware lives in `routes/authCheck.ts`\n- Apply to protected routes using Hono middleware pattern\n- Extract and validate API keys, tokens, or webhook signatures\n- Return `401` for authentication failures\n\n**Example:**\n```typescript\nimport { authCheck } from './authCheck.ts';\n\napp.post('/api/protected', authCheck, async (c) => {\n // Protected route logic\n});\n```\n\n## Frontend Integration\n\n### Structure\n\n- `frontend/index.html` - HTML shell\n- `frontend/index.tsx` - React entry point\n- `frontend/components/App.tsx` - Main component\n- `frontend/components/NotionBlock.tsx` - Notion block renderer\n- `frontend/components/NotionProperty.tsx` - Property display\n\n### React Rules\n\n**ALWAYS:**\n- Use React 18.2.0 with pinned dependencies\n- Include at top of file: `/** @jsxImportSource https://esm.sh/react@18.2.0 */`\n- Pin all React deps: `?deps=react@18.2.0,react-dom@18.2.0`\n\n**Data Fetching:**\n- Fetch from `/api/*` routes\n- Use shared types from `shared/types.ts`\n- Handle loading and error states\n\n## Frontend Styling\n\nThis val uses **Pico CSS** - a classless CSS framework that automatically styles semantic HTML.\n\n### Why Pico CSS?\n\n- **No CSS classes needed** - Keeps HTML clean and maintainable\n- **Semantic HTML only** - Use proper HTML elements (`

`, `

`, ``, etc.)\n- **Automatic styling** - Beautiful design out of the box\n- **CDN delivery** - Single `` tag, no build step\n\n### Rules\n\n❌ **NEVER use CSS class names** (no `className` attributes)\n❌ **NEVER use TailwindCSS, Bootstrap, or other class-based frameworks**\n✅ **ALWAYS use semantic HTML elements**\n✅ **Use inline styles sparingly** - Only for dynamic/conditional styling\n\n### Semantic HTML Elements\n\nUse these semantic elements - Pico styles them automatically:\n\n**Layout:**\n- `` - Main content container\n- `` - Self-contained content (cards, sections)\n- `` - Thematic grouping of content\n- ``, `` - Page/section headers and footers\n- `` - Sidebar content\n\n**Typography:**\n- `` through ` ` - Headings\n- `` - Paragraphs\n- `` - Bold/important text\n- `` - Italic/emphasized text\n- `` - Fine print\n- `` - Highlighted text\n- `` - Inline code\n- ` ` - Code blocks\n- `` - Keyboard input / tags\n\n**Lists:**\n- ``, ``, `` - Lists\n- ``, ``, ` ` - Definition lists\n\n**Forms:**\n- ``, ``, `<select>` - Form inputs\n- `<button>` - Buttons\n- `<label>` - Form labels\n- Use `aria-busy` attribute for loading states on buttons\n\n**Links & Media:**\n- `<a>` - Links\n- `<time>` - Dates and times\n- `<figure>`, `<figcaption>` - Images with captions\n\n### Example Patterns\n\n**Card layout:**\n```tsx\n<article>\n <h2>Card Title</h2>\n <p>Card content goes here.</p>\n <button>Action</button>\n</article>\n```\n\n**Form with loading state:**\n```tsx\n<div style={{ display: 'flex', gap: '1rem' }}>\n <input type=\"text\" placeholder=\"Enter value\" style={{ flex: 1 }} />\n <button disabled={loading} aria-busy={loading}>\n Submit\n </button>\n</div>\n```\n\n**Error message:**\n```tsx\n{error && <mark>{error}</mark>}\n```\n\n**Tags/badges:**\n```tsx\n<kbd>Tag 1</kbd> <kbd>Tag 2</kbd>\n```\n\n**Conditional styling:**\n```tsx\n<span style={checked ? { textDecoration: 'line-through', opacity: 0.6 } : undefined}>\n Task text\n</span>\n```\n\n### Loading Pico CSS\n\nAlready included in `frontend/index.html`:\n\n```html\n<link href=\"https://cdn.jsdelivr.net/npm/@picocss/pico@2.1.1/css/pico.classless.min.css\" rel=\"stylesheet\" />\n```\n\n## Shared Code (`shared/`)\n\n**Types** (`shared/types.ts`):\n- All TypeScript interfaces shared between frontend/backend\n- Notion data structures\n- API request/response types\n- Common data models\n\n**Utils** (`shared/utils.ts`):\n- Pure functions that work in both Deno (backend) and browser (frontend)\n- ❌ NEVER use Deno APIs (won't work in browser)\n- ✅ Only use standard JavaScript/TypeScript\n\n## Environment Variables\n\nRequired environment variables for this val:\n\n- `NOTION_API_KEY` - Notion integration token\n- `FIRECRAWLER_API_KEY` - Firecrawler service (if used)\n- Additional service API keys as needed\n\n**Access via**: `Deno.env.get('VAR_NAME')`\n\n**NEVER hardcode secrets** - always use environment variables\n\n## Data Validation\n\nValidate request data in **controllers**, not routes:\n\n```typescript\nif (!pageId || typeof pageId !== 'string') {\n return {\n success: false,\n data: null,\n error: \"Invalid pageId\",\n details: \"pageId must be a non-empty string\"\n };\n}\n```\n\n**Check:**\n- Required fields exist\n- Types are correct\n- Formats are valid\n- Values are within expected ranges\n\n**Return helpful error messages** with `details` field\n\n## Response Filtering\n\n**Filter sensitive data in controllers** before returning:\n\n- Remove button properties from Notion data\n- Don't expose internal IDs or tokens\n- Clean up API responses before sending to frontend\n- Strip unnecessary metadata\n\n**Example:**\n```typescript\n// Remove sensitive properties\nconst filtered = {\n ...notionData,\n properties: Object.entries(notionData.properties)\n .filter(([key, value]) => value.type !== 'button')\n .reduce((acc, [key, value]) => ({ ...acc, [key]: value }), {})\n};\n```\n\n## Questions to Ask User\n\nWhen the user requests a new feature, clarify:\n\n1. **Is this a webhook handler or API endpoint?**\n - Webhook → `routes/tasks/`\n - API → `routes/api/`\n\n2. **What external service needs integration?**\n - New service → create `backend/services/[name].ts`\n\n3. **What data needs to be saved back to Notion?**\n - Update Notion → use/extend `notionService.ts`\n\n4. **Does this need authentication?**\n - Protected → apply `authCheck` middleware\n\n5. **Is this frontend-facing?**\n - Yes → create React component in `frontend/components/`\n\n## Common Patterns Checklist\n\nBefore implementing, verify:\n\n- ✅ Following 3-layer architecture (Route → Controller → Service)\n- ✅ Routes only handle HTTP, no business logic\n- ✅ Controllers return standardized `{success, data, error}` structure\n- ✅ Services handle external API calls\n- ✅ Never skipping layers\n- ✅ TypeScript types defined in `shared/types.ts`\n- ✅ Environment variables used for secrets\n- ✅ Error handling at each layer\n- ✅ Validation in controllers\n- ✅ Sensitive data filtered before returning\n\n## Integration with AGENTS.md\n\n**Use AGENTS.md for:**\n- Val Town platform requirements\n- Deno-specific patterns\n- Standard library usage\n- React configuration\n- Import patterns (esm.sh)\n- Platform limitations\n\n**Use CLAUDE.md (this file) for:**\n- This val's architecture\n- MVC layer separation\n- Notion integration patterns\n- External service integration\n- File organization\n- Response formats\n\n## Entry Point\n\n`main.http.tsx` is the HTTP entry point:\n- Exports `app.fetch` for Val Town\n- Uses Hono for routing\n- Serves static frontend assets\n- Mounts API routes at `/api`\n- Includes error handler\n\n**Always mount new routes in main.http.tsx:**\n```typescript\nimport { taskRoutes } from './backend/routes/tasks/index.ts';\n\napp.route('/tasks', taskRoutes);\n```\n\n## Hono Framework Patterns\n\nThis val uses **Hono** as the web framework. Follow these patterns:\n\n### Importing Hono\n\n```typescript\nimport { Hono } from \"npm:hono@4\";\nimport { Context, Next } from \"npm:hono@4\";\n```\n\n**Note**: Use `npm:` specifier for backend-only packages (better performance, modern Deno way).\n\n### Creating Route Modules\n\nWhen creating route modules (e.g., `backend/routes/api/pages.ts`):\n\n```typescript\nimport { Hono } from \"npm:hono@4\";\nimport * as pageController from '../../controllers/pageController.ts';\n\nconst pages = new Hono();\n\n// GET /api/pages/:id\npages.get('/:id', async (c) => {\n const pageId = c.req.param('id');\n const result = await pageController.getPage(pageId);\n\n if (!result.success) {\n return c.json({ error: result.error, details: result.details }, 400);\n }\n\n return c.json(result.data);\n});\n\n// POST /api/pages/:id\npages.post('/:id', async (c) => {\n const pageId = c.req.param('id');\n const body = await c.req.json();\n\n const result = await pageController.updatePage(pageId, body.properties);\n\n if (!result.success) {\n return c.json({ error: result.error, details: result.details }, 400);\n }\n\n return c.json(result.data);\n});\n\nexport default pages;\n```\n\n### Mounting Routes\n\nCreate an index file for each route directory (e.g., `backend/routes/api/index.ts`):\n\n```typescript\nimport { Hono } from \"npm:hono@4\";\nimport pages from './pages.ts';\n\nconst api = new Hono();\n\napi.route('/pages', pages);\n// Add more routes as needed\n\nexport default api;\n```\n\nThen mount in `main.http.tsx`:\n\n```typescript\nimport api from './backend/routes/api/index.ts';\napp.route('/api', api);\n```\n\n### Accessing Request Data\n\n```typescript\n// URL params\nconst id = c.req.param('id');\n\n// Query params\nconst query = c.req.query('q');\n\n// Headers\nconst apiKey = c.req.header('x-api-key');\n\n// JSON body\nconst body = await c.req.json();\n\n// Form data\nconst formData = await c.req.formData();\n```\n\n### Returning Responses\n\n```typescript\n// JSON response\nreturn c.json({ data: 'value' });\n\n// JSON with status code\nreturn c.json({ error: 'Not found' }, 404);\n\n// HTML response\nreturn c.html('<h1>Hello</h1>');\n\n// Plain text\nreturn c.text('Hello');\n\n// Redirect (use this pattern, not Response.redirect)\nreturn new Response(null, { status: 302, headers: { Location: '/new-url' }});\n```\n\n### Middleware\n\nApply middleware to routes:\n\n```typescript\nimport { authCheck } from '../authCheck.ts';\n\n// Apply to single route\npages.post('/:id', authCheck, async (c) => {\n // Protected route logic\n});\n\n// Apply to all routes in this module\npages.use('*', authCheck);\n```\n\n### Error Handler\n\nAlready configured in `main.http.tsx`:\n\n```typescript\napp.onError((err, c) => {\n throw err; // Re-throw to see full stack trace\n});\n```\n\n### Static File Serving\n\nAlready configured in `main.http.tsx`:\n\n```typescript\nimport { serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\n\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n```\n\n### Route Organization Example\n\n```\nbackend/routes/\n├── api/\n│ ├── index.ts # Mounts all API routes\n│ ├── pages.ts # /api/pages/* endpoints\n│ └── databases.ts # /api/databases/* endpoints\n├── tasks/\n│ ├── index.ts # Mounts all webhook routes\n│ └── notion.ts # /tasks/notion webhook handler\n├── views/\n│ └── dashboard.ts # /views/dashboard page\n└── authCheck.ts # Auth middleware\n```\n",[],[655],{"_105":662,"_96":538,"_161":663,"_163":-5,"_164":142,"_165":664,"_167":22,"_107":665,"_101":347,"_169":181,"_171":666,"_172":22,"_173":-5,"_174":667,"_99":668},"e14c3d00-cc80-11f0-819a-42dde27851f2","019a26dc-99bf-7269-a8f6-707670e63f81",60,["D",1764351435610],"# Notion Block Search & Sync System\n\nA Val Town application that searches Notion pages for keywords OR block types (like checkboxes), extracts structured data, stores it in blob storage, and syncs it back to a Notion database with intelligent filtering and validation.\n\n## Table of Contents\n\n- [Overview](#overview)\n- [Project Structure](#project-structure)\n- [MVC Architecture](#mvc-architecture)\n- [Search Workflow](#search-workflow)\n- [Block Type Handling](#block-type-handling)\n- [Validation & Auto-Assignment Rules](#validation--auto-assignment-rules)\n- [Endpoints](#endpoints)\n- [Cron Jobs](#cron-jobs)\n- [Environment Variables](#environment-variables)\n- [Search Modes](#search-modes)\n- [Project Matching](#project-matching)\n\n## Overview\n\nThis system enables automatic extraction and organization of action items from Notion pages:\n\n1. **Search**: Scans recent Notion pages for configurable keywords or block types\n2. **Extract**: Captures block content including mentions and dates\n3. **Validate**: Filters out blocks that are too short (< 5 words by default)\n4. **Enrich**: Auto-assigns missing owner (creator) and due date (today by default)\n5. **Store**: Saves to Val Town blob storage with timestamp tracking and sync metadata\n6. **Optimize**: Skips already-synced items to reduce API calls by 90%+\n7. **Sync**: Creates/updates Notion database pages with Status \"Not started\" (create only)\n\n## Project Structure\n\n```\n├── backend/\n│ ├── controllers/ # Business logic\n│ │ ├── pageController.ts # Page operations\n│ │ ├── todoController.ts # Keyword search logic\n│ │ ├── todoSaveController.ts # Blob → Notion sync\n│ │ └── todoOrchestrationController.ts # Batch workflow\n│ ├── crons/ # Time-based triggers\n│ │ ├── todoSearch.cron.ts # Periodic keyword search\n│ │ └── todoSync.cron.ts # Periodic database sync\n│ ├── routes/ # HTTP handlers\n│ │ ├── api/ # API endpoints\n│ │ │ └── pages.ts # Recent pages API\n│ │ └── tasks/ # Task automation endpoints\n│ │ ├── todoSearch.ts # Single page search webhook\n│ │ ├── todoSave.ts # Blob sync webhook\n│ │ └── todos.ts # Batch search & sync\n│ ├── services/ # External API integrations\n│ │ ├── notion/ # Notion API wrapper\n│ │ │ ├── index.ts # Client initialization\n│ │ │ ├── pages.ts # Page operations\n│ │ │ ├── databases.ts # Database operations\n│ │ │ ├── blocks.ts # Block operations\n│ │ │ └── search.ts # Search operations\n│ │ ├── aiService.ts # OpenAI for fuzzy matching\n│ │ └── blobService.ts # Val Town blob storage\n│ └── utils/ # Utility functions\n│ ├── notionUtils.ts # Block transformation\n│ ├── blobUtils.ts # Blob key parsing\n│ └── emojiUtils.ts # Emoji extraction\n├── frontend/ # React frontend\n├── shared/ # Shared types and utilities\n│ ├── types.ts # TypeScript interfaces\n│ └── utils.ts # Shared utility functions\n├── main.http.tsx # Application entry point (Hono)\n├── CLAUDE.md # Development guidelines\n└── AGENTS.md # Val Town platform guidelines\n```\n\n## MVC Architecture\n\nThis application follows a strict **3-layer MVC architecture** with clear separation of concerns:\n\n```\nRequest → Route → Controller → Service → External API\n ↓\nResponse ← Format ← Standard Response ← Result\n```\n\n### Layer 1: Routes (`backend/routes/`)\n\n**Responsibility**: HTTP handling only\n- Extract request parameters (query, body, headers)\n- Call controller functions\n- Format responses with appropriate HTTP status codes\n- **Never contain business logic**\n\n```typescript\n// Example: backend/routes/tasks/todos.ts\napp.post('/', async (c) => {\n const keyword = c.req.query('keyword') || undefined;\n const result = await todoOrchestrationController.processBatchTodos(hours, keyword);\n return c.json(result, 200);\n});\n```\n\n### Layer 2: Controllers (`backend/controllers/`)\n\n**Responsibility**: Business logic and orchestration\n- Validate input data\n- Orchestrate multiple service calls\n- Transform and filter data\n- Return standardized response format: `{success, data, error, details?}`\n- **Never make direct HTTP calls to external APIs**\n\n```typescript\n// Example: backend/controllers/todoController.ts\nexport async function processTodoSearch(pageId: string, keyword: string = 'todo') {\n // Validation\n if (!pageId) return { success: false, error: \"Invalid pageId\", ... };\n\n // Call service layer\n const blocks = await notionService.getPageBlocksRecursive(pageId);\n\n // Business logic\n const matches = blocks.filter(block => searchBlockForKeyword(block, keyword));\n\n return { success: true, data: matches, error: null };\n}\n```\n\n### Layer 3: Services (`backend/services/`)\n\n**Responsibility**: External API calls only\n- Make HTTP requests to external APIs\n- Handle API authentication\n- Parse and normalize API responses\n- Return structured results: `{success, data, error}`\n- **Never contain business logic**\n\n```typescript\n// Example: backend/services/notion/pages.ts\nexport async function getPageBlocksRecursive(blockId: string) {\n const response = await notion.blocks.children.list({ block_id: blockId });\n return response.results;\n}\n```\n\n**Golden Rule**: Never skip layers! Routes call controllers, controllers call services. This ensures testability, maintainability, and clear separation of concerns.\n\n## Search Workflow\n\nThe system follows a three-stage pipeline: **Notion → Blob Storage → Notion Database**\n\nThis workflow supports two search modes (keyword or block type). The pipeline remains the same regardless of mode.\n\n### Stage 1: Search & Extract (Notion → Blobs)\n\n**Flow**:\n1. Get recent pages from Notion (configurable time window)\n2. For each page, recursively fetch all blocks\n3. Search blocks for keyword matches\n4. Extract structured data from matching blocks\n5. **Validate word count**: Skip blocks below `MIN_BLOCK_WORDS` (default: 5)\n6. **Auto-assign missing fields**: Add default due date and/or creator as owner\n7. Save enriched blocks to blob storage with timestamp\n\n**Validation & Auto-Assignment (happens here, not during sync)**:\n- ❌ Word count < `MIN_BLOCK_WORDS`? → Skip (too short to be meaningful)\n- ⚠️ Missing `date_mention`? → Auto-assign based on `DEFAULT_DUE_DATE` setting (default: today)\n- ⚠️ Missing `people_mention`? → Auto-assign block creator as Owner\n- ✅ Only skips if: (1) too short, or (2) creator info unavailable (rare)\n- Result: All blobs in storage are meaningful, complete with owner + due date\n\n**Endpoints**:\n- `POST /tasks/todo/search` - Single page search (webhook-triggered)\n- `POST /tasks/todos?hours=24` - Batch search across recent pages\n\n**Keywords Configuration**:\n- Set via `SEARCH_KEYWORDS` environment variable (comma-separated)\n- Example: `SEARCH_KEYWORDS=todo,zinger,bit,😀`\n- Defaults to `todo` if not set\n- All keywords searched in single pass through blocks (efficient)\n\n**Keyword Matching Logic**:\n- **Text keywords** (e.g., \"todo\", \"bit\", \"steel\"):\n - Case-insensitive\n - Word boundary matching (finds \"todo\" but not \"todoist\")\n - Uses regex: `/\\btodo\\b/i`\n- **Emojis** (e.g., \"😀\", \"🎉\"):\n - Exact match\n - Case-sensitivity N/A\n- **Multi-keyword**: Block saved if it matches ANY keyword\n\n**Block Extraction**:\n\nWhen a keyword is found, the system extracts and transforms the block into a reduced format:\n\n```typescript\n{\n todo_string: \"Buy groceries for @John due October 30, 2025\",\n block_id: \"abc-123-def-456\",\n block_url: \"https://www.notion.so/abc123def456\",\n last_edited_time: \"2025-10-29T12:00:00.000Z\",\n people_mentions: [{ id: \"user-123\", name: \"John\", email: \"john@example.com\" }],\n date_mentions: [\"2025-10-30\"],\n link_mentions: [{ text: \"Project\", url: \"/page-id\" }],\n sync_metadata: {\n synced: false, // Needs sync to Notion database\n notion_page_id: undefined // Will be set after first sync\n }\n}\n```\n\n**Transformation Details**:\n- **Dates**: Formatted to human-readable (e.g., \"October 30, 2025 at 3:00 PM EDT\")\n- **Original dates preserved**: ISO format kept in `date_mentions` array for Notion API\n- **Block URL**: Clickable link to original block location\n- **Emojis**: Extracted for use as page icons\n\n### Stage 2: Blob Storage\n\n**Storage Format**:\n- **Key pattern**: `{projectName}--{category}--{blockId}`\n- **Example**: `demo--todo--abc-123-def-456`\n- **Content**: JSON of reduced block structure with sync metadata\n\n**Blob Structure**:\n```typescript\n{\n todo_string: \"...\",\n block_id: \"...\",\n page_url: \"...\", // Source page URL\n parent_id: \"...\" | null, // Parent block ID (for project matching)\n // ... other properties\n sync_metadata: {\n synced: boolean, // true = synced to Notion, false = needs sync\n notion_page_id?: string // Cached Notion page ID (optimization)\n }\n}\n```\n\n**Update Logic**:\n- Compare `last_edited_time` of existing blob vs new block\n- If unchanged: **Skip save** (preserves `synced: true` status)\n- If changed: Save with `synced: false` (triggers re-sync)\n- Preserve cached `notion_page_id` across updates\n- Prevents data loss from out-of-order processing\n\n### Stage 3: Sync to Notion Database (Blobs → Notion)\n\n**Flow**:\n1. List all blobs in \"todo\" category\n2. For each blob, read reduced block data\n3. **Optimization: Skip if `synced: true`** (0 API calls)\n4. **Optimization: Use cached `notion_page_id` if available** (1 API call - update only)\n5. If no cached ID: Query database for existing page by Block ID\n6. Create new page OR update existing page\n - **CREATE**: Adds Status = \"Not started\" (only on creation)\n - **UPDATE**: Does NOT modify Status (preserves user changes)\n7. Mark blob as `synced: true` and cache page ID\n\n**Note**: No validation happens during sync - all blobs are guaranteed valid because validation occurs during the search phase (Stage 1).\n\n**Endpoints**:\n- `POST /tasks/todo/save` - Sync all blobs to database (webhook-triggered)\n- `POST /tasks/todos` - Batch workflow (search + sync in one call)\n\n**Property Mappings** (Blob → Notion Database):\n```\ntodo_string → Name (title)\nblock_id → Block ID (rich_text)\nblock_url → Block URL (url)\npage_url → Page URL (url) - source page where todo was found\nlast_edited_time → Todo last edited time (date)\npeople_mentions[0] → Owner (people)\npeople_mentions[1..] → Other people (people)\ndate_mentions[0] → Due date (date)\nlink_mentions → Links (rich_text, bullet list)\nmatched projects → Projects db (relation) - see Project Matching\nemoji (if found) → Page icon\n(on CREATE only) → Status (select: \"Not started\")\n```\n\n**Status Property Behavior**:\n- **CREATE**: New pages are created with Status = \"Not started\" (select property)\n- **UPDATE**: Existing pages are updated WITHOUT modifying Status\n- **Why**: Preserves user changes to Status in the database (e.g., \"In progress\", \"Done\")\n- **Result**: Status is set once on creation, then managed by users in the database\n\n**Sync Optimization**:\n\nThe system uses sync metadata to dramatically reduce Notion API calls:\n\n**On first sync**:\n- Blob has `synced: false`, no `notion_page_id`\n- Query database → create or update → cache page ID\n- Mark `synced: true`\n- **API calls**: 1 query + 1 create/update = **2 calls**\n\n**On subsequent syncs (no changes)**:\n- Blob has `synced: true`\n- Skip immediately\n- **API calls**: **0 calls** (100% reduction)\n\n**On subsequent syncs (block changed)**:\n- Blob saved with `synced: false` (block edited in Notion)\n- Has cached `notion_page_id` from previous sync\n- Update directly without query\n- Mark `synced: true`\n- **API calls**: **1 update** (50% reduction)\n\n**Performance impact**:\n- **Before optimization**: 100 blobs = 100 queries + 50 updates = 150 API calls\n- **After optimization**: 90 synced + 10 changed = 0 + 10 updates = **10 API calls** (93% reduction)\n\n## Block Type Handling\n\nThe search uses **recursive block fetching** to traverse the entire page hierarchy, including nested content.\n\n### Recursive Fetching\n\n**How it works**:\n```typescript\nfunction getPageBlocksRecursive(blockId) {\n 1. Fetch immediate children of blockId\n 2. For each child:\n - Add child to results\n - If child.has_children === true:\n - Recursively fetch child's children\n - Add to results\n 3. Return flattened array of all blocks\n}\n```\n\n**What this means**:\n- ✅ Finds blocks nested inside toggles\n- ✅ Finds blocks nested inside columns\n- ✅ Finds blocks nested inside lists\n- ✅ Finds blocks nested N levels deep\n\n### Included Block Types\n\nThese block types are **searched for keywords**:\n\n| Block Type | Has rich_text? | Notes |\n|------------|----------------|-------|\n| `paragraph` | ✅ | Standard text blocks |\n| `heading_1`, `heading_2`, `heading_3` | ✅ | All heading levels |\n| `bulleted_list_item` | ✅ | Bullet lists |\n| `numbered_list_item` | ✅ | Numbered lists |\n| `to_do` | ✅ | Checkbox items |\n| `toggle` | ✅ | Collapsible toggles |\n| `quote` | ✅ | Quote blocks |\n| `callout` | ✅ | Callout/alert blocks |\n| `code` | ✅ | Code blocks (captions only) |\n| `column` | N/A | Container - children are searched |\n| `column_list` | N/A | Container - children are searched |\n\n**Column Behavior**:\n- Column blocks themselves have no searchable text\n- But their children (paragraphs, lists, etc.) ARE searched\n- Example: A todo in a column will be found\n\n### Excluded Block Types\n\nThese block types are **explicitly skipped**:\n\n| Block Type | Reason |\n|------------|--------|\n| `unsupported` | Not supported by Notion API |\n| `button` | Action buttons, not content |\n| `table` | Container block, no text content |\n| `table_row` | Cells aren't individual blocks; can't be saved to blob |\n| `child_page` | Page title not in rich_text format |\n| `child_database` | Database title not in rich_text format |\n| `divider` | No text content |\n| `table_of_contents` | No text content |\n| `breadcrumb` | No text content |\n| `image`, `file`, `video`, `pdf` | Media blocks (captions could be added later) |\n| `bookmark`, `embed` | External content (could be added later) |\n\n**Why tables are excluded**:\n- Table content lives in `table_row.cells[][]` (array of arrays)\n- Cells contain rich_text but aren't individual blocks\n- Can't be saved to blob storage as standalone blocks\n- Can't create Notion pages from cell content\n\n## Validation & Auto-Assignment Rules\n\nMatched blocks are validated for minimum length, then enriched with auto-assigned fields before being saved to blob storage. **Validation ensures quality, auto-assignment ensures completeness**.\n\n### Validation & Enrichment for Blob Storage\n\nMatched blocks go through validation and enrichment before being saved:\n\n**1. Word Count Validation (REQUIRED)**:\n- ✅ Block must have at least `MIN_BLOCK_WORDS` words (default: 5)\n- ❌ Blocks with fewer words are skipped - too short to be meaningful todos\n- Counts all words including mentions and dates (simple whitespace split)\n- Example: \"Buy groceries for @John tomorrow\" = 5 words (passes)\n- Example: \"todo\" = 1 word (skipped)\n\n**2. Date Mention (AUTO-ASSIGNED)**:\n- ✅ **At least one date mention** (`date_mentions.length > 0`)\n- First date becomes \"Due date\"\n- **AUTO-ASSIGNED**: If no date found, uses `DEFAULT_DUE_DATE` env var setting (defaults to \"today\")\n\n**3. Person Mention (AUTO-ASSIGNED)**:\n- ✅ **At least one person mention** (`people_mentions.length > 0`)\n- First person becomes \"Owner\"\n- Additional people become \"Other people\"\n- **AUTO-ASSIGNED**: If no @mentions found, block creator is automatically assigned as owner\n\n**Automatic Due Date Assignment**:\n- If a block matches search criteria but has no date mentions, the system automatically assigns a due date\n- **Configurable**: Set via `DEFAULT_DUE_DATE` environment variable\n- **Options**: `today` (default), `tomorrow`, `one_week`, `end_of_week`, `next_business_day`\n- **Rationale**: Blocks without explicit dates still need deadlines; \"today\" is a sensible default\n- Date is stored in same ISO format as explicit dates (e.g., `\"2025-10-31\"`)\n\n**Automatic Owner Assignment**:\n- If a block matches search criteria but has no @person mentions, the system automatically assigns the block creator (from Notion's `created_by` field) as the owner\n- **Rationale**: When someone creates a todo without mentioning anyone, they're implicitly taking ownership\n- Only the creator's Notion user ID is used (no additional API calls needed)\n- The creator appears as \"Owner\" in the synced database page\n\n**Result**: All matched blocks are saved - no blocks are skipped due to missing dates or people.\n\n### When Validation Happens\n\n**During Search (Stage 1)** - `todoController.ts`:\n- After keyword match is found\n- After block is transformed to reduced format\n- Before saving to blob storage\n\n**Not During Sync (Stage 3)** - All blobs are guaranteed valid, no checking needed\n\n### Validation Logic\n\n```typescript\n// From todoController.ts (search phase)\n\n// Step 1: Check minimum word count\nconst minWords = getMinBlockWords();\nconst wordCount = countWords(reducedBlock.todo_string);\n\nif (wordCount < minWords) {\n console.log(`○ Skipped: block too short (${wordCount} words, minimum: ${minWords})`);\n continue; // Don't save to blob\n}\n\n// Step 2: Auto-assign due date if no date mentioned\nif (!reducedBlock.date_mentions || reducedBlock.date_mentions.length === 0) {\n const setting = getDefaultDueDateSetting();\n const calculatedDate = calculateDueDate(setting);\n\n reducedBlock.date_mentions = [calculatedDate];\n console.log(`✓ Auto-assigned due date: ${calculatedDate} (setting: ${setting})`);\n}\n\n// Step 3: Auto-assign creator as owner if no people mentioned\nif (!reducedBlock.people_mentions || reducedBlock.people_mentions.length === 0) {\n const creator = getBlockCreator(block);\n\n if (creator) {\n reducedBlock.people_mentions = [creator];\n console.log(`✓ Auto-assigned creator as owner (ID: ${creator.id})`);\n } else {\n console.log(`○ Skipped: no people mentions and creator info not available`);\n continue; // Don't save to blob\n }\n}\n\nconsole.log('✓ Validation passed: has people and date mentions');\n\n// All validated and enriched blocks reach this point and get saved\nawait blobService.saveBlockToBlob('todo', block.id, blobData);\n```\n\n### Examples\n\n**Valid - Explicit @mention + explicit date** (8 words):\n```\n\"Buy groceries for @John due October 30, 2025\"\n✅ Word count: 8 (passes minimum of 5)\n✅ Has person mention (@John)\n✅ Has date mention (October 30, 2025)\n→ Saved to blob storage\n→ Synced to Notion database with @John as Owner, due Oct 30\n```\n\n**Valid - Auto-assigned creator + explicit date** (6 words):\n```\n\"Buy groceries due October 30, 2025\"\n✅ Word count: 6 (passes minimum of 5)\n✅ Has date mention (October 30, 2025)\n⚠️ No person mention → Creator auto-assigned\n→ Saved to blob storage with creator as Owner\n→ Synced to Notion database (creator appears as Owner, due Oct 30)\n```\n\n**Valid - Explicit @mention + auto-assigned date** (5 words):\n```\n\"Buy groceries for @John tomorrow\"\n✅ Word count: 5 (passes minimum of 5)\n✅ Has person mention (@John)\n⚠️ No date mention → Auto-assigned (e.g., today = 2025-10-31)\n→ Saved to blob storage\n→ Synced to Notion database with @John as Owner, due Oct 31\n```\n\n**Valid - Both auto-assigned** (5 words):\n```\n\"Buy groceries at the store\"\n✅ Word count: 5 (passes minimum of 5)\n⚠️ No person mention → Creator auto-assigned\n⚠️ No date mention → Auto-assigned (e.g., today = 2025-10-31)\n→ Saved to blob storage with creator as Owner\n→ Synced to Notion database (creator appears as Owner, due Oct 31)\n```\n\n**Invalid - Too short** (2 words):\n```\n\"Buy groceries\"\n❌ Word count: 2 (below minimum of 5)\n→ NOT saved to blob storage (skipped - too short)\n```\n\n**Invalid - Too short** (1 word):\n```\n\"todo\"\n❌ Word count: 1 (below minimum of 5)\n→ NOT saved to blob storage (skipped - too short)\n```\n\n**Invalid - Too short with emojis** (2 words):\n```\n\"🍋 🎉\"\n❌ Word count: 2 (below minimum of 5)\n→ NOT saved to blob storage (skipped - too short)\n```\n\n**Invalid - Creator unavailable** (rare):\n```\n\"Buy groceries at the store tomorrow\"\n✅ Word count: 6 (passes minimum of 5)\n⚠️ No person mention → Would auto-assign creator\n❌ Creator info not available from Notion API\n→ NOT saved to blob storage (skipped - creator unavailable)\n```\n\n**Note**: With word count validation and auto-assignment enabled, most meaningful blocks are saved. Blocks are skipped if:\n1. Too short (below `MIN_BLOCK_WORDS`, default: 5) - most common\n2. Creator unavailable (rare edge case)\n\n### Sync Summary\n\nAfter syncing, the controller reports:\n- **Total blobs**: All blobs in storage (all guaranteed valid with auto-assigned fields)\n- **Pages created**: New pages added to database\n- **Pages updated**: Existing pages updated\n- **Pages skipped**: Blobs already synced (`synced: true`)\n- **Pages failed**: Errors during create/update\n\n**Note**: All blobs meet criteria with auto-assignment - validation and enrichment happen during search, not sync.\n\n## Endpoints\n\n### API Endpoints\n\n**`GET /api/pages/recent?hours=24`**\n- Get pages edited in last N hours\n- Filters out archived pages and pages in TODOS_DB_ID database\n- Returns simplified page objects with parent information\n\n**Response**:\n```json\n{\n \"pages\": [\n {\n \"id\": \"page-id\",\n \"object\": \"page\",\n \"title\": \"My Page\",\n \"url\": \"https://notion.so/...\",\n \"last_edited_time\": \"2025-10-29T12:00:00.000Z\",\n \"parent\": { \"type\": \"page_id\", \"id\": \"parent-id\" }\n }\n ],\n \"count\": 1,\n \"timeRange\": \"24 hours\"\n}\n```\n\n### Task Endpoints\n\n**`POST /tasks/todo/search`**\n- Search single page for keywords (webhook-triggered)\n- Keywords from `SEARCH_KEYWORDS` env var (comma-separated)\n- Extracts and saves matching blocks to blobs\n- Body: `{ \"page_id\": \"abc-123\" }`\n\n**`POST /tasks/todo/save`**\n- Sync all blobs to Notion database\n- Validates and creates/updates pages\n- No request body needed\n\n**`POST /tasks/todos?hours=24`**\n- **Batch workflow**: Search recent pages + sync to database\n- Keywords from `SEARCH_KEYWORDS` env var\n- Combines search and save in one call\n- Use for manual triggers or cron jobs\n\n**Response**:\n```json\n{\n \"success\": true,\n \"pagesSearched\": 5,\n \"totalTodosFound\": 12,\n \"searchResults\": [\n {\n \"pageId\": \"abc-123\",\n \"pageTitle\": \"My Page\",\n \"success\": true,\n \"blocksFound\": 3,\n \"blockIds\": [\"block-1\", \"block-2\", \"block-3\"]\n }\n ],\n \"saveResult\": {\n \"totalBlobs\": 12,\n \"pagesCreated\": 5,\n \"pagesUpdated\": 3,\n \"pagesSkipped\": 4,\n \"pagesFailed\": 0\n }\n}\n```\n\n## Cron Jobs\n\nThe system includes two separate cron jobs for automated workflow execution. Crons are time-based triggers that run independently of HTTP requests.\n\n### Architecture\n\nCrons live in `backend/crons/` and follow the same MVC pattern as HTTP routes:\n\n```\nCron Trigger → Controller → Service → External API\n```\n\n**Key differences from HTTP routes**:\n- Triggered by time intervals (not HTTP requests)\n- No request/response cycle\n- Results logged to console only\n- Use `.cron.tsx` extension for Val Town\n\n### Cron 1: Todo Search (`todoSearch.cron.ts`)\n\n**Purpose**: Search recent pages for keywords and save matches to blob storage\n\n**Workflow**:\n1. Get recent pages from Notion (last 6 hours)\n2. Search each page for \"todo\" keyword\n3. Save matching blocks to Val Town blob storage\n4. Does NOT sync to Notion database\n\n**Configuration**:\n- **Lookback window**: 6 hours (hardcoded)\n- **Keyword**: \"todo\" (hardcoded default)\n- **Recommended schedule**: Every 4 hours\n - 6 hour lookback provides 2 hour buffer for overlap\n - Ensures no pages are missed\n\n**Output**:\n```\n=== Cron: Todo Search Started ===\nTimestamp: 2025-10-29T12:00:00.000Z\n\nCron: Search complete - Found 12 todos in 5 pages\nPages with matches:\n - Project Planning: 3 match(es)\n - Meeting Notes: 5 match(es)\n - Weekly Review: 4 match(es)\n\n=== Cron: Todo Search Complete ===\n```\n\n### Cron 2: Todo Sync (`todoSync.cron.ts`)\n\n**Purpose**: Sync validated todo blobs to Notion database\n\n**Workflow**:\n1. Read all todo blobs from Val Town blob storage\n2. Validate each blob (requires person mention + date mention)\n3. Query Notion database for existing pages by Block ID\n4. Create new pages or update existing pages (timestamp-based)\n\n**Configuration**:\n- **No parameters**: Processes all blobs in storage\n- **Recommended schedule**: Every 8-12 hours\n - Less frequent than search cron\n - Allows time for blob accumulation\n - Reduces Notion API calls\n\n**Output**:\n```\n=== Cron: Todo Sync Started ===\nTimestamp: 2025-10-29T14:00:00.000Z\n\nCron: Sync complete\nSummary:\n Total blobs processed: 12\n Pages created: 5\n Pages updated: 3\n Pages skipped: 4\n Pages failed: 0\n\n=== Cron: Todo Sync Complete ===\n```\n\n### Why Two Separate Crons?\n\n**Operational flexibility**:\n- **Search cron** runs frequently to capture changes quickly\n- **Sync cron** runs less frequently to batch database updates\n- Reduces Notion API rate limit concerns\n- Allows manual triggering of sync independently\n\n**Fault isolation**:\n- Search failures don't block syncing existing blobs\n- Sync failures don't block new searches\n- Each cron can be debugged independently\n\n**Cost optimization**:\n- Blob storage is cheap and fast\n- Notion API calls are rate-limited\n- Separate crons allow different schedules for different costs\n\n### Setting Up Crons in Val Town\n\n1. **Navigate to Val Town UI**\n2. **Create new cron vals**:\n - `todoSearch.cron.tsx` - Copy content from `backend/crons/todoSearch.cron.ts`\n - `todoSync.cron.tsx` - Copy content from `backend/crons/todoSync.cron.ts`\n3. **Set schedules**:\n - `todoSearch.cron.tsx`: Every 4 hours (`0 */4 * * *`)\n - `todoSync.cron.tsx`: Every 8 hours (`0 */8 * * *`)\n4. **Monitor logs**: Check Val Town console for cron execution results\n\n**Note**: Val Town cron jobs must be separate vals (not files in this project). The files in `backend/crons/` serve as templates to copy into Val Town cron vals.\n\n## Environment Variables\n\nRequired environment variables (set in Val Town):\n\n- **`NOTION_API_KEY`** - Notion integration token (required)\n - Get from: https://www.notion.so/my-integrations\n - Required for all Notion API calls\n\n- **`TODOS_DB_ID`** - Notion database ID for todo sync (required)\n - The database where keyword matches are synced\n - Format: `abc123def456...` (32-character ID without hyphens)\n\n- **`PROJECTS_DB_ID`** - Notion database ID for project matching (optional)\n - Links todos to projects automatically (see [Project Matching](#project-matching))\n - If not set, todos sync normally without project links\n - Format: `abc123def456...` (32-character ID without hyphens)\n\n- **`SEARCH_KEYWORDS`** - Keywords to search for (optional, keyword mode)\n - Comma-separated list of keywords/phrases\n - Example: `todo,zinger,bit` or `todo,😀,🎉`\n - Defaults to `todo` if not set\n - All blocks matching ANY keyword will be saved to blob storage\n - Efficient: Searches all keywords in a single pass through blocks\n\n- **`SEARCH_BLOCK_TYPE`** - Block type to search for (optional, block type mode)\n - Alternative to keyword search - searches by Notion block type\n - Example: `to_do` (searches all Notion checkbox blocks)\n - Defaults to `to_do` if set with empty value\n - **Takes precedence over `SEARCH_KEYWORDS` if both are set**\n - Common values: `to_do`, `paragraph`, `bulleted_list_item`, `numbered_list_item`\n - Still requires people_mentions + date_mentions validation\n - Useful for: \"Check a box, add @person and date = instant todo\"\n\n- **`MIN_BLOCK_WORDS`** - Minimum word count for blocks to be saved (optional)\n - Blocks with fewer words are skipped (too short to be meaningful todos)\n - Defaults to `5` if not set\n - Word counting:\n - Counts all words including mentions and dates (simple whitespace split)\n - Hyphenated words count as 1 (e.g., \"buy-now\" = 1 word)\n - Emojis count as words (e.g., \"🍋 🎉\" = 2 words)\n - Default of 5 accounts for: ~1 word for mention + ~2-3 words for date + ~2-3 words for action\n - Example: \"Buy groceries for @John tomorrow\" = 5 words (minimum)\n\n- **`DEFAULT_DUE_DATE`** - Default due date for blocks without date mentions (optional)\n - Used when a block matches search criteria but has no date\n - Supported values: `today`, `tomorrow`, `one_week`, `end_of_week`, `next_business_day`\n - Defaults to `today` if not set\n - Examples:\n - `today` - Due today (default)\n - `tomorrow` - Due tomorrow\n - `one_week` - Due 7 days from today\n - `end_of_week` - Due next Friday (end of work week)\n - `next_business_day` - Due next weekday (skips weekends)\n\n- **`BLOCK_STABILITY_MINUTES`** - Minimum age (in minutes) before blocks are saved to blob storage (optional)\n - Only applies to cron-triggered searches (not webhook-triggered)\n - Prevents syncing blocks that are actively being edited\n - Defaults to `0` if not set (no delay - blocks saved immediately)\n - Set to a positive number to add a stability delay (e.g., `2` for 2 minutes)\n - Examples:\n - Not set or `BLOCK_STABILITY_MINUTES=0` - All blocks saved immediately (default)\n - `BLOCK_STABILITY_MINUTES=2` - Block edited 1 minute ago will be skipped, 3 minutes ago will be saved\n - `BLOCK_STABILITY_MINUTES=5` - Block edited 4 minutes ago will be skipped, 6 minutes ago will be saved\n - Webhook/button triggers always bypass this delay regardless of setting (immediate sync on user action)\n - Use case: Set a delay if you frequently edit todos and want cron to wait for \"final\" versions\n\n- **`RECENT_PAGES_LOOKBACK_HOURS`** - Default lookback window for searching recent pages (optional)\n - System-wide setting that applies to all triggers: cron jobs, frontend dashboard, manual API calls\n - Defaults to `24` hours if not set\n - Must be a positive integer\n - Can be overridden per-request with `?hours=X` query parameter\n - Examples:\n - Not set or `RECENT_PAGES_LOOKBACK_HOURS=24` - Search last 24 hours (default)\n - `RECENT_PAGES_LOOKBACK_HOURS=48` - Search last 48 hours (2 days)\n - `RECENT_PAGES_LOOKBACK_HOURS=168` - Search last 168 hours (1 week)\n - Use case: Match to your cron schedule or desired dashboard timeframe\n - Cron every 4 hours → Set to 6-8 hours (buffer for overlap/delays)\n - Cron every 24 hours → Set to 24-48 hours\n - No cron → Set to desired dashboard timeframe\n\n- **`NOTION_WEBHOOK_SECRET`** - API key for protecting webhooks and API endpoints (recommended)\n - **Required for production use** - protects all `/tasks/*` and `/api/*` endpoints (except `/api/health`)\n - Prevents unauthorized access to your Notion data and webhook triggers\n - Set to any secure random string (e.g., generated password or UUID)\n - **Notion webhook configuration**: Add custom header `X-API-KEY` with this value\n - **API requests**: Include header `X-API-KEY: your-secret-value`\n - If not set, authentication is disabled (development mode only)\n - Example: `NOTION_WEBHOOK_SECRET=abc123xyz789...`\n\n **Security note**: Without this, anyone can:\n - Trigger your webhooks (causing unnecessary processing)\n - Access recent pages via `/api/pages/recent` (potential data leak)\n - View page IDs from `/api/health` and use them to query other endpoints\n\n **Public endpoint exception**: `/api/health` remains public (needed for frontend dashboard)\n\n- **`API_KEY`** - Legacy API key (deprecated, use `NOTION_WEBHOOK_SECRET` instead)\n - Kept for backwards compatibility\n - Use `NOTION_WEBHOOK_SECRET` for new deployments\n\n## Search Modes\n\nThis system supports two mutually exclusive search modes. Choose the mode that best fits your workflow.\n\n### Mode 1: Keyword Search (default)\n\n**When to use**: You want to search for specific text in blocks (e.g., \"todo\", \"zinger\", emojis).\n\n**Configuration**:\n```env\nSEARCH_KEYWORDS=todo,zinger,🍋\n```\n\n**How it works**:\n- Searches block text content for keywords\n- Matches text keywords with word boundaries (case-insensitive)\n- Matches emojis with exact match\n- Example: Block containing \"Buy groceries todo @John October 30\"\n\n**Use case**: Flexible text-based search across any block type that contains your keywords.\n\n### Mode 2: Block Type Search\n\n**When to use**: You want to use Notion's native block types (especially checkboxes) as task markers.\n\n**Configuration**:\n```env\nSEARCH_BLOCK_TYPE=to_do\n```\n\n**How it works**:\n- Searches by Notion block type (not text content)\n- Matches `to_do` blocks (Notion checkboxes)\n- Works with both checked and unchecked checkboxes\n- No keyword required in text\n- Example: Any checkbox block with @John and October 30\n\n**Use case**:\n1. Create a checkbox in Notion (makes it a `to_do` block)\n2. Add @person mention\n3. Add date\n4. Done! Automatically syncs to database (no need to type \"todo\")\n\n**Other block types**: You can also search for `paragraph`, `bulleted_list_item`, `numbered_list_item`, etc.\n\n### Mode Priority\n\n**If both env vars are set**: `SEARCH_BLOCK_TYPE` takes precedence\n- System will use block type mode\n- `SEARCH_KEYWORDS` will be ignored\n- A warning will be logged\n\n**If neither is set**: Defaults to keyword mode with keyword `\"todo\"`\n\n### Auto-Assignment (applies to both modes)\n\nRegardless of search mode, all matched blocks are enriched with:\n- ⚠️ `date_mention` - If missing, auto-assigned based on `DEFAULT_DUE_DATE` (default: today)\n- ⚠️ `people_mention` - If missing, auto-assigned to block creator\n\nAll matched blocks are saved to blob storage with complete owner + due date information.\n\n## Project Matching\n\nWhen syncing todos to the database, the system automatically links them to related projects using a cascade of matching strategies. Each strategy is tried in order until a match is found.\n\n### Strategy 1: Content Mentions\n\nIf the todo text contains a link to a page that exists in your Projects database, the todo is linked to that project.\n\n**Example**: A todo containing `[[Project Alpha]]` (a page mention) will be linked to \"Project Alpha\" if it exists in the Projects database.\n\n### Strategy 2: Source Page\n\nIf the todo block appears on a page that is itself a project (exists in the Projects database), the todo is linked to that project.\n\n**Example**: A todo on the \"Project Beta\" page will be linked to \"Project Beta\" automatically.\n\n### Strategy 3: AI Fuzzy Matching\n\nIf strategies 1-2 don't find a match, the system uses AI to match the todo text against project names and client names.\n\n**How it works**:\n- Sends the todo text and list of projects (with client names) to OpenAI\n- AI determines if there's a confident match based on semantic similarity\n- Conservative matching - only links when confident\n\n**Example**: A todo \"Call Sarah about the Acme redesign\" might match to a project named \"Acme Website Redesign\" or a project with client \"Acme Corp\".\n\n### Strategy 4: Parent Block Traversal\n\nIf strategies 1-3 don't find a match and the todo is nested under a parent block, the system traverses up the block tree and applies strategies 1-3 to each ancestor.\n\n**How it works**:\n- Fetches the parent block from Notion\n- Applies strategies 1-3 to the parent's content\n- If no match, moves to grandparent, up to 5 levels\n- Stops when a match is found or reaches page level\n\n**Example**: A todo nested under a heading \"Project Gamma Tasks\" might match to \"Project Gamma\" via the parent heading's text.\n\n### Configuration\n\nTo enable project matching, set the `PROJECTS_DB_ID` environment variable to your Projects database ID. Without this, todos sync normally but without project links.\n\n**Required database properties**:\n- Your Todos database needs a **Projects db** relation property pointing to your Projects database\n- Your Projects database should have a **Clients** relation (optional, enhances AI matching)\n\n## Getting Started\n\n### Prerequisites\n\n1. Create a Notion integration at https://www.notion.so/my-integrations\n2. Create a Notion database with these properties:\n - **Name** (title)\n - **Block ID** (rich_text)\n - **Block URL** (url)\n - **Page URL** (url) - source page where todo was found\n - **Todo last edited time** (date)\n - **Owner** (people)\n - **Other people** (people)\n - **Due date** (date)\n - **Links** (rich_text)\n - **Projects db** (relation) - optional, links to Projects database\n - **Status** (select) - New pages will be set to \"Not started\"\n3. Share the database with your integration\n\n### Setup\n\n1. Fork this val in Val Town\n2. Set environment variables:\n - `NOTION_API_KEY` = your integration token\n - `TODOS_DB_ID` = your database ID\n - **Choose a search mode**:\n - **Keyword mode**: `SEARCH_KEYWORDS` = `todo` (or your preferred keywords, comma-separated)\n - **Block type mode**: `SEARCH_BLOCK_TYPE` = `to_do` (or your preferred block type)\n3. Test with: `POST /tasks/todos?hours=1`\n\n### Usage Examples\n\n#### Keyword Mode Examples\n\n**Find and sync all keyword matches from last 24 hours**:\n```bash\n# Set: SEARCH_KEYWORDS=todo\ncurl -X POST https://your-val.express/tasks/todos\n```\n\n**Custom time window**:\n```bash\n# Set: SEARCH_KEYWORDS=todo\ncurl -X POST \"https://your-val.express/tasks/todos?hours=48\"\n```\n\n**Search for multiple keywords**:\n```bash\n# Set: SEARCH_KEYWORDS=todo,zinger,🍋\ncurl -X POST https://your-val.express/tasks/todos\n```\n\n#### Block Type Mode Examples\n\n**Find and sync all checkbox todos from last 24 hours**:\n```bash\n# Set: SEARCH_BLOCK_TYPE=to_do\ncurl -X POST https://your-val.express/tasks/todos\n```\n\n**Find all bullet points with people + dates**:\n```bash\n# Set: SEARCH_BLOCK_TYPE=bulleted_list_item\ncurl -X POST https://your-val.express/tasks/todos\n```\n\n#### Other Examples\n\n**Get recent pages (API)**:\n```bash\ncurl \"https://your-val.express/api/pages/recent?hours=12\"\n```\n\n## Development Guidelines\n\n- **For project-specific architecture**: See `CLAUDE.md`\n- **For Val Town platform guidelines**: See `AGENTS.md`\n\n## Tech Stack\n\n- **Runtime**: Deno on Val Town\n- **Framework**: Hono (lightweight web framework)\n- **Frontend**: React 18.2.0 with Pico CSS (classless CSS framework)\n- **APIs**:\n - Notion API (@notionhq/client v2)\n - Val Town blob storage\n- **Language**: TypeScript\n\n## Architecture Diagrams\n\n### Complete System Flow\n\n```\n┌─────────────────────────────────────────────────────────────┐\n│ Notion Workspace │\n│ ┌──────────┐ ┌──────────┐ ┌──────────┐ │\n│ │ Page A │ │ Page B │ │ Page C │ │\n│ │ \"todo\" │ │ \"todo\" │ │ │ │\n│ └──────────┘ └──────────┘ └──────────┘ │\n└──────────────────────────┬──────────────────────────────────┘\n │\n ▼\n ┌─────────────────────────────────────┐\n │ POST /tasks/todos?keyword=todo │\n │ (Batch Search & Sync Endpoint) │\n └─────────────────┬───────────────────┘\n │\n ┌──────────────────┴──────────────────┐\n │ │\n ▼ ▼\n┌───────────────────┐ ┌──────────────────────────┐\n│ Step 1: Search │ │ Step 3: Sync (Optimized)│\n│ │ │ │\n│ • Get recent pages│ │ • Read blobs │\n│ • Fetch all blocks│ │ • Skip if synced: true │\n│ • Search keywords │ │ • Use cached page ID │\n│ • Extract data │ │ • Create/update pages │\n│ • Validate │ │ • Mark synced: true │\n└─────────┬─────────┘ └──────────────────────────┘\n │ ▲\n ▼ │\n┌─────────────────────┐ │\n│ Step 2: Store │ │\n│ │ │\n│ • Save to blobs │──────────────────────┘\n│ • Set synced: false │\n│ • Compare timestamps│\n│ • Preserve page ID │\n└─────────────────────┘\n │\n ▼\n┌─────────────────────────────────────────────────────────────────┐\n│ Val Town Blob Storage │\n│ │\n│ demo--todo--block-1: { data, sync_metadata: {synced, page_id} }│\n│ demo--todo--block-2: { data, sync_metadata: {synced, page_id} }│\n│ demo--todo--block-3: { data, sync_metadata: {synced, page_id} }│\n└─────────────────────────────────────────────────────────────────┘\n```\n\n### MVC Layer Interaction\n\n```\n┌──────────────────────────────────────────────────────────────┐\n│ HTTP Request │\n│ POST /tasks/todos?hours=24&keyword=todo │\n└──────────────────────┬───────────────────────────────────────┘\n │\n ▼\n ┌─────────────────────────────┐\n │ ROUTE (todos.ts) │\n │ • Extract query params │\n │ • Call controller │\n │ • Format HTTP response │\n └─────────────┬───────────────┘\n │\n ▼\n ┌─────────────────────────────────────┐\n │ CONTROLLER (orchestration) │\n │ • Validate inputs │\n │ • Orchestrate workflow: │\n │ 1. Get recent pages │\n │ 2. Search each page │\n │ 3. Sync to database │\n │ • Return standardized result │\n └──────────────┬──────────────────────┘\n │\n ┌───────────┼───────────┐\n │ │ │\n ▼ ▼ ▼\n ┌───────────┐ ┌──────────┐ ┌────────────┐\n │ SERVICE: │ │ SERVICE: │ │ SERVICE: │\n │ pages.ts │ │ blob.ts │ │ database.ts│\n │ │ │ │ │ │\n │ • API call│ │ • Blob │ │ • Query DB │\n │ • Parse │ │ CRUD │ │ • Create │\n │ • Return │ │ • Return │ │ • Update │\n └─────┬─────┘ └────┬─────┘ └─────┬──────┘\n │ │ │\n ▼ ▼ ▼\n Notion API Blob Storage Notion API\n```\n\n## License\n\nMIT\n",[],[538],{"_105":670,"_96":671,"_161":672,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":673,"_101":32,"_169":181,"_171":674,"_172":22,"_173":-5,"_174":675,"_99":676},"1cb9ac7c-b360-11f0-bc6f-0224a6c84d84","deno.json","019a26dc-99bf-7269-a8f6-768a874ec6fc",["D",1761588582800],"{\n \"$schema\": \"https://raw.githubusercontent.com/denoland/deno/98f62cee78e85bfc47c62ed703777c6bc8794f1c/cli/schemas/config-file.v1.json\",\n \"lock\": false,\n \"compilerOptions\": {\n \"noImplicitAny\": false,\n \"strict\": true,\n \"types\": [\"https://www.val.town/types/valtown.d.ts\"],\n \"lib\": [\n \"dom\",\n \"dom.iterable\",\n \"dom.asynciterable\",\n \"deno.ns\",\n \"deno.unstable\"\n ]\n },\n \"lint\": {\n \"include\": [\"deno:/https/esm.town/**/*\"],\n \"rules\": {\n \"exclude\": [\"no-explicit-any\"]\n }\n },\n \"node_modules_dir\": false,\n \"experimental\": {\n \"unstable-node-globals\": true,\n \"unstable-temporal\": true,\n \"unstable-worker-options\": true,\n \"unstable-sloppy-imports\": true\n }\n}",[],[671],{"_105":678,"_96":100,"_161":117,"_163":-5,"_164":142,"_165":213,"_167":22,"_107":679,"_101":680,"_169":681,"_171":682,"_172":22,"_173":-5,"_174":683,"_99":684},"9e6f9824-b96b-11f0-887f-0224a6c84d84",["D",1762253231901],4,"http","import { Hono } from \"npm:hono@4\";\nimport {\n readFile,\n serveFile,\n} from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { webhookAuth } from \"./backend/routes/authCheck.ts\";\nimport api from \"./backend/routes/api/index.ts\";\nimport favicon from \"./backend/routes/tasks/favicon.ts\";\nimport todoSearch from \"./backend/routes/tasks/todoSearch.ts\";\nimport todoSave from \"./backend/routes/tasks/todoSave.ts\";\nimport todos from \"./backend/routes/tasks/todos.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Serve static frontend files\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n// Serve main HTML page\napp.get(\"/\", async (c) => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\n// Authentication middleware\n// Protects specified prefixes, with exceptions for public endpoints\nconst protectedPrefixes = ['/tasks', '/api'];\nconst publicExceptions = ['/api/health'];\n\napp.use('*', async (c, next) => {\n const path = c.req.path;\n\n // Check if it's a public exception\n if (publicExceptions.includes(path)) {\n await next();\n return;\n }\n\n // Check if path needs auth\n const needsAuth = protectedPrefixes.some(prefix => path.startsWith(prefix));\n\n if (needsAuth) {\n await webhookAuth(c, next);\n } else {\n await next();\n }\n});\n\n// Mount API routes\napp.route(\"/api\", api);\n\n// Mount webhook routes\napp.route(\"/tasks/favicon\", favicon);\napp.route(\"/tasks/todo/search\", todoSearch);\napp.route(\"/tasks/todo/save\", todoSave);\napp.route(\"/tasks/todos\", todos);\n\n// Mount view routes (to be added)\n// Example:\n// import { viewRoutes } from './backend/routes/views/index.ts';\n// app.route('/views', viewRoutes);\n\n// This is the entry point for Val Town HTTP vals\nexport default app.fetch;\n",[],[100],"files",[158,176,186,192,198,209,218,228,238,246,257,264,273,282,288,294,302,310,319,325,334,343,352,362,369,378,384,390,399,408,416,424,433,443,451,460,466,474,483,491,500,508,518,527,536,545,551,557,565,573,582,589,597,606,612,619,628,637,645,653,661,669,677],"counts",{"_689":32,"_690":224,"_691":166,"_692":693},"pulls","branches","forks","envVars",{"_694":695,"_696":32},"count",13,"emptyCount","contents",[],{"_105":678,"_96":100,"_161":117,"_163":-5,"_164":142,"_165":213,"_167":22,"_107":700,"_101":680,"_169":681,"_171":682,"_172":22,"_173":-5,"_99":701},["D",1762253231901],[100],"upstreamProject","upstreamBranch",{"_105":145,"_107":705,"_706":707,"_96":44,"_143":151,"_101":250,"_144":-5,"_146":-5,"_708":709,"_109":-5,"_155":22,"_111":149,"_154":95,"_16":123,"_153":710},["D",1761570769002],"updatedAt",["D",1762379577029],"lockfileKey","1762415664461-esm.town_v_lightweight_scaffold@82-main","scaffold","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_94":95,"_96":97,"_98":44,"_101":102,"_99":100,"_103":717,"_156":722,"_685":912,"_181":913,"_697":915,"_916":917,"_920":-5,"_921":922,"_923":924,"_925":926,"_692":-5},{"_105":106,"_96":97,"_107":718,"_109":-5,"_110":22,"_111":112,"_113":-5,"_114":-5,"_14":115,"_116":117,"_118":119,"_120":119,"_121":-5,"_122":32,"_16":123,"_124":125,"_126":125,"_127":128,"_129":128,"_130":128,"_131":125,"_132":125,"_23":719,"_136":720,"_139":721,"_155":22},["D",1761588582800],{"_94":95,"_134":135},{"_94":95,"_138":135,"_14":115},{"_101":141,"_96":44,"_105":142,"_143":106,"_144":145,"_146":147,"_148":149,"_150":151,"_152":123,"_153":97,"_154":95},[723,729,858,882,894,897,900,903,906,909],{"_105":159,"_96":160,"_161":162,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":168,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":724,"_99":728},[725],{"_105":177,"_96":178,"_161":179,"_163":162,"_164":142,"_165":166,"_167":22,"_107":180,"_101":32,"_169":181,"_171":182,"_172":22,"_173":-5,"_174":726,"_99":727},[],[160,178],[160],{"_105":187,"_96":188,"_161":189,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":190,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":730,"_99":857},[731,752,761,797,827,854],{"_105":193,"_96":194,"_161":195,"_163":189,"_164":142,"_165":166,"_167":119,"_107":196,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":732,"_99":751},[733,736,739,742,745,748],{"_105":199,"_96":200,"_161":201,"_163":195,"_164":142,"_165":202,"_167":119,"_107":203,"_101":204,"_169":205,"_171":206,"_172":22,"_173":-5,"_174":734,"_99":735},[],[188,194,200],{"_105":210,"_96":211,"_161":212,"_163":195,"_164":142,"_165":213,"_167":22,"_107":214,"_101":166,"_169":205,"_171":215,"_172":22,"_173":-5,"_174":737,"_99":738},[],[188,194,211],{"_105":219,"_96":220,"_161":221,"_163":195,"_164":142,"_165":222,"_167":119,"_107":223,"_101":224,"_169":205,"_171":225,"_172":22,"_173":-5,"_174":740,"_99":741},[],[188,194,220],{"_105":229,"_96":230,"_161":231,"_163":195,"_164":142,"_165":232,"_167":22,"_107":233,"_101":234,"_169":205,"_171":235,"_172":22,"_173":-5,"_174":743,"_99":744},[],[188,194,230],{"_105":239,"_96":240,"_161":241,"_163":195,"_164":142,"_165":222,"_167":22,"_107":242,"_101":204,"_169":205,"_171":243,"_172":22,"_173":-5,"_174":746,"_99":747},[],[188,194,240],{"_105":247,"_96":248,"_161":249,"_163":195,"_164":142,"_165":250,"_167":22,"_107":251,"_101":252,"_169":205,"_171":253,"_172":22,"_173":-5,"_174":749,"_99":750},[],[188,194,248],[188,194],{"_105":258,"_96":259,"_161":260,"_163":189,"_164":142,"_165":261,"_167":119,"_107":262,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":753,"_99":760},[754,757],{"_105":265,"_96":266,"_161":267,"_163":260,"_164":142,"_165":222,"_167":22,"_107":268,"_101":166,"_169":269,"_171":270,"_172":22,"_173":-5,"_174":755,"_99":756},[],[188,259,266],{"_105":274,"_96":275,"_161":276,"_163":260,"_164":142,"_165":261,"_167":22,"_107":277,"_101":32,"_169":269,"_171":278,"_172":22,"_173":-5,"_174":758,"_99":759},[],[188,259,275],[188,259],{"_105":283,"_96":284,"_161":285,"_163":189,"_164":142,"_165":166,"_167":119,"_107":286,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":762,"_99":796},[763,775,790,793],{"_105":289,"_96":290,"_161":291,"_163":285,"_164":142,"_165":166,"_167":119,"_107":292,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":764,"_99":774},[765,768,771],{"_105":295,"_96":296,"_161":297,"_163":291,"_164":142,"_165":222,"_167":119,"_107":298,"_101":32,"_169":205,"_171":299,"_172":22,"_173":-5,"_174":766,"_99":767},[],[188,284,290,296],{"_105":303,"_96":304,"_161":305,"_163":291,"_164":142,"_165":222,"_167":119,"_107":306,"_101":166,"_169":205,"_171":307,"_172":22,"_173":-5,"_174":769,"_99":770},[],[188,284,290,304],{"_105":311,"_96":312,"_161":313,"_163":291,"_164":142,"_165":261,"_167":119,"_107":314,"_101":166,"_169":205,"_171":315,"_172":22,"_173":-5,"_174":772,"_99":773},[],[188,284,290,312],[188,284,290],{"_105":320,"_96":321,"_161":322,"_163":285,"_164":142,"_165":166,"_167":119,"_107":323,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":776,"_99":789},[777,780,783,786],{"_105":326,"_96":327,"_161":328,"_163":322,"_164":142,"_165":329,"_167":119,"_107":330,"_101":224,"_169":205,"_171":331,"_172":22,"_173":-5,"_174":778,"_99":779},[],[188,284,321,327],{"_105":335,"_96":336,"_161":337,"_163":322,"_164":142,"_165":338,"_167":119,"_107":339,"_101":32,"_169":205,"_171":340,"_172":22,"_173":-5,"_174":781,"_99":782},[],[188,284,321,336],{"_105":344,"_96":345,"_161":346,"_163":322,"_164":142,"_165":347,"_167":22,"_107":348,"_101":166,"_169":205,"_171":349,"_172":22,"_173":-5,"_174":784,"_99":785},[],[188,284,321,345],{"_105":353,"_96":354,"_161":355,"_163":322,"_164":142,"_165":356,"_167":22,"_107":357,"_101":224,"_169":205,"_171":358,"_172":22,"_173":-5,"_174":787,"_99":788},[],[188,284,321,354],[188,284,321],{"_105":363,"_96":364,"_161":365,"_163":285,"_164":142,"_165":166,"_167":119,"_107":366,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":791,"_99":792},[],[188,284,364],{"_105":370,"_96":371,"_161":372,"_163":285,"_164":142,"_165":213,"_167":22,"_107":373,"_101":166,"_169":205,"_171":374,"_172":22,"_173":-5,"_174":794,"_99":795},[],[188,284,371],[188,284],{"_105":379,"_96":380,"_161":381,"_163":189,"_164":142,"_165":166,"_167":119,"_107":382,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":798,"_99":826},[799,817,820,823],{"_105":385,"_96":386,"_161":387,"_163":381,"_164":142,"_165":166,"_167":119,"_107":388,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":800,"_99":816},[801,804,807,810,813],{"_105":391,"_96":392,"_161":393,"_163":387,"_164":142,"_165":394,"_167":22,"_107":395,"_101":32,"_169":205,"_171":396,"_172":22,"_173":-5,"_174":802,"_99":803},[],[188,380,386,392],{"_105":400,"_96":401,"_161":402,"_163":387,"_164":142,"_165":102,"_167":22,"_107":403,"_101":404,"_169":205,"_171":405,"_172":22,"_173":-5,"_174":805,"_99":806},[],[188,380,386,401],{"_105":409,"_96":304,"_161":410,"_163":387,"_164":142,"_165":411,"_167":22,"_107":412,"_101":224,"_169":205,"_171":413,"_172":22,"_173":-5,"_174":808,"_99":809},[],[188,380,386,304],{"_105":417,"_96":312,"_161":418,"_163":387,"_164":142,"_165":419,"_167":22,"_107":420,"_101":204,"_169":205,"_171":421,"_172":22,"_173":-5,"_174":811,"_99":812},[],[188,380,386,312],{"_105":425,"_96":426,"_161":427,"_163":387,"_164":142,"_165":261,"_167":119,"_107":428,"_101":32,"_169":205,"_171":429,"_172":22,"_173":-5,"_174":814,"_99":815},[],[188,380,386,426],[188,380,386],{"_105":434,"_96":435,"_161":436,"_163":381,"_164":142,"_165":437,"_167":22,"_107":438,"_101":439,"_169":205,"_171":440,"_172":22,"_173":-5,"_174":818,"_99":819},[],[188,380,435],{"_105":444,"_96":445,"_161":446,"_163":381,"_164":142,"_165":222,"_167":22,"_107":447,"_101":224,"_169":205,"_171":448,"_172":22,"_173":-5,"_174":821,"_99":822},[],[188,380,445],{"_105":452,"_96":453,"_161":454,"_163":381,"_164":142,"_165":234,"_167":119,"_107":455,"_101":166,"_169":205,"_171":456,"_172":22,"_173":-5,"_174":824,"_99":825},[],[188,380,453],[188,380],{"_105":461,"_96":462,"_161":463,"_163":189,"_164":142,"_165":338,"_167":119,"_107":464,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":828,"_99":853},[829,832,835,838,841,844,847,850],{"_105":467,"_96":468,"_161":469,"_163":463,"_164":142,"_165":338,"_167":119,"_107":470,"_101":32,"_169":205,"_171":471,"_172":22,"_173":-5,"_174":830,"_99":831},[],[188,462,468],{"_105":475,"_96":476,"_161":477,"_163":463,"_164":142,"_165":478,"_167":22,"_107":479,"_101":32,"_169":205,"_171":480,"_172":22,"_173":-5,"_174":833,"_99":834},[],[188,462,476],{"_105":484,"_96":485,"_161":486,"_163":463,"_164":142,"_165":222,"_167":119,"_107":487,"_101":32,"_169":205,"_171":488,"_172":22,"_173":-5,"_174":836,"_99":837},[],[188,462,485],{"_105":492,"_96":493,"_161":494,"_163":463,"_164":142,"_165":495,"_167":119,"_107":496,"_101":32,"_169":205,"_171":497,"_172":22,"_173":-5,"_174":839,"_99":840},[],[188,462,493],{"_105":501,"_96":502,"_161":503,"_163":463,"_164":142,"_165":338,"_167":119,"_107":504,"_101":32,"_169":205,"_171":505,"_172":22,"_173":-5,"_174":842,"_99":843},[],[188,462,502],{"_105":509,"_96":510,"_161":511,"_163":463,"_164":142,"_165":512,"_167":22,"_107":513,"_101":514,"_169":205,"_171":515,"_172":22,"_173":-5,"_174":845,"_99":846},[],[188,462,510],{"_105":519,"_96":520,"_161":521,"_163":463,"_164":142,"_165":522,"_167":22,"_107":523,"_101":224,"_169":205,"_171":524,"_172":22,"_173":-5,"_174":848,"_99":849},[],[188,462,520],{"_105":528,"_96":529,"_161":530,"_163":463,"_164":142,"_165":495,"_167":119,"_107":531,"_101":32,"_169":205,"_171":532,"_172":22,"_173":-5,"_174":851,"_99":852},[],[188,462,529],[188,462],{"_105":537,"_96":538,"_161":539,"_163":189,"_164":142,"_165":166,"_167":119,"_107":540,"_101":32,"_169":181,"_171":541,"_172":22,"_173":-5,"_174":855,"_99":856},[],[188,538],[188],{"_105":546,"_96":547,"_161":548,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":549,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":859,"_99":881},[860,872,875,878],{"_105":552,"_96":553,"_161":554,"_163":548,"_164":142,"_165":166,"_167":119,"_107":555,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":861,"_99":871},[862,865,868],{"_105":558,"_96":559,"_161":560,"_163":554,"_164":142,"_165":213,"_167":22,"_107":561,"_101":224,"_169":205,"_171":562,"_172":22,"_173":-5,"_174":863,"_99":864},[],[547,553,559],{"_105":566,"_96":567,"_161":568,"_163":554,"_164":142,"_165":166,"_167":119,"_107":569,"_101":32,"_169":205,"_171":570,"_172":22,"_173":-5,"_174":866,"_99":867},[],[547,553,567],{"_105":574,"_96":575,"_161":576,"_163":554,"_164":142,"_165":166,"_167":119,"_107":577,"_101":32,"_169":205,"_171":578,"_172":22,"_173":-5,"_174":869,"_99":870},[],[547,553,575],[547,553],{"_105":583,"_96":538,"_161":584,"_163":548,"_164":142,"_165":166,"_167":119,"_107":585,"_101":32,"_169":181,"_171":586,"_172":22,"_173":-5,"_174":873,"_99":874},[],[547,538],{"_105":590,"_96":591,"_161":592,"_163":548,"_164":142,"_165":222,"_167":22,"_107":593,"_101":166,"_169":181,"_171":594,"_172":22,"_173":-5,"_174":876,"_99":877},[],[547,591],{"_105":598,"_96":599,"_161":600,"_163":548,"_164":142,"_165":166,"_167":119,"_107":601,"_101":32,"_169":205,"_171":602,"_172":22,"_173":-5,"_174":879,"_99":880},[],[547,599],[547],{"_105":607,"_96":608,"_161":609,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":610,"_101":32,"_169":170,"_171":-5,"_172":22,"_173":-5,"_174":883,"_99":893},[884,887,890],{"_105":613,"_96":538,"_161":614,"_163":609,"_164":142,"_165":166,"_167":119,"_107":615,"_101":32,"_169":181,"_171":616,"_172":22,"_173":-5,"_174":885,"_99":886},[],[608,538],{"_105":620,"_96":621,"_161":622,"_163":609,"_164":142,"_165":623,"_167":22,"_107":624,"_101":439,"_169":205,"_171":625,"_172":22,"_173":-5,"_174":888,"_99":889},[],[608,621],{"_105":629,"_96":630,"_161":631,"_163":609,"_164":142,"_165":222,"_167":119,"_107":632,"_101":166,"_169":205,"_171":633,"_172":22,"_173":-5,"_174":891,"_99":892},[],[608,630],[608],{"_105":638,"_96":639,"_161":640,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":641,"_101":32,"_169":181,"_171":642,"_172":22,"_173":-5,"_174":895,"_99":896},[],[639],{"_105":646,"_96":647,"_161":648,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":649,"_101":32,"_169":181,"_171":650,"_172":22,"_173":-5,"_174":898,"_99":899},[],[647],{"_105":654,"_96":655,"_161":656,"_163":-5,"_164":142,"_165":166,"_167":22,"_107":657,"_101":32,"_169":181,"_171":658,"_172":22,"_173":-5,"_174":901,"_99":902},[],[655],{"_105":662,"_96":538,"_161":663,"_163":-5,"_164":142,"_165":664,"_167":22,"_107":665,"_101":347,"_169":181,"_171":666,"_172":22,"_173":-5,"_174":904,"_99":905},[],[538],{"_105":670,"_96":671,"_161":672,"_163":-5,"_164":142,"_165":166,"_167":119,"_107":673,"_101":32,"_169":181,"_171":674,"_172":22,"_173":-5,"_174":907,"_99":908},[],[671],{"_105":678,"_96":100,"_161":117,"_163":-5,"_164":142,"_165":213,"_167":22,"_107":679,"_101":680,"_169":681,"_171":682,"_172":22,"_173":-5,"_174":910,"_99":911},[],[100],[723,725,729,731,733,736,739,742,745,748,752,754,757,761,763,765,768,771,775,777,780,783,786,790,793,797,799,801,804,807,810,813,817,820,823,827,829,832,835,838,841,844,847,850,854,858,860,862,865,868,872,875,878,882,884,887,890,894,897,900,903,906,909],{"_105":678,"_96":100,"_161":117,"_163":-5,"_164":142,"_165":213,"_167":22,"_107":700,"_101":680,"_169":681,"_171":682,"_172":22,"_173":-5,"_99":914},[100],[],"upstream",{"_105":145,"_107":918,"_706":919,"_96":44,"_143":151,"_101":250,"_144":-5,"_146":-5,"_708":709,"_109":-5,"_155":22,"_111":149,"_154":95,"_16":123,"_153":710},["D",1761570769002],["D",1762379577029],"pull","ahead",261,"behind",9,"templates",[],"actionData","errors"] </article></body></html>

\n `todoSweeper`\n

Connection status

Troubleshooting

\n {block.heading_1?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n

\n {block.heading_2?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n

\n {block.heading_3?.rich_text?.map((text: any, i: number) => (\n {text.plain_text}\n ))}\n

Hi