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

feat(auth): [PM-9723] Refresh LoginViaAuthRequestComponent (#11545)

Browse Source 
Creates a refreshed and consolidated LoginViaAuthRequestComponent for use on all visual clients, which will be used when the UnauthenticatedExtensionUIRefresh feature flag is on.
This commit is contained in:
rr-bw
2024-11-19 14:53:01 -08:00
committed by GitHub
parent 2df8643e29
commit 9429ae1d06
32 changed files with 1025 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
apps/browser/src/_locales/en/messages.json
View File

@@ -3170,12 +3170,27 @@
"resendNotification": {
"message": "Resend notification"
},
"viewAllLogInOptions": {
"message": "View all log in options"
},
"viewAllLoginOptions": {
"message": "View all log in options"
},
"notificationSentDevice": {
"message": "A notification has been sent to your device."
},
"aNotificationWasSentToYourDevice": {
"message": "A notification was sent to your device"
},
"makeSureYourAccountIsUnlockedAndTheFingerprintEtc": {
"message": "Make sure your account is unlocked and the fingerprint phrase matches on the other device"
},
"youWillBeNotifiedOnceTheRequestIsApproved": {
"message": "You will be notified once the request is approved"
},
"needAnotherOptionV1": {
"message": "Need another option?"
},
"loginInitiated": {
"message": "Login initiated"
},

0
apps/browser/src/auth/popup/login-via-auth-request.component.html → apps/browser/src/auth/popup/login-via-auth-request-v1.component.html
View File

6
apps/browser/src/auth/popup/login-via-auth-request.component.ts → apps/browser/src/auth/popup/login-via-auth-request-v1.component.ts
View File

@@ -2,7 +2,7 @@ import { Location } from "@angular/common";
import { Component } from "@angular/core";
import { Router } from "@angular/router";
import { LoginViaAuthRequestComponent as BaseLoginWithDeviceComponent } from "@bitwarden/angular/auth/components/login-via-auth-request.component";
import { LoginViaAuthRequestComponentV1 as BaseLoginViaAuthRequestComponentV1 } from "@bitwarden/angular/auth/components/login-via-auth-request-v1.component";
import {
AuthRequestServiceAbstraction,
LoginStrategyServiceAbstraction,
@@ -27,9 +27,9 @@ import { KeyService } from "@bitwarden/key-management";
@Component({
selector: "app-login-via-auth-request",
templateUrl: "login-via-auth-request.component.html",
templateUrl: "login-via-auth-request-v1.component.html",
})
export class LoginViaAuthRequestComponent extends BaseLoginWithDeviceComponent {
export class LoginViaAuthRequestComponentV1 extends BaseLoginViaAuthRequestComponentV1 {
constructor(
router: Router,
keyService: KeyService,

3
apps/browser/src/popup/app-routing.animations.ts
View File

@@ -132,6 +132,9 @@ export const routerTransition = trigger("routerTransition", [
transition("login-with-device => tabs, login-with-device => 2fa", inSlideLeft),
transition("login-with-device => login", outSlideRight),
transition("admin-approval-requested => tabs, admin-approval-requested => 2fa", inSlideLeft),
transition("admin-approval-requested => login", outSlideRight),
transition(tabsToCiphers, inSlideLeft),
transition(ciphersToTabs, outSlideRight),

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

@@ -21,10 +21,12 @@ import { extensionRefreshSwap } from "@bitwarden/angular/utils/extension-refresh
import {
AnonLayoutWrapperComponent,
AnonLayoutWrapperData,
DevicesIcon,
LoginComponent,
LoginSecondaryContentComponent,
LockIcon,
LockV2Component,
LoginViaAuthRequestComponent,
PasswordHintComponent,
RegistrationFinishComponent,
RegistrationLockAltIcon,
@@ -51,7 +53,7 @@ import { HomeComponent } from "../auth/popup/home.component";
import { LockComponent } from "../auth/popup/lock.component";
import { LoginDecryptionOptionsComponent } from "../auth/popup/login-decryption-options/login-decryption-options.component";
import { LoginComponentV1 } from "../auth/popup/login-v1.component";
import { LoginViaAuthRequestComponent } from "../auth/popup/login-via-auth-request.component";
import { LoginViaAuthRequestComponentV1 } from "../auth/popup/login-via-auth-request-v1.component";
import { RegisterComponent } from "../auth/popup/register.component";
import { RemovePasswordComponent } from "../auth/popup/remove-password.component";
import { SetPasswordComponent } from "../auth/popup/set-password.component";
@@ -171,18 +173,6 @@ const routes: Routes = [
canActivate: [fido2AuthGuard],
data: { state: "fido2" } satisfies RouteDataProperties,
}),
{
path: "login-with-device",
component: LoginViaAuthRequestComponent,
canActivate: [],
data: { state: "login-with-device" } satisfies RouteDataProperties,
},
{
path: "admin-approval-requested",
component: LoginViaAuthRequestComponent,
canActivate: [],
data: { state: "login-with-device" } satisfies RouteDataProperties,
},
{
path: "lock",
component: LockComponent,
@@ -409,6 +399,61 @@ const routes: Routes = [
canActivate: [authGuard],
data: { state: "update-temp-password" } satisfies RouteDataProperties,
},
...unauthUiRefreshSwap(
LoginViaAuthRequestComponentV1,
ExtensionAnonLayoutWrapperComponent,
{
path: "login-with-device",
data: { state: "login-with-device" } satisfies RouteDataProperties,
},
{
path: "login-with-device",
data: {
pageIcon: DevicesIcon,
pageTitle: {
key: "loginInitiated",
},
pageSubtitle: {
key: "aNotificationWasSentToYourDevice",
},
showLogo: false,
showBackButton: true,
state: "login-with-device",
} satisfies RouteDataProperties & ExtensionAnonLayoutWrapperData,
children: [
{ path: "", component: LoginViaAuthRequestComponent },
{
path: "",
component: EnvironmentSelectorComponent,
outlet: "environment-selector",
},
],
},
),
...unauthUiRefreshSwap(
LoginViaAuthRequestComponentV1,
ExtensionAnonLayoutWrapperComponent,
{
path: "admin-approval-requested",
data: { state: "admin-approval-requested" } satisfies RouteDataProperties,
},
{
path: "admin-approval-requested",
data: {
pageIcon: DevicesIcon,
pageTitle: {
key: "adminApprovalRequested",
},
pageSubtitle: {
key: "adminApprovalRequestSentToAdmins",
},
showLogo: false,
showBackButton: true,
state: "admin-approval-requested",
} satisfies RouteDataProperties & ExtensionAnonLayoutWrapperData,
children: [{ path: "", component: LoginViaAuthRequestComponent }],
},
),
...unauthUiRefreshSwap(
HintComponent,
ExtensionAnonLayoutWrapperComponent,

4
apps/browser/src/popup/app.module.ts
View File

@@ -26,7 +26,7 @@ import { HomeComponent } from "../auth/popup/home.component";
import { LockComponent } from "../auth/popup/lock.component";
import { LoginDecryptionOptionsComponent } from "../auth/popup/login-decryption-options/login-decryption-options.component";
import { LoginComponentV1 } from "../auth/popup/login-v1.component";
import { LoginViaAuthRequestComponent } from "../auth/popup/login-via-auth-request.component";
import { LoginViaAuthRequestComponentV1 } from "../auth/popup/login-via-auth-request-v1.component";
import { RegisterComponent } from "../auth/popup/register.component";
import { RemovePasswordComponent } from "../auth/popup/remove-password.component";
import { SetPasswordComponent } from "../auth/popup/set-password.component";
@@ -159,8 +159,8 @@ import "../platform/popup/locales";
HintComponent,
HomeComponent,
LockComponent,
LoginViaAuthRequestComponentV1,
LoginComponentV1,
LoginViaAuthRequestComponent,
LoginDecryptionOptionsComponent,
NotificationsSettingsV1Component,
AppearanceComponent,

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

@@ -18,10 +18,12 @@ import { extensionRefreshRedirect } from "@bitwarden/angular/utils/extension-ref
import {
AnonLayoutWrapperComponent,
AnonLayoutWrapperData,
DevicesIcon,
LoginComponent,
LoginSecondaryContentComponent,
LockIcon,
LockV2Component,
LoginViaAuthRequestComponent,
PasswordHintComponent,
RegistrationFinishComponent,
RegistrationLockAltIcon,
@@ -42,7 +44,7 @@ import { HintComponent } from "../auth/hint.component";
import { LockComponent } from "../auth/lock.component";
import { LoginDecryptionOptionsComponent } from "../auth/login/login-decryption-options/login-decryption-options.component";
import { LoginComponentV1 } from "../auth/login/login-v1.component";
import { LoginViaAuthRequestComponent } from "../auth/login/login-via-auth-request.component";
import { LoginViaAuthRequestComponentV1 } from "../auth/login/login-via-auth-request-v1.component";
import { RegisterComponent } from "../auth/register.component";
import { RemovePasswordComponent } from "../auth/remove-password.component";
import { SetPasswordComponent } from "../auth/set-password.component";
@@ -75,14 +77,6 @@ const routes: Routes = [
canActivate: [lockGuard()],
canMatch: [extensionRefreshRedirect("/lockV2")],
},
{
path: "login-with-device",
component: LoginViaAuthRequestComponent,
},
{
path: "admin-approval-requested",
component: LoginViaAuthRequestComponent,
},
...twofactorRefactorSwap(
TwoFactorComponent,
AnonLayoutWrapperComponent,
@@ -130,6 +124,53 @@ const routes: Routes = [
component: RemovePasswordComponent,
canActivate: [authGuard],
},
...unauthUiRefreshSwap(
LoginViaAuthRequestComponentV1,
AnonLayoutWrapperComponent,
{
path: "login-with-device",
},
{
path: "login-with-device",
data: {
pageIcon: DevicesIcon,
pageTitle: {
key: "loginInitiated",
},
pageSubtitle: {
key: "aNotificationWasSentToYourDevice",
},
} satisfies AnonLayoutWrapperData,
children: [
{ path: "", component: LoginViaAuthRequestComponent },
{
path: "",
component: EnvironmentSelectorComponent,
outlet: "environment-selector",
},
],
},
),
...unauthUiRefreshSwap(
LoginViaAuthRequestComponentV1,
AnonLayoutWrapperComponent,
{
path: "admin-approval-requested",
},
{
path: "admin-approval-requested",
data: {
pageIcon: DevicesIcon,
pageTitle: {
key: "adminApprovalRequested",
},
pageSubtitle: {
key: "adminApprovalRequestSentToAdmins",
},
} satisfies AnonLayoutWrapperData,
children: [{ path: "", component: LoginViaAuthRequestComponent }],
},
),
...unauthUiRefreshSwap(
HintComponent,
AnonLayoutWrapperComponent,

0
apps/desktop/src/auth/login/login-via-auth-request.component.html → apps/desktop/src/auth/login/login-via-auth-request-v1.component.html
View File

6
apps/desktop/src/auth/login/login-via-auth-request.component.ts → apps/desktop/src/auth/login/login-via-auth-request-v1.component.ts
View File

@@ -2,7 +2,7 @@ import { Location } from "@angular/common";
import { Component, ViewChild, ViewContainerRef } from "@angular/core";
import { Router } from "@angular/router";
import { LoginViaAuthRequestComponent as BaseLoginWithDeviceComponent } from "@bitwarden/angular/auth/components/login-via-auth-request.component";
import { LoginViaAuthRequestComponentV1 as BaseLoginViaAuthRequestComponentV1 } from "@bitwarden/angular/auth/components/login-via-auth-request-v1.component";
import { ModalService } from "@bitwarden/angular/services/modal.service";
import {
AuthRequestServiceAbstraction,
@@ -30,9 +30,9 @@ import { EnvironmentComponent } from "../environment.component";
@Component({
selector: "app-login-via-auth-request",
templateUrl: "login-via-auth-request.component.html",
templateUrl: "login-via-auth-request-v1.component.html",
})
export class LoginViaAuthRequestComponent extends BaseLoginWithDeviceComponent {
export class LoginViaAuthRequestComponentV1 extends BaseLoginViaAuthRequestComponentV1 {
@ViewChild("environment", { read: ViewContainerRef, static: true })
environmentModal: ViewContainerRef;
showingModal = false;

6
apps/desktop/src/auth/login/login.module.ts
View File

@@ -7,16 +7,16 @@ import { SharedModule } from "../../app/shared/shared.module";
import { LoginDecryptionOptionsComponent } from "./login-decryption-options/login-decryption-options.component";
import { LoginComponentV1 } from "./login-v1.component";
import { LoginViaAuthRequestComponent } from "./login-via-auth-request.component";
import { LoginViaAuthRequestComponentV1 } from "./login-via-auth-request-v1.component";
@NgModule({
imports: [SharedModule, RouterModule],
declarations: [
LoginComponentV1,
LoginViaAuthRequestComponent,
LoginViaAuthRequestComponentV1,
EnvironmentSelectorComponent,
LoginDecryptionOptionsComponent,
],
exports: [LoginComponentV1, LoginViaAuthRequestComponent],
exports: [LoginComponentV1, LoginViaAuthRequestComponentV1],
})
export class LoginModule {}

15
apps/desktop/src/locales/en/messages.json
View File

@@ -2689,15 +2689,30 @@
"notificationSentDevice": {
"message": "A notification has been sent to your device."
},
"aNotificationWasSentToYourDevice": {
"message": "A notification was sent to your device"
},
"makeSureYourAccountIsUnlockedAndTheFingerprintEtc": {
"message": "Make sure your account is unlocked and the fingerprint phrase matches on the other device"
},
"needAnotherOptionV1": {
"message": "Need another option?"
},
"fingerprintMatchInfo": {
"message": "Please make sure your vault is unlocked and Fingerprint phrase matches the other device."
},
"fingerprintPhraseHeader": {
"message": "Fingerprint phrase"
},
"youWillBeNotifiedOnceTheRequestIsApproved": {
"message": "You will be notified once the request is approved"
},
"needAnotherOption": {
"message": "Log in with device must be set up in the settings of the Bitwarden app. Need another option?"
},
"viewAllLogInOptions": {
"message": "View all log in options"
},
"viewAllLoginOptions": {
"message": "View all login options"
},

1
apps/web/src/app/auth/login/login-via-auth-request.component.html → apps/web/src/app/auth/login/login-via-auth-request-v1.component.html
View File

@@ -45,6 +45,7 @@
</div>
</div>
</ng-container>
<ng-container *ngIf="state == StateEnum.AdminAuthRequest">
<div
class="tw-mt-3 tw-rounded-md tw-border tw-border-solid tw-border-secondary-300 tw-bg-background tw-p-6"

9
apps/web/src/app/auth/login/login-via-auth-request-v1.component.ts Normal file
View File

@@ -0,0 +1,9 @@
import { Component } from "@angular/core";
import { LoginViaAuthRequestComponentV1 as BaseLoginViaAuthRequestComponentV1 } from "@bitwarden/angular/auth/components/login-via-auth-request-v1.component";
@Component({
selector: "app-login-via-auth-request",
templateUrl: "login-via-auth-request-v1.component.html",
})
export class LoginViaAuthRequestComponentV1 extends BaseLoginViaAuthRequestComponentV1 {}

9
apps/web/src/app/auth/login/login-via-auth-request.component.ts
View File

@@ -1,9 +0,0 @@
import { Component } from "@angular/core";
import { LoginViaAuthRequestComponent as BaseLoginWithDeviceComponent } from "@bitwarden/angular/auth/components/login-via-auth-request.component";
@Component({
selector: "app-login-via-auth-request",
templateUrl: "login-via-auth-request.component.html",
})
export class LoginViaAuthRequestComponent extends BaseLoginWithDeviceComponent {}

6
apps/web/src/app/auth/login/login.module.ts
View File

@@ -6,20 +6,20 @@ import { SharedModule } from "../../../app/shared";
import { LoginDecryptionOptionsComponent } from "./login-decryption-options/login-decryption-options.component";
import { LoginComponentV1 } from "./login-v1.component";
import { LoginViaAuthRequestComponent } from "./login-via-auth-request.component";
import { LoginViaAuthRequestComponentV1 } from "./login-via-auth-request-v1.component";
import { LoginViaWebAuthnComponent } from "./login-via-webauthn/login-via-webauthn.component";
@NgModule({
imports: [SharedModule, CheckboxModule],
declarations: [
LoginComponentV1,
LoginViaAuthRequestComponent,
LoginViaAuthRequestComponentV1,
LoginDecryptionOptionsComponent,
LoginViaWebAuthnComponent,
],
exports: [
LoginComponentV1,
LoginViaAuthRequestComponent,
LoginViaAuthRequestComponentV1,
LoginDecryptionOptionsComponent,
LoginViaWebAuthnComponent,
],

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

@@ -27,6 +27,8 @@ import {
LockV2Component,
LockIcon,
UserLockIcon,
LoginViaAuthRequestComponent,
DevicesIcon,
RegistrationUserAddIcon,
RegistrationLockAltIcon,
RegistrationExpiredLinkIcon,
@@ -46,7 +48,7 @@ import { HintComponent } from "./auth/hint.component";
import { LockComponent } from "./auth/lock.component";
import { LoginDecryptionOptionsComponent } from "./auth/login/login-decryption-options/login-decryption-options.component";
import { LoginComponentV1 } from "./auth/login/login-v1.component";
import { LoginViaAuthRequestComponent } from "./auth/login/login-via-auth-request.component";
import { LoginViaAuthRequestComponentV1 } from "./auth/login/login-via-auth-request-v1.component";
import { LoginViaWebAuthnComponent } from "./auth/login/login-via-webauthn/login-via-webauthn.component";
import { AcceptOrganizationComponent } from "./auth/organization-invite/accept-organization.component";
import { RecoverDeleteComponent } from "./auth/recover-delete.component";
@@ -96,21 +98,11 @@ const routes: Routes = [
children: [], // Children lets us have an empty component.
canActivate: [redirectGuard()], // Redirects either to vault, login, or lock page.
},
{
path: "login-with-device",
component: LoginViaAuthRequestComponent,
data: { titleId: "loginWithDevice" } satisfies RouteDataProperties,
},
{
path: "login-with-passkey",
component: LoginViaWebAuthnComponent,
data: { titleId: "logInWithPasskey" } satisfies RouteDataProperties,
},
{
path: "admin-approval-requested",
component: LoginViaAuthRequestComponent,
data: { titleId: "adminApprovalRequested" } satisfies RouteDataProperties,
},
{
path: "login-initiated",
component: LoginDecryptionOptionsComponent,
@@ -179,6 +171,57 @@ const routes: Routes = [
},
],
},
...unauthUiRefreshSwap(
LoginViaAuthRequestComponentV1,
AnonLayoutWrapperComponent,
{
path: "login-with-device",
data: { titleId: "loginWithDevice" } satisfies RouteDataProperties,
},
{
path: "login-with-device",
data: {
pageIcon: DevicesIcon,
pageTitle: {
key: "loginInitiated",
},
pageSubtitle: {
key: "aNotificationWasSentToYourDevice",
},
titleId: "loginInitiated",
} satisfies RouteDataProperties & AnonLayoutWrapperData,
children: [
{ path: "", component: LoginViaAuthRequestComponent },
{
path: "",
component: EnvironmentSelectorComponent,
outlet: "environment-selector",
},
],
},
),
...unauthUiRefreshSwap(
LoginViaAuthRequestComponentV1,
AnonLayoutWrapperComponent,
{
path: "admin-approval-requested",
data: { titleId: "adminApprovalRequested" } satisfies RouteDataProperties,
},
{
path: "admin-approval-requested",
data: {
pageIcon: DevicesIcon,
pageTitle: {
key: "adminApprovalRequested",
},
pageSubtitle: {
key: "adminApprovalRequestSentToAdmins",
},
titleId: "adminApprovalRequested",
} satisfies RouteDataProperties & AnonLayoutWrapperData,
children: [{ path: "", component: LoginViaAuthRequestComponent }],
},
),
...unauthUiRefreshSwap(
AnonLayoutWrapperComponent,
AnonLayoutWrapperComponent,

15
apps/web/src/locales/en/messages.json
View File

@@ -984,6 +984,9 @@
"loginWithDeviceEnabledNote": {
"message": "Log in with device must be set up in the settings of the Bitwarden app. Need another option?"
},
"needAnotherOptionV1": {
"message": "Need another option?"
},
"loginWithMasterPassword": {
"message": "Log in with master password"
},
@@ -1302,6 +1305,12 @@
"notificationSentDevice": {
"message": "A notification has been sent to your device."
},
"aNotificationWasSentToYourDevice": {
"message": "A notification was sent to your device"
},
"makeSureYourAccountIsUnlockedAndTheFingerprintEtc": {
"message": "Make sure your account is unlocked and the fingerprint phrase matches on the other device"
},
"versionNumber": {
"message": "Version $VERSION_NUMBER$",
"placeholders": {
@@ -3387,6 +3396,9 @@
}
}
},
"viewAllLogInOptions": {
"message": "View all log in options"
},
"viewAllLoginOptions": {
"message": "View all log in options"
},
@@ -4443,6 +4455,9 @@
"message": "Never prompt to verify fingerprint phrases for invited users (not recommended)",
"description": "A 'fingerprint phrase' is a unique word phrase (similar to a passphrase) that a user can use to authenticate their public key with another user, for the purposes of sharing."
},
"youWillBeNotifiedOnceTheRequestIsApproved": {
"message": "You will be notified once the request is approved"
},
"free": {
"message": "Free",
"description": "Free, as in 'Free beer'"