3pp-mirror/rallly
1
0
Fork 0
mirror of https://github.com/lukevella/rallly.git synced 2025-07-29 06:07:25 +02:00
Code Issues Projects Releases Packages Wiki Activity

Page view

Browse source
This commit is contained in:
Luke Vella 2024-11-02 13:48:10 +00:00
parent 66ff75096a
commit 65a46e42aa
No known key found for this signature in database
GPG key ID: 469CAD687F0D784C
5 changed files with 156 additions and 112 deletions
Download patch file Download diff file Expand all files Collapse all files

217
apps/landing/src/app/[locale]/layout.tsx
View file

@ -2,6 +2,7 @@ import "tailwindcss/tailwind.css";
import "../../style.css"; import "../../style.css";
import languages from "@rallly/languages"; import languages from "@rallly/languages";
import { PostHogProvider } from "@rallly/posthog/client";
import { import {
DropdownMenu, DropdownMenu,
DropdownMenuContent, DropdownMenuContent,
@ -46,112 +47,118 @@ export default async function Root({
return ( return (
<html lang={locale} className={sans.className}> <html lang={locale} className={sans.className}>
<body> <body>
<I18nProvider locale={locale}> <PostHogProvider>
<div className="mx-auto flex min-h-full w-full max-w-7xl flex-col space-y-12 p-4 sm:p-8"> <I18nProvider locale={locale}>
<header className="flex w-full items-center"> <div className="mx-auto flex min-h-full w-full max-w-7xl flex-col space-y-12 p-4 sm:p-8">
<div className="flex grow items-center gap-x-12"> <header className="flex w-full items-center">
<Link className="inline-block rounded" href="/"> <div className="flex grow items-center gap-x-12">
<Image <Link className="inline-block rounded" href="/">
src="/logo.svg" <Image
width={130} src="/logo.svg"
height={30} width={130}
alt="rallly.co" height={30}
/> alt="rallly.co"
</Link> />
<nav className="hidden items-center space-x-8 lg:flex"> </Link>
<NavLink href="https://support.rallly.co/workflow/create"> <nav className="hidden items-center space-x-8 lg:flex">
<Trans t={t} i18nKey="howItWorks" defaults="How it Works" /> <NavLink href="https://support.rallly.co/workflow/create">
</NavLink> <Trans
<NavLink href="/pricing"> t={t}
<Trans t={t} i18nKey="pricing" /> i18nKey="howItWorks"
</NavLink> defaults="How it Works"
<NavLink href="/blog"> />
<Trans t={t} i18nKey="blog" /> </NavLink>
</NavLink> <NavLink href="/pricing">
<NavLink href="https://support.rallly.co"> <Trans t={t} i18nKey="pricing" />
<Trans t={t} i18nKey="support" /> </NavLink>
</NavLink> <NavLink href="/blog">
</nav> <Trans t={t} i18nKey="blog" />
</div> </NavLink>
<div className="flex items-center gap-4 sm:gap-8"> <NavLink href="https://support.rallly.co">
<Link <Trans t={t} i18nKey="support" />
href={linkToApp("/login")} </NavLink>
className="hover:text-primary text-muted-foreground hidden rounded text-sm font-medium hover:no-underline hover:underline-offset-2 lg:inline-flex" </nav>
>
<Trans t={t} i18nKey="login" defaults="Login" />
</Link>
<Link
href={linkToApp()}
className="bg-primary hover:bg-primary-500 active:bg-primary-700 group inline-flex items-center gap-1 rounded-full py-1.5 pl-4 pr-3 text-sm font-medium text-white shadow-sm transition-transform"
>
<span>
<Trans t={t} i18nKey="goToApp" defaults="Go to app" />
</span>
<ChevronRightIcon className="inline-block size-4 transition-all group-active:translate-x-1" />
</Link>
<div className="flex items-center justify-center lg:hidden">
<DropdownMenu>
<DropdownMenuTrigger>
<MenuIcon className="size-6" />
</DropdownMenuTrigger>
<DropdownMenuContent align="end" sideOffset={16}>
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href="https://support.rallly.co/workflow/create"
>
<Trans
t={t}
i18nKey="howItWorks"
defaults="How it Works"
/>
</Link>
</DropdownMenuItem>
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href="/pricing"
>
<Trans t={t} i18nKey="pricing" defaults="Pricing" />
</Link>
</DropdownMenuItem>
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href="/blog"
>
<Trans t={t} i18nKey="blog" />
</Link>
</DropdownMenuItem>
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href="https://support.rallly.co"
>
<Trans t={t} i18nKey="support" />
</Link>
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href={linkToApp("/login")}
>
<Trans t={t} i18nKey="login" defaults="Login" />
</Link>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div> </div>
</div> <div className="flex items-center gap-4 sm:gap-8">
</header> <Link
<section className="relative grow">{children}</section> href={linkToApp("/login")}
<hr className="border-transparent" /> className="hover:text-primary text-muted-foreground hidden rounded text-sm font-medium hover:no-underline hover:underline-offset-2 lg:inline-flex"
<footer> >
<Footer /> <Trans t={t} i18nKey="login" defaults="Login" />
</footer> </Link>
</div> <Link
</I18nProvider> href={linkToApp()}
className="bg-primary hover:bg-primary-500 active:bg-primary-700 group inline-flex items-center gap-1 rounded-full py-1.5 pl-4 pr-3 text-sm font-medium text-white shadow-sm transition-transform"
>
<span>
<Trans t={t} i18nKey="goToApp" defaults="Go to app" />
</span>
<ChevronRightIcon className="inline-block size-4 transition-all group-active:translate-x-1" />
</Link>
<div className="flex items-center justify-center lg:hidden">
<DropdownMenu>
<DropdownMenuTrigger>
<MenuIcon className="size-6" />
</DropdownMenuTrigger>
<DropdownMenuContent align="end" sideOffset={16}>
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href="https://support.rallly.co/workflow/create"
>
<Trans
t={t}
i18nKey="howItWorks"
defaults="How it Works"
/>
</Link>
</DropdownMenuItem>
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href="/pricing"
>
<Trans t={t} i18nKey="pricing" defaults="Pricing" />
</Link>
</DropdownMenuItem>
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href="/blog"
>
<Trans t={t} i18nKey="blog" />
</Link>
</DropdownMenuItem>
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href="https://support.rallly.co"
>
<Trans t={t} i18nKey="support" />
</Link>
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem asChild>
<Link
className="flex items-center gap-3 p-2 text-lg"
href={linkToApp("/login")}
>
<Trans t={t} i18nKey="login" defaults="Login" />
</Link>
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</div>
</div>
</header>
<section className="relative grow">{children}</section>
<hr className="border-transparent" />
<footer>
<Footer />
</footer>
</div>
</I18nProvider>
</PostHogProvider>
<Analytics /> <Analytics />
</body> </body>
</html> </html>

6
apps/web/src/app/[locale]/layout.tsx
View file

@ -4,6 +4,7 @@ import "../../style.css";
import { PostHogProvider } from "@rallly/posthog/client"; import { PostHogProvider } from "@rallly/posthog/client";
import { Toaster } from "@rallly/ui/toaster"; import { Toaster } from "@rallly/ui/toaster";
import type { Viewport } from "next"; import type { Viewport } from "next";
import dynamic from "next/dynamic";
import { Inter } from "next/font/google"; import { Inter } from "next/font/google";
import React from "react"; import React from "react";
@ -12,6 +13,10 @@ import { Providers } from "@/app/providers";
import { getServerSession } from "@/auth"; import { getServerSession } from "@/auth";
import { SessionProvider } from "@/auth/session-provider"; import { SessionProvider } from "@/auth/session-provider";
const PostHogPageView = dynamic(() => import("@rallly/posthog/next"), {
ssr: false,
});
const inter = Inter({ const inter = Inter({
subsets: ["latin"], subsets: ["latin"],
display: "swap", display: "swap",
@ -38,6 +43,7 @@ export default async function Root({
<Toaster /> <Toaster />
<SessionProvider session={session}> <SessionProvider session={session}>
<PostHogProvider distinctId={session?.user?.id}> <PostHogProvider distinctId={session?.user?.id}>
<PostHogPageView />
<Providers> <Providers>
{children} {children}
<TimeZoneChangeDetector /> <TimeZoneChangeDetector />

8
packages/posthog/package.json
View file

@ -8,13 +8,15 @@
}, },
"exports": { "exports": {
"./server": "./src/server/index.ts", "./server": "./src/server/index.ts",
"./client": "./src/client/index.ts" "./client": "./src/client/index.ts",
"./next": "./src/next.ts"
}, },
"dependencies": { "dependencies": {
"posthog-js": "^1.178.0", "posthog-js": "^1.180.1",
"posthog-node": "^4.2.1" "posthog-node": "^4.2.1"
}, },
"peerDependencies": { "peerDependencies": {
"react": "^18.2.0" "react": "^18.2.0",
"next": "^14.2.13"
} }
} }

29
packages/posthog/src/next.ts Normal file
View file

@ -0,0 +1,29 @@
"use client";
import { usePathname, useSearchParams } from "next/navigation";
import React from "react";
import { usePostHog } from "./client";
export default function PostHogPageView() {
const pathname = usePathname();
const searchParams = useSearchParams();
const posthog = usePostHog();
const previousUrl = React.useRef<string | null>(null);
React.useEffect(() => {
// Track pageviews
if (pathname && posthog) {
let url = window.origin + pathname;
if (searchParams?.toString()) {
url = url + `?${searchParams.toString()}`;
}
if (previousUrl.current !== url) {
posthog.capture("$pageview", {
$current_url: url,
});
previousUrl.current = url;
}
}
}, [pathname, searchParams, posthog]);
return null;
}

8
yarn.lock
View file

@ -12817,10 +12817,10 @@ postgres-range@^1.1.1:
resolved "https://registry.yarnpkg.com/postgres-range/-/postgres-range-1.1.4.tgz#a59c5f9520909bcec5e63e8cf913a92e4c952863" resolved "https://registry.yarnpkg.com/postgres-range/-/postgres-range-1.1.4.tgz#a59c5f9520909bcec5e63e8cf913a92e4c952863"
integrity sha512-i/hbxIE9803Alj/6ytL7UHQxRvZkI9O4Sy+J3HGc4F4oo/2eQAjTSNJ0bfxyse3bH0nuVesCk+3IRLaMtG3H6w== integrity sha512-i/hbxIE9803Alj/6ytL7UHQxRvZkI9O4Sy+J3HGc4F4oo/2eQAjTSNJ0bfxyse3bH0nuVesCk+3IRLaMtG3H6w==
posthog-js@^1.178.0: posthog-js@^1.180.1:
version "1.178.0" version "1.180.1"
resolved "https://registry.yarnpkg.com/posthog-js/-/posthog-js-1.178.0.tgz#80005798e6c67d4d6565a5648939a0f017b0879b" resolved "https://registry.yarnpkg.com/posthog-js/-/posthog-js-1.180.1.tgz#e4b1bb2917b306f40c6063102a1508539f44ba2a"
integrity sha512-ILD4flNh72d5dycc4ZouKORlaVr+pDzl5TlZr1JgP0NBAoduHjhE7XZYwk7zdYkry7u0qAIpfv2306zJCW2vGg== integrity sha512-LV65maVrpqkAh0wu32YvU7FpCSEjg6o+sZFYCs1+6tnEa9VvXuz8J6ReLiyRpJABI4j1qX/PB2jaVY5tDbLalQ==
dependencies: dependencies:
core-js "^3.38.1" core-js "^3.38.1"
fflate "^0.4.8" fflate "^0.4.8"