Refactor: modular code structure & bundle textures locally

[MohtashamMurshid]

Summary

• Modularised codebase — broke the monolithic PlanetScene.tsx (430 lines) and App.tsx (149 lines) into 7 focused files with clear separation of concerns:
  • src/data/planets.ts — single source of truth for planet data & texture URLs
  • src/shaders/atmosphere.ts — atmosphere glow shader factory
  • src/utils/textures.ts — procedural noise texture generator
  • src/components/PlanetSidebar.tsx — sidebar navigation
  • src/components/PlanetInfoPanel.tsx — bottom info panel
  • src/components/NextPlanetHint.tsx — clickable next-planet hint
  • src/components/PlanetScene.tsx — Three.js scene, split into named helper functions
• Eliminated duplicated planet data — was defined in both App.tsx and PlanetScene.tsx, now lives in one place
• Bundled textures locally — downloaded all 14 texture/bump-map images (~3.3 MB) to public/textures/, removing the runtime dependency on jsDelivr CDN. This means faster loads (single origin), full cache control, and offline capability after first visit.

Test plan

• Run npm run dev and verify all 9 planets render with correct textures
• Click through sidebar navigation — each planet transition should animate smoothly
• Click the "next planet" hint above the horizon
• Drag to rotate the active planet
• Verify no network requests to cdn.jsdelivr.net in DevTools
• Run npm run build — confirm zero TypeScript errors
• Test on mobile viewport (sidebar scaling, info panel layout)

Made with Cursor

[vercel]

@MohtashamMurshid is attempting to deploy a commit to the thebuggeddev-9222's projects Team on Vercel.

A member of the Team first needs to authorize it.