No Recommended: Split recommended blogs sidebar preference (#983)

Co-authored-by: April Sylph <28949509+AprilSylph@users.noreply.github.com>

src/scripts/no_recommended.json

@@ -39,6 +39,12 @@
       "default": false,
       "inherit": "tweaks.preferences.hide_recommended_blogs"
     },
+    "hide_recommended_blogs_modal": {
+      "type": "checkbox",
+      "label": "Hide recommended blogs in the blog view sidebar",
+      "default": false,
+      "inherit": "no_recommended.preferences.hide_recommended_blogs"
+    },
     "hide_radar": {
       "type": "checkbox",
       "label": "Hide the Tumblr Radar",

src/scripts/no_recommended/hide_recommended_blogs.js

@@ -1,7 +1,7 @@
 import { keyToCss } from '../../util/css_map.js';
 import { pageModifications } from '../../util/mutations.js';
 import { translate } from '../../util/language_data.js';
-import { buildStyle } from '../../util/interface.js';
+import { blogViewSelector, buildStyle } from '../../util/interface.js';
 
 const hiddenAttribute = 'data-no-recommended-blogs-hidden';
 
@@ -13,13 +13,16 @@ const hideDashboardRecommended = function (sidebarTitles) {
     .forEach(h1 => h1.closest('aside > *').setAttribute(hiddenAttribute, ''));
 };
 
-const hideTagPageRecommended = topBlogsLists => topBlogsLists.forEach(ul => ul.setAttribute(hiddenAttribute, ''));
+const hideTagPageRecommended = blogsLists =>
+  blogsLists
+    .filter(ul => !ul.matches(blogViewSelector))
+    .forEach(ul => ul.parentNode.setAttribute(hiddenAttribute, ''));
 
 export const main = async function () {
   pageModifications.register('aside h1', hideDashboardRecommended);
 
-  const topBlogsSelector = `${keyToCss('desktopContainer')} > ${keyToCss('recommendedBlogs')}`;
-  pageModifications.register(topBlogsSelector, hideTagPageRecommended);
+  const blogsListSelector = `${keyToCss('desktopContainer')} > ${keyToCss('recommendedBlogs')}`;
+  pageModifications.register(blogsListSelector, hideTagPageRecommended);
 
   document.documentElement.append(styleElement);
 };

src/scripts/no_recommended/hide_recommended_blogs_modal.js

@@ -0,0 +1,25 @@
+import { keyToCss } from '../../util/css_map.js';
+import { pageModifications } from '../../util/mutations.js';
+import { blogViewSelector, buildStyle } from '../../util/interface.js';
+
+const hiddenAttribute = 'data-no-recommended-blogs-modal-hidden';
+
+const styleElement = buildStyle(`[${hiddenAttribute}] { display: none; }`);
+
+const hideModalRecommended = blogsLists =>
+  blogsLists
+    .filter(ul => ul.matches(blogViewSelector))
+    .forEach(ul => ul.parentNode.setAttribute(hiddenAttribute, ''));
+
+export const main = async function () {
+  const blogsListSelector = `${keyToCss('desktopContainer')} > ${keyToCss('recommendedBlogs')}`;
+  pageModifications.register(blogsListSelector, hideModalRecommended);
+
+  document.documentElement.append(styleElement);
+};
+
+export const clean = async function () {
+  pageModifications.unregister(hideModalRecommended);
+  styleElement.remove();
+  $(`[${hiddenAttribute}]`).removeAttr(hiddenAttribute);
+};

src/util/preferences.js

@@ -23,7 +23,6 @@ export const getPreferences = async function (scriptName) {
         const inheritedDefault = storage[preference.inherit];
         if (inheritedDefault !== undefined) {
           preference.default = inheritedDefault;
-          browser.storage.local.remove(preference.inherit);
         }
       }