MPP-4444 - feat(relay-dashboard): remove Pocket option from Bento menu

Author: vpremamozilla

METRICS.md

@@ -756,7 +756,6 @@ The Google Analytics events:
   - `eventLabel`: One of:
     - `vpn` (Mozilla VPN)
     - `moz-monitor` (Mozilla Monitor)
-    - `pocket` (Pocket)
     - `fx-desktop` (Firefox for Desktop)
     - `fx-mobile` (Firefox for Mobile)
 - The user clicks the "Made by Mozilla" link in the bento menu.

frontend/src/components/layout/navigation/AppPicker.tsx

@@ -20,7 +20,6 @@ import { AriaMenuItemProps, AriaMenuOptions } from "@react-aria/menu";
 import styles from "./AppPicker.module.scss";
 import FirefoxLogo from "../images/fx.png";
 import MonitorLogo from "../images/monitor.png";
-import PocketLogo from "../images/pocket.png";
 import VpnLogo from "../images/vpn.svg";
 import FxDesktopLogo from "../images/fx-logo.svg";
 import FxMobileLogo from "../images/fx-mobile.png";
@@ -40,11 +39,6 @@ const getProducts = (referringSiteUrl: string) => ({
     )}&utm_medium=referral&utm_campaign=bento&utm_content=desktop&prompt=none`,
     gaLabel: "moz-monitor",
   },
-  pocket: {
-    id: "pocket",
-    url: "https://app.adjust.com/hr2n0yz?engagement_type=fallback_click&fallback=https%3A%2F%2Fgetpocket.com%2Ffirefox_learnmore%3Fsrc%3Dff_bento&fallback_lp=https%3A%2F%2Fapps.apple.com%2Fapp%2Fpocket-save-read-grow%2Fid309601447",
-    gaLabel: "pocket",
-  },
   fxDesktop: {
     id: "fxDesktop",
     url: `https://www.mozilla.org/firefox/new/?utm_source=${encodeURIComponent(
@@ -90,7 +84,6 @@ export const AppPicker = (props: Props) => {
     RefObject<HTMLAnchorElement | null>
   > = {
     monitor: useRef<HTMLAnchorElement>(null),
-    pocket: useRef<HTMLAnchorElement>(null),
     fxDesktop: useRef<HTMLAnchorElement>(null),
     fxMobile: useRef<HTMLAnchorElement>(null),
     vpn: useRef<HTMLAnchorElement>(null),
@@ -147,18 +140,6 @@ export const AppPicker = (props: Props) => {
           {l10n.getString("moz-monitor")}
         </a>
       </Item>
-      <Item key={products.pocket.id} textValue={l10n.getString("fx-pocket")}>
-        <a
-          ref={linkRefs.pocket}
-          href={products.pocket.url}
-          className={`${styles["menu-link"]} ${styles["pocket-link"]}`}
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          <Image src={PocketLogo} alt="" width={16} height={16} />
-          {l10n.getString("fx-pocket")}
-        </a>
-      </Item>
       <Item
         key={products.fxDesktop.id}
         textValue={l10n.getString("fx-desktop-2")}