chore: move toggle func to store

JaneliaSciComp · Jul 31, 2024 · 5aa1739 · 5aa1739
1 parent 7f22452
commit 5aa1739
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/src/components/projects/FilterMenu.jsx b/src/components/projects/FilterMenu.jsx
@@ -1,7 +1,10 @@
 import { useState, useEffect } from "react";
 import { useStore } from "@nanostores/react";
 import { TbMinus, TbPlus, TbX } from "react-icons/tb";
-import { isFilterMenuVisible } from "../../stores/isFilterMenuVisibleStore.js";
+import {
+  isFilterMenuVisible,
+  toggleVisibility,
+} from "../../stores/isFilterMenuVisibleStore.js";
 import {
   selectedTags,
   handleTagSelection,
@@ -55,7 +58,7 @@ export default function FilterMenu({ uniqueTags }) {
     >
       <button
         className="md:hidden self-end m-2 btn-secondary rounded-full"
-        onClick={() => isFilterMenuVisible.set(!$isFilterMenuVisible)}
+        onClick={() => toggleVisibility}
       >
         <TbX />
       </button>

diff --git a/src/stores/isFilterMenuVisibleStore.js b/src/stores/isFilterMenuVisibleStore.js
@@ -1,3 +1,8 @@
 import { atom } from "nanostores";
 
 export const isFilterMenuVisible = atom(false);
+
+export function toggleVisibility() {
+  const prevVisbility = isFilterMenuVisible.get();
+  isFilterMenuVisible.set(!prevVisbility);
+}