File size: 2,545 Bytes
f909d7c |
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 |
import React from "react";
import type { AppProps } from "next/app";
import dynamic from "next/dynamic";
import { useRouter } from "next/router";
import { MantineProvider, createTheme } from "@mantine/core";
import "@mantine/core/styles.css";
import "@mantine/code-highlight/styles.css";
import { ThemeProvider } from "styled-components";
import { SessionContextProvider, Session } from "@supabase/auth-helpers-react";
import ReactGA from "react-ga4";
import GlobalStyle from "src/constants/globalStyle";
import { lightTheme } from "src/constants/theme";
import { supabase } from "src/lib/api/supabase";
import useUser from "src/store/useUser";
const mantineTheme = createTheme({
primaryShade: 8,
});
const isDevelopment = process.env.NODE_ENV === "development";
const GA_TRACKING_ID = process.env.NEXT_PUBLIC_GA_ID;
ReactGA.initialize(GA_TRACKING_ID, { testMode: isDevelopment });
const Toaster = dynamic(() => import("react-hot-toast").then(c => c.Toaster));
const ExternalMode = dynamic(() => import("src/layout/ExternalMode"));
const ModalController = dynamic(() => import("src/layout/ModalController"));
function JsonCrack({
Component,
pageProps,
}: AppProps<{
initialSession: Session;
}>) {
const router = useRouter();
const setSession = useUser(state => state.setSession);
React.useEffect(() => {
supabase.auth.getSession().then(({ data: { session } }) => {
if (session) setSession(session);
});
}, [setSession]);
React.useEffect(() => {
const handleRouteChange = (page: string) => {
ReactGA.send({ hitType: "pageview", page });
};
router.events.on("routeChangeComplete", handleRouteChange);
return () => {
router.events.off("routeChangeComplete", handleRouteChange);
};
}, [router.events]);
return (
<SessionContextProvider supabaseClient={supabase}>
<MantineProvider theme={mantineTheme}>
<ThemeProvider theme={lightTheme}>
<GlobalStyle />
<Component {...pageProps} />
<ModalController />
<Toaster
position="bottom-right"
containerStyle={{
bottom: 34,
right: 8,
fontSize: 14,
}}
toastOptions={{
style: {
background: "#4D4D4D",
color: "#B9BBBE",
borderRadius: 4,
},
}}
/>
<ExternalMode />
</ThemeProvider>
</MantineProvider>
</SessionContextProvider>
);
}
export default JsonCrack;
|