Tables

fetchTableData(table)}\n className={selectedTable === table ? \"active\" : \"\"}\n >\n {table}\n \n ))}\n

SQLite Dashboard

\n {error &&

{error}

}\n {selectedTable && (\n

{selectedTable}

\n \n \n \n {tableSchema.map(col => (\n \n ))}\n \n \n \n \n {tableData.map((row, index) => (\n \n {tableSchema.map(col => (\n \n ))}\n \n \n ))}\n \n {tableSchema.map(col => (\n \n ))}\n \n \n \n

\n {col.name} ({col.type})\n	Actions
\n {editingRow === index\n ? (\n handleInputChange(index, col.name, e.target.value)}\n />\n )\n : (\n row[col.name]\n )}\n	\n {editingRow === index\n ? \n : }\n
\n handleNewRowInputChange(col.name, e.target.value)}\n placeholder={`New ${col.name}`}\n />\n	\n \n

\n )}\n

\n View Source\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nasync function server(request: Request): Promise {\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const url = new URL(request.url);\n\n if (url.pathname === \"/tables\") {\n const result = await sqlite.execute(\"SELECT name FROM sqlite_master WHERE type='table'\");\n return new Response(JSON.stringify(result.rows.map(row => row.name)), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n if (url.pathname.startsWith(\"/table/\")) {\n const tableName = url.pathname.split(\"/\").pop();\n const result = await sqlite.execute(`SELECT rowid, * FROM ${tableName}`);\n return new Response(JSON.stringify(result.rows), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n if (url.pathname.startsWith(\"/schema/\")) {\n const tableName = url.pathname.split(\"/\").pop();\n const result = await sqlite.execute(`PRAGMA table_info(${tableName})`);\n return new Response(JSON.stringify(result.rows.map(row => ({ name: row.name, type: row.type }))), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n\n if (url.pathname.startsWith(\"/update/\")) {\n if (request.method !== \"POST\") {\n return new Response(\"Method Not Allowed\", { status: 405 });\n }\n const tableName = url.pathname.split(\"/\").pop();\n const data = await request.json();\n const columns = Object.keys(data).filter(col => col !== \"rowid\");\n const values = columns.map(col => data[col]);\n const setClause = columns.map(col => `${col} = ?`).join(\", \");\n\n let query;\n let queryParams;\n\n if (\"rowid\" in data) {\n query = `UPDATE ${tableName} SET ${setClause} WHERE rowid = ?`;\n queryParams = [...values, data.rowid];\n } else {\n const whereClause = columns.map(col => `${col} = ?`).join(\" AND \");\n query = `UPDATE ${tableName} SET ${setClause} WHERE ${whereClause}`;\n queryParams = [...values, ...values];\n }\n\n await sqlite.execute(query, queryParams);\n return new Response(\"Updated successfully\", { status: 200 });\n }\n\n if (url.pathname.startsWith(\"/insert/\")) {\n if (request.method !== \"POST\") {\n return new Response(\"Method Not Allowed\", { status: 405 });\n }\n const tableName = url.pathname.split(\"/\").pop();\n const data = await request.json();\n const columns = Object.keys(data).filter(col => col !== \"rowid\");\n const values = columns.map(col => data[col]);\n const placeholders = columns.map(() => \"?\").join(\", \");\n\n const query = `INSERT INTO ${tableName} (${columns.join(\", \")}) VALUES (${placeholders})`;\n\n await sqlite.execute(query, values);\n return new Response(\"Inserted successfully\", { status: 200 });\n }\n\n return new Response(\n `\n \n \n SQLite Dashboard\n \n \n \n

\n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}\n\nconst css = `\nbody {\n font-family: Arial, sans-serif;\n margin: 0;\n padding: 0;\n background-color: #f0f0f0;\n}\n.container {\n display: flex;\n height: 100vh;\n}\n.sidebar {\n width: 200px;\n background-color: #333;\n color: white;\n padding: 20px;\n overflow-y: auto;\n}\n.sidebar h2 {\n margin-top: 0;\n}\n.sidebar ul {\n list-style-type: none;\n padding: 0;\n}\n.sidebar li {\n cursor: pointer;\n padding: 10px;\n margin-bottom: 5px;\n border-radius: 3px;\n}\n.sidebar li:hover {\n background-color: #444;\n}\n.sidebar li.active {\n background-color: #555;\n}\n.main-content {\n flex-grow: 1;\n padding: 20px;\n overflow-y: auto;\n}\nh1, h2 {\n color: #333;\n}\ntable {\n width: 100%;\n border-collapse: collapse;\n margin-top: 20px;\n}\nth, td {\n border: 1px solid #ddd;\n padding: 8px;\n text-align: left;\n}\nth {\n background-color: #f2f2f2;\n}\n.column-type {\n font-size: 0.8em;\n color: #666;\n}\n.error {\n color: red;\n margin-bottom: 10px;\n}\n.source-link {\n margin-top: 20px;\n text-align: right;\n}\n.source-link a {\n color: #666;\n text-decoration: none;\n}\n.source-link a:hover {\n text-decoration: underline;\n}\nbutton {\n background-color: #4CAF50;\n border: none;\n color: white;\n padding: 5px 10px;\n text-align: center;\n text-decoration: none;\n display: inline-block;\n font-size: 12px;\n margin: 2px 2px;\n cursor: pointer;\n}\ninput {\n width: 100%;\n padding: 5px;\n box-sizing: border-box;\n}\n`;\n\nexport default vtTokenSessionAuth(server);",[],[172],"files",[151,170],"counts",{"_183":32,"_184":158,"_185":186,"_187":32},"pulls","branches","forks",3,"envVars","contents",[],{"_103":152,"_95":99,"_153":154,"_155":-5,"_156":139,"_157":158,"_159":109,"_105":191,"_100":32,"_161":162,"_163":164,"_165":22,"_166":-5,"_98":192},["D",1725986362342],[99],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.code.$",{"_93":94,"_95":96,"_97":43,"_100":-7,"_98":99,"_101":201,"_149":206,"_179":213,"_162":214,"_188":216,"_217":-5,"_218":22,"_219":-5,"_220":-5,"_221":-5,"_222":223},{"_103":104,"_95":96,"_105":202,"_107":-5,"_108":109,"_110":111,"_112":-5,"_113":-5,"_14":114,"_115":116,"_117":109,"_118":-5,"_119":32,"_16":120,"_121":122,"_123":122,"_124":125,"_126":125,"_127":125,"_128":122,"_129":122,"_23":203,"_133":204,"_136":205,"_148":22},["D",1746037624292],{"_93":94,"_131":132},{"_93":94,"_135":132},{"_100":138,"_95":43,"_103":139,"_140":104,"_141":-5,"_142":-5,"_143":-5,"_144":-5,"_145":-5,"_146":96,"_147":94},[207,210],{"_103":152,"_95":99,"_153":154,"_155":-5,"_156":139,"_157":158,"_159":109,"_105":160,"_100":32,"_161":162,"_163":164,"_165":22,"_166":-5,"_167":208,"_98":209},[],[99],{"_103":171,"_95":172,"_153":116,"_155":-5,"_156":139,"_157":138,"_159":109,"_105":173,"_100":174,"_161":175,"_163":176,"_165":22,"_166":-5,"_167":211,"_98":212},[],[172],[207,210],{"_103":152,"_95":99,"_153":154,"_155":-5,"_156":139,"_157":158,"_159":109,"_105":191,"_100":32,"_161":162,"_163":164,"_165":22,"_166":-5,"_98":215},[99],[],"upstream","showCompareCallout","pull","ahead","behind","templates",[],"actionData","errors"]

stevekrouse

sqliteAdminDashboard