[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_219":220,"_221":222},"routes/_app.x.$handle.$name",{"_104":103,"_38":52,"_112":94,"_33":113,"_13":14,"_114":-5,"_11":115,"_116":117,"_118":119,"_120":121,"_122":123,"_26":-5,"_124":-5,"_125":-5,"_126":31,"_127":128,"_129":66,"_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",{"_50":51,"_38":52,"_45":53,"_54":-5,"_55":31,"_56":57,"_58":57,"_59":60,"_61":-5,"_19":62,"_63":64,"_65":66,"_67":-5,"_68":-5,"_69":70,"_71":72,"_73":-5,"_74":-5,"_75":-5,"_76":-5,"_77":78,"_79":78,"_80":81,"_82":81,"_83":81,"_84":78,"_85":78,"_86":87,"_88":89,"_90":91,"_92":31},"version",8,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","b5f60e01-336b-4542-b487-9b0d497a84bc","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":29,"_30":31,"_32":31,"_33":34,"_35":34},"file",{"_36":37,"_38":39,"_40":41,"_42":44,"_45":46,"_47":14,"_48":49,"_30":31},"previous",{"_36":37,"_38":39,"_40":41,"_42":43},"deleted",false,"deletedHere","path","frontend/components/App.tsx","latestPath","fileId","455889fa-3f3d-11f1-ab34-42b51c65c3df","name","App.tsx","fileType","script","content","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\ntype SessionInfo =\n | { loggedIn: false }\n | { loggedIn: true; user: { username: string; profileImageUrl: string | null; tier: string | null }; isOrgMember: boolean };\n\nexport function App() {\n const [session, setSession] = useState(null);\n\n useEffect(() => {\n fetch(\"/api/me\").then((r) => r.json()).then(setSession);\n }, []);\n\n if (!session) {\n return (\n

Loading…

\n );\n }\n\n // State 1: Not logged in — public landing page\n if (!session.loggedIn) return ;\n\n // State 2: Logged in but NOT an org member — \"request access\" page\n if (!session.isOrgMember) return ;\n\n // State 3: Logged in AND an org member — the goods\n return ;\n}\n\nfunction LandingPage() {\n return (\n

🎉

\n Party! Org Portal\n

\n This is an org-scoped app. Only members of the partytime org can see what's inside.\n Think of it like a private Google Doc — but for a whole app.\n

\n\n \n $\"Val$ \n Log in with Val Town\n \n\n

\n Don't have access? You can request an invite after logging in.\n

\n\n

\n \n \n \n

\n\n \n

\n );\n}\n\nfunction Card({ emoji, title, description }: { emoji: string; title: string; description: string }) {\n return (\n

{emoji}

{title}

{description}

\n );\n}\n\nfunction NotAMember({ username }: { username: string }) {\n const [requested, setRequested] = useState(false);\n\n return (\n

🚪

\n Hey {username}!\n

\n You're logged in, but you're not a member of the partytime org yet.\n This content is only visible to org members.\n

\n\n {!requested ? (\n setRequested(true)}\n className=\"bg-purple-600 text-white font-semibold px-6 py-3 rounded-xl hover:bg-purple-700 transition-colors\"\n >\n 🙋 Request Access\n \n ) : (\n

\n ✅ Request sent! (This is a demo — in a real app, this would notify an org admin.)\n

\n )}\n\n \n

\n );\n}\n\nfunction OrgContent({ user }: { user: { username: string; profileImageUrl: string | null; tier: string | null } }) {\n return (\n

\n \n\n

Welcome to the inner sanctum 🎊

\n This content is only visible to partytime org members.\n Non-members see a landing page with a \"request access\" flow instead.\n

\n\n

📊 Org Dashboard

\n Imagine internal metrics, team docs, or admin tools here.\n Only your org can see this.\n

🔗 Shared Resources

\n Like Dropbox or Google Drive sharing — but for entire apps, not just files.\n

💬 Team Chat

\n Could be a real-time feed, announcements, or anything collaborative.\n

🛠️ Internal Tools

\n Deploy tools that only your team can access. No separate auth system needed.\n

\n\n

💡 How this works

Public URL: Anyone can visit this URL and see the landing page.
Login gate: Clicking \"Log in\" uses Val Town's built-in OAuth (zero config).
Org check: After login, session.isOrgMember determines what you see.
Non-members: Get a friendly \"request access\" screen (like Google Docs' \"request edit access\").
Members: See the actual app content — dashboards, tools, whatever you build.

\n\n \n

\n );\n}\n","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\ntype SessionInfo =\n | { loggedIn: false }\n | { loggedIn: true; user: { username: string; profileImageUrl: string | null; tier: string | null }; isOrgMember: boolean };\n\nexport function App() {\n const [session, setSession] = useState(null);\n\n useEffect(() => {\n fetch(\"/api/me\").then((r) => r.json()).then(setSession);\n }, []);\n\n if (!session) {\n return (\n

Loading…

🎉

\n Party! Org Portal\n

\n This is an org-scoped app. Only members of the partytime org can see what's inside.\n Think of it like a private Google Doc — but for a whole app.\n

\n\n

\n \n $\"Val$ \n Sign in with Val Town\n \n\n

\n Don't have an account?{\" \"}\n \n Sign up free\n {\" \"}\n — it takes 10 seconds\n

\n\n

How it works

\n Sign in (or create a free Val Town account), and if you're a member of the\n partytime org you'll see the content immediately.\n Not a member yet? You can request access after signing in.\n

\n\n

\n \n \n \n

\n\n \n

\n );\n}\n\nfunction Card({ emoji, title, description }: { emoji: string; title: string; description: string }) {\n return (\n

{emoji}

{title}

{description}

\n );\n}\n\nfunction NotAMember({ username }: { username: string }) {\n const [requested, setRequested] = useState(false);\n\n return (\n

🚪

\n Hey {username}!\n

\n You're logged in, but you're not a member of the partytime org yet.\n This content is only visible to org members.\n

\n\n {!requested ? (\n setRequested(true)}\n className=\"bg-purple-600 text-white font-semibold px-6 py-3 rounded-xl hover:bg-purple-700 transition-colors\"\n >\n 🙋 Request Access\n \n ) : (\n

\n ✅ Request sent! (This is a demo — in a real app, this would notify an org admin.)\n

\n )}\n\n \n

\n );\n}\n\nfunction OrgContent({ user }: { user: { username: string; profileImageUrl: string | null; tier: string | null } }) {\n return (\n

\n \n\n

Welcome to the inner sanctum 🎊

\n This content is only visible to partytime org members.\n Non-members see a landing page with a \"request access\" flow instead.\n

\n\n

📊 Org Dashboard

\n Imagine internal metrics, team docs, or admin tools here.\n Only your org can see this.\n

🔗 Shared Resources

\n Like Dropbox or Google Drive sharing — but for entire apps, not just files.\n

💬 Team Chat

\n Could be a real-time feed, announcements, or anything collaborative.\n

🛠️ Internal Tools

\n Deploy tools that only your team can access. No separate auth system needed.\n

\n\n

💡 How this works

Public URL: Anyone can visit this URL and see the landing page.
Login gate: Clicking \"Log in\" uses Val Town's built-in OAuth (zero config).
Org check: After login, session.isOrgMember determines what you see.
Non-members: Get a friendly \"request access\" screen (like Google Docs' \"request edit access\").
Members: See the actual app content — dashboards, tools, whatever you build.

\n\n \n

\n );\n}\n","createdAt",["D",1776972296618],"branchVersion","branchId","1d77fa88-3f3d-11f1-923e-42b51c65c3df","id","1d77900c-3f3d-11f1-923e-42b51c65c3df","org-portal-demo",["D",1776966714509],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Demo: org-scoped content portal with Val Town OAuth","imageUrl","9319c175-2593-4f88-ba21-04f2ef7b1c28","pinnedFileId","25f03eb4-3f3d-11f1-85f1-42b51c65c3df","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","019ce3b3-a6dd-72da-a35a-9c8ead8fa32a","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_104":103,"_111":-5},"org",{"_104":103,"_105":106,"_107":-5,"_19":-5,"_108":109,"_110":31},"branch",{"_13":93,"_38":94,"_50":49,"_95":51,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":52,"_102":103},"isOwned",14,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","partytime","handle","displayName","Party!","avatar","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_50":51,"_38":52,"_45":215,"_54":-5,"_55":31,"_56":57,"_58":57,"_59":60,"_61":-5,"_19":62,"_63":64,"_65":66,"_67":-5,"_68":-5,"_69":70,"_71":72,"_73":-5,"_74":-5,"_75":-5,"_76":-5,"_77":78,"_79":78,"_80":81,"_82":81,"_83":81,"_84":78,"_85":78,"_86":216,"_88":217,"_90":218,"_92":31},"tree",[171,176,177],"files",[171,172,173,174,175,176,177],"counts",{"_161":70,"_162":140,"_163":70,"_164":165,"_166":167},"contents",[134,135,136],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_50":154,"_38":155,"_36":156,"_139":-5,"_48":49,"_47":157,"_141":66,"_45":158,"_13":70,"_40":159,"_42":-5,"_30":31,"_145":-5,"_33":160},{"_50":147,"_38":148,"_36":149,"_139":-5,"_48":49,"_47":150,"_141":66,"_45":151,"_13":70,"_40":26,"_42":152,"_30":31,"_145":-5,"_33":153},{"_50":137,"_38":138,"_36":64,"_139":-5,"_48":49,"_47":140,"_141":66,"_45":142,"_13":70,"_40":143,"_42":144,"_30":31,"_145":-5,"_33":146},"25f03dd8-3f3d-11f1-85f1-42b51c65c3df","index.ts","parentId",1,"latest",["D",1776966728714],"http","import { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { getOAuthUserData, oauthMiddleware } from \"https://esm.town/v/std/oauth/middleware.ts\";\n\nconst app = new Hono();\n\n// API: get current user session info\napp.get(\"/api/me\", async (c) => {\n const session = await getOAuthUserData(c.req.raw);\n if (!session) return c.json({ loggedIn: false });\n return c.json({\n loggedIn: true,\n user: {\n username: session.user.username,\n profileImageUrl: session.user.links.profileImageUrl,\n tier: session.user.tier,\n },\n isOrgMember: session.isOrgMember ?? false,\n });\n});\n\n// Serve frontend\napp.get(\"/\", () => serveFile(\"/frontend/index.html\"));\napp.get(\"/frontend/*\", (c) => serveFile(c.req.path));\n\n// View source\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\napp.onError((err) => Promise.reject(err));\n\nexport default oauthMiddleware(app.fetch);\n","label",[138],"504cd5a0-3f3d-11f1-ab34-42b51c65c3df","README.md","504cd65e-3f3d-11f1-ab34-42b51c65c3df",7,["D",1776966799788],"# 🎉 Org Portal Demo\n\nA demo of **org-scoped content** on Val Town — like Google Docs sharing but for entire apps.\n\n## The Flow\n\n```mermaid\nflowchart TD\n A[Visit URL] --> B{Logged in?}\n B -->|No| C[🏠 Public landing page
with Login button]\n B -->|Yes| D{Org member?}\n D -->|No| E[🚪 'Request Access' page
like Google Docs]\n D -->|Yes| F[✅ Full app content
dashboards, tools, etc.]\n C --> G[OAuth login via Val Town]\n G --> D\n```\n\n## Three States\n\n1. **Not logged in** → Beautiful landing page explaining what this is, with a \"Log in with Val Town\" button\n2. **Logged in, NOT an org member** → Friendly \"request access\" screen (like clicking a Google Doc you don't have access to)\n3. **Logged in, IS an org member** → The actual app content\n\n## How It Works\n\n- Uses [`std/oauth`](https://www.val.town/x/std/oauth) for zero-config Val Town login\n- `session.isOrgMember` automatically checks if the user belongs to this val's org\n- No API keys, no database, no env vars needed (besides optional encryption key for perf)\n- Sessions stored in encrypted cookies — fully stateless\n\n## The Vision\n\nThis could be a new paradigm for Val Town org adoption:\n- **Internal tools** that only your team can access\n- **Shared dashboards** scoped to your org\n- **Request access flow** so outsiders can ask to join\n- **Shareable URLs** — send the link to anyone, they'll see the right thing\n",[148],"2621e93c-3f3d-11f1-85f1-42b51c65c3df","frontend","2621e9f0-3f3d-11f1-85f1-42b51c65c3df",2,["D",1776966729041],"directory",[155],"pulls","branches","forks","envVars",{"_168":140,"_170":70},"connections",{"_168":70,"_169":70},"count","unfilledCount","emptyCount",{"_50":154,"_38":155,"_36":156,"_139":-5,"_48":49,"_47":157,"_141":66,"_45":212,"_13":70,"_40":159,"_42":-5,"_30":31,"_145":-5,"_179":213,"_33":214},{"_50":207,"_38":206,"_36":202,"_139":156,"_48":49,"_47":208,"_141":66,"_45":209,"_13":70,"_40":159,"_42":-5,"_30":31,"_145":-5,"_179":210,"_33":211},{"_50":201,"_38":39,"_36":37,"_139":202,"_48":49,"_47":14,"_141":31,"_45":203,"_13":140,"_40":41,"_42":44,"_30":31,"_145":-5,"_179":204,"_33":205},{"_50":193,"_38":194,"_36":195,"_139":156,"_48":49,"_47":196,"_141":66,"_45":197,"_13":70,"_40":26,"_42":198,"_30":31,"_145":-5,"_179":199,"_33":200},{"_50":185,"_38":186,"_36":187,"_139":156,"_48":49,"_47":188,"_141":66,"_45":189,"_13":70,"_40":41,"_42":190,"_30":31,"_145":-5,"_179":191,"_33":192},{"_50":147,"_38":148,"_36":149,"_139":-5,"_48":49,"_47":150,"_141":66,"_45":182,"_13":70,"_40":26,"_42":152,"_30":31,"_145":-5,"_179":183,"_33":184},{"_50":137,"_38":138,"_36":64,"_139":-5,"_48":49,"_47":140,"_141":66,"_45":178,"_13":70,"_40":143,"_42":144,"_30":31,"_145":-5,"_179":180,"_33":181},["D",1776966728714],"children",[],[138],["D",1776966799788],[],[148],"2a052c30-3f3d-11f1-9abd-42b51c65c3df","index.tsx","2a052da2-3f3d-11f1-9abd-42b51c65c3df",4,["D",1776966735536],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = createRoot(document.getElementById(\"root\")!);\nroot.render();\n",[],[155,186],"28cc3dc2-3f3d-11f1-923e-42b51c65c3df","index.html","28cc3e76-3f3d-11f1-923e-42b51c65c3df",3,["D",1776966733511],"\n\n\n \n \n Party! – Org Portal\n \n \n\n\n

\n \n\n\n",[],[155,194],"1cad0668-3f4a-11f1-b279-42b51c65c3df","2ed16d32-3f3d-11f1-b249-42b51c65c3df",["D",1776972296618],[],[155,206,39],"components","2ed16c42-3f3d-11f1-b249-42b51c65c3df",5,["D",1776966743612],[173],[155,206],["D",1776966729041],[172,174,175],[155],["D",1776966714509],{"_104":103,"_111":-5},{"_104":103,"_105":106,"_107":-5,"_19":-5,"_108":109,"_110":31},{"_13":93,"_38":94,"_50":49,"_95":51,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":52,"_102":103},"ctx",{"_86":-5,"_131":252,"_253":254,"_255":256,"_257":31,"_258":31,"_259":31,"_260":66,"_261":-5,"_262":-7,"_263":-7,"_264":70,"_265":31,"_266":31,"_267":-5,"_268":31,"_269":31,"_270":31,"_271":-5},"ENV",{"_223":224,"_225":226,"_227":94,"_228":229,"_230":231,"_232":233,"_234":235,"_236":237,"_238":239,"_240":241,"_242":243,"_244":245,"_246":247,"_248":249,"_250":251},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","5015b8df46402d8bba4f485ecc37aec202b0e06b","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 · v8