-
Notifications
You must be signed in to change notification settings - Fork 1.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[PM-4306] Extract file-popout-callout component used within Send on b…
…rowser (#6564) * Extract callout in send-add-edit into separate component - Created new file-popout-callout.component - Register component within app.module - Replaced usage within send-add-edit.component * Override popup header style to fix bit-callout * [PM-4375] Reuse show file selector callout logic (#6606) * Added FilePopoutUtilsService with the logic of showing/hiding the popout callout and file selector button * Added documentation to FilePopoutUtilsService * Added documentation for class and constructor on FilePopoutUtilsService --------- Co-authored-by: Daniel James Smith <[email protected]> Co-authored-by: aj-rosado <[email protected]>
- Loading branch information
3 people
authored
Oct 20, 2023
1 parent
ca7e1b2
commit 35ed8f1
Showing
7 changed files
with
145 additions
and
49 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
11 changes: 11 additions & 0 deletions
11
apps/browser/src/tools/popup/components/file-popout-callout.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| <bit-callout | ||
| type="warning" | ||
| icon="bwi-external-link bwi-rotate-270 bwi-fw" | ||
| title="{{ 'sendFileCalloutHeader' | i18n }}" | ||
| (click)="popOutWindow()" | ||
| *ngIf="showFilePopoutMessage" | ||
| > | ||
| <div *ngIf="showChromiumFileWarning">{{ "sendLinuxChromiumFileWarning" | i18n }}</div> | ||
| <div *ngIf="showFirefoxFileWarning">{{ "sendFirefoxFileWarning" | i18n }}</div> | ||
| <div *ngIf="showSafariFileWarning">{{ "sendSafariFileWarning" | i18n }}</div> | ||
| </bit-callout> |
37 changes: 37 additions & 0 deletions
37
apps/browser/src/tools/popup/components/file-popout-callout.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| import { CommonModule } from "@angular/common"; | ||
| import { Component, OnInit } from "@angular/core"; | ||
|
|
||
| import { JslibModule } from "@bitwarden/angular/jslib.module"; | ||
| import { CalloutModule } from "@bitwarden/components"; | ||
|
|
||
| import { PopupUtilsService } from "../../../popup/services/popup-utils.service"; | ||
| import { FilePopoutUtilsService } from "../services/file-popout-utils.service"; | ||
|
|
||
| @Component({ | ||
| selector: "tools-file-popout-callout", | ||
| templateUrl: "file-popout-callout.component.html", | ||
| standalone: true, | ||
| imports: [CommonModule, JslibModule, CalloutModule], | ||
| }) | ||
| export class FilePopoutCalloutComponent implements OnInit { | ||
| protected showFilePopoutMessage: boolean; | ||
| protected showFirefoxFileWarning: boolean; | ||
| protected showSafariFileWarning: boolean; | ||
| protected showChromiumFileWarning: boolean; | ||
|
|
||
| constructor( | ||
| private popupUtilsService: PopupUtilsService, | ||
| private filePopoutUtilsService: FilePopoutUtilsService | ||
| ) {} | ||
|
|
||
| ngOnInit() { | ||
| this.showFilePopoutMessage = this.filePopoutUtilsService.showFilePopoutMessage(window); | ||
| this.showFirefoxFileWarning = this.filePopoutUtilsService.showFirefoxFileWarning(window); | ||
| this.showSafariFileWarning = this.filePopoutUtilsService.showSafariFileWarning(window); | ||
| this.showChromiumFileWarning = this.filePopoutUtilsService.showChromiumFileWarning(window); | ||
| } | ||
|
|
||
| popOutWindow() { | ||
| this.popupUtilsService.popOut(window); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
76 changes: 76 additions & 0 deletions
76
apps/browser/src/tools/popup/services/file-popout-utils.service.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,76 @@ | ||
| import { Injectable } from "@angular/core"; | ||
|
|
||
| import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service"; | ||
|
|
||
| import { PopupUtilsService } from "../../../popup/services/popup-utils.service"; | ||
|
|
||
| /** | ||
| * Service for determining whether to display file popout callout messages. | ||
| */ | ||
| @Injectable() | ||
| export class FilePopoutUtilsService { | ||
| /** | ||
| * Creates an instance of FilePopoutUtilsService. | ||
| */ | ||
| constructor( | ||
| private platformUtilsService: PlatformUtilsService, | ||
| private popupUtilsService: PopupUtilsService | ||
| ) {} | ||
|
|
||
| /** | ||
| * Determines whether to show any file popout callout message in the current browser. | ||
| * @param win - The window context in which the check should be performed. | ||
| * @returns True if a file popout callout message should be displayed; otherwise, false. | ||
| */ | ||
| showFilePopoutMessage(win: Window): boolean { | ||
| return ( | ||
| this.showFirefoxFileWarning(win) || | ||
| this.showSafariFileWarning(win) || | ||
| this.showChromiumFileWarning(win) | ||
| ); | ||
| } | ||
|
|
||
| /** | ||
| * Determines whether to show a file popout callout message for the Firefox browser | ||
| * @param win - The window context in which the check should be performed. | ||
| * @returns True if the extension is not in a sidebar or popout; otherwise, false. | ||
| */ | ||
| showFirefoxFileWarning(win: Window): boolean { | ||
| return ( | ||
| this.platformUtilsService.isFirefox() && | ||
| !(this.popupUtilsService.inSidebar(win) || this.popupUtilsService.inPopout(win)) | ||
| ); | ||
| } | ||
|
|
||
| /** | ||
| * Determines whether to show a file popout message for the Safari browser | ||
| * @param win - The window context in which the check should be performed. | ||
| * @returns True if the extension is not in a popout; otherwise, false. | ||
| */ | ||
| showSafariFileWarning(win: Window): boolean { | ||
| return this.platformUtilsService.isSafari() && !this.popupUtilsService.inPopout(win); | ||
| } | ||
|
|
||
| /** | ||
| * Determines whether to show a file popout callout message for Chromium-based browsers in Linux and Mac OS X Big Sur | ||
| * @param win - The window context in which the check should be performed. | ||
| * @returns True if the extension is not in a sidebar or popout; otherwise, false. | ||
| */ | ||
| showChromiumFileWarning(win: Window): boolean { | ||
| return ( | ||
| (this.isLinux(win) || this.isUnsupportedMac(win)) && | ||
| !this.platformUtilsService.isFirefox() && | ||
| !(this.popupUtilsService.inSidebar(win) || this.popupUtilsService.inPopout(win)) | ||
| ); | ||
| } | ||
|
|
||
| private isLinux(win: Window): boolean { | ||
| return win?.navigator?.userAgent.indexOf("Linux") !== -1; | ||
| } | ||
|
|
||
| private isUnsupportedMac(win: Window): boolean { | ||
| return ( | ||
| this.platformUtilsService.isChrome() && win?.navigator?.appVersion.includes("Mac OS X 11") | ||
| ); | ||
| } | ||
| } |