UnsTab native HTML5 drag/drop + 409 concurrent-edit modal + optimistic-concurrency commit path. Closes UI slice of task #153 (Phase 6.4 Stream A UI follow-up). Playwright E2E smoke is split into new task #199 — Playwright install + WebApplicationFactory + seeded-DB harness is genuinely its own infra-setup PR. Native HTML5 attributes (draggable, @ondragstart, @ondragover, @ondragleave, @ondrop) deliberately over MudBlazor per the task title — no MudBlazor ever joins this project. Two new service methods on UnsService land the data layer the existing UnsImpactAnalyzer assumed but which didn't actually exist: (1) LoadSnapshotAsync(generationId) — walks UnsAreas + UnsLines + per-line equipment counts + builds a UnsTreeSnapshot including a 16-char SHA-256 revision token computed deterministically over the sorted (kind, id, parent, name, notes) tuple-set so it's stable across processes + changes whenever any row is added / modified / deleted; (2) MoveLineAsync(generationId, expectedToken, lineId, targetAreaId) — re-parents one line inside the same draft under an EF transaction, recomputes the current revision token from freshly-loaded rows, and throws DraftRevisionConflictException when the caller-supplied token no longer matches. Token mismatch means another operator mutated the draft between preview + commit + the move rolls back rather than clobbering their work. No-op same-area drop is a silent return. Cross-generation move is prevented by the generationId filter on the transaction reads. UnsTab.razor gains draggable="true" on every line row with @ondragstart capturing the LineId into _dragLineId, and every area row is a drop target (@ondragover with :preventDefault so the browser accepts drops, @ondrop kicking off OnLineDroppedAsync). Drop path loads a fresh snapshot, builds a UnsMoveOperation(Kind=LineMove, source/target cluster matching because cross-cluster is decision-#82 rejected), runs UnsImpactAnalyzer.Analyze + shows a Bootstrap modal rendered inline in the component — modal shows HumanReadableSummary + equipment/tag counts + any CascadeWarnings list. Confirm button calls MoveLineAsync with the snapshot's RevisionToken; DraftRevisionConflictException surfaces a separate red-header "Draft changed — refresh required" modal with a Reload button that re-fetches areas + lines from the DB. New DraftRevisionConflictException in UnsService.cs, co-located with the service that throws it. Five new UnsServiceMoveTests covering LoadSnapshotAsync (areas + lines + equipment counts), RevisionToken stability between two reads, RevisionToken changes on AddLineAsync, MoveLineAsync happy path reparents the line in the DB, MoveLineAsync with stale token throws DraftRevisionConflictException + leaves the DB unchanged. Admin suite 81/81 passing (was 76, +5). Admin project builds 0 errors. Task #199 captures the deferred Playwright E2E smoke — drag a line onto a different area in a real browser, assert preview modal contents, click Confirm, assert the line row shows the new area. That PR stands up a new tests/ZB.MOM.WW.OtOpcUa.Admin.E2ETests project with Playwright + WebApplicationFactory + seeded InMemory DbContext.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/ZB.MOM.WW.OtOpcUa.Admin/Components/Pages/Clusters/UnsTab.razor

@@ -2,6 +2,13 @@
 @using ZB.MOM.WW.OtOpcUa.Configuration.Entities
 @inject UnsService UnsSvc
 
+<div class="alert alert-info small mb-3">
+    Drag any line in the <strong>UNS Lines</strong> table onto an area row in <strong>UNS Areas</strong>
+    to re-parent it. A preview modal shows the impact (equipment re-home count) + lets you confirm
+    or cancel. If another operator modifies the draft while you're confirming, you'll see a 409
+    refresh-required modal instead of clobbering their work.
+</div>
+
 <div class="row">
     <div class="col-md-6">
         <div class="d-flex justify-content-between mb-2">
@@ -14,11 +21,20 @@
         else
         {
             <table class="table table-sm">
-                <thead><tr><th>AreaId</th><th>Name</th></tr></thead>
+                <thead><tr><th>AreaId</th><th>Name</th><th class="small text-muted">(drop target)</th></tr></thead>
                 <tbody>
                 @foreach (var a in _areas)
                 {
-                    <tr><td><code>@a.UnsAreaId</code></td><td>@a.Name</td></tr>
+                    <tr class="@(_hoverAreaId == a.UnsAreaId ? "table-primary" : "")"
+                        @ondragover="e => OnAreaDragOver(e, a.UnsAreaId)"
+                        @ondragover:preventDefault
+                        @ondragleave="() => _hoverAreaId = null"
+                        @ondrop="() => OnLineDroppedAsync(a.UnsAreaId)"
+                        @ondrop:preventDefault>
+                        <td><code>@a.UnsAreaId</code></td>
+                        <td>@a.Name</td>
+                        <td class="small text-muted">drop here</td>
+                    </tr>
                 }
                 </tbody>
             </table>
@@ -35,6 +51,7 @@
             </div>
         }
     </div>
+
     <div class="col-md-6">
         <div class="d-flex justify-content-between mb-2">
             <h4>UNS Lines</h4>
@@ -50,7 +67,14 @@
                 <tbody>
                 @foreach (var l in _lines)
                 {
-                    <tr><td><code>@l.UnsLineId</code></td><td><code>@l.UnsAreaId</code></td><td>@l.Name</td></tr>
+                    <tr draggable="true"
+                        @ondragstart="() => _dragLineId = l.UnsLineId"
+                        @ondragend="() => { _dragLineId = null; _hoverAreaId = null; }"
+                        style="cursor: grab;">
+                        <td><code>@l.UnsLineId</code></td>
+                        <td><code>@l.UnsAreaId</code></td>
+                        <td>@l.Name</td>
+                    </tr>
                 }
                 </tbody>
             </table>
@@ -75,6 +99,64 @@
     </div>
 </div>
 
+@* Preview / confirm modal for a pending drag-drop move *@
+@if (_pendingPreview is not null)
+{
+    <div class="modal show d-block" tabindex="-1" style="background-color: rgba(0,0,0,0.5);">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h5 class="modal-title">Confirm UNS move</h5>
+                    <button type="button" class="btn-close" @onclick="CancelMove"></button>
+                </div>
+                <div class="modal-body">
+                    <p>@_pendingPreview.HumanReadableSummary</p>
+                    <p class="text-muted small">
+                        Equipment re-homed: <strong>@_pendingPreview.AffectedEquipmentCount</strong>.
+                        Tags re-parented: <strong>@_pendingPreview.AffectedTagCount</strong>.
+                    </p>
+                    @if (_pendingPreview.CascadeWarnings.Count > 0)
+                    {
+                        <div class="alert alert-warning small mb-0">
+                            <ul class="mb-0">
+                                @foreach (var w in _pendingPreview.CascadeWarnings) { <li>@w</li> }
+                            </ul>
+                        </div>
+                    }
+                </div>
+                <div class="modal-footer">
+                    <button class="btn btn-secondary" @onclick="CancelMove">Cancel</button>
+                    <button class="btn btn-primary" @onclick="ConfirmMoveAsync" disabled="@_committing">Confirm move</button>
+                </div>
+            </div>
+        </div>
+    </div>
+}
+
+@* 409 concurrent-edit modal — another operator changed the draft between preview + commit *@
+@if (_conflictMessage is not null)
+{
+    <div class="modal show d-block" tabindex="-1" style="background-color: rgba(0,0,0,0.5);">
+        <div class="modal-dialog">
+            <div class="modal-content border-danger">
+                <div class="modal-header bg-danger text-white">
+                    <h5 class="modal-title">Draft changed — refresh required</h5>
+                </div>
+                <div class="modal-body">
+                    <p>@_conflictMessage</p>
+                    <p class="small text-muted">
+                        Concurrency guard per DraftRevisionToken prevented overwriting the peer
+                        operator's edit. Reload the tab + redo the move on the current draft state.
+                    </p>
+                </div>
+                <div class="modal-footer">
+                    <button class="btn btn-primary" @onclick="ReloadAfterConflict">Reload draft</button>
+                </div>
+            </div>
+        </div>
+    </div>
+}
+
 @code {
     [Parameter] public long GenerationId { get; set; }
     [Parameter] public string ClusterId { get; set; } = string.Empty;
@@ -87,6 +169,13 @@
     private string _newLineName = string.Empty;
     private string _newLineAreaId = string.Empty;
 
+    private string? _dragLineId;
+    private string? _hoverAreaId;
+    private UnsImpactPreview? _pendingPreview;
+    private UnsMoveOperation? _pendingMove;
+    private bool _committing;
+    private string? _conflictMessage;
+
     protected override async Task OnParametersSetAsync() => await ReloadAsync();
 
     private async Task ReloadAsync()
@@ -112,4 +201,72 @@
         _showLineForm = false;
         await ReloadAsync();
     }
+
+    private void OnAreaDragOver(DragEventArgs _, string areaId) => _hoverAreaId = areaId;
+
+    private async Task OnLineDroppedAsync(string targetAreaId)
+    {
+        var lineId = _dragLineId;
+        _hoverAreaId = null;
+        _dragLineId = null;
+        if (string.IsNullOrWhiteSpace(lineId)) return;
+
+        var line = _lines?.FirstOrDefault(l => l.UnsLineId == lineId);
+        if (line is null || line.UnsAreaId == targetAreaId) return;
+
+        var snapshot = await UnsSvc.LoadSnapshotAsync(GenerationId, CancellationToken.None);
+        var move = new UnsMoveOperation(
+            Kind: UnsMoveKind.LineMove,
+            SourceClusterId: ClusterId,
+            TargetClusterId: ClusterId,
+            SourceLineId: lineId,
+            TargetAreaId: targetAreaId);
+        try
+        {
+            _pendingPreview = UnsImpactAnalyzer.Analyze(snapshot, move);
+            _pendingMove = move;
+        }
+        catch (Exception ex)
+        {
+            _conflictMessage = ex.Message; // CrossCluster or validation failure surfaces here
+        }
+    }
+
+    private void CancelMove()
+    {
+        _pendingPreview = null;
+        _pendingMove = null;
+    }
+
+    private async Task ConfirmMoveAsync()
+    {
+        if (_pendingPreview is null || _pendingMove is null) return;
+        _committing = true;
+        try
+        {
+            await UnsSvc.MoveLineAsync(
+                GenerationId,
+                _pendingPreview.RevisionToken,
+                _pendingMove.SourceLineId!,
+                _pendingMove.TargetAreaId!,
+                CancellationToken.None);
+
+            _pendingPreview = null;
+            _pendingMove = null;
+            await ReloadAsync();
+        }
+        catch (DraftRevisionConflictException ex)
+        {
+            _pendingPreview = null;
+            _pendingMove = null;
+            _conflictMessage = ex.Message;
+        }
+        finally { _committing = false; }
+    }
+
+    private async Task ReloadAfterConflict()
+    {
+        _conflictMessage = null;
+        await ReloadAsync();
+    }
 }