forked from github/plane
85 lines
2.6 KiB
TypeScript
85 lines
2.6 KiB
TypeScript
import { useEffect } from "react";
|
|
import dynamic from "next/dynamic";
|
|
import Router, { useRouter } from "next/router";
|
|
import { ThemeProvider } from "next-themes";
|
|
import NProgress from "nprogress";
|
|
import posthog from "posthog-js";
|
|
import { PostHogProvider } from "posthog-js/react";
|
|
// mobx store provider
|
|
import { MobxStoreProvider } from "lib/mobx/store-provider";
|
|
import MobxStoreInit from "lib/mobx/store-init";
|
|
// constants
|
|
import { THEMES } from "constants/themes";
|
|
// contexts
|
|
import { ToastContextProvider } from "contexts/toast.context";
|
|
import useUser from "hooks/use-user";
|
|
|
|
const CrispWithNoSSR = dynamic(() => import("constants/crisp"), { ssr: false });
|
|
|
|
// nprogress
|
|
NProgress.configure({ showSpinner: false });
|
|
Router.events.on("routeChangeStart", NProgress.start);
|
|
Router.events.on("routeChangeError", NProgress.done);
|
|
Router.events.on("routeChangeComplete", NProgress.done);
|
|
|
|
// Check that PostHog is client-side (used to handle Next.js SSR)
|
|
if (typeof window !== "undefined") {
|
|
posthog.init(process.env.NEXT_PUBLIC_POSTHOG_KEY || "", {
|
|
api_host: process.env.NEXT_PUBLIC_POSTHOG_HOST || "https://app.posthog.com",
|
|
// Enable debug mode in development
|
|
loaded: (posthog) => {
|
|
if (process.env.NODE_ENV === "development") posthog.debug();
|
|
},
|
|
autocapture: false,
|
|
capture_pageview: false, // Disable automatic pageview capture, as we capture manually
|
|
});
|
|
}
|
|
|
|
const AppProviders = (props: any) => {
|
|
const router = useRouter();
|
|
const { user } = useUser();
|
|
|
|
useEffect(() => {
|
|
if (user) {
|
|
// Identify sends an event, so you want may want to limit how often you call it
|
|
posthog?.identify(user.email, {
|
|
email: user.email,
|
|
first_name: user.first_name,
|
|
last_name: user.last_name,
|
|
id: user.id,
|
|
});
|
|
}
|
|
}, [user?.id]);
|
|
|
|
const RemainingProviders = (
|
|
<MobxStoreProvider {...props.pageProps}>
|
|
<ThemeProvider themes={THEMES} defaultTheme="system">
|
|
<ToastContextProvider>
|
|
<CrispWithNoSSR />
|
|
<MobxStoreInit />
|
|
{props.children}
|
|
</ToastContextProvider>
|
|
</ThemeProvider>
|
|
</MobxStoreProvider>
|
|
);
|
|
|
|
useEffect(() => {
|
|
// Track page views
|
|
const handleRouteChange = () => {
|
|
posthog?.capture("$pageview");
|
|
};
|
|
router.events.on("routeChangeComplete", handleRouteChange);
|
|
|
|
return () => {
|
|
router.events.off("routeChangeComplete", handleRouteChange);
|
|
};
|
|
}, []);
|
|
|
|
if (process.env.NEXT_PUBLIC_POSTHOG_KEY && process.env.NEXT_PUBLIC_POSTHOG_HOST) {
|
|
return <PostHogProvider client={posthog}>{RemainingProviders}</PostHogProvider>;
|
|
}
|
|
return <>{RemainingProviders}</>;
|
|
};
|
|
|
|
export default AppProviders;
|