From 67b342cdde0d0847a9a5e266f66289217fe4e5d4 Mon Sep 17 00:00:00 2001 From: Jamil Bou Kheir Date: Fri, 9 Jun 2023 15:24:07 -0700 Subject: [PATCH] Add PostHog... maybe\? --- website/.gitignore | 1 + website/package.json | 1 + website/pnpm-lock.yaml | 13 +++ website/src/app/blog/page.tsx | 8 +- website/src/app/providers.jsx | 31 +++++ website/src/components/Blog/Post/index.tsx | 114 +------------------ website/src/components/DocsSidebar/index.tsx | 2 +- website/src/components/Footer/index.tsx | 7 +- website/src/components/RootLayout/index.tsx | 17 +-- 9 files changed, 71 insertions(+), 123 deletions(-) create mode 100644 website/src/app/providers.jsx diff --git a/website/.gitignore b/website/.gitignore index 8f322f0d8f4..45c1abce864 100644 --- a/website/.gitignore +++ b/website/.gitignore @@ -26,6 +26,7 @@ yarn-error.log* # local env files .env*.local +.env # vercel .vercel diff --git a/website/package.json b/website/package.json index e082e60f9e5..f88a7c55edb 100644 --- a/website/package.json +++ b/website/package.json @@ -24,6 +24,7 @@ "highlight.js": "^11.8.0", "next": "13.4.4", "postcss": "8.4.23", + "posthog-js": "^1.67.1", "react": "18.2.0", "react-dom": "18.2.0", "react-markdown": "^8.0.7", diff --git a/website/pnpm-lock.yaml b/website/pnpm-lock.yaml index 63c9368d7dd..c8064aeaa34 100644 --- a/website/pnpm-lock.yaml +++ b/website/pnpm-lock.yaml @@ -50,6 +50,9 @@ dependencies: postcss: specifier: 8.4.23 version: 8.4.23 + posthog-js: + specifier: ^1.67.1 + version: 1.67.1 react: specifier: 18.2.0 version: 18.2.0 @@ -946,6 +949,10 @@ packages: format: 0.2.2 dev: false + /fflate@0.4.8: + resolution: {integrity: sha512-FJqqoDBR00Mdj9ppamLa/Y7vxm+PRmNWA67N846RvsoYVMKB4q3y/de5PA7gUmRMYK/8CMz2GDZQmCRN1wBcWA==} + dev: false + /fill-range@7.0.1: resolution: {integrity: sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==} engines: {node: '>=8'} @@ -2116,6 +2123,12 @@ packages: picocolors: 1.0.0 source-map-js: 1.0.2 + /posthog-js@1.67.1: + resolution: {integrity: sha512-gvdCVrrxoRYbtNTCUt2/YdZ+tfSfzcl72ym/dtRVCYJpwlCUIKnNJ3E2g7Bbw1+Ki6CvGxdu9r7jHIWnvJAMuw==} + dependencies: + fflate: 0.4.8 + dev: false + /prop-types@15.8.1: resolution: {integrity: sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==} dependencies: diff --git a/website/src/app/blog/page.tsx b/website/src/app/blog/page.tsx index fb11d2e5582..2161338bfca 100644 --- a/website/src/app/blog/page.tsx +++ b/website/src/app/blog/page.tsx @@ -34,9 +34,9 @@ export default function Page() { xmlns="http://www.w3.org/2000/svg" > @@ -86,9 +86,9 @@ export default function Page() { xmlns="http://www.w3.org/2000/svg" > diff --git a/website/src/app/providers.jsx b/website/src/app/providers.jsx new file mode 100644 index 00000000000..0ec8df826f6 --- /dev/null +++ b/website/src/app/providers.jsx @@ -0,0 +1,31 @@ +"use client"; + +import posthog from "posthog-js"; +import { PostHogProvider } from "posthog-js/react"; +import { usePathname, useSearchParams } from "next/navigation"; +import { useEffect } from "react"; + +if (typeof window !== "undefined") { + posthog.init(process.env.NEXT_PUBLIC_POSTHOG_KEY, { + api_host: process.env.NEXT_PUBLIC_POSTHOG_HOST, + }); +} + +export default function PHProvider({ children }) { + const pathname = usePathname(); + const searchParams = useSearchParams(); + // Track pageviews + useEffect(() => { + if (pathname) { + let url = window.origin + pathname; + if (searchParams.toString()) { + url = url + `?${searchParams.toString()}`; + } + posthog.capture("$pageview", { + $current_url: url, + }); + } + }, [pathname, searchParams]); + + return {children}; +} diff --git a/website/src/components/Blog/Post/index.tsx b/website/src/components/Blog/Post/index.tsx index f095a7becb9..7362cc4ca55 100644 --- a/website/src/components/Blog/Post/index.tsx +++ b/website/src/components/Blog/Post/index.tsx @@ -66,114 +66,8 @@ export default function Post({ - + + {/* TODO: Related articles (see flowbite blocks) */}
@@ -182,8 +76,8 @@ export default function Post({ Sign up for our newsletter

- Stay up to date with the roadmap progress, announcements and - exclusive discounts feel free to sign up with your email. + Sign up with your email to receive roadmap updates, how-tos, and + product announcements from the Firezone team.

diff --git a/website/src/components/DocsSidebar/index.tsx b/website/src/components/DocsSidebar/index.tsx index 5688fef4990..91cb03fb378 100644 --- a/website/src/components/DocsSidebar/index.tsx +++ b/website/src/components/DocsSidebar/index.tsx @@ -19,7 +19,7 @@ export default function DocsSidebar() { id="docs-sidebar" aria-label="Sidebar" aria-hidden="true" - className="sticky top-0 w-64 h-screen pt-24 transition-transform -translate-x-full bg-white border-r border-gray-200 md:translate-x-0 dark:bg-gray-800 dark:border-gray-700" + className="sticky left-0 top-0 w-64 h-screen pt-24 transition-transform -translate-x-full bg-white border-r border-gray-200 md:translate-x-0 dark:bg-gray-800 dark:border-gray-700" >
diff --git a/website/src/components/Footer/index.tsx b/website/src/components/Footer/index.tsx index a7494f1824b..57e17bd7188 100644 --- a/website/src/components/Footer/index.tsx +++ b/website/src/components/Footer/index.tsx @@ -58,11 +58,16 @@ export default function Footer() { Blog -
  • +
  • Contact
    • +
  • + + Newsletter + +
    • diff --git a/website/src/components/RootLayout/index.tsx b/website/src/components/RootLayout/index.tsx index d5fa8b99742..f69bab113fb 100644 --- a/website/src/components/RootLayout/index.tsx +++ b/website/src/components/RootLayout/index.tsx @@ -2,6 +2,7 @@ import { Metadata } from "next"; import "@/app/globals.css"; import "highlight.js/styles/default.css"; import RootNavbar from "@/components/RootNavbar"; +import Providers from "@/app/Providers"; import Footer from "@/components/Footer"; import { Source_Sans_Pro } from "next/font/google"; const source_sans_pro = Source_Sans_Pro({ @@ -16,13 +17,15 @@ export default function RootLayout({ }) { return ( - -
    - - {children} -
    -
    - + + +
    + + {children} +
    + +     ); }