All files / app/pages _app.tsx

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
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import "intersection-observer";
import "fonts";
 
import { CssBaseline, ThemeProvider } from "@material-ui/core";
import { EnvironmentBanner } from "components/EnvironmentBanner";
import ErrorBoundary from "components/ErrorBoundary";
import HtmlMeta from "components/HtmlMeta";
import AuthProvider from "features/auth/AuthProvider";
import { ReactQueryClientProvider } from "features/reactQueryClient";
import type { AppProps } from "next/app";
import { appWithTranslation } from "next-i18next";
import nextI18nextConfig from "next-i18next.config";
import Sentry from "platform/sentry";
import { ReactNode, useEffect } from "react";
import TagManager from "react-gtm-module";
import { polyfill } from "seamless-scroll-polyfill";
import { theme } from "theme";
 
type AppWithLayoutProps = Omit<AppProps, "Component"> & {
  Component: AppProps["Component"] & {
    getLayout: (page: ReactNode) => ReactNode;
  };
};
 
function MyApp({ Component, pageProps }: AppWithLayoutProps) {
  const getLayout = Component.getLayout ?? ((page: ReactNode) => page);
  useEffect(() => polyfill(), []);
  useEffect(() => {
    // Remove the server-side injected CSS.
    const jssStyles = document.querySelector("#jss-server-side");
    Iif (jssStyles) {
      jssStyles.parentElement!.removeChild(jssStyles);
    }
  }, []);
 
  useEffect(() => {
    Iif (process.env.NEXT_PUBLIC_COUCHERS_ENV === "prod") {
      Sentry.init({
        dsn: "https://5594adb1a53e41bfbb9f2cc5c91e2dbd@o782870.ingest.sentry.io/5887585",
        environment: process.env.NEXT_PUBLIC_COUCHERS_ENV,
        release: process.env.NEXT_PUBLIC_VERSION,
      });
      TagManager.initialize({ gtmId: "GTM-PXP3896" });
    }
  }, []);
 
  return (
    <ThemeProvider theme={theme}>
      <ErrorBoundary isFatal>
        <ReactQueryClientProvider>
          <AuthProvider>
            <CssBaseline />
            <EnvironmentBanner />
            <HtmlMeta />
            {getLayout(<Component {...pageProps} />)}
          </AuthProvider>
        </ReactQueryClientProvider>
      </ErrorBoundary>
    </ThemeProvider>
  );
}
 
export default appWithTranslation(MyApp, nextI18nextConfig);