From 796d866a33cb5a56bb28ba28532793424385f2ee Mon Sep 17 00:00:00 2001 From: Andres Date: Wed, 17 Jul 2024 01:13:25 +0200 Subject: [PATCH] add analytics --- .idea/git_toolbox_blame.xml | 6 ++++++ app/entry.client.tsx | 23 ++++++++++++++++++----- app/root.tsx | 28 +++++++++++++++++++++++++--- package.json | 1 + pnpm-lock.yaml | 27 +++++++++++++++++++++++++++ 5 files changed, 77 insertions(+), 8 deletions(-) create mode 100644 .idea/git_toolbox_blame.xml diff --git a/.idea/git_toolbox_blame.xml b/.idea/git_toolbox_blame.xml new file mode 100644 index 0000000..7dc1249 --- /dev/null +++ b/.idea/git_toolbox_blame.xml @@ -0,0 +1,6 @@ + + + + + \ No newline at end of file diff --git a/app/entry.client.tsx b/app/entry.client.tsx index 94d5dc0..d672c4f 100644 --- a/app/entry.client.tsx +++ b/app/entry.client.tsx @@ -4,15 +4,28 @@ * For more information, see https://remix.run/file-conventions/entry.client */ -import { RemixBrowser } from "@remix-run/react"; -import { startTransition, StrictMode } from "react"; -import { hydrateRoot } from "react-dom/client"; +import { RemixBrowser } from '@remix-run/react' +import { startTransition, StrictMode, useEffect } from 'react' +import { hydrateRoot } from 'react-dom/client' +import posthog from 'posthog-js' +function PosthogInit() { + useEffect(() => { + posthog.init(import.meta.env.VITE_PH_API_KEY, { + api_host: import.meta.env.VITE_PH_API_HOST, + person_profiles: 'identified_only', + capture_pageview: false, + }) + }, []) + + return null +} startTransition(() => { hydrateRoot( document, + - ); -}); + ) +}) diff --git a/app/root.tsx b/app/root.tsx index 91ae26b..ec86cc0 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -1,7 +1,16 @@ import { LinksFunction } from '@remix-run/node' -import { Link, Links, Meta, Outlet, Scripts, ScrollRestoration } from '@remix-run/react' +import { + Link, + Links, + Meta, + Outlet, + Scripts, + ScrollRestoration, + useLocation, +} from '@remix-run/react' import stylesheet from '~/tailwind.css?url' -import { PropsWithChildren } from 'react' +import { PropsWithChildren, useEffect } from 'react' +import posthog from 'posthog-js' export const links: LinksFunction = () => [{ rel: 'stylesheet', href: stylesheet }] @@ -35,5 +44,18 @@ export function Layout({ children }: PropsWithChildren) { } export default function App() { - return + return ( + <> + + + + ) +} + +function CapturePageView() { + const location = useLocation() + useEffect(() => { + posthog.capture('$pageview') + }, [location]) + return null } diff --git a/package.json b/package.json index 5b0e2f7..0b77159 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "@tremor/react": "^3.17.2", "clsx": "^2.1.1", "isbot": "^4.1.0", + "posthog-js": "^1.148.0", "react": "^18.2.0", "react-dom": "^18.2.0", "tailwind-merge": "^2.3.0" diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 2d430b2..e36ca26 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -38,6 +38,9 @@ importers: isbot: specifier: ^4.1.0 version: 4.4.0 + posthog-js: + specifier: ^1.148.0 + version: 1.148.0 react: specifier: ^18.2.0 version: 18.3.1 @@ -2013,6 +2016,9 @@ packages: fault@2.0.1: resolution: {integrity: sha512-WtySTkS4OKev5JtpHXnib4Gxiurzh5NCGvWrFaZ34m6JehfTUhKZvn9njTfw48t6JumVQOmrKqpmGcdwxnhqBQ==} + fflate@0.4.8: + resolution: {integrity: sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA==} + file-entry-cache@6.0.1: resolution: {integrity: sha512-7Gps/XWymbLk2QLYK4NzpMOrYjMhdIxXuIvy2QBsLE6ljuodKvdkWs/cpyJJ3CVIVpH0Oi1Hvg1ovbMzLdFBBg==} engines: {node: ^10.12.0 || >=12.0.0} @@ -3105,6 +3111,12 @@ packages: resolution: {integrity: sha512-Wglpdk03BSfXkHoQa3b/oulrotAkwrlLDRSOb9D0bN86FdRyE9lppSp33aHNPgBa0JKCoB+drFLZkQoRRYae5A==} engines: {node: ^10 || ^12 || >=14} + posthog-js@1.148.0: + resolution: {integrity: sha512-nydf+aret26YViDBwH7DdN/c8dmCzQGNQ1yredeE47UlbpJ3J/iTgskNdmGJIofFcdSagcwAE/FF7s++YfTtvg==} + + preact@10.22.1: + resolution: {integrity: sha512-jRYbDDgMpIb5LHq3hkI0bbl+l/TQ9UnkdQ0ww+lp+4MMOdqaUYdFc5qeyP+IV8FAd/2Em7drVPeKdQxsiWCf/A==} + prelude-ls@1.2.1: resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==} engines: {node: '>= 0.8.0'} @@ -3815,6 +3827,9 @@ packages: resolution: {integrity: sha512-d2JWLCivmZYTSIoge9MsgFCZrt571BikcWGYkjC1khllbTeDlGqZ2D8vD8E/lJa8WGWbb7Plm8/XJYV7IJHZZw==} engines: {node: '>= 8'} + web-vitals@4.2.1: + resolution: {integrity: sha512-U6bAxeudnhDqcXNl50JC4hLlqox9DZnngxfISZm3DMZnonW35xtJOVUc091L+DOY+6hVZVpKXoiCP0RiT6339Q==} + which-boxed-primitive@1.0.2: resolution: {integrity: sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==} @@ -6076,6 +6091,8 @@ snapshots: dependencies: format: 0.2.2 + fflate@0.4.8: {} + file-entry-cache@6.0.1: dependencies: flat-cache: 3.2.0 @@ -7323,6 +7340,14 @@ snapshots: picocolors: 1.0.1 source-map-js: 1.2.0 + posthog-js@1.148.0: + dependencies: + fflate: 0.4.8 + preact: 10.22.1 + web-vitals: 4.2.1 + + preact@10.22.1: {} + prelude-ls@1.2.1: {} prettier@2.8.8: {} @@ -8182,6 +8207,8 @@ snapshots: web-streams-polyfill@3.3.3: {} + web-vitals@4.2.1: {} + which-boxed-primitive@1.0.2: dependencies: is-bigint: 1.0.4