in src/js/popup/popup.js [663:699]
setRemainingMaskCount: async () => {
const { masks, maxNumAliases } = await popup.panel.masks.utilities.getRemainingAliases();
const numRemaining = maxNumAliases - masks.length;
const masksAvailable = document.querySelector(".fx-relay-masks-available-count");
const masksLimitReached = document.querySelector(".fx-relay-masks-limit-upgrade-string");
const limitReachedToast = document.querySelector(".fx-relay-masks-limit-upgrade");
masksAvailable.textContent = browser.i18n.getMessage("popupFreeMasksAvailable", [numRemaining, maxNumAliases]);
masksLimitReached.textContent = browser.i18n.getMessage("popupFreeMasksLimitReached", [maxNumAliases]);
const generateRandomMask = document.querySelector(".js-generate-random-mask");
if (masks.length === 0) {
generateRandomMask.classList.remove("is-hidden");
return;
}
if (numRemaining <= 0) {
// No masks remaining
limitReachedToast.classList.remove("is-hidden");
masksAvailable.classList.add("is-hidden");
// Hide Generate Button
generateRandomMask.classList.add("is-hidden");
// Show Upgrade Button
const getUnlimitedMasksBtn = document.querySelector(".fx-relay-mask-upgrade-button");
getUnlimitedMasksBtn.classList.remove("is-hidden");
getUnlimitedMasksBtn.focus();
} else {
// Show Masks Count/Generate Button
masksAvailable.classList.remove("is-hidden");
generateRandomMask.classList.remove("is-hidden");
generateRandomMask.focus();
}
}