first commit

app/src/modules/scene/scene.tsx

@@ -0,0 +1,43 @@
+import { useMemo } from "react";
+import { Canvas } from "@react-three/fiber";
+import { Color } from "three";
+import { KeyboardControls } from "@react-three/drei";
+import { SceneProvider } from "./sceneContext";
+
+import Builder from "../builder/builder";
+import Visualization from "../visualization/visualization";
+import Setup from "./setup/setup";
+import Simulation from "../simulation/simulation";
+import Collaboration from "../collaboration/collaboration";
+
+export default function Scene({ layout }: { readonly layout: 'Main Layout' | 'Comparison Layout' }) {
+    const map = useMemo(() => [
+        { name: "forward", keys: ["ArrowUp", "w", "W"] },
+        { name: "backward", keys: ["ArrowDown", "s", "S"] },
+        { name: "left", keys: ["ArrowLeft", "a", "A"] },
+        { name: "right", keys: ["ArrowRight", "d", "D"] },
+    ], []);
+
+    return (
+        <SceneProvider layout={layout}>
+            <KeyboardControls map={map}>
+                <Canvas
+                    eventPrefix="client"
+                    gl={{ powerPreference: "high-performance", antialias: true }}
+                    onContextMenu={(e) => {
+                        e.preventDefault();
+                    }}
+                    onCreated={(e) => {
+                        e.scene.background = new Color(0x19191d);
+                    }}
+                >
+                    <Setup />
+                    <Collaboration />
+                    <Builder />
+                    <Simulation />
+                    <Visualization />
+                </Canvas>
+            </KeyboardControls>
+        </SceneProvider>
+    );
+}