From b5413525c47c086a1e90f73513e751cc98cbbfe0 Mon Sep 17 00:00:00 2001
From: shamoon <4887959+shamoon@users.noreply.github.com>
Date: Sun, 18 Jan 2026 12:25:12 -0800
Subject: [PATCH] Ok lets make duplicates a tab, nice

---
 .../document-detail.component.html            | 44 +++++++++++--------
 .../document-detail.component.spec.ts         |  6 +--
 .../document-detail.component.ts              |  8 ++++
 3 files changed, 37 insertions(+), 21 deletions(-)

diff --git a/src-ui/src/app/components/document-detail/document-detail.component.html b/src-ui/src/app/components/document-detail/document-detail.component.html
index baba74d25..43935a570 100644
--- a/src-ui/src/app/components/document-detail/document-detail.component.html
+++ b/src-ui/src/app/components/document-detail/document-detail.component.html
@@ -145,24 +145,6 @@
           <a ngbNavLink i18n>Details</a>
           <ng-template ngbNavContent>
             <div>
-              @if (document?.duplicate_documents?.length) {
-                <div class="alert alert-warning">
-                  <div class="fw-semibold" i18n>Duplicate content detected.</div>
-                  <ul class="mb-0 mt-2">
-                    @for (duplicate of document.duplicate_documents; track duplicate.id) {
-                      <li>
-                        <button
-                          type="button"
-                          class="btn btn-link p-0 align-baseline"
-                          (click)="openDuplicateDocument(duplicate.id)"
-                        >
-                          {{ duplicate.title }}
-                        </button>
-                      </li>
-                    }
-                  </ul>
-                </div>
-              }
               <pngx-input-text #inputTitle i18n-title title="Title" formControlName="title" [horizontal]="true" [suggestion]="suggestions?.title" (keyup)="titleKeyUp($event)" [error]="error?.title"></pngx-input-text>
               <pngx-input-number i18n-title title="Archive serial number" [error]="error?.archive_serial_number" [horizontal]="true" formControlName='archive_serial_number'></pngx-input-number>
               <pngx-input-date i18n-title title="Date created" formControlName="created" [suggestions]="suggestions?.dates" [showFilter]="true" [horizontal]="true" (filterDocuments)="filterDocuments($event)"
@@ -388,6 +370,32 @@
             </ng-template>
           </li>
         }
+
+        @if (document?.duplicate_documents?.length) {
+          <li [ngbNavItem]="DocumentDetailNavIDs.Duplicates">
+            <a class="text-nowrap" ngbNavLink i18n>
+              Duplicates
+              <span class="badge text-bg-secondary ms-1">{{ document.duplicate_documents.length }}</span>
+            </a>
+            <ng-template ngbNavContent>
+              <div class="d-flex flex-column gap-2">
+                <div class="fst-italic" i18n>Duplicate documents detected:</div>
+                <div class="list-group">
+                  @for (duplicate of document.duplicate_documents; track duplicate.id) {
+                    <button
+                      type="button"
+                      class="list-group-item list-group-item-action d-flex justify-content-between align-items-center"
+                      (click)="openDuplicateDocument(duplicate.id)"
+                    >
+                      <span>{{ duplicate.title || ('#' + duplicate.id) }}</span>
+                      <span class="text-secondary">#{{ duplicate.id }}</span>
+                    </button>
+                  }
+                </div>
+              </div>
+            </ng-template>
+          </li>
+        }
       </ul>
 
       <div [ngbNavOutlet]="nav" class="mt-3"></div>
diff --git a/src-ui/src/app/components/document-detail/document-detail.component.spec.ts b/src-ui/src/app/components/document-detail/document-detail.component.spec.ts
index 198e7a7a4..e38d7848d 100644
--- a/src-ui/src/app/components/document-detail/document-detail.component.spec.ts
+++ b/src-ui/src/app/components/document-detail/document-detail.component.spec.ts
@@ -301,16 +301,16 @@ describe('DocumentDetailComponent', () => {
       .spyOn(openDocumentsService, 'openDocument')
       .mockReturnValueOnce(of(true))
     fixture.detectChanges()
-    expect(component.activeNavID).toEqual(5) // DocumentDetailNavIDs.Notes
+    expect(component.activeNavID).toEqual(component.DocumentDetailNavIDs.Notes)
   })
 
   it('should change url on tab switch', () => {
     initNormally()
     const navigateSpy = jest.spyOn(router, 'navigate')
-    component.nav.select(5)
+    component.nav.select(component.DocumentDetailNavIDs.Notes)
     component.nav.navChange.next({
       activeId: 1,
-      nextId: 5,
+      nextId: component.DocumentDetailNavIDs.Notes,
       preventDefault: () => {},
     })
     fixture.detectChanges()
diff --git a/src-ui/src/app/components/document-detail/document-detail.component.ts b/src-ui/src/app/components/document-detail/document-detail.component.ts
index 8ca2585f4..f7db36179 100644
--- a/src-ui/src/app/components/document-detail/document-detail.component.ts
+++ b/src-ui/src/app/components/document-detail/document-detail.component.ts
@@ -124,6 +124,7 @@ enum DocumentDetailNavIDs {
   Notes = 5,
   Permissions = 6,
   History = 7,
+  Duplicates = 8,
 }
 
 enum ContentRenderType {
@@ -704,6 +705,13 @@ export class DocumentDetailComponent
     }
     this.title = this.documentTitlePipe.transform(doc.title)
     this.prepareForm(doc)
+
+    if (
+      this.activeNavID === DocumentDetailNavIDs.Duplicates &&
+      !doc?.duplicate_documents?.length
+    ) {
+      this.activeNavID = DocumentDetailNavIDs.Details
+    }
   }
 
   openDuplicateDocument(documentId: number) {