diff --git a/api/src/drivers/postgres.ts b/api/src/drivers/postgres.ts index 37cead4..acabf97 100644 --- a/api/src/drivers/postgres.ts +++ b/api/src/drivers/postgres.ts @@ -348,13 +348,18 @@ export class PostgresDriver implements Driver { const sql = await this.queryRunner(credentials); const result = await sql.unsafe(query); - - void sql.end(); - - return { - count: result.length, - data: result, - }; + if ("count" in result && result.count !== undefined) { + return [ + { + count: result.count, + data: result, + }, + ]; + } + return result.map((row) => ({ + count: row.count, + data: row, + })); } } diff --git a/frontend/src/routes/raw/index.tsx b/frontend/src/routes/raw/index.tsx index 2aad6d0..44f8fbb 100644 --- a/frontend/src/routes/raw/index.tsx +++ b/frontend/src/routes/raw/index.tsx @@ -1,15 +1,18 @@ -import { Button, SqlDataTable, SqlDataTableCell } from "@/components/ui"; +import { + Button, + Table, + TableBody, + TableCell, + TableHead, + TableHeader, + TableRow, +} from "@/components/ui"; import { useQueryRawSqlMutation } from "@/services/db"; import { useUiStore } from "@/state"; import Editor from "@monaco-editor/react"; import { createFileRoute } from "@tanstack/react-router"; -import { - type ColumnDef, - getCoreRowModel, - useReactTable, -} from "@tanstack/react-table"; import { ArrowRight } from "lucide-react"; -import { useMemo, useState } from "react"; +import { useState } from "react"; export const Route = createFileRoute("/raw/")({ component: Component, @@ -26,21 +29,6 @@ function Component() { mutate({ query }); }; - const columns = useMemo[]>(() => { - if (!data) return [] as ColumnDef[]; - - return Object.keys(data[0]).map((key) => ({ - header: key, - accessorKey: key, - cell: ({ row }) => , - })) as ColumnDef[]; - }, [data]); - - const table = useReactTable({ - data: data ?? [], - columns, - getCoreRowModel: getCoreRowModel(), - }); return (
@@ -61,17 +49,46 @@ function Component() { }} />
- {data &&

Result: {data.length} rows

}
- {data && ( -
- -
- )} + {data?.map((row, i) => { + return ( + // biome-ignore lint/suspicious/noArrayIndexKey: +
+
count: {row.count}
+ {row.data.length > 0 && } +
+ ); + })}
); } + +const RenderTable = ({ data }: { data: Array> }) => { + const columns = Object.keys(data[0]); + + return ( + + + + {columns.map((column) => ( + {column} + ))} + + + + {data.map((row, i) => ( + // biome-ignore lint/suspicious/noArrayIndexKey: + + {columns.map((column) => ( + {row[column]} + ))} + + ))} + +
+ ); +}; diff --git a/frontend/src/services/db/db.types.ts b/frontend/src/services/db/db.types.ts index c14e3fc..e4b1398 100644 --- a/frontend/src/services/db/db.types.ts +++ b/frontend/src/services/db/db.types.ts @@ -94,7 +94,10 @@ export type QueryRawSqlArgs = { query: string; }; -export type QueryRawSqlResponse = Array>; +export type QueryRawSqlResponse = { + count: number; + data: Array>; +}[]; export type TableForeignKey = { conname: string;