populateNewsFeed: async()

in src/js/popup/popup.js [1608:1798]


      populateNewsFeed: async ()=> {
        // audience can be premium, free, phones, all
        // Optional data: waffle, fullCta*
        const savings = "40%"; // For "Save 40%!" in the Bundle promo body
        
        const isBundleAvailableInCountry = (await browser.storage.local.get("bundlePlans")).bundlePlans.BUNDLE_PLANS.available_in_country;
        const isPhoneAvailableInCountry = (await browser.storage.local.get("phonePlans")).phonePlans.PHONE_PLANS.available_in_country;
        const hasPhone = (await browser.storage.local.get("has_phone")).has_phone;
        const hasVpn = (await browser.storage.local.get("has_vpn")).has_vpn;

        // Conditions for phone masking announcement to be shown: if the user is in US/CAN, phone flag is on, and user has not purchased phone plan yet
        const isPhoneMaskingAvailable = isPhoneAvailableInCountry && !hasPhone;

        // Conditions for bundle announcement to be shown: if the user is in US/CAN, bundle flag is on, and user has not purchased bundle plan yet
        const isBundleAvailable = isBundleAvailableInCountry && !hasVpn;
      
        // Conditions for firefox integration to be shown: if the waffle flag "firefox_integration" is set as true
        const isFirefoxIntegrationAvailable = await checkWaffleFlag("firefox_integration");
        
        const currentBrowser = await getBrowser();
        const isEuCountryExpansion = await checkWaffleFlag(
          "eu_country_expansion"
        );
        const getPeriodicalPremiumPlans = (await browser.storage.local.get("periodicalPremiumPlans")).periodicalPremiumPlans.PERIODICAL_PREMIUM_PLANS;
        const getPeriodicalPremiumProductId = (await browser.storage.local.get("periodicalPremiumProductId")).periodicalPremiumProductId.PERIODICAL_PREMIUM_PRODUCT_ID;
        const premiumAvailability = getPeriodicalPremiumPlans.available_in_country;
        const countryCode = getPeriodicalPremiumPlans.country_code;
        const premium = (await browser.storage.local.get("premium")).premium;
        const isHolidayPromo2023Available = await checkWaffleFlag(
          "holiday_promo_2023"
        );

        if (
          !premium &&
          isEuCountryExpansion &&
          [
            "bg",
            "cz",
            "cy",
            "dk",
            "ee",
            "gr",
            "hr",
            "hu",
            "lt",
            "lv",
            "lu",
            "mt",
            "pl",
            "pt",
            "ro",
            "si",
            "sk",
          ].includes(
            countryCode
          )
        ) {
          sessionState.newsContent.push({
            id: "eu-country-expansion",
            dateAdded: "20230726", // YYYYMMDD
            waffle: "eu_country_expansion",
            locale: "us",
            audience: "free",
            headlineString: "popupEuCountryExpansionHeadline",
            bodyString: "popupEuCountryExpansionBody",
            teaserImg:
              "/images/panel-images/announcements/panel-announcement-eu-expansion-square-illustration.svg",
            fullImg:
              "/images/panel-images/announcements/panel-announcement-eu-expansion-illustration.svg",
            fullCta: "popupEuCountryExpansionPromoCTA",
            fullCtaRelayURL: true,
            fullCtaHref:
              "/premium/?utm_source=fx-relay-addon&utm_medium=popup&utm_content=panel-news-eu-country-expansion-cta#pricing",
            fullCtaEventLabel: "panel-news-eu-country-expansion-cta",
            fullCtaEventAction: "click",
          });
        }

        if (isFirefoxIntegrationAvailable && currentBrowser == "Firefox") {
          sessionState.newsContent.push({
            id: "firefox-integration",
            dateAdded: "20230314", // YYYYMMDD
            waffle: "firefox_integration",
            locale: "us",
            audience: "premium",
            headlineString: "popupPasswordManagerRelayHeadline",
            bodyString: "popupPasswordManagerRelayBody",
            teaserImg:
              "/images/panel-images/announcements/panel-announcement-password-manager-relay-square-illustration.svg",
            fullImg:
              "/images/panel-images/announcements/panel-announcement-password-manager-relay-illustration.svg",
          });
        }

        // Add Phone Masking News Item
        if (isPhoneMaskingAvailable) {
          sessionState.newsContent.push({
            id: "phones",
            dateAdded: "20221006", // YYYYMMDD
            headlineString: "popupPhoneMaskingPromoHeadline",
            bodyString: "popupPhoneMaskingPromoBody",
            teaserImg:
              "/images/panel-images/announcements/premium-announcement-phone-masking.svg",
            fullImg:
              "/images/panel-images/announcements/premium-announcement-phone-masking-hero.svg",
            fullCta: "popupPhoneMaskingPromoCTA",
            fullCtaRelayURL: true,
            fullCtaHref:
              "/premium/?utm_source=fx-relay-addon&utm_medium=popup&utm_content=panel-news-phone-masking-cta#pricing",
            fullCtaEventLabel: "panel-news-phone-masking-cta",
            fullCtaEventAction: "click",
          });
        }

        // Add Bundle Pricing News Item
        if (isBundleAvailable) {
          const getBundlePlans = (await browser.storage.local.get("bundlePlans")).bundlePlans.BUNDLE_PLANS;
          const getBundlePrice = getBundlePlans.plan_country_lang_mapping[getBundlePlans.country_code]["*"].yearly.price;
          const getBundleCurrency = getBundlePlans.plan_country_lang_mapping[getBundlePlans.country_code]["*"].yearly.currency;
          const userLocale = navigator.language;
          const formattedBundlePrice = new Intl.NumberFormat(userLocale, {
            style: "currency",
            currency: getBundleCurrency,
          }).format(getBundlePrice);
          
          sessionState.newsContent.push({
            id: "mozilla-vpn-bundle",
            dateAdded: "20221025", // YYYYMMDD
            headlineString: "popupBundlePromoHeadline_2",
            headlineStringArgs: savings,
            bodyString: "popupBundlePromoBody_3",
            bodyStringArgs: formattedBundlePrice,
            teaserImg:
              "/images/panel-images/announcements/panel-bundle-announcement-square.svg",
            fullImg:
              "/images/panel-images/announcements/panel-bundle-announcement.svg",
            fullCta: "popupPhoneMaskingPromoCTA",
            fullCtaRelayURL: true,
            fullCtaHref:
              "/premium/?utm_source=fx-relay-addon&utm_medium=popup&utm_content=panel-news-bundle-cta#pricing",
            fullCtaEventLabel: "panel-news-bundle-cta",
            fullCtaEventAction: "click",
          },)
        }

        const currentDate = new Date();
        const holidayPromoExpires = new Date('2023-12-31');
        const isHolidayPromo2023Active = currentDate <= holidayPromoExpires;

        // Show if promo is available, if user does not have premium, if active and if premium is availble in user's region
        if (isHolidayPromo2023Available && !premium && isHolidayPromo2023Active && premiumAvailability) {
          const getPeriodicalPremiumPlanYearlyId = getPeriodicalPremiumPlans.plan_country_lang_mapping[getPeriodicalPremiumPlans.country_code]["*"].yearly.id;
          const fxaOrigin = (await browser.storage.local.get("fxaOrigin")).fxaOrigin.FXA_ORIGIN;
          const holidayPromo2023Url =  `${fxaOrigin}/subscriptions/products/${getPeriodicalPremiumProductId}?plan=${getPeriodicalPremiumPlanYearlyId}&coupon=HOLIDAY20&utm_campaign=relay-holiday-promo-2023&utm_source=fx-relay-addon&utm_medium=popup&utm_content=panel-news-holiday-promo-2023-cta`;

          sessionState.newsContent.push({
            id: "holiday-promo-2023",
            dateAdded: "20231121", // YYYYMMDD
            waffle: "holiday_promo_2023",
            locale: "us",
            audience: "free",
            headlineString: "popupHolidayPromo2023Headline",
            bodyString: "popupHolidayPromo2023Body",
            teaserImg:
              "/images/panel-images/announcements/panel-announcement-holiday-promo-2023-square-illustration.svg",
            fullImg:
              "/images/panel-images/announcements/panel-announcement-holiday-promo-2023-illustration.svg",
            fullCta: "popupHolidayPromo2023CTA",
            fullCtaRelayURL: false,
            fullCtaHref: holidayPromo2023Url,
            fullCtaEventLabel: "panel-news-holiday-promo-2023-cta",
            fullCtaEventAction: "click",
          });
        }

        // Remove news nav link if there's no news items to display to user
        if (sessionState.newsContent.length === 0 ) {
          document.querySelector(".fx-relay-menu-dashboard-link[data-panel-id='news']").remove();
          return;
        }
        
        // Sort news items by dateAdded field (Newest at the top)
        sessionState.newsContent.sort((a, b) => (a.dateAdded < b.dateAdded ? 1 : -1));

        // Update news item count
        sessionState.newsItemsCount = sessionState.newsContent.length;

        // Set unread notification count
        // TODO: Move some of this logic to get_profile_data to set the browserActionBadge to a #
        await popup.panel.news.utilities.initNewsItemCountNotification();
      },