Initial implementation

1 files changed, 29 insertions, 0 deletions

diff --git a/src/components/CameraSelector.tsx b/src/components/CameraSelector.tsx
new file mode 100644
index 0000000..b3d787f
--- /dev/null
+++ b/src/components/CameraSelector.tsx
@@ -0,0 +1,29 @@
+import React from "react";
+import { useStore, isValidCameraView } from "../store/store.ts";
+
+export const CameraSelector: React.FC = () => {
+  const cameraView = useStore((state) => state.cameraView);
+  const setCameraView = useStore((state) => state.setCameraView);
+
+  const handleChange = (event: React.ChangeEvent<HTMLSelectElement>) => {
+    const value = event.target.value;
+    if (isValidCameraView(value)) {
+      setCameraView(value);
+    }
+  };
+
+  return (
+    <div className="camera-selector-wrapper">
+      <select
+        className="camera-selector"
+        value={cameraView}
+        onChange={handleChange}
+      >
+        <option value="perspective">Perspective</option>
+        <option value="ortho-top">Top (Ortho)</option>
+        <option value="ortho-front">Front (Ortho)</option>
+        <option value="ortho-side">Side (Ortho)</option>
+      </select>
+    </div>
+  );
+};