Skip to content

fix(ui): snapshot rename looks unsaved and labels render too small - #698

Merged
NuTTeR merged 4 commits into
mainfrom
fix/679-snapshots-inline-edit
Aug 28, 2026
Merged

fix(ui): snapshot rename looks unsaved and labels render too small#698
NuTTeR merged 4 commits into
mainfrom
fix/679-snapshots-inline-edit

Conversation

@AkhDmitrii

@AkhDmitrii AkhDmitrii commented Aug 26, 2026

Copy link
Copy Markdown
Collaborator

Why

A chain's Snapshots tab. Its Name and Labels columns are edited in place: click a cell, it
turns into a field, press Enter.

Issue #679 reports two things, and one frame shows both. The name below was saved — the request
returned 200 — but the cell still shows a bordered input, so it reads as a field that refused to
save. The labels next to it render smaller than the ones the editor shows.

before

After:

after

Working the same cell turned up a third problem the issue does not mention: typing a name and
clicking away did nothing at all. No save, no cancel, and the editor stayed open until Enter.
Editing a label and clicking away threw the edit away without saying so.

What

  • A submit closed the editor twice and landed back on it. It closes once now.
  • Leaving a cell saves, the way InlineEditWithButtons already does through submitOnBlur.
  • Labels at rest take the size and the box of the chips the editor shows.
  • The hover border followed a hardcoded grey and stayed light in the dark theme.

This is the shared inline-edit component, so the behavior changes on every table that uses it,
not only on snapshots.

How to verify

Open a chain, go to Snapshots, and on a snapshot that carries labels:

  1. Rename it and press Enter. The cell goes back to plain text.
  2. Rename it and click another cell. It saves.
  3. Compare a label at rest with the editor open. Same size, same position.
cd ui && npx tsc --noEmit && npx eslint src/ && npx jest --coverage=false

250 suites, 3473 tests.

For the reviewer

  • Two specs under tests/pages/testing/ asserted the old behavior by looking for an input
    after Enter. They now look for the committed value, which is what their own comments already
    described.
  • Saving on blur reaches all 19 InlineEdit call sites. Three mapper dialogs resolve onSubmit
    after showing an error toast, so a rejected value now closes the editor rather than staying
    open. Worth a look before merge.

Closes #679

onFinish called toggle() a third time after the try/catch, so every submit
flipped the editor twice and it ended up open again. A rename saved correctly
and still showed its input, which reads as a field that refused to save.

The Form also carried onBlur, which never fired: component={false} drops the
rest props, so leaving a cell neither saved nor cancelled and the editor stayed
open until Enter. Blur now submits, matching submitOnBlur on
InlineEditWithButtons, and LabelsEdit no longer cancels on its own - a label
edit was silently discarded when the user clicked away.

Two testing-page specs asserted the old behavior by looking for an input after
Enter. They now look for the committed value, which is what their comments
already described.

Closes #679
A read-state label rendered at fontSizeSM, which the app's base size of 13 puts
at 10px in a 13px cell, so labels looked shrunken next to the chips the editor
shows. They now take the cell's size and the chip's box.

The inline-edit rule that pads controls to the cell listed .ant-select-selector,
a class antd v6 no longer emits, so the labels editor kept its own inset and its
chips sat 4px left of the read state. It targets .ant-select instead.

The hover border was a hardcoded #d9d9d9, which stayed light grey in the dark
theme; it reads --ant-color-border now.
The suite runs in jsdom and had nothing on InlineEdit, so both defects #679
reports passed it. These fail when the trailing toggle() returns and when the
relatedTarget guard on blur is dropped, which is what makes them worth keeping.
@AkhDmitrii
AkhDmitrii marked this pull request as ready for review August 27, 2026 05:56
@AkhDmitrii
AkhDmitrii requested a review from NuTTeR as a code owner August 27, 2026 05:56
The value dropped from 5px to 4px so a 24px label chip keeps the row at 32px.
Nothing in the suite fails if someone restores 5px, and every table row grows
by 2px.
@github-actions github-actions Bot added the documentation Improvements or additions to documentation label Aug 27, 2026
@sonarqubecloud

Copy link
Copy Markdown

@sonarqubecloud

Copy link
Copy Markdown

@AkhDmitrii AkhDmitrii changed the title fix(ui): close the inline editor on commit and size entity labels to it fix(ui): snapshot rename looks unsaved and labels render too small Aug 27, 2026
@NuTTeR
NuTTeR merged commit d3097b7 into main Aug 28, 2026
25 checks passed
@NuTTeR
NuTTeR deleted the fix/679-snapshots-inline-edit branch August 28, 2026 12:34
@github-actions github-actions Bot locked and limited conversation to collaborators Aug 28, 2026
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

bug documentation Improvements or additions to documentation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Snapshots table bugs

2 participants