mirror/formbricks-formbricks
1
0
Fork 0
mirror of https://github.com/formbricks/formbricks.git synced 2026-05-25 09:19:22 -05:00
Code Issues Packages Projects Releases 100 Wiki Activity

update posthog tracking method

Browse Source
This commit is contained in:
Matthias Nannt
2023-02-17 18:29:40 +01:00
parent 485d7cd47d
commit 25549f4064
12 changed files with 89 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/package.json
+1
View File
@@ -27,6 +27,7 @@
"next-transpile-modules": "^10.0.0",
"nodemailer": "^6.9.1",
"platform": "^1.3.6",
"posthog-js": "^1.45.1",
"prismjs": "^1.29.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
apps/web/src/components/layout/LayoutApp.tsx
+3
View File
@@ -3,6 +3,7 @@
import LoadingSpinner from "@/components/LoadingSpinner";
import AvatarPlaceholder from "@/images/avatar-placeholder.png";
import { useMemberships } from "@/lib/memberships";
import { identifyPosthogUser } from "@/lib/posthog";
import { Disclosure, Menu, Transition } from "@headlessui/react";
import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline";
import clsx from "clsx";
@@ -43,6 +44,8 @@ export default function LayoutApp({ children }) {
return <LoadingSpinner />;
}
identifyPosthogUser(session.user);
if (isLoadingMemberships) {
return (
<div className="flex h-full w-full items-center justify-center p-8">
apps/web/src/lib/posthog.ts
+41 -5
View File
@@ -1,21 +1,57 @@
import { hashString } from "./utils";
import { useRouter } from "next/router";
import posthog from "posthog-js";
import { useEffect } from "react";
const enabled =
process.env.NODE_ENV === "production" && process.env.POSTHOG_API_HOST && process.env.POSTHOG_API_KEY;
process.env.NODE_ENV === "production" &&
process.env.NEXT_PUBLIC_POSTHOG_API_HOST &&
process.env.NEXT_PUBLIC_POSTHOG_API_KEY;
export const initPosthog = () => {
if (typeof window !== "undefined" && enabled) {
posthog.init(process.env.NEXT_PUBLIC_POSTHOG_API_KEY, {
api_host: process.env.NEXT_PUBLIC_POSTHOG_API_HOST,
});
}
};
export const usePosthog = () => {
const router = useRouter();
useEffect(() => {
let handleRouteChange = () => {};
if (enabled) {
// Track page views
handleRouteChange = () => posthog.capture("$pageview");
router.events.on("routeChangeComplete", handleRouteChange);
}
return () => {
if (enabled) {
router.events.off("routeChangeComplete", handleRouteChange);
}
};
}, []);
};
export const identifyPosthogUser = (user) => {
if (enabled) {
posthog.identify(user.id, { email: user.email, name: user.name });
}
};
export const capturePosthogEvent = async (userId, eventName, properties = {}) => {
if (!enabled) {
return;
}
try {
await fetch(`${process.env.POSTHOG_API_HOST}/capture/`, {
await fetch(`${process.env.NEXT_PUBLIC_POSTHOG_API_HOST}/capture/`, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
api_key: process.env.POSTHOG_API_KEY,
api_key: process.env.NEXT_PUBLIC_POSTHOG_API_KEY,
event: eventName,
properties: {
distinct_id: hashString(userId.toString()),
distinct_id: userId.toString(),
...properties,
},
timestamp: new Date().toISOString(),
apps/web/src/pages/_app.tsx
+10 -5
View File
@@ -1,15 +1,20 @@
import { FeedbackButton } from "@/components/FeedbackButton";
import { initPosthog, usePosthog } from "@/lib/posthog";
import "@/styles/globals.css";
import "@/styles/prism.css";
import "@/styles/toastify.css";
import { Analytics } from "@vercel/analytics/react";
import { SessionProvider } from "next-auth/react";
import { ToastContainer } from "react-toastify";
import { FeedbackButton } from "@/components/FeedbackButton";
import { useEffect, useState } from "react";
import "@/styles/globals.css";
import "@/styles/toastify.css";
import "@/styles/prism.css";
import { ToastContainer } from "react-toastify";
initPosthog();
function FormbricksApp({ Component, pageProps: { session, ...pageProps } }) {
const [isMobile, setIsMobile] = useState(false);
usePosthog();
useEffect(() => {
const handleResize = () => setIsMobile(window.innerWidth <= 768);
handleResize();
apps/web/src/pages/api/auth/[...nextauth].ts
+4 -1
View File
@@ -1,3 +1,4 @@
import { capturePosthogEvent } from "@/lib/posthog";
import { prisma } from "@formbricks/database";
import { IdentityProvider } from "@prisma/client";
import { NextApiRequest, NextApiResponse } from "next";
@@ -220,7 +221,7 @@ export const authOptions: NextAuthOptions = {
return "/auth/error?error=use-email-login";
}
await prisma.user.create({
const userData = await prisma.user.create({
data: {
name: user.name,
email: user.email,
@@ -246,6 +247,8 @@ export const authOptions: NextAuthOptions = {
},
});
capturePosthogEvent(userData.id, "user created");
return true;
}
apps/web/src/pages/api/organisations/[organisationId]/forms/[formId]/index.ts
+1 -1
View File
@@ -59,7 +59,7 @@ export default async function handle(req: NextApiRequest, res: NextApiResponse)
const prismaRes = await prisma.form.delete({
where: { id: formId },
});
capturePosthogEvent(organisationId, "form created", {
capturePosthogEvent(user.id, "form deleted", {
formId,
});
return res.json(prismaRes);
apps/web/src/pages/api/organisations/[organisationId]/forms/[formId]/pipelines/[pipelineId]/index.ts
+1 -1
View File
@@ -59,7 +59,7 @@ export default async function handle(req: NextApiRequest, res: NextApiResponse)
const prismaRes = await prisma.pipeline.delete({
where: { id: pipelineId },
});
capturePosthogEvent(organisationId, "pipeline deleted", {
capturePosthogEvent(user.id, "pipeline deleted", {
formId,
pipelineId,
});
apps/web/src/pages/api/organisations/[organisationId]/forms/[formId]/pipelines/index.ts
+1 -1
View File
@@ -58,7 +58,7 @@ export default async function handle(req: NextApiRequest, res: NextApiResponse)
form: { connect: { id: formId } },
},
});
capturePosthogEvent(organisationId, "pipeline created", {
capturePosthogEvent(user.id, "pipeline created", {
formId,
pipelineId: result.id,
});
apps/web/src/pages/api/organisations/[organisationId]/forms/index.ts
+1 -1
View File
@@ -60,7 +60,7 @@ export default async function handle(req: NextApiRequest, res: NextApiResponse)
organisation: { connect: { id: organisationId } },
},
});
capturePosthogEvent(organisationId, "form created", {
capturePosthogEvent(user.id, "form created", {
formId: result.id,
});
res.json(result);
apps/web/src/pages/api/users/index.tsx
+1 -4
View File
@@ -35,13 +35,10 @@ export default async function handle(req: NextApiRequest, res: NextApiResponse)
],
},
},
include: {
organisations: true,
},
});
if (process.env.NEXT_PUBLIC_EMAIL_VERIFICATION_DISABLED !== "1") await sendVerificationEmail(userData);
// tracking
capturePosthogEvent(userData.organisations[0].organisationId, "user created");
capturePosthogEvent(userData.id, "user created");
res.json(userData);
} catch (e) {
if (e.code === "P2002") {
pnpm-lock.yaml
Generated
+23
View File
@@ -215,6 +215,7 @@ importers:
nodemailer: ^6.9.1
platform: ^1.3.6
postcss: ^8.4.21
posthog-js: ^1.45.1
prismjs: ^1.29.0
react: ^18.2.0
react-dom: ^18.2.0
@@ -243,6 +244,7 @@ importers:
next-transpile-modules: 10.0.0
nodemailer: 6.9.1
platform: 1.3.6
posthog-js: 1.45.1
prismjs: 1.29.0
react: 18.2.0
react-dom: 18.2.0_react@18.2.0
@@ -3644,6 +3646,11 @@ packages:
tslib: 1.14.1
dev: false
/@sentry/types/7.22.0:
resolution: {integrity: sha512-LhCL+wb1Jch+OesB2CIt6xpfO1Ab6CRvoNYRRzVumWPLns1T3ZJkarYfhbLaOEIb38EIbPgREdxn2AJT560U4Q==}
engines: {node: '>=8'}
dev: false
/@sentry/types/7.34.0:
resolution: {integrity: sha512-K+OeHIrl35PSYn6Zwqe4b8WWyAJQoI5NeWxHVkM7oQTGJ1YLG4BvLsR+UiUXnKdR5krE4EDtEA5jLsDlBEyPvw==}
engines: {node: '>=8'}
@@ -9549,6 +9556,10 @@ packages:
resolution: {integrity: sha512-uJQyMrX5IJZkhoEUBQ3EjxkeiZkppBd5jS/fMTJmfZxLSiaQjv2zD0kTvuvkSH89uFvgSlB6ueGpjD3HWN7Bxw==}
dev: true
/fflate/0.4.8:
resolution: {integrity: sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA==}
dev: false
/figgy-pudding/3.5.2:
resolution: {integrity: sha512-0btnI/H8f2pavGMN8w40mlSKOfTK2SVJmBfBeVIj3kNw0swwgzyRq0d5TJVOwodFmtvpPeWPN/MCcfuWF0Ezbw==}
dev: true
@@ -14744,6 +14755,14 @@ packages:
picocolors: 1.0.0
source-map-js: 1.0.2
/posthog-js/1.45.1:
resolution: {integrity: sha512-dHB0agl9qc/PIhHhfnJB4hxzcO/wBS8z7U2OLrAAAyrmWU+3K1XnIipyZX3tEFq6hk1yL+tJuidBw+gqgMvo4g==}
dependencies:
'@sentry/types': 7.22.0
fflate: 0.4.8
rrweb-snapshot: 1.1.14
dev: false
/preact-render-to-string/5.2.6_preact@10.11.3:
resolution: {integrity: sha512-JyhErpYOvBV1hEPwIxc/fHWXPfnEGdRKxc8gFdAZ7XV4tlzyzG847XAyEZqoDnynP88akM4eaHcSOzNcLWFguw==}
peerDependencies:
@@ -16028,6 +16047,10 @@ packages:
fsevents: 2.3.2
dev: true
/rrweb-snapshot/1.1.14:
resolution: {integrity: sha512-eP5pirNjP5+GewQfcOQY4uBiDnpqxNRc65yKPW0eSoU1XamDfc4M8oqpXGMyUyvLyxFDB0q0+DChuxxiU2FXBQ==}
dev: false
/rsvp/4.8.5:
resolution: {integrity: sha512-nfMOlASu9OnRJo1mbEk2cz0D56a1MBNrJ7orjRZQG10XDyuvwksKbuXNp6qa+kbn839HwjwhBzhFmdsaEAfauA==}
engines: {node: 6.* || >= 7.*}
turbo.json
+2 -2
View File
@@ -34,8 +34,8 @@
"NEXT_PUBLIC_FORMBRICKS_PMF_FORM_ID",
"NEXT_PUBLIC_FORMBRICKS_URL",
"NODE_ENV",
"POSTHOG_API_HOST",
"POSTHOG_API_KEY",
"NEXT_PUBLIC_POSTHOG_API_HOST",
"NEXT_PUBLIC_POSTHOG_API_KEY",
"SENTRY_DSN",
"TELEMETRY_DISABLED",
"VERCEL_URL"