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

@@ -20,6 +20,8 @@ import { getRandomEmoji, renderEmoji } from "helpers/emoji.helper";
import { IWorkspaceMember } from "types";
// constants
import { NETWORK_CHOICES, PROJECT_UNSPLASH_COVERS } from "constants/project";
// track events
import { trackEvent } from "helpers/event-tracker.helper";
type Props = {
isOpen: boolean;
@@ -129,6 +131,14 @@ export const CreateProjectModal: FC<Props> = observer((props) => {
return projectStore
.createProject(workspaceSlug.toString(), payload)
.then((res) => {
const newPayload = {
...payload,
id: res.id
}
trackEvent(
"CREATE_PROJECT",
newPayload,
)
setToastAlert({
type: "success",
title: "Success!",
@@ -211,7 +221,7 @@ export const CreateProjectModal: FC<Props> = observer((props) => {
)}
<div className="absolute right-2 top-2 p-2">
<button type="button" onClick={handleClose}>
<button data-posthog="PROJECT_MODAL_CLOSE" type="button" onClick={handleClose}>
<X className="h-5 w-5 text-white" />
</button>
</div>

View File

@@ -12,6 +12,7 @@ import { Button, Input } from "@plane/ui";
import type { IProject } from "types";
// fetch-keys
import { useMobxStore } from "lib/mobx/store-provider";
import { trackEvent } from "helpers/event-tracker.helper";
type DeleteProjectModal = {
isOpen: boolean;
@@ -62,6 +63,9 @@ export const DeleteProjectModal: React.FC<DeleteProjectModal> = (props) => {
if (projectId && projectId.toString() === project.id) router.push(`/${workspaceSlug}/projects`);
handleClose();
trackEvent(
'DELETE_PROJECT'
)
setToastAlert({
type: "success",
title: "Success!",
@@ -69,6 +73,9 @@ export const DeleteProjectModal: React.FC<DeleteProjectModal> = (props) => {
});
})
.catch(() => {
trackEvent(
'DELETE_PROJECT/FAIL'
)
setToastAlert({
type: "error",
title: "Error!",

View File

@@ -16,6 +16,7 @@ import { ProjectService } from "services/project";
// hooks
import useToast from "hooks/use-toast";
import { useMobxStore } from "lib/mobx/store-provider";
import { trackEvent } from "helpers/event-tracker.helper";
export interface IProjectDetailsForm {
project: IProject;
@@ -61,7 +62,11 @@ export const ProjectDetailsForm: FC<IProjectDetailsForm> = (props) => {
return projectStore
.updateProject(workspaceSlug.toString(), project.id, payload)
.then(() => {
.then((res) => {
trackEvent(
'UPDATE_PROJECT',
res
);
setToastAlert({
type: "success",
title: "Success!",
@@ -69,6 +74,9 @@ export const ProjectDetailsForm: FC<IProjectDetailsForm> = (props) => {
});
})
.catch((error) => {
trackEvent(
'UPDATE_PROJECT/FAIL',
);
setToastAlert({
type: "error",
title: "Error!",

View File

@@ -20,6 +20,7 @@ import { IUser, TUserProjectRole } from "types";
import { WORKSPACE_MEMBERS } from "constants/fetch-keys";
// constants
import { ROLE } from "constants/workspace";
import { trackEvent } from "helpers/event-tracker.helper";
type Props = {
isOpen: boolean;
@@ -52,7 +53,7 @@ const projectMemberService = new ProjectMemberService();
const workspaceService = new WorkspaceService();
export const SendProjectInvitationModal: React.FC<Props> = observer((props) => {
const { isOpen, setIsOpen, members, user, onSuccess } = props;
const { isOpen, setIsOpen, members, onSuccess } = props;
const router = useRouter();
const { workspaceSlug, projectId } = router.query;
@@ -91,9 +92,12 @@ export const SendProjectInvitationModal: React.FC<Props> = observer((props) => {
const payload = { ...formData };
await projectMemberService
.bulkAddMembersToProject(workspaceSlug.toString(), projectId.toString(), payload, user)
.then(() => {
.bulkAddMembersToProject(workspaceSlug.toString(), projectId.toString(), payload)
.then((res) => {
setIsOpen(false);
trackEvent(
'PROJECT_MEMBER_INVITE',
)
setToastAlert({
title: "Success",
type: "success",

View File

@@ -5,8 +5,6 @@ import { ContrastIcon, FileText, Inbox, Layers } from "lucide-react";
import { DiceIcon, ToggleSwitch } from "@plane/ui";
// mobx store
import { useMobxStore } from "lib/mobx/store-provider";
// services
import { MiscellaneousEventType, TrackEventService } from "services/track_event.service";
// hooks
import useToast from "hooks/use-toast";
// types
@@ -47,26 +45,6 @@ const PROJECT_FEATURES_LIST = [
},
];
const getEventType = (feature: string, toggle: boolean): MiscellaneousEventType => {
switch (feature) {
case "Cycles":
return toggle ? "TOGGLE_CYCLE_ON" : "TOGGLE_CYCLE_OFF";
case "Modules":
return toggle ? "TOGGLE_MODULE_ON" : "TOGGLE_MODULE_OFF";
case "Views":
return toggle ? "TOGGLE_VIEW_ON" : "TOGGLE_VIEW_OFF";
case "Pages":
return toggle ? "TOGGLE_PAGES_ON" : "TOGGLE_PAGES_OFF";
case "Inbox":
return toggle ? "TOGGLE_INBOX_ON" : "TOGGLE_INBOX_OFF";
default:
throw new Error("Invalid feature");
}
};
// services
const trackEventService = new TrackEventService();
export const ProjectFeaturesList: FC<Props> = observer(() => {
// router
const router = useRouter();
@@ -109,17 +87,6 @@ export const ProjectFeaturesList: FC<Props> = observer(() => {
<ToggleSwitch
value={currentProjectDetails?.[feature.property as keyof IProject]}
onChange={() => {
trackEventService.trackMiscellaneousEvent(
{
workspaceId: (currentProjectDetails?.workspace as any)?.id,
workspaceSlug,
projectId,
projectIdentifier: currentProjectDetails?.identifier,
projectName: currentProjectDetails?.name,
},
getEventType(feature.title, !currentProjectDetails?.[feature.property as keyof IProject]),
currentUser
);
handleSubmit({
[feature.property]: !currentProjectDetails?.[feature.property as keyof IProject],
});