1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-17 16:53:34 +00:00

[PM-18804] generator nudges (#14705)

* added generator spotlight to credential generator component

* moved generator spotlight to browser component and add as slot in libs. update copy for send

* added an aria label for the generator nudge body content

* new copy and styles for browser send will be behind feature flag

* update featureflag call to observable in send-v2

* changed how nudge text is made in credential generator

* added new observable to vault nudges to return specific boolean. Update naming of vault types. update observable calls in credential-generator and send-v2

* update send-v2 and credential generator to use new renamed nudges

* update to create nudge generator spotlight component. using this inside the credential generator for nudge spotlight

* fix imports for Nudge related code

* add libs/angular to storybook

---------

Co-authored-by: Nick Krantz <nick@livefront.com>
This commit is contained in:
Jason Ng
2025-05-21 13:46:02 -04:00
committed by GitHub
parent cf7da2ebdc
commit fd10a26df9
20 changed files with 139 additions and 30 deletions

View File

@@ -0,0 +1,38 @@
import { AsyncPipe, CommonModule } from "@angular/common";
import { Component } from "@angular/core";
import { firstValueFrom, Observable, switchMap } from "rxjs";
import { NudgesService, NudgeType } from "@bitwarden/angular/vault";
import { SpotlightComponent } from "@bitwarden/angular/vault/components/spotlight/spotlight.component";
import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
import { getUserId } from "@bitwarden/common/auth/services/account.service";
import { UserId } from "@bitwarden/common/types/guid";
import { TypographyModule } from "@bitwarden/components";
import { I18nPipe } from "@bitwarden/ui-common";
@Component({
standalone: true,
selector: "nudge-generator-spotlight",
templateUrl: "nudge-generator-spotlight.component.html",
imports: [I18nPipe, SpotlightComponent, AsyncPipe, CommonModule, TypographyModule],
})
export class NudgeGeneratorSpotlightComponent {
protected readonly NudgeType = NudgeType;
private activeUserId$ = this.accountService.activeAccount$.pipe(getUserId);
protected showGeneratorSpotlight$: Observable<boolean> = this.activeUserId$.pipe(
switchMap((userId) =>
this.nudgesService.showNudgeSpotlight$(NudgeType.GeneratorNudgeStatus, userId),
),
);
constructor(
private nudgesService: NudgesService,
private accountService: AccountService,
) {}
async dismissGeneratorSpotlight(type: NudgeType) {
const activeUserId = await firstValueFrom(this.activeUserId$);
await this.nudgesService.dismissNudge(type, activeUserId as UserId);
}
}