Bug 1714461 - Remove Snippets Button From Personalize Panel on New Tab. r=prathiksha,fluent-reviewers,flod

Differential Revision: https://phabricator.services.mozilla.com/D116789
2021-06-24 18:47:31 +00:00 · 2021-06-24 18:47:31 +00:00 · d9dbcddd7a
--- a/browser/components/newtab/content-src/components/Base/Base.jsx
+++ b/browser/components/newtab/content-src/components/Base/Base.jsx
@ -189,7 +189,6 @@ export class BaseContent extends React.PureComponent {
    const enabledSections = {
      topSitesEnabled: prefs["feeds.topsites"],
      pocketEnabled: prefs["feeds.section.topstories"],
-      snippetsEnabled: prefs["feeds.snippets"],
      highlightsEnabled: prefs["feeds.section.highlights"],
      showSponsoredTopSitesEnabled: prefs.showSponsoredTopSites,
      showSponsoredPocketEnabled: prefs.showSponsored,
@ -214,7 +213,7 @@ export class BaseContent extends React.PureComponent {
      .join(" ");

    const hasSnippet =
-      enabledSections.snippetsEnabled &&
+      prefs["feeds.snippets"] &&
      this.props.adminContent &&
      this.props.adminContent.message &&
      this.props.adminContent.message.id;
--- a/browser/components/newtab/content-src/components/CustomizeMenu/ContentSection/ContentSection.jsx
+++ b/browser/components/newtab/content-src/components/CustomizeMenu/ContentSection/ContentSection.jsx
@ -41,7 +41,6 @@ export class ContentSection extends React.PureComponent {
      topSitesEnabled,
      pocketEnabled,
      highlightsEnabled,
-      snippetsEnabled,
      showSponsoredTopSitesEnabled,
      showSponsoredPocketEnabled,
      topSitesRowsCount,
@ -232,35 +231,6 @@ export class ContentSection extends React.PureComponent {
          </div>
        </div>

-        <div id="snippets-section" className="section">
-          <label className="switch">
-            <input
-              id="snippets-toggle"
-              checked={snippetsEnabled}
-              type="checkbox"
-              onChange={this.onPreferenceSelect}
-              preference="feeds.snippets"
-              aria-labelledby="custom-snippets-title"
-              aria-describedby="custom-snippets-subtitle"
-              eventSource="SNIPPETS"
-            />
-            <span className="slider" role="presentation"></span>
-          </label>
-          <div>
-            <h2 id="custom-snippets-title" className="title">
-              <label
-                htmlFor="snippets-toggle"
-                data-l10n-id="newtab-custom-snippets-title"
-              ></label>
-            </h2>
-            <p
-              id="custom-snippets-subtitle"
-              className="subtitle"
-              data-l10n-id="newtab-custom-snippets-subtitle"
-            />
-          </div>
-        </div>
-
        <span className="divider" role="separator"></span>

        <div>
--- a/browser/components/newtab/data/content/activity-stream.bundle.js
+++ b/browser/components/newtab/data/content/activity-stream.bundle.js
@ -728,7 +728,6 @@ class BaseContent extends react__WEBPACK_IMPORTED_MODULE_8___default.a.PureCompo
    const enabledSections = {
      topSitesEnabled: prefs["feeds.topsites"],
      pocketEnabled: prefs["feeds.section.topstories"],
-      snippetsEnabled: prefs["feeds.snippets"],
      highlightsEnabled: prefs["feeds.section.highlights"],
      showSponsoredTopSitesEnabled: prefs.showSponsoredTopSites,
      showSponsoredPocketEnabled: prefs.showSponsored,
@ -739,7 +738,7 @@ class BaseContent extends react__WEBPACK_IMPORTED_MODULE_8___default.a.PureCompo
      mayHaveSponsoredTopSites
    } = prefs;
    const outerClassName = ["outer-wrapper", isDiscoveryStream && pocketEnabled && "ds-outer-wrapper-search-alignment", isDiscoveryStream && "ds-outer-wrapper-breakpoint-override", prefs.showSearch && this.state.fixedSearch && !noSectionsEnabled && "fixed-search", prefs.showSearch && noSectionsEnabled && "only-search", prefs["logowordmark.alwaysVisible"] && "visible-logo", newNewtabExperienceEnabled && "newtab-experience"].filter(v => v).join(" ");
-    const hasSnippet = enabledSections.snippetsEnabled && this.props.adminContent && this.props.adminContent.message && this.props.adminContent.message.id;
+    const hasSnippet = prefs["feeds.snippets"] && this.props.adminContent && this.props.adminContent.message && this.props.adminContent.message.id;
    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement("div", null, canShowCustomizationMenu ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_8___default.a.createElement(content_src_components_CustomizeMenu_CustomizeMenu__WEBPACK_IMPORTED_MODULE_7__["CustomizeMenu"], {
      onClose: this.closeCustomizationMenu,
      onOpen: this.openCustomizationMenu,
@ -14553,7 +14552,6 @@ class ContentSection_ContentSection extends external_React_default.a.PureCompone
      topSitesEnabled,
      pocketEnabled,
      highlightsEnabled,
-      snippetsEnabled,
      showSponsoredTopSitesEnabled,
      showSponsoredPocketEnabled,
      topSitesRowsCount
@ -14706,33 +14704,6 @@ class ContentSection_ContentSection extends external_React_default.a.PureCompone
      id: "custom-recent-subtitle",
      className: "subtitle",
      "data-l10n-id": "newtab-custom-recent-subtitle"
-    }))), /*#__PURE__*/external_React_default.a.createElement("div", {
-      id: "snippets-section",
-      className: "section"
-    }, /*#__PURE__*/external_React_default.a.createElement("label", {
-      className: "switch"
-    }, /*#__PURE__*/external_React_default.a.createElement("input", {
-      id: "snippets-toggle",
-      checked: snippetsEnabled,
-      type: "checkbox",
-      onChange: this.onPreferenceSelect,
-      preference: "feeds.snippets",
-      "aria-labelledby": "custom-snippets-title",
-      "aria-describedby": "custom-snippets-subtitle",
-      eventSource: "SNIPPETS"
-    }), /*#__PURE__*/external_React_default.a.createElement("span", {
-      className: "slider",
-      role: "presentation"
-    })), /*#__PURE__*/external_React_default.a.createElement("div", null, /*#__PURE__*/external_React_default.a.createElement("h2", {
-      id: "custom-snippets-title",
-      className: "title"
-    }, /*#__PURE__*/external_React_default.a.createElement("label", {
-      htmlFor: "snippets-toggle",
-      "data-l10n-id": "newtab-custom-snippets-title"
-    })), /*#__PURE__*/external_React_default.a.createElement("p", {
-      id: "custom-snippets-subtitle",
-      className: "subtitle",
-      "data-l10n-id": "newtab-custom-snippets-subtitle"
    }))), /*#__PURE__*/external_React_default.a.createElement("span", {
      className: "divider",
      role: "separator"
--- a/browser/components/newtab/test/browser/browser_customize_menu_content.js
+++ b/browser/components/newtab/test/browser/browser_customize_menu_content.js
@ -7,15 +7,13 @@ test_newtab({
      ["browser.newtabpage.activity-stream.customizationMenu.enabled", true],
      ["browser.newtabpage.activity-stream.feeds.topsites", false],
      ["browser.newtabpage.activity-stream.feeds.section.topstories", false],
-      ["browser.newtabpage.activity-stream.feeds.section.highlights", false],
-      ["browser.newtabpage.activity-stream.feeds.snippets", false]
+      ["browser.newtabpage.activity-stream.feeds.section.highlights", false]
    );
  },
  test: async function test_render_customizeMenu() {
    const TOPSITES_PREF = "browser.newtabpage.activity-stream.feeds.topsites";
    const HIGHLIGHTS_PREF =
      "browser.newtabpage.activity-stream.feeds.section.highlights";
-    const SNIPPETS_PREF = "browser.newtabpage.activity-stream.feeds.snippets";
    const TOPSTORIES_PREF =
      "browser.newtabpage.activity-stream.feeds.section.topstories";

@ -110,30 +108,6 @@ test_newtab({
      content.document.querySelector("section[data-section-id='highlights']"),
      "Highlights section is rendered"
    );
-
-    // Test that clicking the snippets toggle will flip the snippets pref
-    // note: Snippets are disabled in tests.
-    let snippetsSwitch = content.document.querySelector(
-      "#snippets-section .switch"
-    );
-    Assert.ok(
-      !Services.prefs.getBoolPref(SNIPPETS_PREF),
-      "Snippets pref is turned off"
-    );
-
-    prefPromise = ContentTaskUtils.waitForCondition(
-      () => Services.prefs.getBoolPref(SNIPPETS_PREF),
-      "Snippets pref is turned on after click"
-    );
-    snippetsSwitch.click();
-    await prefPromise;
-
-    prefPromise = ContentTaskUtils.waitForCondition(
-      () => !Services.prefs.getBoolPref(SNIPPETS_PREF),
-      "Snippets pref is turned on after click"
-    );
-    snippetsSwitch.click();
-    await prefPromise;
  },
  async after() {
    Services.prefs.clearUserPref(
@ -151,9 +125,6 @@ test_newtab({
    Services.prefs.clearUserPref(
      "browser.newtabpage.activity-stream.feeds.section.highlights"
    );
-    Services.prefs.clearUserPref(
-      "browser.newtabpage.activity-stream.feeds.snippets"
-    );
  },
 });

--- a/browser/components/newtab/test/unit/content-src/components/CustomiseMenu.test.jsx
+++ b/browser/components/newtab/test/unit/content-src/components/CustomiseMenu.test.jsx
@ -68,9 +68,5 @@ describe("ContentSection", () => {
      wrapper.find("#highlights-toggle").prop("eventSource"),
      "HIGHLIGHTS"
    );
-    assert.equal(
-      wrapper.find("#snippets-toggle").prop("eventSource"),
-      "SNIPPETS"
-    );
  });
 });
--- a/browser/locales/en-US/browser/newtab/newtab.ftl
+++ b/browser/locales/en-US/browser/newtab/newtab.ftl
@ -256,11 +256,4 @@ newtab-custom-pocket-sponsored = Sponsored stories
 newtab-custom-recent-title = Recent activity
 newtab-custom-recent-subtitle = A selection of recent sites and content
 newtab-custom-close-button = Close
-
-# For the "Snippets" feature traditionally on about:home.
-# Alternative translation options: "Small Note" or something that
-# expresses the idea of "a small message, shortened from something else,
-# and non-essential but also not entirely trivial and useless.
-newtab-custom-snippets-title = Snippets
-newtab-custom-snippets-subtitle = Tips and news from { -vendor-short-name } and { -brand-product-name }
 newtab-custom-settings = Manage more settings