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 handlePageChange(page - 1)}\n disabled={page <= 1}\n >\n Previous\n \n \n Page {page} of {totalPages}\n \n handlePageChange(page + 1)}\n disabled={page >= totalPages}\n >\n Next\n \n

\n )}\n

\n \n View Source\n \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 try {\n const { sqlite } = await import(\"https://esm.town/v/stevekrouse/sqlite\");\n const url = new URL(request.url);\n const params = Object.fromEntries(url.searchParams.entries());\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(\"/tableData/\")) {\n const tableName = decodeURIComponent(url.pathname.split(\"/\").pop());\n const page = parseInt(params.page) || 1;\n const pageSize = parseInt(params.pageSize) || 10;\n const offset = (page - 1) * pageSize;\n\n // Get total row count\n const countResult = await sqlite.execute(`SELECT COUNT(*) as count FROM \"${tableName}\"`);\n const totalRows = countResult.rows[0].count;\n\n // Get table data with pagination\n const dataResult = await sqlite.execute(\n `SELECT rowid, * FROM \"${tableName}\" LIMIT ? OFFSET ?`,\n [pageSize, offset],\n );\n\n // Get table schema\n const schemaResult = await sqlite.execute(`PRAGMA table_info(\"${tableName}\")`);\n const schema = schemaResult.rows.map((row) => ({\n name: row.name,\n type: row.type,\n }));\n\n return new Response(\n JSON.stringify({\n data: dataResult.rows,\n schema,\n totalRows,\n }),\n {\n headers: { \"Content-Type\": \"application/json\" },\n },\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 = decodeURIComponent(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 if (\"rowid\" in data) {\n const query = `UPDATE \"${tableName}\" SET ${setClause} WHERE rowid = ?`;\n const queryParams = [...values, data.rowid];\n await sqlite.execute(query, queryParams);\n return new Response(\"Updated successfully\", { status: 200 });\n } else {\n return new Response(\"rowid is required to update a row\", { status: 400 });\n }\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 = decodeURIComponent(url.pathname.split(\"/\").pop());\n const data = await request.json();\n const columns = Object.keys(data);\n const values = columns.map((col) => data[col]);\n const placeholders = columns.map(() => \"?\").join(\", \");\n\n const query = `INSERT INTO \"${tableName}\" (${\n columns.map((col) => `\"${col}\"`).join(\", \")\n }) VALUES (${placeholders})`;\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 } catch (error) {\n return new Response(`Server error: ${error.message}`, { status: 500 });\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.pagination {\n margin-top: 10px;\n display: flex;\n align-items: center;\n}\n.pagination button {\n margin-right: 10px;\n}\n.pagination span {\n margin-right: 10px;\n}\n`;\n\nexport default vtTokenSessionAuth(server);",[],[174],"files",[153,172],"counts",{"_184":32,"_185":160,"_186":32,"_187":32},"pulls","branches","forks","envVars","contents",[],{"_103":154,"_95":99,"_155":156,"_157":-5,"_158":139,"_159":160,"_161":109,"_105":191,"_100":32,"_163":164,"_165":166,"_167":22,"_168":-5,"_98":192},["D",1726181144449],[99],"upstreamProject",{"_103":146,"_95":195,"_112":-5,"_113":-5,"_110":111,"_23":196},"sqliteAdminDashboard",{"_93":94,"_131":132},"upstreamBranch",{"_103":142,"_105":199,"_200":201,"_95":43,"_140":146,"_100":202,"_141":-5,"_143":-5,"_203":204,"_107":-5,"_150":22,"_110":111,"_149":94,"_16":120,"_148":195},["D",1746037624292],"updatedAt",["D",1726064507582],11,"lockfileKey","1755652413709-esm.town_v_stevekrouse_sqliteAdminDashboard@11-main","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.code.$",{"_93":94,"_95":96,"_97":43,"_100":-7,"_98":99,"_101":211,"_151":216,"_180":223,"_164":224,"_188":226,"_227":228,"_231":109,"_232":-5,"_233":138,"_234":202,"_235":236},{"_103":104,"_95":96,"_105":212,"_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":213,"_133":214,"_136":215,"_150":22},["D",1746037625230],{"_93":94,"_131":132},{"_93":94,"_135":132},{"_100":138,"_95":43,"_103":139,"_140":104,"_141":142,"_143":32,"_144":111,"_145":146,"_147":120,"_148":96,"_149":94},[217,220],{"_103":154,"_95":99,"_155":156,"_157":-5,"_158":139,"_159":160,"_161":109,"_105":162,"_100":32,"_163":164,"_165":166,"_167":22,"_168":-5,"_169":218,"_98":219},[],[99],{"_103":173,"_95":174,"_155":116,"_157":-5,"_158":139,"_159":138,"_161":109,"_105":175,"_100":160,"_163":176,"_165":177,"_167":22,"_168":-5,"_169":221,"_98":222},[],[174],[217,220],{"_103":154,"_95":99,"_155":156,"_157":-5,"_158":139,"_159":160,"_161":109,"_105":191,"_100":32,"_163":164,"_165":166,"_167":22,"_168":-5,"_98":225},[99],[],"upstream",{"_103":142,"_105":229,"_200":230,"_95":43,"_140":146,"_100":202,"_141":-5,"_143":-5,"_203":204,"_107":-5,"_150":22,"_110":111,"_149":94,"_16":120,"_148":195},["D",1746037624292],["D",1726064507582],"showCompareCallout","pull","ahead","behind","templates",[],"actionData","errors"]

stevekrouse

scientificCyanHarrier