4c534662-b940-406d-bbfc-64eb567191d8

Committed 18 Aug 2025 03:11PM UTC coverage: 86.299% (+0.009%) from 86.29%

Build # 4c534662-b940-406d-bbfc-64eb567191d8

Build Type

push

circleci

Committed by

web-flow

Commit Message

Merge pull request #5797 from mozilla/dependabot/npm_and_yarn/testing-library/jest-dom-6.7.0

build(deps-dev): bump @testing-library/jest-dom from 6.6.4 to 6.7.0

Run Details

2741 of 3947 branches covered (69.45%)

Branch coverage included in aggregate %.

17906 of 19978 relevant lines covered (89.63%)

9.96 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

27.27

/frontend/src/components/layout/topmessage/HolidayPromoBanner.tsx

import Link from "next/link";
import { useRouter } from "next/router";
import { useL10n } from "../../../hooks/l10n";
import { Localized } from "../../Localized";
import styles from "./HolidayPromoBanner.module.scss";
import { RuntimeData } from "../../../hooks/api/runtimeData";
import {
  getPeriodicalPremiumSubscribeLink,
  isPeriodicalPremiumAvailableInCountry,
} from "../../../functions/getPlan";
import { ProfileData } from "../../../hooks/api/profile";
import { useGaEvent } from "../../../hooks/gaEvent";
import { useGaViewPing } from "../../../hooks/gaViewPing";

type Props = {
  isLoading: boolean;
  profile?: ProfileData;
  runtimeData?: RuntimeData;
};

export const HolidayPromoBanner = (props: Props) => {
  const l10n = useL10n();
  const gaEvent = useGaEvent();
  const router = useRouter();
  const coupon = "HOLIDAY20";
  const subscribeLink = isPeriodicalPremiumAvailableInCountry(props.runtimeData)
    ? getPeriodicalPremiumSubscribeLink(props.runtimeData, "yearly")
    : null;
  const todaysDate = new Date();
  const expiryDate = new Date("December 31, 2023");
  const isPastExpiry = todaysDate > expiryDate;
  const gaHolidayBannerViewPing = useGaViewPing({
    category: "Holiday Promotion Banner 2023",
    label: "holiday-promo-banner-view",
  });
  const gaHolidayBannerBtnPing = () => {
    gaEvent({
      category: "Holiday Promotion Banner 2023",
      action: "Engage",
      label: "holiday-promo-banner-get-one-year-btn",
    });
  };

  if (
    props.isLoading ||
    !subscribeLink ||
    (props.profile && router.pathname !== "/premium") ||
    isPastExpiry
  ) {
    return null;
  }

  const utmParams =
    "&utm_source=fx-relay&utm_medium=banner&utm_content=holiday-promo-banner-cta&utm_campaign=relay-holiday-promo-2023";
  const subscriberLinkWithCoupon = `${subscribeLink}&coupon=${coupon}${utmParams}`;

  return (
    <aside className={styles.wrapper}>
      <div className={styles["left-promo-container"]}>
        <div className={styles["promo-container"]}>
          <p className={styles["promo-text"]}>
            {l10n.getString("holiday-promo-banner-protect-inbox")}
          </p>
          <p className={styles["promo-text-bolded"]}>
            {l10n.getString("holiday-promo-banner-code-desc")}
          </p>
        </div>
        <div className={styles["promo-container"]}>
          <Localized
            id="holiday-promo-banner-code-usage"
            vars={{ couponCode: coupon }}
            elems={{
              coupon: <span className={styles["promo-text-bolded"]} />,
            }}
          >
            <p className={styles["promo-text"]} />
          </Localized>
        </div>
      </div>
      <div className={styles["promo-container"]}>
        <Link
          ref={gaHolidayBannerViewPing}
          onClick={gaHolidayBannerBtnPing}
          href={subscriberLinkWithCoupon}
          className={styles["cta-button"]}
        >
          {l10n.getString("holiday-promo-banner-cta-button")}
        </Link>
        <small className={styles["promo-code-expiry"]}>
          {l10n.getString("holiday-promo-banner-promo-expiry")}
        </small>
      </div>
    </aside>
  );
};

1	import Link from "next/link";	7✔
2	import { useRouter } from "next/router";	7✔
3	import { useL10n } from "../../../hooks/l10n";	7✔
4	import { Localized } from "../../Localized";	7✔
5	import styles from "./HolidayPromoBanner.module.scss";	7✔
6	import { RuntimeData } from "../../../hooks/api/runtimeData";
7	import {
8	getPeriodicalPremiumSubscribeLink,
9	isPeriodicalPremiumAvailableInCountry,
10	} from "../../../functions/getPlan";	7✔
11	import { ProfileData } from "../../../hooks/api/profile";
12	import { useGaEvent } from "../../../hooks/gaEvent";	7✔
13	import { useGaViewPing } from "../../../hooks/gaViewPing";	7✔
14
15	type Props = {
16	isLoading: boolean;
17	profile?: ProfileData;
18	runtimeData?: RuntimeData;
19	};
20
21	export const HolidayPromoBanner = (props: Props) => {	7✔
22	const l10n = useL10n();	×
23	const gaEvent = useGaEvent();	×
24	const router = useRouter();	×
25	const coupon = "HOLIDAY20";	×
26	const subscribeLink = isPeriodicalPremiumAvailableInCountry(props.runtimeData)	×
27	? getPeriodicalPremiumSubscribeLink(props.runtimeData, "yearly")
28	: null;
29	const todaysDate = new Date();	×
30	const expiryDate = new Date("December 31, 2023");	×
31	const isPastExpiry = todaysDate > expiryDate;	×
32	const gaHolidayBannerViewPing = useGaViewPing({	×
33	category: "Holiday Promotion Banner 2023",
34	label: "holiday-promo-banner-view",
35	});
36	const gaHolidayBannerBtnPing = () => {	×
37	gaEvent({	×
38	category: "Holiday Promotion Banner 2023",
39	action: "Engage",
40	label: "holiday-promo-banner-get-one-year-btn",
41	});
42	};
43
44	if (	×
45	props.isLoading \|\|	×
46	!subscribeLink \|\|
47	(props.profile && router.pathname !== "/premium") \|\|
48	isPastExpiry
49	) {
50	return null;	×
51	}
52
53	const utmParams =
54	"&utm_source=fx-relay&utm_medium=banner&utm_content=holiday-promo-banner-cta&utm_campaign=relay-holiday-promo-2023";	×
55	const subscriberLinkWithCoupon = `${subscribeLink}&coupon=${coupon}${utmParams}`;	×
56
57	return (
58	<aside className={styles.wrapper}>
59	<div className={styles["left-promo-container"]}>
60	<div className={styles["promo-container"]}>
61	<p className={styles["promo-text"]}>
62	{l10n.getString("holiday-promo-banner-protect-inbox")}
63	</p>
64	<p className={styles["promo-text-bolded"]}>
65	{l10n.getString("holiday-promo-banner-code-desc")}
66	</p>
67	</div>
68	<div className={styles["promo-container"]}>
69	<Localized
70	id="holiday-promo-banner-code-usage"
71	vars={{ couponCode: coupon }}
72	elems={{
73	coupon: <span className={styles["promo-text-bolded"]} />,
74	}}
75	>
76	<p className={styles["promo-text"]} />
77	</Localized>
78	</div>
79	</div>
80	<div className={styles["promo-container"]}>
81	<Link
82	ref={gaHolidayBannerViewPing}
83	onClick={gaHolidayBannerBtnPing}
84	href={subscriberLinkWithCoupon}
85	className={styles["cta-button"]}
86	>
87	{l10n.getString("holiday-promo-banner-cta-button")}
88	</Link>
89	<small className={styles["promo-code-expiry"]}>
90	{l10n.getString("holiday-promo-banner-promo-expiry")}
91	</small>
92	</div>
93	</aside>
94	);
95	};

mozilla / fx-private-relay / 4c534662-b940-406d-bbfc-64eb567191d8

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous