trending/dbx
1
0
Fork 0
mirror of https://github.com/t8y2/dbx.git synced 2026-10-02 02:34:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(grid): add direct table structure navigation

Browse Source 
Closes #9937
This commit is contained in:
t8y2
2026-09-26 04:59:56 +00:00
parent 66bfc86c78
commit d2df8d1633
2 changed files with 33 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/desktop/src/components/grid/DataGrid.vue
+16
View File
@@ -12259,6 +12259,22 @@ useUpdateBlocker(() => (hasPendingChanges.value || hasPendingDataEditorDraft.val
>
<template #leading>
<slot v-if="hasResultToolbarActionsSlot" name="result-toolbar-actions" :compact="compactDataGridToolbar" />
<Tooltip v-if="props.context === 'table-data' && canOpenTableStructureEditor">
<TooltipTrigger as-child>
<Button
data-grid-edit-table-structure-action
variant="ghost"
size="sm"
:class="['data-grid-topbar-action-button h-5 shrink-0 px-1.5 text-xs', compactDataGridToolbar ? 'data-grid-topbar-action-button--compact' : '']"
:aria-label="t('contextMenu.editStructure')"
@click="openTableStructureEditor"
>
<PencilRuler class="data-grid-topbar-action-icon h-3 w-3" />
<span class="data-grid-topbar-action-label" :class="{ 'data-grid-topbar-action-label--compact': compactDataGridToolbar }">{{ t("contextMenu.editStructure") }}</span>
</Button>
</TooltipTrigger>
<TooltipContent side="bottom">{{ t("contextMenu.editStructure") }}</TooltipContent>
</Tooltip>
<Tooltip v-if="showQueryEditReadOnlyBadge">
<TooltipTrigger as-child>
<div class="flex h-5 items-center gap-1 rounded border border-muted-foreground/30 bg-muted/60 px-1.5 text-xs font-medium text-muted-foreground">
apps/desktop/src/components/grid/__tests__/DataGridEditTableStructureShortcut.spec.ts
Vendored
+17
View File
@@ -152,6 +152,21 @@ afterEach(() => {
});
describe("DataGrid edit-table-structure shortcut", () => {
it("opens the structure editor from the table-data toolbar", async () => {
const { host, openTableStructure } = mountGrid();
await settle();
const action = host.querySelector<HTMLButtonElement>("[data-grid-edit-table-structure-action]");
expect(action).not.toBeNull();
expect(action?.getAttribute("aria-label")).toBe("Edit Structure");
expect(action?.textContent).toContain("Edit Structure");
action?.click();
await settle();
expect(openTableStructure).toHaveBeenCalledOnce();
expect(openTableStructure).toHaveBeenCalledWith("connection-1", "app", "public", "users", "ddl", undefined, "warehouse", "table");
});
it("opens the existing structure editor route for an eligible table-data grid", async () => {
const { host, openTableStructure } = mountGrid();
await settle();
@@ -206,6 +221,7 @@ describe("DataGrid edit-table-structure shortcut", () => {
expect(event.defaultPrevented).toBe(false);
expect(bubbled).toHaveBeenCalledOnce();
expect(openTableStructure).not.toHaveBeenCalled();
expect(host.querySelector("[data-grid-edit-table-structure-action]")).toBeNull();
});
it("leaves editable text targets untouched", async () => {
@@ -259,6 +275,7 @@ describe("DataGrid edit-table-structure shortcut", () => {
expect(keydown).toMatch(
/if \(!targetAllowsNativeClipboard && props\.context === "table-data" && canOpenTableStructureEditor\.value && isEditTableStructureShortcut\(event, settingsStore\.editorSettings\.shortcuts\)\) \{[\s\S]*?event\.preventDefault\(\);[\s\S]*?event\.stopPropagation\(\);[\s\S]*?openTableStructureEditor\(\);[\s\S]*?return;/,
);
expect(dataGridSource).toMatch(/data-grid-edit-table-structure-action[\s\S]*?@click="openTableStructureEditor"/);
expect(dataGridSource).toMatch(/<Button v-if="canOpenTableStructureEditor"[^>]*@click="openTableStructureEditor">/);
});
});