feat: event tracking using posthog and created application provider to render multiple wrappers (#2757)

* fix: event tracker changes

* fix: App provider implementation using wrappers

* fix: updating packages

* fix: handling warning

* fix: wrapper fixes and minor optimization changes

* fix: chore app-provider clearnup

* fix: cleanup

* fix: removing jitsu tracking

* fix: minor updates

* fix: adding event to posthog event tracker (#2802)

* dev: posthog event tracker update intitiate

* fix: adding events for posthog integration

* fix: event payload

---------

Co-authored-by: Ramesh Kumar Chandra <31303617+rameshkumarchandra@users.noreply.github.com>
This commit is contained in:
sriram veeraghanta 2023-11-20 13:29:54 +05:30
parent 33be52792f
commit 78fee22fec
114 changed files with 825 additions and 2768 deletions

View file

@ -1,15 +1,10 @@
import React from "react";
import { useRouter } from "next/router";
import { observer } from "mobx-react-lite";
import { Tab } from "@headlessui/react";
// mobx store
import { useMobxStore } from "lib/mobx/store-provider";
// services
import { TrackEventService } from "services/track_event.service";
// components
import { CustomAnalytics, ScopeAndDemand } from "components/analytics";
// types
import { ICycle, IModule, IProject, IWorkspace } from "types";
import { ICycle, IModule, IProject } from "types";
// constants
import { ANALYTICS_TABS } from "constants/analytics";
@ -20,63 +15,8 @@ type Props = {
projectDetails: IProject | undefined;
};
const trackEventService = new TrackEventService();
export const ProjectAnalyticsModalMainContent: React.FC<Props> = observer((props) => {
const { fullScreen, cycleDetails, moduleDetails, projectDetails } = props;
const router = useRouter();
const { workspaceSlug } = router.query;
const { user: userStore } = useMobxStore();
const user = userStore.currentUser;
const trackAnalyticsEvent = (tab: string) => {
if (!workspaceSlug || !user) return;
const eventPayload: any = {
workspaceSlug: workspaceSlug.toString(),
};
if (projectDetails) {
const workspaceDetails = projectDetails.workspace as IWorkspace;
eventPayload.workspaceId = workspaceDetails.id;
eventPayload.workspaceName = workspaceDetails.name;
eventPayload.projectId = projectDetails.id;
eventPayload.projectIdentifier = projectDetails.identifier;
eventPayload.projectName = projectDetails.name;
}
if (cycleDetails || moduleDetails) {
const details = cycleDetails || moduleDetails;
eventPayload.workspaceId = details?.workspace_detail?.id;
eventPayload.workspaceName = details?.workspace_detail?.name;
eventPayload.projectId = details?.project_detail.id;
eventPayload.projectIdentifier = details?.project_detail.identifier;
eventPayload.projectName = details?.project_detail.name;
}
if (cycleDetails) {
eventPayload.cycleId = cycleDetails.id;
eventPayload.cycleName = cycleDetails.name;
}
if (moduleDetails) {
eventPayload.moduleId = moduleDetails.id;
eventPayload.moduleName = moduleDetails.name;
}
const eventType = tab === "scope_and_demand" ? "SCOPE_AND_DEMAND_ANALYTICS" : "CUSTOM_ANALYTICS";
trackEventService.trackAnalyticsEvent(
eventPayload,
cycleDetails ? `CYCLE_${eventType}` : moduleDetails ? `MODULE_${eventType}` : `PROJECT_${eventType}`,
user
);
};
const { fullScreen, cycleDetails, moduleDetails } = props;
return (
<Tab.Group as={React.Fragment}>
@ -89,7 +29,7 @@ export const ProjectAnalyticsModalMainContent: React.FC<Props> = observer((props
selected ? "bg-custom-background-80" : ""
}`
}
onClick={() => trackAnalyticsEvent(tab.key)}
onClick={() => {}}
>
{tab.title}
</Tab>