Build Brief

Context

This Next.js portfolio app failed during production build on TypeScript checks in Scene.tsx.

Issue

TypeScript reported React Three JSX elements as invalid:

• group
• primitive
• ambientLight
• directionalLight
• pointLight

Error source:

• /Users/coder-sadhu/Desktop/codex-ai/app/components/Scene.tsx

Root Cause

JSX intrinsic element typing for @react-three/fiber was not being applied in the current type environment, so Three.js JSX tags were missing from JSX.IntrinsicElements.

Fix Implemented

Added a small type bridge file:

• /Users/coder-sadhu/Desktop/codex-ai/app/types/r3f-jsx.d.ts

This file extends JSX intrinsic types with ThreeElements from @react-three/fiber for both:

• global JSX namespace
• react module JSX namespace

Validation

Build/typecheck now pass:

• ./node_modules/.bin/tsc --noEmit
• ./node_modules/.bin/next build

Current Status

App is buildable on Next.js 14.2.5 with TypeScript checks passing.