Use command-drag for Dashboard tile moves and add cell-detail preview to table/log tiles

[BorisTyshkevich]

Summary

Improve Dashboard interaction consistency and data inspection:

1. Replace ordinary whole-tile drag with Command/Ctrl-drag for tile movement, matching the schema graph interaction model.
2. Restore normal text selection inside Dashboard tiles when no move modifier is held.
3. Reuse the Workbench right-side cell-detail drawer for Dashboard table and logs tiles.

This issue changes interaction wiring only. It does not change Dashboard schemas, tile order semantics, panel specifications, query execution, or persisted result data.

Existing related work

Reuse the existing foundations rather than introducing Dashboard-specific copies:

• feat(schema): full lineage view in a live new tab — drag-move, undo/redo, detail pane #55 / schema graph: Command/Ctrl-gated node movement and normal unmodified pointer interaction.
• Cell-detail right-hand drawer: add horizontal resize #101: shared resizable right-side .cd-* drawer scaffold used by cell detail and rows viewer.
• Backdrop-closes-on-any-click doesn't check gesture origin (drag/selection past the panel edge closes it) #110: gesture-origin-safe backdrop dismissal, including text selection dragged beyond the drawer edge.
• Shared read-only CodeMirror viewer for structured and large text #213: shared read-only CodeMirror viewer with selection, copy, search, language modes, detached-document support, and explicit teardown.
• Cell detail: type-aware structured content viewer with shared Markdown rendering #214: type-aware cell-detail modes and lifecycle for SQL, JSON, Markdown, HTML, XML, and text.

Dashboard table and logs previews must call the same cell-detail action and renderer used by Workbench results. Do not create a second Dashboard cell viewer.

1. Command/Ctrl-drag tile movement

Problem

Dashboard edit mode currently marks the complete tile as HTML-draggable. Any ordinary drag therefore starts tile movement and prevents users from selecting text in:

• Markdown/text tiles;
• table cells;
• logs;
• chart labels or legends where selection is supported;
• error and diagnostic text.

This differs from the schema graph, where destructive/spatial movement is modifier-gated and ordinary pointer interaction remains available.

Required gesture

Use the platform command modifier:

• macOS: Meta / Command;
• Windows and Linux: Control.

A tile move starts only when:

primary pointer button + Command/Ctrl held + movement threshold crossed

Plain pointer drag must never reorder a tile.

Implementation requirements

• Remove native whole-card draggable="true" behavior and its dragstart/dragover/drop wiring.
• Reuse or extract the schema graph's modifier-drag detection and cursor-state pattern where practical.
• Use pointer events rather than native HTML drag-and-drop so text selection is not globally suppressed.
• Do not call preventDefault() on an unmodified pointerdown.
• Do not disable user-select until a valid modifier-drag has crossed the move threshold.
• Once movement begins, suppress the click generated by that gesture so a table cell, link, or preview action is not activated accidentally.
• Releasing the modifier during an active move may finish the already-started gesture; it must not turn into text selection mid-gesture.
• Pointer cancellation, window blur, Escape, or page teardown must cancel the transient move state and remove listeners.
• A completed move dispatches the existing atomic move-tile command exactly once.
• A cancelled move does not change the document, revision, fallback, or workspace.
• Keep the existing canonical dashboard.tiles[] order and packing behavior.

Visual feedback

• Normal tile/content cursor when no modifier is held.
• While Command/Ctrl is held over a movable tile, show the same move/grab affordance used by the schema graph or an equivalent consistent cursor.
• During active movement, show a clear moving state and destination indicator.
• The tile's existing edit-only grip may remain as a visual hint, but plain dragging it must not bypass the modifier rule.
• Update tooltip/help text to say Command-drag to move on macOS and Ctrl-drag to move elsewhere, or use a platform-neutral Command/Ctrl-drag to move label.

Read-only and mobile behavior

• Read-only Dashboard mode never enables tile movement.
• Touch-only interaction does not emulate a permanently held Command/Ctrl key.
• Existing non-pointer reorder alternatives, if present, remain unchanged.
• This issue does not introduce a new touch reorder mode.

2. Text selection inside Dashboard tiles

Required behavior

Without Command/Ctrl held, users must be able to select and copy visible text inside all Dashboard tile content.

Cover at least:

• Markdown/text panels;
• table headers and cells;
• log timestamps, levels, messages, and extras;
• error, loading, empty, and diagnostic text;
• KPI labels, values, units, descriptions, and deltas where the renderer does not intentionally disable selection.

Requirements:

• drag selection may begin anywhere inside selectable tile content;
• selection may cross multiple lines or cells;
• dragging a selection beyond the tile edge must not reorder the tile;
• selection followed by copy returns the selected text normally;
• a simple click still performs the tile content's normal action, including opening cell detail;
• edit chrome such as resize and delete controls remains non-selectable and keeps its existing behavior.

Do not solve this by adding isolated user-select: text overrides while leaving native tile dragging active. The move gesture itself must be corrected.

3. Dashboard table cell-detail preview

Current gap

The shared panel renderer already accepts an onCell callback, but Dashboard rendering currently supplies a no-op. Workbench result tables use that callback to open the right-side cell-detail drawer.

Required behavior

Clicking a data cell in a Dashboard table tile opens the same right-side cell-detail drawer used by Workbench results.

Pass the original cell descriptor:

interface CellDetailTarget {
  name: string;
  type: string;
  value: unknown;
}

Use the actual shared contract if it already differs; do not create a parallel Dashboard-only type.

The drawer must provide all functionality available in Workbench at implementation time, including the modes and lifecycle from #214 when that issue is implemented.

Requirements:

• works in Dashboard edit and read-only modes;
• works for Grid Tiles, Full view, and flow layouts;
• opens over the Dashboard in the same document/window;
• uses the shared persisted drawer width from Cell-detail right-hand drawer: add horizontal resize #101;
• supports selection, copy, search, wrapping, and structured preview modes through the existing drawer implementation;
• opening another cell replaces the current cell detail using the drawer's normal lifecycle;
• closing, replacing, or navigating away performs normal viewer/request teardown;
• a late async format/preview response cannot update a closed or replaced drawer;
• clicking a cell without Command/Ctrl opens preview and never begins tile movement;
• Command/Ctrl-drag beginning on a cell moves the tile and must not open preview on release.

Do not execute any SQL contained in a cell. Server-side formatting, when available through #214, may only pass the value to the existing safe formatter path.

4. Dashboard logs cell-detail preview

Logs tiles must expose their displayed values through the same cell-detail drawer.

Mapping contract

Each clickable displayed log field must retain a mapping to its original result column and raw value. Do not reconstruct preview values from formatted DOM text.

At minimum support:

• timestamp/time field;
• level/severity field;
• message field;
• each rendered extra field when it corresponds to a source column.

Clicking a displayed field opens:

column name
ClickHouse column type
original raw cell value

If the logs renderer combines several source columns into one visual message, the implementation must choose and document one deterministic mapping:

• preferably make each source-backed segment independently clickable;
• otherwise open the primary message column and expose remaining source fields through the existing structured value where available.

Do not pass colorized labels, abbreviated timestamps, concatenated presentation strings, or escaped HTML as the raw value.

Interaction

• Clickable log values use a subtle hover/focus indication without making the tile visually noisy.
• Values are keyboard reachable using the same semantics as table cells where practical.
• Enter or Space on a focused value opens cell detail.
• Text selection remains possible; a selection gesture must not open the drawer merely because it ends on a clickable value.
• Command/Ctrl-drag on a logs tile moves the tile instead of opening cell detail.

Shared action and ownership

Dashboard must invoke a shared application/UI action such as:

app.actions.openCellDetail(target, { document })

or the existing equivalent.

The exact API may differ, but ownership must remain shared:

• core cell analysis remains in the existing core module;
• the right-side drawer and preview controls remain in the existing results/drawer module or a shared extracted module;
• Dashboard supplies source column metadata and invokes the action;
• Dashboard does not duplicate HTML/JSON/SQL/Markdown detection or CodeMirror setup.

If the current openCellDetail() is too tightly coupled to the active Workbench tab, extract a target-based function that accepts {name, type, value} and a target document. Keep the Workbench call site on that same function.

Accessibility

• Tile move is not triggered by unmodified pointer interaction.
• Modifier-only movement is described in edit-mode help/title text.
• Table and logs preview targets are keyboard operable.
• Preview targets expose a useful accessible name including the column/field name.
• Opening the drawer moves focus according to the existing cell-detail contract.
• Closing restores focus to the initiating Dashboard cell/log field when it still exists.
• The drawer remains a labelled right-side detail surface and preserves Escape and backdrop behavior.
• Selection and copy remain available in both tile content and drawer content.

Tests

Tile movement and selection

• plain drag in Markdown/text content creates a text selection and does not call move-tile;
• plain drag in a table cell or log message does not reorder;
• Command-drag on macOS semantics and Ctrl-drag on Windows/Linux semantics each start movement;
• modifier click without crossing the threshold does not move;
• completed modifier-drag dispatches one move-tile command;
• cancelled drag changes nothing;
• generated click after a move does not activate cell preview;
• listener and cursor cleanup on pointercancel, Escape, blur, and rerender;
• read-only mode cannot move tiles.

Table preview

• clicking a Dashboard table cell opens the shared drawer with exact name, type, and raw value;
• null, numeric, DateTime, arrays, JSON-like strings, SQL, Markdown, HTML, and large text use the existing shared behavior;
• edit and read-only Dashboard modes work;
• opening a second cell replaces the first and tears down old viewers/requests;
• closing restores focus;
• no Dashboard-specific preview implementation is constructed.

Logs preview

• each supported rendered field maps to the correct source column/type/raw value;
• formatted display text is not substituted for raw data;
• click and keyboard activation open the shared drawer;
• selection does not accidentally open preview;
• modifier-drag moves the tile without preview activation.

Browser coverage

Verify in a real browser:

• text selection in Markdown, table, and logs tiles;
• Command/Ctrl-drag movement and destination feedback;
• Dashboard drawer resize and backdrop behavior;
• light and dark themes;
• Grid Tiles, Full view, Report, 2-column, and 3-column layouts;
• detached/read-only Dashboard routes;
• narrow viewport drawer behavior.

Acceptance criteria

• Dashboard tiles move only with Command/Ctrl-drag in edit mode.
• Native whole-card HTML dragging is removed.
• Plain dragging selects text and never reorders a tile.
• A move dispatches the existing atomic command once and preserves canonical order semantics.
• Dashboard table cells open the shared Workbench cell-detail drawer.
• Dashboard log fields open the same drawer using original column metadata and raw values.
• Edit and read-only Dashboard modes both support preview.
• Preview, selection, and movement gestures do not trigger one another accidentally.
• Existing drawer resize, lifecycle, structured modes, copy, focus, and dismissal behavior are reused.
• No Dashboard schema, query execution, panel format, or persistence semantics change.
• Unit and real-browser tests pass.

Non-goals

• changing Dashboard tile ordering or packing algorithms;
• adding touch drag-reorder;
• persisting drawer state per Dashboard;
• adding Dashboard-specific preview modes;
• executing SQL found in a cell;
• opening complete rows in a separate rows viewer;
• changing table/log result formatting;
• changing Workbench cell-detail semantics except for extraction needed to share the existing implementation.