[feat] Add env.mjs (#9)

* Add env.mjs * Fix base path
calblueprint · Jan 17, 2025 · 1bb9e21 · 1bb9e21
1 parent e897c6a
commit 1bb9e21
Show file tree

Hide file tree

Showing 11 changed files with 112 additions and 9 deletions.
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -2,6 +2,9 @@ name: Build Next.js app
 on:
   pull_request:
 
+env:
+  NEXT_PUBLIC_BASE_PATH: /${{ github.repository }}
+
 jobs:
   build:
     runs-on: ubuntu-latest

diff --git a/.github/workflows/nextjs.yml b/.github/workflows/nextjs.yml
@@ -25,7 +25,7 @@ concurrency:
   cancel-in-progress: false
 
 env:
-  BASE_PATH: ${{ github.repository }}
+  NEXT_PUBLIC_BASE_PATH: ${{ github.repository }}
 
 jobs:
   # Build job

diff --git a/app/(default-layout)/projects/[name]/page.tsx b/app/(default-layout)/projects/[name]/page.tsx
@@ -4,6 +4,7 @@ import Link from 'next/link';
 import { ProjectData } from '@/app/(hero-layout)/projects/page';
 import ProjectDescription from '@/components/ProjectDescription/ProjectDescription';
 import projects from '@/data/projects.json';
+import { env } from '@/env.mjs';
 
 type ProjectDetailsPageProps = {
   params: Promise<{ name: string }>;
@@ -24,7 +25,7 @@ export default async function ProjectDetailsPage({
   const data = projectList[name as keyof typeof projectList] as ProjectData;
   let imageSrc = data.banner_image;
   if (!data.banner_image.includes('http')) {
-    imageSrc = '/' + data.banner_image;
+    imageSrc = env.NEXT_PUBLIC_BASE_PATH + data.banner_image;
   }
 
   return (

diff --git a/app/(hero-layout)/chapters/page.tsx b/app/(hero-layout)/chapters/page.tsx
@@ -6,6 +6,7 @@ import HeroButton from '@/components/HeroButton/HeroButton';
 import PageNav from '@/components/PageNav/PageNav';
 import chapters from '@/data/chapters.json';
 import externalLinks from '@/data/external_links.json';
+import { env } from '@/env.mjs';
 import impactImage from '@/public/images/apply/nonprofits/impact.png';
 import cultureImage from '@/public/images/apply/students/culture.png';
 import growthImage from '@/public/images/apply/students/growth.png';
@@ -61,7 +62,7 @@ export default function ChapterPage() {
                   <Image
                     sizes="100vw"
                     fill
-                    src={'/' + chapter.image}
+                    src={env.NEXT_PUBLIC_BASE_PATH + chapter.image}
                     alt={chapter.name}
                     objectFit="cover"
                   />

diff --git a/app/(hero-layout)/page.tsx b/app/(hero-layout)/page.tsx
@@ -4,6 +4,7 @@ import Link from 'next/link';
 import CenteredHero from '@/components/Hero/CenteredHero';
 import HeroButton from '@/components/HeroButton/HeroButton';
 import projects from '@/data/projects.json';
+import { env } from '@/env.mjs';
 import bidsImage from '@/public/images/home/bids.png';
 import groupPhoto from '@/public/images/home/group_photo_2024.jpg';
 import nibImage from '@/public/images/home/nib.png';
@@ -87,7 +88,7 @@ export default function HomePage() {
                   <div className="project-img img-container">
                     <Image
                       alt={projectData.title}
-                      src={'/' + projectData.banner_image}
+                      src={env.NEXT_PUBLIC_BASE_PATH + projectData.banner_image}
                       fill
                     />
                   </div>

diff --git a/components/ProjectCard/ProjectCard.tsx b/components/ProjectCard/ProjectCard.tsx
@@ -1,5 +1,6 @@
 import Image from 'next/image';
 import Link from 'next/link';
+import { env } from '@/env.mjs';
 
 type ProjectCardProps = {
   name: string;
@@ -18,7 +19,7 @@ export default async function ProjectCard({
 }: ProjectCardProps) {
   let imageSrc = banner_image;
   if (!banner_image.includes('http')) {
-    imageSrc = '/' + banner_image;
+    imageSrc = env.NEXT_PUBLIC_BASE_PATH + banner_image;
   }
 
   return (

diff --git a/env.mjs b/env.mjs
@@ -0,0 +1,8 @@
+import { createEnv } from '@t3-oss/env-nextjs';
+import { z } from 'zod';
+
+export const env = createEnv({
+  client: {
+    NEXT_PUBLIC_BASE_PATH: z.string().default(''),
+  },
+});
diff --git a/next.config.ts b/next.config.ts
@@ -1,7 +1,7 @@
 import type { NextConfig } from 'next';
 
 const nextConfig: NextConfig = {
-  basePath: '/' + (process.env.BASE_PATH || 'calblueprint.org.v2'),
+  basePath: process.env.NEXT_PUBLIC_BASE_PATH || '',
   images: {
     dangerouslyAllowSVG: true,
     contentSecurityPolicy: "default-src 'self'; script-src 'none'; sandbox;",

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@ianvs/prettier-plugin-sort-imports": "^4.4.1",
+    "@t3-oss/env-nextjs": "^0.11.1",
     "bootstrap": "^5.3.3",
     "crypto-js": "^4.2.0",
     "next": "15.1.4",
@@ -19,7 +20,8 @@
     "react-dom": "^19.0.0",
     "react-icons": "^5.4.0",
     "react-markdown": "^9.0.3",
-    "sass": "^1.83.4"
+    "sass": "^1.83.4",
+    "zod": "^3.24.1"
   },
   "devDependencies": {
     "@eslint/eslintrc": "^3",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
-Original file line number
+Diff line change
@@ Expand Up / @@ -2,6 +2,9 @@ name: Build Next.js app @@
     on:
       pull_request:
+    env:
+      NEXT_PUBLIC_BASE_PATH: /${{ github.repository }}
     jobs:
       build:
         runs-on: ubuntu-latest
@@ Expand Down @@