🔍 Val Town SQLite Explorer

\n \n setQuery(e.target.value)}\n placeholder={`SQL query for ${table} (e.g., SELECT * FROM ${table} LIMIT 10)`}\n style={{ width: '100%', padding: '10px', marginBottom: '10px' }}\n />\n \n \n {error && (\n

\n Error: {error}\n

\n )}\n {results && (\n

Query Results

\n \n \n \n {results.columns.map((col, idx) => (\n \n ))}\n \n \n \n {results.rows.map((row, rowIdx) => (\n \n {Object.values(row).map((cell, cellIdx) => (\n \n ))}\n \n ))}\n \n

\n {col}\n
\n {typeof cell === 'object' \n ? JSON.stringify(cell) \n : String(cell)}\n

\n )}\n

\n );\n}\n\nwindow.initClient = function() {\n const rootElement = document.getElementById(\"root\");\n if (rootElement) {\n const root = createRoot(rootElement);\n root.render();\n }\n};\n\nif (typeof document !== \"undefined\") {\n window.initClient();\n}\n\nexport default async function server(request: Request): Promise {\n // Handle GET requests by serving the HTML\n if (request.method === 'GET') {\n return new Response(`\n \n \n \n \n \n Val Town SQLite Explorer\n \n \n \n

\n \n \n \n \n \n `, {\n headers: {\n 'Content-Type': 'text/html',\n 'Access-Control-Allow-Origin': '*'\n }\n });\n }\n\n // CORS handling\n if (request.method === 'OPTIONS') {\n return new Response(null, {\n headers: {\n 'Access-Control-Allow-Origin': '*',\n 'Access-Control-Allow-Methods': 'POST, GET, OPTIONS',\n 'Access-Control-Allow-Headers': 'Content-Type, Accept',\n 'Access-Control-Max-Age': '86400'\n }\n });\n }\n\n // Ensure POST request\n if (request.method !== 'POST') {\n return new Response('Method Not Allowed', { \n status: 405,\n headers: {\n 'Access-Control-Allow-Origin': '*',\n 'Content-Type': 'text/plain'\n }\n });\n }\n\n try {\n // Dynamic import for SQLite\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n\n // Parse request body\n const { query, table } = await request.json();\n\n if (!query || !table) {\n throw new Error('Query and table are required');\n }\n\n // Validate table name to prevent SQL injection\n const allowedTables = [\n 'val_town_agent_specifications', \n 'val_town_agent_tasks'\n ];\n\n if (!allowedTables.includes(table)) {\n throw new Error('Invalid table name');\n }\n\n // Execute the query\n const result = await sqlite.execute(query);\n\n return new Response(JSON.stringify(result), {\n headers: {\n 'Content-Type': 'application/json',\n 'Access-Control-Allow-Origin': '*'\n }\n });\n } catch (error) {\n console.error(\"SQLite Query Error:\", error);\n\n return new Response(\n JSON.stringify({\n error: \"SQLite Query Failed\",\n details: error.toString(),\n stack: error.stack\n }),\n {\n status: 500,\n headers: {\n 'Content-Type': 'application/json',\n 'Access-Control-Allow-Origin': '*'\n }\n }\n );\n }\n}\n\nconst css = `\nbody {\n font-family: system-ui, sans-serif;\n line-height: 1.6;\n background-color: #f4f4f4;\n margin: 0;\n padding: 0;\n}\n#root {\n max-width: 800px;\n margin: 0 auto;\n padding: 20px;\n}\ninput, select {\n width: 100%;\n padding: 10px;\n margin-bottom: 10px;\n border: 1px solid #ddd;\n border-radius: 4px;\n}\nbutton {\n background-color: #4CAF50;\n color: white;\n padding: 10px 15px;\n border: none;\n border-radius: 4px;\n cursor: pointer;\n transition: background-color 0.3s;\n}\nbutton:hover {\n background-color: #45a049;\n}\nbutton:disabled {\n background-color: #cccccc;\n cursor: not-allowed;\n}\ntable {\n width: 100%;\n border-collapse: collapse;\n}\nth, td {\n border: 1px solid #ddd;\n padding: 8px;\n text-align: left;\n}\nth {\n background-color: #f2f2f2;\n}\n`;","deleted","label",[124],"3f8ab998-2798-11f0-9d52-569c3dd06744","README.md","3f8aba1a-2798-11f0-9d52-569c3dd06744",1,["D",1731971386107],"# SQLite Explorer\n\nView and interact with your Val Town SQLite data. It's based off Steve's excellent [SQLite Admin](https://www.val.town/v/stevekrouse/sqlite_admin?v=46) val, adding the ability to run SQLite queries directly in the interface. This new version has a revised UI and that's heavily inspired by [LibSQL Studio](https://github.com/invisal/libsql-studio) by [invisal](https://github.com/invisal). This is now more an SPA, with tables, queries and results showing up on the same page. \n\n![image.webp](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/c8e102fd-39ca-4bfb-372a-8d36daf43900/public)\n\n## Install \n\nInstall the latest stable version (v86) by forking this val:\n\n[![Install Stable Release (v86)](https://stevekrouse-button.web.val.run/Install%20Stable%20Release%20(v81))](https://www.val.town/v/nbbaier/sqlite_explorer/fork)\n\n## Authentication\n\nLogin to your SQLite Explorer with [password authentication](https://www.val.town/v/pomdtr/password_auth) with your [Val Town API Token](https://www.val.town/settings/api) as the password.\n\n## Todos / Plans\n- [ ] improve error handling \n- [ ] improve table formatting\n- [ ] sticky table headers\n- [x] add codemirror \n- [ ] add loading indication to the run button (initial version shipped)\n- [ ] add ability to favorite queries \n- [ ] add saving of last query run for a table (started)\n- [ ] add visible output for non-query statements\n- [ ] add schema viewing \n- [ ] add refresh to table list sidebar after `CREATE/DROP/ALTER` statements\n- [ ] add automatic execution of initial select query on double click \n- [x] add views to the sidebar \n- [ ] add triggers to sidebar\n- [ ] add upload from SQL, CSV and JSON\n- [ ] add ability to connect to a non-val town Turso database \n- [x] fix wonky sidebar separator height problem (thanks to @stevekrouse)\n- [x] make result tables scrollable\n- [x] add export to CSV, and JSON (CSV and JSON helper functions written in [this val](https://www.val.town/v/nbbaier/sqliteExportHelpers). Thanks to @pomdtr for merging the initial version!)\n- [x] add listener for cmd+enter to submit query",[140],"pulls","branches","forks","envVars",{"_153":41,"_155":41},"connections",{"_153":41,"_154":41},"count","unfilledCount","emptyCount",{"_18":139,"_20":140,"_125":141,"_126":-5,"_127":67,"_128":142,"_129":37,"_22":162,"_64":41,"_132":98,"_134":144,"_136":26,"_137":-5,"_159":163,"_87":164},{"_18":123,"_20":124,"_125":35,"_126":-5,"_127":67,"_128":65,"_129":37,"_22":158,"_64":131,"_132":133,"_134":135,"_136":26,"_137":-5,"_159":160,"_87":161},["D",1731973210852],"children",[],[124],["D",1731971386107],[],[140],["D",1746219530286],{"_16":17,"_85":81},{"_16":17,"_79":-5,"_80":81,"_32":33,"_82":83,"_84":26},{"_64":65,"_20":66,"_18":67,"_68":19,"_69":70,"_71":41,"_72":28,"_73":74,"_75":76,"_77":21,"_78":17},"ctx",{"_57":-5,"_108":202,"_203":204,"_205":206,"_207":26,"_208":26,"_209":26,"_210":37,"_211":-5,"_212":-7,"_213":-7,"_214":41,"_215":26,"_216":26,"_217":-5,"_218":26,"_219":26,"_220":26,"_221":-5},"ENV",{"_173":174,"_175":176,"_177":66,"_178":179,"_180":181,"_182":183,"_184":185,"_186":187,"_188":189,"_190":191,"_192":193,"_194":195,"_196":197,"_198":199,"_200":201},"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"]

Search