Firewood Cafe — SquareMenu

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_199":200,"_201":202},"routes/_app.x.$handle.$name",{"_103":102,"_37":48,"_112":93,"_32":113,"_13":14,"_114":-5,"_11":115,"_116":117,"_118":119,"_120":121,"_122":123,"_26":-5,"_124":-5,"_125":-5,"_126":30,"_127":128,"_129":62,"_130":-5,"_131":-5,"_132":133},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_46":47,"_37":48,"_41":49,"_50":-5,"_51":30,"_52":53,"_54":53,"_55":56,"_57":-5,"_19":58,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":66,"_67":68,"_69":70,"_71":72,"_73":74,"_75":-5,"_76":77,"_78":77,"_79":80,"_81":80,"_82":80,"_83":77,"_84":77,"_85":86,"_87":88,"_89":90,"_91":30},"version",12,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","8cd0de43-7448-403a-b99e-4d372ec52722","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":-7,"_29":30,"_31":30,"_32":33,"_34":33},"file",{"_35":36,"_37":33,"_38":26,"_39":40,"_41":42,"_43":14,"_44":45,"_29":30},"previous","deleted",false,"deletedHere","path","README.md","latestPath","fileId","c5ff5d2a-4c28-11f1-9913-ee650bb23af1","name","fileType","content","# Firewood Cafe Menu System\n\nA modern, AI-powered menu management system for Firewood Cafe with real-time updates and PIN-protected editing.\n\n## Features\n\n### 🎯 Customer-Facing Menu (`/`)\n- Beautiful responsive menu with categories: Breakfast, Burgers, Lunch, Drinks\n- Tap any dish to see full details, ingredients, and multilingual descriptions\n- AI-generated descriptions in English, Tagalog, and Chinese\n- Smooth cart management with checkout flow\n- Buzzer system for order pickup\n- **Live data**: Always displays the latest menu from blob storage\n\n### ✏️ PIN-Protected Menu Editor (`/edit`)\n- **PIN Security**: Enter last 4 digits of phone number to unlock\n- **Real-time editing**: Edit dish names, descriptions, prices\n- **Hide/show dishes**: Toggle visibility without deleting\n- **Add new dishes**: Quick button to add menu items\n- **Delete dishes**: Remove items with confirmation\n- **Instant save**: Changes go live immediately in blob storage\n\n### 🤖 AI-Assisted Dish Creation\n- **Smart generation**: Type a few words about a new dish (e.g., \"spicy chicken curry with rice\")\n- **AI handles everything**: Claude generates:\n - Professional dish name\n - Appetizing 1-2 sentence description\n - Relevant emoji\n - Ingredient list\n - Menu tags (Spicy, Vegetarian, etc.)\n- **One-click add**: Add generated dishes directly to any category\n\n## Architecture\n\n### Files\n- **`index.html`** - Customer-facing menu (loads data from API)\n- **`edit.tsx`** - PIN-protected editor with AI integration\n- **`api.ts`** - Backend API with three endpoints:\n - `GET /api/menu` - Fetch current menu\n - `POST /api/menu` - Save menu (PIN required)\n - `POST /api/generate-dish` - AI dish generation\n\n### Data Storage\n- **Blob Storage**: Menu data persists in Val Town blob storage (key: `firewood_cafe_menu_data`)\n- **Fallback**: Default menu loads if no blob data exists\n- **No reload needed**: Changes save to blob and appear instantly on customer menu\n\n## Environment Variables\n\n```\nCLAUDE_API_KEY - Anthropic API key for AI dish generation\nMENU_EDIT_PIN - 4-digit PIN for menu editor (default: 3456)\n```\n\n### Setting Up\n1. Get your Claude API key from https://console.anthropic.com\n2. Update the env vars in Val Town dashboard:\n - `CLAUDE_API_KEY`: Your actual key\n - `MENU_EDIT_PIN`: Last 4 digits of Tara's phone number\n\n## Usage\n\n### For Customers\nVisit the main menu and:\n- Browse categories (swipe left to scroll)\n- Tap dish names to learn more\n- Tap ingredients to see details\n- Add items to cart\n- Proceed to checkout (buzzer number on completion)\n\n### For Tara (Menu Manager)\n1. Click the **🔧 Edit** link in the menu header\n2. Enter your 4-digit PIN\n3. Edit existing dishes or use AI Assist to create new ones\n4. Click **💾 Save** when done\n5. Changes go live immediately ✨\n\n### AI Assist Workflow\n1. In the editor, type a description (e.g., \"crispy tofu spring rolls with sweet chilli\")\n2. Click **Generate Dish**\n3. Review the AI output\n4. Click **Add to Menu** and select a category\n5. Saved instantly!\n\n## Customization\n\n### Default Menu\nThe default menu structure is in `api.ts`. Edit the `getDefaultMenu()` function to change it.\n\n### Styling\nBoth menus use the same color scheme:\n- Gold: `#D4841B` (primary)\n- Dark brown: `#1a1410` (background)\n- See CSS variables in HTML for full customization\n\n### Categories\nCurrently supports: Breakfast, Burgers, Lunch, Drinks\nTo add more, update:\n1. `api.ts` - `getDefaultMenu()` structure\n2. `index.html` - Category buttons and sections\n3. `edit.tsx` - Rendering logic\n\n## How It Works\n\n### Menu Flow\n1. **Tara edits menu** → PIN verified → Changes sent to `/api/menu` (POST)\n2. **API saves to blob** → Menu persists\n3. **Customers load menu** → `/api/menu` (GET) fetches latest blob data\n4. **No page reload needed** → Changes visible immediately\n\n### AI Generation\n1. **Tara types prompt** → Sent to `/api/generate-dish`\n2. **Claude processes** → Returns structured dish data (JSON)\n3. **Preview shown** → Tara confirms and selects category\n4. **Saved instantly** → Added to menu in blob\n\n## Tips\n\n- **PIN Security**: Use your phone's last 4 digits so only you remember it\n- **Bulk edits**: Edit all dishes at once; save them all together\n- **AI prompts**: Be specific for better results (ingredients work great!)\n- **Testing**: Use PIN `3456` for testing (change it in env vars)\n\n## Links\n\n- **Menu**: \n- **Editor**: \n- **API**: \n\n---\n\nBuilt with ❤️ for Firewood Cafe\n","createdAt",["D",1778387342935],"branchVersion","branchId","4262b216-4b86-11f1-8c41-ee650bb23af1","id","4262208a-4b86-11f1-8c41-ee650bb23af1","firewood-cafe-menu",["D",1778317543661],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Firewood Cafe menu with SquareMenu ordering flow","imageUrl","9e73754f-780d-46b7-924e-110519305b47","pinnedFileId","6c4c727c-4c28-11f1-b8d4-ee650bb23af1","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",1,"orgId","019d76ed-e14a-727a-b612-7191b6d5a9b7","tursoName","4262208a4b8611f18c41ee650bb23af1","tursoHostname","4262208a4b8611f18c41ee650bb23af1-val-town.aws-us-east-2.turso.io","tursoMeasuredAt",["D",1789468254172],"pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_103":102,"_111":107},"org",{"_103":102,"_104":105,"_106":107,"_19":58,"_108":109,"_110":30},"branch",{"_13":92,"_37":93,"_46":45,"_94":47,"_95":-5,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":48,"_101":102},"isOwned",71,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","jgwynne7_4bf3679b","handle","displayName","iTabs-Menu","avatar","https://avatars.githubusercontent.com/u/177847225?v=4","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_46":47,"_37":48,"_41":194,"_50":-5,"_51":30,"_52":53,"_54":53,"_55":56,"_57":-5,"_19":58,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":66,"_67":68,"_69":70,"_71":72,"_73":195,"_75":-5,"_76":77,"_78":77,"_79":80,"_81":80,"_82":80,"_83":77,"_84":77,"_85":196,"_87":197,"_89":198,"_91":30},"tree",[177,178,179,180],"files",[177,178,179,180],"counts",{"_166":160,"_167":66,"_168":160,"_169":170,"_171":172},"contents",[134,135,136,137],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_46":163,"_37":33,"_35":36,"_141":-5,"_44":45,"_43":14,"_143":62,"_41":164,"_13":160,"_38":26,"_39":40,"_29":30,"_148":-5,"_32":165},{"_46":157,"_37":158,"_35":60,"_141":-5,"_44":45,"_43":145,"_143":30,"_41":159,"_13":160,"_38":146,"_39":161,"_29":30,"_148":-5,"_32":162},{"_46":150,"_37":151,"_35":152,"_141":-5,"_44":45,"_43":153,"_143":30,"_41":154,"_13":66,"_38":146,"_39":155,"_29":30,"_148":-5,"_32":156},{"_46":138,"_37":139,"_35":140,"_141":-5,"_44":45,"_43":142,"_143":30,"_41":144,"_13":145,"_38":146,"_39":147,"_29":30,"_148":-5,"_32":149},"741c23c6-4c28-11f1-b468-ee650bb23af1","index.html","426557d2-4b86-11f1-8c41-ee650bb23af1","parentId",6,"latest",["D",1778387205544],4,"http","export default async function (req: Request): Promise {\n const html = `\n\n\n\n\nFirewood Cafe — SquareMenu\n\n\n\n\n\n\n\n

Breakfast

Burgers

Lunch

Drinks

\n\n\n

👆 Tap any dish name to learn more

\n\n

Breakfast

\n\n\n\n\n

View Order

\n\n\n

\n\n\n\n

Your Order

\n \n

\n\n\n

\n \n

Your Details

Your name for the order

\n \n

\n\n\n

\n \n

Payment

Choose payment method

💳

Card

Credit or debit

📱

Apple Pay

Touch / Face ID

🟢

Google Pay

Pay with Google

💬

WeChat Pay

微信支付

Card Details

▣

•••• •••• •••• ••••

Card Holder

YOUR NAME

Expires

MM/YY

Card number

\n \n

Expiry

CVV

\n \n \n

\n\n\n

Processing payment...

\n\n\n

✓

Order Confirmed!

Your Buzzer Number

We'll buzz you when it's ready 🔔

Estimated wait: ~10 mins

⭐ Enjoying your food? Leave us a Google Review!

\n\n\n \n`;\n return new Response(html, { headers: { \"Content-Type\": \"text/html; charset=utf-8\" } });\n}","label",[139],"b9188d02-4c28-11f1-9698-ee650bb23af1","edit.tsx","a9108568-4c28-11f1-88df-ee650bb23af1",11,["D",1778387321286],"export default async function (req: Request): Promise {\n return new Response(`\n\n\n \n \n Firewood Cafe — Menu Editor\n \n \n\n\n

Menu Editor

Enter your PIN

\n \n \n

Invalid PIN

\n \n

✨ AI Assist

\n \n \n

Generating...

\n \n

\n\n\n`, {headers: {\"Content-Type\": \"text/html; charset=utf-8\"}});\n}\n",[151],"6c4c71b4-4c28-11f1-b8d4-ee650bb23af1","api.ts",["D",1778387192447],0,"import { blob } from \"https://esm.town/v/std/blob\";\n\nconst MENU_KEY = \"firewood_cafe_menu_data\";\nconst API_KEY = Deno.env.get(\"CLAUDE_API_KEY\") || \"\";\n\n// Get default menu if blob doesn't exist\nfunction getDefaultMenu() {\n return {\n breakfast: [\n {\n name: \"Big Brekky\",\n desc: \"Eggs your way, bacon, mushroom, hash brown, toast\",\n ingredients: [\"Eggs\", \"Bacon\", \"Mushroom\", \"Hash Brown\", \"Toast\"],\n price: 18,\n emoji: \"🍳\",\n tags: [\"⭐⭐ Favourite\"],\n },\n {\n name: \"Eggs Benedict\",\n desc: \"Poached eggs, hash brown, hollandaise\",\n ingredients: [\"Poached Eggs\", \"Hash Brown\", \"Hollandaise\", \"English Muffin\"],\n price: 16,\n emoji: \"🥚\",\n tags: [\"⭐ Favourite\"],\n },\n {\n name: \"Bacon & Egg Wrap\",\n desc: \"Bacon, eggs, and cheese in a warm tortilla wrap\",\n ingredients: [\"Bacon\", \"Eggs\", \"Cheese\", \"Tortilla Wrap\"],\n price: 12,\n emoji: \"🌯\",\n tags: [\"Quick\", \"Casual\"],\n },\n ],\n burgers: [\n {\n name: \"Classic Beef\",\n desc: \"120g patty with lettuce, tomato, cheese, caramelised onion, sesame bun\",\n ingredients: [\"Beef Patty\", \"Lettuce\", \"Tomato\", \"Cheese\", \"Caramelised Onion\", \"Sesame Bun\"],\n price: 16,\n emoji: \"🍔\",\n tags: [\"⭐⭐ Favourite\"],\n },\n {\n name: \"Chicken Avocado\",\n desc: \"Grilled chicken breast, fresh avocado, mayo, crisp lettuce\",\n ingredients: [\"Chicken Breast\", \"Avocado\", \"Mayonnaise\", \"Lettuce\", \"Tomato\", \"Bun\"],\n price: 17,\n emoji: \"🍗\",\n tags: [\"⭐ Favourite\", \"Fresh\"],\n },\n {\n name: \"Veggie Burger\",\n desc: \"House-made patty with roasted vegetables and vegan mayo\",\n ingredients: [\"Veggie Patty\", \"Roasted Vegetables\", \"Vegan Mayo\", \"Lettuce\", \"Bun\"],\n price: 15,\n emoji: \"🥬\",\n tags: [\"Vegetarian\", \"Vegan Option\"],\n },\n ],\n lunch: [\n {\n name: \"Fish & Chips\",\n desc: \"2 pieces battered fish with tartare sauce and lemon\",\n ingredients: [\"Fish Fillet\", \"Batter\", \"Chips\", \"Tartare Sauce\", \"Lemon\"],\n price: 18,\n emoji: \"🐟\",\n tags: [\"⭐⭐ Favourite\", \"Classic\"],\n },\n {\n name: \"Fried Chicken\",\n desc: \"3 pieces golden fried chicken with chips, coleslaw, sweet chilli\",\n ingredients: [\"Chicken\", \"Batter\", \"Chips\", \"Coleslaw\", \"Sweet Chilli Sauce\"],\n price: 16,\n emoji: \"🍗\",\n tags: [\"⭐ Favourite\", \"Crispy\"],\n },\n {\n name: \"Calamari\",\n desc: \"Tender calamari rings with lemon pepper seasoning\",\n ingredients: [\"Calamari\", \"Lemon Pepper\", \"Salt\", \"Oil\"],\n price: 15,\n emoji: \"🦑\",\n tags: [\"Seafood\", \"Tender\"],\n },\n ],\n };\n}\n\nexport default async function (req: Request): Promise {\n const url = new URL(req.url);\n\n // GET /api/menu - fetch current menu\n if (req.method === \"GET\" && url.pathname === \"/api/menu\") {\n try {\n const stored = await blob.get(MENU_KEY);\n const menu = stored ? JSON.parse(stored) : getDefaultMenu();\n return Response.json(menu);\n } catch {\n return Response.json(getDefaultMenu());\n }\n }\n\n // POST /api/menu - save updated menu (PIN protected)\n if (req.method === \"POST\" && url.pathname === \"/api/menu\") {\n try {\n const { pin, menu } = await req.json();\n\n // Verify PIN (last 4 digits of phone - hardcoded for now, ideally from env var)\n const CORRECT_PIN = Deno.env.get(\"MENU_EDIT_PIN\") || \"3456\"; // Default for demo\n\n if (pin !== CORRECT_PIN) {\n return Response.json({ error: \"Invalid PIN\" }, { status: 401 });\n }\n\n // Save to blob\n await blob.set(MENU_KEY, JSON.stringify(menu));\n\n return Response.json({ success: true, message: \"Menu saved\" });\n } catch (error) {\n return Response.json({ error: String(error) }, { status: 400 });\n }\n }\n\n // POST /api/generate-dish - AI assist for dish creation\n if (req.method === \"POST\" && url.pathname === \"/api/generate-dish\") {\n try {\n const { prompt } = await req.json();\n\n if (!API_KEY) {\n return Response.json(\n { error: \"AI API key not configured\" },\n { status: 500 }\n );\n }\n\n const response = await fetch(\"https://api.anthropic.com/v1/messages\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"x-api-key\": API_KEY,\n },\n body: JSON.stringify({\n model: \"claude-opus-4-1-20250805\",\n max_tokens: 500,\n system: `You are a creative chef helping design new menu items. Based on a brief description, generate a JSON object with these fields:\n- name: A catchy, professional dish name (5-7 words max)\n- desc: A 1-2 sentence appealing description\n- emoji: One relevant emoji\n- tags: An array of 2-3 tags (e.g., \"Quick\", \"Vegetarian\", \"Spicy\")\n- ingredients: An array of 4-6 main ingredients\nReturn ONLY valid JSON, no markdown formatting.`,\n messages: [\n {\n role: \"user\",\n content: `Create a new menu item based on: ${prompt}`,\n },\n ],\n }),\n });\n\n if (!response.ok) {\n const err = await response.text();\n throw new Error(`API error: ${err}`);\n }\n\n const data = await response.json();\n const text = data.content?.[0]?.text || \"{}\";\n\n // Extract JSON from response (in case there's markdown wrapping)\n const jsonMatch = text.match(/\\{[\\s\\S]*\\}/);\n const json = jsonMatch ? JSON.parse(jsonMatch[0]) : JSON.parse(text);\n\n return Response.json(json);\n } catch (error) {\n return Response.json(\n { error: `AI generation failed: ${String(error)}` },\n { status: 400 }\n );\n }\n }\n\n return Response.json({ error: \"Not found\" }, { status: 404 });\n}\n",[158],"c5ff5c76-4c28-11f1-9913-ee650bb23af1",["D",1778387342935],[33],"pulls","branches","forks","envVars",{"_173":175,"_176":160},"connections",{"_173":160,"_174":160},"count","unfilledCount",3,"emptyCount",{"_46":163,"_37":33,"_35":36,"_141":-5,"_44":45,"_43":14,"_143":62,"_41":191,"_13":160,"_38":26,"_39":40,"_29":30,"_148":-5,"_182":192,"_32":193},{"_46":157,"_37":158,"_35":60,"_141":-5,"_44":45,"_43":145,"_143":30,"_41":188,"_13":160,"_38":146,"_39":161,"_29":30,"_148":-5,"_182":189,"_32":190},{"_46":150,"_37":151,"_35":152,"_141":-5,"_44":45,"_43":153,"_143":30,"_41":185,"_13":66,"_38":146,"_39":155,"_29":30,"_148":-5,"_182":186,"_32":187},{"_46":138,"_37":139,"_35":140,"_141":-5,"_44":45,"_43":142,"_143":30,"_41":181,"_13":145,"_38":146,"_39":147,"_29":30,"_148":-5,"_182":183,"_32":184},["D",1778387205544],"children",[],[139],["D",1778387321286],[],[151],["D",1778387192447],[],[158],["D",1778387342935],[],[33],["D",1778317543661],["D",1789468254172],{"_103":102,"_111":107},{"_103":102,"_104":105,"_106":107,"_19":58,"_108":109,"_110":30},{"_13":92,"_37":93,"_46":45,"_94":47,"_95":-5,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":48,"_101":102},"ctx",{"_85":-5,"_131":232,"_233":234,"_235":236,"_237":30,"_238":30,"_239":30,"_240":62,"_241":-5,"_242":-7,"_243":-7,"_244":160,"_245":30,"_246":30,"_247":-5,"_248":30,"_249":30,"_250":30,"_251":-5},"ENV",{"_203":204,"_205":206,"_207":93,"_208":209,"_210":211,"_212":213,"_214":215,"_216":217,"_218":219,"_220":221,"_222":223,"_224":225,"_226":227,"_228":229,"_230":231},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v12