binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

[WEB-5399] chore: update dependencies and improve PostHog integration (#8097)

Browse source 
- Updated PostHog React package to version 1.4.0 and posthog-js to version 1.255.1.
- Refactored PostHogProvider to include hydration state management for improved event tracking.
- Cleaned up version references in pnpm-lock.yaml for react-router and next-themes.
This commit is contained in:
Prateek Shourya 2025-11-11 19:27:49 +05:30 • committed by GitHub
parent 6ba15545d9
commit f8a9a1576d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 60 additions and 91 deletions
Download patch file Download diff file Expand all files Collapse all files

32
apps/web/core/lib/posthog-provider.tsx
View file

@ -1,11 +1,11 @@
"use client";
import type { FC, ReactNode } from "react";
import { lazy, Suspense, useEffect } from "react";
import { lazy, Suspense, useEffect, useState } from "react";
import { PostHogProvider as PHProvider } from "@posthog/react";
import { observer } from "mobx-react";
import { useParams } from "next/navigation";
import posthog from "posthog-js";
import { PostHogProvider as PHProvider } from "posthog-js/react";
// constants
import { GROUP_WORKSPACE_TRACKER_EVENT } from "@plane/constants";
// helpers
@ -29,7 +29,9 @@ const PostHogProvider: FC<IPosthogWrapper> = observer((props) => {
const { instance } = useInstance();
const { workspaceSlug, projectId } = useParams();
const { getWorkspaceRoleByWorkspaceSlug, getProjectRoleByWorkspaceSlugAndProjectId } = useUserPermissions();
// states
const [hydrated, setHydrated] = useState(false);
// derived values
const currentProjectRole = getProjectRoleByWorkspaceSlugAndProjectId(
workspaceSlug?.toString(),
projectId?.toString()
@ -40,7 +42,7 @@ const PostHogProvider: FC<IPosthogWrapper> = observer((props) => {
process.env.NEXT_PUBLIC_POSTHOG_KEY && process.env.NEXT_PUBLIC_POSTHOG_HOST && is_telemetry_enabled;
useEffect(() => {
if (user) {
if (user && hydrated) {
// Identify sends an event, so you want may want to limit how often you call it
posthog?.identify(user.email, {
id: user.id,
@ -57,19 +59,23 @@ const PostHogProvider: FC<IPosthogWrapper> = observer((props) => {
});
}
}
}, [user, currentProjectRole, currentWorkspaceRole, currentWorkspace]);
}, [user, currentProjectRole, currentWorkspaceRole, currentWorkspace, hydrated]);
useEffect(() => {
if (process.env.NEXT_PUBLIC_POSTHOG_KEY && process.env.NEXT_PUBLIC_POSTHOG_HOST) {
posthog.init(process.env.NEXT_PUBLIC_POSTHOG_KEY, {
api_host: "/ingest",
ui_host: process.env.NEXT_PUBLIC_POSTHOG_HOST,
debug: process.env.NEXT_PUBLIC_POSTHOG_DEBUG === "1", // Debug mode based on the environment variable
const posthogKey = process.env.NEXT_PUBLIC_POSTHOG_KEY;
const posthogHost = process.env.NEXT_PUBLIC_POSTHOG_HOST;
const isDebugMode = process.env.NEXT_PUBLIC_POSTHOG_DEBUG === "1";
if (posthogKey && posthogHost) {
posthog.init(posthogKey, {
api_host: posthogHost,
ui_host: posthogHost,
debug: isDebugMode, // Debug mode based on the environment variable
autocapture: false,
capture_pageview: false, // Disable automatic pageview capture, as we capture manually
capture_pageleave: true,
disable_session_recording: true,
});
setHydrated(true);
}
}, []);
@ -86,16 +92,16 @@ const PostHogProvider: FC<IPosthogWrapper> = observer((props) => {
}
};
if (is_posthog_enabled) {
if (is_posthog_enabled && hydrated) {
document.addEventListener("click", clickHandler);
}
return () => {
document.removeEventListener("click", clickHandler);
};
}, [is_posthog_enabled]);
}, [hydrated, is_posthog_enabled]);
if (is_posthog_enabled)
if (is_posthog_enabled && hydrated)
return (
<PHProvider client={posthog}>
<Suspense>

17
apps/web/package.json
View file

@ -17,9 +17,9 @@
"fix:format": "prettier --write \"**/*.{ts,tsx,md,json,css,scss}\""
},
"dependencies": {
"@atlaskit/pragmatic-drag-and-drop": "catalog:",
"@atlaskit/pragmatic-drag-and-drop-auto-scroll": "catalog:",
"@atlaskit/pragmatic-drag-and-drop-hitbox": "catalog:",
"@atlaskit/pragmatic-drag-and-drop": "catalog:",
"@bprogress/core": "catalog:",
"@headlessui/react": "^1.7.19",
"@intercom/messenger-js-sdk": "^0.0.12",
@ -34,6 +34,7 @@
"@plane/ui": "workspace:*",
"@plane/utils": "workspace:*",
"@popperjs/core": "^2.11.8",
"@posthog/react": "^1.4.0",
"@react-pdf/renderer": "^3.4.5",
"@react-router/node": "^7.9.3",
"@tanstack/react-table": "^8.21.3",
@ -48,11 +49,12 @@
"isbot": "^5.1.31",
"lodash-es": "catalog:",
"lucide-react": "catalog:",
"mobx": "catalog:",
"mobx-react": "catalog:",
"mobx-utils": "catalog:",
"mobx": "catalog:",
"next-themes": "^0.2.1",
"posthog-js": "^1.131.3",
"posthog-js": "^1.255.1",
"react": "catalog:",
"react-color": "^2.19.3",
"react-dom": "catalog:",
"react-dropzone": "^14.2.3",
@ -63,9 +65,8 @@
"react-masonry-component": "^6.3.0",
"react-pdf-html": "^2.1.2",
"react-popper": "^2.3.0",
"react-router-dom": "^7.9.1",
"react-router": "^7.9.1",
"react": "catalog:",
"react-router-dom": "^7.9.1",
"recharts": "^2.12.7",
"serve": "14.2.5",
"smooth-scroll-into-view-if-needed": "^2.0.2",
@ -81,12 +82,12 @@
"@react-router/dev": "^7.9.1",
"@types/lodash-es": "catalog:",
"@types/node": "catalog:",
"@types/react": "catalog:",
"@types/react-color": "^3.0.6",
"@types/react-dom": "catalog:",
"@types/react": "catalog:",
"prettier": "^3.2.5",
"typescript": "catalog:",
"vite-tsconfig-paths": "^5.1.4",
"vite": "catalog:"
"vite": "catalog:",
"vite-tsconfig-paths": "^5.1.4"
}
}

102
pnpm-lock.yaml generated
View file

@ -135,7 +135,7 @@ importers:
version: link:../../packages/utils
'@react-router/node':
specifier: ^7.9.3
version: 7.9.4(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
version: 7.9.4(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
'@tanstack/react-virtual':
specifier: ^3.13.12
version: 3.13.12(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@ -168,7 +168,7 @@ importers:
version: 9.1.1(mobx@6.12.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
next-themes:
specifier: ^0.2.1
version: 0.2.1(next@14.2.32(@babel/core@7.28.4)(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
version: 0.2.1(next@14.2.32(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
react:
specifier: 'catalog:'
version: 18.3.1
@ -180,7 +180,7 @@ importers:
version: 7.51.5(react@18.3.1)
react-router:
specifier: ^7.9.1
version: 7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
version: 7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
react-router-dom:
specifier: ^7.9.1
version: 7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@ -205,7 +205,7 @@ importers:
version: link:../../packages/typescript-config
'@react-router/dev':
specifier: ^7.9.1
version: 7.9.4(@react-router/serve@7.9.5(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1)
version: 7.9.4(@react-router/serve@7.9.5(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1)
'@types/lodash-es':
specifier: 'catalog:'
version: 4.17.12
@ -425,7 +425,7 @@ importers:
version: 6.0.8(mobx@6.12.0)
next-themes:
specifier: ^0.2.1
version: 0.2.1(next@14.2.32(@babel/core@7.28.4)(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
version: 0.2.1(next@14.2.32(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
react:
specifier: 'catalog:'
version: 18.3.1
@ -541,6 +541,9 @@ importers:
'@popperjs/core':
specifier: ^2.11.8
version: 2.11.8
'@posthog/react':
specifier: ^1.4.0
version: 1.4.0(@types/react@18.3.11)(posthog-js@1.255.1)(react@18.3.1)
'@react-pdf/renderer':
specifier: ^3.4.5
version: 3.4.5(react@18.3.1)
@ -594,9 +597,9 @@ importers:
version: 6.0.8(mobx@6.12.0)
next-themes:
specifier: ^0.2.1
version: 0.2.1(next@14.2.32(@babel/core@7.28.4)(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
version: 0.2.1(next@14.2.32(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
posthog-js:
specifier: ^1.131.3
specifier: ^1.255.1
version: 1.255.1
react:
specifier: 'catalog:'
@ -2416,6 +2419,16 @@ packages:
'@popperjs/core@2.11.8':
resolution: {integrity: sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==}
'@posthog/react@1.4.0':
resolution: {integrity: sha512-xzPeZ753fQ0deZzdgY/0YavZvNpmdaxUzLYJYu5XjONNcZ8PwJnNLEK+7D/Cj8UM4Q8nWI7QC5mjum0uLWa4FA==}
peerDependencies:
'@types/react': '>=16.8.0'
posthog-js: '>=1.257.2'
react: '>=16.8.0'
peerDependenciesMeta:
'@types/react':
optional: true
'@prisma/instrumentation@6.13.0':
resolution: {integrity: sha512-b97b0sBycGh89RQcqobSgjGl3jwPaC5cQIOFod6EX1v0zIxlXPmL3ckSXxoHpy+Js0QV/tgCzFvqicMJCtezBA==}
peerDependencies:
@ -7282,16 +7295,6 @@ packages:
react-dom:
optional: true
react-router@7.9.4:
resolution: {integrity: sha512-SD3G8HKviFHg9xj7dNODUKDFgpG4xqD5nhyd0mYoB5iISepuZAvzSr8ywxgxKJ52yRzf/HWtVHc9AWwoTbljvA==}
engines: {node: '>=20.0.0'}
peerDependencies:
react: '>=18'
react-dom: '>=18'
peerDependenciesMeta:
react-dom:
optional: true
react-smooth@4.0.4:
resolution: {integrity: sha512-gnGKTpYwqL0Iii09gHobNolvX4Kiq4PKx6eWBCYYix+8cdw+cGo3do906l1NBPKkSWx1DghC1dlWG9L2uGd61Q==}
peerDependencies:
@ -9640,6 +9643,13 @@ snapshots:
'@popperjs/core@2.11.8': {}
'@posthog/react@1.4.0(@types/react@18.3.11)(posthog-js@1.255.1)(react@18.3.1)':
dependencies:
posthog-js: 1.255.1
react: 18.3.1
optionalDependencies:
'@types/react': 18.3.11
'@prisma/instrumentation@6.13.0(@opentelemetry/api@1.9.0)':
dependencies:
'@opentelemetry/api': 1.9.0
@ -10015,7 +10025,7 @@ snapshots:
- tsx
- yaml
'@react-router/dev@7.9.4(@react-router/serve@7.9.5(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1)':
'@react-router/dev@7.9.4(@react-router/serve@7.9.5(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1)':
dependencies:
'@babel/core': 7.28.4
'@babel/generator': 7.28.3
@ -10025,7 +10035,7 @@ snapshots:
'@babel/traverse': 7.28.4
'@babel/types': 7.28.4
'@npmcli/package-json': 4.0.1
'@react-router/node': 7.9.4(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
'@react-router/node': 7.9.4(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
'@remix-run/node-fetch-server': 0.9.0
arg: 5.0.2
babel-dead-code-elimination: 1.0.10
@ -10040,14 +10050,14 @@ snapshots:
picocolors: 1.1.1
prettier: 3.6.2
react-refresh: 0.14.2
react-router: 7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
react-router: 7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
semver: 7.7.2
tinyglobby: 0.2.15
valibot: 1.1.0(typescript@5.8.3)
vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)
vite-node: 3.2.4(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)
optionalDependencies:
'@react-router/serve': 7.9.5(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
'@react-router/serve': 7.9.5(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
typescript: 5.8.3
transitivePeerDependencies:
- '@types/node'
@ -10073,15 +10083,6 @@ snapshots:
optionalDependencies:
typescript: 5.8.3
'@react-router/express@7.9.5(express@4.21.2)(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)':
dependencies:
'@react-router/node': 7.9.5(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
express: 4.21.2
react-router: 7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
optionalDependencies:
typescript: 5.8.3
optional: true
'@react-router/node@7.9.3(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)':
dependencies:
'@mjackson/node-fetch-server': 0.2.0
@ -10096,13 +10097,6 @@ snapshots:
optionalDependencies:
typescript: 5.8.3
'@react-router/node@7.9.4(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)':
dependencies:
'@mjackson/node-fetch-server': 0.2.0
react-router: 7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
optionalDependencies:
typescript: 5.8.3
'@react-router/node@7.9.5(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)':
dependencies:
'@mjackson/node-fetch-server': 0.2.0
@ -10110,14 +10104,6 @@ snapshots:
optionalDependencies:
typescript: 5.8.3
'@react-router/node@7.9.5(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)':
dependencies:
'@mjackson/node-fetch-server': 0.2.0
react-router: 7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
optionalDependencies:
typescript: 5.8.3
optional: true
'@react-router/serve@7.9.5(react-router@7.9.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)':
dependencies:
'@mjackson/node-fetch-server': 0.2.0
@ -10133,22 +10119,6 @@ snapshots:
- supports-color
- typescript
'@react-router/serve@7.9.5(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)':
dependencies:
'@mjackson/node-fetch-server': 0.2.0
'@react-router/express': 7.9.5(express@4.21.2)(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
'@react-router/node': 7.9.5(react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3)
compression: 1.8.1
express: 4.21.2
get-port: 5.1.1
morgan: 1.10.1
react-router: 7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
source-map-support: 0.5.21
transitivePeerDependencies:
- supports-color
- typescript
optional: true
'@remirror/core-constants@3.0.0': {}
'@remix-run/node-fetch-server@0.9.0': {}
@ -14277,7 +14247,7 @@ snapshots:
neo-async@2.6.2: {}
next-themes@0.2.1(next@14.2.32(@babel/core@7.28.4)(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
next-themes@0.2.1(next@14.2.32(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
dependencies:
next: 14.2.32(@babel/core@7.28.4)(@opentelemetry/api@1.9.0)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
react: 18.3.1
@ -15112,14 +15082,6 @@ snapshots:
optionalDependencies:
react-dom: 18.3.1(react@18.3.1)
react-router@7.9.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
dependencies:
cookie: 1.0.2
react: 18.3.1
set-cookie-parser: 2.7.1
optionalDependencies:
react-dom: 18.3.1(react@18.3.1)
react-smooth@4.0.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1):
dependencies:
fast-equals: 5.2.2