2024-02-28 16:33:15 +03:00

68 lines
2.2 KiB
JavaScript

import 'normalize.css';
import '../styles/fonts.css';
import '../styles/globals.css';
import '../styles/antd-fix.css';
import initializeQueryClient from '@/api/client';
import initializeApollo from '@/apollo/client';
import { Notification } from '@/Components/Common/Notification';
import Layout from '@/Components/Layout';
import { theme } from '@/config/ui';
import StoreProvider from '@/stores/Provider';
import getColors from '@/styles/colors';
import { GlobalStyle } from '@/styles/global-style';
import { trpcClient } from '@/trpc/client';
import { ApolloProvider } from '@apollo/client';
import { QueryClientProvider } from '@tanstack/react-query';
import Head from 'next/head';
import { useMemo } from 'react';
import { ThemeProvider } from 'styled-components';
import { Config as AntdConfig } from 'ui/elements';
if (process.env.NODE_ENV === 'development') {
require('../mocks');
}
const colorPrimary = getColors().COLOR_PRIMARY;
function App({ Component, pageProps }) {
const { initialApolloState, initialQueryState } = pageProps;
const apolloClient = useMemo(() => initializeApollo(initialApolloState), [initialApolloState]);
const queryClient = useMemo(() => initializeQueryClient(initialQueryState), [initialQueryState]);
return (
<ThemeProvider theme={theme}>
<Head>
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0"
/>
</Head>
<GlobalStyle />
<StoreProvider {...pageProps}>
<ApolloProvider client={apolloClient}>
<QueryClientProvider client={queryClient}>
<AntdConfig
theme={{
token: {
borderRadius: 2,
borderRadiusLG: 2,
colorLink: colorPrimary,
colorPrimary,
},
}}
>
<Notification>
<Layout>
<Component {...pageProps} />
</Layout>
</Notification>
</AntdConfig>
</QueryClientProvider>
</ApolloProvider>
</StoreProvider>
</ThemeProvider>
);
}
export default trpcClient.withTRPC(App);