Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add google analytics #153

Merged
merged 7 commits into from
Feb 29, 2024
Merged

Add google analytics #153

Show file tree
Hide file tree
Changes from 6 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
d5f3c2b
feat: add ga
swh00tw Feb 28, 2024
ea17b86
feat: use zod to parse client env vars
swh00tw Feb 28, 2024
0d20f7c
feat: use zod to parse server env
swh00tw Feb 28, 2024
6c40903
refactor: rename server env file
swh00tw Feb 28, 2024
efca748
fix: suppress weird error (import stuff from client component in RSC)
swh00tw Feb 28, 2024
aed63b3
Merge branch 'master' into feat/add-ga
swh00tw Feb 29, 2024
b81f166
fix: remove email testing list
swh00tw Feb 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 1 addition & 2 deletions apps/recnet/src/app/error.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,7 @@
import { cn } from "@/utils/cn";
import { Flex, Text } from "@radix-ui/themes";
import { RecNetLink } from "@/components/Link";

export const ReportEmailAccount = "[email protected]";
import { ReportEmailAccount } from "./not-found";

export default function NotFoundPage() {
return (
Expand Down
4 changes: 4 additions & 0 deletions apps/recnet/src/app/layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import "@radix-ui/themes/styles.css";
import "tailwindcss/tailwind.css";
import { MobileNavigator } from "./MobileNavigator";
import { ProgressbarProvider } from "./Progressbar";
import { GoogleAnalytics } from "@next/third-parties/google";

const sfpro = localFont({
src: [
Expand Down Expand Up @@ -121,6 +122,9 @@ export default async function RootLayout({
const user = await getUserServerSide();
return (
<html lang="en">
<GoogleAnalytics
gaId={process.env.NEXT_PUBLIC_GA_TRACKING_ID as string}
/>
<body className={sfpro.className}>
<ProgressbarProvider>
<AuthProvider serverUser={user}>
Expand Down
3 changes: 2 additions & 1 deletion apps/recnet/src/app/not-found.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
import { cn } from "@/utils/cn";
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[nit] change the filename to camel case

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ahh, that makes sense but actually this is kind of a frontend convention to name this file like this.

Ref:

import { Flex, Text } from "@radix-ui/themes";
import { RecNetLink } from "@/components/Link";
import { ReportEmailAccount } from "@/app/error";

export const ReportEmailAccount = "[email protected]";

export default function NotFoundPage() {
return (
Expand Down
6 changes: 0 additions & 6 deletions apps/recnet/src/clientConfig.ts
View file
Open in desktop

This file was deleted.

32 changes: 32 additions & 0 deletions apps/recnet/src/clientEnv.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
import { z } from "zod";

export const clientEnvSchema = z.object({
NEXT_PUBLIC_FIREBASE_API_KEY: z.string(),
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN: z.string(),
NEXT_PUBLIC_FIREBASE_PROJECT_ID: z.string(),
NEXT_PUBLIC_FIREBASE_APP_ID: z.string(),
NEXT_PUBLIC_GA_TRACKING_ID: z.string(),
});

const clientEnvRes = clientEnvSchema.safeParse({
NEXT_PUBLIC_FIREBASE_API_KEY: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN:
process.env.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,
NEXT_PUBLIC_FIREBASE_PROJECT_ID: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
NEXT_PUBLIC_FIREBASE_APP_ID: process.env.NEXT_PUBLIC_FIREBASE_APP_ID,
NEXT_PUBLIC_GA_TRACKING_ID: process.env.NEXT_PUBLIC_GA_TRACKING_ID,
});

if (!clientEnvRes.success) {
// console.error(clientEnvRes.error.issues);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[nit] do we need this?

Copy link
Collaborator Author

@swh00tw swh00tw Feb 29, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we should preserve this so that if other developers (assume we have other dev in our team) run the app on their local machine without proper .env, an error will be thrown to let them know. Plus, we can catch the env error when testing before merging into prod.

throw new Error("There is an error with the CLIENT environment variables");
}

export const clientEnv = clientEnvRes.data;

export const firebaseClientEnv = {
apiKey: clientEnvRes.data.NEXT_PUBLIC_FIREBASE_API_KEY,
authDomain: clientEnvRes.data.NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN,
projectId: clientEnvRes.data.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
appId: clientEnvRes.data.NEXT_PUBLIC_FIREBASE_APP_ID,
};
4 changes: 2 additions & 2 deletions apps/recnet/src/firebase/client.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
import { initializeApp, getApp, getApps } from "firebase/app";
import { getAuth } from "firebase/auth";
import { clientConfig } from "@/clientConfig";
import { firebaseClientEnv } from "@/clientEnv";

export const getFirebaseApp = () => {
if (getApps().length) {
return getApp();
}

const app = initializeApp(clientConfig);
const app = initializeApp(firebaseClientEnv);

return app;
};
Expand Down
2 changes: 1 addition & 1 deletion apps/recnet/src/middleware.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { NextRequest } from "next/server";
import { authMiddleware } from "next-firebase-auth-edge";
import { authConfig } from "./serverConfig";
import { authConfig } from "./serverEnv";

export async function middleware(request: NextRequest) {
return authMiddleware(request, {
Expand Down
23 changes: 0 additions & 23 deletions apps/recnet/src/serverConfig.ts
View file
Open in desktop

This file was deleted.

54 changes: 54 additions & 0 deletions apps/recnet/src/serverEnv.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
import { z } from "zod";

const serverConfigSchema = z.object({
USE_SECURE_COOKIES: z.coerce.boolean(),
COOKIE_SIGNATURE_KEY: z.string(),
FIREBASE_PRIVATE_KEY: z.string().transform((s) => s.replace(/\\n/gm, "\n")),
FIREBASE_CLIENT_EMAIL: z.string(),
CRON_SECRET: z.string(),
NEXT_PUBLIC_FIREBASE_API_KEY: z.string(),
NEXT_PUBLIC_FIREBASE_PROJECT_ID: z.string(),
});

const serverConfigRes = serverConfigSchema.safeParse({
USE_SECURE_COOKIES: process.env.USE_SECURE_COOKIES,
COOKIE_SIGNATURE_KEY: process.env.COOKIE_SIGNATURE_KEY,
FIREBASE_PRIVATE_KEY: process.env.FIREBASE_PRIVATE_KEY,
FIREBASE_CLIENT_EMAIL: process.env.FIREBASE_CLIENT_EMAIL,
CRON_SECRET: process.env.CRON_SECRET,
NEXT_PUBLIC_FIREBASE_API_KEY: process.env.NEXT_PUBLIC_FIREBASE_API_KEY,
NEXT_PUBLIC_FIREBASE_PROJECT_ID: process.env.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
});

if (!serverConfigRes.success) {
console.error(serverConfigRes.error.issues);
throw new Error("There is an error with the SERVER environment variables");
process.exit(1);
}

export const serverEnv = serverConfigRes.data;

const serverConfig = {
useSecureCookies: serverConfigRes.data.USE_SECURE_COOKIES,
firebaseApiKey: serverConfigRes.data.NEXT_PUBLIC_FIREBASE_API_KEY,
serviceAccount: {
projectId: serverConfigRes.data.NEXT_PUBLIC_FIREBASE_PROJECT_ID,
clientEmail: serverConfigRes.data.FIREBASE_CLIENT_EMAIL,
privateKey: serverConfigRes.data.FIREBASE_PRIVATE_KEY,
},
cookieSignatureKey: serverConfigRes.data.COOKIE_SIGNATURE_KEY,
};

export const authConfig = {
apiKey: serverConfig.firebaseApiKey,
cookieName: "AuthToken",
cookieSignatureKeys: [serverConfig.cookieSignatureKey],
cookieSerializeOptions: {
path: "/",
httpOnly: true,
secure: serverConfig.useSecureCookies, // Set this to true on HTTPS environments
sameSite: "lax" as const,
maxAge: 12 * 60 * 60 * 24, // twelve days
},
serviceAccount: serverConfig.serviceAccount,
};
2 changes: 1 addition & 1 deletion apps/recnet/src/utils/getUserServerSide.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import "server-only";
import { Tokens, getTokens } from "next-firebase-auth-edge";
import { cookies } from "next/headers";
import { authConfig } from "@/serverConfig";
import { authConfig } from "@/serverEnv";
import { User } from "@/types/user";
import { getUserByEmail } from "@/server/user";

Expand Down
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
"private": true,
"dependencies": {
"@hookform/resolvers": "^3.3.4",
"@next/third-parties": "^14.1.0",
"@radix-ui/react-icons": "^1.3.0",
"@radix-ui/react-select": "^2.0.0",
"@radix-ui/themes": "^2.0.3",
Expand Down
18 changes: 18 additions & 0 deletions pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading