Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-10-22 07:50:04 +02:00
Code Issues Projects Releases Wiki Activity

fix username options and service box display crosstalk

Browse Source
This commit is contained in:
✨ Audrey ✨ 2024-10-17 16:13:55 -04:00
parent 0cb3e809dd
commit e496798867
No known key found for this signature in database
GPG Key ID: 0CF8B4C0D9088B97
3 changed files with 31 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
libs/tools/generator/components/src/credential-generator.component.html
View File

@ -32,13 +32,13 @@
</bit-card>
<tools-password-settings
class="tw-mt-6"
*ngIf="(algorithm$ | async)?.id === 'password'"
*ngIf="(showAlgorithm$ | async)?.id === 'password'"
[userId]="userId$ | async"
(onUpdated)="generate$.next()"
/>
<tools-passphrase-settings
class="tw-mt-6"
*ngIf="(algorithm$ | async)?.id === 'passphrase'"
*ngIf="(showAlgorithm$ | async)?.id === 'passphrase'"
[userId]="userId$ | async"
(onUpdated)="generate$.next()"
/>
@ -57,29 +57,29 @@
}}</bit-hint>
</bit-form-field>
</form>
<form *ngIf="!!(showForwarder$ | async)" [formGroup]="forwarder" class="box tw-container">
<form *ngIf="showForwarder$ | async" [formGroup]="forwarder" class="box tw-container">
<bit-form-field>
<bit-label>{{ "service" | i18n }}</bit-label>
<bit-select [items]="forwarderOptions$ | async" formControlName="nav"> </bit-select>
</bit-form-field>
</form>
<tools-catchall-settings
*ngIf="(algorithm$ | async)?.id === 'catchall'"
*ngIf="(showAlgorithm$ | async)?.id === 'catchall'"
[userId]="userId$ | async"
(onUpdated)="generate$.next()"
/>
<tools-forwarder-settings
*ngIf="!!(showForwarder$ | async)"
*ngIf="!!(forwarderId$ | async)"
[forwarder]="forwarderId$ | async"
[userId]="this.userId$ | async"
/>
<tools-subaddress-settings
*ngIf="(algorithm$ | async)?.id === 'subaddress'"
*ngIf="(showAlgorithm$ | async)?.id === 'subaddress'"
[userId]="userId$ | async"
(onUpdated)="generate$.next()"
/>
<tools-username-settings
*ngIf="(algorithm$ | async)?.id === 'username'"
*ngIf="(showAlgorithm$ | async)?.id === 'username'"
[userId]="userId$ | async"
(onUpdated)="generate$.next()"
/>

33
libs/tools/generator/components/src/credential-generator.component.ts
View File

@ -2,13 +2,13 @@ import { Component, EventEmitter, Input, NgZone, OnDestroy, OnInit, Output } fro
import { FormBuilder } from "@angular/forms";
import {
BehaviorSubject,
combineLatestWith,
concat,
distinctUntilChanged,
filter,
map,
of,
ReplaySubject,
startWith,
Subject,
switchMap,
takeUntil,
@ -50,8 +50,6 @@ type UsernameNavValue = UsernameAlgorithm | EmailAlgorithm | typeof FORWARDER;
const NONE_SELECTED = "none";
type ForwarderNavValue = ForwarderIntegration | typeof NONE_SELECTED;
const FORWARDER_INITIALIZED = new GeneratedCredential("-", null, Date.now());
@Component({
selector: "tools-credential-generator",
templateUrl: "credential-generator.component.html",
@ -184,8 +182,7 @@ export class CredentialGeneratorComponent implements OnInit, OnDestroy {
});
});
// assume the last-visible generator algorithm is the user's preferred one
const preferences = await this.generatorService.preferences({ singleUserId$: this.userId$ });
const username$ = new Subject<{ nav: UsernameNavValue }>();
this.root$
.pipe(
filter(({ nav }) => !!nav),
@ -196,6 +193,14 @@ export class CredentialGeneratorComponent implements OnInit, OnDestroy {
return of(maybeAlgorithm as { nav: CredentialAlgorithm });
}
}),
takeUntil(this.destroyed),
)
.subscribe(username$);
// assume the last-visible generator algorithm is the user's preferred one
const preferences = await this.generatorService.preferences({ singleUserId$: this.userId$ });
username$
.pipe(
switchMap((maybeAlgorithm) => {
if (maybeAlgorithm.nav === FORWARDER) {
return concat(of(this.forwarder.value), this.forwarder.valueChanges);
@ -229,19 +234,23 @@ export class CredentialGeneratorComponent implements OnInit, OnDestroy {
} else if (isPasswordAlgorithm(algorithm)) {
setPreference("password");
} else {
this.showForwarder$.next(false);
return;
}
preferences.next(preference);
});
this.username.valueChanges
username$
.pipe(
map(({ nav }) => nav === FORWARDER),
takeUntil(this.destroyed),
)
.subscribe(this.showForwarder$);
.subscribe((showForwarder) => {
if (showForwarder) {
this.value$.next("-");
}
this.showForwarder$.next(showForwarder);
});
// populate the form with the user's preferences to kick off interactivity
preferences.pipe(takeUntil(this.destroyed)).subscribe(({ email, username, password }) => {
@ -317,8 +326,7 @@ export class CredentialGeneratorComponent implements OnInit, OnDestroy {
const forwarder = getForwarderConfiguration(type.forwarder);
const configuration = toCredentialGeneratorConfiguration(forwarder);
const generator = this.generatorService.generate$(configuration, dependencies);
return generator.pipe(startWith(FORWARDER_INITIALIZED));
return generator;
}
throw new Error(`Invalid generator type: "${type}"`);
@ -342,6 +350,11 @@ export class CredentialGeneratorComponent implements OnInit, OnDestroy {
/** tracks the currently selected credential type */
protected algorithm$ = new ReplaySubject<AlgorithmInfo>(1);
protected showAlgorithm$ = this.algorithm$.pipe(
combineLatestWith(this.showForwarder$),
map(([algorithm, showForwarder]) => (showForwarder ? null : algorithm)),
);
/** Emits hint key for the currently selected credential type */
protected credentialTypeHint$ = new ReplaySubject<string>(1);

2
libs/tools/generator/core/src/data/integrations.ts
View File

@ -30,7 +30,7 @@ const integrations = new Map(Object.values(Integrations).map((i) => [i.id, i]));
export function getForwarderConfiguration(id: IntegrationId): ForwarderConfiguration<ApiSettings> {
const maybeForwarder = integrations.get(id);
if ("forwarder" in maybeForwarder) {
if (maybeForwarder && "forwarder" in maybeForwarder) {
return maybeForwarder as ForwarderConfiguration<ApiSettings>;
} else {
return null;