import React from "react";

export interface UserContextData {
  username?: string;
  telegram_photo_url?: string;
  mastodon_server?: string;
  mastodon_username?: string;
}

const UserContext = React.createContext<UserContextData>({});

export const useUserContext = (): UserContextData => {
  return React.useContext(UserContext);
};

export const UserContextProvider: React.FC<{ children: React.ReactNode }> = ({
  children,
}) => {
  const [userProfile, setUserProfile] = React.useState<UserContextData>({});

  React.useEffect(() => {
    fetch(`/api/me`)
      .then((response) => response.json())
      .then((data) => {
        setUserProfile(data);
      });
  }, []);

  return (
    <UserContext.Provider value={userProfile}>{children}</UserContext.Provider>
  );
};