mirror of
https://github.com/bitwarden/browser
synced 2025-12-06 00:13:28 +00:00
feat(2FA-UI-Refresh): [Auth/PM-8113] - 2FA Components Consolidation and UI Refresh (#12087)
* PM-8113 - Deprecate TwoFactorComponentRefactor feature flag in favor of UnauthenticatedExtensionUIRefresh flag * PM-8113 - Rename all existing 2FA components as V1. * PM-8113 - TwoFactorAuthComp - Add comment explaining that tagged unused import is used a dialog. * PM-8113 - 2FA Auth Comp - deprecate captcha * PM-8113 - LoginStrategySvc - add todo for deprecation of captcha response * PM-8113 - TwoFactorAuth tests - remove captcha * PM-8113 - TwoFactorAuthComp HTML - remove captcha * PM-8113 - Web Two Factor Auth - update deps * PM-8113 - Move all new two-factor-auth components into libs/auth instead of libs/angular/src/auth * PM-8113 - Add new child-components folder to help differentiate between top level page component and child components * PM-8113 - Add todo for browser TwoFactorAuthEmailComponent * PM-8113 - TwoFactorAuth - progress on consolidation * PM-8113 - TwoFactorAuth - add TODO to ensure I don't miss web on success logic * PM-8113 - TwoFactorAuth - Deprecate browser implementation of two-factor-auth and move all logic into single component - WIP * PM-8113 - Bring across 2FA session timeout to new 2FA orchestrator comp * PM-8113 - Export TwoFactorAuth from libs/auth * PM-8113 - Fix 2FA Auth Comp tests by adding new service deps. * PM-8113 - Fix TwoFactorAuthExpiredComp imports + TwoFactorAuthComponent imports on other clients. * PM-8113 - 2FA Auth Comp - Progress on removing onSuccessfulLogin callback * PM-8113 - 2FA Auth - update deps to private as inheritance will no longer be used. * PM-8113 - TwoFactorAuthComp - Refactor init a bit. * PM-8113 - TwoFactorAuthComp - More naming refactors * PM-8113 - TwoFactorAuth - (1) more refactoring (2) removed onSuccessfulLoginNavigate (3) after successful login we always loginEmailService.clearValues() * PM-8113 - TwoFactorAuthComp Tests - clean up tests for removed callbacks. * PM-8113 - TwoFactorAuthComponent - refactor default success route handling * PM-8113 - TwoFactorAuthComp - More refactoring * PM-8113 - TwoFactorAuthComp - more refactors * PM-8113 - TwoFactorAuth - Remove unused service dep * PM-8113 - TwoFactorAuthComp - Refactor out unused button action text and move checks for continue button visibility into component * PM-8113 - TwoFactorAuthComponent - Add type for providerData * PM-8113 - TwoFactorAuthComponent - Add todo * PM-8113 - TwoFactorAuthComponent - Add client type * PM-8113 - TwoFactorAuth - implement browser specific SSO + 2FA logic * PM-8113 - TwoFactorService Abstraction - refactor to use proper functions + mark methods as abstract properly + add null return to getProviders * PM-8113 - Refactor 2FA Guard logic out of ngOnInit and into own tested guard. Updated all routes. * PM-8113 - TwoFactorAuthComponent - WIP on webauthn init. * PM-8113 - TwoFactorAuthComponent - pull webauthn fallback response handling into primary init with checks based on client for if it should be processed. * PM-8113 - TwoFactorAuthComponent - move linux popup width extension logic into ExtensionTwoFactorAuthComponentService * PM-8113 - WebTwoFactorAuthComponentService - add explicit override for web's determineLegacyKeyMigrationAction method. * PM-8113 - Implement new TwoFactorAuthComponentService .openPopoutIfApprovedForEmail2fa to replace extension specific init logic. * PM-8113 - TwoFactorAuthComponent - misc cleanup * PM-8113 - TwoFactorAuthComponent - more clean up * PM-8113 - TwoFactorAuthComponent - WIP on removing TDE callbacks * PM-8113 - TwoFactorAuthComponent - finish refactoring out all callbacks * PM-8113 - TwoFactorAuthComponent - remove now unused method * PM-8113 - TwoFactorAuthComponent - refactor routes. * PM-8113 - TwoFactorAuthComponent - add TODO * PM-8113 - TwoFactorAuthComp - isTrustedDeviceEncEnabled - add undefined check for optional window close. + Add todo * PM-8113 - TwoFactorAuthComponent tests - updated to pass * PM-8113 - (1) Consolidate TwoFactorAuthEmail component into new service architecture (2) Move openPopoutIfApprovedForEmail2fa to new TwoFactorAuthEmailComponentService * PM-8113 - Refactor libs/auth/2fa into barrel files. * PM-8113 - Move TwoFactorAuthEmail content to own folder. * PM-8113 - Move 2FA Duo to own comp folder. * PM-8113 - ExtensionTwoFactorAuthEmailComponentService - Add comment * PM-8113 - TwoFactorAuthEmailComponentService - add docs * PM-8113 - TwoFactorAuthDuoComponentService - define top level abstraction and each clients implementation of the duo2faResultListener * PM-8113 - TwoFactorAuthDuoCompService - add client specific handling for launchDuoFrameless * PM-8113 - Delete no longer used client specific two factor auth duo components. * PM-8113 - Register TwoFactorAuthDuoComponentService implementation in each client. * PM-8113 - TwoFactorAuthComp - add destroy ref to fix warnings. * PM-8113 - Remove accidentally checked in dev change * PM-8113 - TwoFactorAuthComp - (1) Add loading state (2) Add missing CheckboxModule import * PM-8113 - TwoFactorAuthDuoComponent - update takeUntilDestroyed to pass in destroy context as you can't use takeUntilDestroyed in ngOnInit without it. * PM-8113 - TwoFactorAuthWebAuthnComponent - remove no longer necessary webauthn new tab check as webauthn seems to work without it * PM-8113 - TwoFactorAuthWebAuthnComp - refactor names and add todo * PM-8113 - (1) Move WebAuthn 2FA comp to own folder (2) build out client service for new tab logic * PM-8113 - Register TwoFactorAuthWebAuthnComponentServices * PM-8113 - Tweak TwoFactorAuthWebAuthnComponentService and add to TwoFactorAuthWebAuthnComponent * PM-8113 - WebTwoFactorAuthDuoComponentService - fix type issue * PM-8113 - ExtensionTwoFactorAuthDuoComponentService - attempt to fix type issue. * PM-8113 - Remove ts-strict-ignore * PM-8113 - TwoFactorAuthWebAuthnComponent - satisfy strict typescript reqs. * PM-8113 - TwoFactorAuthComponent - some progress on strict TS conversion * PM-8113 - TwoFactorAuthComp - fixed all strict typescript issues. * PM-8113 - TwoFactorAuthComp - remove no longer necessary webauthn code * PM-8113 - ExtensionTwoFactorAuthComponentService - handleSso2faFlowSuccess - add more context * PM-8113 - TwoFactorAuthComp - TDE should use same success handler method * PM-8113 - Fix SSO + 2FA result handling by closing proper popout window * PM-8113 - Add todo * PM-8113 - Webauthn 2FA - As webauthn popout doesn't persist SSO state, have to genercize success logic (which should be a good thing but requires confirmation testing). * PM-8113 - Per main changes, remove deprecated I18nPipe from 2fa comps that use it. * PM-8113 - Remove more incorrect i18nPipes * PM-8113 - TwoFactorAuth + Webauthn - Refactor logic * PM-8113 - TwoFactorAuth - build submitting loading logic * PM-8113 - TwoFactorAuth - remove loading as submitting. * PM-8113 - TwoFactorAuth - update to latest authN session timeout logic * PM-8113 - AuthPopoutWindow - Add new single action popout for email 2FA so we can close it programmatically * PM-8113 - Update ExtensionTwoFactorAuthComponentService to close email 2FA single action popouts. * PM-8113 - Fix build after merge conflict issue * PM-8113 - 2FA - Duo & Email comps - strict typescript adherence. * PM-8113 - TwoFactorAuth - Clean up unused stuff and get tests passing * PM-8113 - Clean up used service method + TODO as I've confirmed it works for other flows. * PM-8113 - TODO: test all comp services * PM-8113 - TwoFactorAuthComponent Tests - fix tests by removing mock of removed method. * PM-8113 - Revert changes to login strategies to avoid scope creep for the sake of typescript strictness. * PM-8113 - ExtensionTwoFactorAuthComponentService tests * PM-8113 - Test ExtensionTwoFactorAuthDuoComponentService * PM-8113 - ExtensionTwoFactorAuthEmailComponentService - add tests * PM-8113 - Test ExtensionTwoFactorAuthWebAuthnComponentService * PM-8113 - Add 2fa icons (icons need tweaking still) * PM-8113 - TwoFactorAuthComponent - add setAnonLayoutDataByTwoFactorProviderType and handle email case as POC * PM-8113 - TwoFactorEmailComp - work on converting to new design * PM-8113 - Update icons with proper svg with scaling via viewbox * PM-8113 - Update icons to use proper classes * PM-8113 - 2FA Auth Comp - Progress on implementing design changes * PM-8113 - TwoFactorOptionsComponent - add todos * PM-8113 - 2fa Email Comp - add style changes per discussion with design * PM-8113 - TwoFactorAuthComponent - use2faRecoveryCode - build out method per discussion with design * PM-8113 - TwoFactorAuthComp - fix comp tests * PM-8113 - TwoFactorAuthComp - progress on adding 2fa provider page icons and subtitles * PM-8113 - Browser Translations - update duoTwoFactorRequiredPageSubtitle to match design discussion * PM-8113 - TwoFactorAuthComp - more work on getting page title / icons working * PM-8113 - Add todo * PM-8113 - TwoFactorAuthDuoComponent Html - remove text that was moved to page subtitle. * PM-8113 - 2FA Auth Comp - Duo icon works * PM-8113 - (1) Add Yubico logo icon (2) Rename Yubikey icon to security key icon * PM-8113 - TwoFactorAuthComp - remove icon from launch duo button per figma * PM-8113 - Mark old two-factor-options component as v1. * PM-8113 - Web - TwoFactorOptionsComponentV1 - Fix import * PM-8113 - Fix more imports * PM-8113 - Adjust translations based on meeting with Design * PM-8113 - TwoFactorOptionsComponent - deprecate recovery code functionality * PM-8113 - TwoFactorOptionsComponent - remove icon disable logic and unused imports * PM-8113 - 2FA Options Comp rewritten to match figma * PM-8113 - TwoFactorOptions - (1) Sort providers like setup screen (2) Add responsive scaling * PM-8113 - Webauthn 2FA - WIP on updating connectors to latest style * PM-8113 - Webauthn connector - clean up commented out code and restore block style * PM-8113 - TwoFactorAuthWebAuthn - Add loading state for iframe until webauthn ready * PM-8113 - Webauthn Iframe - update translation per figma * PM-8113 - TwoFactorAuthComp - per figma, put webauthn after checkbox. * PM-8113 - WebAuthn Fallback connector - UI refreshed * PM-8113 - Two Factor Options - Implement wrapping * PM-8113 - TwoFactorAuthAuthenticator - Remove text per figma * PM-8113 - TwoFactorAuthYubikey - Clean up design per figma * PM-8113 - Refactor all 2FA flows to use either reactive forms or programmatic submission so we get the benefit of onSubmit form validation like we have elsewhere. * PM-8113 - 2FA Auth Comp - for form validated 2FA methods, add enter support. * PM-8113 - TwoFactorAuthComp - Add loginSuccessHandlerService * PM-8113 - DesktopTwoFactorAuthDuoComponentService - add tests * PM-8113 - WebTwoFactorAuthDuoComponentService test file - WIP on tests * PM-8113 - WebTwoFactorAuthDuoComponentService - test listenForDuo2faResult * PM-8113 - TwoFactorAuthComp - (1) remove unused deps (2) get tests passing * PM-8113 - Add required to inputs * PM-8113 - TwoFactorAuth - Save off 2FA providers map so we can only show the select another 2FA method if the user actually has more than 1 configured 2FA method. * PM-8113 - Webauthn iframe styling must be adjusted per client so adjust desktop and browser extension * PM-8113 - TwoFactorAuthComp - Integrate latest ssoLoginService changes * PM-8113 - Desktop & Browser routing modules - add new page title per figma * PM-8113 - WebAuthn - added optional awaiting security key interaction button state to improve UX. * PM-8113 - TwoFactorAuthComp - refactor to avoid reactive race condition with retrieval of active user id. * PM-8113 - ExtensionTwoFactorAuthEmailComponentService - force close the popup since it has stopped closing when the popup opens. * PM-8113 - TwoFactorAuth - refactor enter key press to exempt non-applicable flows from enter key handling * PM-8113 - Refactor ExtensionTwoFactorAuthComponentService methods to solve issues with submission * PM-8113 - TwoFactorAuth - fix programmatic submit of form * PM-8113 - Fix ExtensionTwoFactorAuthComponentService tests * PM-8113 - Extension - Webauthn iframe - remove -10px margin * PM-8113 - Extension Routing module - 2FA screens need back button * PM-8113 - Get Duo working in extension * PM-8113 - TwoFactorOptions - tweak styling of row styling to better work for extension * PM-8113 - TwoFactorWebauthnComp - new tab button styling per figma * PM-8113 - 2FA Comp - Update logic for hiding / showing the remember me checkbox * PM-8113 - TwoFactorAuthWebAuthnComp - new tab flow - fix remember me * PM-8113 - Per PR feedback, add TODO for better provider and module structure for auth component client logic services. * PM-8113 - TwoFactorAuth - add missing TDE offboarding logic. * PM-8113 - TwoFactorAuthComponent tests - fix tests * PM-8113 - 2FA Auth Comp HTML - per PR feedback, remove unnecessary margin bottom * PM-8113 - 2FA Comp - per PR feedback, remove inSsoFlow as it isn't used. * PM-8113 - TwoFactorOptionsComp - Clean up no longer needed emitters. * PM-8113 - TwoFactorOptions - per PR feedback, clean up any usage * PM-8113 - TwoFactorAuthComp - per PR feedback, rename method from selectOtherTwofactorMethod to selectOtherTwoFactorMethod * PM-8113 - Per PR feedback, fix translations misspelling * PM-8113 - TwoFactorAuthSecurityKeyIcon - fix hardcoded value * PM-8113 - TwoFactorAuthSecurityKeyIcon - fix extra " * PM-8113 - TwoFactorAuthDuo - Per PR feedback, remove empty template. * PM-8113 - LooseComponentsModule - re-add accidentally removed component * PM-8113 - TwoFactorAuthWebAuthnIcon - per PR feedback, fix hardcoded stroke value. * PM-8113 - Desktop AppRoutingModule - per PR feedback, remove unnecessary AnonLayoutWrapperComponent component property. * PM-8113 - Update apps/browser/src/auth/services/extension-two-factor-auth-duo-component.service.spec.ts to fix misspelling Co-authored-by: rr-bw <102181210+rr-bw@users.noreply.github.com> * PM-8113 - TwoFactorAuthComp - Per PR feedback, add trim to token value * PM-8113 - TwoFactorService - add typescript strict * PM-8113 - TwoFactorService - per PR feedback, add jsdocs * PM-8113 - Per PR feedback, fix misspelling * PM-8113 - Webauthn fallback - per PR feedback fix stroke * PM-8113 - Update apps/web/src/connectors/webauthn-fallback.html Co-authored-by: rr-bw <102181210+rr-bw@users.noreply.github.com> * PM-8113 - Update libs/auth/src/angular/icons/two-factor-auth/two-factor-auth-webauthn.icon.ts Co-authored-by: rr-bw <102181210+rr-bw@users.noreply.github.com> --------- Co-authored-by: rr-bw <102181210+rr-bw@users.noreply.github.com>
This commit is contained in:
Jared Snider
GitHub
@@ -885,6 +885,21 @@
|
||||
"logInToBitwarden": {
|
||||
"message": "Log in to Bitwarden"
|
||||
},
|
||||
"enterTheCodeSentToYourEmail": {
|
||||
"message": "Enter the code sent to your email"
|
||||
},
|
||||
"enterTheCodeFromYourAuthenticatorApp": {
|
||||
"message": "Enter the code from your authenticator app"
|
||||
},
|
||||
"pressYourYubiKeyToAuthenticate": {
|
||||
"message": "Press your YubiKey to authenticate"
|
||||
},
|
||||
"duoTwoFactorRequiredPageSubtitle": {
|
||||
"message": "Duo two-step login is required for your account. Follow the steps below to finish logging in."
|
||||
},
|
||||
"followTheStepsBelowToFinishLoggingIn": {
|
||||
"message": "Follow the steps below to finish logging in."
|
||||
},
|
||||
"restartRegistration": {
|
||||
"message": "Restart registration"
|
||||
},
|
||||
@@ -1374,12 +1389,22 @@
|
||||
"rememberMe": {
|
||||
"message": "Remember me"
|
||||
},
|
||||
"dontAskAgainOnThisDeviceFor30Days": {
|
||||
"message": "Don't ask again on this device for 30 days"
|
||||
},
|
||||
"sendVerificationCodeEmailAgain": {
|
||||
"message": "Send verification code email again"
|
||||
},
|
||||
"useAnotherTwoStepMethod": {
|
||||
"message": "Use another two-step login method"
|
||||
},
|
||||
"selectAnotherMethod": {
|
||||
"message": "Select another method",
|
||||
"description": "Select another two-step login method"
|
||||
},
|
||||
"useYourRecoveryCode": {
|
||||
"message": "Use your recovery code"
|
||||
},
|
||||
"insertYubiKey": {
|
||||
"message": "Insert your YubiKey into your computer's USB port, then touch its button."
|
||||
},
|
||||
@@ -1392,9 +1417,18 @@
|
||||
"webAuthnNewTabOpen": {
|
||||
"message": "Open new tab"
|
||||
},
|
||||
"openInNewTab": {
|
||||
"message": "Open in new tab"
|
||||
},
|
||||
"webAuthnAuthenticate": {
|
||||
"message": "Authenticate WebAuthn"
|
||||
},
|
||||
"readSecurityKey": {
|
||||
"message": "Read security key"
|
||||
},
|
||||
"awaitingSecurityKeyInteraction": {
|
||||
"message": "Awaiting security key interaction..."
|
||||
},
|
||||
"loginUnavailable": {
|
||||
"message": "Login unavailable"
|
||||
},
|
||||
@@ -1407,6 +1441,9 @@
|
||||
"twoStepOptions": {
|
||||
"message": "Two-step login options"
|
||||
},
|
||||
"selectTwoStepLoginMethod": {
|
||||
"message": "Select two-step login method"
|
||||
},
|
||||
"recoveryCodeDesc": {
|
||||
"message": "Lost access to all of your two-factor providers? Use your recovery code to turn off all two-factor providers from your account."
|
||||
},
|
||||
|
||||
@@ -1,118 +0,0 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, OnDestroy, OnInit } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
import { Subject, Subscription, filter, firstValueFrom, takeUntil } from "rxjs";
|
||||
|
||||
import { TwoFactorAuthDuoComponent as TwoFactorAuthDuoBaseComponent } from "@bitwarden/angular/auth/components/two-factor-auth/two-factor-auth-duo.component";
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import { ToastService } from "@bitwarden/components";
|
||||
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { AsyncActionsModule } from "../../../../../libs/components/src/async-actions";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { ButtonModule } from "../../../../../libs/components/src/button";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { FormFieldModule } from "../../../../../libs/components/src/form-field";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { LinkModule } from "../../../../../libs/components/src/link";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TypographyModule } from "../../../../../libs/components/src/typography";
|
||||
import { ZonedMessageListenerService } from "../../platform/browser/zoned-message-listener.service";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth-duo",
|
||||
templateUrl:
|
||||
"../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-duo.component.html",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
})
|
||||
export class TwoFactorAuthDuoComponent
|
||||
extends TwoFactorAuthDuoBaseComponent
|
||||
implements OnInit, OnDestroy
|
||||
{
|
||||
private destroy$ = new Subject<void>();
|
||||
duoResultSubscription: Subscription;
|
||||
|
||||
constructor(
|
||||
protected i18nService: I18nService,
|
||||
protected platformUtilsService: PlatformUtilsService,
|
||||
private browserMessagingApi: ZonedMessageListenerService,
|
||||
private environmentService: EnvironmentService,
|
||||
toastService: ToastService,
|
||||
) {
|
||||
super(i18nService, platformUtilsService, toastService);
|
||||
}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
await super.ngOnInit();
|
||||
}
|
||||
|
||||
async ngOnDestroy() {
|
||||
this.destroy$.next();
|
||||
this.destroy$.complete();
|
||||
}
|
||||
|
||||
protected override setupDuoResultListener() {
|
||||
if (!this.duoResultSubscription) {
|
||||
this.duoResultSubscription = this.browserMessagingApi
|
||||
.messageListener$()
|
||||
.pipe(
|
||||
filter((msg: any) => msg.command === "duoResult"),
|
||||
takeUntil(this.destroy$),
|
||||
)
|
||||
.subscribe((msg: { command: string; code: string; state: string }) => {
|
||||
this.token.emit(msg.code + "|" + msg.state);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
override async launchDuoFrameless() {
|
||||
if (this.duoFramelessUrl === null) {
|
||||
this.toastService.showToast({
|
||||
variant: "error",
|
||||
title: null,
|
||||
message: this.i18nService.t("duoHealthCheckResultsInNullAuthUrlError"),
|
||||
});
|
||||
return;
|
||||
}
|
||||
const duoHandOffMessage = {
|
||||
title: this.i18nService.t("youSuccessfullyLoggedIn"),
|
||||
message: this.i18nService.t("youMayCloseThisWindow"),
|
||||
isCountdown: false,
|
||||
};
|
||||
|
||||
// we're using the connector here as a way to set a cookie with translations
|
||||
// before continuing to the duo frameless url
|
||||
const env = await firstValueFrom(this.environmentService.environment$);
|
||||
const launchUrl =
|
||||
env.getWebVaultUrl() +
|
||||
"/duo-redirect-connector.html" +
|
||||
"?duoFramelessUrl=" +
|
||||
encodeURIComponent(this.duoFramelessUrl) +
|
||||
"&handOffMessage=" +
|
||||
encodeURIComponent(JSON.stringify(duoHandOffMessage));
|
||||
this.platformUtilsService.launchUri(launchUrl);
|
||||
}
|
||||
}
|
||||
@@ -1,65 +0,0 @@
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, OnInit, inject } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
|
||||
import { TwoFactorAuthEmailComponent as TwoFactorAuthEmailBaseComponent } from "@bitwarden/angular/auth/components/two-factor-auth/two-factor-auth-email.component";
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { AsyncActionsModule } from "../../../../../libs/components/src/async-actions";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { ButtonModule } from "../../../../../libs/components/src/button";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { DialogService } from "../../../../../libs/components/src/dialog";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { FormFieldModule } from "../../../../../libs/components/src/form-field";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { LinkModule } from "../../../../../libs/components/src/link";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TypographyModule } from "../../../../../libs/components/src/typography";
|
||||
import BrowserPopupUtils from "../../platform/popup/browser-popup-utils";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth-email",
|
||||
templateUrl:
|
||||
"../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-email.component.html",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
})
|
||||
export class TwoFactorAuthEmailComponent extends TwoFactorAuthEmailBaseComponent implements OnInit {
|
||||
private dialogService = inject(DialogService);
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
if (BrowserPopupUtils.inPopup(window)) {
|
||||
const confirmed = await this.dialogService.openSimpleDialog({
|
||||
title: { key: "warning" },
|
||||
content: { key: "popup2faCloseMessage" },
|
||||
type: "warning",
|
||||
});
|
||||
if (confirmed) {
|
||||
await BrowserPopupUtils.openCurrentPagePopout(window);
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
await super.ngOnInit();
|
||||
}
|
||||
}
|
||||
@@ -1,170 +0,0 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, Inject, OnDestroy, OnInit } from "@angular/core";
|
||||
import { FormBuilder, ReactiveFormsModule } from "@angular/forms";
|
||||
import { ActivatedRoute, Router, RouterLink } from "@angular/router";
|
||||
|
||||
import { TwoFactorAuthAuthenticatorComponent } from "@bitwarden/angular/auth/components/two-factor-auth/two-factor-auth-authenticator.component";
|
||||
import { TwoFactorAuthWebAuthnComponent } from "@bitwarden/angular/auth/components/two-factor-auth/two-factor-auth-webauthn.component";
|
||||
import { TwoFactorAuthYubikeyComponent } from "@bitwarden/angular/auth/components/two-factor-auth/two-factor-auth-yubikey.component";
|
||||
import { TwoFactorAuthComponent as BaseTwoFactorAuthComponent } from "@bitwarden/angular/auth/components/two-factor-auth/two-factor-auth.component";
|
||||
import { TwoFactorOptionsComponent } from "@bitwarden/angular/auth/components/two-factor-auth/two-factor-options.component";
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import { WINDOW } from "@bitwarden/angular/services/injection-tokens";
|
||||
import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
|
||||
import { InternalMasterPasswordServiceAbstraction } from "@bitwarden/common/auth/abstractions/master-password.service.abstraction";
|
||||
import { SsoLoginServiceAbstraction } from "@bitwarden/common/auth/abstractions/sso-login.service.abstraction";
|
||||
import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
|
||||
import { TwoFactorProviderType } from "@bitwarden/common/auth/enums/two-factor-provider-type";
|
||||
import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
|
||||
import { MessagingService } from "@bitwarden/common/platform/abstractions/messaging.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import { SyncService } from "@bitwarden/common/platform/sync";
|
||||
import {
|
||||
ButtonModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
CheckboxModule,
|
||||
DialogModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
DialogService,
|
||||
ToastService,
|
||||
} from "@bitwarden/components";
|
||||
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import {
|
||||
LoginStrategyServiceAbstraction,
|
||||
LoginEmailServiceAbstraction,
|
||||
UserDecryptionOptionsServiceAbstraction,
|
||||
} from "../../../../../libs/auth/src/common/abstractions";
|
||||
import { BrowserApi } from "../../platform/browser/browser-api";
|
||||
import BrowserPopupUtils from "../../platform/popup/browser-popup-utils";
|
||||
|
||||
import { TwoFactorAuthDuoComponent } from "./two-factor-auth-duo.component";
|
||||
import { TwoFactorAuthEmailComponent } from "./two-factor-auth-email.component";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
templateUrl:
|
||||
"../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth.component.html",
|
||||
selector: "app-two-factor-auth",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
RouterLink,
|
||||
CheckboxModule,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorAuthEmailComponent,
|
||||
TwoFactorAuthAuthenticatorComponent,
|
||||
TwoFactorAuthYubikeyComponent,
|
||||
TwoFactorAuthDuoComponent,
|
||||
TwoFactorAuthWebAuthnComponent,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
})
|
||||
export class TwoFactorAuthComponent
|
||||
extends BaseTwoFactorAuthComponent
|
||||
implements OnInit, OnDestroy
|
||||
{
|
||||
constructor(
|
||||
protected loginStrategyService: LoginStrategyServiceAbstraction,
|
||||
protected router: Router,
|
||||
i18nService: I18nService,
|
||||
platformUtilsService: PlatformUtilsService,
|
||||
environmentService: EnvironmentService,
|
||||
dialogService: DialogService,
|
||||
protected route: ActivatedRoute,
|
||||
logService: LogService,
|
||||
protected twoFactorService: TwoFactorService,
|
||||
loginEmailService: LoginEmailServiceAbstraction,
|
||||
userDecryptionOptionsService: UserDecryptionOptionsServiceAbstraction,
|
||||
protected ssoLoginService: SsoLoginServiceAbstraction,
|
||||
protected configService: ConfigService,
|
||||
masterPasswordService: InternalMasterPasswordServiceAbstraction,
|
||||
accountService: AccountService,
|
||||
formBuilder: FormBuilder,
|
||||
@Inject(WINDOW) protected win: Window,
|
||||
private syncService: SyncService,
|
||||
private messagingService: MessagingService,
|
||||
toastService: ToastService,
|
||||
) {
|
||||
super(
|
||||
loginStrategyService,
|
||||
router,
|
||||
i18nService,
|
||||
platformUtilsService,
|
||||
environmentService,
|
||||
dialogService,
|
||||
route,
|
||||
logService,
|
||||
twoFactorService,
|
||||
loginEmailService,
|
||||
userDecryptionOptionsService,
|
||||
ssoLoginService,
|
||||
configService,
|
||||
masterPasswordService,
|
||||
accountService,
|
||||
formBuilder,
|
||||
win,
|
||||
toastService,
|
||||
);
|
||||
this.onSuccessfulLoginTdeNavigate = async () => {
|
||||
this.win.close();
|
||||
};
|
||||
this.onSuccessfulLoginNavigate = this.goAfterLogIn;
|
||||
}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
await super.ngOnInit();
|
||||
|
||||
if (this.route.snapshot.paramMap.has("webAuthnResponse")) {
|
||||
// WebAuthn fallback response
|
||||
this.selectedProviderType = TwoFactorProviderType.WebAuthn;
|
||||
this.token = this.route.snapshot.paramMap.get("webAuthnResponse");
|
||||
this.onSuccessfulLogin = async () => {
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.syncService.fullSync(true);
|
||||
this.messagingService.send("reloadPopup");
|
||||
window.close();
|
||||
};
|
||||
this.remember = this.route.snapshot.paramMap.get("remember") === "true";
|
||||
await this.submit();
|
||||
return;
|
||||
}
|
||||
|
||||
if (await BrowserPopupUtils.inPopout(this.win)) {
|
||||
this.selectedProviderType = TwoFactorProviderType.Email;
|
||||
}
|
||||
|
||||
// WebAuthn prompt appears inside the popup on linux, and requires a larger popup width
|
||||
// than usual to avoid cutting off the dialog.
|
||||
if (this.selectedProviderType === TwoFactorProviderType.WebAuthn && (await this.isLinux())) {
|
||||
document.body.classList.add("linux-webauthn");
|
||||
}
|
||||
}
|
||||
|
||||
async ngOnDestroy() {
|
||||
if (this.selectedProviderType === TwoFactorProviderType.WebAuthn && (await this.isLinux())) {
|
||||
document.body.classList.remove("linux-webauthn");
|
||||
}
|
||||
}
|
||||
|
||||
async isLinux() {
|
||||
return (await BrowserApi.getPlatformInfo()).os === "linux";
|
||||
}
|
||||
}
|
||||
@@ -1,7 +1,7 @@
|
||||
import { Component } from "@angular/core";
|
||||
import { ActivatedRoute, Router } from "@angular/router";
|
||||
|
||||
import { TwoFactorOptionsComponent as BaseTwoFactorOptionsComponent } from "@bitwarden/angular/auth/components/two-factor-options.component";
|
||||
import { TwoFactorOptionsComponentV1 as BaseTwoFactorOptionsComponent } from "@bitwarden/angular/auth/components/two-factor-options-v1.component";
|
||||
import {
|
||||
TwoFactorProviderDetails,
|
||||
TwoFactorService,
|
||||
@@ -12,9 +12,9 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
|
||||
|
||||
@Component({
|
||||
selector: "app-two-factor-options",
|
||||
templateUrl: "two-factor-options.component.html",
|
||||
templateUrl: "two-factor-options-v1.component.html",
|
||||
})
|
||||
export class TwoFactorOptionsComponent extends BaseTwoFactorOptionsComponent {
|
||||
export class TwoFactorOptionsComponentV1 extends BaseTwoFactorOptionsComponent {
|
||||
constructor(
|
||||
twoFactorService: TwoFactorService,
|
||||
router: Router,
|
||||
@@ -5,7 +5,7 @@ import { ActivatedRoute, Router } from "@angular/router";
|
||||
import { Subject, Subscription, firstValueFrom } from "rxjs";
|
||||
import { filter, first, takeUntil } from "rxjs/operators";
|
||||
|
||||
import { TwoFactorComponent as BaseTwoFactorComponent } from "@bitwarden/angular/auth/components/two-factor.component";
|
||||
import { TwoFactorComponentV1 as BaseTwoFactorComponent } from "@bitwarden/angular/auth/components/two-factor-v1.component";
|
||||
import { WINDOW } from "@bitwarden/angular/services/injection-tokens";
|
||||
import {
|
||||
LoginStrategyServiceAbstraction,
|
||||
@@ -37,9 +37,9 @@ import { closeTwoFactorAuthWebAuthnPopout } from "./utils/auth-popout-window";
|
||||
|
||||
@Component({
|
||||
selector: "app-two-factor",
|
||||
templateUrl: "two-factor.component.html",
|
||||
templateUrl: "two-factor-v1.component.html",
|
||||
})
|
||||
export class TwoFactorComponent extends BaseTwoFactorComponent implements OnInit, OnDestroy {
|
||||
export class TwoFactorComponentV1 extends BaseTwoFactorComponent implements OnInit, OnDestroy {
|
||||
private destroy$ = new Subject<void>();
|
||||
inPopout = BrowserPopupUtils.inPopout(window);
|
||||
|
||||
@@ -10,6 +10,10 @@ import {
|
||||
openTwoFactorAuthWebAuthnPopout,
|
||||
closeTwoFactorAuthWebAuthnPopout,
|
||||
closeSsoAuthResultPopout,
|
||||
openTwoFactorAuthEmailPopout,
|
||||
closeTwoFactorAuthEmailPopout,
|
||||
openTwoFactorAuthDuoPopout,
|
||||
closeTwoFactorAuthDuoPopout,
|
||||
} from "./auth-popout-window";
|
||||
|
||||
describe("AuthPopoutWindow", () => {
|
||||
@@ -124,4 +128,40 @@ describe("AuthPopoutWindow", () => {
|
||||
expect(closeSingleActionPopoutSpy).toHaveBeenCalledWith(AuthPopoutType.twoFactorAuthWebAuthn);
|
||||
});
|
||||
});
|
||||
|
||||
describe("openTwoFactorAuthEmailPopout", () => {
|
||||
it("opens a window that facilitates two factor authentication via email", async () => {
|
||||
await openTwoFactorAuthEmailPopout();
|
||||
|
||||
expect(openPopoutSpy).toHaveBeenCalledWith("popup/index.html#/2fa", {
|
||||
singleActionKey: AuthPopoutType.twoFactorAuthEmail,
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe("closeTwoFactorAuthEmailPopout", () => {
|
||||
it("closes the two-factor authentication email window", async () => {
|
||||
await closeTwoFactorAuthEmailPopout();
|
||||
|
||||
expect(closeSingleActionPopoutSpy).toHaveBeenCalledWith(AuthPopoutType.twoFactorAuthEmail);
|
||||
});
|
||||
});
|
||||
|
||||
describe("openTwoFactorAuthDuoPopout", () => {
|
||||
it("opens a window that facilitates two factor authentication via Duo", async () => {
|
||||
await openTwoFactorAuthDuoPopout();
|
||||
|
||||
expect(openPopoutSpy).toHaveBeenCalledWith("popup/index.html#/2fa", {
|
||||
singleActionKey: AuthPopoutType.twoFactorAuthDuo,
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe("closeTwoFactorAuthDuoPopout", () => {
|
||||
it("closes the two-factor authentication Duo window", async () => {
|
||||
await closeTwoFactorAuthDuoPopout();
|
||||
|
||||
expect(closeSingleActionPopoutSpy).toHaveBeenCalledWith(AuthPopoutType.twoFactorAuthDuo);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -7,7 +7,10 @@ const AuthPopoutType = {
|
||||
unlockExtension: "auth_unlockExtension",
|
||||
ssoAuthResult: "auth_ssoAuthResult",
|
||||
twoFactorAuthWebAuthn: "auth_twoFactorAuthWebAuthn",
|
||||
twoFactorAuthEmail: "auth_twoFactorAuthEmail",
|
||||
twoFactorAuthDuo: "auth_twoFactorAuthDuo",
|
||||
} as const;
|
||||
|
||||
const extensionUnlockUrls = new Set([
|
||||
chrome.runtime.getURL("popup/index.html#/lock"),
|
||||
chrome.runtime.getURL("popup/index.html#/home"),
|
||||
@@ -87,12 +90,44 @@ async function openTwoFactorAuthWebAuthnPopout(twoFactorAuthWebAuthnData: {
|
||||
}
|
||||
|
||||
/**
|
||||
* Closes the two-factor authentication popout window.
|
||||
* Closes the two-factor authentication WebAuthn popout window.
|
||||
*/
|
||||
async function closeTwoFactorAuthWebAuthnPopout() {
|
||||
await BrowserPopupUtils.closeSingleActionPopout(AuthPopoutType.twoFactorAuthWebAuthn);
|
||||
}
|
||||
|
||||
/**
|
||||
* Opens a popout that facilitates two-factor authentication via email.
|
||||
*/
|
||||
async function openTwoFactorAuthEmailPopout() {
|
||||
await BrowserPopupUtils.openPopout("popup/index.html#/2fa", {
|
||||
singleActionKey: AuthPopoutType.twoFactorAuthEmail,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Closes the two-factor authentication email popout window.
|
||||
*/
|
||||
async function closeTwoFactorAuthEmailPopout() {
|
||||
await BrowserPopupUtils.closeSingleActionPopout(AuthPopoutType.twoFactorAuthEmail);
|
||||
}
|
||||
|
||||
/**
|
||||
* Opens the two-factor authentication Duo popout.
|
||||
*/
|
||||
async function openTwoFactorAuthDuoPopout() {
|
||||
await BrowserPopupUtils.openPopout("popup/index.html#/2fa", {
|
||||
singleActionKey: AuthPopoutType.twoFactorAuthDuo,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Closes the two-factor authentication Duo popout.
|
||||
*/
|
||||
async function closeTwoFactorAuthDuoPopout() {
|
||||
await BrowserPopupUtils.closeSingleActionPopout(AuthPopoutType.twoFactorAuthDuo);
|
||||
}
|
||||
|
||||
export {
|
||||
AuthPopoutType,
|
||||
openUnlockPopout,
|
||||
@@ -101,4 +136,8 @@ export {
|
||||
closeSsoAuthResultPopout,
|
||||
openTwoFactorAuthWebAuthnPopout,
|
||||
closeTwoFactorAuthWebAuthnPopout,
|
||||
openTwoFactorAuthEmailPopout,
|
||||
closeTwoFactorAuthEmailPopout,
|
||||
openTwoFactorAuthDuoPopout,
|
||||
closeTwoFactorAuthDuoPopout,
|
||||
};
|
||||
|
||||
@@ -0,0 +1,189 @@
|
||||
import { MockProxy, mock } from "jest-mock-extended";
|
||||
|
||||
// Must mock modules before importing
|
||||
jest.mock("../popup/utils/auth-popout-window", () => {
|
||||
const originalModule = jest.requireActual("../popup/utils/auth-popout-window");
|
||||
|
||||
return {
|
||||
...originalModule, // avoid losing the original module's exports
|
||||
closeSsoAuthResultPopout: jest.fn(),
|
||||
closeTwoFactorAuthWebAuthnPopout: jest.fn(),
|
||||
closeTwoFactorAuthEmailPopout: jest.fn(),
|
||||
closeTwoFactorAuthDuoPopout: jest.fn(),
|
||||
};
|
||||
});
|
||||
|
||||
jest.mock("../../platform/popup/browser-popup-utils", () => ({
|
||||
inSingleActionPopout: jest.fn(),
|
||||
}));
|
||||
|
||||
import { DuoLaunchAction } from "@bitwarden/auth/angular";
|
||||
import { TwoFactorProviderType } from "@bitwarden/common/auth/enums/two-factor-provider-type";
|
||||
|
||||
import { BrowserApi } from "../../platform/browser/browser-api";
|
||||
import BrowserPopupUtils from "../../platform/popup/browser-popup-utils";
|
||||
import {
|
||||
AuthPopoutType,
|
||||
closeSsoAuthResultPopout,
|
||||
closeTwoFactorAuthDuoPopout,
|
||||
closeTwoFactorAuthEmailPopout,
|
||||
closeTwoFactorAuthWebAuthnPopout,
|
||||
} from "../popup/utils/auth-popout-window";
|
||||
|
||||
import { ExtensionTwoFactorAuthComponentService } from "./extension-two-factor-auth-component.service";
|
||||
|
||||
describe("ExtensionTwoFactorAuthComponentService", () => {
|
||||
let extensionTwoFactorAuthComponentService: ExtensionTwoFactorAuthComponentService;
|
||||
let window: MockProxy<Window>;
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
|
||||
window = mock<Window>();
|
||||
document.body.className = ""; // Reset any added classes between tests.
|
||||
|
||||
extensionTwoFactorAuthComponentService = new ExtensionTwoFactorAuthComponentService(window);
|
||||
});
|
||||
|
||||
describe("shouldCheckForWebAuthnQueryParamResponse", () => {
|
||||
it("should return true for the extension", () => {
|
||||
expect(
|
||||
extensionTwoFactorAuthComponentService.shouldCheckForWebAuthnQueryParamResponse(),
|
||||
).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe("extendPopupWidthIfRequired", () => {
|
||||
it("should add linux-webauthn class to body if selected2faProviderType is WebAuthn and isLinux is true", async () => {
|
||||
jest
|
||||
.spyOn(extensionTwoFactorAuthComponentService as unknown as any, "isLinux")
|
||||
.mockResolvedValue(true);
|
||||
|
||||
await extensionTwoFactorAuthComponentService.extendPopupWidthIfRequired(
|
||||
TwoFactorProviderType.WebAuthn,
|
||||
);
|
||||
expect(document.body.classList).toContain("linux-webauthn");
|
||||
});
|
||||
|
||||
it("should not add linux-webauthn class to body if selected2faProviderType is WebAuthn and isLinux is false", async () => {
|
||||
jest
|
||||
.spyOn(extensionTwoFactorAuthComponentService as unknown as any, "isLinux")
|
||||
.mockResolvedValue(false);
|
||||
|
||||
await extensionTwoFactorAuthComponentService.extendPopupWidthIfRequired(
|
||||
TwoFactorProviderType.WebAuthn,
|
||||
);
|
||||
expect(document.body.classList).not.toContain("linux-webauthn");
|
||||
});
|
||||
|
||||
it.each([
|
||||
[true, TwoFactorProviderType.Email],
|
||||
[false, TwoFactorProviderType.Email],
|
||||
])(
|
||||
"should not add linux-webauthn class to body if selected2faProviderType is not WebAuthn and isLinux is %s",
|
||||
async (isLinux, selected2faProviderType) => {
|
||||
jest
|
||||
.spyOn(extensionTwoFactorAuthComponentService as unknown as any, "isLinux")
|
||||
.mockResolvedValue(isLinux);
|
||||
|
||||
await extensionTwoFactorAuthComponentService.extendPopupWidthIfRequired(
|
||||
selected2faProviderType,
|
||||
);
|
||||
|
||||
expect(document.body.classList).not.toContain("linux-webauthn");
|
||||
},
|
||||
);
|
||||
});
|
||||
|
||||
describe("removePopupWidthExtension", () => {
|
||||
it("should remove linux-webauthn class from body", () => {
|
||||
document.body.classList.add("linux-webauthn");
|
||||
extensionTwoFactorAuthComponentService.removePopupWidthExtension();
|
||||
expect(document.body.classList).not.toContain("linux-webauthn");
|
||||
});
|
||||
});
|
||||
|
||||
describe("closeSingleActionPopouts", () => {
|
||||
it("should call closeSsoAuthResultPopout if in SSO auth result popout", async () => {
|
||||
const inSingleActionPopoutSpy = jest
|
||||
.spyOn(BrowserPopupUtils, "inSingleActionPopout")
|
||||
.mockImplementation((_, key) => {
|
||||
return key === AuthPopoutType.ssoAuthResult;
|
||||
});
|
||||
|
||||
await extensionTwoFactorAuthComponentService.closeSingleActionPopouts();
|
||||
|
||||
expect(inSingleActionPopoutSpy).toHaveBeenCalledTimes(1);
|
||||
expect(closeSsoAuthResultPopout).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("should call closeTwoFactorAuthWebAuthnPopout if in two factor auth webauthn popout", async () => {
|
||||
const inSingleActionPopoutSpy = jest
|
||||
.spyOn(BrowserPopupUtils, "inSingleActionPopout")
|
||||
.mockImplementation((_, key) => {
|
||||
return key === AuthPopoutType.twoFactorAuthWebAuthn;
|
||||
});
|
||||
|
||||
await extensionTwoFactorAuthComponentService.closeSingleActionPopouts();
|
||||
|
||||
expect(inSingleActionPopoutSpy).toHaveBeenCalledTimes(2);
|
||||
expect(closeTwoFactorAuthWebAuthnPopout).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("should call closeTwoFactorAuthEmailPopout if in two factor auth email popout", async () => {
|
||||
const inSingleActionPopoutSpy = jest
|
||||
.spyOn(BrowserPopupUtils, "inSingleActionPopout")
|
||||
.mockImplementation((_, key) => {
|
||||
return key === AuthPopoutType.twoFactorAuthEmail;
|
||||
});
|
||||
|
||||
await extensionTwoFactorAuthComponentService.closeSingleActionPopouts();
|
||||
|
||||
expect(inSingleActionPopoutSpy).toHaveBeenCalledTimes(3);
|
||||
expect(closeTwoFactorAuthEmailPopout).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("should call closeTwoFactorAuthDuoPopout if in two factor auth duo popout", async () => {
|
||||
const inSingleActionPopoutSpy = jest
|
||||
.spyOn(BrowserPopupUtils, "inSingleActionPopout")
|
||||
.mockImplementation((_, key) => {
|
||||
return key === AuthPopoutType.twoFactorAuthDuo;
|
||||
});
|
||||
|
||||
await extensionTwoFactorAuthComponentService.closeSingleActionPopouts();
|
||||
|
||||
expect(inSingleActionPopoutSpy).toHaveBeenCalledTimes(4);
|
||||
expect(closeTwoFactorAuthDuoPopout).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
describe("reloadOpenWindows", () => {
|
||||
it("should call reload open windows (exempting current)", async () => {
|
||||
const reloadOpenWindowsSpy = jest.spyOn(BrowserApi, "reloadOpenWindows").mockImplementation();
|
||||
|
||||
extensionTwoFactorAuthComponentService.reloadOpenWindows();
|
||||
|
||||
expect(reloadOpenWindowsSpy).toHaveBeenCalledWith(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe("determineDuoLaunchAction", () => {
|
||||
it("should return DIRECT_LAUNCH if in two factor auth duo popout", () => {
|
||||
jest.spyOn(BrowserPopupUtils, "inSingleActionPopout").mockImplementation((_, key) => {
|
||||
return key === AuthPopoutType.twoFactorAuthDuo;
|
||||
});
|
||||
|
||||
expect(extensionTwoFactorAuthComponentService.determineDuoLaunchAction()).toBe(
|
||||
DuoLaunchAction.DIRECT_LAUNCH,
|
||||
);
|
||||
});
|
||||
|
||||
it("should return SINGLE_ACTION_POPOUT if not in two factor auth duo popout", () => {
|
||||
jest.spyOn(BrowserPopupUtils, "inSingleActionPopout").mockImplementation(() => false);
|
||||
|
||||
expect(extensionTwoFactorAuthComponentService.determineDuoLaunchAction()).toBe(
|
||||
DuoLaunchAction.SINGLE_ACTION_POPOUT,
|
||||
);
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,115 @@
|
||||
import {
|
||||
DefaultTwoFactorAuthComponentService,
|
||||
DuoLaunchAction,
|
||||
TwoFactorAuthComponentService,
|
||||
} from "@bitwarden/auth/angular";
|
||||
import { TwoFactorProviderType } from "@bitwarden/common/auth/enums/two-factor-provider-type";
|
||||
|
||||
import { BrowserApi } from "../../platform/browser/browser-api";
|
||||
import BrowserPopupUtils from "../../platform/popup/browser-popup-utils";
|
||||
import {
|
||||
AuthPopoutType,
|
||||
closeSsoAuthResultPopout,
|
||||
closeTwoFactorAuthDuoPopout,
|
||||
closeTwoFactorAuthEmailPopout,
|
||||
closeTwoFactorAuthWebAuthnPopout,
|
||||
} from "../popup/utils/auth-popout-window";
|
||||
|
||||
export class ExtensionTwoFactorAuthComponentService
|
||||
extends DefaultTwoFactorAuthComponentService
|
||||
implements TwoFactorAuthComponentService
|
||||
{
|
||||
constructor(private window: Window) {
|
||||
super();
|
||||
}
|
||||
|
||||
shouldCheckForWebAuthnQueryParamResponse(): boolean {
|
||||
return true;
|
||||
}
|
||||
|
||||
async extendPopupWidthIfRequired(selected2faProviderType: TwoFactorProviderType): Promise<void> {
|
||||
// WebAuthn prompt appears inside the popup on linux, and requires a larger popup width
|
||||
// than usual to avoid cutting off the dialog.
|
||||
const isLinux = await this.isLinux();
|
||||
if (selected2faProviderType === TwoFactorProviderType.WebAuthn && isLinux) {
|
||||
document.body.classList.add("linux-webauthn");
|
||||
}
|
||||
}
|
||||
|
||||
removePopupWidthExtension(): void {
|
||||
document.body.classList.remove("linux-webauthn");
|
||||
}
|
||||
|
||||
reloadOpenWindows(): void {
|
||||
// Force sidebars (FF && Opera) to reload while exempting current window
|
||||
// because we are just going to close the current window if it is in a popout
|
||||
// or navigate forward if it is in the popup
|
||||
BrowserApi.reloadOpenWindows(true);
|
||||
}
|
||||
|
||||
async closeSingleActionPopouts(): Promise<boolean> {
|
||||
// If we are in a single action popout, we don't need the popout anymore because the intent
|
||||
// is for the user to be left on the web vault screen which tells them to continue in
|
||||
// the browser extension (sidebar or popup). We don't want the user to be left with a
|
||||
// floating, popped out extension which could be lost behind another window or minimized.
|
||||
// Currently, the popped out window thinks it is active and wouldn't time out which
|
||||
// leads to the security concern. So, we close the popped out extension to avoid this.
|
||||
const inSsoAuthResultPopout = BrowserPopupUtils.inSingleActionPopout(
|
||||
this.window,
|
||||
AuthPopoutType.ssoAuthResult,
|
||||
);
|
||||
if (inSsoAuthResultPopout) {
|
||||
await closeSsoAuthResultPopout();
|
||||
return true;
|
||||
}
|
||||
|
||||
const inTwoFactorAuthWebAuthnPopout = BrowserPopupUtils.inSingleActionPopout(
|
||||
this.window,
|
||||
AuthPopoutType.twoFactorAuthWebAuthn,
|
||||
);
|
||||
|
||||
if (inTwoFactorAuthWebAuthnPopout) {
|
||||
await closeTwoFactorAuthWebAuthnPopout();
|
||||
return true;
|
||||
}
|
||||
|
||||
const inTwoFactorAuthEmailPopout = BrowserPopupUtils.inSingleActionPopout(
|
||||
this.window,
|
||||
AuthPopoutType.twoFactorAuthEmail,
|
||||
);
|
||||
|
||||
if (inTwoFactorAuthEmailPopout) {
|
||||
await closeTwoFactorAuthEmailPopout();
|
||||
return true;
|
||||
}
|
||||
|
||||
const inTwoFactorAuthDuoPopout = BrowserPopupUtils.inSingleActionPopout(
|
||||
this.window,
|
||||
AuthPopoutType.twoFactorAuthDuo,
|
||||
);
|
||||
if (inTwoFactorAuthDuoPopout) {
|
||||
await closeTwoFactorAuthDuoPopout();
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
private async isLinux(): Promise<boolean> {
|
||||
const platformInfo = await BrowserApi.getPlatformInfo();
|
||||
return platformInfo.os === "linux";
|
||||
}
|
||||
|
||||
determineDuoLaunchAction(): DuoLaunchAction {
|
||||
const inTwoFactorAuthDuoPopout = BrowserPopupUtils.inSingleActionPopout(
|
||||
this.window,
|
||||
AuthPopoutType.twoFactorAuthDuo,
|
||||
);
|
||||
|
||||
if (inTwoFactorAuthDuoPopout) {
|
||||
return DuoLaunchAction.DIRECT_LAUNCH;
|
||||
}
|
||||
|
||||
return DuoLaunchAction.SINGLE_ACTION_POPOUT;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
import { MockProxy, mock } from "jest-mock-extended";
|
||||
import { BehaviorSubject, firstValueFrom } from "rxjs";
|
||||
|
||||
import {
|
||||
Environment,
|
||||
EnvironmentService,
|
||||
} from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
|
||||
import { ZonedMessageListenerService } from "../../platform/browser/zoned-message-listener.service";
|
||||
import I18nService from "../../platform/services/i18n.service";
|
||||
|
||||
import { ExtensionTwoFactorAuthDuoComponentService } from "./extension-two-factor-auth-duo-component.service";
|
||||
|
||||
describe("ExtensionTwoFactorAuthDuoComponentService", () => {
|
||||
let extensionTwoFactorAuthDuoComponentService: ExtensionTwoFactorAuthDuoComponentService;
|
||||
let browserMessagingApi: MockProxy<ZonedMessageListenerService>;
|
||||
let environmentService: MockProxy<EnvironmentService>;
|
||||
let i18nService: MockProxy<I18nService>;
|
||||
let platformUtilsService: MockProxy<PlatformUtilsService>;
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
|
||||
browserMessagingApi = mock<ZonedMessageListenerService>();
|
||||
environmentService = mock<EnvironmentService>();
|
||||
i18nService = mock<I18nService>();
|
||||
platformUtilsService = mock<PlatformUtilsService>();
|
||||
|
||||
extensionTwoFactorAuthDuoComponentService = new ExtensionTwoFactorAuthDuoComponentService(
|
||||
browserMessagingApi,
|
||||
environmentService,
|
||||
i18nService,
|
||||
platformUtilsService,
|
||||
);
|
||||
});
|
||||
|
||||
describe("listenForDuo2faResult$", () => {
|
||||
it("should return an observable that emits a duo 2FA result when a duo result message is received", async () => {
|
||||
const message = {
|
||||
command: "duoResult",
|
||||
code: "123456",
|
||||
state: "abcdef",
|
||||
};
|
||||
const expectedDuo2faResult = {
|
||||
code: message.code,
|
||||
state: message.state,
|
||||
token: `${message.code}|${message.state}`,
|
||||
};
|
||||
|
||||
const messageStream$ = new BehaviorSubject(message);
|
||||
browserMessagingApi.messageListener$.mockReturnValue(messageStream$);
|
||||
|
||||
const duo2faResult = await firstValueFrom(
|
||||
extensionTwoFactorAuthDuoComponentService.listenForDuo2faResult$(),
|
||||
);
|
||||
expect(duo2faResult).toEqual(expectedDuo2faResult);
|
||||
});
|
||||
});
|
||||
|
||||
describe("launchDuoFrameless", () => {
|
||||
it("should launch the duo frameless url", async () => {
|
||||
// Arrange
|
||||
const duoFramelessUrl = "https://duoFramelessUrl";
|
||||
const webVaultUrl = "https://webVaultUrl";
|
||||
|
||||
i18nService.t.mockImplementation((key) => key);
|
||||
|
||||
const launchUrl = `${webVaultUrl}/duo-redirect-connector.html?duoFramelessUrl=${encodeURIComponent(
|
||||
duoFramelessUrl,
|
||||
)}&handOffMessage=${encodeURIComponent(
|
||||
JSON.stringify({
|
||||
title: "youSuccessfullyLoggedIn",
|
||||
message: "youMayCloseThisWindow",
|
||||
isCountdown: false,
|
||||
}),
|
||||
)}`;
|
||||
|
||||
const mockEnvironment = {
|
||||
getWebVaultUrl: () => webVaultUrl,
|
||||
} as unknown as Environment;
|
||||
|
||||
const environmentBSubject = new BehaviorSubject(mockEnvironment);
|
||||
environmentService.environment$ = environmentBSubject.asObservable();
|
||||
|
||||
// Act
|
||||
await extensionTwoFactorAuthDuoComponentService.launchDuoFrameless(duoFramelessUrl);
|
||||
|
||||
// Assert
|
||||
expect(platformUtilsService.launchUri).toHaveBeenCalledWith(launchUrl);
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,62 @@
|
||||
import { filter, firstValueFrom, map, Observable } from "rxjs";
|
||||
|
||||
import { Duo2faResult, TwoFactorAuthDuoComponentService } from "@bitwarden/auth/angular";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
|
||||
import { openTwoFactorAuthDuoPopout } from "../../auth/popup/utils/auth-popout-window";
|
||||
import { ZonedMessageListenerService } from "../../platform/browser/zoned-message-listener.service";
|
||||
|
||||
interface Message {
|
||||
command: string;
|
||||
code: string;
|
||||
state: string;
|
||||
}
|
||||
|
||||
export class ExtensionTwoFactorAuthDuoComponentService implements TwoFactorAuthDuoComponentService {
|
||||
constructor(
|
||||
private browserMessagingApi: ZonedMessageListenerService,
|
||||
private environmentService: EnvironmentService,
|
||||
private i18nService: I18nService,
|
||||
private platformUtilsService: PlatformUtilsService,
|
||||
) {}
|
||||
listenForDuo2faResult$(): Observable<Duo2faResult> {
|
||||
return this.browserMessagingApi.messageListener$().pipe(
|
||||
filter((msg): msg is Message => {
|
||||
return (msg as Message).command === "duoResult";
|
||||
}),
|
||||
map((msg: Message) => {
|
||||
return {
|
||||
code: msg.code,
|
||||
state: msg.state,
|
||||
token: `${msg.code}|${msg.state}`,
|
||||
} as Duo2faResult;
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
async launchDuoFrameless(duoFramelessUrl: string): Promise<void> {
|
||||
const duoHandOffMessage = {
|
||||
title: this.i18nService.t("youSuccessfullyLoggedIn"),
|
||||
message: this.i18nService.t("youMayCloseThisWindow"),
|
||||
isCountdown: false,
|
||||
};
|
||||
|
||||
// we're using the connector here as a way to set a cookie with translations
|
||||
// before continuing to the duo frameless url
|
||||
const env = await firstValueFrom(this.environmentService.environment$);
|
||||
const launchUrl =
|
||||
env.getWebVaultUrl() +
|
||||
"/duo-redirect-connector.html" +
|
||||
"?duoFramelessUrl=" +
|
||||
encodeURIComponent(duoFramelessUrl) +
|
||||
"&handOffMessage=" +
|
||||
encodeURIComponent(JSON.stringify(duoHandOffMessage));
|
||||
this.platformUtilsService.launchUri(launchUrl);
|
||||
}
|
||||
|
||||
async openTwoFactorAuthDuoPopout(): Promise<void> {
|
||||
await openTwoFactorAuthDuoPopout();
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,93 @@
|
||||
import { MockProxy, mock } from "jest-mock-extended";
|
||||
|
||||
import { DialogService } from "@bitwarden/components";
|
||||
|
||||
// Must mock modules before importing
|
||||
jest.mock("../popup/utils/auth-popout-window", () => {
|
||||
const originalModule = jest.requireActual("../popup/utils/auth-popout-window");
|
||||
|
||||
return {
|
||||
...originalModule, // avoid losing the original module's exports
|
||||
openTwoFactorAuthEmailPopout: jest.fn(),
|
||||
};
|
||||
});
|
||||
|
||||
jest.mock("../../platform/popup/browser-popup-utils", () => ({
|
||||
inPopup: jest.fn(),
|
||||
}));
|
||||
|
||||
import { openTwoFactorAuthEmailPopout } from "../../auth/popup/utils/auth-popout-window";
|
||||
import BrowserPopupUtils from "../../platform/popup/browser-popup-utils";
|
||||
|
||||
import { ExtensionTwoFactorAuthEmailComponentService } from "./extension-two-factor-auth-email-component.service";
|
||||
|
||||
describe("ExtensionTwoFactorAuthEmailComponentService", () => {
|
||||
let extensionTwoFactorAuthEmailComponentService: ExtensionTwoFactorAuthEmailComponentService;
|
||||
|
||||
let dialogService: MockProxy<DialogService>;
|
||||
let window: MockProxy<Window>;
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
|
||||
dialogService = mock<DialogService>();
|
||||
window = mock<Window>();
|
||||
|
||||
extensionTwoFactorAuthEmailComponentService = new ExtensionTwoFactorAuthEmailComponentService(
|
||||
dialogService,
|
||||
window,
|
||||
);
|
||||
});
|
||||
|
||||
describe("openPopoutIfApprovedForEmail2fa", () => {
|
||||
it("should open a popout if the user confirms the warning to popout the extension when in the popup", async () => {
|
||||
// Arrange
|
||||
dialogService.openSimpleDialog.mockResolvedValue(true);
|
||||
|
||||
jest.spyOn(BrowserPopupUtils, "inPopup").mockReturnValue(true);
|
||||
|
||||
// Act
|
||||
await extensionTwoFactorAuthEmailComponentService.openPopoutIfApprovedForEmail2fa();
|
||||
|
||||
// Assert
|
||||
expect(dialogService.openSimpleDialog).toHaveBeenCalledWith({
|
||||
title: { key: "warning" },
|
||||
content: { key: "popup2faCloseMessage" },
|
||||
type: "warning",
|
||||
});
|
||||
|
||||
expect(openTwoFactorAuthEmailPopout).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("should not open a popout if the user cancels the warning to popout the extension when in the popup", async () => {
|
||||
// Arrange
|
||||
dialogService.openSimpleDialog.mockResolvedValue(false);
|
||||
|
||||
jest.spyOn(BrowserPopupUtils, "inPopup").mockReturnValue(true);
|
||||
|
||||
// Act
|
||||
await extensionTwoFactorAuthEmailComponentService.openPopoutIfApprovedForEmail2fa();
|
||||
|
||||
// Assert
|
||||
expect(dialogService.openSimpleDialog).toHaveBeenCalledWith({
|
||||
title: { key: "warning" },
|
||||
content: { key: "popup2faCloseMessage" },
|
||||
type: "warning",
|
||||
});
|
||||
|
||||
expect(openTwoFactorAuthEmailPopout).not.toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it("should not open a popout if not in the popup", async () => {
|
||||
// Arrange
|
||||
jest.spyOn(BrowserPopupUtils, "inPopup").mockReturnValue(false);
|
||||
|
||||
// Act
|
||||
await extensionTwoFactorAuthEmailComponentService.openPopoutIfApprovedForEmail2fa();
|
||||
|
||||
// Assert
|
||||
expect(dialogService.openSimpleDialog).not.toHaveBeenCalled();
|
||||
expect(openTwoFactorAuthEmailPopout).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,35 @@
|
||||
import {
|
||||
DefaultTwoFactorAuthEmailComponentService,
|
||||
TwoFactorAuthEmailComponentService,
|
||||
} from "@bitwarden/auth/angular";
|
||||
import { DialogService } from "@bitwarden/components";
|
||||
|
||||
import { openTwoFactorAuthEmailPopout } from "../../auth/popup/utils/auth-popout-window";
|
||||
import BrowserPopupUtils from "../../platform/popup/browser-popup-utils";
|
||||
|
||||
// TODO: popup state persistence should eventually remove the need for this service
|
||||
export class ExtensionTwoFactorAuthEmailComponentService
|
||||
extends DefaultTwoFactorAuthEmailComponentService
|
||||
implements TwoFactorAuthEmailComponentService
|
||||
{
|
||||
constructor(
|
||||
private dialogService: DialogService,
|
||||
private window: Window,
|
||||
) {
|
||||
super();
|
||||
}
|
||||
|
||||
async openPopoutIfApprovedForEmail2fa(): Promise<void> {
|
||||
if (BrowserPopupUtils.inPopup(this.window)) {
|
||||
const confirmed = await this.dialogService.openSimpleDialog({
|
||||
title: { key: "warning" },
|
||||
content: { key: "popup2faCloseMessage" },
|
||||
type: "warning",
|
||||
});
|
||||
if (confirmed) {
|
||||
await openTwoFactorAuthEmailPopout();
|
||||
this.window.close();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,44 @@
|
||||
import { MockProxy, mock } from "jest-mock-extended";
|
||||
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
|
||||
import { ExtensionTwoFactorAuthWebAuthnComponentService } from "./extension-two-factor-auth-webauthn-component.service";
|
||||
|
||||
describe("ExtensionTwoFactorAuthWebAuthnComponentService", () => {
|
||||
let extensionTwoFactorAuthWebAuthnComponentService: ExtensionTwoFactorAuthWebAuthnComponentService;
|
||||
|
||||
let platformUtilsService: MockProxy<PlatformUtilsService>;
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
|
||||
platformUtilsService = mock<PlatformUtilsService>();
|
||||
|
||||
extensionTwoFactorAuthWebAuthnComponentService =
|
||||
new ExtensionTwoFactorAuthWebAuthnComponentService(platformUtilsService);
|
||||
});
|
||||
|
||||
describe("shouldOpenWebAuthnInNewTab", () => {
|
||||
it("should return false if the browser is Chrome", () => {
|
||||
// Arrange
|
||||
platformUtilsService.isChrome.mockReturnValue(true);
|
||||
|
||||
// Act
|
||||
const result = extensionTwoFactorAuthWebAuthnComponentService.shouldOpenWebAuthnInNewTab();
|
||||
|
||||
// Assert
|
||||
expect(result).toBe(false);
|
||||
});
|
||||
|
||||
it("should return true if the browser is not Chrome", () => {
|
||||
// Arrange
|
||||
platformUtilsService.isChrome.mockReturnValue(false);
|
||||
|
||||
// Act
|
||||
const result = extensionTwoFactorAuthWebAuthnComponentService.shouldOpenWebAuthnInNewTab();
|
||||
|
||||
// Assert
|
||||
expect(result).toBe(true);
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,30 @@
|
||||
import {
|
||||
DefaultTwoFactorAuthWebAuthnComponentService,
|
||||
TwoFactorAuthWebAuthnComponentService,
|
||||
} from "@bitwarden/auth/angular";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
|
||||
export class ExtensionTwoFactorAuthWebAuthnComponentService
|
||||
extends DefaultTwoFactorAuthWebAuthnComponentService
|
||||
implements TwoFactorAuthWebAuthnComponentService
|
||||
{
|
||||
constructor(private platformUtilsService: PlatformUtilsService) {
|
||||
super();
|
||||
}
|
||||
|
||||
/**
|
||||
* In the browser extension, we open webAuthn in a new web client tab sometimes due to inline
|
||||
* WebAuthn Iframe's not working in some browsers. We open a 2FA popout upon successful
|
||||
* completion of WebAuthn submission with query parameters to finish the 2FA process.
|
||||
* @returns boolean
|
||||
*/
|
||||
shouldOpenWebAuthnInNewTab(): boolean {
|
||||
const isChrome = this.platformUtilsService.isChrome();
|
||||
if (isChrome) {
|
||||
// Chrome now supports WebAuthn in the iframe in the extension now.
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
}
|
||||
@@ -18,19 +18,16 @@ import {
|
||||
unauthGuardFn,
|
||||
} from "@bitwarden/angular/auth/guards";
|
||||
import { canAccessFeature } from "@bitwarden/angular/platform/guard/feature-flag.guard";
|
||||
import { twofactorRefactorSwap } from "@bitwarden/angular/utils/two-factor-component-refactor-route-swap";
|
||||
import { NewDeviceVerificationNoticeGuard } from "@bitwarden/angular/vault/guards";
|
||||
import {
|
||||
AnonLayoutWrapperComponent,
|
||||
AnonLayoutWrapperData,
|
||||
DevicesIcon,
|
||||
DeviceVerificationIcon,
|
||||
LockIcon,
|
||||
LoginComponent,
|
||||
LoginDecryptionOptionsComponent,
|
||||
LoginSecondaryContentComponent,
|
||||
LoginViaAuthRequestComponent,
|
||||
NewDeviceVerificationComponent,
|
||||
PasswordHintComponent,
|
||||
RegistrationFinishComponent,
|
||||
RegistrationLockAltIcon,
|
||||
@@ -41,6 +38,10 @@ import {
|
||||
SetPasswordJitComponent,
|
||||
SsoComponent,
|
||||
TwoFactorTimeoutIcon,
|
||||
TwoFactorAuthComponent,
|
||||
TwoFactorAuthGuard,
|
||||
NewDeviceVerificationComponent,
|
||||
DeviceVerificationIcon,
|
||||
UserLockIcon,
|
||||
VaultIcon,
|
||||
} from "@bitwarden/auth/angular";
|
||||
@@ -68,9 +69,8 @@ import { RemovePasswordComponent } from "../auth/popup/remove-password.component
|
||||
import { SetPasswordComponent } from "../auth/popup/set-password.component";
|
||||
import { AccountSecurityComponent } from "../auth/popup/settings/account-security.component";
|
||||
import { SsoComponentV1 } from "../auth/popup/sso-v1.component";
|
||||
import { TwoFactorAuthComponent } from "../auth/popup/two-factor-auth.component";
|
||||
import { TwoFactorOptionsComponent } from "../auth/popup/two-factor-options.component";
|
||||
import { TwoFactorComponent } from "../auth/popup/two-factor.component";
|
||||
import { TwoFactorOptionsComponentV1 } from "../auth/popup/two-factor-options-v1.component";
|
||||
import { TwoFactorComponentV1 } from "../auth/popup/two-factor-v1.component";
|
||||
import { UpdateTempPasswordComponent } from "../auth/popup/update-temp-password.component";
|
||||
import { Fido2Component } from "../autofill/popup/fido2/fido2.component";
|
||||
import { AutofillComponent } from "../autofill/popup/settings/autofill.component";
|
||||
@@ -153,9 +153,9 @@ const routes: Routes = [
|
||||
canActivate: [fido2AuthGuard],
|
||||
data: { elevation: 1 } satisfies RouteDataProperties,
|
||||
},
|
||||
...twofactorRefactorSwap(
|
||||
TwoFactorComponent,
|
||||
AnonLayoutWrapperComponent,
|
||||
...unauthUiRefreshSwap(
|
||||
TwoFactorComponentV1,
|
||||
ExtensionAnonLayoutWrapperComponent,
|
||||
{
|
||||
path: "2fa",
|
||||
canActivate: [unauthGuardFn(unauthRouteOverrides)],
|
||||
@@ -163,14 +163,20 @@ const routes: Routes = [
|
||||
},
|
||||
{
|
||||
path: "2fa",
|
||||
canActivate: [unauthGuardFn(unauthRouteOverrides)],
|
||||
data: { elevation: 1 } satisfies RouteDataProperties,
|
||||
canActivate: [unauthGuardFn(unauthRouteOverrides), TwoFactorAuthGuard],
|
||||
children: [
|
||||
{
|
||||
path: "",
|
||||
component: TwoFactorAuthComponent,
|
||||
},
|
||||
],
|
||||
data: {
|
||||
elevation: 1,
|
||||
pageTitle: {
|
||||
key: "verifyIdentity",
|
||||
},
|
||||
showBackButton: true,
|
||||
} satisfies RouteDataProperties & ExtensionAnonLayoutWrapperData,
|
||||
},
|
||||
),
|
||||
{
|
||||
@@ -198,7 +204,7 @@ const routes: Routes = [
|
||||
},
|
||||
{
|
||||
path: "2fa-options",
|
||||
component: TwoFactorOptionsComponent,
|
||||
component: TwoFactorOptionsComponentV1,
|
||||
canActivate: [unauthGuardFn(unauthRouteOverrides)],
|
||||
data: { elevation: 1 } satisfies RouteDataProperties,
|
||||
},
|
||||
|
||||
@@ -31,8 +31,8 @@ import { SetPasswordComponent } from "../auth/popup/set-password.component";
|
||||
import { AccountSecurityComponent } from "../auth/popup/settings/account-security.component";
|
||||
import { VaultTimeoutInputComponent } from "../auth/popup/settings/vault-timeout-input.component";
|
||||
import { SsoComponentV1 } from "../auth/popup/sso-v1.component";
|
||||
import { TwoFactorOptionsComponent } from "../auth/popup/two-factor-options.component";
|
||||
import { TwoFactorComponent } from "../auth/popup/two-factor.component";
|
||||
import { TwoFactorOptionsComponentV1 } from "../auth/popup/two-factor-options-v1.component";
|
||||
import { TwoFactorComponentV1 } from "../auth/popup/two-factor-v1.component";
|
||||
import { UpdateTempPasswordComponent } from "../auth/popup/update-temp-password.component";
|
||||
import { AutofillComponent } from "../autofill/popup/settings/autofill.component";
|
||||
import { NotificationsSettingsComponent } from "../autofill/popup/settings/notifications.component";
|
||||
@@ -105,8 +105,8 @@ import "../platform/popup/locales";
|
||||
SetPasswordComponent,
|
||||
SsoComponentV1,
|
||||
TabsV2Component,
|
||||
TwoFactorComponent,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorComponentV1,
|
||||
TwoFactorOptionsComponentV1,
|
||||
UpdateTempPasswordComponent,
|
||||
UserVerificationComponent,
|
||||
VaultTimeoutInputComponent,
|
||||
|
||||
@@ -211,15 +211,13 @@ p.lead {
|
||||
}
|
||||
|
||||
#web-authn-frame {
|
||||
background: url("../images/loading.svg") 0 0 no-repeat;
|
||||
width: 100%;
|
||||
height: 310px;
|
||||
margin-bottom: -10px;
|
||||
height: 40px;
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -19,12 +19,17 @@ import {
|
||||
SafeInjectionToken,
|
||||
SECURE_STORAGE,
|
||||
SYSTEM_THEME_OBSERVABLE,
|
||||
WINDOW,
|
||||
} from "@bitwarden/angular/services/injection-tokens";
|
||||
import { JslibServicesModule } from "@bitwarden/angular/services/jslib-services.module";
|
||||
import {
|
||||
AnonLayoutWrapperDataService,
|
||||
LoginComponentService,
|
||||
LoginDecryptionOptionsService,
|
||||
TwoFactorAuthComponentService,
|
||||
TwoFactorAuthEmailComponentService,
|
||||
TwoFactorAuthDuoComponentService,
|
||||
TwoFactorAuthWebAuthnComponentService,
|
||||
SsoComponentService,
|
||||
} from "@bitwarden/auth/angular";
|
||||
import {
|
||||
@@ -129,6 +134,10 @@ import { ExtensionAnonLayoutWrapperDataService } from "../../auth/popup/extensio
|
||||
import { ExtensionLoginComponentService } from "../../auth/popup/login/extension-login-component.service";
|
||||
import { ExtensionSsoComponentService } from "../../auth/popup/login/extension-sso-component.service";
|
||||
import { ExtensionLoginDecryptionOptionsService } from "../../auth/popup/login-decryption-options/extension-login-decryption-options.service";
|
||||
import { ExtensionTwoFactorAuthComponentService } from "../../auth/services/extension-two-factor-auth-component.service";
|
||||
import { ExtensionTwoFactorAuthDuoComponentService } from "../../auth/services/extension-two-factor-auth-duo-component.service";
|
||||
import { ExtensionTwoFactorAuthEmailComponentService } from "../../auth/services/extension-two-factor-auth-email-component.service";
|
||||
import { ExtensionTwoFactorAuthWebAuthnComponentService } from "../../auth/services/extension-two-factor-auth-webauthn-component.service";
|
||||
import { AutofillService as AutofillServiceAbstraction } from "../../autofill/services/abstractions/autofill.service";
|
||||
import AutofillService from "../../autofill/services/autofill.service";
|
||||
import { InlineMenuFieldQualificationService } from "../../autofill/services/inline-menu-field-qualification.service";
|
||||
@@ -137,6 +146,7 @@ import { ExtensionLockComponentService } from "../../key-management/lock/service
|
||||
import { BrowserApi } from "../../platform/browser/browser-api";
|
||||
import { runInsideAngular } from "../../platform/browser/run-inside-angular.operator";
|
||||
/* eslint-disable no-restricted-imports */
|
||||
import { ZonedMessageListenerService } from "../../platform/browser/zoned-message-listener.service";
|
||||
import { ChromeMessageSender } from "../../platform/messaging/chrome-message.sender";
|
||||
/* eslint-enable no-restricted-imports */
|
||||
import { OffscreenDocumentService } from "../../platform/offscreen-document/abstractions/offscreen-document";
|
||||
@@ -531,6 +541,32 @@ const safeProviders: SafeProvider[] = [
|
||||
useClass: ExtensionLockComponentService,
|
||||
deps: [],
|
||||
}),
|
||||
// TODO: PM-18182 - Refactor component services into lazy loaded modules
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthComponentService,
|
||||
useClass: ExtensionTwoFactorAuthComponentService,
|
||||
deps: [WINDOW],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthEmailComponentService,
|
||||
useClass: ExtensionTwoFactorAuthEmailComponentService,
|
||||
deps: [DialogService, WINDOW],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthWebAuthnComponentService,
|
||||
useClass: ExtensionTwoFactorAuthWebAuthnComponentService,
|
||||
deps: [PlatformUtilsService],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthDuoComponentService,
|
||||
useClass: ExtensionTwoFactorAuthDuoComponentService,
|
||||
deps: [
|
||||
ZonedMessageListenerService,
|
||||
EnvironmentService,
|
||||
I18nServiceAbstraction,
|
||||
PlatformUtilsService,
|
||||
],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: Fido2UserVerificationService,
|
||||
useClass: Fido2UserVerificationService,
|
||||
|
||||
@@ -16,7 +16,6 @@ import {
|
||||
unauthGuardFn,
|
||||
} from "@bitwarden/angular/auth/guards";
|
||||
import { canAccessFeature } from "@bitwarden/angular/platform/guard/feature-flag.guard";
|
||||
import { twofactorRefactorSwap } from "@bitwarden/angular/utils/two-factor-component-refactor-route-swap";
|
||||
import { NewDeviceVerificationNoticeGuard } from "@bitwarden/angular/vault/guards";
|
||||
import {
|
||||
AnonLayoutWrapperComponent,
|
||||
@@ -39,6 +38,8 @@ import {
|
||||
DevicesIcon,
|
||||
SsoComponent,
|
||||
TwoFactorTimeoutIcon,
|
||||
TwoFactorAuthComponent,
|
||||
TwoFactorAuthGuard,
|
||||
NewDeviceVerificationComponent,
|
||||
DeviceVerificationIcon,
|
||||
} from "@bitwarden/auth/angular";
|
||||
@@ -59,8 +60,7 @@ import { LoginViaAuthRequestComponentV1 } from "../auth/login/login-via-auth-req
|
||||
import { RemovePasswordComponent } from "../auth/remove-password.component";
|
||||
import { SetPasswordComponent } from "../auth/set-password.component";
|
||||
import { SsoComponentV1 } from "../auth/sso-v1.component";
|
||||
import { TwoFactorAuthComponent } from "../auth/two-factor-auth.component";
|
||||
import { TwoFactorComponent } from "../auth/two-factor.component";
|
||||
import { TwoFactorComponentV1 } from "../auth/two-factor-v1.component";
|
||||
import { UpdateTempPasswordComponent } from "../auth/update-temp-password.component";
|
||||
import { VaultComponent } from "../vault/app/vault/vault.component";
|
||||
|
||||
@@ -82,22 +82,26 @@ const routes: Routes = [
|
||||
children: [], // Children lets us have an empty component.
|
||||
canActivate: [redirectGuard({ loggedIn: "/vault", loggedOut: "/login", locked: "/lock" })],
|
||||
},
|
||||
...twofactorRefactorSwap(
|
||||
TwoFactorComponent,
|
||||
...unauthUiRefreshSwap(
|
||||
TwoFactorComponentV1,
|
||||
AnonLayoutWrapperComponent,
|
||||
{
|
||||
path: "2fa",
|
||||
},
|
||||
{
|
||||
path: "2fa",
|
||||
component: AnonLayoutWrapperComponent,
|
||||
canActivate: [unauthGuardFn(), TwoFactorAuthGuard],
|
||||
children: [
|
||||
{
|
||||
path: "",
|
||||
component: TwoFactorAuthComponent,
|
||||
canActivate: [unauthGuardFn()],
|
||||
},
|
||||
],
|
||||
data: {
|
||||
pageTitle: {
|
||||
key: "verifyIdentity",
|
||||
},
|
||||
} satisfies RouteDataProperties & AnonLayoutWrapperData,
|
||||
},
|
||||
),
|
||||
{
|
||||
|
||||
@@ -18,8 +18,8 @@ import { LoginModule } from "../auth/login/login.module";
|
||||
import { RemovePasswordComponent } from "../auth/remove-password.component";
|
||||
import { SetPasswordComponent } from "../auth/set-password.component";
|
||||
import { SsoComponentV1 } from "../auth/sso-v1.component";
|
||||
import { TwoFactorOptionsComponent } from "../auth/two-factor-options.component";
|
||||
import { TwoFactorComponent } from "../auth/two-factor.component";
|
||||
import { TwoFactorOptionsComponentV1 } from "../auth/two-factor-options-v1.component";
|
||||
import { TwoFactorComponentV1 } from "../auth/two-factor-v1.component";
|
||||
import { UpdateTempPasswordComponent } from "../auth/update-temp-password.component";
|
||||
import { PremiumComponent } from "../billing/app/accounts/premium.component";
|
||||
import { SshAgentService } from "../platform/services/ssh-agent.service";
|
||||
@@ -86,9 +86,9 @@ import { SendComponent } from "./tools/send/send.component";
|
||||
SetPasswordComponent,
|
||||
SettingsComponent,
|
||||
ShareComponent,
|
||||
TwoFactorComponentV1,
|
||||
SsoComponentV1,
|
||||
TwoFactorComponent,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorOptionsComponentV1,
|
||||
UpdateTempPasswordComponent,
|
||||
VaultComponent,
|
||||
VaultTimeoutInputComponent,
|
||||
|
||||
@@ -26,6 +26,7 @@ import {
|
||||
SetPasswordJitService,
|
||||
SsoComponentService,
|
||||
DefaultSsoComponentService,
|
||||
TwoFactorAuthDuoComponentService,
|
||||
} from "@bitwarden/auth/angular";
|
||||
import {
|
||||
InternalUserDecryptionOptionsServiceAbstraction,
|
||||
@@ -103,6 +104,7 @@ import { LockComponentService } from "@bitwarden/key-management-ui";
|
||||
|
||||
import { DesktopLoginApprovalComponentService } from "../../auth/login/desktop-login-approval-component.service";
|
||||
import { DesktopLoginComponentService } from "../../auth/login/desktop-login-component.service";
|
||||
import { DesktopTwoFactorAuthDuoComponentService } from "../../auth/services/desktop-two-factor-auth-duo-component.service";
|
||||
import { DesktopAutofillSettingsService } from "../../autofill/services/desktop-autofill-settings.service";
|
||||
import { DesktopAutofillService } from "../../autofill/services/desktop-autofill.service";
|
||||
import { DesktopFido2UserInterfaceService } from "../../autofill/services/desktop-fido2-user-interface.service";
|
||||
@@ -398,6 +400,16 @@ const safeProviders: SafeProvider[] = [
|
||||
SsoUrlService,
|
||||
],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthDuoComponentService,
|
||||
useClass: DesktopTwoFactorAuthDuoComponentService,
|
||||
deps: [
|
||||
MessageListener,
|
||||
EnvironmentService,
|
||||
I18nServiceAbstraction,
|
||||
PlatformUtilsServiceAbstraction,
|
||||
],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: SdkClientFactory,
|
||||
useClass: flagEnabled("sdk") ? DefaultSdkClientFactory : NoopSdkClientFactory,
|
||||
|
||||
@@ -0,0 +1,93 @@
|
||||
import { MockProxy, mock } from "jest-mock-extended";
|
||||
import { BehaviorSubject, firstValueFrom } from "rxjs";
|
||||
|
||||
import {
|
||||
Environment,
|
||||
EnvironmentService,
|
||||
} from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import { MessageListener } from "@bitwarden/common/platform/messaging";
|
||||
|
||||
import { DesktopTwoFactorAuthDuoComponentService } from "./desktop-two-factor-auth-duo-component.service";
|
||||
|
||||
describe("DesktopTwoFactorAuthDuoComponentService", () => {
|
||||
let desktopTwoFactorAuthDuoComponentService: DesktopTwoFactorAuthDuoComponentService;
|
||||
let messageListener: MockProxy<MessageListener>;
|
||||
let environmentService: MockProxy<EnvironmentService>;
|
||||
let i18nService: MockProxy<I18nService>;
|
||||
let platformUtilsService: MockProxy<PlatformUtilsService>;
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
|
||||
messageListener = mock<MessageListener>();
|
||||
environmentService = mock<EnvironmentService>();
|
||||
i18nService = mock<I18nService>();
|
||||
platformUtilsService = mock<PlatformUtilsService>();
|
||||
|
||||
desktopTwoFactorAuthDuoComponentService = new DesktopTwoFactorAuthDuoComponentService(
|
||||
messageListener,
|
||||
environmentService,
|
||||
i18nService,
|
||||
platformUtilsService,
|
||||
);
|
||||
});
|
||||
|
||||
describe("listenForDuo2faResult$", () => {
|
||||
it("should return an observable that emits a duo 2FA result when a duo result message is received", async () => {
|
||||
const message: { code: string; state: string } = {
|
||||
code: "123456",
|
||||
state: "abcdef",
|
||||
};
|
||||
const expectedDuo2faResult = {
|
||||
code: message.code,
|
||||
state: message.state,
|
||||
token: `${message.code}|${message.state}`,
|
||||
};
|
||||
|
||||
const messages = new BehaviorSubject(message);
|
||||
messageListener.messages$.mockReturnValue(messages);
|
||||
|
||||
const duo2faResult = await firstValueFrom(
|
||||
desktopTwoFactorAuthDuoComponentService.listenForDuo2faResult$(),
|
||||
);
|
||||
expect(duo2faResult).toEqual(expectedDuo2faResult);
|
||||
});
|
||||
});
|
||||
|
||||
describe("launchDuoFrameless", () => {
|
||||
it("should build and launch the duo frameless URL", async () => {
|
||||
// Arrange
|
||||
const duoFramelessUrl = "https://duoFramelessUrl";
|
||||
const webVaultUrl = "https://webVaultUrl";
|
||||
|
||||
i18nService.t.mockImplementation((key) => key);
|
||||
|
||||
const handOffMessage = {
|
||||
title: "youSuccessfullyLoggedIn",
|
||||
message: "youMayCloseThisWindow",
|
||||
isCountdown: false,
|
||||
};
|
||||
|
||||
const mockEnvironment = {
|
||||
getWebVaultUrl: () => webVaultUrl,
|
||||
} as unknown as Environment;
|
||||
const environmentBSubject = new BehaviorSubject(mockEnvironment);
|
||||
environmentService.environment$ = environmentBSubject.asObservable();
|
||||
|
||||
// Act
|
||||
await desktopTwoFactorAuthDuoComponentService.launchDuoFrameless(duoFramelessUrl);
|
||||
|
||||
// Assert
|
||||
const launchUrl =
|
||||
webVaultUrl +
|
||||
"/duo-redirect-connector.html" +
|
||||
"?duoFramelessUrl=" +
|
||||
encodeURIComponent(duoFramelessUrl) +
|
||||
"&handOffMessage=" +
|
||||
encodeURIComponent(JSON.stringify(handOffMessage));
|
||||
expect(platformUtilsService.launchUri).toHaveBeenCalledWith(launchUrl);
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,56 @@
|
||||
import { firstValueFrom, map, Observable } from "rxjs";
|
||||
|
||||
import { TwoFactorAuthDuoComponentService, Duo2faResult } from "@bitwarden/auth/angular";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import { CommandDefinition, MessageListener } from "@bitwarden/common/platform/messaging";
|
||||
|
||||
// TODO: PM-16209 We should create a Duo2faMessageListenerService that listens for messages from duo
|
||||
// and this command definition should move to that file.
|
||||
// We should explore consolidating the messaging approach across clients - i.e., we
|
||||
// should use the same command definition across all clients. We use duoResult on extension for no real
|
||||
// benefit.
|
||||
export const DUO_2FA_RESULT_COMMAND = new CommandDefinition<{ code: string; state: string }>(
|
||||
"duoCallback",
|
||||
);
|
||||
|
||||
export class DesktopTwoFactorAuthDuoComponentService implements TwoFactorAuthDuoComponentService {
|
||||
constructor(
|
||||
private messageListener: MessageListener,
|
||||
private environmentService: EnvironmentService,
|
||||
private i18nService: I18nService,
|
||||
private platformUtilsService: PlatformUtilsService,
|
||||
) {}
|
||||
listenForDuo2faResult$(): Observable<Duo2faResult> {
|
||||
return this.messageListener.messages$(DUO_2FA_RESULT_COMMAND).pipe(
|
||||
map((msg) => {
|
||||
return {
|
||||
code: msg.code,
|
||||
state: msg.state,
|
||||
token: `${msg.code}|${msg.state}`,
|
||||
} as Duo2faResult;
|
||||
}),
|
||||
);
|
||||
}
|
||||
|
||||
async launchDuoFrameless(duoFramelessUrl: string): Promise<void> {
|
||||
const duoHandOffMessage = {
|
||||
title: this.i18nService.t("youSuccessfullyLoggedIn"),
|
||||
message: this.i18nService.t("youMayCloseThisWindow"),
|
||||
isCountdown: false,
|
||||
};
|
||||
|
||||
// we're using the connector here as a way to set a cookie with translations
|
||||
// before continuing to the duo frameless url
|
||||
const env = await firstValueFrom(this.environmentService.environment$);
|
||||
const launchUrl =
|
||||
env.getWebVaultUrl() +
|
||||
"/duo-redirect-connector.html" +
|
||||
"?duoFramelessUrl=" +
|
||||
encodeURIComponent(duoFramelessUrl) +
|
||||
"&handOffMessage=" +
|
||||
encodeURIComponent(JSON.stringify(duoHandOffMessage));
|
||||
this.platformUtilsService.launchUri(launchUrl);
|
||||
}
|
||||
}
|
||||
@@ -1,117 +0,0 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, NgZone, OnDestroy, OnInit } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
import { firstValueFrom } from "rxjs";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import { BroadcasterService } from "@bitwarden/common/platform/abstractions/broadcaster.service";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import {
|
||||
AsyncActionsModule,
|
||||
ButtonModule,
|
||||
FormFieldModule,
|
||||
LinkModule,
|
||||
ToastService,
|
||||
TypographyModule,
|
||||
} from "@bitwarden/components";
|
||||
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthDuoComponent as TwoFactorAuthDuoBaseComponent } from "../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-duo.component";
|
||||
|
||||
const BroadcasterSubscriptionId = "TwoFactorComponent";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth-duo",
|
||||
templateUrl:
|
||||
"../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-duo.component.html",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
})
|
||||
export class TwoFactorAuthDuoComponent
|
||||
extends TwoFactorAuthDuoBaseComponent
|
||||
implements OnInit, OnDestroy
|
||||
{
|
||||
constructor(
|
||||
protected i18nService: I18nService,
|
||||
protected platformUtilsService: PlatformUtilsService,
|
||||
private broadcasterService: BroadcasterService,
|
||||
private ngZone: NgZone,
|
||||
private environmentService: EnvironmentService,
|
||||
toastService: ToastService,
|
||||
) {
|
||||
super(i18nService, platformUtilsService, toastService);
|
||||
}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
await super.ngOnInit();
|
||||
}
|
||||
|
||||
duoCallbackSubscriptionEnabled: boolean = false;
|
||||
|
||||
protected override setupDuoResultListener() {
|
||||
if (!this.duoCallbackSubscriptionEnabled) {
|
||||
this.broadcasterService.subscribe(BroadcasterSubscriptionId, async (message: any) => {
|
||||
await this.ngZone.run(async () => {
|
||||
if (message.command === "duoCallback") {
|
||||
this.token.emit(message.code + "|" + message.state);
|
||||
}
|
||||
});
|
||||
});
|
||||
this.duoCallbackSubscriptionEnabled = true;
|
||||
}
|
||||
}
|
||||
|
||||
override async launchDuoFrameless() {
|
||||
if (this.duoFramelessUrl === null) {
|
||||
this.toastService.showToast({
|
||||
variant: "error",
|
||||
title: null,
|
||||
message: this.i18nService.t("duoHealthCheckResultsInNullAuthUrlError"),
|
||||
});
|
||||
return;
|
||||
}
|
||||
const duoHandOffMessage = {
|
||||
title: this.i18nService.t("youSuccessfullyLoggedIn"),
|
||||
message: this.i18nService.t("youMayCloseThisWindow"),
|
||||
isCountdown: false,
|
||||
};
|
||||
|
||||
// we're using the connector here as a way to set a cookie with translations
|
||||
// before continuing to the duo frameless url
|
||||
const env = await firstValueFrom(this.environmentService.environment$);
|
||||
const launchUrl =
|
||||
env.getWebVaultUrl() +
|
||||
"/duo-redirect-connector.html" +
|
||||
"?duoFramelessUrl=" +
|
||||
encodeURIComponent(this.duoFramelessUrl) +
|
||||
"&handOffMessage=" +
|
||||
encodeURIComponent(JSON.stringify(duoHandOffMessage));
|
||||
this.platformUtilsService.launchUri(launchUrl);
|
||||
}
|
||||
|
||||
async ngOnDestroy() {
|
||||
if (this.duoCallbackSubscriptionEnabled) {
|
||||
this.broadcasterService.unsubscribe(BroadcasterSubscriptionId);
|
||||
this.duoCallbackSubscriptionEnabled = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,74 +0,0 @@
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component } from "@angular/core";
|
||||
import { ReactiveFormsModule } from "@angular/forms";
|
||||
import { RouterLink } from "@angular/router";
|
||||
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthAuthenticatorComponent } from "../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-authenticator.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthEmailComponent } from "../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-email.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthWebAuthnComponent } from "../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-webauthn.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthYubikeyComponent } from "../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-yubikey.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthComponent as BaseTwoFactorAuthComponent } from "../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorOptionsComponent } from "../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-options.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { JslibModule } from "../../../../libs/angular/src/jslib.module";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { AsyncActionsModule } from "../../../../libs/components/src/async-actions";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { ButtonModule } from "../../../../libs/components/src/button";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { CheckboxModule } from "../../../../libs/components/src/checkbox";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { FormFieldModule } from "../../../../libs/components/src/form-field";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { LinkModule } from "../../../../libs/components/src/link";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TypographyModule } from "../../../../libs/components/src/typography";
|
||||
|
||||
import { TwoFactorAuthDuoComponent } from "./two-factor-auth-duo.component";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
templateUrl:
|
||||
"../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth.component.html",
|
||||
selector: "app-two-factor-auth",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
RouterLink,
|
||||
CheckboxModule,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorAuthEmailComponent,
|
||||
TwoFactorAuthAuthenticatorComponent,
|
||||
TwoFactorAuthYubikeyComponent,
|
||||
TwoFactorAuthDuoComponent,
|
||||
TwoFactorAuthWebAuthnComponent,
|
||||
],
|
||||
})
|
||||
export class TwoFactorAuthComponent extends BaseTwoFactorAuthComponent {}
|
||||
@@ -1,7 +1,7 @@
|
||||
import { Component } from "@angular/core";
|
||||
import { Router } from "@angular/router";
|
||||
|
||||
import { TwoFactorOptionsComponent as BaseTwoFactorOptionsComponent } from "@bitwarden/angular/auth/components/two-factor-options.component";
|
||||
import { TwoFactorOptionsComponentV1 as BaseTwoFactorOptionsComponentV1 } from "@bitwarden/angular/auth/components/two-factor-options-v1.component";
|
||||
import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
@@ -9,9 +9,9 @@ import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/pl
|
||||
|
||||
@Component({
|
||||
selector: "app-two-factor-options",
|
||||
templateUrl: "two-factor-options.component.html",
|
||||
templateUrl: "two-factor-options-v1.component.html",
|
||||
})
|
||||
export class TwoFactorOptionsComponent extends BaseTwoFactorOptionsComponent {
|
||||
export class TwoFactorOptionsComponentV1 extends BaseTwoFactorOptionsComponentV1 {
|
||||
constructor(
|
||||
twoFactorService: TwoFactorService,
|
||||
router: Router,
|
||||
@@ -4,7 +4,7 @@ import { Component, Inject, NgZone, OnDestroy, ViewChild, ViewContainerRef } fro
|
||||
import { ActivatedRoute, Router } from "@angular/router";
|
||||
import { firstValueFrom } from "rxjs";
|
||||
|
||||
import { TwoFactorComponent as BaseTwoFactorComponent } from "@bitwarden/angular/auth/components/two-factor.component";
|
||||
import { TwoFactorComponentV1 as BaseTwoFactorComponent } from "@bitwarden/angular/auth/components/two-factor-v1.component";
|
||||
import { WINDOW } from "@bitwarden/angular/services/injection-tokens";
|
||||
import { ModalService } from "@bitwarden/angular/services/modal.service";
|
||||
import {
|
||||
@@ -29,16 +29,16 @@ import { StateService } from "@bitwarden/common/platform/abstractions/state.serv
|
||||
import { SyncService } from "@bitwarden/common/vault/abstractions/sync/sync.service.abstraction";
|
||||
import { ToastService } from "@bitwarden/components";
|
||||
|
||||
import { TwoFactorOptionsComponent } from "./two-factor-options.component";
|
||||
import { TwoFactorOptionsComponentV1 } from "./two-factor-options-v1.component";
|
||||
|
||||
const BroadcasterSubscriptionId = "TwoFactorComponent";
|
||||
|
||||
@Component({
|
||||
selector: "app-two-factor",
|
||||
templateUrl: "two-factor.component.html",
|
||||
templateUrl: "two-factor-v1.component.html",
|
||||
})
|
||||
// eslint-disable-next-line rxjs-angular/prefer-takeuntil
|
||||
export class TwoFactorComponent extends BaseTwoFactorComponent implements OnDestroy {
|
||||
export class TwoFactorComponentV1 extends BaseTwoFactorComponent implements OnDestroy {
|
||||
@ViewChild("twoFactorOptions", { read: ViewContainerRef, static: true })
|
||||
twoFactorOptionsModal: ViewContainerRef;
|
||||
|
||||
@@ -106,7 +106,7 @@ export class TwoFactorComponent extends BaseTwoFactorComponent implements OnDest
|
||||
|
||||
async anotherMethod() {
|
||||
const [modal, childComponent] = await this.modalService.openViewRef(
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorOptionsComponentV1,
|
||||
this.twoFactorOptionsModal,
|
||||
);
|
||||
|
||||
@@ -652,6 +652,15 @@
|
||||
"logInToBitwarden": {
|
||||
"message": "Log in to Bitwarden"
|
||||
},
|
||||
"enterTheCodeSentToYourEmail": {
|
||||
"message": "Enter the code sent to your email"
|
||||
},
|
||||
"enterTheCodeFromYourAuthenticatorApp": {
|
||||
"message": "Enter the code from your authenticator app"
|
||||
},
|
||||
"pressYourYubiKeyToAuthenticate": {
|
||||
"message": "Press your YubiKey to authenticate"
|
||||
},
|
||||
"logInWithPasskey": {
|
||||
"message": "Log in with passkey"
|
||||
},
|
||||
@@ -825,6 +834,9 @@
|
||||
"webauthnCancelOrTimeout": {
|
||||
"message": "The authentication was cancelled or took too long. Please try again."
|
||||
},
|
||||
"openInNewTab": {
|
||||
"message": "Open in new tab"
|
||||
},
|
||||
"invalidVerificationCode": {
|
||||
"message": "Invalid verification code"
|
||||
},
|
||||
@@ -855,12 +867,22 @@
|
||||
"rememberMe": {
|
||||
"message": "Remember me"
|
||||
},
|
||||
"dontAskAgainOnThisDeviceFor30Days": {
|
||||
"message": "Don't ask again on this device for 30 days"
|
||||
},
|
||||
"sendVerificationCodeEmailAgain": {
|
||||
"message": "Send verification code email again"
|
||||
},
|
||||
"useAnotherTwoStepMethod": {
|
||||
"message": "Use another two-step login method"
|
||||
},
|
||||
"selectAnotherMethod": {
|
||||
"message": "Select another method",
|
||||
"description": "Select another two-step login method"
|
||||
},
|
||||
"useYourRecoveryCode": {
|
||||
"message": "Use your recovery code"
|
||||
},
|
||||
"insertYubiKey": {
|
||||
"message": "Insert your YubiKey into your computer's USB port, then touch its button."
|
||||
},
|
||||
@@ -927,6 +949,9 @@
|
||||
"twoStepOptions": {
|
||||
"message": "Two-step login options"
|
||||
},
|
||||
"selectTwoStepLoginMethod": {
|
||||
"message": "Select two-step login method"
|
||||
},
|
||||
"selfHostedEnvironment": {
|
||||
"message": "Self-hosted environment"
|
||||
},
|
||||
@@ -2256,6 +2281,12 @@
|
||||
"webAuthnAuthenticate": {
|
||||
"message": "Authenticate WebAuthn"
|
||||
},
|
||||
"readSecurityKey": {
|
||||
"message": "Read security key"
|
||||
},
|
||||
"awaitingSecurityKeyInteraction": {
|
||||
"message": "Awaiting security key interaction..."
|
||||
},
|
||||
"hideEmail": {
|
||||
"message": "Hide my email address from recipients."
|
||||
},
|
||||
@@ -3215,6 +3246,12 @@
|
||||
"duoRequiredByOrgForAccount": {
|
||||
"message": "Duo two-step login is required for your account."
|
||||
},
|
||||
"duoTwoFactorRequiredPageSubtitle": {
|
||||
"message": "Duo two-step login is required for your account. Follow the steps below to finish logging in."
|
||||
},
|
||||
"followTheStepsBelowToFinishLoggingIn": {
|
||||
"message": "Follow the steps below to finish logging in."
|
||||
},
|
||||
"launchDuo": {
|
||||
"message": "Launch Duo in Browser"
|
||||
},
|
||||
|
||||
@@ -243,14 +243,12 @@ p.lead {
|
||||
}
|
||||
|
||||
#web-authn-frame {
|
||||
background: url("../images/loading.svg") 0 0 no-repeat;
|
||||
height: 250px;
|
||||
margin: 0 0 15px 0;
|
||||
height: 40px;
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -3,3 +3,4 @@ export * from "./login-decryption-options";
|
||||
export * from "./webauthn-login";
|
||||
export * from "./set-password-jit";
|
||||
export * from "./registration";
|
||||
export * from "./two-factor-auth";
|
||||
|
||||
@@ -0,0 +1,2 @@
|
||||
export * from "./web-two-factor-auth-component.service";
|
||||
export * from "./web-two-factor-auth-duo-component.service";
|
||||
@@ -0,0 +1,14 @@
|
||||
import {
|
||||
DefaultTwoFactorAuthComponentService,
|
||||
TwoFactorAuthComponentService,
|
||||
LegacyKeyMigrationAction,
|
||||
} from "@bitwarden/auth/angular";
|
||||
|
||||
export class WebTwoFactorAuthComponentService
|
||||
extends DefaultTwoFactorAuthComponentService
|
||||
implements TwoFactorAuthComponentService
|
||||
{
|
||||
override determineLegacyKeyMigrationAction(): LegacyKeyMigrationAction {
|
||||
return LegacyKeyMigrationAction.NAVIGATE_TO_MIGRATION_COMPONENT;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,83 @@
|
||||
import { MockProxy, mock } from "jest-mock-extended";
|
||||
|
||||
import { Duo2faResult } from "@bitwarden/auth/angular";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
|
||||
import { WebTwoFactorAuthDuoComponentService } from "./web-two-factor-auth-duo-component.service";
|
||||
|
||||
describe("WebTwoFactorAuthDuoComponentService", () => {
|
||||
let webTwoFactorAuthDuoComponentService: WebTwoFactorAuthDuoComponentService;
|
||||
|
||||
let platformUtilsService: MockProxy<PlatformUtilsService>;
|
||||
|
||||
let mockBroadcastChannel: jest.Mocked<BroadcastChannel>;
|
||||
let eventTarget: EventTarget;
|
||||
|
||||
beforeEach(() => {
|
||||
jest.clearAllMocks();
|
||||
|
||||
platformUtilsService = mock<PlatformUtilsService>();
|
||||
|
||||
eventTarget = new EventTarget();
|
||||
|
||||
mockBroadcastChannel = {
|
||||
name: "duoResult",
|
||||
postMessage: jest.fn(),
|
||||
close: jest.fn(),
|
||||
onmessage: jest.fn(),
|
||||
onmessageerror: jest.fn(),
|
||||
addEventListener: jest.fn().mockImplementation((type, listener) => {
|
||||
eventTarget.addEventListener(type, listener);
|
||||
}),
|
||||
removeEventListener: jest.fn(),
|
||||
dispatchEvent: jest.fn(),
|
||||
};
|
||||
|
||||
global.BroadcastChannel = jest.fn(() => mockBroadcastChannel);
|
||||
|
||||
webTwoFactorAuthDuoComponentService = new WebTwoFactorAuthDuoComponentService(
|
||||
platformUtilsService,
|
||||
);
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
// reset global object
|
||||
jest.restoreAllMocks();
|
||||
});
|
||||
|
||||
describe("listenForDuo2faResult$", () => {
|
||||
it("should return an observable that emits a duo 2FA result when a duo result message is received", (done) => {
|
||||
const expectedResult: Duo2faResult = {
|
||||
code: "123456",
|
||||
state: "verified",
|
||||
token: "123456|verified",
|
||||
};
|
||||
const mockMessageEvent = new MessageEvent("message", {
|
||||
data: {
|
||||
code: "123456",
|
||||
state: "verified",
|
||||
},
|
||||
lastEventId: "",
|
||||
origin: "",
|
||||
ports: [],
|
||||
source: null,
|
||||
});
|
||||
webTwoFactorAuthDuoComponentService.listenForDuo2faResult$().subscribe((result) => {
|
||||
expect(result).toEqual(expectedResult);
|
||||
done();
|
||||
});
|
||||
|
||||
// Trigger the message event
|
||||
eventTarget.dispatchEvent(mockMessageEvent);
|
||||
});
|
||||
});
|
||||
|
||||
describe("launchDuoFrameless", () => {
|
||||
it("should launch the duo frameless URL", async () => {
|
||||
const duoFramelessUrl = "https://duo.com/frameless";
|
||||
await webTwoFactorAuthDuoComponentService.launchDuoFrameless(duoFramelessUrl);
|
||||
|
||||
expect(platformUtilsService.launchUri).toHaveBeenCalledWith(duoFramelessUrl);
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,31 @@
|
||||
import { fromEvent, map, Observable, share } from "rxjs";
|
||||
|
||||
import { TwoFactorAuthDuoComponentService, Duo2faResult } from "@bitwarden/auth/angular";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
|
||||
export class WebTwoFactorAuthDuoComponentService implements TwoFactorAuthDuoComponentService {
|
||||
private duo2faResult$: Observable<Duo2faResult>;
|
||||
|
||||
constructor(private platformUtilsService: PlatformUtilsService) {
|
||||
const duoResultChannel: BroadcastChannel = new BroadcastChannel("duoResult");
|
||||
|
||||
this.duo2faResult$ = fromEvent<MessageEvent>(duoResultChannel, "message").pipe(
|
||||
map((msg: MessageEvent) => {
|
||||
return {
|
||||
code: msg.data.code,
|
||||
state: msg.data.state,
|
||||
token: `${msg.data.code}|${msg.data.state}`,
|
||||
} as Duo2faResult;
|
||||
}),
|
||||
// share the observable so that multiple subscribers can listen to the same event
|
||||
share(),
|
||||
);
|
||||
}
|
||||
listenForDuo2faResult$(): Observable<Duo2faResult> {
|
||||
return this.duo2faResult$;
|
||||
}
|
||||
|
||||
async launchDuoFrameless(duoFramelessUrl: string): Promise<void> {
|
||||
this.platformUtilsService.launchUri(duoFramelessUrl);
|
||||
}
|
||||
}
|
||||
@@ -1,77 +0,0 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, OnDestroy, OnInit } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthDuoComponent as TwoFactorAuthDuoBaseComponent } from "../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-duo.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { AsyncActionsModule } from "../../../../../libs/components/src/async-actions";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { ButtonModule } from "../../../../../libs/components/src/button";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { FormFieldModule } from "../../../../../libs/components/src/form-field";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { LinkModule } from "../../../../../libs/components/src/link";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TypographyModule } from "../../../../../libs/components/src/typography";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth-duo",
|
||||
templateUrl:
|
||||
"../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-duo.component.html",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
})
|
||||
export class TwoFactorAuthDuoComponent
|
||||
extends TwoFactorAuthDuoBaseComponent
|
||||
implements OnInit, OnDestroy
|
||||
{
|
||||
async ngOnInit(): Promise<void> {
|
||||
await super.ngOnInit();
|
||||
}
|
||||
|
||||
private duoResultChannel: BroadcastChannel;
|
||||
|
||||
protected override setupDuoResultListener() {
|
||||
if (!this.duoResultChannel) {
|
||||
this.duoResultChannel = new BroadcastChannel("duoResult");
|
||||
this.duoResultChannel.addEventListener("message", this.handleDuoResultMessage);
|
||||
}
|
||||
}
|
||||
|
||||
private handleDuoResultMessage = async (msg: { data: { code: string; state: string } }) => {
|
||||
this.token.emit(msg.data.code + "|" + msg.data.state);
|
||||
};
|
||||
|
||||
async ngOnDestroy() {
|
||||
if (this.duoResultChannel) {
|
||||
// clean up duo listener if it was initialized.
|
||||
this.duoResultChannel.removeEventListener("message", this.handleDuoResultMessage);
|
||||
this.duoResultChannel.close();
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,144 +0,0 @@
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, Inject } from "@angular/core";
|
||||
import { FormBuilder, ReactiveFormsModule } from "@angular/forms";
|
||||
import { ActivatedRoute, Router, RouterLink } from "@angular/router";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import { WINDOW } from "@bitwarden/angular/services/injection-tokens";
|
||||
import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
|
||||
import { InternalMasterPasswordServiceAbstraction } from "@bitwarden/common/auth/abstractions/master-password.service.abstraction";
|
||||
import { SsoLoginServiceAbstraction } from "@bitwarden/common/auth/abstractions/sso-login.service.abstraction";
|
||||
import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
|
||||
import { AuthResult } from "@bitwarden/common/auth/models/domain/auth-result";
|
||||
import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import {
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
CheckboxModule,
|
||||
DialogService,
|
||||
ToastService,
|
||||
} from "@bitwarden/components";
|
||||
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthAuthenticatorComponent } from "../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-authenticator.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthEmailComponent } from "../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-email.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthWebAuthnComponent } from "../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-webauthn.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthYubikeyComponent } from "../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth-yubikey.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorAuthComponent as BaseTwoFactorAuthComponent } from "../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { TwoFactorOptionsComponent } from "../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-options.component";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import {
|
||||
LoginStrategyServiceAbstraction,
|
||||
LoginEmailServiceAbstraction,
|
||||
UserDecryptionOptionsServiceAbstraction,
|
||||
} from "../../../../../libs/auth/src/common/abstractions";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { AsyncActionsModule } from "../../../../../libs/components/src/async-actions";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { ButtonModule } from "../../../../../libs/components/src/button";
|
||||
// FIXME: remove `src` and fix import
|
||||
// eslint-disable-next-line no-restricted-imports
|
||||
import { FormFieldModule } from "../../../../../libs/components/src/form-field";
|
||||
|
||||
import { TwoFactorAuthDuoComponent } from "./two-factor-auth-duo.component";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
templateUrl:
|
||||
"../../../../../libs/angular/src/auth/components/two-factor-auth/two-factor-auth.component.html",
|
||||
selector: "app-two-factor-auth",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
RouterLink,
|
||||
CheckboxModule,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorAuthEmailComponent,
|
||||
TwoFactorAuthAuthenticatorComponent,
|
||||
TwoFactorAuthYubikeyComponent,
|
||||
TwoFactorAuthDuoComponent,
|
||||
TwoFactorAuthWebAuthnComponent,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
})
|
||||
export class TwoFactorAuthComponent extends BaseTwoFactorAuthComponent {
|
||||
constructor(
|
||||
protected loginStrategyService: LoginStrategyServiceAbstraction,
|
||||
protected router: Router,
|
||||
i18nService: I18nService,
|
||||
platformUtilsService: PlatformUtilsService,
|
||||
environmentService: EnvironmentService,
|
||||
dialogService: DialogService,
|
||||
protected route: ActivatedRoute,
|
||||
logService: LogService,
|
||||
protected twoFactorService: TwoFactorService,
|
||||
loginEmailService: LoginEmailServiceAbstraction,
|
||||
userDecryptionOptionsService: UserDecryptionOptionsServiceAbstraction,
|
||||
protected ssoLoginService: SsoLoginServiceAbstraction,
|
||||
protected configService: ConfigService,
|
||||
masterPasswordService: InternalMasterPasswordServiceAbstraction,
|
||||
accountService: AccountService,
|
||||
formBuilder: FormBuilder,
|
||||
@Inject(WINDOW) protected win: Window,
|
||||
toastService: ToastService,
|
||||
) {
|
||||
super(
|
||||
loginStrategyService,
|
||||
router,
|
||||
i18nService,
|
||||
platformUtilsService,
|
||||
environmentService,
|
||||
dialogService,
|
||||
route,
|
||||
logService,
|
||||
twoFactorService,
|
||||
loginEmailService,
|
||||
userDecryptionOptionsService,
|
||||
ssoLoginService,
|
||||
configService,
|
||||
masterPasswordService,
|
||||
accountService,
|
||||
formBuilder,
|
||||
win,
|
||||
toastService,
|
||||
);
|
||||
this.onSuccessfulLoginNavigate = this.goAfterLogIn;
|
||||
}
|
||||
|
||||
protected override handleMigrateEncryptionKey(result: AuthResult): boolean {
|
||||
if (!result.requiresEncryptionKeyMigration) {
|
||||
return false;
|
||||
}
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.router.navigate(["migrate-legacy-encryption"]);
|
||||
return true;
|
||||
}
|
||||
}
|
||||
@@ -2,7 +2,7 @@ import { DialogRef } from "@angular/cdk/dialog";
|
||||
import { Component } from "@angular/core";
|
||||
import { Router } from "@angular/router";
|
||||
|
||||
import { TwoFactorOptionsComponent as BaseTwoFactorOptionsComponent } from "@bitwarden/angular/auth/components/two-factor-options.component";
|
||||
import { TwoFactorOptionsComponentV1 as BaseTwoFactorOptionsComponentV1 } from "@bitwarden/angular/auth/components/two-factor-options-v1.component";
|
||||
import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
|
||||
import { TwoFactorProviderType } from "@bitwarden/common/auth/enums/two-factor-provider-type";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
@@ -22,9 +22,9 @@ export type TwoFactorOptionsDialogResultType = {
|
||||
|
||||
@Component({
|
||||
selector: "app-two-factor-options",
|
||||
templateUrl: "two-factor-options.component.html",
|
||||
templateUrl: "two-factor-options-v1.component.html",
|
||||
})
|
||||
export class TwoFactorOptionsComponent extends BaseTwoFactorOptionsComponent {
|
||||
export class TwoFactorOptionsComponentV1 extends BaseTwoFactorOptionsComponentV1 {
|
||||
constructor(
|
||||
twoFactorService: TwoFactorService,
|
||||
router: Router,
|
||||
@@ -47,6 +47,6 @@ export class TwoFactorOptionsComponent extends BaseTwoFactorOptionsComponent {
|
||||
}
|
||||
|
||||
static open(dialogService: DialogService) {
|
||||
return dialogService.open<TwoFactorOptionsDialogResultType>(TwoFactorOptionsComponent);
|
||||
return dialogService.open<TwoFactorOptionsDialogResultType>(TwoFactorOptionsComponentV1);
|
||||
}
|
||||
}
|
||||
@@ -5,7 +5,7 @@ import { FormBuilder, Validators } from "@angular/forms";
|
||||
import { ActivatedRoute, Router } from "@angular/router";
|
||||
import { Subject, takeUntil, lastValueFrom } from "rxjs";
|
||||
|
||||
import { TwoFactorComponent as BaseTwoFactorComponent } from "@bitwarden/angular/auth/components/two-factor.component";
|
||||
import { TwoFactorComponentV1 as BaseTwoFactorComponent } from "@bitwarden/angular/auth/components/two-factor-v1.component";
|
||||
import { WINDOW } from "@bitwarden/angular/services/injection-tokens";
|
||||
import {
|
||||
LoginStrategyServiceAbstraction,
|
||||
@@ -29,16 +29,16 @@ import { DialogService, ToastService } from "@bitwarden/components";
|
||||
|
||||
import {
|
||||
TwoFactorOptionsDialogResult,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorOptionsComponentV1,
|
||||
TwoFactorOptionsDialogResultType,
|
||||
} from "./two-factor-options.component";
|
||||
} from "./two-factor-options-v1.component";
|
||||
|
||||
@Component({
|
||||
selector: "app-two-factor",
|
||||
templateUrl: "two-factor.component.html",
|
||||
templateUrl: "two-factor-v1.component.html",
|
||||
})
|
||||
// eslint-disable-next-line rxjs-angular/prefer-takeuntil
|
||||
export class TwoFactorComponent extends BaseTwoFactorComponent implements OnInit, OnDestroy {
|
||||
export class TwoFactorComponentV1 extends BaseTwoFactorComponent implements OnInit, OnDestroy {
|
||||
@ViewChild("twoFactorOptions", { read: ViewContainerRef, static: true })
|
||||
twoFactorOptionsModal: ViewContainerRef;
|
||||
formGroup = this.formBuilder.group({
|
||||
@@ -110,7 +110,7 @@ export class TwoFactorComponent extends BaseTwoFactorComponent implements OnInit
|
||||
};
|
||||
|
||||
async anotherMethod() {
|
||||
const dialogRef = TwoFactorOptionsComponent.open(this.dialogService);
|
||||
const dialogRef = TwoFactorOptionsComponentV1.open(this.dialogService);
|
||||
const response: TwoFactorOptionsDialogResultType = await lastValueFrom(dialogRef.closed);
|
||||
if (response.result === TwoFactorOptionsDialogResult.Provider) {
|
||||
this.selectedProviderType = response.type;
|
||||
@@ -33,6 +33,8 @@ import {
|
||||
SetPasswordJitService,
|
||||
SsoComponentService,
|
||||
LoginDecryptionOptionsService,
|
||||
TwoFactorAuthComponentService,
|
||||
TwoFactorAuthDuoComponentService,
|
||||
} from "@bitwarden/auth/angular";
|
||||
import {
|
||||
InternalUserDecryptionOptionsServiceAbstraction,
|
||||
@@ -108,6 +110,8 @@ import {
|
||||
WebRegistrationFinishService,
|
||||
WebLoginComponentService,
|
||||
WebLoginDecryptionOptionsService,
|
||||
WebTwoFactorAuthComponentService,
|
||||
WebTwoFactorAuthDuoComponentService,
|
||||
} from "../auth";
|
||||
import { WebSsoComponentService } from "../auth/core/services/login/web-sso-component.service";
|
||||
import { AcceptOrganizationInviteService } from "../auth/organization-invite/accept-organization.service";
|
||||
@@ -261,6 +265,12 @@ const safeProviders: SafeProvider[] = [
|
||||
useClass: WebLockComponentService,
|
||||
deps: [],
|
||||
}),
|
||||
// TODO: PM-18182 - Refactor component services into lazy loaded modules
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthComponentService,
|
||||
useClass: WebTwoFactorAuthComponentService,
|
||||
deps: [],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: SetPasswordJitService,
|
||||
useClass: WebSetPasswordJitService,
|
||||
@@ -328,6 +338,11 @@ const safeProviders: SafeProvider[] = [
|
||||
useClass: WebSsoComponentService,
|
||||
deps: [I18nServiceAbstraction],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthDuoComponentService,
|
||||
useClass: WebTwoFactorAuthDuoComponentService,
|
||||
deps: [PlatformUtilsService],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: LoginDecryptionOptionsService,
|
||||
useClass: WebLoginDecryptionOptionsService,
|
||||
|
||||
@@ -12,7 +12,6 @@ import {
|
||||
activeAuthGuard,
|
||||
} from "@bitwarden/angular/auth/guards";
|
||||
import { canAccessFeature } from "@bitwarden/angular/platform/guard/feature-flag.guard";
|
||||
import { twofactorRefactorSwap } from "@bitwarden/angular/utils/two-factor-component-refactor-route-swap";
|
||||
import { NewDeviceVerificationNoticeGuard } from "@bitwarden/angular/vault/guards";
|
||||
import {
|
||||
AnonLayoutWrapperComponent,
|
||||
@@ -38,6 +37,8 @@ import {
|
||||
SsoComponent,
|
||||
VaultIcon,
|
||||
LoginDecryptionOptionsComponent,
|
||||
TwoFactorAuthComponent,
|
||||
TwoFactorAuthGuard,
|
||||
NewDeviceVerificationComponent,
|
||||
DeviceVerificationIcon,
|
||||
} from "@bitwarden/auth/angular";
|
||||
@@ -71,8 +72,7 @@ import { EmergencyAccessComponent } from "./auth/settings/emergency-access/emerg
|
||||
import { EmergencyAccessViewComponent } from "./auth/settings/emergency-access/view/emergency-access-view.component";
|
||||
import { SecurityRoutingModule } from "./auth/settings/security/security-routing.module";
|
||||
import { SsoComponentV1 } from "./auth/sso-v1.component";
|
||||
import { TwoFactorAuthComponent } from "./auth/two-factor-auth.component";
|
||||
import { TwoFactorComponent } from "./auth/two-factor.component";
|
||||
import { TwoFactorComponentV1 } from "./auth/two-factor-v1.component";
|
||||
import { UpdatePasswordComponent } from "./auth/update-password.component";
|
||||
import { UpdateTempPasswordComponent } from "./auth/update-temp-password.component";
|
||||
import { VerifyEmailTokenComponent } from "./auth/verify-email-token.component";
|
||||
@@ -505,6 +505,50 @@ const routes: Routes = [
|
||||
},
|
||||
},
|
||||
},
|
||||
...unauthUiRefreshSwap(
|
||||
TwoFactorComponentV1,
|
||||
TwoFactorAuthComponent,
|
||||
{
|
||||
path: "2fa",
|
||||
canActivate: [unauthGuardFn()],
|
||||
children: [
|
||||
{
|
||||
path: "",
|
||||
component: TwoFactorComponentV1,
|
||||
},
|
||||
{
|
||||
path: "",
|
||||
component: EnvironmentSelectorComponent,
|
||||
outlet: "environment-selector",
|
||||
},
|
||||
],
|
||||
data: {
|
||||
pageTitle: {
|
||||
key: "verifyIdentity",
|
||||
},
|
||||
} satisfies RouteDataProperties & AnonLayoutWrapperData,
|
||||
},
|
||||
{
|
||||
path: "2fa",
|
||||
canActivate: [unauthGuardFn(), TwoFactorAuthGuard],
|
||||
children: [
|
||||
{
|
||||
path: "",
|
||||
component: TwoFactorAuthComponent,
|
||||
},
|
||||
{
|
||||
path: "",
|
||||
component: EnvironmentSelectorComponent,
|
||||
outlet: "environment-selector",
|
||||
},
|
||||
],
|
||||
data: {
|
||||
pageTitle: {
|
||||
key: "verifyIdentity",
|
||||
},
|
||||
} satisfies RouteDataProperties & AnonLayoutWrapperData,
|
||||
},
|
||||
),
|
||||
{
|
||||
path: "lock",
|
||||
canActivate: [deepLinkGuard(), lockGuard()],
|
||||
@@ -522,25 +566,6 @@ const routes: Routes = [
|
||||
showReadonlyHostname: true,
|
||||
} satisfies AnonLayoutWrapperData,
|
||||
},
|
||||
{
|
||||
path: "2fa",
|
||||
canActivate: [unauthGuardFn()],
|
||||
children: [
|
||||
...twofactorRefactorSwap(TwoFactorComponent, TwoFactorAuthComponent, {
|
||||
path: "",
|
||||
}),
|
||||
{
|
||||
path: "",
|
||||
component: EnvironmentSelectorComponent,
|
||||
outlet: "environment-selector",
|
||||
},
|
||||
],
|
||||
data: {
|
||||
pageTitle: {
|
||||
key: "verifyIdentity",
|
||||
},
|
||||
} satisfies RouteDataProperties & AnonLayoutWrapperData,
|
||||
},
|
||||
{
|
||||
path: "authentication-timeout",
|
||||
canActivate: [unauthGuardFn()],
|
||||
|
||||
@@ -44,8 +44,8 @@ import { TwoFactorSetupComponent } from "../auth/settings/two-factor/two-factor-
|
||||
import { TwoFactorVerifyComponent } from "../auth/settings/two-factor/two-factor-verify.component";
|
||||
import { UserVerificationModule } from "../auth/shared/components/user-verification";
|
||||
import { SsoComponentV1 } from "../auth/sso-v1.component";
|
||||
import { TwoFactorOptionsComponent } from "../auth/two-factor-options.component";
|
||||
import { TwoFactorComponent } from "../auth/two-factor.component";
|
||||
import { TwoFactorOptionsComponentV1 } from "../auth/two-factor-options-v1.component";
|
||||
import { TwoFactorComponentV1 } from "../auth/two-factor-v1.component";
|
||||
import { UpdatePasswordComponent } from "../auth/update-password.component";
|
||||
import { UpdateTempPasswordComponent } from "../auth/update-temp-password.component";
|
||||
import { VerifyEmailTokenComponent } from "../auth/verify-email-token.component";
|
||||
@@ -152,12 +152,12 @@ import { SharedModule } from "./shared.module";
|
||||
SetPasswordComponent,
|
||||
SponsoredFamiliesComponent,
|
||||
SponsoringOrgRowComponent,
|
||||
TwoFactorComponentV1,
|
||||
SsoComponentV1,
|
||||
TwoFactorSetupAuthenticatorComponent,
|
||||
TwoFactorComponent,
|
||||
TwoFactorSetupDuoComponent,
|
||||
TwoFactorSetupEmailComponent,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorOptionsComponentV1,
|
||||
TwoFactorRecoveryComponent,
|
||||
TwoFactorSetupComponent,
|
||||
TwoFactorVerifyComponent,
|
||||
@@ -216,19 +216,18 @@ import { SharedModule } from "./shared.module";
|
||||
SetPasswordComponent,
|
||||
SponsoredFamiliesComponent,
|
||||
SponsoringOrgRowComponent,
|
||||
TwoFactorComponentV1,
|
||||
SsoComponentV1,
|
||||
TwoFactorSetupAuthenticatorComponent,
|
||||
TwoFactorComponent,
|
||||
TwoFactorSetupDuoComponent,
|
||||
TwoFactorSetupEmailComponent,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorRecoveryComponent,
|
||||
TwoFactorOptionsComponentV1,
|
||||
TwoFactorSetupComponent,
|
||||
TwoFactorVerifyComponent,
|
||||
TwoFactorSetupWebAuthnComponent,
|
||||
TwoFactorSetupYubiKeyComponent,
|
||||
UpdatePasswordComponent,
|
||||
UpdateTempPasswordComponent,
|
||||
UpdatePasswordComponent,
|
||||
UserLayoutComponent,
|
||||
VerifyEmailTokenComponent,
|
||||
VerifyRecoverDeleteComponent,
|
||||
|
||||
@@ -1,39 +1,132 @@
|
||||
<!doctype html>
|
||||
<html class="theme_light">
|
||||
<html class="theme_light tw-h-full">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
|
||||
<title>Bitwarden WebAuthn Connector</title>
|
||||
</head>
|
||||
|
||||
<body class="layout_frontend">
|
||||
<div class="container">
|
||||
<div class="row justify-content-center mt-5">
|
||||
<div class="col-5">
|
||||
<img src="../images/logo-dark@2x.png" class="mb-4 logo" alt="Bitwarden" />
|
||||
<div id="spinner">
|
||||
<p class="text-center">
|
||||
<i
|
||||
class="bwi bwi-spinner bwi-spin bwi-2x text-muted"
|
||||
title="Loading"
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
</p>
|
||||
</div>
|
||||
<div id="content" class="card mt-4 d-none">
|
||||
<div class="card-body ng-star-inserted">
|
||||
<p id="msg" class="text-center"></p>
|
||||
<div class="form-check">
|
||||
<input type="checkbox" class="form-check-input" id="remember" name="remember" />
|
||||
<label class="form-check-label" for="remember" id="remember-label"></label>
|
||||
</div>
|
||||
<hr />
|
||||
<p class="text-center mb-0">
|
||||
<button type="button" id="webauthn-button" class="btn btn-primary btn-lg"></button>
|
||||
</p>
|
||||
</div>
|
||||
<body class="tw-min-h-full !tw-min-w-0 tw-text-center !tw-bg-background-alt">
|
||||
<main class="tw-flex tw-w-full tw-mx-auto tw-flex-col tw-px-6 tw-pt-6 tw-pb-4 tw-text-main">
|
||||
<a class="tw-w-[128px] tw-block tw-mb-12 [&>*]:tw-align-top">
|
||||
<img class="new-logo-themed" alt="Bitwarden" />
|
||||
</a>
|
||||
|
||||
<div class="tw-text-center tw-mb-6 tw-max-w-md tw-mx-auto">
|
||||
<div class="tw-mx-auto tw-max-w-28 sm:tw-max-w-32">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 120 100">
|
||||
<path
|
||||
class="tw-fill-art-primary"
|
||||
d="M19.258 16.434c0-3.635 2.966-6.58 6.626-6.58H56.88c3.659 0 6.625 2.946 6.625 6.58v27.788l-2.208 2.667V16.434c0-2.423-1.978-4.387-4.417-4.387H25.884c-2.44 0-4.418 1.964-4.418 4.387v67.09c0 2.422 1.978 4.386 4.418 4.386h16.389l-.814 2.194H25.884c-3.66 0-6.626-2.947-6.626-6.58v-67.09Z"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-primary"
|
||||
fill-rule="evenodd"
|
||||
d="M40.119 19.287a.55.55 0 0 1 .552-.548h2.208a.55.55 0 0 1 .553.548.55.55 0 0 1-.553.549h-2.208a.55.55 0 0 1-.552-.549Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-accent"
|
||||
fill-rule="evenodd"
|
||||
d="M31.994 38.828c2.103-3.001 5.541-4.957 9.425-4.957 5.66 0 10.376 4.155 11.392 9.653a.567.567 0 0 1-.439.664.553.553 0 0 1-.646-.451c-.918-4.969-5.183-8.73-10.307-8.73-3.515 0-6.625 1.769-8.53 4.485a.542.542 0 0 1-.77.129.579.579 0 0 1-.125-.793Zm-.623 2.186c.282.117.42.448.305.74a10.928 10.928 0 0 0-.748 3.992v3.46a.56.56 0 0 1-.553.569.56.56 0 0 1-.552-.568v-3.461c0-1.56.294-3.051.829-4.417a.547.547 0 0 1 .718-.315Zm21.09 4.164a.56.56 0 0 1 .553.568v3.23a.56.56 0 0 1-.552.568.56.56 0 0 1-.552-.568v-3.23a.56.56 0 0 1 .552-.568Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-accent"
|
||||
fill-rule="evenodd"
|
||||
d="M32.823 41.892c1.451-3.427 4.75-5.827 8.596-5.827 1.98 0 3.819.638 5.333 1.725.25.18.31.532.135.788a.544.544 0 0 1-.769.138 8.02 8.02 0 0 0-4.7-1.52c-3.382 0-6.297 2.111-7.582 5.146a.547.547 0 0 1-.726.294.57.57 0 0 1-.287-.744Zm14.94-2.495a.543.543 0 0 1 .778.066 9.936 9.936 0 0 1 2.265 6.35v7.783a.559.559 0 0 1-.552.566.559.559 0 0 1-.553-.566v-7.782a8.788 8.788 0 0 0-2.002-5.62.575.575 0 0 1 .064-.797Zm-15.06 4.804a.562.562 0 0 1 .487.625 9.062 9.062 0 0 0-.053.988v7.782a.559.559 0 0 1-.553.566.559.559 0 0 1-.552-.566v-7.782c0-.377.02-.748.06-1.114a.555.555 0 0 1 .611-.499Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-accent"
|
||||
fill-rule="evenodd"
|
||||
d="M34.24 45.704c0-4.105 3.207-7.446 7.178-7.446 3.972 0 7.178 3.341 7.178 7.446V55.79a.559.559 0 0 1-.552.565.559.559 0 0 1-.552-.565V45.704c0-3.495-2.726-6.315-6.074-6.315-3.347 0-6.073 2.82-6.073 6.315v3.948a.559.559 0 0 1-.553.566.559.559 0 0 1-.552-.566v-3.948Zm.552 5.572c.305 0 .553.253.553.565v3.949a.559.559 0 0 1-.553.565.559.559 0 0 1-.552-.565V51.84c0-.312.247-.565.552-.565Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-accent"
|
||||
fill-rule="evenodd"
|
||||
d="M38.89 41.142a4.955 4.955 0 0 1 2.529-.69 4.966 4.966 0 0 1 4.97 4.962v3.044a.55.55 0 0 1-.553.548.55.55 0 0 1-.552-.548v-3.044a3.865 3.865 0 0 0-5.83-3.33.554.554 0 0 1-.757-.19.546.546 0 0 1 .192-.752Zm-.911 1.45c.258.16.335.5.173.756a3.844 3.844 0 0 0-.599 2.066v11.49a.55.55 0 0 1-.552.548.55.55 0 0 1-.552-.548v-11.49c0-.974.282-1.884.768-2.651a.554.554 0 0 1 .762-.172Zm7.857 7.904a.55.55 0 0 1 .552.549v5.859a.55.55 0 0 1-.552.548.55.55 0 0 1-.552-.548v-5.86a.55.55 0 0 1 .552-.547Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-accent"
|
||||
fill-rule="evenodd"
|
||||
d="M38.658 45.306c0-1.488 1.256-2.66 2.76-2.66 1.505 0 2.761 1.172 2.761 2.66v4.829a.55.55 0 0 1-.552.548.55.55 0 0 1-.552-.548v-4.828c0-.845-.722-1.564-1.657-1.564-.934 0-1.656.72-1.656 1.563v12.146a.55.55 0 0 1-.552.549.55.55 0 0 1-.552-.549V45.307Zm4.97 6.317a.55.55 0 0 1 .551.549v5.28a.55.55 0 0 1-.552.549.55.55 0 0 1-.552-.549v-5.28a.55.55 0 0 1 .552-.549Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-accent"
|
||||
fill-rule="evenodd"
|
||||
d="M41.419 44.84a.55.55 0 0 1 .552.548v1.9a.55.55 0 0 1-.552.548.55.55 0 0 1-.552-.549v-1.9a.55.55 0 0 1 .552-.548Zm0 4a.55.55 0 0 1 .552.548V58a.55.55 0 0 1-.552.549.55.55 0 0 1-.552-.549v-8.612a.55.55 0 0 1 .552-.549Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-primary"
|
||||
fill-rule="evenodd"
|
||||
d="M48.904 87.97c2.492 0 4.542-2.042 4.542-4.616 0-2.51-1.986-4.616-4.542-4.616-2.55 0-4.543 2.049-4.543 4.616 0 2.574 2.05 4.616 4.543 4.616Zm3.016-4.616c0 1.739-1.376 3.086-3.016 3.086-1.64 0-3.017-1.347-3.017-3.086 0-1.745 1.333-3.086 3.017-3.086 1.677 0 3.016 1.385 3.016 3.086Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-primary"
|
||||
fill-rule="evenodd"
|
||||
d="M108.913 84.456a.767.767 0 0 0 0-1.074l-6.098-6.213a.76.76 0 0 0-.544-.228H70.225c-2.438-5.616-7.969-9.602-14.417-9.602-8.75 0-15.73 7.185-15.73 16.015 0 8.832 7.032 16.015 15.73 16.015 6.498 0 12.081-4.036 14.475-9.756h8.303c.204 0 .4-.082.544-.228l2.933-2.989 3.034 3.091a.762.762 0 0 0 1.088 0l.918-.934.766.78a.762.762 0 0 0 1.08.008l3.135-3.107 3.294 3.356c.143.146.339.229.543.229h7.408a.76.76 0 0 0 .544-.229l5.04-5.134Zm-5.903 3.832h-6.769l-3.606-3.674a.762.762 0 0 0-1.08-.007l-3.135 3.106-.774-.788a.762.762 0 0 0-1.087 0l-.918.935-3.034-3.091a.762.762 0 0 0-1.088 0l-3.253 3.314h-8.5c-.316 0-.6.196-.712.493-2.06 5.419-7.23 9.263-13.246 9.263-7.832 0-14.204-6.475-14.204-14.485 0-8.011 6.323-14.485 14.204-14.485 5.966 0 11.09 3.795 13.2 9.12a.763.763 0 0 0 .709.482h32.235l5.346 5.448-4.288 4.37Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-accent"
|
||||
d="M100.357 80.991a.382.382 0 0 0-.382-.382H73.651a.382.382 0 0 0 0 .765h26.324c.211 0 .382-.171.382-.383ZM65.693 77.56c-2.04-3.686-5.74-6.133-9.95-6.133-.895 0-1.766.11-2.602.319a.382.382 0 0 1-.184-.743 11.478 11.478 0 0 1 2.785-.341c4.52 0 8.46 2.627 10.618 6.528a14.09 14.09 0 0 1 1.563 4.503.382.382 0 1 1-.752.126 13.324 13.324 0 0 0-1.478-4.258Z"
|
||||
/>
|
||||
<path
|
||||
class="tw-fill-art-primary tw-stroke-art-primary"
|
||||
fill-rule="evenodd"
|
||||
stroke-width=".355"
|
||||
d="M75.94 32.403c8.007 0 14.498 6.51 14.498 14.538a14.542 14.542 0 0 1-9.26 13.56c8.849 1.9 15.896 8.519 18.221 17.036l-1.472.404C95.343 68.475 86.492 61.48 75.95 61.48c-6.743 0-12.796 2.861-16.96 7.404l-1.123-1.036a24.374 24.374 0 0 1 12.842-7.344 14.542 14.542 0 0 1-9.265-13.563c0-8.029 6.49-14.538 14.497-14.538Zm12.972 14.538c0-7.184-5.808-13.007-12.972-13.007S62.97 39.757 62.97 46.94c0 7.184 5.807 13.008 12.971 13.008s12.972-5.823 12.972-13.008Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<!-- Small screens -->
|
||||
<h1 bitTypography="h3" class="tw-mt-2 sm:tw-hidden" id="title-smaller-screens"></h1>
|
||||
<!-- Medium to Larger screens -->
|
||||
<h1
|
||||
bitTypography="h2"
|
||||
class="tw-mt-2 tw-hidden sm:tw-block"
|
||||
id="title-larger-screens"
|
||||
></h1>
|
||||
</div>
|
||||
|
||||
<div class="tw-text-sm sm:tw-text-base" id="subtitle"></div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="tw-grow tw-w-full tw-max-w-md tw-mx-auto tw-flex tw-flex-col tw-items-center sm:tw-min-w-[28rem]"
|
||||
>
|
||||
<div
|
||||
class="tw-rounded-2xl tw-mb-10 tw-mx-auto tw-w-full sm:tw-bg-background sm:tw-border sm:tw-border-solid sm:tw-border-secondary-300 sm:tw-p-8"
|
||||
>
|
||||
<p id="msg" class="tw-hidden"></p>
|
||||
|
||||
<div class="tw-block tw-mb-4">
|
||||
<input type="checkbox" class="" id="remember" name="remember" />
|
||||
<label
|
||||
class="tw-inline-flex tw-gap-1 tw-items-baseline tw-flex-row tw-min-w-0 !tw-font-normal"
|
||||
for="remember"
|
||||
id="remember-label"
|
||||
></label>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
id="webauthn-button"
|
||||
class="!tw-text-contrast disabled:!tw-text-muted disabled:hover:!tw-text-muted disabled:hover:tw-bg-secondary-300 disabled:hover:tw-border-secondary-300 disabled:hover:tw-no-underline disabled:tw-bg-secondary-300 disabled:tw-border-secondary-300 disabled:tw-cursor-not-allowed focus-visible:tw-ring-2 focus-visible:tw-ring-offset-2 focus-visible:tw-ring-primary-600 focus-visible:tw-z-10 focus:tw-outline-none hover:tw-bg-primary-700 hover:tw-border-primary-700 hover:tw-no-underline tw-bg-primary-600 tw-block tw-border-2 tw-border-primary-600 tw-border-solid tw-font-semibold tw-no-underline tw-px-3 tw-py-1.5 tw-rounded-full tw-text-center tw-transition tw-w-full"
|
||||
></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -4,10 +4,6 @@ import { b64Decode, getQsParam } from "./common";
|
||||
import { buildDataString, parseWebauthnJson } from "./common-webauthn";
|
||||
import { TranslationService } from "./translation.service";
|
||||
|
||||
// FIXME: Remove when updating file. Eslint update
|
||||
// eslint-disable-next-line @typescript-eslint/no-require-imports
|
||||
require("./webauthn.scss");
|
||||
|
||||
let parsed = false;
|
||||
let webauthnJson: any;
|
||||
let parentUrl: string = null;
|
||||
@@ -75,17 +71,22 @@ document.addEventListener("DOMContentLoaded", async () => {
|
||||
|
||||
await localeService.init();
|
||||
|
||||
document.getElementById("msg").innerText = localeService.t("webAuthnFallbackMsg");
|
||||
document.getElementById("remember-label").innerText = localeService.t("rememberMe");
|
||||
document.getElementById("remember-label").innerText = localeService.t(
|
||||
"dontAskAgainOnThisDeviceFor30Days",
|
||||
);
|
||||
|
||||
const button = document.getElementById("webauthn-button");
|
||||
button.innerText = localeService.t("webAuthnAuthenticate");
|
||||
button.innerText = localeService.t("readSecurityKey");
|
||||
button.onclick = start;
|
||||
|
||||
document.getElementById("spinner").classList.add("d-none");
|
||||
const content = document.getElementById("content");
|
||||
content.classList.add("d-block");
|
||||
content.classList.remove("d-none");
|
||||
const titleForSmallerScreens = document.getElementById("title-smaller-screens");
|
||||
const titleForLargerScreens = document.getElementById("title-larger-screens");
|
||||
|
||||
titleForSmallerScreens.innerText = localeService.t("verifyIdentity");
|
||||
titleForLargerScreens.innerText = localeService.t("verifyIdentity");
|
||||
|
||||
const subtitle = document.getElementById("subtitle");
|
||||
subtitle.innerText = localeService.t("followTheStepsBelowToFinishLoggingIn");
|
||||
});
|
||||
|
||||
function start() {
|
||||
@@ -146,20 +147,24 @@ function error(message: string) {
|
||||
el.textContent = message;
|
||||
el.classList.add("alert");
|
||||
el.classList.add("alert-danger");
|
||||
el.classList.remove("tw-hidden");
|
||||
}
|
||||
|
||||
function success(message: string) {
|
||||
(document.getElementById("webauthn-button") as HTMLButtonElement).disabled = true;
|
||||
(document.getElementById("remember") as HTMLInputElement).disabled = true;
|
||||
|
||||
const el = document.getElementById("msg");
|
||||
resetMsgBox(el);
|
||||
el.textContent = message;
|
||||
el.classList.add("alert");
|
||||
el.classList.add("alert-success");
|
||||
el.classList.remove("tw-hidden");
|
||||
}
|
||||
|
||||
function resetMsgBox(el: HTMLElement) {
|
||||
el.classList.remove("alert");
|
||||
el.classList.remove("alert-danger");
|
||||
el.classList.remove("alert-success");
|
||||
el.classList.add("tw-hidden");
|
||||
}
|
||||
|
||||
@@ -5,14 +5,11 @@
|
||||
<title>Bitwarden WebAuthn Connector</title>
|
||||
</head>
|
||||
|
||||
<body style="background: transparent">
|
||||
<picture>
|
||||
<source srcset="../images/u2fkey.avif" type="image/avif" />
|
||||
<source srcset="../images/u2fkey.webp" type="image/webp" />
|
||||
<img src="../images/u2fkey.jpg" class="rounded img-fluid mb-3" />
|
||||
</picture>
|
||||
<div class="text-center">
|
||||
<button type="button" id="webauthn-button" class="btn btn-primary"></button>
|
||||
</div>
|
||||
<body class="tw-h-full tw-m-0 tw-flex tw-justify-center tw-items-center tw-bg-transparent">
|
||||
<button
|
||||
type="button"
|
||||
id="webauthn-button"
|
||||
class="tw-block !tw-text-contrast focus-visible:tw-ring-2 focus-visible:tw-ring-offset-2 focus-visible:tw-ring-primary-600 focus-visible:tw-z-10 focus:tw-outline-none hover:tw-bg-primary-700 hover:tw-border-primary-700 hover:tw-no-underline tw-bg-primary-600 tw-border-2 tw-border-primary-600 tw-border-solid tw-font-semibold tw-no-underline tw-px-3 tw-py-1.5 tw-rounded-full tw-text-center tw-transition tw-w-full"
|
||||
></button>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -13,6 +13,7 @@ let parsed = false;
|
||||
let webauthnJson: any;
|
||||
let headerText: string = null;
|
||||
let btnText: string = null;
|
||||
let btnAwaitingInteractionText: string = null;
|
||||
let btnReturnText: string = null;
|
||||
let parentUrl: string = null;
|
||||
let parentOrigin: string = null;
|
||||
@@ -21,21 +22,60 @@ let stopWebAuthn = false;
|
||||
let sentSuccess = false;
|
||||
let obj: any = null;
|
||||
|
||||
// For accessibility, we do not actually disable the button as it would
|
||||
// become unfocusable by a screenreader. We just make it look disabled.
|
||||
const disabledBtnClasses = [
|
||||
"tw-bg-secondary-300",
|
||||
"tw-border-secondary-300",
|
||||
"!tw-text-muted",
|
||||
"!tw-cursor-not-allowed",
|
||||
"hover:tw-bg-secondary-300",
|
||||
"hover:tw-border-secondary-300",
|
||||
"hover:!tw-text-muted",
|
||||
"hover:tw-no-underline",
|
||||
];
|
||||
|
||||
const enabledBtnClasses = [
|
||||
"tw-bg-primary-600",
|
||||
"tw-border-primary-600",
|
||||
"!tw-text-contrast",
|
||||
"hover:tw-bg-primary-700",
|
||||
"hover:tw-border-primary-700",
|
||||
"hover:!tw-text-contrast",
|
||||
"hover:tw-no-underline",
|
||||
];
|
||||
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
init();
|
||||
|
||||
parseParameters();
|
||||
if (headerText) {
|
||||
const header = document.getElementById("webauthn-header");
|
||||
header.innerText = decodeURI(headerText);
|
||||
}
|
||||
if (btnText) {
|
||||
const button = document.getElementById("webauthn-button");
|
||||
button.innerText = decodeURI(btnText);
|
||||
button.onclick = executeWebAuthn;
|
||||
}
|
||||
});
|
||||
|
||||
function setDefaultWebAuthnButtonState() {
|
||||
if (!btnText) {
|
||||
return;
|
||||
}
|
||||
|
||||
const button = document.getElementById("webauthn-button");
|
||||
button.onclick = executeWebAuthn;
|
||||
|
||||
button.innerText = decodeURI(btnText);
|
||||
|
||||
// reset back to default button state
|
||||
button.classList.remove(...disabledBtnClasses);
|
||||
button.classList.add(...enabledBtnClasses);
|
||||
}
|
||||
|
||||
function setAwaitingInteractionWebAuthnButtonState() {
|
||||
if (!btnAwaitingInteractionText) {
|
||||
return;
|
||||
}
|
||||
const button = document.getElementById("webauthn-button");
|
||||
button.innerText = decodeURI(btnAwaitingInteractionText);
|
||||
button.onclick = null;
|
||||
|
||||
button.classList.remove(...enabledBtnClasses);
|
||||
button.classList.add(...disabledBtnClasses);
|
||||
}
|
||||
|
||||
function init() {
|
||||
start();
|
||||
onMessage();
|
||||
@@ -76,6 +116,7 @@ function parseParametersV1() {
|
||||
webauthnJson = b64Decode(data);
|
||||
headerText = getQsParam("headerText");
|
||||
btnText = getQsParam("btnText");
|
||||
btnAwaitingInteractionText = getQsParam("btnAwaitingInteractionText");
|
||||
btnReturnText = getQsParam("btnReturnText");
|
||||
}
|
||||
|
||||
@@ -113,6 +154,14 @@ function start() {
|
||||
}
|
||||
|
||||
parseParameters();
|
||||
|
||||
if (headerText) {
|
||||
const header = document.getElementById("webauthn-header");
|
||||
header.innerText = decodeURI(headerText);
|
||||
}
|
||||
|
||||
setDefaultWebAuthnButtonState();
|
||||
|
||||
if (!webauthnJson) {
|
||||
error("No data.");
|
||||
return;
|
||||
@@ -141,9 +190,12 @@ function start() {
|
||||
|
||||
function executeWebAuthn() {
|
||||
if (stopWebAuthn) {
|
||||
// reset back to default button state
|
||||
setDefaultWebAuthnButtonState();
|
||||
return;
|
||||
}
|
||||
|
||||
setAwaitingInteractionWebAuthnButtonState();
|
||||
navigator.credentials.get({ publicKey: obj }).then(success).catch(error);
|
||||
}
|
||||
|
||||
@@ -156,6 +208,7 @@ function onMessage() {
|
||||
}
|
||||
|
||||
if (event.data === "stop") {
|
||||
setDefaultWebAuthnButtonState();
|
||||
stopWebAuthn = true;
|
||||
} else if (event.data === "start" && stopWebAuthn) {
|
||||
start();
|
||||
@@ -171,6 +224,7 @@ function error(message: string) {
|
||||
returnButton(mobileCallbackUri + "?error=" + encodeURIComponent(message));
|
||||
} else {
|
||||
parent.postMessage("error|" + message, parentUrl);
|
||||
setDefaultWebAuthnButtonState();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1182,6 +1182,15 @@
|
||||
"logInToBitwarden": {
|
||||
"message": "Log in to Bitwarden"
|
||||
},
|
||||
"enterTheCodeSentToYourEmail": {
|
||||
"message": "Enter the code sent to your email"
|
||||
},
|
||||
"enterTheCodeFromYourAuthenticatorApp": {
|
||||
"message": "Enter the code from your authenticator app"
|
||||
},
|
||||
"pressYourYubiKeyToAuthenticate": {
|
||||
"message": "Press your YubiKey to authenticate"
|
||||
},
|
||||
"authenticationTimeout": {
|
||||
"message": "Authentication timeout"
|
||||
},
|
||||
@@ -1464,12 +1473,22 @@
|
||||
"rememberMe": {
|
||||
"message": "Remember me"
|
||||
},
|
||||
"dontAskAgainOnThisDeviceFor30Days": {
|
||||
"message": "Don't ask again on this device for 30 days"
|
||||
},
|
||||
"sendVerificationCodeEmailAgain": {
|
||||
"message": "Send verification code email again"
|
||||
},
|
||||
"useAnotherTwoStepMethod": {
|
||||
"message": "Use another two-step login method"
|
||||
},
|
||||
"selectAnotherMethod": {
|
||||
"message": "Select another method",
|
||||
"description": "Select another two-step login method"
|
||||
},
|
||||
"useYourRecoveryCode": {
|
||||
"message": "Use your recovery code"
|
||||
},
|
||||
"insertYubiKey": {
|
||||
"message": "Insert your YubiKey into your computer's USB port, then touch its button."
|
||||
},
|
||||
@@ -1488,6 +1507,9 @@
|
||||
"twoStepOptions": {
|
||||
"message": "Two-step login options"
|
||||
},
|
||||
"selectTwoStepLoginMethod": {
|
||||
"message": "Select two-step login method"
|
||||
},
|
||||
"recoveryCodeDesc": {
|
||||
"message": "Lost access to all of your two-step login providers? Use your recovery code to turn off all two-step login providers from your account."
|
||||
},
|
||||
@@ -1530,6 +1552,9 @@
|
||||
"webAuthnMigrated": {
|
||||
"message": "(Migrated from FIDO)"
|
||||
},
|
||||
"openInNewTab": {
|
||||
"message": "Open in new tab"
|
||||
},
|
||||
"emailTitle": {
|
||||
"message": "Email"
|
||||
},
|
||||
@@ -5683,6 +5708,12 @@
|
||||
"webAuthnAuthenticate": {
|
||||
"message": "Authenticate WebAuthn"
|
||||
},
|
||||
"readSecurityKey": {
|
||||
"message": "Read security key"
|
||||
},
|
||||
"awaitingSecurityKeyInteraction": {
|
||||
"message": "Awaiting security key interaction..."
|
||||
},
|
||||
"webAuthnNotSupported": {
|
||||
"message": "WebAuthn is not supported in this browser."
|
||||
},
|
||||
@@ -7229,6 +7260,12 @@
|
||||
"duoRequiredByOrgForAccount": {
|
||||
"message": "Duo two-step login is required for your account."
|
||||
},
|
||||
"duoTwoFactorRequiredPageSubtitle": {
|
||||
"message": "Duo two-step login is required for your account. Follow the steps below to finish logging in."
|
||||
},
|
||||
"followTheStepsBelowToFinishLoggingIn": {
|
||||
"message": "Follow the steps below to finish logging in."
|
||||
},
|
||||
"launchDuo": {
|
||||
"message": "Launch Duo"
|
||||
},
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
}
|
||||
|
||||
#web-authn-frame {
|
||||
height: 315px;
|
||||
height: 40px;
|
||||
@include themify($themes) {
|
||||
background: themed("imgLoading") 0 0 no-repeat;
|
||||
}
|
||||
|
||||
@@ -106,7 +106,7 @@ const plugins = [
|
||||
new HtmlWebpackPlugin({
|
||||
template: "./src/connectors/webauthn.html",
|
||||
filename: "webauthn-connector.html",
|
||||
chunks: ["connectors/webauthn"],
|
||||
chunks: ["connectors/webauthn", "styles"],
|
||||
}),
|
||||
new HtmlWebpackPlugin({
|
||||
template: "./src/connectors/webauthn-mobile.html",
|
||||
@@ -116,7 +116,7 @@ const plugins = [
|
||||
new HtmlWebpackPlugin({
|
||||
template: "./src/connectors/webauthn-fallback.html",
|
||||
filename: "webauthn-fallback-connector.html",
|
||||
chunks: ["connectors/webauthn-fallback"],
|
||||
chunks: ["connectors/webauthn-fallback", "styles"],
|
||||
}),
|
||||
new HtmlWebpackPlugin({
|
||||
template: "./src/connectors/sso.html",
|
||||
|
||||
@@ -1,16 +0,0 @@
|
||||
<ng-container>
|
||||
<p bitTypography="body1">
|
||||
{{ "enterVerificationCodeApp" | i18n }}
|
||||
</p>
|
||||
<bit-form-field>
|
||||
<bit-label>{{ "verificationCode" | i18n }}</bit-label>
|
||||
<input
|
||||
bitInput
|
||||
type="text"
|
||||
appAutofocus
|
||||
appInputVerbatim
|
||||
[(ngModel)]="tokenValue"
|
||||
(input)="token.emit(tokenValue)"
|
||||
/>
|
||||
</bit-form-field>
|
||||
</ng-container>
|
||||
@@ -1,6 +0,0 @@
|
||||
<ng-container>
|
||||
<p bitTypography="body1" class="tw-mb-0">
|
||||
{{ "duoRequiredByOrgForAccount" | i18n }}
|
||||
</p>
|
||||
<p bitTypography="body1">{{ "launchDuoAndFollowStepsToFinishLoggingIn" | i18n }}</p>
|
||||
</ng-container>
|
||||
@@ -1,81 +0,0 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, EventEmitter, Input, OnInit, Output } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import {
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
ToastService,
|
||||
} from "@bitwarden/components";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth-duo",
|
||||
templateUrl: "two-factor-auth-duo.component.html",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
})
|
||||
export class TwoFactorAuthDuoComponent implements OnInit {
|
||||
@Output() token = new EventEmitter<string>();
|
||||
@Input() providerData: any;
|
||||
|
||||
duoFramelessUrl: string = null;
|
||||
duoResultListenerInitialized = false;
|
||||
|
||||
constructor(
|
||||
protected i18nService: I18nService,
|
||||
protected platformUtilsService: PlatformUtilsService,
|
||||
protected toastService: ToastService,
|
||||
) {}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
await this.init();
|
||||
}
|
||||
|
||||
async init() {
|
||||
// Setup listener for duo-redirect.ts connector to send back the code
|
||||
if (!this.duoResultListenerInitialized) {
|
||||
// setup client specific duo result listener
|
||||
this.setupDuoResultListener();
|
||||
this.duoResultListenerInitialized = true;
|
||||
}
|
||||
|
||||
// flow must be launched by user so they can choose to remember the device or not.
|
||||
this.duoFramelessUrl = this.providerData.AuthUrl;
|
||||
}
|
||||
|
||||
// Each client will have own implementation
|
||||
protected setupDuoResultListener(): void {}
|
||||
async launchDuoFrameless(): Promise<void> {
|
||||
if (this.duoFramelessUrl === null) {
|
||||
this.toastService.showToast({
|
||||
variant: "error",
|
||||
title: null,
|
||||
message: this.i18nService.t("duoHealthCheckResultsInNullAuthUrlError"),
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.platformUtilsService.launchUri(this.duoFramelessUrl);
|
||||
}
|
||||
}
|
||||
@@ -1,19 +0,0 @@
|
||||
<p bitTypography="body1">
|
||||
{{ "enterVerificationCodeEmail" | i18n: twoFactorEmail }}
|
||||
</p>
|
||||
<bit-form-field>
|
||||
<bit-label>{{ "verificationCode" | i18n }}</bit-label>
|
||||
<input
|
||||
bitInput
|
||||
type="text"
|
||||
appAutofocus
|
||||
appInputVerbatim
|
||||
[(ngModel)]="tokenValue"
|
||||
(input)="token.emit(tokenValue)"
|
||||
/>
|
||||
<bit-hint>
|
||||
<a bitLink href="#" appStopClick (click)="sendEmail(true)">
|
||||
{{ "sendVerificationCodeEmailAgain" | i18n }}
|
||||
</a></bit-hint
|
||||
>
|
||||
</bit-form-field>
|
||||
@@ -1,11 +0,0 @@
|
||||
<div id="web-authn-frame" class="tw-mb-3" *ngIf="!webAuthnNewTab">
|
||||
<iframe id="webauthn_iframe" sandbox="allow-scripts allow-same-origin"></iframe>
|
||||
</div>
|
||||
<ng-container *ngIf="webAuthnNewTab">
|
||||
<div class="content text-center" *ngIf="webAuthnNewTab">
|
||||
<p class="text-center">{{ "webAuthnNewTab" | i18n }}</p>
|
||||
<button type="button" class="btn primary block" (click)="authWebAuthn()" appStopClick>
|
||||
{{ "webAuthnNewTabOpen" | i18n }}
|
||||
</button>
|
||||
</div>
|
||||
</ng-container>
|
||||
@@ -1,17 +0,0 @@
|
||||
<p bitTypography="body1" class="tw-text-center">{{ "insertYubiKey" | i18n }}</p>
|
||||
<picture>
|
||||
<source srcset="../../images/yubikey.avif" type="image/avif" />
|
||||
<source srcset="../../images/yubikey.webp" type="image/webp" />
|
||||
<img src="../../images/yubikey.jpg" class="tw-rounded img-fluid tw-mb-3" alt="" />
|
||||
</picture>
|
||||
<bit-form-field>
|
||||
<bit-label class="tw-sr-only">{{ "verificationCode" | i18n }}</bit-label>
|
||||
<input
|
||||
type="password"
|
||||
bitInput
|
||||
appAutofocus
|
||||
appInputVerbatim
|
||||
[(ngModel)]="tokenValue"
|
||||
(input)="token.emit(tokenValue)"
|
||||
/>
|
||||
</bit-form-field>
|
||||
@@ -1,76 +0,0 @@
|
||||
<form [bitSubmit]="submitForm" [formGroup]="formGroup" autocomplete="off">
|
||||
<app-two-factor-auth-email
|
||||
(token)="token = $event"
|
||||
*ngIf="selectedProviderType === providerType.Email"
|
||||
/>
|
||||
<app-two-factor-auth-authenticator
|
||||
(token)="token = $event"
|
||||
*ngIf="selectedProviderType === providerType.Authenticator"
|
||||
/>
|
||||
<app-two-factor-auth-yubikey
|
||||
(token)="token = $event"
|
||||
*ngIf="selectedProviderType === providerType.Yubikey"
|
||||
/>
|
||||
<app-two-factor-auth-webauthn
|
||||
(token)="token = $event; submitForm()"
|
||||
*ngIf="selectedProviderType === providerType.WebAuthn"
|
||||
/>
|
||||
<app-two-factor-auth-duo
|
||||
(token)="token = $event; submitForm()"
|
||||
[providerData]="providerData"
|
||||
*ngIf="
|
||||
selectedProviderType === providerType.OrganizationDuo ||
|
||||
selectedProviderType === providerType.Duo
|
||||
"
|
||||
#duoComponent
|
||||
/>
|
||||
<bit-form-control *ngIf="selectedProviderType != null">
|
||||
<bit-label>{{ "rememberMe" | i18n }}</bit-label>
|
||||
<input type="checkbox" bitCheckbox formControlName="remember" />
|
||||
</bit-form-control>
|
||||
<ng-container *ngIf="selectedProviderType == null">
|
||||
<p bitTypography="body1">{{ "noTwoStepProviders" | i18n }}</p>
|
||||
<p bitTypography="body1">{{ "noTwoStepProviders2" | i18n }}</p>
|
||||
</ng-container>
|
||||
<div [hidden]="!showCaptcha()">
|
||||
<iframe id="hcaptcha_iframe" height="80" sandbox="allow-scripts allow-same-origin"></iframe>
|
||||
</div>
|
||||
<!-- Buttons -->
|
||||
<div class="tw-flex tw-flex-col tw-space-y-2.5 tw-mb-3">
|
||||
<button
|
||||
type="submit"
|
||||
buttonType="primary"
|
||||
bitButton
|
||||
bitFormButton
|
||||
*ngIf="
|
||||
selectedProviderType != null &&
|
||||
selectedProviderType !== providerType.WebAuthn &&
|
||||
selectedProviderType !== providerType.Duo &&
|
||||
selectedProviderType !== providerType.OrganizationDuo
|
||||
"
|
||||
>
|
||||
<span> <i class="bwi bwi-sign-in" aria-hidden="true"></i> {{ actionButtonText }} </span>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
buttonType="primary"
|
||||
bitButton
|
||||
(click)="launchDuo()"
|
||||
*ngIf="
|
||||
selectedProviderType === providerType.Duo ||
|
||||
selectedProviderType === providerType.OrganizationDuo
|
||||
"
|
||||
>
|
||||
<span> <i class="bwi bwi-sign-in" aria-hidden="true"></i> {{ "launchDuo" | i18n }}</span>
|
||||
</button>
|
||||
|
||||
<a routerLink="/login" bitButton buttonType="secondary">
|
||||
{{ "cancel" | i18n }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<a bitLink href="#" appStopClick (click)="selectOtherTwoFactorMethod()">{{
|
||||
"useAnotherTwoStepMethod" | i18n
|
||||
}}</a>
|
||||
</div>
|
||||
</form>
|
||||
@@ -1,414 +0,0 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, Inject, OnInit, ViewChild } from "@angular/core";
|
||||
import { FormBuilder, ReactiveFormsModule, Validators } from "@angular/forms";
|
||||
import { ActivatedRoute, NavigationExtras, Router, RouterLink } from "@angular/router";
|
||||
import { Subject, takeUntil, lastValueFrom, first, firstValueFrom } from "rxjs";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import { WINDOW } from "@bitwarden/angular/services/injection-tokens";
|
||||
import {
|
||||
LoginStrategyServiceAbstraction,
|
||||
LoginEmailServiceAbstraction,
|
||||
UserDecryptionOptionsServiceAbstraction,
|
||||
TrustedDeviceUserDecryptionOption,
|
||||
UserDecryptionOptions,
|
||||
} from "@bitwarden/auth/common";
|
||||
import { AccountService } from "@bitwarden/common/auth/abstractions/account.service";
|
||||
import { InternalMasterPasswordServiceAbstraction } from "@bitwarden/common/auth/abstractions/master-password.service.abstraction";
|
||||
import { SsoLoginServiceAbstraction } from "@bitwarden/common/auth/abstractions/sso-login.service.abstraction";
|
||||
import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
|
||||
import { AuthenticationType } from "@bitwarden/common/auth/enums/authentication-type";
|
||||
import { TwoFactorProviderType } from "@bitwarden/common/auth/enums/two-factor-provider-type";
|
||||
import { AuthResult } from "@bitwarden/common/auth/models/domain/auth-result";
|
||||
import { ForceSetPasswordReason } from "@bitwarden/common/auth/models/domain/force-set-password-reason";
|
||||
import { TokenTwoFactorRequest } from "@bitwarden/common/auth/models/request/identity-token/token-two-factor.request";
|
||||
import { TwoFactorProviders } from "@bitwarden/common/auth/services/two-factor.service";
|
||||
import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import {
|
||||
AsyncActionsModule,
|
||||
ButtonModule,
|
||||
DialogService,
|
||||
FormFieldModule,
|
||||
ToastService,
|
||||
} from "@bitwarden/components";
|
||||
|
||||
import { CaptchaProtectedComponent } from "../captcha-protected.component";
|
||||
|
||||
import { TwoFactorAuthAuthenticatorComponent } from "./two-factor-auth-authenticator.component";
|
||||
import { TwoFactorAuthDuoComponent } from "./two-factor-auth-duo.component";
|
||||
import { TwoFactorAuthEmailComponent } from "./two-factor-auth-email.component";
|
||||
import { TwoFactorAuthWebAuthnComponent } from "./two-factor-auth-webauthn.component";
|
||||
import { TwoFactorAuthYubikeyComponent } from "./two-factor-auth-yubikey.component";
|
||||
import {
|
||||
TwoFactorOptionsDialogResult,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorOptionsDialogResultType,
|
||||
} from "./two-factor-options.component";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth",
|
||||
templateUrl: "two-factor-auth.component.html",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
RouterLink,
|
||||
ButtonModule,
|
||||
TwoFactorOptionsComponent,
|
||||
TwoFactorAuthAuthenticatorComponent,
|
||||
TwoFactorAuthEmailComponent,
|
||||
TwoFactorAuthDuoComponent,
|
||||
TwoFactorAuthYubikeyComponent,
|
||||
TwoFactorAuthWebAuthnComponent,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
})
|
||||
export class TwoFactorAuthComponent extends CaptchaProtectedComponent implements OnInit {
|
||||
token = "";
|
||||
remember = false;
|
||||
orgIdentifier: string = null;
|
||||
|
||||
providers = TwoFactorProviders;
|
||||
providerType = TwoFactorProviderType;
|
||||
selectedProviderType: TwoFactorProviderType = TwoFactorProviderType.Authenticator;
|
||||
providerData: any;
|
||||
|
||||
@ViewChild("duoComponent") duoComponent!: TwoFactorAuthDuoComponent;
|
||||
formGroup = this.formBuilder.group({
|
||||
token: [
|
||||
"",
|
||||
{
|
||||
validators: [Validators.required],
|
||||
updateOn: "submit",
|
||||
},
|
||||
],
|
||||
remember: [false],
|
||||
});
|
||||
actionButtonText = "";
|
||||
title = "";
|
||||
formPromise: Promise<any>;
|
||||
|
||||
private destroy$ = new Subject<void>();
|
||||
|
||||
onSuccessfulLogin: () => Promise<void>;
|
||||
onSuccessfulLoginNavigate: () => Promise<void>;
|
||||
|
||||
onSuccessfulLoginTde: () => Promise<void>;
|
||||
onSuccessfulLoginTdeNavigate: () => Promise<void>;
|
||||
|
||||
submitForm = async () => {
|
||||
await this.submit();
|
||||
};
|
||||
goAfterLogIn = async () => {
|
||||
this.loginEmailService.clearValues();
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.router.navigate([this.successRoute], {
|
||||
queryParams: {
|
||||
identifier: this.orgIdentifier,
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
protected loginRoute = "login";
|
||||
|
||||
protected trustedDeviceEncRoute = "login-initiated";
|
||||
protected changePasswordRoute = "set-password";
|
||||
protected forcePasswordResetRoute = "update-temp-password";
|
||||
protected successRoute = "vault";
|
||||
|
||||
constructor(
|
||||
protected loginStrategyService: LoginStrategyServiceAbstraction,
|
||||
protected router: Router,
|
||||
i18nService: I18nService,
|
||||
platformUtilsService: PlatformUtilsService,
|
||||
environmentService: EnvironmentService,
|
||||
private dialogService: DialogService,
|
||||
protected route: ActivatedRoute,
|
||||
private logService: LogService,
|
||||
protected twoFactorService: TwoFactorService,
|
||||
private loginEmailService: LoginEmailServiceAbstraction,
|
||||
private userDecryptionOptionsService: UserDecryptionOptionsServiceAbstraction,
|
||||
protected ssoLoginService: SsoLoginServiceAbstraction,
|
||||
protected configService: ConfigService,
|
||||
private masterPasswordService: InternalMasterPasswordServiceAbstraction,
|
||||
private accountService: AccountService,
|
||||
private formBuilder: FormBuilder,
|
||||
@Inject(WINDOW) protected win: Window,
|
||||
protected toastService: ToastService,
|
||||
) {
|
||||
super(environmentService, i18nService, platformUtilsService, toastService);
|
||||
}
|
||||
|
||||
async ngOnInit() {
|
||||
if (!(await this.authing()) || (await this.twoFactorService.getProviders()) == null) {
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.router.navigate([this.loginRoute]);
|
||||
return;
|
||||
}
|
||||
|
||||
// eslint-disable-next-line rxjs-angular/prefer-takeuntil
|
||||
this.route.queryParams.pipe(first()).subscribe((qParams) => {
|
||||
if (qParams.identifier != null) {
|
||||
this.orgIdentifier = qParams.identifier;
|
||||
}
|
||||
});
|
||||
|
||||
if (await this.needsLock()) {
|
||||
this.successRoute = "lock";
|
||||
}
|
||||
|
||||
const webAuthnSupported = this.platformUtilsService.supportsWebAuthn(this.win);
|
||||
this.selectedProviderType = await this.twoFactorService.getDefaultProvider(webAuthnSupported);
|
||||
const providerData = await this.twoFactorService.getProviders().then((providers) => {
|
||||
return providers.get(this.selectedProviderType);
|
||||
});
|
||||
this.providerData = providerData;
|
||||
await this.updateUIToProviderData();
|
||||
|
||||
this.actionButtonText = this.i18nService.t("continue");
|
||||
this.formGroup.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((value) => {
|
||||
this.token = value.token;
|
||||
this.remember = value.remember;
|
||||
});
|
||||
}
|
||||
|
||||
async submit() {
|
||||
await this.setupCaptcha();
|
||||
|
||||
if (this.token == null || this.token === "") {
|
||||
this.toastService.showToast({
|
||||
variant: "error",
|
||||
title: this.i18nService.t("errorOccurred"),
|
||||
message: this.i18nService.t("verificationCodeRequired"),
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
this.formPromise = this.loginStrategyService.logInTwoFactor(
|
||||
new TokenTwoFactorRequest(this.selectedProviderType, this.token, this.remember),
|
||||
this.captchaToken,
|
||||
);
|
||||
const authResult: AuthResult = await this.formPromise;
|
||||
this.logService.info("Successfully submitted two factor token");
|
||||
await this.handleLoginResponse(authResult);
|
||||
} catch {
|
||||
this.logService.error("Error submitting two factor token");
|
||||
this.toastService.showToast({
|
||||
variant: "error",
|
||||
title: this.i18nService.t("errorOccurred"),
|
||||
message: this.i18nService.t("invalidVerificationCode"),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
async selectOtherTwoFactorMethod() {
|
||||
const dialogRef = TwoFactorOptionsComponent.open(this.dialogService);
|
||||
const response: TwoFactorOptionsDialogResultType = await lastValueFrom(dialogRef.closed);
|
||||
if (response.result === TwoFactorOptionsDialogResult.Provider) {
|
||||
const providerData = await this.twoFactorService.getProviders().then((providers) => {
|
||||
return providers.get(response.type);
|
||||
});
|
||||
this.providerData = providerData;
|
||||
this.selectedProviderType = response.type;
|
||||
await this.updateUIToProviderData();
|
||||
}
|
||||
}
|
||||
|
||||
async launchDuo() {
|
||||
if (this.duoComponent != null) {
|
||||
await this.duoComponent.launchDuoFrameless();
|
||||
}
|
||||
}
|
||||
|
||||
protected handleMigrateEncryptionKey(result: AuthResult): boolean {
|
||||
if (!result.requiresEncryptionKeyMigration) {
|
||||
return false;
|
||||
}
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.router.navigate(["migrate-legacy-encryption"]);
|
||||
return true;
|
||||
}
|
||||
|
||||
async updateUIToProviderData() {
|
||||
if (this.selectedProviderType == null) {
|
||||
this.title = this.i18nService.t("loginUnavailable");
|
||||
return;
|
||||
}
|
||||
|
||||
this.title = (TwoFactorProviders as any)[this.selectedProviderType].name;
|
||||
}
|
||||
|
||||
private async handleLoginResponse(authResult: AuthResult) {
|
||||
if (this.handleCaptchaRequired(authResult)) {
|
||||
return;
|
||||
} else if (this.handleMigrateEncryptionKey(authResult)) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Save off the OrgSsoIdentifier for use in the TDE flows
|
||||
// - TDE login decryption options component
|
||||
// - Browser SSO on extension open
|
||||
const userId = (await firstValueFrom(this.accountService.activeAccount$))?.id;
|
||||
await this.ssoLoginService.setActiveUserOrganizationSsoIdentifier(this.orgIdentifier, userId);
|
||||
this.loginEmailService.clearValues();
|
||||
|
||||
// note: this flow affects both TDE & standard users
|
||||
if (this.isForcePasswordResetRequired(authResult)) {
|
||||
return await this.handleForcePasswordReset(this.orgIdentifier);
|
||||
}
|
||||
|
||||
const userDecryptionOpts = await firstValueFrom(
|
||||
this.userDecryptionOptionsService.userDecryptionOptions$,
|
||||
);
|
||||
|
||||
const tdeEnabled = await this.isTrustedDeviceEncEnabled(userDecryptionOpts.trustedDeviceOption);
|
||||
|
||||
if (tdeEnabled) {
|
||||
return await this.handleTrustedDeviceEncryptionEnabled(
|
||||
authResult,
|
||||
this.orgIdentifier,
|
||||
userDecryptionOpts,
|
||||
);
|
||||
}
|
||||
|
||||
// User must set password if they don't have one and they aren't using either TDE or key connector.
|
||||
const requireSetPassword =
|
||||
!userDecryptionOpts.hasMasterPassword && userDecryptionOpts.keyConnectorOption === undefined;
|
||||
|
||||
if (requireSetPassword || authResult.resetMasterPassword) {
|
||||
// Change implies going no password -> password in this case
|
||||
return await this.handleChangePasswordRequired(this.orgIdentifier);
|
||||
}
|
||||
|
||||
return await this.handleSuccessfulLogin();
|
||||
}
|
||||
|
||||
private async isTrustedDeviceEncEnabled(
|
||||
trustedDeviceOption: TrustedDeviceUserDecryptionOption,
|
||||
): Promise<boolean> {
|
||||
const ssoTo2faFlowActive = this.route.snapshot.queryParamMap.get("sso") === "true";
|
||||
|
||||
return ssoTo2faFlowActive && trustedDeviceOption !== undefined;
|
||||
}
|
||||
|
||||
private async handleTrustedDeviceEncryptionEnabled(
|
||||
authResult: AuthResult,
|
||||
orgIdentifier: string,
|
||||
userDecryptionOpts: UserDecryptionOptions,
|
||||
): Promise<void> {
|
||||
// If user doesn't have a MP, but has reset password permission, they must set a MP
|
||||
if (
|
||||
!userDecryptionOpts.hasMasterPassword &&
|
||||
userDecryptionOpts.trustedDeviceOption.hasManageResetPasswordPermission
|
||||
) {
|
||||
// Set flag so that auth guard can redirect to set password screen after decryption (trusted or untrusted device)
|
||||
// Note: we cannot directly navigate to the set password screen in this scenario as we are in a pre-decryption state, and
|
||||
// if you try to set a new MP before decrypting, you will invalidate the user's data by making a new user key.
|
||||
const userId = (await firstValueFrom(this.accountService.activeAccount$))?.id;
|
||||
await this.masterPasswordService.setForceSetPasswordReason(
|
||||
ForceSetPasswordReason.TdeUserWithoutPasswordHasPasswordResetPermission,
|
||||
userId,
|
||||
);
|
||||
}
|
||||
|
||||
if (this.onSuccessfulLoginTde != null) {
|
||||
// Note: awaiting this will currently cause a hang on desktop & browser as they will wait for a full sync to complete
|
||||
// before navigating to the success route.
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.onSuccessfulLoginTde();
|
||||
}
|
||||
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.navigateViaCallbackOrRoute(
|
||||
this.onSuccessfulLoginTdeNavigate,
|
||||
// Navigate to TDE page (if user was on trusted device and TDE has decrypted
|
||||
// their user key, the login-initiated guard will redirect them to the vault)
|
||||
[this.trustedDeviceEncRoute],
|
||||
);
|
||||
}
|
||||
|
||||
private async handleChangePasswordRequired(orgIdentifier: string) {
|
||||
await this.router.navigate([this.changePasswordRoute], {
|
||||
queryParams: {
|
||||
identifier: orgIdentifier,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Determines if a user needs to reset their password based on certain conditions.
|
||||
* Users can be forced to reset their password via an admin or org policy disallowing weak passwords.
|
||||
* Note: this is different from the SSO component login flow as a user can
|
||||
* login with MP and then have to pass 2FA to finish login and we can actually
|
||||
* evaluate if they have a weak password at that time.
|
||||
*
|
||||
* @param {AuthResult} authResult - The authentication result.
|
||||
* @returns {boolean} Returns true if a password reset is required, false otherwise.
|
||||
*/
|
||||
private isForcePasswordResetRequired(authResult: AuthResult): boolean {
|
||||
const forceResetReasons = [
|
||||
ForceSetPasswordReason.AdminForcePasswordReset,
|
||||
ForceSetPasswordReason.WeakMasterPassword,
|
||||
];
|
||||
|
||||
return forceResetReasons.includes(authResult.forcePasswordReset);
|
||||
}
|
||||
|
||||
private async handleForcePasswordReset(orgIdentifier: string) {
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.router.navigate([this.forcePasswordResetRoute], {
|
||||
queryParams: {
|
||||
identifier: orgIdentifier,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
private async handleSuccessfulLogin() {
|
||||
if (this.onSuccessfulLogin != null) {
|
||||
// Note: awaiting this will currently cause a hang on desktop & browser as they will wait for a full sync to complete
|
||||
// before navigating to the success route.
|
||||
// FIXME: Verify that this floating promise is intentional. If it is, add an explanatory comment and ensure there is proper error handling.
|
||||
// eslint-disable-next-line @typescript-eslint/no-floating-promises
|
||||
this.onSuccessfulLogin();
|
||||
}
|
||||
await this.navigateViaCallbackOrRoute(this.onSuccessfulLoginNavigate, [this.successRoute]);
|
||||
}
|
||||
|
||||
private async navigateViaCallbackOrRoute(
|
||||
callback: () => Promise<unknown>,
|
||||
commands: unknown[],
|
||||
extras?: NavigationExtras,
|
||||
): Promise<void> {
|
||||
if (callback) {
|
||||
await callback();
|
||||
} else {
|
||||
await this.router.navigate(commands, extras);
|
||||
}
|
||||
}
|
||||
|
||||
private async authing(): Promise<boolean> {
|
||||
return (await firstValueFrom(this.loginStrategyService.currentAuthType$)) !== null;
|
||||
}
|
||||
|
||||
private async needsLock(): Promise<boolean> {
|
||||
const authType = await firstValueFrom(this.loginStrategyService.currentAuthType$);
|
||||
return authType == AuthenticationType.Sso || authType == AuthenticationType.UserApiKey;
|
||||
}
|
||||
}
|
||||
@@ -1,51 +0,0 @@
|
||||
<bit-dialog dialogSize="large">
|
||||
<span bitDialogTitle>
|
||||
{{ "twoStepOptions" | i18n }}
|
||||
</span>
|
||||
<ng-container bitDialogContent>
|
||||
<div *ngFor="let p of providers" class="tw-m-2">
|
||||
<div class="tw-flex tw-items-center tw-justify-center tw-gap-4">
|
||||
<div
|
||||
class="tw-flex tw-items-center tw-justify-center tw-min-w-[100px]"
|
||||
*ngIf="!areIconsDisabled"
|
||||
>
|
||||
<img [class]="'mfaType' + p.type" [alt]="p.name + ' logo'" />
|
||||
</div>
|
||||
<div class="tw-flex-1">
|
||||
<h3 bitTypography="h3">{{ p.name }}</h3>
|
||||
<p bitTypography="body1">{{ p.description }}</p>
|
||||
</div>
|
||||
<div class="tw-min-w-20">
|
||||
<button bitButton type="button" buttonType="secondary" (click)="choose(p)">
|
||||
{{ "select" | i18n }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<hr />
|
||||
</div>
|
||||
<div class="tw-m-2" (click)="recover()">
|
||||
<div class="tw-flex tw-items-center tw-justify-center tw-gap-4">
|
||||
<div
|
||||
class="tw-flex tw-items-center tw-justify-center tw-min-w-[100px]"
|
||||
*ngIf="!areIconsDisabled"
|
||||
>
|
||||
<img class="recovery-code-img" alt="rc logo" />
|
||||
</div>
|
||||
<div class="tw-flex-1">
|
||||
<h3 bitTypography="h3">{{ "recoveryCodeTitle" | i18n }}</h3>
|
||||
<p bitTypography="body1">{{ "recoveryCodeDesc" | i18n }}</p>
|
||||
</div>
|
||||
<div class="tw-min-w-20">
|
||||
<button bitButton type="button" buttonType="secondary" (click)="recover()">
|
||||
{{ "select" | i18n }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-container bitDialogFooter>
|
||||
<button bitButton type="button" buttonType="secondary" bitDialogClose>
|
||||
{{ "close" | i18n }}
|
||||
</button>
|
||||
</ng-container>
|
||||
</bit-dialog>
|
||||
@@ -1,74 +0,0 @@
|
||||
import { DialogRef } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, EventEmitter, OnInit, Output } from "@angular/core";
|
||||
import { firstValueFrom } from "rxjs";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
|
||||
import { TwoFactorProviderType } from "@bitwarden/common/auth/enums/two-factor-provider-type";
|
||||
import { ClientType } from "@bitwarden/common/enums";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import { ButtonModule, DialogModule, DialogService, TypographyModule } from "@bitwarden/components";
|
||||
|
||||
export enum TwoFactorOptionsDialogResult {
|
||||
Provider = "Provider selected",
|
||||
Recover = "Recover selected",
|
||||
}
|
||||
|
||||
export type TwoFactorOptionsDialogResultType = {
|
||||
result: TwoFactorOptionsDialogResult;
|
||||
type: TwoFactorProviderType;
|
||||
};
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-options",
|
||||
templateUrl: "two-factor-options.component.html",
|
||||
imports: [CommonModule, JslibModule, DialogModule, ButtonModule, TypographyModule],
|
||||
providers: [I18nPipe],
|
||||
})
|
||||
export class TwoFactorOptionsComponent implements OnInit {
|
||||
@Output() onProviderSelected = new EventEmitter<TwoFactorProviderType>();
|
||||
@Output() onRecoverSelected = new EventEmitter();
|
||||
|
||||
providers: any[] = [];
|
||||
|
||||
// todo: remove after porting to two-factor-options-v2
|
||||
// icons cause the layout to break on browser extensions
|
||||
areIconsDisabled = false;
|
||||
|
||||
constructor(
|
||||
private twoFactorService: TwoFactorService,
|
||||
private environmentService: EnvironmentService,
|
||||
private dialogRef: DialogRef,
|
||||
private platformUtilsService: PlatformUtilsService,
|
||||
) {
|
||||
// todo: remove after porting to two-factor-options-v2
|
||||
if (this.platformUtilsService.getClientType() == ClientType.Browser) {
|
||||
this.areIconsDisabled = true;
|
||||
}
|
||||
}
|
||||
|
||||
async ngOnInit() {
|
||||
this.providers = await this.twoFactorService.getSupportedProviders(window);
|
||||
}
|
||||
|
||||
async choose(p: any) {
|
||||
this.onProviderSelected.emit(p.type);
|
||||
this.dialogRef.close({ result: TwoFactorOptionsDialogResult.Provider, type: p.type });
|
||||
}
|
||||
|
||||
async recover() {
|
||||
const env = await firstValueFrom(this.environmentService.environment$);
|
||||
const webVault = env.getWebVaultUrl();
|
||||
this.platformUtilsService.launchUri(webVault + "/#/recover-2fa");
|
||||
this.onRecoverSelected.emit();
|
||||
this.dialogRef.close({ result: TwoFactorOptionsDialogResult.Recover });
|
||||
}
|
||||
|
||||
static open(dialogService: DialogService) {
|
||||
return dialogService.open<TwoFactorOptionsDialogResultType>(TwoFactorOptionsComponent);
|
||||
}
|
||||
}
|
||||
@@ -12,7 +12,7 @@ import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.servic
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
|
||||
@Directive()
|
||||
export class TwoFactorOptionsComponent implements OnInit {
|
||||
export class TwoFactorOptionsComponentV1 implements OnInit {
|
||||
@Output() onProviderSelected = new EventEmitter<TwoFactorProviderType>();
|
||||
@Output() onRecoverSelected = new EventEmitter();
|
||||
|
||||
@@ -34,11 +34,11 @@ import { FakeAccountService, mockAccountServiceWith } from "@bitwarden/common/sp
|
||||
import { UserId } from "@bitwarden/common/types/guid";
|
||||
import { ToastService } from "@bitwarden/components";
|
||||
|
||||
import { TwoFactorComponent } from "./two-factor.component";
|
||||
import { TwoFactorComponentV1 } from "./two-factor-v1.component";
|
||||
|
||||
// test component that extends the TwoFactorComponent
|
||||
@Component({})
|
||||
class TestTwoFactorComponent extends TwoFactorComponent {}
|
||||
class TestTwoFactorComponent extends TwoFactorComponentV1 {}
|
||||
|
||||
interface TwoFactorComponentProtected {
|
||||
trustedDeviceEncRoute: string;
|
||||
@@ -40,7 +40,7 @@ import { ToastService } from "@bitwarden/components";
|
||||
import { CaptchaProtectedComponent } from "./captcha-protected.component";
|
||||
|
||||
@Directive()
|
||||
export class TwoFactorComponent extends CaptchaProtectedComponent implements OnInit, OnDestroy {
|
||||
export class TwoFactorComponentV1 extends CaptchaProtectedComponent implements OnInit, OnDestroy {
|
||||
token = "";
|
||||
remember = false;
|
||||
webAuthnReady = false;
|
||||
@@ -20,6 +20,12 @@ import {
|
||||
DefaultLoginComponentService,
|
||||
LoginDecryptionOptionsService,
|
||||
DefaultLoginDecryptionOptionsService,
|
||||
TwoFactorAuthComponentService,
|
||||
DefaultTwoFactorAuthComponentService,
|
||||
DefaultTwoFactorAuthEmailComponentService,
|
||||
TwoFactorAuthEmailComponentService,
|
||||
DefaultTwoFactorAuthWebAuthnComponentService,
|
||||
TwoFactorAuthWebAuthnComponentService,
|
||||
DefaultLoginApprovalComponentService,
|
||||
} from "@bitwarden/auth/angular";
|
||||
import {
|
||||
@@ -1365,6 +1371,21 @@ const safeProviders: SafeProvider[] = [
|
||||
useClass: DefaultRegistrationFinishService,
|
||||
deps: [KeyService, AccountApiServiceAbstraction],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthComponentService,
|
||||
useClass: DefaultTwoFactorAuthComponentService,
|
||||
deps: [],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthWebAuthnComponentService,
|
||||
useClass: DefaultTwoFactorAuthWebAuthnComponentService,
|
||||
deps: [],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: TwoFactorAuthEmailComponentService,
|
||||
useClass: DefaultTwoFactorAuthEmailComponentService,
|
||||
deps: [],
|
||||
}),
|
||||
safeProvider({
|
||||
provide: ViewCacheService,
|
||||
useExisting: NoopViewCacheService,
|
||||
|
||||
@@ -1,31 +0,0 @@
|
||||
import { Type, inject } from "@angular/core";
|
||||
import { Route, Routes } from "@angular/router";
|
||||
|
||||
import { FeatureFlag } from "@bitwarden/common/enums/feature-flag.enum";
|
||||
import { ConfigService } from "@bitwarden/common/platform/abstractions/config/config.service";
|
||||
|
||||
import { componentRouteSwap } from "./component-route-swap";
|
||||
/**
|
||||
* Helper function to swap between two components based on the TwoFactorComponentRefactor feature flag.
|
||||
* @param defaultComponent - The current non-refactored component to render.
|
||||
* @param refreshedComponent - The new refactored component to render.
|
||||
* @param defaultOptions - The options to apply to the default component and the refactored component, if alt options are not provided.
|
||||
* @param altOptions - The options to apply to the refactored component.
|
||||
*/
|
||||
export function twofactorRefactorSwap(
|
||||
defaultComponent: Type<any>,
|
||||
refreshedComponent: Type<any>,
|
||||
defaultOptions: Route,
|
||||
altOptions?: Route,
|
||||
): Routes {
|
||||
return componentRouteSwap(
|
||||
defaultComponent,
|
||||
refreshedComponent,
|
||||
async () => {
|
||||
const configService = inject(ConfigService);
|
||||
return configService.getFeatureFlag(FeatureFlag.TwoFactorComponentRefactor);
|
||||
},
|
||||
defaultOptions,
|
||||
altOptions,
|
||||
);
|
||||
}
|
||||
6
libs/auth/src/angular/icons/two-factor-auth/index.ts
Normal file
6
libs/auth/src/angular/icons/two-factor-auth/index.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
export * from "./two-factor-auth-authenticator.icon";
|
||||
export * from "./two-factor-auth-email.icon";
|
||||
export * from "./two-factor-auth-webauthn.icon";
|
||||
export * from "./two-factor-auth-security-key.icon";
|
||||
export * from "./two-factor-auth-duo.icon";
|
||||
export * from "./two-factor-auth-yubico.icon";
|
||||
@@ -0,0 +1,39 @@
|
||||
import { svgIcon } from "@bitwarden/components";
|
||||
|
||||
export const TwoFactorAuthAuthenticatorIcon = svgIcon`
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 120 100">
|
||||
<g clip-path="url(#a)">
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M47.967 84.718c0-.37.3-.67.67-.67h42.904a.67.67 0 1 1 0 1.34H48.637a.67.67 0 0 1-.67-.67Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M63.4 84.848V72.111h1.34v12.737H63.4ZM77.073 84.848V72.111h1.341v12.737h-1.34Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M20.482 14.999a6.704 6.704 0 0 1 6.703-6.704h85.808A6.704 6.704 0 0 1 119.697 15v50.949a6.704 6.704 0 0 1-6.704 6.703H35.565V69.97h77.428c2.222 0 4.023-1.801 4.023-4.022V14.999a4.022 4.022 0 0 0-4.023-4.022H27.185a4.022 4.022 0 0 0-4.022 4.022v11.732h-2.681V14.999Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M25.845 15.67c0-1.111.9-2.012 2.01-2.012h84.468c1.111 0 2.011.9 2.011 2.011v49.608c0 1.11-.9 2.011-2.011 2.011H35.23v-1.34h77.093c.37 0 .67-.3.67-.67V15.668c0-.37-.3-.67-.67-.67H27.856c-.37 0-.67.3-.67.67v11.062h-1.341V15.669Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M-.3 33.1a8.045 8.045 0 0 1 8.045-8.045h21.452a8.045 8.045 0 0 1 8.044 8.044v17.43H34.56v-17.43a5.363 5.363 0 0 0-5.363-5.363H7.745A5.363 5.363 0 0 0 2.382 33.1v50.949a5.363 5.363 0 0 0 5.363 5.363h21.452a5.363 5.363 0 0 0 5.363-5.363V53.546h2.681v30.502a8.045 8.045 0 0 1-8.044 8.044H7.745A8.044 8.044 0 0 1-.3 84.048V33.099Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M17.13 32.429c0-.37.3-.67.67-.67h1.326a.67.67 0 1 1 0 1.34H17.8a.67.67 0 0 1-.67-.67Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M39.598 46.024a.67.67 0 0 1 .948.017l3.881 4.022a.67.67 0 0 1-.482 1.136H29.197a.67.67 0 0 1 0-1.34h13.17l-2.786-2.887a.67.67 0 0 1 .017-.948ZM32.947 58.162a.67.67 0 0 1-.948-.017l-3.88-4.022a.67.67 0 0 1 .482-1.136h14.748a.67.67 0 1 1 0 1.34h-13.17l2.785 2.887a.67.67 0 0 1-.017.948ZM44.615 41.144a8.715 8.715 0 0 1 8.715-8.715h37.541a8.715 8.715 0 0 1 0 17.43H53.33a8.715 8.715 0 0 1-8.715-8.715Zm8.715-7.374a7.374 7.374 0 0 0 0 14.748h37.541a7.374 7.374 0 0 0 0-14.748H53.33Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M10.761 61.682a13.408 13.408 0 0 1 7.71-2.438v2.681a10.726 10.726 0 0 0-6.838 18.99l-.854 1.034.854-1.033A10.726 10.726 0 0 0 29.007 70.64l2.634-.502a13.407 13.407 0 1 1-20.879-8.457Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent"
|
||||
d="M13.411 75.183h1.537v-5.472l-1.84.878v-.941l1.83-.864h.989v6.4h1.517v.82h-4.033v-.82ZM19.806 75.178h3.357v.825h-4.44v-.825c.611-.637 1.145-1.2 1.601-1.688.457-.488.772-.833.945-1.033.326-.395.547-.713.66-.956.115-.246.172-.496.172-.752 0-.404-.12-.721-.362-.95-.238-.23-.566-.345-.984-.345-.297 0-.608.053-.935.16a5.264 5.264 0 0 0-1.037.485v-.99c.336-.158.665-.278.988-.359.327-.08.648-.121.964-.121.715 0 1.29.19 1.723.568.438.375.656.868.656 1.48 0 .31-.073.62-.22.93-.144.311-.378.654-.705 1.03-.183.21-.448.5-.798.873-.345.371-.874.928-1.585 1.668ZM53.79 37.121c.816 0 1.432.34 1.849 1.016.42.678.629 1.68.629 3.007 0 1.327-.21 2.329-.63 3.006-.416.677-1.032 1.016-1.847 1.016-.816 0-1.431-.339-1.848-1.016-.416-.677-.624-1.68-.624-3.006 0-1.327.208-2.33.624-3.007.416-.677 1.032-1.016 1.848-1.016Zm0 7.211c.485 0 .845-.262 1.08-.787.24-.524.359-1.325.359-2.401 0-.573-.034-1.091-.102-1.553l-2.437 3.882c.256.573.623.86 1.1.86Zm0-6.377c-.48 0-.84.262-1.08.787-.235.524-.352 1.325-.352 2.402 0 .49.032.948.097 1.375l2.385-3.871c-.26-.462-.609-.693-1.05-.693ZM60.106 37.121c.816 0 1.432.34 1.848 1.016.42.678.63 1.68.63 3.007 0 1.327-.21 2.329-.63 3.006-.416.677-1.032 1.016-1.848 1.016-.815 0-1.43-.339-1.847-1.016-.416-.677-.624-1.68-.624-3.006 0-1.327.208-2.33.624-3.007.416-.677 1.032-1.016 1.847-1.016Zm0 7.211c.485 0 .845-.262 1.08-.787.24-.524.359-1.325.359-2.401 0-.573-.035-1.091-.103-1.553l-2.436 3.882c.256.573.623.86 1.1.86Zm0-6.377c-.48 0-.84.262-1.08.787-.235.524-.353 1.325-.353 2.402 0 .49.033.948.098 1.375l2.385-3.871c-.26-.462-.61-.693-1.05-.693ZM66.422 37.121c.816 0 1.431.34 1.848 1.016.42.678.63 1.68.63 3.007 0 1.327-.21 2.329-.63 3.006-.416.677-1.032 1.016-1.848 1.016-.815 0-1.431-.339-1.847-1.016-.417-.677-.625-1.68-.625-3.006 0-1.327.208-2.33.624-3.007.417-.677 1.033-1.016 1.848-1.016Zm0 7.211c.485 0 .845-.262 1.08-.787.239-.524.358-1.325.358-2.401 0-.573-.034-1.091-.102-1.553l-2.436 3.882c.256.573.622.86 1.1.86Zm0-6.377c-.481 0-.84.262-1.08.787-.235.524-.353 1.325-.353 2.402 0 .49.032.948.097 1.375l2.385-3.871c-.259-.462-.609-.693-1.049-.693ZM76.433 37.121c.815 0 1.431.34 1.848 1.016.42.678.63 1.68.63 3.007 0 1.327-.21 2.329-.63 3.006-.417.677-1.033 1.016-1.848 1.016-.816 0-1.431-.339-1.848-1.016-.416-.677-.624-1.68-.624-3.006 0-1.327.208-2.33.624-3.007.417-.677 1.033-1.016 1.848-1.016Zm0 7.211c.484 0 .844-.262 1.08-.787.239-.524.358-1.325.358-2.401 0-.573-.034-1.091-.102-1.553l-2.436 3.882c.255.573.622.86 1.1.86Zm0-6.377c-.481 0-.841.262-1.08.787-.235.524-.353 1.325-.353 2.402 0 .49.032.948.097 1.375l2.385-3.871c-.26-.462-.609-.693-1.049-.693ZM82.749 37.121c.815 0 1.43.34 1.847 1.016.42.678.63 1.68.63 3.007 0 1.327-.21 2.329-.63 3.006-.416.677-1.032 1.016-1.847 1.016-.816 0-1.432-.339-1.848-1.016-.416-.677-.624-1.68-.624-3.006 0-1.327.208-2.33.624-3.007.416-.677 1.032-1.016 1.848-1.016Zm0 7.211c.484 0 .844-.262 1.08-.787.238-.524.358-1.325.358-2.401 0-.573-.034-1.091-.103-1.553l-2.436 3.882c.256.573.623.86 1.1.86Zm0-6.377c-.481 0-.841.262-1.08.787-.236.524-.353 1.325-.353 2.402 0 .49.032.948.097 1.375l2.385-3.871c-.26-.462-.61-.693-1.05-.693ZM89.064 37.121c.816 0 1.432.34 1.848 1.016.42.678.63 1.68.63 3.007 0 1.327-.21 2.329-.63 3.006-.416.677-1.032 1.016-1.848 1.016-.815 0-1.431-.339-1.847-1.016-.417-.677-.625-1.68-.625-3.006 0-1.327.208-2.33.625-3.007.416-.677 1.032-1.016 1.847-1.016Zm0 7.211c.485 0 .845-.262 1.08-.787.239-.524.358-1.325.358-2.401 0-.573-.034-1.091-.102-1.553l-2.436 3.882c.256.573.623.86 1.1.86Zm0-6.377c-.48 0-.84.262-1.08.787-.235.524-.353 1.325-.353 2.402 0 .49.033.948.097 1.375l2.385-3.871c-.259-.462-.609-.693-1.049-.693Z" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="a">
|
||||
<path fill="#fff" d="M0 0h120v100H0z" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
`;
|
||||
@@ -0,0 +1,20 @@
|
||||
import { svgIcon } from "@bitwarden/components";
|
||||
|
||||
export const TwoFactorAuthDuoIcon = svgIcon`
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 120 40">
|
||||
<g clip-path="url(#a)">
|
||||
<path fill="#7BCD54" d="M19.359 39.412H0V20.97h38.694c-.505 10.27-8.968 18.44-19.335 18.44Z" />
|
||||
<path fill="#63C43F"
|
||||
d="M19.359.588H0V19.03h38.694C38.188 8.76 29.726.59 19.358.59ZM100.666.588c-10.367 0-18.83 8.172-19.335 18.441H120C119.496 8.76 111.033.59 100.666.59Z" />
|
||||
<path fill="#7BCD54"
|
||||
d="M100.666 39.412c-10.367 0-18.83-8.171-19.335-18.441H120c-.504 10.27-8.967 18.44-19.334 18.44Z" />
|
||||
<path fill="#63C43F" d="M40.653.588V20c0 10.395 8.15 18.882 18.391 19.388V.588h-18.39Z" />
|
||||
<path fill="#7BCD54" d="M79.37 39.412H60.98V.588h18.39v38.824Z" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="a">
|
||||
<path fill="#fff" d="M0 .588h120v38.824H0z" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
`;
|
||||
@@ -0,0 +1,18 @@
|
||||
import { svgIcon } from "@bitwarden/components";
|
||||
|
||||
export const TwoFactorAuthEmailIcon = svgIcon`
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 120 100">
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M56.791 3.994a4.8 4.8 0 0 1 5.714-.02l10.651 7.83h21.69a2.88 2.88 0 0 1 2.88 2.88V29.87l9.277 6.821a4.798 4.798 0 0 1 1.957 3.867v51.6a4.8 4.8 0 0 1-4.8 4.8H15.84a4.8 4.8 0 0 1-4.8-4.8V40.542a4.8 4.8 0 0 1 1.93-3.847l9.304-6.943V14.685a2.88 2.88 0 0 1 2.88-2.88h21.17l10.467-7.81Zm-7.256 7.81h20.38l-8.547-6.283a2.88 2.88 0 0 0-3.428.012l-8.405 6.272Zm-27.26 20.343-8.157 6.086a2.88 2.88 0 0 0-1.158 2.308v.162a.957.957 0 0 1 .371.127l8.943 5.295V32.147Zm1.92 15.114 23.887 14.145c.316-.046.637-.07.961-.07h20.368c.778 0 1.542.136 2.262.393l24.133-14.412V14.685a.96.96 0 0 0-.96-.96H25.154a.96.96 0 0 0-.96.96V47.26Zm73.531-1.091 8.939-5.339a.952.952 0 0 1 .375-.128v-.145a2.88 2.88 0 0 0-1.174-2.32l-8.14-5.985V46.17ZM12.96 92.159V42.84L45.7 62.227c-.47.27-.91.598-1.308.98L13.144 93.174a2.876 2.876 0 0 1-.184-1.015Zm94.08-49.315L73.609 62.809c.122.098.241.2.357.307l32.81 30.249a2.86 2.86 0 0 0 .264-1.206V42.844Zm-91.2 52.195a2.866 2.866 0 0 1-1.456-.395l31.337-30.052a4.8 4.8 0 0 1 3.322-1.335h20.368a4.8 4.8 0 0 1 3.253 1.27l32.773 30.214c-.385.19-.819.298-1.277.298H15.84Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M42.729 27.585h34.476a9.204 9.204 0 1 1 0 18.409H42.73a9.204 9.204 0 0 1 0-18.409Zm0 .96a8.244 8.244 0 0 0 0 16.489h34.476a8.244 8.244 0 0 0 0-16.489H42.73Z"
|
||||
clip-rule="evenodd" />
|
||||
<circle cx="41.23" cy="36.789" r="2.248" class="tw-fill-art-accent" />
|
||||
<circle cx="56.22" cy="36.789" r="2.248" class="tw-fill-art-accent" />
|
||||
<circle cx="71.209" cy="36.789" r="2.248" class="tw-fill-art-accent" />
|
||||
<circle cx="48.725" cy="36.789" r="2.248" class="tw-fill-art-accent" />
|
||||
<circle cx="63.715" cy="36.789" r="2.248" class="tw-fill-art-accent" />
|
||||
<circle cx="78.704" cy="36.789" r="2.248" class="tw-fill-art-accent" />
|
||||
</svg>
|
||||
`;
|
||||
@@ -0,0 +1,52 @@
|
||||
import { svgIcon } from "@bitwarden/components";
|
||||
|
||||
export const TwoFactorAuthSecurityKeyIcon = svgIcon`
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 120 100">
|
||||
<g clip-path="url(#a)">
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M22.852 21.578H6.656v16.365h16.196V21.578ZM5.183 20.09v19.34h19.142V20.09H5.183Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M.03 39.431c0-1.643 1.318-2.975 2.945-2.975h23.558c1.627 0 2.945 1.332 2.945 2.975v5.207h-2.945v-5.207H2.975v12.458l1.255 1.598c.413.526.638 1.178.638 1.85v16.517c0 .725-.262 1.424-.736 1.968l-1.157 1.326v13.378h23.558V75.148l-1.157-1.326a2.993 2.993 0 0 1-.736-1.968V55.337c0-.672.225-1.324.638-1.85l1.255-1.598V49.1h2.945v2.788c0 .671-.225 1.323-.638 1.85l-1.255 1.598v16.517l1.157 1.326c.474.544.736 1.243.736 1.968v13.378c0 1.644-1.318 2.976-2.945 2.976H2.975C1.348 91.502.03 90.17.03 88.526V75.148c0-.725.262-1.424.736-1.968l1.157-1.326V55.337L.668 53.738a2.995 2.995 0 0 1-.638-1.85V39.432Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M30.8 38.884a.731.731 0 0 1 1.04.043l4.07 4.464a.75.75 0 0 1 .132.802.736.736 0 0 1-.674.445h-15.46a.74.74 0 0 1-.737-.744c0-.41.33-.743.736-.743H33.69l-2.931-3.216a.75.75 0 0 1 .042-1.051ZM24.557 53.368a.73.73 0 0 1-1.04-.043l-4.069-4.463a.75.75 0 0 1-.133-.803.736.736 0 0 1 .675-.445h15.46a.74.74 0 0 1 .736.744.74.74 0 0 1-.736.744H21.669l2.93 3.215a.75.75 0 0 1-.042 1.051Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M42.452 91.904c0-.411.33-.744.736-.744h46.416a.74.74 0 0 1 .736.744.74.74 0 0 1-.736.744H43.188a.74.74 0 0 1-.736-.744Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M57.47 91.903V78.257h1.472v13.646H57.47ZM72.486 91.903V78.257h1.472v13.646h-1.472Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M11.81 17.859c0-5.752 4.614-10.414 10.306-10.414h87.608c5.692 0 10.307 4.662 10.307 10.414v50.583c0 5.752-4.615 10.414-10.307 10.414H29.11v-2.975h80.614c4.066 0 7.362-3.33 7.362-7.439V17.86c0-4.108-3.296-7.439-7.362-7.439H22.116c-4.066 0-7.362 3.33-7.362 7.439v3.72H11.81v-3.72Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M18.435 18.603c0-2.465 1.978-4.463 4.417-4.463h86.136c2.439 0 4.417 1.998 4.417 4.463V67.7c0 2.465-1.978 4.463-4.417 4.463H26.901v-1.488h82.087c1.626 0 2.945-1.332 2.945-2.975V18.603c0-1.643-1.319-2.975-2.945-2.975H22.852c-1.626 0-2.945 1.332-2.945 2.975v2.232h-1.472v-2.232Z"
|
||||
clip-rule="evenodd" />
|
||||
<g clip-path="url(#b)">
|
||||
<path class="tw-fill-art-accent"
|
||||
d="M67.118 46.886a1.062 1.062 0 0 0-.138-.531 1.037 1.037 0 0 0-.381-.386 1.006 1.006 0 0 0-1.037.018 1.059 1.059 0 0 0-.324 1.46c.099.156.237.283.4.366v1.716a.48.48 0 0 0 .126.347.461.461 0 0 0 .333.147.446.446 0 0 0 .333-.147.482.482 0 0 0 .125-.347V47.81c.168-.086.31-.219.409-.382.099-.163.152-.35.154-.543Zm5.37-6.916h-.565a.337.337 0 0 1-.312-.215.358.358 0 0 1-.026-.133v-.255a5.896 5.896 0 0 0-1.374-3.901 5.645 5.645 0 0 0-3.567-1.972 5.4 5.4 0 0 0-2.268.263c-.73.248-1.4.65-1.97 1.181a5.634 5.634 0 0 0-1.332 1.896 5.75 5.75 0 0 0-.468 2.286v.413c0 .008-.03.434-.392.44h-.509a1.686 1.686 0 0 0-1.203.514c-.32.328-.498.772-.497 1.234v10.37c0 .463.178.907.497 1.234.318.328.75.515 1.203.518h12.783c.452-.003.884-.189 1.202-.517.319-.328.497-.772.497-1.234V41.721a1.776 1.776 0 0 0-.495-1.235 1.71 1.71 0 0 0-.552-.38 1.665 1.665 0 0 0-.653-.136h.001Zm-10.637-.85a4.442 4.442 0 0 1 .41-1.877 4.346 4.346 0 0 1 1.16-1.515 4.218 4.218 0 0 1 1.685-.855 4.17 4.17 0 0 1 1.881-.029 4.335 4.335 0 0 1 2.436 1.596c.61.8.934 1.79.918 2.806v.376a.358.358 0 0 1-.1.246.336.336 0 0 1-.24.102h-7.63a.468.468 0 0 1-.352-.115.51.51 0 0 1-.169-.336v-.399h.001Zm11.091 12.97a.477.477 0 0 1-.133.332.45.45 0 0 1-.322.139H59.705a.445.445 0 0 1-.323-.139.46.46 0 0 1-.132-.331V41.72a.474.474 0 0 1 .132-.331.456.456 0 0 1 .321-.138h12.784c.121 0 .237.05.322.138a.473.473 0 0 1 .133.33v10.37Z" />
|
||||
</g>
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M13.281 25.298h-3.68V23.81h3.68v1.488ZM19.907 25.298h-3.68V23.81h3.68v1.488Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-stroke-art-accent" stroke-width=".784"
|
||||
d="M20.079 63.907c0 2.913-2.336 5.267-5.21 5.267-2.872 0-5.208-2.355-5.208-5.268s2.336-5.267 5.209-5.267c2.873 0 5.209 2.354 5.209 5.267Z" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M11.37 63.14a.378.378 0 0 0 0 .53c.146.146.38.146.525 0a4.442 4.442 0 0 1 6.329 0c.145.146.38.146.524 0a.377.377 0 0 0 0-.53 5.179 5.179 0 0 0-7.377 0Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M12.357 64.724a.377.377 0 0 0 0 .53c.145.147.38.147.525 0a3.057 3.057 0 0 1 4.355 0c.145.147.38.147.525 0a.378.378 0 0 0 0-.53 3.794 3.794 0 0 0-5.405 0Z"
|
||||
clip-rule="evenodd" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="a">
|
||||
<path fill="#fff" d="M0 0h120v100H0z" />
|
||||
</clipPath>
|
||||
<clipPath id="b">
|
||||
<path fill="#fff" d="M56.014 33.468h20.165v20.375H56.014z" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
`;
|
||||
@@ -0,0 +1,40 @@
|
||||
import { svgIcon } from "@bitwarden/components";
|
||||
|
||||
export const TwoFactorAuthWebAuthnIcon = svgIcon`
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 120 100">
|
||||
<path class="tw-fill-art-primary"
|
||||
d="M19.258 16.434c0-3.635 2.966-6.58 6.626-6.58H56.88c3.659 0 6.625 2.946 6.625 6.58v27.788l-2.208 2.667V16.434c0-2.423-1.978-4.387-4.417-4.387H25.884c-2.44 0-4.418 1.964-4.418 4.387v67.09c0 2.422 1.978 4.386 4.418 4.386h16.389l-.814 2.194H25.884c-3.66 0-6.626-2.947-6.626-6.58v-67.09Z" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M40.119 19.287a.55.55 0 0 1 .552-.548h2.208a.55.55 0 0 1 .553.548.55.55 0 0 1-.553.549h-2.208a.55.55 0 0 1-.552-.549Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M31.994 38.828c2.103-3.001 5.541-4.957 9.425-4.957 5.66 0 10.376 4.155 11.392 9.653a.567.567 0 0 1-.439.664.553.553 0 0 1-.646-.451c-.918-4.969-5.183-8.73-10.307-8.73-3.515 0-6.625 1.769-8.53 4.485a.542.542 0 0 1-.77.129.579.579 0 0 1-.125-.793Zm-.623 2.186c.282.117.42.448.305.74a10.928 10.928 0 0 0-.748 3.992v3.46a.56.56 0 0 1-.553.569.56.56 0 0 1-.552-.568v-3.461c0-1.56.294-3.051.829-4.417a.547.547 0 0 1 .718-.315Zm21.09 4.164a.56.56 0 0 1 .553.568v3.23a.56.56 0 0 1-.552.568.56.56 0 0 1-.552-.568v-3.23a.56.56 0 0 1 .552-.568Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M32.823 41.892c1.451-3.427 4.75-5.827 8.596-5.827 1.98 0 3.819.638 5.333 1.725.25.18.31.532.135.788a.544.544 0 0 1-.769.138 8.02 8.02 0 0 0-4.7-1.52c-3.382 0-6.297 2.111-7.582 5.146a.547.547 0 0 1-.726.294.57.57 0 0 1-.287-.744Zm14.94-2.495a.543.543 0 0 1 .778.066 9.936 9.936 0 0 1 2.265 6.35v7.783a.559.559 0 0 1-.552.566.559.559 0 0 1-.553-.566v-7.782a8.788 8.788 0 0 0-2.002-5.62.575.575 0 0 1 .064-.797Zm-15.06 4.804a.562.562 0 0 1 .487.625 9.062 9.062 0 0 0-.053.988v7.782a.559.559 0 0 1-.553.566.559.559 0 0 1-.552-.566v-7.782c0-.377.02-.748.06-1.114a.555.555 0 0 1 .611-.499Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M34.24 45.704c0-4.105 3.207-7.446 7.178-7.446 3.972 0 7.178 3.341 7.178 7.446V55.79a.559.559 0 0 1-.552.565.559.559 0 0 1-.552-.565V45.704c0-3.495-2.726-6.315-6.074-6.315-3.347 0-6.073 2.82-6.073 6.315v3.948a.559.559 0 0 1-.553.566.559.559 0 0 1-.552-.566v-3.948Zm.552 5.572c.305 0 .553.253.553.565v3.949a.559.559 0 0 1-.553.565.559.559 0 0 1-.552-.565V51.84c0-.312.247-.565.552-.565Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M38.89 41.142a4.955 4.955 0 0 1 2.529-.69 4.966 4.966 0 0 1 4.97 4.962v3.044a.55.55 0 0 1-.553.548.55.55 0 0 1-.552-.548v-3.044a3.865 3.865 0 0 0-5.83-3.33.554.554 0 0 1-.757-.19.546.546 0 0 1 .192-.752Zm-.911 1.45c.258.16.335.5.173.756a3.844 3.844 0 0 0-.599 2.066v11.49a.55.55 0 0 1-.552.548.55.55 0 0 1-.552-.548v-11.49c0-.974.282-1.884.768-2.651a.554.554 0 0 1 .762-.172Zm7.857 7.904a.55.55 0 0 1 .552.549v5.859a.55.55 0 0 1-.552.548.55.55 0 0 1-.552-.548v-5.86a.55.55 0 0 1 .552-.547Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M38.658 45.306c0-1.488 1.256-2.66 2.76-2.66 1.505 0 2.761 1.172 2.761 2.66v4.829a.55.55 0 0 1-.552.548.55.55 0 0 1-.552-.548v-4.828c0-.845-.722-1.564-1.657-1.564-.934 0-1.656.72-1.656 1.563v12.146a.55.55 0 0 1-.552.549.55.55 0 0 1-.552-.549V45.307Zm4.97 6.317a.55.55 0 0 1 .551.549v5.28a.55.55 0 0 1-.552.549.55.55 0 0 1-.552-.549v-5.28a.55.55 0 0 1 .552-.549Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent" fill-rule="evenodd"
|
||||
d="M41.419 44.84a.55.55 0 0 1 .552.548v1.9a.55.55 0 0 1-.552.548.55.55 0 0 1-.552-.549v-1.9a.55.55 0 0 1 .552-.548Zm0 4a.55.55 0 0 1 .552.548V58a.55.55 0 0 1-.552.549.55.55 0 0 1-.552-.549v-8.612a.55.55 0 0 1 .552-.549Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M48.904 87.97c2.492 0 4.542-2.042 4.542-4.616 0-2.51-1.986-4.616-4.542-4.616-2.55 0-4.543 2.049-4.543 4.616 0 2.574 2.05 4.616 4.543 4.616Zm3.016-4.616c0 1.739-1.376 3.086-3.016 3.086-1.64 0-3.017-1.347-3.017-3.086 0-1.745 1.333-3.086 3.017-3.086 1.677 0 3.016 1.385 3.016 3.086Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-primary" fill-rule="evenodd"
|
||||
d="M108.913 84.456a.767.767 0 0 0 0-1.074l-6.098-6.213a.76.76 0 0 0-.544-.228H70.225c-2.438-5.616-7.969-9.602-14.417-9.602-8.75 0-15.73 7.185-15.73 16.015 0 8.832 7.032 16.015 15.73 16.015 6.498 0 12.081-4.036 14.475-9.756h8.303c.204 0 .4-.082.544-.228l2.933-2.989 3.034 3.091a.762.762 0 0 0 1.088 0l.918-.934.766.78a.762.762 0 0 0 1.08.008l3.135-3.107 3.294 3.356c.143.146.339.229.543.229h7.408a.76.76 0 0 0 .544-.229l5.04-5.134Zm-5.903 3.832h-6.769l-3.606-3.674a.762.762 0 0 0-1.08-.007l-3.135 3.106-.774-.788a.762.762 0 0 0-1.087 0l-.918.935-3.034-3.091a.762.762 0 0 0-1.088 0l-3.253 3.314h-8.5c-.316 0-.6.196-.712.493-2.06 5.419-7.23 9.263-13.246 9.263-7.832 0-14.204-6.475-14.204-14.485 0-8.011 6.323-14.485 14.204-14.485 5.966 0 11.09 3.795 13.2 9.12a.763.763 0 0 0 .709.482h32.235l5.346 5.448-4.288 4.37Z"
|
||||
clip-rule="evenodd" />
|
||||
<path class="tw-fill-art-accent"
|
||||
d="M100.357 80.991a.382.382 0 0 0-.382-.382H73.651a.382.382 0 0 0 0 .765h26.324c.211 0 .382-.171.382-.383ZM65.693 77.56c-2.04-3.686-5.74-6.133-9.95-6.133-.895 0-1.766.11-2.602.319a.382.382 0 0 1-.184-.743 11.478 11.478 0 0 1 2.785-.341c4.52 0 8.46 2.627 10.618 6.528a14.09 14.09 0 0 1 1.563 4.503.382.382 0 1 1-.752.126 13.324 13.324 0 0 0-1.478-4.258Z" />
|
||||
<path class="tw-fill-art-primary tw-stroke-art-primary" fill-rule="evenodd" stroke-width=".355"
|
||||
d="M75.94 32.403c8.007 0 14.498 6.51 14.498 14.538a14.542 14.542 0 0 1-9.26 13.56c8.849 1.9 15.896 8.519 18.221 17.036l-1.472.404C95.343 68.475 86.492 61.48 75.95 61.48c-6.743 0-12.796 2.861-16.96 7.404l-1.123-1.036a24.374 24.374 0 0 1 12.842-7.344 14.542 14.542 0 0 1-9.265-13.563c0-8.029 6.49-14.538 14.497-14.538Zm12.972 14.538c0-7.184-5.808-13.007-12.972-13.007S62.97 39.757 62.97 46.94c0 7.184 5.807 13.008 12.971 13.008s12.972-5.823 12.972-13.008Z"
|
||||
clip-rule="evenodd" />
|
||||
</svg>
|
||||
`;
|
||||
@@ -0,0 +1,15 @@
|
||||
import { svgIcon } from "@bitwarden/components";
|
||||
|
||||
export const TwoFactorAuthYubicoIcon = svgIcon`
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 121 33">
|
||||
<g fill="#84BD00" clip-path="url(#a)">
|
||||
<path
|
||||
d="M11.011 19.366 15.18 7.47h6.02L11.054 32.622H4.698l2.903-6.891L.5 7.47h6.147l4.364 11.895ZM42.446 25.872h-5.87V23.84c-.925.73-1.92 1.364-2.971 1.892-.9.432-1.971.648-3.216.646-2.014 0-3.562-.584-4.645-1.751-1.082-1.168-1.627-2.895-1.633-5.18V7.471h5.865v9.127c0 .929.03 1.702.09 2.319.036.533.177 1.054.414 1.532.199.396.53.71.935.884.418.186 1 .279 1.749.279a5.726 5.726 0 0 0 1.657-.28 7.101 7.101 0 0 0 1.757-.818V7.47h5.868v18.4ZM66.065 16.42c0 2.894-.793 5.254-2.38 7.078-1.586 1.824-3.565 2.736-5.935 2.736a9.864 9.864 0 0 1-2.68-.327 9.183 9.183 0 0 1-2.191-.95l-.245.916H47.01V.377h5.87v9.012a14.137 14.137 0 0 1 2.753-1.754 7.413 7.413 0 0 1 3.24-.671c2.305 0 4.08.84 5.327 2.52 1.245 1.68 1.867 3.992 1.865 6.935Zm-6.032.122c0-1.637-.276-2.897-.828-3.78-.553-.884-1.537-1.326-2.952-1.326-.577.004-1.15.09-1.704.254a6.987 6.987 0 0 0-1.67.72v9.227c.388.144.79.249 1.2.311a9.8 9.8 0 0 0 1.363.083c1.548 0 2.7-.459 3.455-1.375.755-.918 1.135-2.289 1.138-4.114h-.002ZM75.961 4.85h-6.195V.377h6.195V4.85ZM75.8 25.872h-5.87v-18.4h5.87v18.4ZM90.789 26.363a15.651 15.651 0 0 1-4.36-.572 9.575 9.575 0 0 1-3.438-1.77 8.005 8.005 0 0 1-2.244-3.015c-.53-1.211-.796-2.631-.797-4.26 0-1.716.285-3.196.854-4.44a8.377 8.377 0 0 1 2.382-3.097A9.675 9.675 0 0 1 86.6 7.504a14.864 14.864 0 0 1 4.017-.54c1.16-.01 2.319.127 3.446.408 1.013.26 1.999.616 2.944 1.066v5.03h-.83c-.225-.197-.499-.426-.82-.688a7.315 7.315 0 0 0-1.176-.77 7.73 7.73 0 0 0-1.46-.598 6.497 6.497 0 0 0-1.858-.234c-1.56 0-2.76.5-3.598 1.5-.839 1-1.255 2.357-1.25 4.072 0 1.77.43 3.114 1.29 4.03.86.918 2.08 1.376 3.662 1.376a7.202 7.202 0 0 0 1.988-.254 6.426 6.426 0 0 0 1.47-.597c.344-.201.67-.431.974-.688.282-.241.536-.475.779-.706h.829v5.041c-.931.434-1.9.778-2.896 1.028a13.455 13.455 0 0 1-3.323.383ZM120.4 16.68c0 3.027-.875 5.411-2.626 7.153-1.751 1.741-4.209 2.613-7.375 2.614-3.165 0-5.624-.871-7.374-2.614-1.751-1.743-2.627-4.127-2.627-7.153 0-3.048.882-5.44 2.644-7.176 1.763-1.735 4.215-2.603 7.357-2.605 3.187 0 5.651.874 7.391 2.622 1.74 1.747 2.61 4.134 2.61 7.16Zm-7.203 4.474a4.741 4.741 0 0 0 .852-1.696c.192-.661.287-1.576.286-2.745.018-.915-.08-1.829-.293-2.719a4.768 4.768 0 0 0-.818-1.753 2.853 2.853 0 0 0-1.251-.95 4.4 4.4 0 0 0-1.577-.28 4.607 4.607 0 0 0-1.504.229c-.489.192-.92.508-1.251.918a4.687 4.687 0 0 0-.854 1.754 10.45 10.45 0 0 0-.318 2.8c-.014.88.079 1.758.277 2.615.141.645.418 1.251.813 1.778a3.11 3.11 0 0 0 1.25.935 4.6 4.6 0 0 0 3.17.023 2.794 2.794 0 0 0 1.218-.909Z" />
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="a">
|
||||
<path fill="#fff" d="M.5.377h120v32.247H.5z" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
`;
|
||||
@@ -72,5 +72,8 @@ export * from "./self-hosted-env-config-dialog/self-hosted-env-config-dialog.com
|
||||
export * from "./login-approval/login-approval.component";
|
||||
export * from "./login-approval/default-login-approval-component.service";
|
||||
|
||||
// two factor auth
|
||||
export * from "./two-factor-auth";
|
||||
|
||||
// device verification
|
||||
export * from "./new-device-verification/new-device-verification.component";
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
export * from "./two-factor-auth-email";
|
||||
export * from "./two-factor-auth-duo";
|
||||
export * from "./two-factor-auth-webauthn";
|
||||
@@ -0,0 +1,6 @@
|
||||
<ng-container>
|
||||
<bit-form-field>
|
||||
<bit-label>{{ "verificationCode" | i18n }}</bit-label>
|
||||
<input bitInput type="text" appAutofocus appInputVerbatim [formControl]="tokenFormControl" />
|
||||
</bit-form-field>
|
||||
</ng-container>
|
||||
@@ -1,12 +1,9 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, EventEmitter, Output } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
import { Component, Input } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule, FormControl } from "@angular/forms";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import {
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
@@ -31,9 +28,8 @@ import {
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
providers: [],
|
||||
})
|
||||
export class TwoFactorAuthAuthenticatorComponent {
|
||||
tokenValue: string;
|
||||
@Output() token = new EventEmitter<string>();
|
||||
@Input({ required: true }) tokenFormControl: FormControl | undefined = undefined;
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
export * from "./two-factor-auth-duo-component.service";
|
||||
@@ -0,0 +1,32 @@
|
||||
import { Observable } from "rxjs";
|
||||
|
||||
export interface Duo2faResult {
|
||||
code: string;
|
||||
state: string;
|
||||
/**
|
||||
* The code and the state joined by a | character.
|
||||
*/
|
||||
token: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* A service which manages all the cross client logic for the duo 2FA component.
|
||||
*/
|
||||
export abstract class TwoFactorAuthDuoComponentService {
|
||||
/**
|
||||
* Retrieves the result of the duo two-factor authentication process.
|
||||
* @returns {Observable<Duo2faResult>} An observable that emits the result of the duo two-factor authentication process.
|
||||
*/
|
||||
abstract listenForDuo2faResult$(): Observable<Duo2faResult>;
|
||||
|
||||
/**
|
||||
* Launches the client specific duo frameless 2FA flow.
|
||||
*/
|
||||
abstract launchDuoFrameless(duoFramelessUrl: string): Promise<void>;
|
||||
|
||||
/**
|
||||
* Optionally launches the extension duo 2FA single action popout
|
||||
* Only applies to the extension today.
|
||||
*/
|
||||
abstract openTwoFactorAuthDuoPopout?(): Promise<void>;
|
||||
}
|
||||
@@ -0,0 +1,96 @@
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, DestroyRef, EventEmitter, Input, OnInit, Output } from "@angular/core";
|
||||
import { takeUntilDestroyed } from "@angular/core/rxjs-interop";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import {
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
ToastService,
|
||||
} from "@bitwarden/components";
|
||||
|
||||
import { DuoLaunchAction } from "../../two-factor-auth-component.service";
|
||||
|
||||
import {
|
||||
Duo2faResult,
|
||||
TwoFactorAuthDuoComponentService,
|
||||
} from "./two-factor-auth-duo-component.service";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth-duo",
|
||||
template: "",
|
||||
imports: [
|
||||
CommonModule,
|
||||
JslibModule,
|
||||
DialogModule,
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
TypographyModule,
|
||||
ReactiveFormsModule,
|
||||
FormFieldModule,
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
providers: [],
|
||||
})
|
||||
export class TwoFactorAuthDuoComponent implements OnInit {
|
||||
@Output() tokenEmitter = new EventEmitter<string>();
|
||||
@Input() providerData: any;
|
||||
|
||||
duoFramelessUrl: string | undefined = undefined;
|
||||
|
||||
constructor(
|
||||
protected i18nService: I18nService,
|
||||
protected platformUtilsService: PlatformUtilsService,
|
||||
protected toastService: ToastService,
|
||||
private twoFactorAuthDuoComponentService: TwoFactorAuthDuoComponentService,
|
||||
private destroyRef: DestroyRef,
|
||||
) {}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
this.twoFactorAuthDuoComponentService
|
||||
.listenForDuo2faResult$()
|
||||
.pipe(takeUntilDestroyed(this.destroyRef))
|
||||
.subscribe((duo2faResult: Duo2faResult) => {
|
||||
this.tokenEmitter.emit(duo2faResult.token);
|
||||
});
|
||||
|
||||
// flow must be launched by user so they can choose to remember the device or not.
|
||||
this.duoFramelessUrl = this.providerData.AuthUrl;
|
||||
}
|
||||
|
||||
// Called via parent two-factor-auth component.
|
||||
async launchDuoFrameless(duoLaunchAction: DuoLaunchAction): Promise<void> {
|
||||
switch (duoLaunchAction) {
|
||||
case DuoLaunchAction.DIRECT_LAUNCH:
|
||||
await this.launchDuoFramelessDirectly();
|
||||
break;
|
||||
case DuoLaunchAction.SINGLE_ACTION_POPOUT:
|
||||
await this.twoFactorAuthDuoComponentService.openTwoFactorAuthDuoPopout?.();
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
private async launchDuoFramelessDirectly(): Promise<void> {
|
||||
if (this.duoFramelessUrl === null || this.duoFramelessUrl === undefined) {
|
||||
this.toastService.showToast({
|
||||
variant: "error",
|
||||
title: "",
|
||||
message: this.i18nService.t("duoHealthCheckResultsInNullAuthUrlError"),
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
await this.twoFactorAuthDuoComponentService.launchDuoFrameless(this.duoFramelessUrl);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
import { TwoFactorAuthEmailComponentService } from "./two-factor-auth-email-component.service";
|
||||
|
||||
export class DefaultTwoFactorAuthEmailComponentService
|
||||
implements TwoFactorAuthEmailComponentService {
|
||||
// no default implementation
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
export * from "./default-two-factor-auth-email-component.service";
|
||||
export * from "./two-factor-auth-email-component.service";
|
||||
@@ -0,0 +1,10 @@
|
||||
/**
|
||||
* A service that manages all cross client functionality for the email 2FA component.
|
||||
*/
|
||||
export abstract class TwoFactorAuthEmailComponentService {
|
||||
/**
|
||||
* Optionally shows a warning to the user that they might need to popout the
|
||||
* window to complete email 2FA.
|
||||
*/
|
||||
abstract openPopoutIfApprovedForEmail2fa?(): Promise<void>;
|
||||
}
|
||||
@@ -0,0 +1,17 @@
|
||||
<bit-form-field class="!tw-mb-0">
|
||||
<bit-label>{{ "verificationCode" | i18n }}</bit-label>
|
||||
<input bitInput type="text" appAutofocus appInputVerbatim [formControl]="tokenFormControl" />
|
||||
</bit-form-field>
|
||||
|
||||
<div class="tw-mb-4">
|
||||
<a
|
||||
bitTypography="helper"
|
||||
class="tw-text-main"
|
||||
bitLink
|
||||
href="#"
|
||||
appStopClick
|
||||
(click)="sendEmail(true)"
|
||||
>
|
||||
{{ "resendCode" | i18n }}
|
||||
</a>
|
||||
</div>
|
||||
@@ -1,12 +1,9 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, EventEmitter, OnInit, Output } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
import { Component, Input, OnInit } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule, FormControl } from "@angular/forms";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import { LoginStrategyServiceAbstraction } from "@bitwarden/auth/common";
|
||||
import { ApiService } from "@bitwarden/common/abstractions/api.service";
|
||||
import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
|
||||
@@ -25,6 +22,8 @@ import {
|
||||
ToastService,
|
||||
} from "@bitwarden/components";
|
||||
|
||||
import { TwoFactorAuthEmailComponentService } from "./two-factor-auth-email-component.service";
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth-email",
|
||||
@@ -41,13 +40,13 @@ import {
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
providers: [],
|
||||
})
|
||||
export class TwoFactorAuthEmailComponent implements OnInit {
|
||||
@Output() token = new EventEmitter<string>();
|
||||
@Input({ required: true }) tokenFormControl: FormControl | undefined = undefined;
|
||||
|
||||
twoFactorEmail: string = null;
|
||||
emailPromise: Promise<any>;
|
||||
twoFactorEmail: string | undefined = undefined;
|
||||
emailPromise: Promise<any> | undefined = undefined;
|
||||
tokenValue: string = "";
|
||||
|
||||
constructor(
|
||||
@@ -59,25 +58,41 @@ export class TwoFactorAuthEmailComponent implements OnInit {
|
||||
protected apiService: ApiService,
|
||||
protected appIdService: AppIdService,
|
||||
private toastService: ToastService,
|
||||
private twoFactorAuthEmailComponentService: TwoFactorAuthEmailComponentService,
|
||||
) {}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
const providerData = await this.twoFactorService.getProviders().then((providers) => {
|
||||
return providers.get(TwoFactorProviderType.Email);
|
||||
});
|
||||
this.twoFactorEmail = providerData.Email;
|
||||
await this.twoFactorAuthEmailComponentService.openPopoutIfApprovedForEmail2fa?.();
|
||||
|
||||
if ((await this.twoFactorService.getProviders()).size > 1) {
|
||||
const providers = await this.twoFactorService.getProviders();
|
||||
|
||||
if (!providers) {
|
||||
throw new Error("User has no 2FA Providers");
|
||||
}
|
||||
|
||||
const email2faProviderData = providers.get(TwoFactorProviderType.Email);
|
||||
|
||||
if (!email2faProviderData) {
|
||||
throw new Error("Unable to retrieve email 2FA provider data");
|
||||
}
|
||||
|
||||
this.twoFactorEmail = email2faProviderData.Email;
|
||||
|
||||
if (providers.size > 1) {
|
||||
await this.sendEmail(false);
|
||||
}
|
||||
}
|
||||
|
||||
async sendEmail(doToast: boolean) {
|
||||
if (this.emailPromise != null) {
|
||||
if (this.emailPromise !== undefined) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ((await this.loginStrategyService.getEmail()) == null) {
|
||||
// TODO: PM-17545 - consider building a method on the login strategy service to get a mostly
|
||||
// initialized TwoFactorEmailRequest in 1 call instead of 5 like we do today.
|
||||
const email = await this.loginStrategyService.getEmail();
|
||||
|
||||
if (email == null) {
|
||||
this.toastService.showToast({
|
||||
variant: "error",
|
||||
title: this.i18nService.t("errorOccurred"),
|
||||
@@ -88,19 +103,20 @@ export class TwoFactorAuthEmailComponent implements OnInit {
|
||||
|
||||
try {
|
||||
const request = new TwoFactorEmailRequest();
|
||||
request.email = await this.loginStrategyService.getEmail();
|
||||
request.masterPasswordHash = await this.loginStrategyService.getMasterPasswordHash();
|
||||
request.email = email;
|
||||
|
||||
request.masterPasswordHash = (await this.loginStrategyService.getMasterPasswordHash()) ?? "";
|
||||
request.ssoEmail2FaSessionToken =
|
||||
await this.loginStrategyService.getSsoEmail2FaSessionToken();
|
||||
(await this.loginStrategyService.getSsoEmail2FaSessionToken()) ?? "";
|
||||
request.deviceIdentifier = await this.appIdService.getAppId();
|
||||
request.authRequestAccessCode = await this.loginStrategyService.getAccessCode();
|
||||
request.authRequestId = await this.loginStrategyService.getAuthRequestId();
|
||||
request.authRequestAccessCode = (await this.loginStrategyService.getAccessCode()) ?? "";
|
||||
request.authRequestId = (await this.loginStrategyService.getAuthRequestId()) ?? "";
|
||||
this.emailPromise = this.apiService.postTwoFactorEmail(request);
|
||||
await this.emailPromise;
|
||||
if (doToast) {
|
||||
this.toastService.showToast({
|
||||
variant: "success",
|
||||
title: null,
|
||||
title: "",
|
||||
message: this.i18nService.t("verificationCodeEmailSent", this.twoFactorEmail),
|
||||
});
|
||||
}
|
||||
@@ -108,6 +124,6 @@ export class TwoFactorAuthEmailComponent implements OnInit {
|
||||
this.logService.error(e);
|
||||
}
|
||||
|
||||
this.emailPromise = null;
|
||||
this.emailPromise = undefined;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,12 @@
|
||||
import { TwoFactorAuthWebAuthnComponentService } from "./two-factor-auth-webauthn-component.service";
|
||||
|
||||
export class DefaultTwoFactorAuthWebAuthnComponentService
|
||||
implements TwoFactorAuthWebAuthnComponentService
|
||||
{
|
||||
/**
|
||||
* Default implementation is to not open in a new tab.
|
||||
*/
|
||||
shouldOpenWebAuthnInNewTab(): boolean {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
export * from "./two-factor-auth-webauthn-component.service";
|
||||
export * from "./default-two-factor-auth-webauthn-component.service";
|
||||
@@ -0,0 +1,10 @@
|
||||
/**
|
||||
* A service that manages all cross client functionality for the WebAuthn 2FA component.
|
||||
*/
|
||||
export abstract class TwoFactorAuthWebAuthnComponentService {
|
||||
/**
|
||||
* Determines if the WebAuthn 2FA should be opened in a new tab or can be completed in the current tab.
|
||||
* In a browser extension context, we open WebAuthn in a new web client tab.
|
||||
*/
|
||||
abstract shouldOpenWebAuthnInNewTab(): boolean;
|
||||
}
|
||||
@@ -0,0 +1,24 @@
|
||||
<div id="web-authn-frame" class="tw-mb-3" *ngIf="!webAuthnNewTab">
|
||||
<div *ngIf="!webAuthnReady" class="tw-flex tw-items-center tw-justify-center">
|
||||
<i class="bwi bwi-spinner bwi-spin bwi-3x" aria-hidden="true"></i>
|
||||
</div>
|
||||
|
||||
<iframe
|
||||
id="webauthn_iframe"
|
||||
sandbox="allow-scripts allow-same-origin"
|
||||
[ngClass]="{ 'tw-hidden': !webAuthnReady }"
|
||||
></iframe>
|
||||
</div>
|
||||
<ng-container *ngIf="webAuthnNewTab">
|
||||
<button
|
||||
class="tw-mb-3"
|
||||
buttonType="primary"
|
||||
[block]="true"
|
||||
bitButton
|
||||
type="button"
|
||||
(click)="authWebAuthn()"
|
||||
appStopClick
|
||||
>
|
||||
{{ "openInNewTab" | i18n }}
|
||||
</button>
|
||||
</ng-container>
|
||||
@@ -1,5 +1,3 @@
|
||||
// FIXME: Update this file to be type safe and remove this and next line
|
||||
// @ts-strict-ignore
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, EventEmitter, Inject, OnDestroy, OnInit, Output } from "@angular/core";
|
||||
@@ -8,14 +6,13 @@ import { ActivatedRoute } from "@angular/router";
|
||||
import { firstValueFrom } from "rxjs";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import { WINDOW } from "@bitwarden/angular/services/injection-tokens";
|
||||
import { TwoFactorService } from "@bitwarden/common/auth/abstractions/two-factor.service";
|
||||
import { TwoFactorProviderType } from "@bitwarden/common/auth/enums/two-factor-provider-type";
|
||||
import { WebAuthnIFrame } from "@bitwarden/common/auth/webauthn-iframe";
|
||||
import { ClientType } from "@bitwarden/common/enums";
|
||||
import { EnvironmentService } from "@bitwarden/common/platform/abstractions/environment.service";
|
||||
import { I18nService } from "@bitwarden/common/platform/abstractions/i18n.service";
|
||||
import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
|
||||
import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
|
||||
import {
|
||||
ButtonModule,
|
||||
@@ -26,6 +23,13 @@ import {
|
||||
ToastService,
|
||||
} from "@bitwarden/components";
|
||||
|
||||
import { TwoFactorAuthWebAuthnComponentService } from "./two-factor-auth-webauthn-component.service";
|
||||
|
||||
export interface WebAuthnResult {
|
||||
token: string;
|
||||
remember?: boolean;
|
||||
}
|
||||
|
||||
@Component({
|
||||
standalone: true,
|
||||
selector: "app-two-factor-auth-webauthn",
|
||||
@@ -42,15 +46,16 @@ import {
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
providers: [],
|
||||
})
|
||||
export class TwoFactorAuthWebAuthnComponent implements OnInit, OnDestroy {
|
||||
@Output() token = new EventEmitter<string>();
|
||||
@Output() webAuthnResultEmitter = new EventEmitter<WebAuthnResult>();
|
||||
@Output() webAuthnInNewTabEmitter = new EventEmitter<boolean>();
|
||||
|
||||
webAuthnReady = false;
|
||||
webAuthnNewTab = false;
|
||||
webAuthnSupported = false;
|
||||
webAuthn: WebAuthnIFrame = null;
|
||||
webAuthnIframe: WebAuthnIFrame | undefined = undefined;
|
||||
|
||||
constructor(
|
||||
protected i18nService: I18nService,
|
||||
@@ -60,33 +65,47 @@ export class TwoFactorAuthWebAuthnComponent implements OnInit, OnDestroy {
|
||||
protected twoFactorService: TwoFactorService,
|
||||
protected route: ActivatedRoute,
|
||||
private toastService: ToastService,
|
||||
private twoFactorAuthWebAuthnComponentService: TwoFactorAuthWebAuthnComponentService,
|
||||
private logService: LogService,
|
||||
) {
|
||||
this.webAuthnSupported = this.platformUtilsService.supportsWebAuthn(win);
|
||||
|
||||
if (this.platformUtilsService.getClientType() == ClientType.Browser) {
|
||||
// FIXME: Chromium 110 has broken WebAuthn support in extensions via an iframe
|
||||
this.webAuthnNewTab = true;
|
||||
}
|
||||
this.webAuthnNewTab = this.twoFactorAuthWebAuthnComponentService.shouldOpenWebAuthnInNewTab();
|
||||
}
|
||||
|
||||
async ngOnInit(): Promise<void> {
|
||||
if (this.route.snapshot.paramMap.has("webAuthnResponse")) {
|
||||
this.token.emit(this.route.snapshot.paramMap.get("webAuthnResponse"));
|
||||
this.webAuthnInNewTabEmitter.emit(this.webAuthnNewTab);
|
||||
|
||||
if (this.webAuthnNewTab && this.route.snapshot.paramMap.has("webAuthnResponse")) {
|
||||
this.submitWebAuthnNewTabResponse();
|
||||
} else {
|
||||
await this.buildWebAuthnIFrame();
|
||||
}
|
||||
}
|
||||
|
||||
this.cleanupWebAuthn();
|
||||
private submitWebAuthnNewTabResponse() {
|
||||
const webAuthnNewTabResponse = this.route.snapshot.paramMap.get("webAuthnResponse");
|
||||
const remember = this.route.snapshot.paramMap.get("remember") === "true";
|
||||
|
||||
if (webAuthnNewTabResponse != null) {
|
||||
this.webAuthnResultEmitter.emit({
|
||||
token: webAuthnNewTabResponse,
|
||||
remember,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
private async buildWebAuthnIFrame() {
|
||||
if (this.win != null && this.webAuthnSupported) {
|
||||
const env = await firstValueFrom(this.environmentService.environment$);
|
||||
const webVaultUrl = env.getWebVaultUrl();
|
||||
this.webAuthn = new WebAuthnIFrame(
|
||||
this.webAuthnIframe = new WebAuthnIFrame(
|
||||
this.win,
|
||||
webVaultUrl,
|
||||
this.webAuthnNewTab,
|
||||
this.platformUtilsService,
|
||||
this.i18nService,
|
||||
(token: string) => {
|
||||
this.token.emit(token);
|
||||
this.webAuthnResultEmitter.emit({ token });
|
||||
},
|
||||
(error: string) => {
|
||||
this.toastService.showToast({
|
||||
@@ -111,25 +130,30 @@ export class TwoFactorAuthWebAuthnComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this.cleanupWebAuthn();
|
||||
this.cleanupWebAuthnIframe();
|
||||
}
|
||||
|
||||
async authWebAuthn() {
|
||||
const providerData = (await this.twoFactorService.getProviders()).get(
|
||||
TwoFactorProviderType.WebAuthn,
|
||||
);
|
||||
const providers = await this.twoFactorService.getProviders();
|
||||
|
||||
if (!this.webAuthnSupported || this.webAuthn == null) {
|
||||
if (providers == null) {
|
||||
this.logService.error("No 2FA providers found. Unable to authenticate with WebAuthn.");
|
||||
return;
|
||||
}
|
||||
|
||||
this.webAuthn.init(providerData);
|
||||
const providerData = providers?.get(TwoFactorProviderType.WebAuthn);
|
||||
|
||||
if (!this.webAuthnSupported || this.webAuthnIframe == null) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.webAuthnIframe.init(providerData);
|
||||
}
|
||||
|
||||
private cleanupWebAuthn() {
|
||||
if (this.webAuthn != null) {
|
||||
this.webAuthn.stop();
|
||||
this.webAuthn.cleanup();
|
||||
private cleanupWebAuthnIframe() {
|
||||
if (this.webAuthnIframe != null) {
|
||||
this.webAuthnIframe.stop();
|
||||
this.webAuthnIframe.cleanup();
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
<bit-form-field>
|
||||
<bit-label class="">{{ "verificationCode" | i18n }}</bit-label>
|
||||
<input type="password" bitInput appAutofocus appInputVerbatim [formControl]="tokenFormControl" />
|
||||
</bit-form-field>
|
||||
@@ -1,10 +1,9 @@
|
||||
import { DialogModule } from "@angular/cdk/dialog";
|
||||
import { CommonModule } from "@angular/common";
|
||||
import { Component, EventEmitter, Output } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule } from "@angular/forms";
|
||||
import { Component, Input } from "@angular/core";
|
||||
import { ReactiveFormsModule, FormsModule, FormControl } from "@angular/forms";
|
||||
|
||||
import { JslibModule } from "@bitwarden/angular/jslib.module";
|
||||
import { I18nPipe } from "@bitwarden/angular/platform/pipes/i18n.pipe";
|
||||
import {
|
||||
ButtonModule,
|
||||
LinkModule,
|
||||
@@ -29,9 +28,8 @@ import {
|
||||
AsyncActionsModule,
|
||||
FormsModule,
|
||||
],
|
||||
providers: [I18nPipe],
|
||||
providers: [],
|
||||
})
|
||||
export class TwoFactorAuthYubikeyComponent {
|
||||
tokenValue: string = "";
|
||||
@Output() token = new EventEmitter<string>();
|
||||
@Input({ required: true }) tokenFormControl: FormControl | undefined = undefined;
|
||||
}
|
||||
@@ -0,0 +1,19 @@
|
||||
import {
|
||||
DuoLaunchAction,
|
||||
LegacyKeyMigrationAction,
|
||||
TwoFactorAuthComponentService,
|
||||
} from "./two-factor-auth-component.service";
|
||||
|
||||
export class DefaultTwoFactorAuthComponentService implements TwoFactorAuthComponentService {
|
||||
shouldCheckForWebAuthnQueryParamResponse() {
|
||||
return false;
|
||||
}
|
||||
|
||||
determineLegacyKeyMigrationAction() {
|
||||
return LegacyKeyMigrationAction.PREVENT_LOGIN_AND_SHOW_REQUIRE_MIGRATION_WARNING;
|
||||
}
|
||||
|
||||
determineDuoLaunchAction(): DuoLaunchAction {
|
||||
return DuoLaunchAction.DIRECT_LAUNCH;
|
||||
}
|
||||
}
|
||||
6
libs/auth/src/angular/two-factor-auth/index.ts
Normal file
6
libs/auth/src/angular/two-factor-auth/index.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
export * from "./two-factor-auth-component.service";
|
||||
export * from "./default-two-factor-auth-component.service";
|
||||
export * from "./two-factor-auth.component";
|
||||
export * from "./two-factor-auth.guard";
|
||||
|
||||
export * from "./child-components";
|
||||
@@ -0,0 +1,66 @@
|
||||
import { TwoFactorProviderType } from "@bitwarden/common/auth/enums/two-factor-provider-type";
|
||||
|
||||
export enum LegacyKeyMigrationAction {
|
||||
PREVENT_LOGIN_AND_SHOW_REQUIRE_MIGRATION_WARNING,
|
||||
NAVIGATE_TO_MIGRATION_COMPONENT,
|
||||
}
|
||||
|
||||
export enum DuoLaunchAction {
|
||||
DIRECT_LAUNCH,
|
||||
SINGLE_ACTION_POPOUT,
|
||||
}
|
||||
|
||||
/**
|
||||
* Manages all cross client functionality so we can have a single two factor auth component
|
||||
* implementation for all clients.
|
||||
*/
|
||||
export abstract class TwoFactorAuthComponentService {
|
||||
/**
|
||||
* Determines if the client should check for a webauthn response on init.
|
||||
* Currently, only the extension should check during component initialization.
|
||||
*/
|
||||
abstract shouldCheckForWebAuthnQueryParamResponse(): boolean;
|
||||
|
||||
/**
|
||||
* Extends the popup width if required.
|
||||
* Some client specific situations require the popup to be wider than the default width.
|
||||
*/
|
||||
abstract extendPopupWidthIfRequired?(
|
||||
selected2faProviderType: TwoFactorProviderType,
|
||||
): Promise<void>;
|
||||
|
||||
/**
|
||||
* Removes the popup width extension.
|
||||
*/
|
||||
abstract removePopupWidthExtension?(): void;
|
||||
|
||||
/**
|
||||
* We used to use the user's master key to encrypt their data. We deprecated that approach
|
||||
* and now use a user key. This method should be called if we detect that the user
|
||||
* is still using the old master key encryption scheme (server sends down a flag to
|
||||
* indicate this). This method then determines what action to take based on the client.
|
||||
*
|
||||
* We have two possible actions:
|
||||
* 1. Prevent the user from logging in and show a warning that they need to migrate their key on the web client today.
|
||||
* 2. Navigate the user to the key migration component on the web client.
|
||||
*/
|
||||
abstract determineLegacyKeyMigrationAction(): LegacyKeyMigrationAction;
|
||||
|
||||
/**
|
||||
* Optionally closes any single action popouts (extension only).
|
||||
* @returns true if we are in a single action popout and it was closed, false otherwise.
|
||||
*/
|
||||
abstract closeSingleActionPopouts?(): Promise<boolean>;
|
||||
|
||||
/**
|
||||
* Optionally refreshes any open windows (exempts current window).
|
||||
* Only defined on the extension client for the goal of refreshing sidebars.
|
||||
*/
|
||||
abstract reloadOpenWindows?(): void;
|
||||
|
||||
/**
|
||||
* Determines the action to take when launching the Duo flow.
|
||||
* The extension has to popout the flow, while other clients can launch it directly.
|
||||
*/
|
||||
abstract determineDuoLaunchAction(): DuoLaunchAction;
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user