rallly/pages/_app.tsx
2022-04-12 07:14:28 +01:00

53 lines
1.7 KiB
TypeScript

import { NextPage } from "next";
import { appWithTranslation } from "next-i18next";
import PlausibleProvider from "next-plausible";
import { AppProps } from "next/app";
import dynamic from "next/dynamic";
import Head from "next/head";
import "react-big-calendar/lib/css/react-big-calendar.css";
import toast, { Toaster } from "react-hot-toast";
import { MutationCache, QueryClient, QueryClientProvider } from "react-query";
import { useSessionStorage } from "react-use";
import "tailwindcss/tailwind.css";
import { UserNameContext } from "../components/user-name-context";
import "../style.css";
const CrispChat = dynamic(() => import("@/components/crisp-chat"), {
ssr: false,
});
const queryClient = new QueryClient({
mutationCache: new MutationCache({
onError: () => {
toast.error(
"Uh oh! Something went wrong. The issue has been logged and we'll fix it as soon as possible. Please try again later.",
);
},
}),
});
const MyApp: NextPage<AppProps> = ({ Component, pageProps }) => {
const sessionUserName = useSessionStorage<string>("userName", "");
return (
<PlausibleProvider
domain="rallly.co"
customDomain={process.env.PLAUSIBLE_DOMAIN}
selfHosted={true}
enabled={!!process.env.PLAUSIBLE_DOMAIN}
>
<QueryClientProvider client={queryClient}>
<Head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
</Head>
<CrispChat />
<Toaster />
<UserNameContext.Provider value={sessionUserName}>
<Component {...pageProps} />
</UserNameContext.Provider>
</QueryClientProvider>
</PlausibleProvider>
);
};
export default appWithTranslation(MyApp);