diff --git a/apps/browser/src/manifest.v3.json b/apps/browser/src/manifest.v3.json index 44d5c71e9b3..7d1a0fb58e9 100644 --- a/apps/browser/src/manifest.v3.json +++ b/apps/browser/src/manifest.v3.json @@ -175,7 +175,6 @@ "overlay/menu.html", "overlay/button.html", "overlay/list.html", - "phishing/warning.html", "popup/fonts/*" ], "matches": [""] diff --git a/apps/browser/src/phishing-detection/images/phishing-site-detected.png b/apps/browser/src/phishing-detection/images/phishing-site-detected.png new file mode 100755 index 00000000000..172bd11f824 Binary files /dev/null and b/apps/browser/src/phishing-detection/images/phishing-site-detected.png differ diff --git a/apps/browser/src/phishing-detection/pages/phishing-warning.html b/apps/browser/src/phishing-detection/pages/phishing-warning.html new file mode 100644 index 00000000000..ee051b5b5d3 --- /dev/null +++ b/apps/browser/src/phishing-detection/pages/phishing-warning.html @@ -0,0 +1,15 @@ +
+
🏢⚠️
+ +
+ + +
+ + Exit page +
+ +
+ Question? + Action here +
diff --git a/apps/browser/src/phishing-detection/pages/phishing-warning.ts b/apps/browser/src/phishing-detection/pages/phishing-warning.ts new file mode 100644 index 00000000000..5ceb65224e0 --- /dev/null +++ b/apps/browser/src/phishing-detection/pages/phishing-warning.ts @@ -0,0 +1,68 @@ +// FIXME: Update this file to be type safe and remove this and next line +// @ts-strict-ignore +import { CommonModule } from "@angular/common"; +import { Component, OnDestroy, OnInit } from "@angular/core"; +import { RouterModule } from "@angular/router"; +import { Subject } from "rxjs"; + +import { AnonLayoutComponent } from "@bitwarden/auth/angular"; +import { Icon, IconModule } from "@bitwarden/components"; + +import { PopOutComponent } from "../../platform/popup/components/pop-out.component"; +import { PopupHeaderComponent } from "../../platform/popup/layout/popup-header.component"; +import { PopupPageComponent } from "../../platform/popup/layout/popup-page.component"; + +@Component({ + standalone: true, + templateUrl: "phishing-warning.html", + imports: [ + AnonLayoutComponent, + CommonModule, + IconModule, + PopOutComponent, + PopupPageComponent, + PopupHeaderComponent, + RouterModule, + PopupPageComponent, + ], +}) +export class PhishingWarning implements OnInit, OnDestroy { + private destroy$ = new Subject(); + + protected showAcctSwitcher: boolean; + protected showBackButton: boolean; + protected showLogo: boolean = true; + protected hideIcon: boolean = false; + + protected pageTitle: string; + protected pageSubtitle: string; + protected pageIcon: Icon; + protected showReadonlyHostname: boolean; + protected maxWidth: "md" | "3xl"; + protected hasLoggedInAccount: boolean = false; + protected hideFooter: boolean; + + protected theme: string; + + constructor() {} + + async ngOnInit(): Promise { + this.resetData(); + } + + private resetData() { + this.pageTitle = "Jimmy pageTitle"; + this.pageSubtitle = "Jimmy pageSubtitle"; + this.showReadonlyHostname = null; + this.showAcctSwitcher = null; + this.showBackButton = null; + this.showLogo = true; + this.maxWidth = null; + this.hideFooter = null; + } + + ngOnDestroy() { + this.destroy$.next(); + this.destroy$.complete(); + } +} diff --git a/apps/browser/src/phishing-detection/pages/warning.html b/apps/browser/src/phishing-detection/pages/warning.html deleted file mode 100644 index 1f7e7af61d1..00000000000 --- a/apps/browser/src/phishing-detection/pages/warning.html +++ /dev/null @@ -1,87 +0,0 @@ - - - - - - Phishing site detected - - - Bitwarden logo - -
-
🏢⚠️
- -

Phishing site detected

- -

- Bitwarden has prevented this page from loading. -

- -
- - -
- - - Exit page - -
- -
- Question? - Action here -
- - diff --git a/apps/browser/src/phishing-detection/trigger-phishing-detection-script-injection.ts b/apps/browser/src/phishing-detection/trigger-phishing-detection-script-injection.ts index 9cb1c76d8a7..0c2740176fc 100644 --- a/apps/browser/src/phishing-detection/trigger-phishing-detection-script-injection.ts +++ b/apps/browser/src/phishing-detection/trigger-phishing-detection-script-injection.ts @@ -31,11 +31,8 @@ async function loadPhishingDetectionContent() { const url = new URL(activeUrl); - const warningUrl = chrome.runtime.getURL("phishing/warning.html"); - await chrome.runtime.sendMessage({ command: PhishingDetectionCommands.RedirectToWarningPage, - url: warningUrl, phishingHost: url.hostname, }); } diff --git a/apps/browser/src/platform/services/phishing-detection.service.ts b/apps/browser/src/platform/services/phishing-detection.service.ts index 1db9eeee173..7b5d97eca7a 100644 --- a/apps/browser/src/platform/services/phishing-detection.service.ts +++ b/apps/browser/src/platform/services/phishing-detection.service.ts @@ -227,11 +227,13 @@ export class PhishingDetectionService { static setupRedirectToWarningPageListener(): void { BrowserApi.addListener(chrome.runtime.onMessage, async (message, sender, sendResponse) => { if (message.command === PhishingDetectionCommands.RedirectToWarningPage) { + const phishingWarningPage = chrome.runtime.getURL("popup/index.html#/phishing-warning"); PhishingDetectionService.logService.debug("RedirectToWarningPage handler", { message, + phishingWarning: phishingWarningPage, }); - await chrome.tabs.update(sender.tab.id, { url: message.url }); + await chrome.tabs.update(sender.tab.id, { url: phishingWarningPage }); } }); } diff --git a/apps/browser/src/popup/app-routing.module.ts b/apps/browser/src/popup/app-routing.module.ts index 8ebf6eb6110..41f50cb1a6f 100644 --- a/apps/browser/src/popup/app-routing.module.ts +++ b/apps/browser/src/popup/app-routing.module.ts @@ -41,6 +41,7 @@ import { DeviceVerificationIcon, UserLockIcon, VaultIcon, + BitwardenLogo, } from "@bitwarden/auth/angular"; import { LockComponent } from "@bitwarden/key-management-ui"; import { @@ -65,6 +66,7 @@ import { BlockedDomainsComponent } from "../autofill/popup/settings/blocked-doma import { ExcludedDomainsComponent } from "../autofill/popup/settings/excluded-domains.component"; import { NotificationsSettingsComponent } from "../autofill/popup/settings/notifications.component"; import { PremiumV2Component } from "../billing/popup/settings/premium-v2.component"; +import { PhishingWarning } from "../phishing-detection/pages/phishing-warning"; import BrowserPopupUtils from "../platform/popup/browser-popup-utils"; import { popupRouterCacheGuard } from "../platform/popup/view-cache/popup-router-cache.service"; import { CredentialGeneratorHistoryComponent } from "../tools/popup/generator/credential-generator-history.component"; @@ -141,6 +143,24 @@ const routes: Routes = [ canActivate: [fido2AuthGuard], data: { elevation: 1 } satisfies RouteDataProperties, }, + { + path: "", + component: AnonLayoutWrapperComponent, + children: [ + { + path: "phishing-warning", + component: PhishingWarning, + data: { + pageIcon: BitwardenLogo, + + pageTitle: "Phishing site detected", + pageSubtitle: "Bitwarden has prevented this page from loading.", + + showReadonlyHostname: true, + } satisfies AnonLayoutWrapperData, + }, + ], + }, { path: "", component: ExtensionAnonLayoutWrapperComponent, diff --git a/apps/browser/webpack.config.js b/apps/browser/webpack.config.js index 29a7bcdcf2a..238f4bfb39c 100644 --- a/apps/browser/webpack.config.js +++ b/apps/browser/webpack.config.js @@ -145,11 +145,6 @@ const plugins = [ filename: "overlay/list.html", chunks: ["overlay/list"], }), - new HtmlWebpackPlugin({ - template: "./src/phishing-detection/pages/warning.html", - filename: "phishing/warning.html", - chunks: ["phishing/warning"], - }), new CopyWebpackPlugin({ patterns: [ {