|
|
@@ -19,9 +19,13 @@ const TokenContext = createContext<{ |
|
|
setAccessToken: () => {}, |
|
|
setAccessToken: () => {}, |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
/** True after client hydrate and accessToken is available (safe to call authed APIs). */ |
|
|
|
|
|
const AuthReadyContext = createContext(false); |
|
|
|
|
|
|
|
|
export const AxiosProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => { |
|
|
export const AxiosProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => { |
|
|
const [accessToken, setAccessToken] = useState<string | null>(null); |
|
|
const [accessToken, setAccessToken] = useState<string | null>(null); |
|
|
const [isHydrated, setIsHydrated] = useState(false); |
|
|
const [isHydrated, setIsHydrated] = useState(false); |
|
|
|
|
|
const isAuthReady = isHydrated && Boolean(accessToken); |
|
|
|
|
|
|
|
|
// Hydrate token only on client |
|
|
// Hydrate token only on client |
|
|
useEffect(() => { |
|
|
useEffect(() => { |
|
|
@@ -103,12 +107,15 @@ export const AxiosProvider: React.FC<{ children: React.ReactNode }> = ({ childre |
|
|
return ( |
|
|
return ( |
|
|
<AxiosContext.Provider value={axiosInstance}> |
|
|
<AxiosContext.Provider value={axiosInstance}> |
|
|
<TokenContext.Provider value={{ setAccessToken: handleSetAccessToken }}> |
|
|
<TokenContext.Provider value={{ setAccessToken: handleSetAccessToken }}> |
|
|
{/* Render children immediately – they will just not have the token for 1-2ms */} |
|
|
|
|
|
{children} |
|
|
|
|
|
|
|
|
<AuthReadyContext.Provider value={isAuthReady}> |
|
|
|
|
|
{/* Render children immediately – they will just not have the token for 1-2ms */} |
|
|
|
|
|
{children} |
|
|
|
|
|
</AuthReadyContext.Provider> |
|
|
</TokenContext.Provider> |
|
|
</TokenContext.Provider> |
|
|
</AxiosContext.Provider> |
|
|
</AxiosContext.Provider> |
|
|
); |
|
|
); |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
export const useAxios = () => useContext(AxiosContext); |
|
|
export const useAxios = () => useContext(AxiosContext); |
|
|
export const useToken = () => useContext(TokenContext); |
|
|
|
|
|
|
|
|
export const useToken = () => useContext(TokenContext); |
|
|
|
|
|
export const useAuthReady = () => useContext(AuthReadyContext); |