diff --git a/app/page.tsx b/app/page.tsx
index cde4afec..51f450e9 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -1,14 +1,14 @@
 "use client";
 import { useState, useEffect } from "react";
-import { Canvas } from "@react-three/fiber";
-import { Mission } from "./Mission";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { ObserverControls } from "./ObserverControls";
-import { InspectorControls } from "./InspectorControls";
-import { SettingsProvider } from "./SettingsProvider";
-import { EffectComposer, N8AO } from "@react-three/postprocessing";
 import { useSearchParams, useRouter } from "next/navigation";
-import { ObserverCamera } from "./ObserverCamera";
+import { Canvas } from "@react-three/fiber";
+import { EffectComposer, N8AO } from "@react-three/postprocessing";
+import { Mission } from "@/src/components/Mission";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { ObserverControls } from "@/src/components/ObserverControls";
+import { InspectorControls } from "@/src/components/InspectorControls";
+import { SettingsProvider } from "@/src/components/SettingsProvider";
+import { ObserverCamera } from "@/src/components/ObserverCamera";
 
 // three.js has its own loaders for textures and models, but we need to load other
 // stuff too, e.g. missions, terrains, and more. This client is used for those.
diff --git a/app/InspectorControls.tsx b/src/components/InspectorControls.tsx
similarity index 97%
rename from app/InspectorControls.tsx
rename to src/components/InspectorControls.tsx
index 03c486b1..1de9bf51 100644
--- a/app/InspectorControls.tsx
+++ b/src/components/InspectorControls.tsx
@@ -1,4 +1,4 @@
-import { getResourceList } from "@/src/manifest";
+import { getResourceList } from "../manifest";
 import { useSettings } from "./SettingsProvider";
 
 const excludeMissions = new Set([
diff --git a/app/InteriorInstance.tsx b/src/components/InteriorInstance.tsx
similarity index 94%
rename from app/InteriorInstance.tsx
rename to src/components/InteriorInstance.tsx
index 7082ddaf..b814958b 100644
--- a/app/InteriorInstance.tsx
+++ b/src/components/InteriorInstance.tsx
@@ -1,15 +1,15 @@
+import { memo, Suspense, useMemo } from "react";
+import { Mesh } from "three";
 import { useGLTF, useTexture } from "@react-three/drei";
-import { BASE_URL, interiorTextureToUrl, interiorToUrl } from "@/src/loaders";
+import { BASE_URL, interiorTextureToUrl, interiorToUrl } from "../loaders";
 import {
   ConsoleObject,
   getPosition,
   getProperty,
   getRotation,
   getScale,
-} from "@/src/mission";
-import { memo, Suspense, useMemo } from "react";
-import { Mesh } from "three";
-import { setupColor } from "@/src/textureUtils";
+} from "../mission";
+import { setupColor } from "../textureUtils";
 
 const FALLBACK_URL = `${BASE_URL}/black.png`;
 
diff --git a/app/Mission.tsx b/src/components/Mission.tsx
similarity index 90%
rename from app/Mission.tsx
rename to src/components/Mission.tsx
index 14b6d523..7d2b3871 100644
--- a/app/Mission.tsx
+++ b/src/components/Mission.tsx
@@ -1,5 +1,5 @@
-import { loadMission } from "@/src/loaders";
 import { useQuery } from "@tanstack/react-query";
+import { loadMission } from "../loaders";
 import { renderObject } from "./renderObject";
 
 function useMission(name: string) {
diff --git a/app/ObserverCamera.tsx b/src/components/ObserverCamera.tsx
similarity index 100%
rename from app/ObserverCamera.tsx
rename to src/components/ObserverCamera.tsx
diff --git a/app/ObserverControls.tsx b/src/components/ObserverControls.tsx
similarity index 97%
rename from app/ObserverControls.tsx
rename to src/components/ObserverControls.tsx
index 28d58abd..8d19c774 100644
--- a/app/ObserverControls.tsx
+++ b/src/components/ObserverControls.tsx
@@ -1,11 +1,9 @@
-import { KeyboardControls } from "@react-three/drei";
-
 import { useEffect, useRef } from "react";
+import { Vector3 } from "three";
 import { useFrame, useThree } from "@react-three/fiber";
-import { useKeyboardControls } from "@react-three/drei";
+import { KeyboardControls, useKeyboardControls } from "@react-three/drei";
 import { PointerLockControls } from "three-stdlib";
 import { useSettings } from "./SettingsProvider";
-import { Vector3 } from "three";
 
 enum Controls {
   forward = "forward",
diff --git a/app/SettingsProvider.tsx b/src/components/SettingsProvider.tsx
similarity index 97%
rename from app/SettingsProvider.tsx
rename to src/components/SettingsProvider.tsx
index 0925ca3e..04e067d2 100644
--- a/app/SettingsProvider.tsx
+++ b/src/components/SettingsProvider.tsx
@@ -1,5 +1,4 @@
 import React, { useContext, useEffect, useMemo, useState } from "react";
-import { PerspectiveCamera } from "three";
 
 const SettingsContext = React.createContext(null);
 
diff --git a/app/SimGroup.tsx b/src/components/SimGroup.tsx
similarity index 79%
rename from app/SimGroup.tsx
rename to src/components/SimGroup.tsx
index a603b0a7..5ae55e68 100644
--- a/app/SimGroup.tsx
+++ b/src/components/SimGroup.tsx
@@ -1,4 +1,4 @@
-import { ConsoleObject } from "@/src/mission";
+import { ConsoleObject } from "../mission";
 import { renderObject } from "./renderObject";
 
 export function SimGroup({ object }: { object: ConsoleObject }) {
diff --git a/app/Sky.tsx b/src/components/Sky.tsx
similarity index 97%
rename from app/Sky.tsx
rename to src/components/Sky.tsx
index 55adb650..898b247f 100644
--- a/app/Sky.tsx
+++ b/src/components/Sky.tsx
@@ -1,10 +1,10 @@
-import { ConsoleObject, getProperty } from "@/src/mission";
-import { useSettings } from "./SettingsProvider";
 import { Suspense, useMemo, useEffect, useRef } from "react";
-import { BASE_URL, getUrlForPath, loadDetailMapList } from "@/src/loaders";
 import { useQuery } from "@tanstack/react-query";
 import { useCubeTexture } from "@react-three/drei";
 import { Color, ShaderMaterial, BackSide } from "three";
+import { ConsoleObject, getProperty } from "../mission";
+import { useSettings } from "./SettingsProvider";
+import { BASE_URL, getUrlForPath, loadDetailMapList } from "../loaders";
 
 const FALLBACK_URL = `${BASE_URL}/black.png`;
 
diff --git a/app/Sun.tsx b/src/components/Sun.tsx
similarity index 96%
rename from app/Sun.tsx
rename to src/components/Sun.tsx
index b6e34cae..ff364330 100644
--- a/app/Sun.tsx
+++ b/src/components/Sun.tsx
@@ -1,6 +1,6 @@
-import { ConsoleObject, getProperty } from "@/src/mission";
 import { useMemo } from "react";
 import { Color } from "three";
+import { ConsoleObject, getProperty } from "../mission";
 
 export function Sun({ object }: { object: ConsoleObject }) {
   const direction = useMemo(() => {
diff --git a/app/TerrainBlock.tsx b/src/components/TerrainBlock.tsx
similarity index 97%
rename from app/TerrainBlock.tsx
rename to src/components/TerrainBlock.tsx
index efc2c8e2..ba19a3bf 100644
--- a/app/TerrainBlock.tsx
+++ b/src/components/TerrainBlock.tsx
@@ -1,15 +1,5 @@
-import { uint16ToFloat32 } from "@/src/arrayUtils";
-import { loadTerrain, terrainTextureToUrl } from "@/src/loaders";
-import {
-  ConsoleObject,
-  getPosition,
-  getProperty,
-  getRotation,
-  getScale,
-} from "@/src/mission";
-import { useQuery } from "@tanstack/react-query";
 import { Suspense, useCallback, useMemo } from "react";
-import { useTexture } from "@react-three/drei";
+import { useQuery } from "@tanstack/react-query";
 import {
   DataTexture,
   RedFormat,
@@ -20,11 +10,21 @@ import {
   UnsignedByteType,
   PlaneGeometry,
 } from "three";
+import { useTexture } from "@react-three/drei";
+import { uint16ToFloat32 } from "../arrayUtils";
+import { loadTerrain, terrainTextureToUrl } from "../loaders";
+import {
+  ConsoleObject,
+  getPosition,
+  getProperty,
+  getRotation,
+  getScale,
+} from "../mission";
 import {
   setupColor,
   setupMask,
   updateTerrainTextureShader,
-} from "@/src/textureUtils";
+} from "../textureUtils";
 
 /**
  * Load a .ter file, used for terrain heightmap and texture info.
diff --git a/app/WaterBlock.tsx b/src/components/WaterBlock.tsx
similarity index 91%
rename from app/WaterBlock.tsx
rename to src/components/WaterBlock.tsx
index 6ecd811f..d52fa111 100644
--- a/app/WaterBlock.tsx
+++ b/src/components/WaterBlock.tsx
@@ -1,14 +1,14 @@
-import { textureToUrl } from "@/src/loaders";
+import { Suspense, useMemo } from "react";
+import { useTexture } from "@react-three/drei";
+import { textureToUrl } from "../loaders";
 import {
   ConsoleObject,
   getPosition,
   getProperty,
   getRotation,
   getScale,
-} from "@/src/mission";
-import { setupColor } from "@/src/textureUtils";
-import { useTexture } from "@react-three/drei";
-import { Suspense, useMemo } from "react";
+} from "../mission";
+import { setupColor } from "../textureUtils";
 
 export function WaterMaterial({ surfaceTexture }: { surfaceTexture: string }) {
   const url = textureToUrl(surfaceTexture);
diff --git a/app/renderObject.tsx b/src/components/renderObject.tsx
similarity index 92%
rename from app/renderObject.tsx
rename to src/components/renderObject.tsx
index 9ca2e17b..6a57e422 100644
--- a/app/renderObject.tsx
+++ b/src/components/renderObject.tsx
@@ -1,4 +1,4 @@
-import { ConsoleObject } from "@/src/mission";
+import { ConsoleObject } from "../mission";
 import { TerrainBlock } from "./TerrainBlock";
 import { WaterBlock } from "./WaterBlock";
 import { SimGroup } from "./SimGroup";
diff --git a/src/mission.ts b/src/mission.ts
index b0dfc1ae..ed2dd39f 100644
--- a/src/mission.ts
+++ b/src/mission.ts
@@ -1,5 +1,5 @@
-import parser from "@/generated/mission.cjs";
 import { Quaternion, Vector3 } from "three";
+import parser from "@/generated/mission.cjs";
 
 const definitionComment = /^ (DisplayName|MissionTypes) = (.+)$/;
 const sectionBeginComment = /^--- ([A-Z ]+) BEGIN ---$/;