94 lines
3.1 KiB
JavaScript
94 lines
3.1 KiB
JavaScript
/* This Source Code Form is subject to the terms of the Mozilla Public
|
|
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
|
|
|
/* eslint-env mozilla/frame-script */
|
|
|
|
export default class MonitorClass {
|
|
constructor(document) {
|
|
this.doc = document;
|
|
}
|
|
|
|
init() {
|
|
const signUpForMonitorButton = this.doc.getElementById(
|
|
"sign-up-for-monitor-button"
|
|
);
|
|
signUpForMonitorButton.addEventListener("click", () => {
|
|
console.log("TODO: Where is this link supposed to go.");
|
|
});
|
|
|
|
RPMAddMessageListener("SendUserLoginsData", ({ data }) => {
|
|
// Wait for monitor data and display the card.
|
|
this.getMonitorData(data);
|
|
RPMSendAsyncMessage("FetchMonitorData");
|
|
});
|
|
}
|
|
|
|
/**
|
|
* Adds a listener for receiving the monitor data. Once received then display this data
|
|
* in the card.
|
|
*
|
|
* @param {Object} loginData
|
|
* Login data received from the Logins service.
|
|
*/
|
|
getMonitorData(loginData) {
|
|
RPMAddMessageListener("SendMonitorData", ({ data: monitorData }) => {
|
|
// Once data for the user is retrieved, display the monitor card.
|
|
this.buildContent(loginData, monitorData);
|
|
|
|
// Show the Monitor card.
|
|
const monitorCard = this.doc.querySelector(
|
|
".card.monitor-card.hidden"
|
|
);
|
|
monitorCard.classList.remove("hidden");
|
|
});
|
|
}
|
|
|
|
buildContent(loginData, monitorData) {
|
|
const { hasFxa, numLogins } = loginData;
|
|
const isLoggedIn = numLogins > 0 || hasFxa;
|
|
const headerContent = this.doc.querySelector(
|
|
"#monitor-header-content span"
|
|
);
|
|
const monitorCard = this.doc.querySelector(".card.monitor-card");
|
|
if (isLoggedIn && !monitorData.error) {
|
|
monitorCard.classList.add("has-logins");
|
|
headerContent.textContent =
|
|
"Firefox Monitor warns you if your info has appeared in a known data breach";
|
|
this.renderContentForUserWithLogins(monitorData);
|
|
} else {
|
|
monitorCard.classList.add("no-logins");
|
|
const signUpForMonitorButton = this.doc.getElementById(
|
|
"sign-up-for-monitor-button"
|
|
);
|
|
signUpForMonitorButton.textContent = hasFxa
|
|
? "Turn on Monitor"
|
|
: "Sign up for Monitor";
|
|
headerContent.textContent =
|
|
"Check Firefox Monitor to see if you've been part of a data breach and get alerts about new breaches.";
|
|
}
|
|
}
|
|
|
|
renderContentForUserWithLogins(monitorData) {
|
|
const storedEmail = this.doc.querySelector(
|
|
"span[data-type='stored-emails']"
|
|
);
|
|
const knownBreaches = this.doc.querySelector(
|
|
"span[data-type='known-breaches']"
|
|
);
|
|
const exposedPasswords = this.doc.querySelector(
|
|
"span[data-type='exposed-passwords']"
|
|
);
|
|
const exposedLockwisePasswords = this.doc.querySelector(
|
|
".number-of-breaches.block"
|
|
);
|
|
|
|
storedEmail.textContent = monitorData.monitoredEmails;
|
|
knownBreaches.textContent = monitorData.numBreaches;
|
|
exposedPasswords.textContent = monitorData.passwords;
|
|
|
|
// TODO: Bug 1559427: Display data from Lockwise here
|
|
exposedLockwisePasswords.textContent = 2;
|
|
}
|
|
}
|