Added filter by official.

ether · Nov 12, 2024 · d4b7fd7 · d4b7fd7
1 parent 3e6ea97
commit d4b7fd7
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 8 deletions.
diff --git a/app/plugins/page.tsx b/app/plugins/page.tsx
@@ -9,7 +9,7 @@ import {PluginsList} from "../../src/pagesToDisplay/PluginsList";
 import {PluginsFooter} from "../../src/pagesToDisplay/PluginsFooter";
 
 
-const productionURL = "https://static.etherpad.org"
+const productionURL = ""//"https://static.etherpad.org"
 
 export default function PluginViewer() {
 

diff --git a/src/pagesToDisplay/PluginViewerHeader.tsx b/src/pagesToDisplay/PluginViewerHeader.tsx
@@ -26,13 +26,11 @@ export const PluginViewerHeader = ()=> {
         </div>
         <h2 className="text-3xl text-primary">Plugins ({plugins?.list.length})</h2>
         <div className="flex gap-5 border-t-[1px] border-b-[1px] border-gray-600 pt-2 pb-2">
-            <span>
-                <Checkbox className="text-white bg-primary data-[state=checked]:bg-primary" checked={pluginData?.filterOfficial}
+                <Checkbox className="text-white bg-primary data-[state=checked]:bg-primary border-none self-center" checked={pluginData?.filterOfficial}
                           onCheckedChange={() => setOfficalOnly(!pluginData?.filterOfficial)} id="c1"/>
                 <label className="text-white ml-2 mt-auto text-2xl" htmlFor="c1">
                     Only official plugins
                 </label>
-            </span>
             <span className="text-white mt-auto text-2xl">Sort by:</span>
             <Select onValueChange={(v: string) => {
                 setSortKey(v);

diff --git a/src/store/store.ts b/src/store/store.ts
@@ -215,10 +215,31 @@ export const useUIStore = create<StoreType>((set, getState) => ({
     },
     currentPage: 0,
     setCurrentPage: (currentPage: number) => set({currentPage}),
-    setOfficialOnly: (officialOnly: boolean) => set({pluginData: {
-        ...getState().pluginData!,
-        filterOfficial: officialOnly
-        }}),
+    setOfficialOnly: (officialOnly: boolean) => {
+        console.log('officialOnly', officialOnly)
+        if (officialOnly) {
+            const filteredPlugins = getState().filteredPlugins.flat(1).filter((plugin) => {
+                return plugin.official
+            })
+            const chunkSize = 30;
+            const chunks = [];
+            for (let i = 0; i < filteredPlugins!.length; i += chunkSize) {
+                const chunk = filteredPlugins!.slice(i, i + chunkSize);
+                chunks.push(chunk);
+            }
+            set({
+                filteredPlugins: chunks
+            })
+        }
+
+
+        set({
+            pluginData: {
+                ...getState().pluginData!,
+                filterOfficial: officialOnly
+            }
+        })
+    },
     setSortKey: (sortKey: string) => {
         const newList = getState().filteredPlugins.flat(1).toSorted((a,b)=> {
             if (sortKey === 'newest') {