Skip to content

concurrent edit indicator

Concurrent Edit Indicator Variations

How to show “User X is editing this document” to other users.


Option A: Banner Above Content

┌──────────────────────────────────────────────────────────────────────────────┐
│ Discovery Agent [Edit] [Delete] │
├──────────────────────────────────────────────────────────────────────────────┤
│ ┌──────────────────────────────────────────────────────────────────────────┐ │
│ │ ⚠️ Will is currently editing this document (started 5 min ago) [×] │ │
│ └──────────────────────────────────────────────────────────────────────────┘ │
├──────────────────────────────────────────────────────────────────────────────┤
│ │
│ # Discovery Agent │
│ │
│ This agent explores codebases to find patterns... │
│ │
└──────────────────────────────────────────────────────────────────────────────┘

Pros: Highly visible, can’t be missed Cons: Takes up vertical space, may feel alarming


Option B: Inline Badge Near Edit Button

┌──────────────────────────────────────────────────────────────────────────────┐
│ Discovery Agent │
│ │
│ [👤 Will editing...] [Edit Anyway ▾] [Delete] │
├──────────────────────────────────────────────────────────────────────────────┤
│ │
│ # Discovery Agent │
│ │
│ This agent explores codebases to find patterns... │
│ │
└──────────────────────────────────────────────────────────────────────────────┘
Dropdown when clicking "Edit Anyway":
┌─────────────────────────────────────────┐
│ Will started editing 5 min ago. │
│ │
│ Editing now may cause conflicts. │
│ Consider waiting or coordinating. │
│ │
│ [Wait] [Edit Anyway] │
└─────────────────────────────────────────┘

Pros: Subtle until action needed, contextual Cons: Easy to miss the indicator


Option C: Status Pill in Header

┌──────────────────────────────────────────────────────────────────────────────┐
│ Discovery Agent [🔒 Being edited by Will] [Edit] [Delete] │
├──────────────────────────────────────────────────────────────────────────────┤
│ │
│ # Discovery Agent │
│ │
│ This agent explores codebases... │
│ │
└──────────────────────────────────────────────────────────────────────────────┘
Hover on pill shows tooltip:
┌──────────────────────────────────┐
│ Will started editing │
│ 5 minutes ago │
│ │
│ Changes may conflict if you edit │
└──────────────────────────────────┘

Pros: Clean, doesn’t interrupt flow, always visible Cons: Tooltip required for details


Option D: Floating Corner Indicator

┌──────────────────────────────────────────────────────────────────────────────┐
│ Discovery Agent [Edit] [Delete] │
├──────────────────────────────────────────────────────────────────────────────┤
│ │
│ # Discovery Agent │
│ │
│ This agent explores codebases to find patterns... │
│ │
│ │
│ ┌───────────────┐ │
│ │ 👤 Will │ │
│ │ editing... │ │
│ └───────────────┘ │
└──────────────────────────────────────────────────────────────────────────────┘

Pros: Persistent but unobtrusive Cons: May be missed, disconnected from Edit button


Option E: Edit Button State Change

Normal state:
┌──────────────────────────────────────────────────────────────────────────────┐
│ Discovery Agent [Edit] [Delete] │
└──────────────────────────────────────────────────────────────────────────────┘
When someone else is editing:
┌──────────────────────────────────────────────────────────────────────────────┐
│ Discovery Agent [⚠️ Edit (Will editing)] [Del] │
└──────────────────────────────────────────────────────────────────────────────┘
Click shows confirmation:
┌─────────────────────────────────────────────────────────┐
│ Someone is already editing │
├─────────────────────────────────────────────────────────┤
│ │
│ Will started editing this document 5 minutes ago. │
│ │
│ If you both make changes, the last person to save │
│ will overwrite the other's work. │
│ │
│ 💡 Consider coordinating via Slack or waiting. │
│ │
├─────────────────────────────────────────────────────────┤
│ [Wait & Refresh] [Edit Anyway] │
└─────────────────────────────────────────────────────────┘

Pros: Warning appears exactly when needed (at action point) Cons: User doesn’t know until they try to edit


In Edit Mode: Real-time Indicator

When the current user IS editing and another user starts:

┌──────────────────────────────────────────────────────────────────────────────┐
│ Editing: Discovery Agent [Cancel] [Save] │
├──────────────────────────────────────────────────────────────────────────────┤
│ ┌──────────────────────────────────────────────────────────────────────────┐ │
│ │ ⚠️ Tim just opened this document for editing. Save frequently! [×] │ │
│ └──────────────────────────────────────────────────────────────────────────┘ │
├─────────────────────────────┬────────────────────────────────────────────────┤
│ EDITOR │ PREVIEW │
│ │ │
│ # Discovery Agent │ Discovery Agent │
│ ... │ ... │
└─────────────────────────────┴────────────────────────────────────────────────┘

Recommendation

Combination Approach:

  1. View Mode: Option C (Status pill in header) - clean, always visible
  2. Before Edit: Option E (Confirmation dialog) - explains consequences clearly
  3. During Edit: Banner notification if another user starts editing

This provides awareness without blocking, matches the “soft lock” decision from the spec.