From 34c3ae46ed7cd387d9422886b4020c764c2dd72b Mon Sep 17 00:00:00 2001 From: harbassan <84175605+harbassan@users.noreply.github.com> Date: Sun, 24 Mar 2024 01:08:26 +1300 Subject: [PATCH] feat: add more module filters (#5) * feat: add show/hide lib modules toggle * feat: lib tag * feat: add enabled filter --------- Co-authored-by: Delusoire <71462480+Delusoire@users.noreply.github.com> --- src/pages/Marketplace.js | 68 +++++++++++++++++++++++++---------- src/pages/Marketplace.tsx | 34 +++++++++++------- src/resources/locales/en.json | 4 ++- src/settings.js | 5 +++ src/settings.ts | 3 ++ 5 files changed, 81 insertions(+), 33 deletions(-) create mode 100644 src/settings.js create mode 100644 src/settings.ts diff --git a/src/pages/Marketplace.js b/src/pages/Marketplace.js index 4a6ce40e..e0588d06 100644 --- a/src/pages/Marketplace.js +++ b/src/pages/Marketplace.js @@ -6,6 +6,7 @@ import { Module } from "/hooks/module.js"; import { fetchJSON } from "/hooks/util.js"; import ModuleCard from "../components/ModuleCard/index.js"; import { settingsButton } from "../../index.js"; +import { CONFIG } from "../settings.js"; import { getProp, useChipFilter, useDropdown, useSearchBar } from "/modules/Delusoire/stdlib/lib/components/index.js"; const cachedMetaURLs = new Map(); export const fetchMetaURLSync = (metaURL)=>cachedMetaURLs.get(metaURL); @@ -98,34 +99,63 @@ const SortFns = { "z-a": (a, b)=>a.name > b.name ? 1 : b.name > a.name ? -1 : 0, random: ()=>Math.random() - 0.5 }; -const filters = { - "": undefined, - themes: { - "": t("filter.themes") - }, - apps: { - "": t("filter.apps") - }, - extensions: { - "": t("filter.extensions") - }, - snippets: { - "": t("filter.snippets") +const enabled = { + enabled: { + "": t("filter.enabled") + } +}; +const getFilters = ()=>({ + "": null, + themes: { + "": t("filter.themes"), + ...enabled + }, + extensions: { + "": t("filter.extensions"), + ...enabled + }, + apps: { + "": t("filter.apps"), + ...enabled + }, + snippets: { + "": t("filter.snippets"), + ...enabled + }, + libs: { + "": CONFIG.showLibs && t("filter.libs") + } + }); +const isModLib = (mod)=>_.intersection(mod.metadata.tags, [ + "lib", + "npm", + "internal" + ]).length > 0; +const enabledFn = { + enabled: { + "": (mod)=>Module.registry.get(mod.identifier).isEnabled() } }; const filterFNs = { - "": ()=>true, + "": (mod)=>CONFIG.showLibs || !isModLib(mod), themes: { - "": (mod)=>mod.metadata.tags.includes("theme") + "": (mod)=>mod.metadata.tags.includes("theme"), + ...enabledFn }, apps: { - "": (mod)=>mod.metadata.tags.includes("app") + "": (mod)=>mod.metadata.tags.includes("app"), + ...enabledFn }, extensions: { - "": (mod)=>mod.metadata.tags.includes("extension") + "": (mod)=>mod.metadata.tags.includes("extension"), + ...enabledFn }, snippets: { - "": (mod)=>mod.metadata.tags.includes("snippets") + "": (mod)=>mod.metadata.tags.includes("snippet"), + ...enabledFn + }, + libs: { + "": isModLib } }; export default function() { @@ -138,7 +168,7 @@ export default function() { options: SortOptions }); const sortFn = SortFns[sortOption]; - const [chipFilter, selectedFilters] = useChipFilter(filters); + const [chipFilter, selectedFilters] = useChipFilter(getFilters()); const selectedFilterFNs = selectedFilters.map(({ key })=>getProp(filterFNs, key)); const identifiersToMetadataURLsLists = React.useMemo(()=>{ const localModules = Module.getModules(); diff --git a/src/pages/Marketplace.tsx b/src/pages/Marketplace.tsx index 937970cd..9afd9005 100644 --- a/src/pages/Marketplace.tsx +++ b/src/pages/Marketplace.tsx @@ -6,6 +6,7 @@ import { type Metadata, Module } from "/hooks/module.js"; import { fetchJSON } from "/hooks/util.js"; import ModuleCard from "../components/ModuleCard/index.js"; import { settingsButton } from "../../index.js"; +import { CONFIG } from "../settings.js"; import { getProp, useChipFilter, useDropdown, useSearchBar } from "/modules/Delusoire/stdlib/lib/components/index.js"; const cachedMetaURLs = new Map(); @@ -107,20 +108,27 @@ const SortFns: Record nu random: () => Math.random() - 0.5, }; -const filters = { - "": undefined, - themes: { "": t("filter.themes") }, - apps: { "": t("filter.apps") }, - extensions: { "": t("filter.extensions") }, - snippets: { "": t("filter.snippets") }, -}; +const enabled = { enabled: { "": t("filter.enabled") } }; + +const getFilters = () => ({ + "": null, + themes: { "": t("filter.themes"), ...enabled }, + extensions: { "": t("filter.extensions"), ...enabled }, + apps: { "": t("filter.apps"), ...enabled }, + snippets: { "": t("filter.snippets"), ...enabled }, + libs: { "": CONFIG.showLibs && t("filter.libs") }, +}); + +const isModLib = (mod: Metadata) => _.intersection(mod.metadata.tags, ["lib", "npm", "internal"]).length > 0; +const enabledFn = { enabled: { "": mod => Module.registry.get(mod.identifier).isEnabled() } }; const filterFNs = { - "": () => true, - themes: { "": mod => mod.metadata.tags.includes("theme") }, - apps: { "": mod => mod.metadata.tags.includes("app") }, - extensions: { "": mod => mod.metadata.tags.includes("extension") }, - snippets: { "": mod => mod.metadata.tags.includes("snippets") }, + "": mod => CONFIG.showLibs || !isModLib(mod), + themes: { "": mod => mod.metadata.tags.includes("theme"), ...enabledFn }, + apps: { "": mod => mod.metadata.tags.includes("app"), ...enabledFn }, + extensions: { "": mod => mod.metadata.tags.includes("extension"), ...enabledFn }, + snippets: { "": mod => mod.metadata.tags.includes("snippet"), ...enabledFn }, + libs: { "": isModLib }, }; export default function () { @@ -131,7 +139,7 @@ export default function () { const [sortbox, sortOption] = useDropdown({ options: SortOptions }); const sortFn = SortFns[sortOption]; - const [chipFilter, selectedFilters] = useChipFilter(filters); + const [chipFilter, selectedFilters] = useChipFilter(getFilters()); const selectedFilterFNs = selectedFilters.map(({ key }) => getProp(filterFNs, key)); const identifiersToMetadataURLsLists = React.useMemo(() => { diff --git a/src/resources/locales/en.json b/src/resources/locales/en.json index e3bda36a..df395532 100644 --- a/src/resources/locales/en.json +++ b/src/resources/locales/en.json @@ -27,7 +27,9 @@ "themes": "Themes", "apps": "Apps", "extensions": "Extensions", - "snippets": "Snippets" + "snippets": "Snippets", + "libs": "Libraries", + "enabled": "Enabled" } } } diff --git a/src/settings.js b/src/settings.js new file mode 100644 index 00000000..1fa45c65 --- /dev/null +++ b/src/settings.js @@ -0,0 +1,5 @@ +import { settings } from "../index.js"; +export const CONFIG = settings.addToggle({ + id: "showLibs", + desc: "Show Libraries" +}, ()=>false).finalize().cfg; diff --git a/src/settings.ts b/src/settings.ts new file mode 100644 index 00000000..b91a8336 --- /dev/null +++ b/src/settings.ts @@ -0,0 +1,3 @@ +import { settings } from "../index.js"; + +export const CONFIG = settings.addToggle({ id: "showLibs", desc: "Show Libraries" }, () => false).finalize().cfg;