From 1bb9e21f288d7b5e309881f1927a3715e449415c Mon Sep 17 00:00:00 2001 From: Aditya Pawar <34043950+adityapawar1@users.noreply.github.com> Date: Thu, 16 Jan 2025 23:24:49 -0800 Subject: [PATCH] [feat] Add env.mjs (#9) * Add env.mjs * Fix base path --- .github/workflows/build.yml | 3 ++ .github/workflows/nextjs.yml | 2 +- app/(default-layout)/projects/[name]/page.tsx | 3 +- app/(hero-layout)/chapters/page.tsx | 3 +- app/(hero-layout)/page.tsx | 3 +- components/ProjectCard/ProjectCard.tsx | 3 +- env.mjs | 8 ++++ next.config.ts | 2 +- package-lock.json | 48 ++++++++++++++++++- package.json | 4 +- pnpm-lock.yaml | 42 ++++++++++++++++ 11 files changed, 112 insertions(+), 9 deletions(-) create mode 100644 env.mjs diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index c50eb6e..fe44e5b 100644 --- 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 index d18d7f8..5cf1d99 100644 --- 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 index 6d88ace..abc23ef 100644 --- 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 index abffbd7..ccb9c45 100644 --- 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() { {chapter.name} diff --git a/app/(hero-layout)/page.tsx b/app/(hero-layout)/page.tsx index 8174c4c..bb3d75c 100644 --- 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() {
{projectData.title}
diff --git a/components/ProjectCard/ProjectCard.tsx b/components/ProjectCard/ProjectCard.tsx index e2f1698..26f6ace 100644 --- 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 new file mode 100644 index 0000000..364052f --- /dev/null +++ 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 index 1e312fa..ad385ff 100644 --- 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 index 0bbd10a..d7b0842 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "0.1.0", "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", @@ -18,7 +19,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", @@ -1434,6 +1436,39 @@ "tslib": "^2.8.0" } }, + "node_modules/@t3-oss/env-core": { + "version": "0.11.1", + "resolved": "https://registry.npmjs.org/@t3-oss/env-core/-/env-core-0.11.1.tgz", + "integrity": "sha512-MaxOwEoG1ntCFoKJsS7nqwgcxLW1SJw238AJwfJeaz3P/8GtkxXZsPPolsz1AdYvUTbe3XvqZ/VCdfjt+3zmKw==", + "license": "MIT", + "peerDependencies": { + "typescript": ">=5.0.0", + "zod": "^3.0.0" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, + "node_modules/@t3-oss/env-nextjs": { + "version": "0.11.1", + "resolved": "https://registry.npmjs.org/@t3-oss/env-nextjs/-/env-nextjs-0.11.1.tgz", + "integrity": "sha512-rx2XL9+v6wtOqLNJbD5eD8OezKlQD1BtC0WvvtHwBgK66jnF5+wGqtgkKK4Ygie1LVmoDClths2T4tdFmRvGrQ==", + "license": "MIT", + "dependencies": { + "@t3-oss/env-core": "0.11.1" + }, + "peerDependencies": { + "typescript": ">=5.0.0", + "zod": "^3.0.0" + }, + "peerDependenciesMeta": { + "typescript": { + "optional": true + } + } + }, "node_modules/@types/debug": { "version": "4.1.12", "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.12.tgz", @@ -7413,7 +7448,7 @@ "version": "5.7.3", "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.3.tgz", "integrity": "sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==", - "dev": true, + "devOptional": true, "license": "Apache-2.0", "bin": { "tsc": "bin/tsc", @@ -7840,6 +7875,15 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/zod": { + "version": "3.24.1", + "resolved": "https://registry.npmjs.org/zod/-/zod-3.24.1.tgz", + "integrity": "sha512-muH7gBL9sI1nciMZV67X5fTKKBLtwpZ5VBp1vsOQzj1MhrBZ4wlVCm3gedKZWLp0Oyel8sIGfeiz54Su+OVT+A==", + "license": "MIT", + "funding": { + "url": "https://github.com/sponsors/colinhacks" + } + }, "node_modules/zwitch": { "version": "2.0.4", "resolved": "https://registry.npmjs.org/zwitch/-/zwitch-2.0.4.tgz", diff --git a/package.json b/package.json index 1cd9f52..064b5c5 100644 --- 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 index fcacfd3..875734c 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,6 +11,9 @@ importers: '@ianvs/prettier-plugin-sort-imports': specifier: ^4.4.1 version: 4.4.1(prettier@3.4.2) + '@t3-oss/env-nextjs': + specifier: ^0.11.1 + version: 0.11.1(typescript@5.7.3)(zod@3.24.1) bootstrap: specifier: ^5.3.3 version: 5.3.3(@popperjs/core@2.11.8) @@ -41,6 +44,9 @@ importers: sass: specifier: ^1.83.4 version: 1.83.4 + zod: + specifier: ^3.24.1 + version: 3.24.1 devDependencies: '@eslint/eslintrc': specifier: ^3 @@ -499,6 +505,24 @@ packages: '@swc/helpers@0.5.15': resolution: {integrity: sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==} + '@t3-oss/env-core@0.11.1': + resolution: {integrity: sha512-MaxOwEoG1ntCFoKJsS7nqwgcxLW1SJw238AJwfJeaz3P/8GtkxXZsPPolsz1AdYvUTbe3XvqZ/VCdfjt+3zmKw==} + peerDependencies: + typescript: '>=5.0.0' + zod: ^3.0.0 + peerDependenciesMeta: + typescript: + optional: true + + '@t3-oss/env-nextjs@0.11.1': + resolution: {integrity: sha512-rx2XL9+v6wtOqLNJbD5eD8OezKlQD1BtC0WvvtHwBgK66jnF5+wGqtgkKK4Ygie1LVmoDClths2T4tdFmRvGrQ==} + peerDependencies: + typescript: '>=5.0.0' + zod: ^3.0.0 + peerDependenciesMeta: + typescript: + optional: true + '@types/debug@4.1.12': resolution: {integrity: sha512-vIChWdVG3LG1SMxEvI/AK+FWJthlrqlTu7fbrlywTkkaONwk/UAGaULXRlf8vkzFBLVm0zkMdCquhL5aOjhXPQ==} @@ -2191,6 +2215,9 @@ packages: resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==} engines: {node: '>=10'} + zod@3.24.1: + resolution: {integrity: sha512-muH7gBL9sI1nciMZV67X5fTKKBLtwpZ5VBp1vsOQzj1MhrBZ4wlVCm3gedKZWLp0Oyel8sIGfeiz54Su+OVT+A==} + zwitch@2.0.4: resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} @@ -2568,6 +2595,19 @@ snapshots: dependencies: tslib: 2.8.1 + '@t3-oss/env-core@0.11.1(typescript@5.7.3)(zod@3.24.1)': + dependencies: + zod: 3.24.1 + optionalDependencies: + typescript: 5.7.3 + + '@t3-oss/env-nextjs@0.11.1(typescript@5.7.3)(zod@3.24.1)': + dependencies: + '@t3-oss/env-core': 0.11.1(typescript@5.7.3)(zod@3.24.1) + zod: 3.24.1 + optionalDependencies: + typescript: 5.7.3 + '@types/debug@4.1.12': dependencies: '@types/ms': 2.1.0 @@ -4782,4 +4822,6 @@ snapshots: yocto-queue@0.1.0: {} + zod@3.24.1: {} + zwitch@2.0.4: {}