Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2025-01-02 18:17:46 +01:00
Code Issues Projects Releases Wiki Activity

Duo Redirect Handoff Message Fix (#7938)

Browse Source 
* refactor handoff message countdown timer

* update documentation
This commit is contained in:
rr-bw 2024-02-13 12:21:13 -08:00 committed by GitHub
parent 9980c3feb9
commit aa11feec1b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 21 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
apps/web/src/connectors/duo-redirect.ts
View File

@ -24,8 +24,8 @@ window.addEventListener("load", () => {
});
/**
* The `duoHandOffMessage` is set in the client via a cookie. This allows us to
* make use of i18n translations.
* The `duoHandOffMessage` must be set in the client via a cookie. This is so
* we can make use of i18n translations.
*
* Format the message as an object and set is as a cookie. The following gives an
* example (be sure to replace strings with i18n translated text):
@ -35,19 +35,29 @@ window.addEventListener("load", () => {
* title: "You successfully logged in",
* message: "This window will automatically close in 5 seconds",
* buttonText: "Close",
* countdown: 5
* isCountdown: true
* };
*
* document.cookie = `duoHandOffMessage=${encodeURIComponent(JSON.stringify(duoHandOffMessage))};SameSite=strict`;
*
* ```
*
* The `title`, `message`, and `buttonText` properties will be used to create the relevant
* DOM elements. The `countdown` property will be used for the starting value of the countdown.
* Make sure the `countdown` number matches the number set in the `message` property.
* The `title`, `message`, and `buttonText` properties will be used to create the
* relevant DOM elements.
*
* If no `countdown` property is given, there will be no countdown timer and the user will simply
* have to close the tab manually.
* Countdown timer:
* The `isCountdown` signifies that you want to start a countdown timer that will
* automatically close the tab when finished. The starting point for the timer will
* be based upon the first number that can be parsed from the `message` property
* (so be sure to add exactly one number to the `message`).
*
* This implementation makes it so the client does not have to split up the `message` into
* three translations, such as:
* ['This window will automatically close in', '5', 'seconds']
* ...which would cause bad translations in languages that swap the order of words.
*
* If `isCountdown` is undefined/false, there will be no countdown timer and the user
* will simply have to close the tab manually.
*/
function processAndDisplayHandoffMessage() {
const handOffMessageCookie = ("; " + document.cookie)
@ -86,12 +96,12 @@ function processAndDisplayHandoffMessage() {
content.appendChild(button);
// Countdown timer (closes tab upon completion)
if (handOffMessage.countdown && Number.isInteger(handOffMessage.countdown)) {
let num = handOffMessage.countdown;
if (handOffMessage.isCountdown) {
let num = Number(p.textContent.match(/\d+/)[0]);
const interval = setInterval(() => {
if (num > 1) {
p.textContent = `This window will automatically close in ${num - 1} seconds`;
p.textContent = p.textContent.replace(String(num), String(num - 1));
num--;
} else {
clearInterval(interval);