File size: 3,182 Bytes
95d29a5 |
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 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 |
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { httpBatchLink, loggerLink } from '@trpc/client';
import { useNavigate } from 'react-router-dom';
import { useState } from 'react';
import { toast } from 'sonner';
import { isTRPCClientError, trpc } from '../utils/trpc';
import { getAuthCode, setAuthCode } from '../utils/auth';
import { enabledAuthCode, serverOriginUrl } from '../utils/env';
export const TrpcProvider: React.FC<{ children: React.ReactNode }> = ({
children,
}) => {
const navigate = useNavigate();
const handleNoAuth = () => {
if (enabledAuthCode) {
setAuthCode('');
navigate('/login');
}
};
const [queryClient] = useState(
() =>
new QueryClient({
defaultOptions: {
queries: {
refetchOnWindowFocus: false,
refetchOnReconnect: true,
refetchIntervalInBackground: false,
retryDelay: (retryCount) => Math.min(retryCount * 1000, 60 * 1000),
retry(failureCount, error) {
console.log('failureCount: ', failureCount);
if (isTRPCClientError(error)) {
if (error.data?.httpStatus === 401) {
return false;
}
}
return failureCount < 3;
},
onError(error) {
console.error('queries onError: ', error);
if (isTRPCClientError(error)) {
if (error.data?.httpStatus === 401) {
toast.error('无权限', {
description: error.message,
});
handleNoAuth();
} else {
toast.error('请求失败!', {
description: error.message,
});
}
}
},
},
mutations: {
onError(error) {
console.error('mutations onError: ', error);
if (isTRPCClientError(error)) {
if (error.data?.httpStatus === 401) {
toast.error('无权限', {
description: error.message,
});
handleNoAuth();
} else {
toast.error('请求失败!', {
description: error.message,
});
}
}
},
},
},
}),
);
const [trpcClient] = useState(() =>
trpc.createClient({
links: [
loggerLink({
enabled: () => true,
}),
httpBatchLink({
url: serverOriginUrl + '/trpc',
async headers() {
const token = getAuthCode();
if (!token) {
handleNoAuth();
return {};
}
return token
? {
Authorization: `${token}`,
}
: {};
},
}),
],
}),
);
return (
<trpc.Provider client={trpcClient} queryClient={queryClient}>
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
</trpc.Provider>
);
};
|