cleanup, fix typo

app/Mission.tsx

@@ -9,12 +9,6 @@ function useMission(name: string) {
   });
 }
 
-const DEFAULT_LIGHT_ARGS = [
-  "rgba(209, 237, 255, 1)",
-  "rgba(186, 200, 181, 1)",
-  2,
-] as const;
-
 export function Mission({ name }: { name: string }) {
   const { data: mission } = useMission(name);
 
@@ -24,7 +18,9 @@ export function Mission({ name }: { name: string }) {
 
   return (
     <>
-      <hemisphereLight args={DEFAULT_LIGHT_ARGS} />
+      <hemisphereLight
+        args={["rgba(209, 237, 255, 1)", "rgba(186, 200, 181, 1)", 2]}
+      />
       {mission.objects.map((object, i) => renderObject(object, i))}
     </>
   );

app/ObserverControls.tsx

@@ -1,9 +1,4 @@
-import {
-  KeyboardControls,
-  KeyboardControlsEntry,
-  Point,
-  PointerLockControls,
-} from "@react-three/drei";
+import { KeyboardControls, PointerLockControls } from "@react-three/drei";
 
 import { useRef } from "react";
 import { useFrame, useThree } from "@react-three/fiber";

app/Sky.tsx

@@ -8,6 +8,9 @@ import { Color } from "three";
 
 const FALLBACK_URL = `${BASE_URL}/black.png`;
 
+/**
+ * Load a .dml file, used to list the textures for different faces of a skybox.
+ */
 function useDetailMapList(name: string) {
   return useQuery({
     queryKey: ["detailMapList", name],
@@ -54,9 +57,9 @@ export function Sky({ object }: { object: ConsoleObject }) {
   // Fog parameters.
   // TODO: There can be multiple fog volumes/layers. Render simple fog for now.
   const fogDistance = useMemo(() => {
-    const distainceString = getProperty(object, "fogDistance")?.value;
-    if (distainceString) {
-      return parseFloat(distainceString);
+    const distanceString = getProperty(object, "fogDistance")?.value;
+    if (distanceString) {
+      return parseFloat(distanceString);
     }
   }, [object]);