UserContext.tsx 1.5 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162
  1. import React, { useState, FC, useContext } from "react";
  2. export interface UserContextInterface {
  3. user?: User;
  4. isAuthenticated: boolean;
  5. login: (user: User) => void;
  6. logout: () => void;
  7. updateUser: (user: User) => void;
  8. }
  9. export interface UserContextAuthenticatedInterface
  10. extends UserContextInterface {
  11. user: User;
  12. }
  13. export const UserContext = React.createContext<UserContextInterface>({
  14. isAuthenticated: false,
  15. login: () => {},
  16. logout: () => {},
  17. updateUser: () => {},
  18. });
  19. const updateIfChanged = (user: User, newUser: Omit<User, "id">) =>
  20. (Object.keys(newUser) as Array<keyof Omit<User, "id">>).some(
  21. (key) => user[key] !== newUser[key]
  22. );
  23. const UserContextProvider: FC = ({ children }) => {
  24. const [user, setUser] = useState<User>();
  25. const [isAuthenticated, setIsAuthenticated] = useState(false);
  26. const login = (user: User) => {
  27. setIsAuthenticated(true);
  28. setUser(user);
  29. };
  30. const logout = () => {
  31. setIsAuthenticated(false);
  32. setUser(undefined);
  33. };
  34. const updateUser = ({ id, ...newData }: User) => {
  35. if (user && updateIfChanged(user, newData)) {
  36. setUser({
  37. ...newData,
  38. id: typeof id === "string" ? parseInt(id) : id,
  39. });
  40. }
  41. };
  42. return (
  43. <UserContext.Provider
  44. value={{ user, login, logout, updateUser, isAuthenticated }}
  45. >
  46. {children}
  47. </UserContext.Provider>
  48. );
  49. };
  50. export const useAuth = () => useContext(UserContext);
  51. export default UserContextProvider;