mirror of https://github.com/buster-so/buster.git
59 lines
1.9 KiB
TypeScript
59 lines
1.9 KiB
TypeScript
'use client';
|
|
|
|
import { PropsWithChildren, useEffect } from 'react';
|
|
import { PostHogProvider } from 'posthog-js/react';
|
|
import React from 'react';
|
|
import type { PostHogConfig } from 'posthog-js';
|
|
import { isDev } from '@/config';
|
|
import posthog from 'posthog-js';
|
|
import { useUserConfigContextSelector } from '../Users';
|
|
import { isServer } from '@tanstack/react-query';
|
|
const POSTHOG_KEY = process.env.NEXT_PUBLIC_POSTHOG_KEY!;
|
|
|
|
export const BusterPosthogProvider: React.FC<PropsWithChildren> = React.memo(({ children }) => {
|
|
if (isDev || !POSTHOG_KEY) {
|
|
return <>{children}</>;
|
|
}
|
|
|
|
return <PosthogWrapper>{children}</PosthogWrapper>;
|
|
});
|
|
BusterPosthogProvider.displayName = 'BusterPosthogProvider';
|
|
|
|
const options: Partial<PostHogConfig> = {
|
|
api_host: process.env.NEXT_PUBLIC_POSTHOG_HOST,
|
|
person_profiles: 'always',
|
|
session_recording: {
|
|
recordBody: true
|
|
},
|
|
loaded: (x) => {
|
|
console.log(
|
|
'%c🎉 Posthog loaded! 🚀',
|
|
'background: linear-gradient(to right, #ff6b6b, #4ecdc4); color: white; font-size: 20px; font-weight: bold; padding: 10px; border-radius: 5px;',
|
|
x
|
|
);
|
|
}
|
|
};
|
|
|
|
const PosthogWrapper: React.FC<PropsWithChildren<{}>> = ({ children }) => {
|
|
const user = useUserConfigContextSelector((state) => state.user);
|
|
const userTeams = useUserConfigContextSelector((state) => state.userTeams);
|
|
const userOrganizations = useUserConfigContextSelector((state) => state.userOrganizations);
|
|
const team = userTeams[0];
|
|
|
|
useEffect(() => {
|
|
if (POSTHOG_KEY && !isServer && user && posthog && team) {
|
|
posthog.init(POSTHOG_KEY, options);
|
|
|
|
const email = user.email;
|
|
posthog.identify(email, {
|
|
user,
|
|
organization: userOrganizations,
|
|
team
|
|
});
|
|
posthog.group(team.id, team.name);
|
|
}
|
|
}, [user?.id, team?.id]);
|
|
|
|
return <PostHogProvider client={posthog}>{children}</PostHogProvider>;
|
|
};
|