Skip to content

feat: inline editing of node values from the properties panel#417

Open
shaunpatterson wants to merge 2 commits into
dgraph-io:mainfrom
shaunpatterson:sp/inline-edit
Open

feat: inline editing of node values from the properties panel#417
shaunpatterson wants to merge 2 commits into
dgraph-io:mainfrom
shaunpatterson:sp/inline-edit

Conversation

@shaunpatterson

Copy link
Copy Markdown
Contributor

What

Lets users edit graph data directly from the node properties panel instead of hand-writing mutations — the headline capability of commercial graph IDEs like G.V():

  • Each scalar attribute row gets edit and delete actions: edit opens an inline input (number input for numbers, true/false select for booleans), Enter/✓ saves, Escape cancels. Delete is two-step (trash → "sure?").
  • + Add value sets a new predicate on the node.
  • Server errors surface inline in the panel; successful edits update the in-memory node and show a transient ✓ saved.

Safety

lib/mutations.js builds single-triple N-Quad mutations (commitNow) through the existing dgraph client, with:

  • No N-Quad injection: uids must match 0x[hex], predicate names reject angle brackets/whitespace/quotes; string literals are escaped (backslashes, quotes, newlines, tabs).
  • No silent retyping: values are written with the original value's type (xs:int / xs:float / xs:boolean, plain strings), and user input is coerced back to that type with a clear error when it doesn't parse.

Testing

  • 11 unit tests on the mutation builders (escaping, injection rejection, typed literals, delete-one vs delete-all, coercion).
  • Every generated mutation shape verified against a live Dgraph v25: set string with escaped quotes, set typed int, delete specific value, delete all values — all accepted, final state confirmed by query.
  • npm run build passes.

🤖 Generated with Claude Code

Turns Ratel from a read-only viewer into an editor for scalar values
(the headline feature of tools like G.V()):

- Each attribute row in the node properties panel gets edit and
  delete actions: edit opens an inline input (number input for
  numbers, true/false select for booleans), Enter/check saves,
  Escape cancels; delete is two-step (trash -> 'sure?').
- '+ Add value' row sets a new predicate on the node.
- Saves run single-triple N-Quad mutations (commitNow) through the
  existing dgraph client; values are written with the original
  value's type (xs:int / xs:float / xs:boolean, escaped strings) so
  edits never silently retype a predicate. Errors from the server
  surface in the panel; successful edits update the in-memory node.
- lib/mutations.js validates uids (hex) and predicate names (no
  angle brackets/whitespace - no N-Quad injection), escapes string
  literals, and is fully unit-tested (11 tests).

Mutation output verified against a live Dgraph v25: set string with
escaped quotes, set typed int, delete specific/all values - all
accepted and the final state matches.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
@shaunpatterson shaunpatterson requested a review from a team as a code owner June 12, 2026 17:38
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Development

Successfully merging this pull request may close these issues.

1 participant