-
- Download
-
+
@if (metadata?.has_archive_version) {
}
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 0a2e5605f..8b2a84534 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
@@ -24,6 +24,7 @@ import {
NgbModalRef,
} from '@ng-bootstrap/ng-bootstrap'
import { NgxBootstrapIconsModule, allIcons } from 'ngx-bootstrap-icons'
+import { DeviceDetectorService } from 'ngx-device-detector'
import { of, throwError } from 'rxjs'
import { routes } from 'src/app/app-routing.module'
import { Correspondent } from 'src/app/data/correspondent'
@@ -127,6 +128,7 @@ describe('DocumentDetailComponent', () => {
let documentListViewService: DocumentListViewService
let settingsService: SettingsService
let customFieldsService: CustomFieldsService
+ let deviceDetectorService: DeviceDetectorService
let httpTestingController: HttpTestingController
let componentRouterService: ComponentRouterService
@@ -264,6 +266,7 @@ describe('DocumentDetailComponent', () => {
settingsService = TestBed.inject(SettingsService)
settingsService.currentUser = { id: 1 }
customFieldsService = TestBed.inject(CustomFieldsService)
+ deviceDetectorService = TestBed.inject(DeviceDetectorService)
fixture = TestBed.createComponent(DocumentDetailComponent)
httpTestingController = TestBed.inject(HttpTestingController)
componentRouterService = TestBed.inject(ComponentRouterService)
@@ -1268,4 +1271,38 @@ describe('DocumentDetailComponent', () => {
.error(new ErrorEvent('failed'))
expect(component.tiffError).not.toBeUndefined()
})
+
+ it('should support download using share sheet on mobile, direct download otherwise', () => {
+ const shareSpy = jest.spyOn(navigator, 'share')
+ const createSpy = jest.spyOn(document, 'createElement')
+ const urlRevokeSpy = jest.spyOn(URL, 'revokeObjectURL')
+ initNormally()
+
+ // Mobile
+ jest.spyOn(deviceDetectorService, 'isDesktop').mockReturnValue(false)
+ component.download()
+ httpTestingController
+ .expectOne(`${environment.apiBaseUrl}documents/${doc.id}/download/`)
+ .error(new ProgressEvent('failed'))
+ expect(shareSpy).not.toHaveBeenCalled()
+
+ component.download(true)
+ httpTestingController
+ .expectOne(
+ `${environment.apiBaseUrl}documents/${doc.id}/download/?original=true`
+ )
+ .flush(new ArrayBuffer(100))
+ expect(shareSpy).toHaveBeenCalled()
+
+ // Desktop
+ shareSpy.mockClear()
+ jest.spyOn(deviceDetectorService, 'isDesktop').mockReturnValue(true)
+ component.download()
+ httpTestingController
+ .expectOne(`${environment.apiBaseUrl}documents/${doc.id}/download/`)
+ .flush(new ArrayBuffer(100))
+ expect(shareSpy).not.toHaveBeenCalled()
+ expect(createSpy).toHaveBeenCalledWith('a')
+ expect(urlRevokeSpy).toHaveBeenCalled()
+ })
})
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 8d1b35071..0378fbb97 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
@@ -20,6 +20,7 @@ import {
import { dirtyCheck, DirtyComponent } from '@ngneat/dirty-check-forms'
import { PDFDocumentProxy, PdfViewerModule } from 'ng2-pdf-viewer'
import { NgxBootstrapIconsModule } from 'ngx-bootstrap-icons'
+import { DeviceDetectorService } from 'ngx-device-detector'
import { BehaviorSubject, Observable, Subject } from 'rxjs'
import {
debounceTime,
@@ -195,8 +196,6 @@ export class DocumentDetailComponent
previewUrl: string
thumbUrl: string
previewText: string
- downloadUrl: string
- downloadOriginalUrl: string
previewLoaded: boolean = false
tiffURL: string
tiffError: string
@@ -234,6 +233,9 @@ export class DocumentDetailComponent
ogDate: Date
customFields: CustomField[]
+
+ public downloading: boolean = false
+
public readonly CustomFieldDataType = CustomFieldDataType
public readonly ContentRenderType = ContentRenderType
@@ -274,7 +276,8 @@ export class DocumentDetailComponent
private customFieldsService: CustomFieldsService,
private http: HttpClient,
private hotKeyService: HotKeyService,
- private componentRouterService: ComponentRouterService
+ private componentRouterService: ComponentRouterService,
+ private deviceDetectorService: DeviceDetectorService
) {
super()
}
@@ -417,13 +420,6 @@ export class DocumentDetailComponent
.pipe(
switchMap((doc) => {
this.documentId = doc.id
- this.downloadUrl = this.documentsService.getDownloadUrl(
- this.documentId
- )
- this.downloadOriginalUrl = this.documentsService.getDownloadUrl(
- this.documentId,
- true
- )
this.suggestions = null
const openDocument = this.openDocumentService.getOpenDocument(
this.documentId
@@ -978,6 +974,52 @@ export class DocumentDetailComponent
})
}
+ download(original: boolean = false) {
+ this.downloading = true
+ const downloadUrl = this.documentsService.getDownloadUrl(
+ this.documentId,
+ original
+ )
+ this.http.get(downloadUrl, { responseType: 'blob' }).subscribe({
+ next: (blob) => {
+ this.downloading = false
+ const blobParts = [blob]
+ const file = new File(
+ blobParts,
+ original
+ ? this.document.original_file_name
+ : this.document.archived_file_name,
+ {
+ type: original ? this.document.mime_type : 'application/pdf',
+ }
+ )
+ if (
+ !this.deviceDetectorService.isDesktop() &&
+ navigator.canShare &&
+ navigator.canShare({ files: [file] })
+ ) {
+ navigator.share({
+ files: [file],
+ })
+ } else {
+ const url = URL.createObjectURL(blob)
+ const a = document.createElement('a')
+ a.href = url
+ a.download = this.document.title
+ a.click()
+ URL.revokeObjectURL(url)
+ }
+ },
+ error: (error) => {
+ this.downloading = false
+ this.toastService.showError(
+ $localize`Error downloading document`,
+ error
+ )
+ },
+ })
+ }
+
hasNext() {
return this.documentListViewService.hasNext(this.documentId)
}