feat(snippets): hide installed snippets if option is enabled (#777)

Author: zhngharry

src/components/Grid.tsx

@@ -489,7 +489,7 @@ class Grid extends React.Component<
 
     // Load blacklist and snippets
     this.BLACKLIST = await getBlacklist();
-    this.SNIPPETS = await fetchCssSnippets();
+    this.SNIPPETS = await fetchCssSnippets(this.CONFIG.visual.hideInstalled);
     this.newRequest(ITEMS_PER_REQUEST);
   }
 

src/logic/FetchRemotes.ts

@@ -303,7 +303,7 @@ export const getBlacklist = async () => {
  * It fetches the snippets.json file from the Github repository and returns it as an array of snippets.
  * @returns Array of snippets
  */
-export const fetchCssSnippets = async () => {
+export const fetchCssSnippets = async (hideInstalled = false) => {
   const snippetsJSON = (await fetch(SNIPPETS_URL)
     .then((res) => res.json())
     .catch(() => [])) as Snippet[];
@@ -318,8 +318,13 @@ export const fetchCssSnippets = async () => {
       snip.preview = undefined;
     }
 
-    accum.push(snip);
+    // Hide installed snippets if option is set and it's installed
+    if (!(hideInstalled && localStorage.getItem(`marketplace:installed:snippet:${snip.title.replaceAll(" ", "-")}`))) {
+      accum.push(snip);
+    }
+
     return accum;
   }, []);
+
   return snippets;
 };