Files
automatisch/packages/web/src/components/QueryClientProvider/index.jsx

57 lines
1.3 KiB
JavaScript

import * as React from 'react';
import PropTypes from 'prop-types';
import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import api from 'helpers/api.js';
import useAuthentication from 'hooks/useAuthentication.js';
const queryClient = new QueryClient({
defaultOptions: {
queries: {
staleTime: 1000,
refetchOnWindowFocus: false,
// provides a convenient default while it should be overridden for other HTTP methods
queryFn: async ({ queryKey, signal }) => {
const { data } = await api.get(queryKey[0], {
signal,
});
return data;
},
retry: false,
},
},
});
export default function AutomatischQueryClientProvider({ children }) {
const { token, initialize } = useAuthentication();
React.useEffect(
function updateTokenInHttpClient() {
if (!initialize) return;
if (token) {
api.defaults.headers.Authorization = token;
initialize();
} else {
delete api.defaults.headers.Authorization;
}
},
[initialize, token],
);
return (
<QueryClientProvider client={queryClient}>
{children}
<ReactQueryDevtools />
</QueryClientProvider>
);
}
AutomatischQueryClientProvider.propTypes = {
children: PropTypes.node.isRequired,
};