Skip to content

feat: add env editor diff gutter indicators#4492

Open
mhbdev wants to merge 1 commit into
Dokploy:canaryfrom
mhbdev:enhance-env-editor
Open

feat: add env editor diff gutter indicators#4492
mhbdev wants to merge 1 commit into
Dokploy:canaryfrom
mhbdev:enhance-env-editor

Conversation

@mhbdev
Copy link
Copy Markdown
Contributor

@mhbdev mhbdev commented May 26, 2026

Summary

This PR adds line-level gutter indicators to env editors so unsaved changes are easier to spot and scan.
It introduces a reusable diff-gutter capability in the shared editor and enables it across Environment-related screens.

What changed

  • Added reusable diff gutter support to shared CodeEditor:
    • showDiffGutter
    • diffOriginalValue
  • Added visual gutter markers for:
    • added lines
    • modified lines
    • removed lines
  • Enabled indicators in env editing flows:
    • Environment Variables modal
    • Project Environment modal
    • Service Environment editor
    • Traefik env editor
    • Secrets-based env sections (including preview settings)
  • Added global styles for marker visibility in light/dark themes.
  • Fixed noisy behavior by not marking blank spacer lines and by anchoring removal markers to nearest non-blank lines.

Why

Env editors can become hard to review quickly, especially with multiline values and spacing.
These indicators make diffs and unsaved edits immediately observable without changing existing save behavior.

UX impact

  • Clear line-level change hints in the gutter.
  • Less false/noisy markers from blank lines.
  • Better confidence when reviewing env changes before save.

Validation

  • Typecheck passed (pnpm --filter dokploy typecheck).
  • Manual verification on local dev server for env editors.

Notes

  • No API/schema changes.
  • No behavior change to save/update mutations; this is UI observability only.

Related issues

fixes and closes #4491

- add reusable CodeMirror diff gutter support in shared `CodeEditor`
  via `showDiffGutter` + `diffOriginalValue`
- render visual line markers for added/modified/removed lines
- enable indicators in environment editors:
  - environment-level vars
  - project-level vars
  - service env editors
  - Traefik env editor
  - shared `Secrets`-based env inputs
- style gutter markers for light/dark themes
- reduce noise by ignoring blank spacer lines in marker placement
  and anchoring removals to nearest non-blank line

This improves visibility of unsaved env edits and line-level diffs
across Environment-related tabs.
@mhbdev mhbdev requested a review from Siumauricio as a code owner May 26, 2026 14:45
@dosubot dosubot Bot added size:L This PR changes 100-499 lines, ignoring generated files. enhancement New feature or request labels May 26, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request size:L This PR changes 100-499 lines, ignoring generated files.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add gutter indicators to env var and code editors

1 participant