Add support for viewing attachments in emergency access (#814)

src/app/settings/emergency-access-attachments.component.ts

@@ -0,0 +1,34 @@
+import { Component } from '@angular/core';
+
+import { CipherService } from 'jslib/abstractions/cipher.service';
+import { CryptoService } from 'jslib/abstractions/crypto.service';
+import { I18nService } from 'jslib/abstractions/i18n.service';
+import { PlatformUtilsService } from 'jslib/abstractions/platformUtils.service';
+import { UserService } from 'jslib/abstractions/user.service';
+
+import { AttachmentView } from 'jslib/models/view/attachmentView';
+
+import { AttachmentsComponent as BaseAttachmentsComponent } from 'jslib/angular/components/attachments.component';
+
+@Component({
+    selector: 'emergency-access-attachments',
+    templateUrl: '../vault/attachments.component.html',
+})
+export class EmergencyAccessAttachmentsComponent extends BaseAttachmentsComponent {
+    viewOnly = true;
+    canAccessAttachments = true;
+
+    constructor(cipherService: CipherService, i18nService: I18nService,
+        cryptoService: CryptoService, userService: UserService,
+        platformUtilsService: PlatformUtilsService) {
+        super(cipherService, i18nService, cryptoService, userService, platformUtilsService, window);
+    }
+
+    protected async init() {
+        // Do nothing since cipher is already decoded
+    }
+
+    protected showFixOldAttachments(attachment: AttachmentView) {
+        return false;
+    }
+}

src/app/settings/emergency-access-view.component.html

@@ -23,9 +23,25 @@
                         <br>
                         <small>{{c.subTitle}}</small>
                     </td>
+                    <td class="table-list-options">
+                        <div class="dropdown" appListDropdown *ngIf="c.hasAttachments">
+                            <button class="btn btn-outline-secondary dropdown-toggle" type="button" id="dropdownMenuButton"
+                                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
+                                appA11yTitle="{{'options' | i18n}}">
+                                <i class="fa fa-cog fa-lg" aria-hidden="true"></i>
+                            </button>
+                            <div class="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownMenuButton">
+                                <a class="dropdown-item" href="#" appStopClick (click)="viewAttachments(c)">
+                                    <i class="fa fa-fw fa-paperclip" aria-hidden="true"></i>
+                                    {{'attachments' | i18n}}
+                                </a>
+                            </div>
+                        </div>
+                    </td>
                 </tr>
             </tbody>
         </table>
     </ng-container>
 </div>
 <ng-template #cipherAddEdit></ng-template>
+<ng-template #attachments></ng-template>

src/app/settings/emergency-access-view.component.ts

@@ -18,6 +18,7 @@ import { CipherView } from 'jslib/models/view/cipherView';
 
 import { ModalComponent } from '../modal.component';
 
+import { EmergencyAccessAttachmentsComponent } from './emergency-access-attachments.component';
 import { EmergencyAddEditComponent } from './emergency-add-edit.component';
 
 @Component({
@@ -26,6 +27,7 @@ import { EmergencyAddEditComponent } from './emergency-add-edit.component';
 })
 export class EmergencyAccessViewComponent implements OnInit {
     @ViewChild('cipherAddEdit', { read: ViewContainerRef, static: true }) cipherAddEditModalRef: ViewContainerRef;
+    @ViewChild('attachments', { read: ViewContainerRef, static: true }) attachmentsModalRef: ViewContainerRef;
 
     id: string;
     ciphers: CipherView[] = [];
@@ -72,6 +74,22 @@ export class EmergencyAccessViewComponent implements OnInit {
         this.ciphers = await this.getAllCiphers(response);
     }
 
+    async viewAttachments(cipher: CipherView) {
+        if (this.modal != null) {
+            this.modal.close();
+        }
+
+        const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
+        this.modal = this.attachmentsModalRef.createComponent(factory).instance;
+        const childComponent = this.modal.show<EmergencyAccessAttachmentsComponent>(EmergencyAccessAttachmentsComponent, this.attachmentsModalRef);
+
+        childComponent.cipher = cipher;
+
+        this.modal.onClosed.subscribe(async () => {
+            this.modal = null;
+        });
+    }
+
     protected async getAllCiphers(response: EmergencyAccessViewResponse): Promise<CipherView[]> {
         const ciphers = response.ciphers;