diff options
Diffstat (limited to 'src/routes/authentication/AuthProvider.tsx')
-rw-r--r-- | src/routes/authentication/AuthProvider.tsx | 122 |
1 files changed, 122 insertions, 0 deletions
diff --git a/src/routes/authentication/AuthProvider.tsx b/src/routes/authentication/AuthProvider.tsx new file mode 100644 index 00000000..bd5706f3 --- /dev/null +++ b/src/routes/authentication/AuthProvider.tsx @@ -0,0 +1,122 @@ +import React, {useEffect} from 'react'; +import {createContext, useState} from 'react'; +import RNFetchBlob from 'rn-fetch-blob'; +import {UserType, ProfileType} from '../../types'; +import { + PROFILE_INFO_ENDPOINT, + AVATAR_PHOTO_ENDPOINT, + COVER_PHOTO_ENDPOINT, +} from '../../constants'; + +interface AuthContextProps { + user: UserType; + profile: ProfileType; + login: (userId: string, username: string) => void; + logout: () => void; + avatar: string | null; + cover: string | null; +} +const NO_USER: UserType = { + userId: '', + username: '', +}; +const NO_PROFILE: ProfileType = { + biography: '', + website: '', + name: '', +}; +export const AuthContext = createContext<AuthContextProps>({ + user: NO_USER, + profile: NO_PROFILE, + login: () => {}, + logout: () => {}, + avatar: null, + cover: null, +}); + +/** + * Authentication provider for the application. + */ +const AuthProvider: React.FC = ({children}) => { + const [user, setUser] = useState<UserType>(NO_USER); + const [profile, setProfile] = useState<ProfileType>(NO_PROFILE); + const [avatar, setAvatar] = useState<string | null>(null); + const [cover, setCover] = useState<string | null>(null); + + const {userId} = user; + useEffect(() => { + if (!userId) { + return; + } + const loadProfileInfo = async () => { + try { + const response = await fetch(PROFILE_INFO_ENDPOINT + `${userId}/`, { + method: 'GET', + }); + const status = response.status; + if (status === 200) { + const info = await response.json(); + let {name, biography, website} = info; + setProfile({name, biography, website}); + } + } catch (error) { + console.log(error); + } + }; + const loadAvatar = async () => { + try { + const response = await RNFetchBlob.config({ + fileCache: true, + appendExt: 'jpg', + }).fetch('GET', AVATAR_PHOTO_ENDPOINT + `${userId}/`); + const status = response.info().status; + if (status === 200) { + setAvatar(response.path()); + } else { + setAvatar(''); + } + } catch (error) { + console.log(error); + } + }; + const loadCover = async () => { + try { + let response = await RNFetchBlob.config({ + fileCache: true, + appendExt: 'jpg', + }).fetch('GET', COVER_PHOTO_ENDPOINT + `${userId}/`); + const status = response.info().status; + if (status === 200) { + setCover(response.path()); + } else { + setCover(''); + } + } catch (error) { + console.log(error); + } + }; + loadProfileInfo(); + loadAvatar(); + loadCover(); + }, [userId]); + + return ( + <AuthContext.Provider + value={{ + user, + profile, + avatar, + cover, + login: (id, username) => { + setUser({...user, userId: id, username}); + }, + logout: () => { + setUser(NO_USER); + }, + }}> + {children} + </AuthContext.Provider> + ); +}; + +export default AuthProvider; |