Compare commits
2
Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 adrianbonpin
|
cd6cc7fde2 | ||
|
adrianbonpin
|
7cde902978 |
@@ -298,13 +298,13 @@ Planned work is prioritized in the [Project Roadmap](./ROADMAP.md) (source of tr
|
||||
| Export toolbar (JSON, CSV, SQL, Markdown, Excel (.xlsx)) | ✅ | Client-side Blob download of visible rows; Excel (.xlsx) via client-side workbook generation (v0.7.8) |
|
||||
| Excel (.xlsx) export | ✅ | Client-side .xlsx export of visible rows alongside JSON/CSV/SQL/Markdown (v0.7.8) |
|
||||
| Auto-refresh timer | ✅ | Configurable interval in settings |
|
||||
| Changes queue (INSERT, UPDATE, DELETE, bulk_insert, empty_table, drop_table) | ✅ | Stage → **Commit All**. Tab bar **Changes** button (amber border + count badge when pending) toggles a **popover** anchored to it: header with **Visual/SQL** toggle (cards showing op badge + table + description + per-change **Revert**, or a generated-SQL preview via `buildChangeSql`), footer **Clear All** + **Commit All (N)** with **⌘S/Ctrl+S** shortcut. Committed cards show a green ✓ (failed ✗); committing `drop_table` auto-closes open tabs of that table. **Insert Row** adds an editable pending row at the top of the grid (accent outline); committing inserts only the filled columns so serial/identity/generated defaults apply |
|
||||
| Changes queue (INSERT, UPDATE, DELETE, bulk_insert, empty_table, drop_table) | ✅ | Stage → **Commit All**. Tab bar **Changes** button (amber border + count badge when pending) toggles a **popover** anchored to it: header with **Visual/SQL** toggle (cards showing op badge + table + description + per-change **Revert**, or a generated-SQL preview via `buildChangeSql`), footer **Clear All** + **Commit All (N)** with **⌘S/Ctrl+S** shortcut. Committed cards show a green ✓ (failed ✗); committing `drop_table` auto-closes open tabs of that table |
|
||||
| Auto schema-tree refresh | ✅ | Tree auto-refreshes after a successful schema-modifying query run (`CREATE`/`DROP`/`ALTER`/`TRUNCATE` via `isSchemaModifyingQuery`) and after committing schema-modifying queue changes — `drop_table`, schema-modifying `ddl` (e.g. `CREATE TABLE`), and `rebuild_table` — no manual refresh needed |
|
||||
| Data import (CSV/JSON) | ✅ | Table overflow menu → ImportDialog: file pick, parse, preview (first 100 rows), header→column mapping, caps 100k rows / 100 MB; stages a bulk_insert change through the queue → Commit All |
|
||||
| Table menu actions | ✅ | Copy table schema (DDL via pg_dump / sqlite_master), Empty Table (DELETE) / Delete Table (DROP) through the queue with confirm, export stubs wired (JSON/CSV/SQL/Markdown) |
|
||||
| Edit connection modal (from DB viewer) | ✅ | AnimatedModal with keychain password fetch on test |
|
||||
| Connection drop banner | ✅ | Auto-detects broken connections with reconnect prompt |
|
||||
| Inline cell editing | ✅ | Double-click/Enter edits a cell; commit stages an `update` change in the queue → Commit All. No-PK tables use ctid/rowid locator; PK/generated/identity columns and views/matviews are read-only. Stale-write protection via affected-row-count check. **Optimistic UI**: the changes queue is the single source of truth — `deriveStagedValues` feeds staged values + a pending amber dot back into the grid (dot clears on commit, values survive until refetch); re-editing the same cell replaces the queue entry (original `oldData` kept); Clear All removes dots instantly; queue cards show an old → new value diff. **Smart editors**: PG enum columns render a `<select>` of enum labels; FK columns render a searchable dropdown of referenced rows (one row per option showing the first 4 referenced columns, FK-popover styling, 360px fixed, portal to body); `date`/`time`/`timestamp` columns use native date/time/datetime pickers, `boolean` a true/false select, and numeric types a number input; `text`/`json`/`jsonb` use a single-line scrolling textarea. |
|
||||
| Inline cell editing | ✅ | Double-click/Enter edits a cell; commit stages an `update` change in the queue → Commit All. No-PK tables use ctid/rowid locator; PK/generated/identity columns and views/matviews are read-only. Stale-write protection via affected-row-count check. **Optimistic UI**: the changes queue is the single source of truth — `deriveStagedValues` feeds staged values + a pending amber dot back into the grid (dot clears on commit, values survive until refetch); re-editing the same cell replaces the queue entry (original `oldData` kept); Clear All removes dots instantly; queue cards show an old → new value diff. **Smart editors**: PG enum columns render a `<select>` of enum labels; FK columns render a searchable dropdown of referenced rows (one row per option showing the first 4 referenced columns, FK-popover styling, 360px fixed, portal to body); `text`/`json`/`jsonb` use a single-line scrolling textarea. |
|
||||
| Virtualized data grid | ✅ | Row-level virtualization via @tanstack/react-virtual `useVirtualizer`; handles 100k+ rows |
|
||||
| Row detail / expandable row view | ✅ | RowDetailDrawer: right-drawer per row, opened via the cell context menu **View Row** |
|
||||
| Keyboard cell navigation (arrow keys, Tab) | ✅ | Arrow keys + Tab/Shift+Tab wrap (`keyboardNav`); Enter opens the editor; **Esc cancels editing even after the editor lost focus** (document-level listener) and closes the context menu |
|
||||
|
||||
@@ -30,16 +30,16 @@
|
||||
|
||||
## Download
|
||||
|
||||
Grab the installer for your OS from the [latest release](https://git.ranio.xyz/adrianbonpin/gridline/releases/latest) — the links below point at the current release (**v0.7.15**):
|
||||
Grab the installer for your OS from the [latest release](https://git.ranio.xyz/adrianbonpin/gridline/releases/latest) — the links below point at the current release (**v0.7.14**):
|
||||
|
||||
| OS | Architecture | Download |
|
||||
| :--------------------------- | :--------------------------- | :----------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| **macOS** | Apple Silicon (M1/M2/M3/M4…) | [Gridline_0.7.15_aarch64.dmg](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_aarch64.dmg) |
|
||||
| **macOS** | Intel | [Gridline_0.7.15_x64.dmg](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_x64.dmg) |
|
||||
| **Windows** | x64 | [Gridline_0.7.15_x64-setup.exe](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_x64-setup.exe) |
|
||||
| **Debian / Ubuntu** | amd64 | [Gridline_0.7.15_amd64.deb](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_amd64.deb) |
|
||||
| **Fedora / RHEL / openSUSE** | x86_64 | [Gridline-0.7.15-1.x86_64.rpm](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline-0.7.15-1.x86_64.rpm) |
|
||||
| **Other Linux** | amd64 | [Gridline_0.7.15_amd64.AppImage](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_amd64.AppImage) |
|
||||
| **macOS** | Apple Silicon (M1/M2/M3/M4…) | [Gridline_0.7.14_aarch64.dmg](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_aarch64.dmg) |
|
||||
| **macOS** | Intel | [Gridline_0.7.14_x64.dmg](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_x64.dmg) |
|
||||
| **Windows** | x64 | [Gridline_0.7.14_x64-setup.exe](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_x64-setup.exe) |
|
||||
| **Debian / Ubuntu** | amd64 | [Gridline_0.7.14_amd64.deb](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_amd64.deb) |
|
||||
| **Fedora / RHEL / openSUSE** | x86_64 | [Gridline-0.7.14-1.x86_64.rpm](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline-0.7.14-1.x86_64.rpm) |
|
||||
| **Other Linux** | amd64 | [Gridline_0.7.14_amd64.AppImage](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_amd64.AppImage) |
|
||||
|
||||
**macOS via Homebrew** (recommended for Mac users):
|
||||
|
||||
@@ -57,7 +57,7 @@ The cask installs the app directly. The DMGs are Developer-ID signed and notariz
|
||||
> **macOS first launch:** Gridline is Developer-ID signed and notarized, so macOS opens it without a Gatekeeper prompt. Not sure if your Mac is Intel or Apple Silicon? See [Which file should I download?](#which-file-should-i-download) below.
|
||||
|
||||
<!--
|
||||
MAINTENANCE: These links are STATIC (versioned) — they point at the v0.7.15
|
||||
MAINTENANCE: These links are STATIC (versioned) — they point at the v0.7.14
|
||||
release assets, not at a moving "latest" target. On every new release,
|
||||
update BOTH tables here (Download + Which file should I download?) to the
|
||||
new version's asset names, which are tauri-action's default naming:
|
||||
@@ -102,8 +102,6 @@ Gridline is built for developers and small teams who manage multiple database en
|
||||
<details>
|
||||
<summary>View the full changelog</summary>
|
||||
|
||||
- **v0.7.15** — **Support channel on the landing page**: optional coffee via [Ko-fi](https://ko-fi.com/adrianbonpin), never gates a feature. Landing copy refreshed (em dashes dropped, OSS section simplified, funding FAQ); version bump.
|
||||
|
||||
- **v0.7.14** — **No more repeated macOS keychain prompts**: saved connection passwords and SSH secrets are now ACL-pinned to the app's code signature on every save (`keychain_acl`), so app upgrades never re-trigger the macOS keychain access dialog (users upgrading from pre-signing builds see one final prompt — choose **Always Allow**). **Install via Homebrew**: `brew tap AdrianBonpin/gridline https://git.ranio.xyz/adrianbonpin/homebrew-gridline.git` then `brew install --cask gridline`; version bump.
|
||||
|
||||
- **v0.7.13** — **macOS is now Developer-ID signed and notarized**: the app is properly code-signed with a Developer ID Application certificate and notarized by Apple, so macOS opens it without the Gatekeeper "Open Anyway" prompt or the `xattr` quarantine workaround. The release script (`scripts/release-mac.sh`) auto-detects the signing identity from the keychain, notarizes + staples both architectures, and verifies the result before uploading; version bump.
|
||||
@@ -340,16 +338,16 @@ Gridline's macOS builds are **Developer-ID signed and notarized**, so macOS open
|
||||
|
||||
#### Which file should I download?
|
||||
|
||||
Each release contains **one file per platform** — you only need the one that matches your computer. The links below point at the current release (**v0.7.15**):
|
||||
Each release contains **one file per platform** — you only need the one that matches your computer. The links below point at the current release (**v0.7.14**):
|
||||
|
||||
| Your system | Download this | Notes |
|
||||
| :------------------------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------- | :--------------------------------------------------------------- |
|
||||
| macOS **Apple Silicon** (M1/M2/M3/M4…) | [Gridline_0.7.15_aarch64.dmg](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_aarch64.dmg) | `aarch64` = Apple's own chip |
|
||||
| macOS **Intel** | [Gridline_0.7.15_x64.dmg](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_x64.dmg) | `x64` = Intel/AMD |
|
||||
| **Windows** (most PCs) | [Gridline_0.7.15_x64-setup.exe](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_x64-setup.exe) | The `.msi` is an alternate installer (for enterprises/IT admins) |
|
||||
| **Debian / Ubuntu** | [Gridline_0.7.15_amd64.deb](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_amd64.deb) | Install: `sudo apt install ./Gridline_0.7.15_amd64.deb` |
|
||||
| **Fedora / RHEL / openSUSE** | [Gridline-0.7.15-1.x86_64.rpm](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline-0.7.15-1.x86_64.rpm) | Install: `sudo dnf install Gridline-0.7.15-1.x86_64.rpm` |
|
||||
| **Any other Linux** | [Gridline_0.7.15_amd64.AppImage](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.15/Gridline_0.7.15_amd64.AppImage) | Works on every distro: `chmod +x` the file, then double-click it |
|
||||
| macOS **Apple Silicon** (M1/M2/M3/M4…) | [Gridline_0.7.14_aarch64.dmg](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_aarch64.dmg) | `aarch64` = Apple's own chip |
|
||||
| macOS **Intel** | [Gridline_0.7.14_x64.dmg](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_x64.dmg) | `x64` = Intel/AMD |
|
||||
| **Windows** (most PCs) | [Gridline_0.7.14_x64-setup.exe](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_x64-setup.exe) | The `.msi` is an alternate installer (for enterprises/IT admins) |
|
||||
| **Debian / Ubuntu** | [Gridline_0.7.14_amd64.deb](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_amd64.deb) | Install: `sudo apt install ./Gridline_0.7.14_amd64.deb` |
|
||||
| **Fedora / RHEL / openSUSE** | [Gridline-0.7.14-1.x86_64.rpm](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline-0.7.14-1.x86_64.rpm) | Install: `sudo dnf install Gridline-0.7.14-1.x86_64.rpm` |
|
||||
| **Any other Linux** | [Gridline_0.7.14_amd64.AppImage](https://git.ranio.xyz/adrianbonpin/gridline/releases/download/v0.7.14/Gridline_0.7.14_amd64.AppImage) | Works on every distro: `chmod +x` the file, then double-click it |
|
||||
|
||||
**Not sure if your Mac is Intel or Apple Silicon?** Click the **Apple menu** → **About This Mac**. If it shows "Apple M1/M2/M3/M4…" download the `aarch64` file; if it shows an Intel chip, download `x64`. Downloading the wrong one won't run.
|
||||
|
||||
@@ -359,8 +357,8 @@ Cutting a release is one command — CI builds everything. **Releases are cut fr
|
||||
|
||||
```bash
|
||||
git checkout prod && git pull
|
||||
git tag v0.7.15
|
||||
git push origin v0.7.15
|
||||
git tag v0.7.14
|
||||
git push origin v0.7.14
|
||||
```
|
||||
|
||||
Gitea Actions (`.gitea/workflows/release.yml`) builds the **Linux and Windows** installers on the self-hosted runners, then opens a **draft release** on the [Releases](https://git.ranio.xyz/adrianbonpin/gridline/releases) page. **macOS is built manually** on the dev Mac and its DMGs uploaded to the same release via `scripts/release-mac.sh`. Review the draft and hit **Publish release**.
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "gridline-desktop",
|
||||
"private": true,
|
||||
"version": "0.7.15",
|
||||
"version": "0.7.14",
|
||||
"description": "An open-source, high-performance database GUI client for PostgreSQL and beyond",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
|
||||
Generated
+1
-1
@@ -1783,7 +1783,7 @@ dependencies = [
|
||||
|
||||
[[package]]
|
||||
name = "gridline"
|
||||
version = "0.7.15"
|
||||
version = "0.7.14"
|
||||
dependencies = [
|
||||
"bytes",
|
||||
"chrono",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
[package]
|
||||
name = "gridline"
|
||||
version = "0.7.15"
|
||||
version = "0.7.14"
|
||||
description = "An open-source, high-performance database GUI client for PostgreSQL and beyond"
|
||||
authors = ["you"]
|
||||
edition = "2021"
|
||||
|
||||
@@ -566,14 +566,6 @@ pub fn build_pg_insert_sql(
|
||||
table: &str,
|
||||
columns: &[(String, serde_json::Value)],
|
||||
) -> (String, Vec<serde_json::Value>) {
|
||||
// A table with no editable columns (e.g. only a serial/identity PK) inserts
|
||||
// with all defaults — `INSERT ... () VALUES ()` is invalid SQL.
|
||||
if columns.is_empty() {
|
||||
return (
|
||||
format!("INSERT INTO \"{}\".\"{}\" DEFAULT VALUES", schema, table),
|
||||
vec![],
|
||||
);
|
||||
}
|
||||
let cols: Vec<String> = columns.iter().map(|(c, _)| format!("\"{}\"", c)).collect();
|
||||
let mut params: Vec<serde_json::Value> = Vec::new();
|
||||
let placeholders: Vec<String> = columns
|
||||
@@ -3110,15 +3102,6 @@ mod tests {
|
||||
);
|
||||
}
|
||||
|
||||
/// A table with no editable columns (only a serial/identity PK) must insert
|
||||
/// with `DEFAULT VALUES`, not the invalid `INSERT ... () VALUES ()`.
|
||||
#[test]
|
||||
fn build_pg_insert_sql_empty_columns_uses_default_values() {
|
||||
let (sql, params) = build_pg_insert_sql("public", "t", &[]);
|
||||
assert_eq!(sql, "INSERT INTO \"public\".\"t\" DEFAULT VALUES");
|
||||
assert!(params.is_empty());
|
||||
}
|
||||
|
||||
/// Verify that `get_sqlite_ddl` returns the stored CREATE TABLE statement
|
||||
/// from `sqlite_master`.
|
||||
#[test]
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"$schema": "https://schema.tauri.app/config/2",
|
||||
"productName": "Gridline",
|
||||
"version": "0.7.15",
|
||||
"version": "0.7.14",
|
||||
"identifier": "com.adrianbonpin.gridline",
|
||||
"build": {
|
||||
"beforeDevCommand": "bun run dev",
|
||||
|
||||
@@ -231,7 +231,6 @@ export function DbViewerScreen({
|
||||
const changesQueue = useDbViewerStore((s) => s.changesQueue);
|
||||
const tables = useDbViewerStore((s) => s.tables);
|
||||
const stageCellEdit = useDbViewerStore((s) => s.stageCellEdit);
|
||||
const updateChange = useDbViewerStore((s) => s.updateChange);
|
||||
|
||||
const isRunning = activeTab?.tabType === "query" && !!activeTab?.loading;
|
||||
|
||||
@@ -340,19 +339,6 @@ export function DbViewerScreen({
|
||||
[activeTab, stageCellEdit],
|
||||
);
|
||||
|
||||
const handleStageInsertCell = useCallback(
|
||||
(changeId: string, column: string, value: string | null) => {
|
||||
const change = useDbViewerStore
|
||||
.getState()
|
||||
.changesQueue.find((c) => c.id === changeId);
|
||||
if (!change) return;
|
||||
const newData = { ...(change.newData ?? {}) };
|
||||
newData[column] = value;
|
||||
updateChange(changeId, { newData });
|
||||
},
|
||||
[updateChange],
|
||||
);
|
||||
|
||||
const handleOpenRowDetail = useCallback((rowIndex: number) => {
|
||||
setRowDetailIdx(rowIndex);
|
||||
}, []);
|
||||
@@ -846,24 +832,6 @@ export function DbViewerScreen({
|
||||
// Data is already filtered and sorted server-side; no client-side transform needed.
|
||||
const processedRows = rawRows;
|
||||
|
||||
// Pending insert rows (from the changes queue) are prepended to the grid as
|
||||
// editable rows. Only pending inserts for the active table tab count.
|
||||
const pendingInserts =
|
||||
activeTab?.tabType === "table"
|
||||
? changesQueue.filter(
|
||||
(c) =>
|
||||
c.type === "insert" &&
|
||||
c.status === "pending" &&
|
||||
c.schema === activeTab.schema &&
|
||||
c.table === activeTab.table,
|
||||
)
|
||||
: [];
|
||||
const pendingInsertChangeIds = pendingInserts.map((c) => c.id);
|
||||
const pendingInsertRows = pendingInserts.map((c) =>
|
||||
columns.map((col) => c.newData?.[col.name] ?? null),
|
||||
);
|
||||
const displayRows = [...pendingInsertRows, ...processedRows];
|
||||
|
||||
const onPanelResizeStart = useCallback(
|
||||
(e: React.MouseEvent) => {
|
||||
e.preventDefault();
|
||||
@@ -1216,7 +1184,7 @@ const onQueriesPanelResizeStart = useCallback(
|
||||
connectionId={connectionId}
|
||||
schema={activeSchema}
|
||||
table={activeTable}
|
||||
rows={displayRows}
|
||||
rows={processedRows}
|
||||
columns={columns}
|
||||
hiddenColumns={hiddenColumns}
|
||||
selectedRows={selectedRows}
|
||||
@@ -1224,7 +1192,6 @@ const onQueriesPanelResizeStart = useCallback(
|
||||
tabType={activeTab?.tabType ?? "table"}
|
||||
getLocator={getLocator}
|
||||
onStageEdit={readOnlyTable ? undefined : handleStageEdit}
|
||||
onStageInsertCell={readOnlyTable ? undefined : handleStageInsertCell}
|
||||
onOpenRowDetail={handleOpenRowDetail}
|
||||
readOnly={readOnlyTable}
|
||||
enumValues={editorOptions?.enums}
|
||||
@@ -1232,7 +1199,6 @@ const onQueriesPanelResizeStart = useCallback(
|
||||
fkPlaceholders={editorOptions?.fkPlaceholders}
|
||||
stagedValues={stagedValues}
|
||||
pendingKeys={pendingKeys}
|
||||
pendingInsertChangeIds={pendingInsertChangeIds}
|
||||
onToggleRow={(rowIndex) => {
|
||||
setSelectedRows(
|
||||
(prev) => {
|
||||
@@ -1382,7 +1348,7 @@ const onQueriesPanelResizeStart = useCallback(
|
||||
connectionId={connectionId}
|
||||
schema={activeSchema}
|
||||
table={activeTable}
|
||||
rows={displayRows}
|
||||
rows={processedRows}
|
||||
columns={columns}
|
||||
hiddenColumns={hiddenColumns}
|
||||
selectedRows={selectedRows}
|
||||
@@ -1390,7 +1356,6 @@ const onQueriesPanelResizeStart = useCallback(
|
||||
tabType={activeTab?.tabType ?? "table"}
|
||||
getLocator={getLocator}
|
||||
onStageEdit={readOnlyTable ? undefined : handleStageEdit}
|
||||
onStageInsertCell={readOnlyTable ? undefined : handleStageInsertCell}
|
||||
onOpenRowDetail={handleOpenRowDetail}
|
||||
readOnly={readOnlyTable}
|
||||
enumValues={editorOptions?.enums}
|
||||
@@ -1398,7 +1363,6 @@ const onQueriesPanelResizeStart = useCallback(
|
||||
fkPlaceholders={editorOptions?.fkPlaceholders}
|
||||
stagedValues={stagedValues}
|
||||
pendingKeys={pendingKeys}
|
||||
pendingInsertChangeIds={pendingInsertChangeIds}
|
||||
onToggleRow={(rowIndex) => {
|
||||
setSelectedRows((prev) => {
|
||||
const next = new Set(
|
||||
|
||||
@@ -99,7 +99,7 @@ export function SchemaMenu({ connectionId, schema, onRefresh }: SchemaMenuProps)
|
||||
"w-full bg-surface border border-border rounded-md px-3 py-2 text-sm text-text placeholder:text-text-muted outline-none focus:border-accent/50 transition-colors";
|
||||
|
||||
return (
|
||||
<div className="relative flex items-center gap-1" ref={menuRef}>
|
||||
<div className="flex items-center gap-1" ref={menuRef}>
|
||||
<button
|
||||
aria-label="New schema"
|
||||
onClick={() => {
|
||||
@@ -123,7 +123,7 @@ export function SchemaMenu({ connectionId, schema, onRefresh }: SchemaMenuProps)
|
||||
)}
|
||||
|
||||
{menuOpen && (
|
||||
<div className="absolute left-0 top-8 mt-1 rounded-xl bg-surface border border-border py-1 z-20 min-w-[160px] shadow-lg">
|
||||
<div className="absolute right-0 top-8 mt-1 rounded-xl bg-surface border border-border py-1 z-20 min-w-[160px] shadow-lg">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
|
||||
@@ -325,21 +325,6 @@ describe("TableControls", () => {
|
||||
expect(screen.queryByLabelText(/insert row/i)).toBeNull();
|
||||
});
|
||||
|
||||
it("stages an insert with only editable columns when Insert Row is clicked", () => {
|
||||
const cols = [
|
||||
{ name: "id", data_type: "integer", is_nullable: false, is_pk: true, is_fk: false, fk_ref: null, default_value: "nextval('users_id_seq')", editable: false, is_generated: false },
|
||||
{ name: "name", data_type: "text", is_nullable: false, is_pk: false, is_fk: false, fk_ref: null, default_value: null, editable: true, is_generated: false },
|
||||
{ name: "created_at", data_type: "timestamp", is_nullable: true, is_pk: false, is_fk: false, fk_ref: null, default_value: "now()", editable: true, is_generated: false },
|
||||
];
|
||||
seed([makeTab({ data: { columns: cols, rows: [], total_rows: 0, page: 1, page_size: 50 } })], "tab-1");
|
||||
renderControls({ columns: cols, rows: [] });
|
||||
fireEvent.click(screen.getByLabelText(/insert row/i));
|
||||
const queue = useDbViewerStore.getState().changesQueue;
|
||||
expect(queue).toHaveLength(1);
|
||||
expect(queue[0].type).toBe("insert");
|
||||
expect(queue[0].newData).toEqual({ name: null, created_at: null });
|
||||
});
|
||||
|
||||
it("renders the column filter popover with the + Add filter action", () => {
|
||||
seed([makeTab()], "tab-1");
|
||||
renderControls();
|
||||
|
||||
@@ -547,14 +547,8 @@ export function TableControls({
|
||||
};
|
||||
|
||||
const handleInsertRow = () => {
|
||||
// Build the insert template from editable columns only. PK / generated /
|
||||
// identity columns are omitted so their defaults (serial, identity,
|
||||
// generated) apply on commit — an explicit NULL would bypass them and
|
||||
// fail with a NOT NULL violation.
|
||||
const newData: Record<string, unknown> = {};
|
||||
columns.forEach((c) => {
|
||||
if (c.editable && !c.is_pk && !c.is_generated) newData[c.name] = null;
|
||||
});
|
||||
columns.forEach((c) => { newData[c.name] = null; });
|
||||
addChange({
|
||||
type: "insert",
|
||||
schema,
|
||||
|
||||
@@ -6,18 +6,16 @@ interface Props {
|
||||
isJson: boolean;
|
||||
isFk: boolean;
|
||||
nullable: boolean;
|
||||
/** When true, hide row-scoped actions (View Row / Select Row) — pending insert rows have no backing row. */
|
||||
isInsertRow?: boolean;
|
||||
onCopy: () => void; onCopyJson: () => void; onEdit: () => void;
|
||||
onSetNull: () => void; onOpenFk: () => void; onClose: () => void;
|
||||
onViewRow: () => void; onSelectRow: () => void;
|
||||
}
|
||||
export function CellContextMenu({ anchorRect, editable, isJson, isFk, nullable, isInsertRow = false, onCopy, onCopyJson, onEdit, onSetNull, onOpenFk, onClose, onViewRow, onSelectRow }: Props) {
|
||||
export function CellContextMenu({ anchorRect, editable, isJson, isFk, nullable, onCopy, onCopyJson, onEdit, onSetNull, onOpenFk, onClose, onViewRow, onSelectRow }: Props) {
|
||||
const items: { label: string; icon: React.ReactNode; onClick: () => void; show: boolean }[] = [
|
||||
{ label: "Copy", icon: <Copy size={12} />, onClick: () => { onCopy(); onClose(); }, show: true },
|
||||
{ label: "Copy JSON", icon: <Braces size={12} />, onClick: () => { onCopyJson(); onClose(); }, show: isJson },
|
||||
{ label: "View Row", icon: <Eye size={12} />, onClick: () => { onViewRow(); onClose(); }, show: !isInsertRow },
|
||||
{ label: "Select Row", icon: <MousePointerClick size={12} />, onClick: () => { onSelectRow(); onClose(); }, show: !isInsertRow },
|
||||
{ label: "View Row", icon: <Eye size={12} />, onClick: () => { onViewRow(); onClose(); }, show: true },
|
||||
{ label: "Select Row", icon: <MousePointerClick size={12} />, onClick: () => { onSelectRow(); onClose(); }, show: true },
|
||||
{ label: "Edit", icon: <Pencil size={12} />, onClick: () => { onEdit(); onClose(); }, show: editable },
|
||||
{ label: "Set NULL", icon: <CircleSlash size={12} />, onClick: () => { onSetNull(); onClose(); }, show: editable && nullable },
|
||||
{ label: "Open FK reference", icon: <Link2 size={12} />, onClick: () => { onOpenFk(); onClose(); }, show: isFk },
|
||||
|
||||
@@ -13,42 +13,6 @@ describe("CellEditor", () => {
|
||||
fireEvent.keyDown(input, { key: "Enter" });
|
||||
expect(onCommit).toHaveBeenCalledWith("Alicia");
|
||||
});
|
||||
|
||||
it("renders a native date input for date columns", () => {
|
||||
render(<CellEditor initialValue="2024-01-15" dataType="date" onCommit={vi.fn()} onCancel={vi.fn()} />);
|
||||
const input = screen.getByDisplayValue("2024-01-15");
|
||||
expect(input).toHaveAttribute("type", "date");
|
||||
});
|
||||
|
||||
it("renders a datetime-local input for timestamp columns", () => {
|
||||
render(<CellEditor initialValue="2024-01-15 10:30:00" dataType="timestamp without time zone" onCommit={vi.fn()} onCancel={vi.fn()} />);
|
||||
const input = screen.getByDisplayValue("2024-01-15T10:30");
|
||||
expect(input).toHaveAttribute("type", "datetime-local");
|
||||
});
|
||||
|
||||
it("commits a datetime-local value in canonical DB format (space separator + seconds)", () => {
|
||||
const onCommit = vi.fn();
|
||||
render(<CellEditor initialValue="2024-01-15 10:30:00" dataType="timestamp without time zone" onCommit={onCommit} onCancel={vi.fn()} />);
|
||||
const input = screen.getByDisplayValue("2024-01-15T10:30");
|
||||
fireEvent.change(input, { target: { value: "2024-01-15T11:45" } });
|
||||
fireEvent.keyDown(input, { key: "Enter" });
|
||||
expect(onCommit).toHaveBeenCalledWith("2024-01-15 11:45:00");
|
||||
});
|
||||
|
||||
it("renders a boolean select with true/false options", () => {
|
||||
render(<CellEditor initialValue="true" dataType="boolean" onCommit={vi.fn()} onCancel={vi.fn()} />);
|
||||
const select = screen.getByRole("combobox");
|
||||
expect(select).toHaveValue("true");
|
||||
expect(screen.getByRole("option", { name: "true" })).toBeInTheDocument();
|
||||
expect(screen.getByRole("option", { name: "false" })).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("renders a number input for integer columns", () => {
|
||||
render(<CellEditor initialValue="42" dataType="integer" onCommit={vi.fn()} onCancel={vi.fn()} />);
|
||||
const input = screen.getByRole("spinbutton");
|
||||
expect(input).toHaveAttribute("type", "number");
|
||||
expect(input).toHaveAttribute("step", "1");
|
||||
});
|
||||
it("commits null when a nullable cell is emptied", () => {
|
||||
const onCommit = vi.fn();
|
||||
render(<CellEditor initialValue="Alice" dataType="text" onCommit={onCommit} onCancel={vi.fn()} nullable />);
|
||||
@@ -76,7 +40,7 @@ describe("CellEditor", () => {
|
||||
it("blocks empty commits on non-nullable non-text columns and shows an error", () => {
|
||||
const onCommit = vi.fn();
|
||||
render(<CellEditor initialValue="42" dataType="integer" onCommit={onCommit} onCancel={vi.fn()} />);
|
||||
const input = screen.getByRole("spinbutton");
|
||||
const input = screen.getByRole("textbox");
|
||||
fireEvent.change(input, { target: { value: "" } });
|
||||
fireEvent.keyDown(input, { key: "Enter" });
|
||||
expect(onCommit).not.toHaveBeenCalled();
|
||||
@@ -93,7 +57,7 @@ describe("CellEditor", () => {
|
||||
it("clears the validation error as soon as the user types again", () => {
|
||||
const onCommit = vi.fn();
|
||||
render(<CellEditor initialValue="42" dataType="integer" onCommit={onCommit} onCancel={vi.fn()} />);
|
||||
const input = screen.getByRole("spinbutton");
|
||||
const input = screen.getByRole("textbox");
|
||||
fireEvent.change(input, { target: { value: "" } });
|
||||
fireEvent.keyDown(input, { key: "Enter" });
|
||||
expect(screen.getByTestId("cell-editor-error")).toBeInTheDocument();
|
||||
|
||||
@@ -30,45 +30,6 @@ const controlClass =
|
||||
/** Types that tolerate an empty string when NOT NULL ('' is a valid value). */
|
||||
const TEXT_LIKE = ["char", "text", "uuid", "bit"];
|
||||
|
||||
/** Map a column data type to a "smart" input kind. */
|
||||
type InputKind = "date" | "datetime" | "time" | "boolean" | "number" | "text";
|
||||
|
||||
const NUMERIC_TYPES = new Set([
|
||||
"integer", "bigint", "smallint", "int", "int2", "int4", "int8",
|
||||
"tinyint", "mediumint", "numeric", "decimal", "real", "double",
|
||||
"double precision", "float", "float4", "float8", "money",
|
||||
"serial", "bigserial", "smallserial",
|
||||
]);
|
||||
|
||||
const INTEGER_TYPES = new Set([
|
||||
"integer", "bigint", "smallint", "int", "int2", "int4", "int8",
|
||||
"tinyint", "mediumint", "serial", "bigserial", "smallserial",
|
||||
]);
|
||||
|
||||
function inputKindForType(dataType: string): InputKind {
|
||||
const t = dataType.toLowerCase().trim();
|
||||
if (t === "date") return "date";
|
||||
if (t.includes("timestamp") || t === "datetime") return "datetime";
|
||||
if (t === "time" || t === "timetz" || t.startsWith("time ")) return "time";
|
||||
if (t === "boolean" || t === "bool") return "boolean";
|
||||
if (NUMERIC_TYPES.has(t)) return "number";
|
||||
return "text";
|
||||
}
|
||||
|
||||
/** Convert a DB timestamp ("2024-01-15 10:30:00") to datetime-local ("2024-01-15T10:30"). */
|
||||
function toDatetimeLocal(v: string): string {
|
||||
const m = v.match(/^(\d{4}-\d{2}-\d{2})[ T](\d{2}:\d{2})/);
|
||||
return m ? `${m[1]}T${m[2]}` : v;
|
||||
}
|
||||
|
||||
/** Convert a datetime-local value ("2024-01-15T10:30") to the canonical DB
|
||||
* format ("2024-01-15 10:30:00") accepted by both PostgreSQL and MySQL. */
|
||||
function fromDatetimeLocal(v: string): string {
|
||||
const m = v.match(/^(\d{4}-\d{2}-\d{2})T(\d{2}:\d{2})(?::(\d{2}))?/);
|
||||
if (m) return `${m[1]} ${m[2]}:${m[3] ?? "00"}`;
|
||||
return v;
|
||||
}
|
||||
|
||||
export function CellEditor({
|
||||
initialValue,
|
||||
dataType,
|
||||
@@ -79,11 +40,7 @@ export function CellEditor({
|
||||
onCommit,
|
||||
onCancel,
|
||||
}: CellEditorProps) {
|
||||
const kind = inputKindForType(dataType);
|
||||
const isInteger = INTEGER_TYPES.has(dataType.toLowerCase().trim());
|
||||
const [value, setValue] = useState(
|
||||
kind === "datetime" ? toDatetimeLocal(initialValue) : initialValue,
|
||||
);
|
||||
const [value, setValue] = useState(initialValue);
|
||||
const [query, setQuery] = useState("");
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const rootRef = useRef<HTMLDivElement>(null);
|
||||
@@ -116,8 +73,6 @@ export function CellEditor({
|
||||
useEffect(() => {
|
||||
if (enumValues && enumValues.length > 0) {
|
||||
enumRef.current?.focus();
|
||||
} else if (kind === "boolean") {
|
||||
enumRef.current?.focus();
|
||||
} else if (fkOptions && fkOptions.length > 0) {
|
||||
searchRef.current?.focus();
|
||||
searchRef.current?.select();
|
||||
@@ -303,63 +258,6 @@ export function CellEditor({
|
||||
);
|
||||
}
|
||||
|
||||
if (kind === "boolean") {
|
||||
return (
|
||||
<div ref={rootRef} className={`flex h-full w-full items-center gap-1.5 px-1.5 ${error ? "ring-1 ring-inset ring-red-500/60" : ""}`}>
|
||||
<select
|
||||
ref={enumRef}
|
||||
className={controlClass}
|
||||
value={initialValue}
|
||||
onChange={(e) => commitRaw(e.target.value)}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Escape") {
|
||||
e.preventDefault();
|
||||
onCancel();
|
||||
}
|
||||
}}
|
||||
>
|
||||
<option value="">{nullable ? "NULL" : "—"}</option>
|
||||
<option value="true">true</option>
|
||||
<option value="false">false</option>
|
||||
</select>
|
||||
{errorBubble}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (kind === "date" || kind === "datetime" || kind === "time" || kind === "number") {
|
||||
const inputType = kind === "datetime" ? "datetime-local" : kind;
|
||||
return (
|
||||
<div
|
||||
ref={rootRef}
|
||||
data-testid="cell-editor"
|
||||
className={`flex h-full w-full items-center gap-2 ${error ? "ring-1 ring-inset ring-red-500/60" : ""}`}
|
||||
>
|
||||
<input
|
||||
ref={ref as any}
|
||||
type={inputType}
|
||||
className={inputClass}
|
||||
value={value}
|
||||
step={kind === "number" ? (isInteger ? "1" : "any") : undefined}
|
||||
onChange={(e) => {
|
||||
setValue(e.target.value);
|
||||
setError(null);
|
||||
}}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === "Enter") {
|
||||
e.preventDefault();
|
||||
commitRaw(kind === "datetime" ? fromDatetimeLocal(value) : value);
|
||||
} else if (e.key === "Escape") {
|
||||
e.preventDefault();
|
||||
onCancel();
|
||||
}
|
||||
}}
|
||||
/>
|
||||
{errorBubble}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const cls = large
|
||||
? `${inputClass} h-4 resize-none overflow-y-auto whitespace-pre leading-none py-0.5`
|
||||
: inputClass;
|
||||
|
||||
@@ -48,21 +48,6 @@ describe("VirtualDataGrid", () => {
|
||||
expect(screen.getByRole("textbox")).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it("renders a pending insert row with an 'auto' placeholder and no selection checkbox", () => {
|
||||
const rows = [[null, null], ...mockRows];
|
||||
mockGetTotalSize.mockReturnValue(rows.length * 36);
|
||||
mockGetVirtualItems.mockReturnValue(rows.map((_, i) => ({ key: i, index: i, start: i * 36, size: 36 })));
|
||||
render(<VirtualDataGrid connectionId="c1" schema="public" table="users" rows={rows} columns={mockColumns}
|
||||
hiddenColumns={new Set()} selectedRows={new Set()} onToggleRow={vi.fn()} onToggleAll={vi.fn()}
|
||||
dbType="postgresql" tabType="table" pendingInsertChangeIds={["ch-1"]} />);
|
||||
// Non-editable PK column in the insert row shows "auto" instead of NULL.
|
||||
expect(screen.getByText("auto")).toBeInTheDocument();
|
||||
// The insert row shows a "+" marker instead of a selection checkbox.
|
||||
expect(screen.getByTitle("New row")).toBeInTheDocument();
|
||||
// Real rows still render their checkboxes (2 real rows).
|
||||
expect(screen.getAllByRole("checkbox")).toHaveLength(3); // 1 select-all + 2 row checkboxes
|
||||
});
|
||||
|
||||
it("shows staged values passed from the parent + a pending outline", () => {
|
||||
mockGetTotalSize.mockReturnValue(mockRows.length * 36);
|
||||
mockGetVirtualItems.mockReturnValue(mockRows.map((_, i) => ({ key: i, index: i, start: i * 36, size: 36 })));
|
||||
|
||||
@@ -45,10 +45,6 @@ interface VirtualDataGridProps {
|
||||
stagedValues?: Record<string, string | null>;
|
||||
/** Keys of cells with a PENDING (not yet committed) update → drives the pulsing orange outline. */
|
||||
pendingKeys?: Record<string, boolean>;
|
||||
/** Ordered change ids of pending insert rows prepended to `rows`. */
|
||||
pendingInsertChangeIds?: string[];
|
||||
/** Stage a cell edit on a pending insert row (updates the insert's newData). */
|
||||
onStageInsertCell?: (changeId: string, column: string, value: string | null) => void;
|
||||
}
|
||||
|
||||
const ROW_HEIGHT = 36;
|
||||
@@ -78,24 +74,20 @@ export function VirtualDataGrid({
|
||||
fkPlaceholders,
|
||||
stagedValues,
|
||||
pendingKeys,
|
||||
pendingInsertChangeIds,
|
||||
onStageInsertCell,
|
||||
}: VirtualDataGridProps) {
|
||||
const parentRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
const visibleColumns = columns.filter((c) => !hiddenColumns.has(c.name));
|
||||
const hasColumns = columns.length > 0;
|
||||
const pendingInsertCount = pendingInsertChangeIds?.length ?? 0;
|
||||
const realRowCount = rows.length - pendingInsertCount;
|
||||
const allSelected = realRowCount > 0 && selectedRows.size === realRowCount;
|
||||
const allSelected = rows.length > 0 && selectedRows.size === rows.length;
|
||||
const selectAllRef = useRef<HTMLInputElement>(null);
|
||||
|
||||
// Indeterminate state for partial selection
|
||||
useEffect(() => {
|
||||
if (selectAllRef.current) {
|
||||
selectAllRef.current.indeterminate = selectedRows.size > 0 && selectedRows.size < realRowCount;
|
||||
selectAllRef.current.indeterminate = selectedRows.size > 0 && selectedRows.size < rows.length;
|
||||
}
|
||||
}, [selectedRows.size, realRowCount]);
|
||||
}, [selectedRows.size, rows.length]);
|
||||
|
||||
const virtualizer = useVirtualizer({
|
||||
count: rows.length,
|
||||
@@ -290,8 +282,6 @@ export function VirtualDataGrid({
|
||||
const isJson = !isNull && (col.data_type === "jsonb" || col.data_type === "json");
|
||||
const jp = isJson ? jsonPreview(displayCell) : { label: "", isJson: false };
|
||||
const editable = isCellEditable(col, tabType, dbType, readOnly);
|
||||
const isInsertRow = rowIndex < pendingInsertCount;
|
||||
const insertChangeId = isInsertRow ? pendingInsertChangeIds?.[rowIndex] : undefined;
|
||||
const isActive = activeCell?.row === rowIndex && activeCell?.col === colIndex;
|
||||
const isEditing = editingCell?.row === rowIndex && editingCell?.col === colIndex;
|
||||
const isPending =
|
||||
@@ -317,9 +307,6 @@ export function VirtualDataGrid({
|
||||
// revert/display stays correct even after repeated edits of the same cell.
|
||||
const dbValue = ci >= 0 ? row[ci] : undefined;
|
||||
if (committed !== (dbValue === null || dbValue === undefined ? null : dbValue)) {
|
||||
if (isInsertRow && insertChangeId) {
|
||||
onStageInsertCell?.(insertChangeId, col.name, committed);
|
||||
} else {
|
||||
const locator = getLocator?.(row) ?? {};
|
||||
onStageEdit?.(
|
||||
cellToUpdateChange({
|
||||
@@ -338,7 +325,6 @@ export function VirtualDataGrid({
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
setPendingCellKey(cellKey);
|
||||
setEditingCell(null);
|
||||
};
|
||||
@@ -369,9 +355,7 @@ export function VirtualDataGrid({
|
||||
}
|
||||
style={{ width: getWidth(col.name), flexShrink: 0 }}
|
||||
title={
|
||||
isInsertRow && !editable
|
||||
? "auto (default)"
|
||||
: isNull
|
||||
isNull
|
||||
? "NULL"
|
||||
: isFk
|
||||
? `FK → ${col.fk_ref![0]}.${col.fk_ref![1]}: ${String(displayCell)}`
|
||||
@@ -406,8 +390,6 @@ export function VirtualDataGrid({
|
||||
onCancel={() => setEditingCell(null)}
|
||||
/>
|
||||
</div>
|
||||
) : isInsertRow && !editable ? (
|
||||
<span className="italic text-text-muted/60">auto</span>
|
||||
) : isNull ? (
|
||||
<span className="italic text-text-muted">NULL</span>
|
||||
) : isJson ? (
|
||||
@@ -438,7 +420,7 @@ export function VirtualDataGrid({
|
||||
</div>
|
||||
);
|
||||
},
|
||||
[activeCell, columns, dbType, editingCell, enumValues, fkOptions, fkPlaceholders, getLocator, handleFkClick, onStageEdit, onStageInsertCell, schema, table, tabType, getWidth, pendingCell, stagedValues, pendingKeys, pendingCellKey, pendingInsertCount, pendingInsertChangeIds],
|
||||
[activeCell, columns, dbType, editingCell, enumValues, fkOptions, fkPlaceholders, getLocator, handleFkClick, onStageEdit, schema, table, tabType, getWidth, pendingCell, stagedValues, pendingKeys, pendingCellKey],
|
||||
);
|
||||
|
||||
// ── context menu helpers ──────────────────────────────
|
||||
@@ -464,11 +446,6 @@ export function VirtualDataGrid({
|
||||
const ci = columns.findIndex((c) => c.name === column.name);
|
||||
const value = rows[row]?.[ci];
|
||||
if (value === null || value === undefined) return;
|
||||
if (row < pendingInsertCount) {
|
||||
const changeId = pendingInsertChangeIds?.[row];
|
||||
if (changeId) onStageInsertCell?.(changeId, column.name, null);
|
||||
return;
|
||||
}
|
||||
const locator = getLocator?.(rows[row]) ?? {};
|
||||
onStageEdit?.(
|
||||
cellToUpdateChange({
|
||||
@@ -487,7 +464,7 @@ export function VirtualDataGrid({
|
||||
},
|
||||
);
|
||||
},
|
||||
[columns, dbType, getLocator, onStageEdit, onStageInsertCell, readOnly, rows, schema, table, tabType, visibleColumns, pendingInsertCount, pendingInsertChangeIds],
|
||||
[columns, dbType, getLocator, onStageEdit, readOnly, rows, schema, table, tabType, visibleColumns],
|
||||
);
|
||||
|
||||
return (
|
||||
@@ -551,18 +528,15 @@ export function VirtualDataGrid({
|
||||
}}
|
||||
>
|
||||
{virtualizer.getVirtualItems().map((virtualRow) => {
|
||||
const gridIndex = virtualRow.index;
|
||||
const isInsertRow = gridIndex < pendingInsertCount;
|
||||
const realIndex = isInsertRow ? -1 : gridIndex - pendingInsertCount;
|
||||
const row = rows[gridIndex];
|
||||
const isSelected = !isInsertRow && selectedRows.has(realIndex);
|
||||
const row = rows[virtualRow.index];
|
||||
const isSelected = selectedRows.has(virtualRow.index);
|
||||
return (
|
||||
<div
|
||||
key={virtualRow.key}
|
||||
data-index={gridIndex}
|
||||
data-index={virtualRow.index}
|
||||
className={`flex items-center border-b border-border ${
|
||||
isSelected ? "bg-accent/5" : ""
|
||||
} ${isInsertRow ? "bg-accent/[0.03] ring-1 ring-inset ring-accent/60" : ""} hover:bg-surface/50`}
|
||||
} hover:bg-surface/50`}
|
||||
style={{
|
||||
position: "absolute",
|
||||
top: 0,
|
||||
@@ -572,15 +546,7 @@ export function VirtualDataGrid({
|
||||
transform: `translateY(${virtualRow.start}px)`,
|
||||
}}
|
||||
>
|
||||
{hasColumns &&
|
||||
(isInsertRow ? (
|
||||
<div
|
||||
style={{ width: 40, minWidth: 40 }}
|
||||
className="flex items-center justify-center border-r border-border self-stretch"
|
||||
>
|
||||
<span className="text-[10px] text-accent/70" title="New row">+</span>
|
||||
</div>
|
||||
) : (
|
||||
{hasColumns && (
|
||||
<div
|
||||
style={{ width: 40, minWidth: 40 }}
|
||||
className="flex items-center justify-center border-r border-border self-stretch"
|
||||
@@ -588,12 +554,12 @@ export function VirtualDataGrid({
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={isSelected}
|
||||
onChange={() => onToggleRow(realIndex)}
|
||||
onChange={() => onToggleRow(virtualRow.index)}
|
||||
className="w-3.5 h-3.5 rounded border-border cursor-pointer accent-accent"
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
{visibleColumns.map((col, i) => renderCell(col, row, gridIndex, i))}
|
||||
)}
|
||||
{visibleColumns.map((col, i) => renderCell(col, row, virtualRow.index, i))}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
@@ -635,7 +601,6 @@ export function VirtualDataGrid({
|
||||
isJson={ctxCol.data_type === "jsonb" || ctxCol.data_type === "json"}
|
||||
isFk={ctxCol.is_fk && ctxCol.fk_ref != null}
|
||||
nullable={ctxCol.is_nullable}
|
||||
isInsertRow={ctxMenu.row < pendingInsertCount}
|
||||
onCopy={() => {
|
||||
void copyCellValue(ctxMenu.row, ctxMenu.col);
|
||||
setCtxMenu(null);
|
||||
@@ -645,11 +610,11 @@ export function VirtualDataGrid({
|
||||
setCtxMenu(null);
|
||||
}}
|
||||
onViewRow={() => {
|
||||
onOpenRowDetail?.(ctxMenu.row - pendingInsertCount);
|
||||
onOpenRowDetail?.(ctxMenu.row);
|
||||
setCtxMenu(null);
|
||||
}}
|
||||
onSelectRow={() => {
|
||||
onToggleRow(ctxMenu.row - pendingInsertCount);
|
||||
onToggleRow(ctxMenu.row);
|
||||
setCtxMenu(null);
|
||||
}}
|
||||
onEdit={() => {
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
import { describe, it, expect } from "vitest";
|
||||
import tauriConf from "../../src-tauri/tauri.conf.json";
|
||||
|
||||
describe("tauri bundle config (v0.7.15)", () => {
|
||||
describe("tauri bundle config (v0.7.14)", () => {
|
||||
it("declares bundled pg_tools resources", () => {
|
||||
expect(tauriConf.bundle.resources).toContain("resources/pg_tools/*");
|
||||
});
|
||||
it("version is 0.7.15", () => {
|
||||
expect(tauriConf.version).toBe("0.7.15");
|
||||
it("version is 0.7.14", () => {
|
||||
expect(tauriConf.version).toBe("0.7.14");
|
||||
});
|
||||
});
|
||||
@@ -45,10 +45,6 @@ describe("buildChangeSql", () => {
|
||||
const item = { id: "1", type: "insert", schema: "public", table: "t", newData: { a: 1, b: "x" } } as any;
|
||||
expect(buildChangeSql(item)).toBe('INSERT INTO "public"."t" ("a", "b") VALUES (1, \'x\')');
|
||||
});
|
||||
it("insert with no columns falls back to DEFAULT VALUES", () => {
|
||||
const item = { id: "1", type: "insert", schema: "public", table: "t", newData: {} } as any;
|
||||
expect(buildChangeSql(item)).toBe('INSERT INTO "public"."t" DEFAULT VALUES');
|
||||
});
|
||||
it("update", () => {
|
||||
const item = { id: "1", type: "update", schema: "public", table: "t", primaryKey: { id: 5 }, newData: { name: "O'Brien" } } as any;
|
||||
expect(buildChangeSql(item)).toBe('UPDATE "public"."t" SET "name" = \'O\'\'Brien\' WHERE "id" = 5');
|
||||
|
||||
@@ -33,7 +33,6 @@ export function buildChangeSql(item: QueueItem): string {
|
||||
case "insert": {
|
||||
const data = item.newData ?? {};
|
||||
const cols = Object.keys(data);
|
||||
if (cols.length === 0) return `INSERT INTO ${t} DEFAULT VALUES`;
|
||||
return `INSERT INTO ${t} (${cols.map(q).join(", ")}) VALUES (${cols.map((c) => lit(data[c])).join(", ")})`;
|
||||
}
|
||||
case "update": {
|
||||
|
||||
@@ -4,7 +4,7 @@ import { describe, it, expect } from "vitest";
|
||||
import agents from "../../../AGENTS.md?raw";
|
||||
import readme from "../../../README.md?raw";
|
||||
|
||||
describe("v0.7.15 docs coverage", () => {
|
||||
describe("v0.7.14 docs coverage", () => {
|
||||
it("AGENTS.md marks inline cell editing complete", () => {
|
||||
expect(agents).toContain("Inline cell editing");
|
||||
expect(agents).toMatch(/Inline cell editing \| ✅/);
|
||||
@@ -24,8 +24,8 @@ describe("v0.7.15 docs coverage", () => {
|
||||
expect(agents).toMatch(/Connection status indicator on cards \| ✅/);
|
||||
expect(agents).toMatch(/Move-to-folder bulk action \| ✅/);
|
||||
});
|
||||
it("README declares v0.7.15", () => {
|
||||
expect(readme).toContain("0.7.15");
|
||||
it("README declares v0.7.14", () => {
|
||||
expect(readme).toContain("0.7.14");
|
||||
});
|
||||
it("AGENTS.md marks schema CRUD complete", () => {
|
||||
expect(agents).toMatch(/Schema CRUD \| ✅/);
|
||||
@@ -64,9 +64,9 @@ describe("v0.7.15 docs coverage", () => {
|
||||
expect(agents).toMatch(/Cancel long-running queries \| ✅/);
|
||||
expect(agents).toMatch(/Settings export\/import \| ✅/);
|
||||
});
|
||||
it("README links to v0.7.15 assets in both download tables", () => {
|
||||
expect(readme).toContain("releases/download/v0.7.15/");
|
||||
expect(readme).toContain("Gridline_0.7.15_aarch64.dmg");
|
||||
expect(readme).toContain("Gridline-0.7.15-1.x86_64.rpm");
|
||||
it("README links to v0.7.14 assets in both download tables", () => {
|
||||
expect(readme).toContain("releases/download/v0.7.14/");
|
||||
expect(readme).toContain("Gridline_0.7.14_aarch64.dmg");
|
||||
expect(readme).toContain("Gridline-0.7.14-1.x86_64.rpm");
|
||||
});
|
||||
});
|
||||
@@ -2,7 +2,7 @@ import { describe, it, expect } from "vitest";
|
||||
import pkg from "../../package.json";
|
||||
|
||||
describe("version", () => {
|
||||
it("declares v0.7.15 across the app shell", () => {
|
||||
expect(pkg.version).toBe("0.7.15");
|
||||
it("declares v0.7.14 across the app shell", () => {
|
||||
expect(pkg.version).toBe("0.7.14");
|
||||
});
|
||||
});
|
||||
@@ -247,16 +247,6 @@ describe("dbViewerStore", () => {
|
||||
expect(useDbViewerStore.getState().changesQueue).toHaveLength(0);
|
||||
});
|
||||
|
||||
it("updateChange patches a single change in place", () => {
|
||||
useDbViewerStore.getState().addChange({ type: "insert", schema: "public", table: "t", newData: { a: null }, description: "x" } as any);
|
||||
const id = useDbViewerStore.getState().changesQueue[0].id;
|
||||
useDbViewerStore.getState().updateChange(id, { newData: { a: "hello" } });
|
||||
const item = useDbViewerStore.getState().changesQueue[0];
|
||||
expect(item.newData).toEqual({ a: "hello" });
|
||||
expect(item.type).toBe("insert");
|
||||
expect(item.description).toBe("x");
|
||||
});
|
||||
|
||||
it("clearChanges empties the queue", () => {
|
||||
useDbViewerStore.getState().addChange({ type: "insert", schema: "public", table: "t", newData: { a: 1 }, description: "x" } as any);
|
||||
useDbViewerStore.getState().addChange({ type: "delete", schema: "public", table: "t", primaryKey: { id: 1 }, description: "y" } as any);
|
||||
|
||||
@@ -167,7 +167,6 @@ interface DbViewerState {
|
||||
}) => void;
|
||||
cancelChange: (changeId: string) => void;
|
||||
removeChange: (changeId: string) => void;
|
||||
updateChange: (changeId: string, patch: Partial<QueueItem>) => void;
|
||||
clearChanges: () => void;
|
||||
markChangeCommitted: (changeId: string) => void;
|
||||
markChangeFailed: (changeId: string, error: string) => void;
|
||||
@@ -548,13 +547,6 @@ export const useDbViewerStore = create<DbViewerState>((set, get) => ({
|
||||
changesQueue: state.changesQueue.filter((c) => c.id !== changeId),
|
||||
})),
|
||||
|
||||
updateChange: (changeId, patch) =>
|
||||
set((state) => ({
|
||||
changesQueue: state.changesQueue.map((c) =>
|
||||
c.id === changeId ? { ...c, ...patch } : c,
|
||||
),
|
||||
})),
|
||||
|
||||
clearChanges: () => set({ changesQueue: [] }),
|
||||
|
||||
markChangeCommitted: (changeId) =>
|
||||
|
||||
@@ -60,7 +60,7 @@
|
||||
const keepLabel = downloadBtn.hasAttribute("data-download-label");
|
||||
|
||||
const releasesUrl = "https://git.ranio.xyz/adrianbonpin/gridline/releases";
|
||||
const version = "0.7.15";
|
||||
const version = "0.7.14";
|
||||
|
||||
if (isMobile) {
|
||||
downloadBtn.href = releasesUrl;
|
||||
|
||||
@@ -5,16 +5,6 @@ export interface ChangelogEntry {
|
||||
}
|
||||
|
||||
export const changelogEntries: ChangelogEntry[] = [
|
||||
{
|
||||
version: "0.7.15",
|
||||
date: "2026-09-08",
|
||||
highlights: [
|
||||
"Insert Row now works — it adds an editable pending row at the top of the data grid (with a visible accent outline), and committing inserts only the columns you filled in so serial/identity/generated defaults apply.",
|
||||
"Smart cell editors — date/time/datetime pickers, a boolean select, and number inputs for the matching column types (enums and foreign keys already had dropdowns), applied to both new rows and inline editing.",
|
||||
"Landing page adds a support channel: coffee via Ko-fi (ko-fi.com/adrianbonpin), always optional, never gates a feature.",
|
||||
"Landing page copy refreshed: em dashes dropped, OSS section simplified, FAQ added for how the project is funded.",
|
||||
],
|
||||
},
|
||||
{
|
||||
version: "0.7.14",
|
||||
date: "2026-09-04",
|
||||
|
||||
+3
-3
@@ -12,7 +12,7 @@ export const faqItems: FaqItem[] = [
|
||||
{
|
||||
question: "Which databases are supported?",
|
||||
answer:
|
||||
"PostgreSQL and SQLite are fully supported today (browsing, querying, editing, backups, and the visual tools). MySQL and Redis connections are in active development.",
|
||||
"PostgreSQL and SQLite are fully supported today — browsing, querying, editing, backups, and the visual tools. MySQL and Redis connections are in active development.",
|
||||
},
|
||||
{
|
||||
question: "How is this different from TablePlus, Beekeeper Studio, or DB Pro?",
|
||||
@@ -22,12 +22,12 @@ export const faqItems: FaqItem[] = [
|
||||
{
|
||||
question: "Do you store my database credentials?",
|
||||
answer:
|
||||
"No. Passwords live in your operating system keychain (macOS Keychain, Linux Secret Service, or Windows Credential Manager), never in Gridline's local SQLite database.",
|
||||
"No. Passwords live in your operating system keychain — macOS Keychain, Linux Secret Service, or Windows Credential Manager — never in Gridline's local SQLite database.",
|
||||
},
|
||||
{
|
||||
question: "How do you make money?",
|
||||
answer:
|
||||
"Gridline is free and isn't built around a paywall. If it saves you time, you can buy a coffee at ko-fi.com/adrianbonpin. It's entirely optional and never gates a feature. Otherwise, issues, docs, and contributions all help.",
|
||||
"Gridline is free and isn't built around a paywall. If it saves you time, you can buy a coffee at ko-fi.com/adrianbonpin — it's entirely optional and never gates a feature. Otherwise, issues, docs, and contributions all help.",
|
||||
},
|
||||
{
|
||||
question: "Can I contribute or self-host?",
|
||||
|
||||
@@ -13,7 +13,7 @@ export interface Props {
|
||||
|
||||
const {
|
||||
title,
|
||||
description = "Gridline, the open-source database GUI for PostgreSQL, MySQL, SQLite, and Redis. No paywalls, no tab limits, fully open source.",
|
||||
description = "Gridline — the open-source database GUI for PostgreSQL, MySQL, SQLite, and Redis. No paywalls, no tab limits, fully open source.",
|
||||
ogImage = "/og.png",
|
||||
noIndex = false,
|
||||
jsonLd = [],
|
||||
@@ -51,7 +51,7 @@ const isProd = import.meta.env.PROD;
|
||||
<meta property="og:image" content={ogImageURL} />
|
||||
<meta property="og:image:width" content="1200" />
|
||||
<meta property="og:image:height" content="630" />
|
||||
<meta property="og:image:alt" content="Gridline, the open-source database GUI" />
|
||||
<meta property="og:image:alt" content="Gridline — the open-source database GUI" />
|
||||
<meta property="og:site_name" content="Gridline" />
|
||||
<meta property="og:locale" content="en_US" />
|
||||
|
||||
@@ -59,7 +59,7 @@ const isProd = import.meta.env.PROD;
|
||||
<meta name="twitter:title" content={title} />
|
||||
<meta name="twitter:description" content={description} />
|
||||
<meta name="twitter:image" content={ogImageURL} />
|
||||
<meta name="twitter:image:alt" content="Gridline, the open-source database GUI" />
|
||||
<meta name="twitter:image:alt" content="Gridline — the open-source database GUI" />
|
||||
<meta name="twitter:site" content="@AdrianBonpin" />
|
||||
<meta name="twitter:creator" content="@AdrianBonpin" />
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
|
||||
const title = "Page not found · Gridline";
|
||||
const title = "Page not found — Gridline";
|
||||
const description = "That page doesn’t exist. Head back to Gridline, the open-source database GUI.";
|
||||
---
|
||||
|
||||
|
||||
@@ -15,7 +15,7 @@ import queryEditor from "../assets/screenshots/query-editor.png";
|
||||
import erDiagram from "../assets/screenshots/er-diagram.png";
|
||||
import home from "../assets/screenshots/home.png";
|
||||
import dataGrid from "../assets/screenshots/data-grid.png";
|
||||
const version = "0.7.15";
|
||||
const version = "0.7.14";
|
||||
const site = "https://getgridline.app";
|
||||
const jsonLd = [
|
||||
buildSoftwareApplicationJsonLd({
|
||||
@@ -58,7 +58,7 @@ const jsonLd = [
|
||||
]),
|
||||
];
|
||||
---
|
||||
<Layout title="Gridline, Free Open-Source Database GUI" jsonLd={jsonLd}>
|
||||
<Layout title="Gridline — Free Open-Source Database GUI" jsonLd={jsonLd}>
|
||||
<script src="/landing.js" defer></script>
|
||||
|
||||
<!-- Hero -->
|
||||
@@ -70,7 +70,7 @@ const jsonLd = [
|
||||
the open-source database <span class="text-[var(--accent)]">gui</span>
|
||||
</h1>
|
||||
<p class="mt-6 text-lg md:text-xl text-[var(--text-muted)] max-w-xl mx-auto">
|
||||
Query, explore, sync, and edit PostgreSQL, MySQL, SQLite, and Redis, with no paywalls, no tab limits, no account required.
|
||||
Query, explore, sync, and edit PostgreSQL, MySQL, SQLite, and Redis — with no paywalls, no tab limits, no account required.
|
||||
</p>
|
||||
<div class="mt-8 flex flex-wrap items-center justify-center gap-3">
|
||||
<a id="download" href="https://git.ranio.xyz/adrianbonpin/gridline/releases" class="primary-btn" data-download>
|
||||
@@ -176,7 +176,7 @@ const jsonLd = [
|
||||
<section id="oss" class="section-animate py-20 md:py-28 text-center">
|
||||
<div class="max-w-[800px] mx-auto px-6">
|
||||
<p class="font-mono text-xs text-[var(--accent)] uppercase tracking-[0.15em] mb-3">Open Source</p>
|
||||
<h2 class="font-serif text-3xl md:text-5xl mb-5">Free. Open source. Apache 2.0.</h2>
|
||||
<h2 class="font-serif text-3xl md:text-5xl mb-5">Built in public,<br />no VC roadmap attached.</h2>
|
||||
<p class="text-[var(--text-muted)] mb-8 max-w-md mx-auto">
|
||||
Gridline is Apache 2.0 and developed openly. Contributions, issues, and feature requests are welcome.
|
||||
</p>
|
||||
@@ -189,7 +189,7 @@ const jsonLd = [
|
||||
</a>
|
||||
</div>
|
||||
<p class="mt-6 text-xs text-[var(--text-muted)] max-w-sm mx-auto">
|
||||
Gridline stays free. No feature is ever behind a payment. Ko-fi is only for those who want to say thanks.
|
||||
Gridline stays free — no feature is ever behind a payment. Ko-fi is only for those who want to say thanks.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user