Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 | 3x | // This file houses crud methods to interact with user profile data on the server. They are generally called by react query mutations.
import axios, { AxiosRequestConfig } from "axios"
import { QueryClient, useMutation, useQuery, useQueryClient } from "react-query";
import { API_URL, reportAxiosError } from "../globals"
import { authStore } from "../stores/AuthStore";
import { useAuth } from "./useAuth";
/**
* Interface that contains data in a user's profile.
*/
export interface UserProfile {
/**
* The user's id
*/
id?: string
/**
* The user's username
*/
username?: string
/**
* The user's email
*/
email?: string
/**
* The user's base64 encoded profile picture.
*/
picture?: string
}
/**
* A custom hook containing [react-query]{@link https://react-query.tanstack.com/} queries and mutations and other logic related to interacting with {@link UserProfile} objects.
* @category Hooks
* @namespace useProfile
*/
export const useProfile = (userId: string) => {
/**
* The local instance of the [react-query QueryClient]{@link https://react-query.tanstack.com/reference/QueryClient#_top}.
* @memberOf useLandmarks
*/
let queryClient: QueryClient;
try {
queryClient = useQueryClient()
} catch (error) {
console.log("Something went wrong when retrieving query client:")
console.log(error)
}
const { refreshAccessToken } = useAuth();
/**
* The callback responsible for retrieving the {@link Profile} matching the given ID from the API , used by the [react-query useQuery]{@link https://react-query.tanstack.com/reference/useQuery#_top} hook.
* * @memberOf useProfile
*/
const getProfile = async (id: string) => {
const config: AxiosRequestConfig = {
method: 'GET',
url: API_URL + `/api/user-profile/${id}/`,
headers: { "Authorization": "Bearer " + authStore.accessToken, }
}
try {
const response = await axios(config);
return response.data;
} catch (error) {
if (error.response.status == 401) {
try {
await refreshAccessToken()
const response = await axios({...config, headers: { "Authorization": "Bearer " + authStore.accessToken }});
return response.data;
} catch (error) {
// refreshAccessToken will report errors
}
}
reportAxiosError('Something went wrong when retrieving landmarks', error)
throw new Error;
}
}
// get query
const { data: profile, status: getProfileStatus } = useQuery<UserProfile, Error>(['getProfile', userId], async () => getProfile(userId))
return { profile, getProfileStatus } //reading
}
|