bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-13 06:43:35 +00:00
Code Issues Releases Wiki Activity

[PM-10424][PM-10425] Extension Refresh - Copy success toast (#10353)

Browse Source 
* add option to pass toast variant into copy-click directive

* refactor copy toast to use success variant

* add tests for copy-click directive

* swap `success` to be the default toast variant
This commit is contained in:
Nick Krantz
2024-08-01 09:24:07 -05:00
committed by GitHub
parent 0738495dee
commit ffc9022f54
2 changed files with 119 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
libs/angular/src/directives/copy-click.directive.ts
View File

@@ -1,14 +1,17 @@
import { coerceBooleanProperty } from "@angular/cdk/coercion";
import { Directive, HostListener, Input } from "@angular/core";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
import { ToastService } from "@bitwarden/components";
import { ToastVariant } from "@bitwarden/components/src/toast/toast.component";
@Directive({
selector: "[appCopyClick]",
})
export class CopyClickDirective {
private _showToast = false;
private toastVariant: ToastVariant = "success";
constructor(
private platformUtilsService: PlatformUtilsService,
private toastService: ToastService,
@@ -16,14 +19,36 @@ export class CopyClickDirective {
) {}
@Input("appCopyClick") valueToCopy = "";
@Input({ transform: coerceBooleanProperty }) showToast?: boolean;
/**
* When set without a value, a success toast will be shown when the value is copied
* @example
* ```html
* <app-component [appCopyClick]="value to copy" showToast/></app-component>
* ```
* When set with a value, a toast with the specified variant will be shown when the value is copied
*
* @example
* ```html
* <app-component [appCopyClick]="value to copy" showToast="info"/></app-component>
* ```
*/
@Input() set showToast(value: ToastVariant | "") {
// When the `showToast` is set without a value, an empty string will be passed
if (value === "") {
this._showToast = true;
} else {
this._showToast = true;
this.toastVariant = value;
}
}
@HostListener("click") onClick() {
this.platformUtilsService.copyToClipboard(this.valueToCopy);
if (this.showToast) {
if (this._showToast) {
this.toastService.showToast({
variant: "info",
variant: this.toastVariant,
title: null,
message: this.i18nService.t("copySuccessful"),
});