memberProvider.tsx 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. 'use client';
  2. import { createContext, useContext, useState, useEffect } from 'react';
  3. import { Member } from '@/types/account/member';
  4. import { useAuthContext } from '@/contexts/authProvider';
  5. const MemberContext = createContext<{
  6. member: Member|null;
  7. setMember: (member: Member|null) => void;
  8. isLoaded: boolean;
  9. }>({
  10. member: null,
  11. setMember: () => {},
  12. isLoaded: false,
  13. });
  14. export function MemberProvider({ children, initialMember }: { children: React.ReactNode; initialMember?: Member|null }) {
  15. const [member, setMember] = useState<Member|null>(initialMember ?? null);
  16. const [isLoaded, setLoaded] = useState<boolean>(initialMember !== undefined);
  17. const {isLoading, isAuthenticated } = useAuthContext();
  18. // 서버에서 내려온 initialMember를 localStorage에 동기화 (source of truth = 서버)
  19. useEffect(() => {
  20. if (initialMember) {
  21. localStorage.setItem('member', JSON.stringify(initialMember));
  22. }
  23. }, [initialMember]);
  24. // 로그인된 회원 정보 조회
  25. useEffect(() => {
  26. if (isLoading) {
  27. return;
  28. }
  29. const storedMember = localStorage.getItem("member");
  30. if (isAuthenticated && storedMember) {
  31. setMember(JSON.parse(storedMember));
  32. } else {
  33. setMember(null);
  34. }
  35. setLoaded(true);
  36. }, [isLoading, isAuthenticated]);
  37. return (
  38. <MemberContext.Provider value={{ member, setMember, isLoaded }}>
  39. {children}
  40. </MemberContext.Provider>
  41. );
  42. }
  43. export function useMemberContext() {
  44. return useContext(MemberContext);
  45. }