diff --git a/tabby-settings/src/components/showSecretModal.component.pug b/tabby-settings/src/components/showSecretModal.component.pug new file mode 100644 index 0000000000..458b335338 --- /dev/null +++ b/tabby-settings/src/components/showSecretModal.component.pug @@ -0,0 +1,15 @@ +h4.modal-header.m-0.pb-0 {{title}} +.modal-body + .input-group.w-100 + input.form-control( + type='text', + [(ngModel)]='secret.value', + disabled + ) + button.btn.btn-secondary( + (click)='copySecret()' + ) + i.fas.fa-copy + +.modal-footer + button.btn.btn-primary((click)='close()', translate) Close diff --git a/tabby-settings/src/components/showSecretModal.component.ts b/tabby-settings/src/components/showSecretModal.component.ts new file mode 100644 index 0000000000..eb48213ec8 --- /dev/null +++ b/tabby-settings/src/components/showSecretModal.component.ts @@ -0,0 +1,27 @@ +import { Component, Input } from '@angular/core' +import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap' +import { NotificationsService, VaultFileSecret } from 'tabby-core' + +/** @hidden */ +@Component({ + templateUrl: './showSecretModal.component.pug', +}) +export class ShowSecretModalComponent { + @Input() title: string + @Input() secret: VaultFileSecret + + constructor ( + public modalInstance: NgbActiveModal, + private notifications: NotificationsService, + ) { } + + close (): void { + this.modalInstance.dismiss() + } + + copySecret (): void { + navigator.clipboard.writeText(this.secret.value) + // Show a notification + this.notifications.info('Copied to clipboard') + } +} diff --git a/tabby-settings/src/components/vaultSettingsTab.component.pug b/tabby-settings/src/components/vaultSettingsTab.component.pug index 02886e4e24..cce4d9ff1f 100644 --- a/tabby-settings/src/components/vaultSettingsTab.component.pug +++ b/tabby-settings/src/components/vaultSettingsTab.component.pug @@ -32,6 +32,9 @@ div(*ngIf='vault.isEnabled()') button.btn.btn-link(ngbDropdownToggle) i.fas.fa-ellipsis-v div(ngbDropdownMenu) + button(ngbDropdownItem, (click)='showSecret(secret)') + i.fas.fa-fw.fa-eye + span(translate) Show button( ngbDropdownItem, *ngIf='secret.type === VAULT_SECRET_TYPE_FILE', diff --git a/tabby-settings/src/components/vaultSettingsTab.component.ts b/tabby-settings/src/components/vaultSettingsTab.component.ts index 8f81b985e2..9feea2eac7 100644 --- a/tabby-settings/src/components/vaultSettingsTab.component.ts +++ b/tabby-settings/src/components/vaultSettingsTab.component.ts @@ -3,6 +3,7 @@ import { Component, HostBinding } from '@angular/core' import { NgbModal } from '@ng-bootstrap/ng-bootstrap' import { BaseComponent, VaultService, VaultSecret, Vault, PlatformService, ConfigService, VAULT_SECRET_TYPE_FILE, PromptModalComponent, VaultFileSecret, TranslateService } from 'tabby-core' import { SetVaultPassphraseModalComponent } from './setVaultPassphraseModal.component' +import { ShowSecretModalComponent } from './showSecretModal.component' /** @hidden */ @@ -97,6 +98,16 @@ export class VaultSettingsTabComponent extends BaseComponent { return this.translate.instant('Unknown secret of type {type} for {key}', { type: secret.type, key: JSON.stringify(secret.key) }) } + showSecret (secret: VaultSecret) { + if (!this.vaultContents) { + return + } + const modal = this.ngbModal.open(ShowSecretModalComponent) + modal.componentInstance.title = this.getSecretLabel(secret) + modal.componentInstance.secret = secret + + } + removeSecret (secret: VaultSecret) { if (!this.vaultContents) { return diff --git a/tabby-settings/src/index.ts b/tabby-settings/src/index.ts index e6ae3a1e16..d9f0abad38 100644 --- a/tabby-settings/src/index.ts +++ b/tabby-settings/src/index.ts @@ -19,6 +19,7 @@ import { SetVaultPassphraseModalComponent } from './components/setVaultPassphras import { ProfilesSettingsTabComponent } from './components/profilesSettingsTab.component' import { ReleaseNotesComponent } from './components/releaseNotesTab.component' import { ConfigSyncSettingsTabComponent } from './components/configSyncSettingsTab.component' +import { ShowSecretModalComponent } from './components/showSecretModal.component' import { ConfigSyncService } from './services/configSync.service' @@ -61,6 +62,7 @@ import { HotkeySettingsTabProvider, WindowSettingsTabProvider, VaultSettingsTabP WindowSettingsTabComponent, ConfigSyncSettingsTabComponent, ReleaseNotesComponent, + ShowSecretModalComponent, ], }) export default class SettingsModule {