Skip to content

Commit

Permalink
Addition of PostHog 404 handler for additional insights.
Browse files Browse the repository at this point in the history
  • Loading branch information
@travelton
travelton committed Aug 26, 2024
1 parent b053138 commit 920ab52
Show file tree
Hide file tree
Showing 2 changed files with 59 additions and 19 deletions.
72 changes: 54 additions & 18 deletions pages/404.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,27 +1,63 @@
// 404.js

import Link from "next/link";
import { sendPageNotFoundError } from "utils/posthog";
import { useEffect } from "react";
import SiteHeader from "components/Header";
import Footer from "layouts/DocsPage/Footer";

export default function FourOhFour() {
useEffect(() => {
void sendPageNotFoundError(); // Report Error to PostHog for tracking
}, []);

return (
<div style={{ textAlign: 'center', padding: '50px' }}>
<h1>404 Page Not Found</h1>
<p>Sorry, we couldn&apos;t find that page</p>
<p>We couldn&apos;t find the page you were looking for.</p>
<h2>Pages you may find useful</h2>
<ul style={{ listStyleType: 'none', padding: 0 }}>
<li><a href="/">Home Page</a></li>
<li><Link href="/about">About Us</Link></li>
<li><Link href="/blog">Blog</Link></li>
<li><Link href="/Support">Customer Support</Link></li>
<li><Link href="/">Documentation</Link></li>
<li><Link href="installation">Installation</Link></li>
<li><Link href="server-access">Teleport Server Access</Link></li>
<li><Link href="kubernetes-access">Teleport Kubernetes Access</Link></li>
<li><Link href="database-access">Teleport Database Access</Link></li>
<li><Link href="desktop-access">Teleport Desktop Access</Link></li>
<li><Link href="application-access">Teleport Application Access</Link></li>
</ul>
<div>
<SiteHeader />
<div style={{ textAlign: "center", padding: "50px" }}>
<h1>404 Page Not Found</h1>
<p>Sorry, we couldn&apos;t find that page</p>
<p>
Go back to Documentation <Link href="/">home</Link>?
</p>
<h2>Other pages you may find useful</h2>
<ul style={{ listStyleType: "none", padding: 0 }}>
<li>
<a href="/">Home Page</a>
</li>
<li>
<Link href="/about">About Us</Link>
</li>
<li>
<Link href="/blog">Blog</Link>
</li>
<li>
<Link href="/Support">Customer Support</Link>
</li>
<li>
<Link href="/">Documentation</Link>
</li>
<li>
<Link href="installation">Installation</Link>
</li>
<li>
<Link href="server-access">Teleport Server Access</Link>
</li>
<li>
<Link href="kubernetes-access">Teleport Kubernetes Access</Link>
</li>
<li>
<Link href="database-access">Teleport Database Access</Link>
</li>
<li>
<Link href="desktop-access">Teleport Desktop Access</Link>
</li>
<li>
<Link href="application-access">Teleport Application Access</Link>
</li>
</ul>
</div>
<Footer section={true}></Footer>
</div>
);
}
6 changes: 5 additions & 1 deletion utils/posthog.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ export const posthog = async (): Promise<PostHog | undefined> => {

return;
}

if (PH_IS_ENABLED && PH_API_URL && PH_API_KEY) {
posthogGlobal.init(PH_API_KEY, {
api_host: PH_API_URL,
Expand All @@ -41,6 +40,11 @@ export const sendPageview = async () => {
ph?.capture("$pageview");
};

export const sendPageNotFoundError = async () => {
const ph = await posthog();
ph?.capture("web.errors.pageNotFound");
};

export const sendDocsFeedback = async (rating: string, comment: string) => {
const ph = await posthog();

Expand Down

0 comments on commit 920ab52

Please sign in to comment.