feat(ui): add Mutelist menu item under Configuration (#8444)

Co-authored-by: Alejandro Bailo <59607668+alejandrobailo@users.noreply.github.com>
Co-authored-by: alejandrobailo <alejandrobailo94@gmail.com>

ui/store/index.ts

@@ -1 +1 @@
-export * from "./ui/ui-store";
+export * from "./ui/store";

ui/store/ui/store-initializer.tsx

@@ -0,0 +1,27 @@
+"use client";
+
+import { useEffect } from "react";
+
+import { useUIStore } from "@/store/ui/store";
+
+interface StoreInitializerProps {
+  values: {
+    hasProviders?: boolean;
+    // Add more properties here as needed
+    // otherProperty?: string;
+  };
+}
+
+export function StoreInitializer({ values }: StoreInitializerProps) {
+  const setHasProviders = useUIStore((state) => state.setHasProviders);
+
+  useEffect(() => {
+    // Initialize store values from server
+    if (values.hasProviders !== undefined) {
+      setHasProviders(values.hasProviders);
+    }
+    // Add more setters here as needed in the future
+  }, [values.hasProviders, setHasProviders]);
+
+  return null;
+}

ui/store/ui/store.ts

@@ -0,0 +1,32 @@
+import { create } from "zustand";
+import { persist } from "zustand/middleware";
+
+interface UIStoreState {
+  isSideMenuOpen: boolean;
+  isMutelistModalOpen: boolean;
+  hasProviders: boolean;
+
+  openSideMenu: () => void;
+  closeSideMenu: () => void;
+  openMutelistModal: () => void;
+  closeMutelistModal: () => void;
+  setHasProviders: (value: boolean) => void;
+}
+
+export const useUIStore = create<UIStoreState>()(
+  persist(
+    (set) => ({
+      isSideMenuOpen: false,
+      isMutelistModalOpen: false,
+      hasProviders: false,
+      openSideMenu: () => set({ isSideMenuOpen: true }),
+      closeSideMenu: () => set({ isSideMenuOpen: false }),
+      openMutelistModal: () => set({ isMutelistModalOpen: true }),
+      closeMutelistModal: () => set({ isMutelistModalOpen: false }),
+      setHasProviders: (value: boolean) => set({ hasProviders: value }),
+    }),
+    {
+      name: "ui-store",
+    },
+  ),
+);

ui/store/ui/ui-store.ts

@@ -1,22 +0,0 @@
-import { create } from "zustand";
-import { persist } from "zustand/middleware";
-
-interface SidebarStoreState {
-  isSideMenuOpen: boolean;
-
-  openSideMenu: () => void;
-  closeSideMenu: () => void;
-}
-
-export const useUIStore = create<SidebarStoreState>()(
-  persist(
-    (set) => ({
-      isSideMenuOpen: false,
-      openSideMenu: () => set({ isSideMenuOpen: true }),
-      closeSideMenu: () => set({ isSideMenuOpen: false }),
-    }),
-    {
-      name: "sidebar-store",
-    },
-  ),
-);