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

[CL-850] Remove anon layout default icon and require either icon or no icon (#16433)

Browse Source
This commit is contained in:
Vicki League
2025-10-20 14:07:48 -04:00
committed by GitHub
parent 22eb49aed1
commit d2c6757626
24 changed files with 129 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/browser/src/dirt/phishing-detection/pages/phishing-warning.stories.ts
View File

@@ -87,7 +87,7 @@ export default {
props: args,
template: /*html*/ `
<auth-anon-layout
[hideIcon]="true"
[icon]="null"
[hideBackgroundIllustration]="true"
>
<dirt-phishing-warning></dirt-phishing-warning>

11
apps/browser/src/popup/app-routing.module.ts
View File

@@ -23,6 +23,7 @@ import {
UserLockIcon,
VaultIcon,
LockIcon,
DomainIcon,
TwoFactorAuthSecurityKeyIcon,
} from "@bitwarden/assets/svg";
import {
@@ -565,6 +566,8 @@ const routes: Routes = [
key: "verifyYourIdentity",
},
showBackButton: true,
// `TwoFactorAuthComponent` manually sets its icon based on the 2fa type
pageIcon: null,
} satisfies RouteDataProperties & ExtensionAnonLayoutWrapperData,
},
{
@@ -572,6 +575,7 @@ const routes: Routes = [
data: {
elevation: 1,
hideFooter: true,
pageIcon: LockIcon,
} satisfies RouteDataProperties & ExtensionAnonLayoutWrapperData,
children: [
{
@@ -617,9 +621,9 @@ const routes: Routes = [
path: "",
component: IntroCarouselComponent,
data: {
hideIcon: true,
pageIcon: null,
hideFooter: true,
},
} satisfies ExtensionAnonLayoutWrapperData,
},
],
},
@@ -637,6 +641,7 @@ const routes: Routes = [
key: "confirmKeyConnectorDomain",
},
showBackButton: true,
pageIcon: DomainIcon,
} satisfies ExtensionAnonLayoutWrapperData,
},
],
@@ -722,7 +727,7 @@ const routes: Routes = [
},
],
data: {
hideIcon: true,
pageIcon: null,
hideBackgroundIllustration: true,
showReadonlyHostname: true,
} satisfies AnonLayoutWrapperData,

8
apps/browser/src/popup/components/extension-anon-layout-wrapper/extension-anon-layout-wrapper-data.service.ts
View File

@@ -11,13 +11,15 @@ export class ExtensionAnonLayoutWrapperDataService
extends DefaultAnonLayoutWrapperDataService
implements AnonLayoutWrapperDataService
{
protected override anonLayoutWrapperDataSubject = new Subject<ExtensionAnonLayoutWrapperData>();
protected override anonLayoutWrapperDataSubject = new Subject<
Partial<ExtensionAnonLayoutWrapperData>
>();
override setAnonLayoutWrapperData(data: ExtensionAnonLayoutWrapperData): void {
override setAnonLayoutWrapperData(data: Partial<ExtensionAnonLayoutWrapperData>): void {
this.anonLayoutWrapperDataSubject.next(data);
}
override anonLayoutWrapperData$(): Observable<ExtensionAnonLayoutWrapperData> {
override anonLayoutWrapperData$(): Observable<Partial<ExtensionAnonLayoutWrapperData>> {
return this.anonLayoutWrapperDataSubject.asObservable();
}
}

1
apps/browser/src/popup/components/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html
View File

@@ -23,7 +23,6 @@
[hideLogo]="true"
[maxWidth]="maxWidth"
[hideFooter]="hideFooter"
[hideIcon]="hideIcon"
[hideCardWrapper]="hideCardWrapper"
>
<router-outlet></router-outlet>

11
apps/browser/src/popup/components/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts
View File

@@ -27,7 +27,6 @@ export interface ExtensionAnonLayoutWrapperData extends AnonLayoutWrapperData {
showBackButton?: boolean;
showLogo?: boolean;
hideFooter?: boolean;
hideIcon?: boolean;
}
@Component({
@@ -50,7 +49,6 @@ export class ExtensionAnonLayoutWrapperComponent implements OnInit, OnDestroy {
protected showAcctSwitcher: boolean;
protected showBackButton: boolean;
protected showLogo: boolean = true;
protected hideIcon: boolean = false;
protected pageTitle: string;
protected pageSubtitle: string;
@@ -134,10 +132,6 @@ export class ExtensionAnonLayoutWrapperComponent implements OnInit, OnDestroy {
this.showLogo = Boolean(firstChildRouteData["showLogo"]);
}
if (firstChildRouteData["hideIcon"] !== undefined) {
this.hideIcon = Boolean(firstChildRouteData["hideIcon"]);
}
if (firstChildRouteData["hideCardWrapper"] !== undefined) {
this.hideCardWrapper = Boolean(firstChildRouteData["hideCardWrapper"]);
}
@@ -196,10 +190,6 @@ export class ExtensionAnonLayoutWrapperComponent implements OnInit, OnDestroy {
if (data.showLogo !== undefined) {
this.showLogo = data.showLogo;
}
if (data.hideIcon !== undefined) {
this.hideIcon = data.hideIcon;
}
}
private handleStringOrTranslation(value: string | Translation): string {
@@ -222,7 +212,6 @@ export class ExtensionAnonLayoutWrapperComponent implements OnInit, OnDestroy {
this.showLogo = null;
this.maxWidth = null;
this.hideFooter = null;
this.hideIcon = null;
this.hideCardWrapper = null;
}

10
apps/browser/src/popup/components/extension-anon-layout-wrapper/extension-anon-layout-wrapper.stories.ts
View File

@@ -208,7 +208,9 @@ export const DefaultContentExample: Story = {
children: [
{
path: "default-example",
data: {},
data: {
pageIcon: LockIcon,
} satisfies ExtensionAnonLayoutWrapperData,
children: [
{
path: "",
@@ -244,7 +246,6 @@ const initialData: ExtensionAnonLayoutWrapperData = {
showAcctSwitcher: true,
showBackButton: true,
showLogo: true,
hideIcon: false,
};
const changedData: ExtensionAnonLayoutWrapperData = {
@@ -258,7 +259,6 @@ const changedData: ExtensionAnonLayoutWrapperData = {
showAcctSwitcher: false,
showBackButton: false,
showLogo: false,
hideIcon: false,
};
@Component({
@@ -337,9 +337,9 @@ export const HasLoggedInAccountExample: Story = {
{
path: "has-logged-in-account",
data: {
hasLoggedInAccount: true,
showAcctSwitcher: true,
},
pageIcon: LockIcon,
} satisfies ExtensionAnonLayoutWrapperData,
children: [
{
path: "",

8
apps/desktop/src/app/app-routing.module.ts
View File

@@ -21,6 +21,7 @@ import {
UserLockIcon,
VaultIcon,
LockIcon,
DomainIcon,
} from "@bitwarden/assets/svg";
import {
LoginComponent,
@@ -289,6 +290,8 @@ const routes: Routes = [
pageTitle: {
key: "verifyYourIdentity",
},
// `TwoFactorAuthComponent` manually sets its icon based on the 2fa type
pageIcon: null,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
},
{
@@ -297,12 +300,16 @@ const routes: Routes = [
component: SetInitialPasswordComponent,
data: {
maxWidth: "lg",
pageIcon: LockIcon,
} satisfies AnonLayoutWrapperData,
},
{
path: "change-password",
component: ChangePasswordComponent,
canActivate: [authGuard],
data: {
pageIcon: LockIcon,
} satisfies AnonLayoutWrapperData,
},
{
path: "confirm-key-connector-domain",
@@ -312,6 +319,7 @@ const routes: Routes = [
pageTitle: {
key: "confirmKeyConnectorDomain",
},
pageIcon: DomainIcon,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
},
],

22
apps/web/src/app/oss-routing.module.ts
View File

@@ -24,6 +24,11 @@ import {
SsoKeyIcon,
LockIcon,
BrowserExtensionIcon,
ActiveSendIcon,
TwoFactorAuthAuthenticatorIcon,
AccountWarning,
BusinessWelcome,
DomainIcon,
} from "@bitwarden/assets/svg";
import {
PasswordHintComponent,
@@ -295,6 +300,7 @@ const routes: Routes = [
key: "viewSend",
},
showReadonlyHostname: true,
pageIcon: ActiveSendIcon,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
children: [
{
@@ -314,6 +320,7 @@ const routes: Routes = [
component: SetInitialPasswordComponent,
data: {
maxWidth: "lg",
pageIcon: LockIcon,
} satisfies AnonLayoutWrapperData,
},
{
@@ -379,6 +386,8 @@ const routes: Routes = [
pageTitle: {
key: "verifyYourIdentity",
},
// `TwoFactorAuthComponent` manually sets its icon based on the 2fa type
pageIcon: null,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
},
{
@@ -439,6 +448,7 @@ const routes: Routes = [
key: "recoverAccountTwoStep",
},
titleId: "recoverAccountTwoStep",
pageIcon: TwoFactorAuthAuthenticatorIcon,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
},
{
@@ -469,6 +479,7 @@ const routes: Routes = [
},
titleId: "acceptEmergency",
doNotSaveUrl: false,
pageIcon: VaultIcon,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
children: [
{
@@ -488,6 +499,7 @@ const routes: Routes = [
key: "deleteAccount",
},
titleId: "deleteAccount",
pageIcon: AccountWarning,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
children: [
{
@@ -509,6 +521,7 @@ const routes: Routes = [
key: "deleteAccount",
},
titleId: "deleteAccount",
pageIcon: AccountWarning,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
children: [
{
@@ -526,6 +539,7 @@ const routes: Routes = [
key: "removeMasterPassword",
},
titleId: "removeMasterPassword",
pageIcon: LockIcon,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
},
{
@@ -537,6 +551,7 @@ const routes: Routes = [
key: "confirmKeyConnectorDomain",
},
titleId: "confirmKeyConnectorDomain",
pageIcon: DomainIcon,
} satisfies RouteDataProperties & AnonLayoutWrapperData,
},
{
@@ -548,6 +563,7 @@ const routes: Routes = [
},
data: {
maxWidth: "3xl",
pageIcon: BusinessWelcome,
} satisfies AnonLayoutWrapperData,
},
{
@@ -559,6 +575,7 @@ const routes: Routes = [
},
data: {
maxWidth: "3xl",
pageIcon: BusinessWelcome,
} satisfies AnonLayoutWrapperData,
},
{
@@ -582,12 +599,15 @@ const routes: Routes = [
path: "change-password",
component: ChangePasswordComponent,
canActivate: [authGuard],
data: {
pageIcon: LockIcon,
} satisfies AnonLayoutWrapperData,
},
{
path: "setup-extension",
data: {
hideCardWrapper: true,
hideIcon: true,
pageIcon: null,
maxWidth: "4xl",
} satisfies AnonLayoutWrapperData,
children: [

12
apps/web/src/app/tools/send/send-access/access.component.html
View File

@@ -11,12 +11,12 @@
(setPasswordEvent)="setPassword($event)"
*ngIf="passwordRequired && !error"
></app-send-access-password>
<bit-no-items [icon]="sendIcon" class="tw-text-main" *ngIf="unavailable">
<ng-container slot="description">{{ "sendAccessUnavailable" | i18n }}</ng-container>
</bit-no-items>
<bit-no-items [icon]="sendIcon" class="tw-text-main" *ngIf="error">
<ng-container slot="description">{{ "unexpectedErrorSend" | i18n }}</ng-container>
</bit-no-items>
<div class="tw-text-main tw-text-center" *ngIf="unavailable">
<p bitTypography="body1">{{ "sendAccessUnavailable" | i18n }}</p>
</div>
<div class="tw-text-main tw-text-center" *ngIf="error">
<p bitTypography="body1">{{ "unexpectedErrorSend" | i18n }}</p>
</div>
<div *ngIf="!passwordRequired && send && !error && !unavailable">
<p class="tw-text-center">
<b>{{ send.name }}</b>

5
apps/web/src/app/tools/send/send-access/access.component.ts
View File

@@ -4,7 +4,6 @@ import { Component, OnInit } from "@angular/core";
import { FormBuilder } from "@angular/forms";
import { ActivatedRoute } from "@angular/router";
import { ActiveSendIcon } from "@bitwarden/assets/svg";
import { CryptoFunctionService } from "@bitwarden/common/key-management/crypto/abstractions/crypto-function.service";
import { ErrorResponse } from "@bitwarden/common/models/response/error.response";
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
@@ -17,7 +16,7 @@ import { SendAccessResponse } from "@bitwarden/common/tools/send/models/response
import { SendAccessView } from "@bitwarden/common/tools/send/models/view/send-access.view";
import { SEND_KDF_ITERATIONS } from "@bitwarden/common/tools/send/send-kdf";
import { SendApiService } from "@bitwarden/common/tools/send/services/send-api.service.abstraction";
import { AnonLayoutWrapperDataService, NoItemsModule, ToastService } from "@bitwarden/components";
import { AnonLayoutWrapperDataService, ToastService } from "@bitwarden/components";
import { KeyService } from "@bitwarden/key-management";
import { SharedModule } from "../../../shared";
@@ -34,7 +33,6 @@ import { SendAccessTextComponent } from "./send-access-text.component";
SendAccessTextComponent,
SendAccessPasswordComponent,
SharedModule,
NoItemsModule,
],
})
export class AccessComponent implements OnInit {
@@ -49,7 +47,6 @@ export class AccessComponent implements OnInit {
protected hideEmail = false;
protected decKey: SymmetricCryptoKey;
protected accessRequest: SendAccessRequest;
protected sendIcon = ActiveSendIcon;
protected formGroup = this.formBuilder.group({});

1
apps/web/src/app/vault/components/setup-extension/setup-extension.component.spec.ts
View File

@@ -138,7 +138,6 @@ describe("SetupExtensionComponent", () => {
key: "somethingWentWrong",
},
pageIcon: BrowserExtensionIcon,
hideIcon: false,
hideCardWrapper: false,
maxWidth: "md",
});

1
apps/web/src/app/vault/components/setup-extension/setup-extension.component.ts
View File

@@ -164,7 +164,6 @@ export class SetupExtensionComponent implements OnInit, OnDestroy {
key: "somethingWentWrong",
},
pageIcon: BrowserExtensionIcon,
hideIcon: false,
hideCardWrapper: false,
maxWidth: "md",
});