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
|
'use client';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { RouterProvider, ZenProvider } from '@umami/react-zen';
import { useRouter } from 'next/navigation';
import { useEffect } from 'react';
import { IntlProvider } from 'react-intl';
import { ErrorBoundary } from '@/components/common/ErrorBoundary';
import { useLocale } from '@/components/hooks';
import 'chartjs-adapter-date-fns';
const client = new QueryClient({
defaultOptions: {
queries: {
retry: false,
refetchOnWindowFocus: false,
staleTime: 1000 * 60,
},
},
});
function MessagesProvider({ children }) {
const { locale, messages, dir } = useLocale();
useEffect(() => {
document.documentElement.setAttribute('dir', dir);
document.documentElement.setAttribute('lang', locale);
}, [locale, dir]);
return (
<IntlProvider locale={locale} messages={messages[locale]} onError={() => null}>
{children}
</IntlProvider>
);
}
export function Providers({ children }) {
const router = useRouter();
function navigate(url: string) {
if (shouldUseNativeLink(url)) {
window.location.href = url;
} else {
router.push(url);
}
}
function shouldUseNativeLink(url: string) {
return url.startsWith('http');
}
return (
<ZenProvider>
<RouterProvider navigate={navigate}>
<MessagesProvider>
<QueryClientProvider client={client}>
<ErrorBoundary>{children}</ErrorBoundary>
</QueryClientProvider>
</MessagesProvider>
</RouterProvider>
</ZenProvider>
);
}
|