Move to dialogs

src-ui/src/app/components/document-detail/document-detail.component.html

@@ -81,9 +81,21 @@
     (added)="addField($event)">
   </pngx-custom-fields-dropdown>
 
-  <pngx-share-links-dropdown [documentId]="documentId" [hasArchiveVersion]="!!document?.archived_file_name" [disabled]="!userCanEdit && !userIsOwner" *pngxIfPermissions="{ action: PermissionAction.Add, type: PermissionType.ShareLink }"></pngx-share-links-dropdown>
 
-  <pngx-email-document-dropdown [documentId]="documentId" [disabled]="!userCanEdit && !userIsOwner"></pngx-email-document-dropdown>
+  <div class="ms-auto" ngbDropdown>
+    <button class="btn btn-sm btn-outline-primary" id="sendDropdown" ngbDropdownToggle [disabled]="!userCanEdit || !userIsOwner">
+      <i-bs name="send"></i-bs>
+      <div class="d-none d-sm-inline">&nbsp;<ng-container i18n>Send</ng-container></div>
+    </button>
+    <div ngbDropdownMenu aria-labelledby="actionsDropdown" class="shadow">
+      <button ngbDropdownItem (click)="openShareLinks()" [disabled]="!userCanEdit || !userIsOwner" *pngxIfPermissions="{ action: PermissionAction.Add, type: PermissionType.ShareLink }">
+        <i-bs name="link"></i-bs>&nbsp;<span i18n>Share Links</span>
+      </button>
+      <button ngbDropdownItem (click)="openEmailDocument()" [disabled]="!userCanEdit || !userIsOwner">
+        <i-bs name="envelope"></i-bs>&nbsp;<span i18n>Email</span>
+      </button>
+    </div>
+  </div>
 
 </pngx-page-header>
 

src-ui/src/app/components/document-detail/document-detail.component.spec.ts

@@ -1330,4 +1330,13 @@ describe('DocumentDetailComponent', () => {
     expect(createSpy).toHaveBeenCalledWith('a')
     expect(urlRevokeSpy).toHaveBeenCalled()
   })
+
+  it('should support open share links and email modals', () => {
+    const modalSpy = jest.spyOn(modalService, 'open')
+    initNormally()
+    component.openShareLinks()
+    expect(modalSpy).toHaveBeenCalled()
+    component.openEmailDocument()
+    expect(modalSpy).toHaveBeenCalled()
+  })
 })

src-ui/src/app/components/document-detail/document-detail.component.ts

@@ -88,7 +88,7 @@ import { CorrespondentEditDialogComponent } from '../common/edit-dialog/correspo
 import { DocumentTypeEditDialogComponent } from '../common/edit-dialog/document-type-edit-dialog/document-type-edit-dialog.component'
 import { EditDialogMode } from '../common/edit-dialog/edit-dialog.component'
 import { StoragePathEditDialogComponent } from '../common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component'
-import { EmailDocumentDropdownComponent } from '../common/email-document-dropdown/email-document-dropdown.component'
+import { EmailDocumentDialogComponent } from '../common/email-document-dialog/email-document-dialog.component'
 import { CheckComponent } from '../common/input/check/check.component'
 import { DateComponent } from '../common/input/date/date.component'
 import { DocumentLinkComponent } from '../common/input/document-link/document-link.component'
@@ -100,7 +100,7 @@ import { TagsComponent } from '../common/input/tags/tags.component'
 import { TextComponent } from '../common/input/text/text.component'
 import { UrlComponent } from '../common/input/url/url.component'
 import { PageHeaderComponent } from '../common/page-header/page-header.component'
-import { ShareLinksDropdownComponent } from '../common/share-links-dropdown/share-links-dropdown.component'
+import { ShareLinksDialogComponent } from '../common/share-links-dialog/share-links-dialog.component'
 import { DocumentHistoryComponent } from '../document-history/document-history.component'
 import { DocumentNotesComponent } from '../document-notes/document-notes.component'
 import { ComponentWithPermissions } from '../with-permissions/with-permissions.component'
@@ -146,8 +146,6 @@ export enum ZoomSetting {
     CustomFieldsDropdownComponent,
     DocumentNotesComponent,
     DocumentHistoryComponent,
-    ShareLinksDropdownComponent,
-    EmailDocumentDropdownComponent,
     CheckComponent,
     DateComponent,
     DocumentLinkComponent,
@@ -1428,6 +1426,22 @@ export class DocumentDetailComponent
       })
   }
 
+  public openShareLinks() {
+    const modal = this.modalService.open(ShareLinksDialogComponent)
+    modal.componentInstance.documentId = this.document.id
+    modal.componentInstance.hasArchiveVersion =
+      !!this.document?.archived_file_name
+  }
+
+  public openEmailDocument() {
+    const modal = this.modalService.open(EmailDocumentDialogComponent, {
+      backdrop: 'static',
+    })
+    modal.componentInstance.documentId = this.document.id
+    modal.componentInstance.hasArchiveVersion =
+      !!this.document?.archived_file_name
+  }
+
   private tryRenderTiff() {
     this.http.get(this.previewUrl, { responseType: 'arraybuffer' }).subscribe({
       next: (res) => {