import React, { useState, FC, useContext } from "react";

export interface UserContextInterface {
  user?: User;
  isAuthenticated: boolean;
  login: (user: User) => void;
  logout: () => void;
  updateUser: (user: User) => void;
}

export interface UserContextAuthenticatedInterface
  extends UserContextInterface {
  user: User;
}

export const UserContext = React.createContext<UserContextInterface>({
  isAuthenticated: false,
  login: () => {},
  logout: () => {},
  updateUser: () => {},
});

const updateIfChanged = (user: User, newUser: Omit<User, "id">) =>
  (Object.keys(newUser) as Array<keyof Omit<User, "id">>).some(
    (key) => user[key] !== newUser[key]
  );

const UserContextProvider: FC = ({ children }) => {
  const [user, setUser] = useState<User>();
  const [isAuthenticated, setIsAuthenticated] = useState(false);

  const login = (user: User) => {
    setIsAuthenticated(true);
    setUser(user);
  };

  const logout = () => {
    setIsAuthenticated(false);
    setUser(undefined);
  };

  const updateUser = ({ id, ...newData }: User) => {
    if (user && updateIfChanged(user, newData)) {
      setUser({
        ...newData,
        id: typeof id === "string" ? parseInt(id) : id,
      });
    }
  };

  return (
    <UserContext.Provider
      value={{ user, login, logout, updateUser, isAuthenticated }}
    >
      {children}
    </UserContext.Provider>
  );
};

export const useAuth = () => useContext(UserContext);

export default UserContextProvider;