refactor

frontend/src/sidebar/SidebarContext.tsx

@@ -1,6 +1,4 @@
 import React, {
-  createContext,
-  useContext,
   useMemo,
   useState,
   useCallback,
@@ -15,6 +13,7 @@ import {
   THEME_MODES,
   THEME_STORAGE_KEY,
 } from '../constants/sidebar';
+import { createSafeContext } from '../utils/createSafeContext';
 
 interface SidebarContextValue {
   collapsed: boolean;
@@ -33,7 +32,7 @@ interface SidebarContextValue {
 
 type ThemeMode = (typeof THEME_MODES)[number];
 
-const SidebarContext = createContext<SidebarContextValue | null>(null);
+const [SidebarContext, useSidebarContext] = createSafeContext<SidebarContextValue>('Sidebar');
 
 const loadInitialThemeSettings = () => {
   const defaults = {
@@ -288,10 +287,4 @@ export const SidebarProvider = ({ initialCollapsed = false, children }) => {
   return <SidebarContext.Provider value={contextValue}>{children}</SidebarContext.Provider>;
 };
 
-export const useSidebarContext = () => {
-  const context = useContext(SidebarContext);
-  if (!context) {
-    throw new Error('useSidebarContext must be used within a SidebarProvider');
-  }
-  return context;
-};
+export { useSidebarContext };