import { useState, useEffect } from 'react';

/**
 * 사용자 역할을 관리하는 최적화된 훅
 * localStorage 변경 감지 및 자동 업데이트
 */
export function useUserRole() {
  const [userRole, setUserRole] = useState<string>(() => {
    const userDataStr = localStorage.getItem("user");
    const userData = userDataStr ? JSON.parse(userDataStr) : null;
    return userData?.role || "CEO";
  });

  useEffect(() => {
    const handleStorageChange = () => {
      const userDataStr = localStorage.getItem("user");
      const userData = userDataStr ? JSON.parse(userDataStr) : null;
      const newRole = userData?.role || "CEO";
      setUserRole(newRole);
    };

    // Listen to custom storage event
    window.addEventListener('storage', handleStorageChange);
    // Listen to custom role change event
    window.addEventListener('roleChanged', handleStorageChange);

    return () => {
      window.removeEventListener('storage', handleStorageChange);
      window.removeEventListener('roleChanged', handleStorageChange);
    };
  }, []);

  return userRole;
}