task_1_fsd/src/features/authRouting/AuthProvider.tsx - task6 - Percival/reactJS_course

task_1_fsd/src/features/authRouting/AuthProvider.tsx
89 строк2 KB
Rituparn
Added the sixth task
08 ноя 2025, 14:11
08 ноя 2025, 14:11baae17a
import { useState, useEffect, type ReactNode } from 'react';
import { AuthContext, type User } from './authContext';

interface AuthProviderProps {
  children: ReactNode;
}

export const AuthProvider = ({ children }: AuthProviderProps) => {
  const [user, setUser] = useState<User | null>(null);
  const [token, setToken] = useState<string | null>(null);
  const [isLoading, setIsLoading] = useState(true);

  useEffect(() => {
    const storedToken = localStorage.getItem('authToken');

    if (storedToken) {
      fetchUserData(storedToken);
    } else {
      setIsLoading(false);
    }
  }, []);

  const fetchUserData = async (authToken: string) => {
    try {
      const response = await fetch('https://api.v2.react-learning.ru/users/me', {
        headers: {
          'Authorization': `Bearer ${authToken}`,
        },
      });

      if (response.ok) {
        const responseData = await response.json();
        console.log('Raw user data from API:', responseData);

        let userData: User;

        if (responseData && responseData.data) {

          userData = responseData.data;
        } else if (responseData && responseData.user) {
          userData = responseData.user;
        } else {
          userData = responseData;
        }

        console.log('Processed user data:', userData);

        if (!userData.name || !userData.email || !userData._id) {
          console.warn('User data is missing required fields:', userData);
        }

        setUser(userData);
        setToken(authToken);
      } else {
        console.error('Failed to fetch user data, status:', response.status);
        localStorage.removeItem('authToken');
        setToken(null);
        setUser(null);
      }
    } catch (error) {
      console.error('Error fetching user data:', error);
      localStorage.removeItem('authToken');
      setToken(null);
      setUser(null);
    } finally {
      setIsLoading(false);
    }
  };

  const login = (newToken: string, userData: User) => {
    localStorage.setItem('authToken', newToken);
    setToken(newToken);
    setUser(userData);
    console.log('User logged in:', userData);
  };

  const logout = () => {
    localStorage.removeItem('authToken');
    setToken(null);
    setUser(null);
    console.log('User logged out');
  };

  return (
    <AuthContext.Provider value={{ user, token, login, logout, isLoading }}>
      {children}
    </AuthContext.Provider>
  );
};