From b6cf55cc687ed2005ad35d3c240b9142272f9e8f Mon Sep 17 00:00:00 2001 From: faithia-anastasia <211831874+faithia-anastasia@users.noreply.github.com> Date: Tue, 3 Mar 2026 10:37:05 +0900 Subject: [PATCH 1/5] refactor: integrate planetArrangement into Simulation/index.tsx --- src/pages/Simulation/index.tsx | 312 ++++++++++++++++++++++++++++----- 1 file changed, 271 insertions(+), 41 deletions(-) diff --git a/src/pages/Simulation/index.tsx b/src/pages/Simulation/index.tsx index a760b6c..2aa7aaf 100644 --- a/src/pages/Simulation/index.tsx +++ b/src/pages/Simulation/index.tsx @@ -1,14 +1,22 @@ import { OrbitControls, Stars, useTexture } from "@react-three/drei"; -import { Canvas, useFrame } from "@react-three/fiber"; -import { useRef, useState } from "react"; -import type * as THREE from "three"; +import { Canvas, type ThreeEvent, useFrame } from "@react-three/fiber"; +import { button, useControls } from "leva"; +import { useEffect, useMemo, useRef, useState } from "react"; +import * as THREE from "three"; import { Explosion } from "@/components/Explosion"; -import { earth, testPlanet } from "@/data/planets"; +import { earth, jupiter, mars, sun, venus } from "@/data/planets"; import type { ExplosionData } from "@/types/Explosion"; import type { Planet } from "@/types/planet"; import { isColliding } from "@/utils/isColliding"; -const testPlanets: Planet[] = [earth, testPlanet]; +const planetTexturePaths = [ + earth.texturePath, + sun.texturePath, + mars.texturePath, + jupiter.texturePath, + venus.texturePath, +]; +useTexture.preload(planetTexturePaths); type PlanetMeshProps = { planet: Planet; @@ -47,6 +55,60 @@ function PlanetMesh({ planet }: PlanetMeshProps) { ); } + +type PreviewPlanetProps = { + radius: number; + position: [number, number, number]; +}; +// 惑星の配置プレビュー用の半透明の球体を描画するコンポーネント +function PreviewPlanet({ radius, position }: PreviewPlanetProps) { + return ( + + + + + ); +} + +type PlacementSurfaceProps = { + enabled: boolean; + yLevel: number; + onPlace: (position: [number, number, number]) => void; +}; +// 惑星の配置を行うための透明な平面を描画するコンポーネント +function PlacementSurface({ enabled, yLevel, onPlace }: PlacementSurfaceProps) { + const handlePointerDown = (event: ThreeEvent) => { + if (!enabled) { + return; + } + + event.stopPropagation(); + const { x, y, z } = event.point; + const step = 0.2; + const round = (value: number) => Math.round(value / step) * step; + onPlace([round(x), round(y), round(z)]); + }; + + return ( + + + + + ); +} + +const planetTemplates = { earth, sun, mars, jupiter, venus } as const; + type SimulationProps = { planets: Planet[]; onExplosion: (newExp: ExplosionData) => void; @@ -98,44 +160,212 @@ export function Simulation({ planets, onExplosion }: SimulationProps) { } export default function Page() { + const [planets, setPlanets] = useState([earth]); const [explosions, setExplosions] = useState([]); + const [placementMode, setPlacementMode] = useState(false); + const [placementPanelOpen, setPlacementPanelOpen] = useState(true); + + const [planetControls, setPlanetControls, getPlanetControl] = useControls( + "New Planet", + () => ({ + planetType: { + value: "earth", + options: { + Earth: "earth", + Sun: "sun", + Mars: "mars", + Jupiter: "jupiter", + Venus: "venus", + }, + }, + radius: { value: 1.2, min: 0.2, max: 6, step: 0.1 }, + posX: { value: 0, min: -200, max: 200, step: 0.2 }, + posY: { value: 0, min: -200, max: 200, step: 0.2 }, + posZ: { value: 0, min: -200, max: 200, step: 0.2 }, + rotationSpeedY: { value: 0.6, min: 0, max: 10, step: 0.1 }, + }), + ); + + useEffect(() => { + const selectedType = + (planetControls.planetType as keyof typeof planetTemplates) ?? "earth"; + const template = planetTemplates[selectedType] ?? earth; + setPlanetControls({ + radius: template.radius, + rotationSpeedY: template.rotationSpeedY, + }); + }, [planetControls.planetType, setPlanetControls]); + + useControls("New Planet", { + addPlanet: button(() => { + const selectedType = + (getPlanetControl("planetType") as keyof typeof planetTemplates) ?? + "earth"; + const template = planetTemplates[selectedType] ?? earth; + const settings = { + radius: getPlanetControl("radius"), + posX: getPlanetControl("posX"), + posY: getPlanetControl("posY"), + posZ: getPlanetControl("posZ"), + rotationSpeedY: getPlanetControl("rotationSpeedY"), + }; + + setPlanets((prev) => [ + ...prev, + { + id: crypto.randomUUID(), + name: template.name, + texturePath: template.texturePath, + rotationSpeedY: settings.rotationSpeedY, + radius: settings.radius, + width: 64, + height: 64, + position: new THREE.Vector3( + settings.posX, + settings.posY, + settings.posZ, + ), + velocity: new THREE.Vector3(0, 0, 0), + }, + ]); + }), + }); + + const { showGrid, showAxes, showPreview } = useControls("Helpers", { + showGrid: true, + showAxes: true, + showPreview: true, + }); + + const previewPosition = useMemo<[number, number, number]>( + () => [planetControls.posX, planetControls.posY, planetControls.posZ], + [planetControls.posX, planetControls.posY, planetControls.posZ], + ); + + const handlePlacement = (position: [number, number, number]) => { + setPlanetControls({ + posX: position[0], + posY: position[1], + posZ: position[2], + }); + }; + + const removePlanet = (planetIndex: number) => { + setPlanets((prev) => prev.filter((_, index) => index !== planetIndex)); + }; + return ( - { - gl.setClearColor("#000000", 1); - }} - style={{ width: "100vw", height: "100vh" }} - > - {/* Adds ambient and directional light so we can see the 3D shape */} - - - - {testPlanets.map((planet) => ( - - ))} - - setExplosions((prev) => [...prev, newExp]) - } - /> - {explosions.map((exp) => ( - - ))} - - {/* Optional background and controls */} - - - +
+ { + gl.setClearColor("#000000", 1); + }} + style={{ width: "100vw", height: "100vh" }} + > + {/* Adds ambient and directional light so we can see the 3D shape */} + + + + {planets.map((planet) => ( + + ))} + + + + {showPreview && ( + + )} + {showGrid && } + {showAxes && } + + setExplosions((prev) => [...prev, newExp]) + } + /> + {explosions.map((exp) => ( + + ))} + + {/* Optional background and controls */} + + + +
+
+ クリック配置 +
+ + +
+
+ {placementPanelOpen && ( + <> +

+ ONの間は水色の面をクリックすると、座標が自動入力されます。 +

+ + 追加済み惑星 ({planets.length}) +
    + {planets.map((planet) => ( +
  • +
    +
    {planet.name}
    +
    + r={planet.radius.toFixed(1)} / ( + {planet.position.x.toFixed(1)}, + {planet.position.y.toFixed(1)},{" "} + {planet.position.z.toFixed(1)}) +
    +
    + +
    • + ))} +
+ + )} +
+
); } From 3b74227061669a8e6492b706f2a6e5835e55cf95 Mon Sep 17 00:00:00 2001 From: faithia-anastasia <211831874+faithia-anastasia@users.noreply.github.com> Date: Tue, 3 Mar 2026 11:49:29 +0900 Subject: [PATCH 2/5] refactor: move some functions from Simulation/index.tsx to Simulation/components directory --- .../Simulation}/components/Explosion.tsx | 0 .../Simulation/components/PlanetMesh.tsx | 43 ++++++++ .../components/PlanetPlacementView.tsx | 57 +++++++++++ src/pages/Simulation/index.tsx | 98 ++----------------- 4 files changed, 107 insertions(+), 91 deletions(-) rename src/{ => pages/Simulation}/components/Explosion.tsx (100%) create mode 100644 src/pages/Simulation/components/PlanetMesh.tsx create mode 100644 src/pages/Simulation/components/PlanetPlacementView.tsx diff --git a/src/components/Explosion.tsx b/src/pages/Simulation/components/Explosion.tsx similarity index 100% rename from src/components/Explosion.tsx rename to src/pages/Simulation/components/Explosion.tsx diff --git a/src/pages/Simulation/components/PlanetMesh.tsx b/src/pages/Simulation/components/PlanetMesh.tsx new file mode 100644 index 0000000..4cd3b53 --- /dev/null +++ b/src/pages/Simulation/components/PlanetMesh.tsx @@ -0,0 +1,43 @@ +import { useTexture } from "@react-three/drei"; +import { useFrame } from "@react-three/fiber"; +import { useRef } from "react"; +import type * as THREE from "three"; +import type { Planet } from "@/types/planet"; + +type PlanetMeshProps = { + planet: Planet; +}; + +export function PlanetMesh({ planet }: PlanetMeshProps) { + const meshRef = useRef(null); + + // Load the texture (you can use any public Earth texture URL) + const [colorMap] = useTexture([planet.texturePath]); + + // This hook runs every frame (approx 60fps) + useFrame((_state, delta) => { + if (meshRef.current) { + // Rotate the planet on its Y-axis + meshRef.current.rotation.y += delta * planet.rotationSpeedY; + // 位置を planet.position に同期 + meshRef.current.position.set( + planet.position.x, + planet.position.y, + planet.position.z, + ); + } + }); + + return ( + + {/* args: [radius, widthSegments, heightSegments] + Higher segments = smoother sphere + */} + + + + ); +} diff --git a/src/pages/Simulation/components/PlanetPlacementView.tsx b/src/pages/Simulation/components/PlanetPlacementView.tsx new file mode 100644 index 0000000..6e5a4f7 --- /dev/null +++ b/src/pages/Simulation/components/PlanetPlacementView.tsx @@ -0,0 +1,57 @@ +import type { ThreeEvent } from "@react-three/fiber"; +import * as THREE from "three"; + +type PreviewPlanetProps = { + radius: number; + position: [number, number, number]; +}; +// 惑星の配置プレビュー用の半透明の球体を描画するコンポーネント +export function PreviewPlanet({ radius, position }: PreviewPlanetProps) { + return ( + + + + + ); +} + +type PlacementSurfaceProps = { + enabled: boolean; + yLevel: number; + onPlace: (position: [number, number, number]) => void; +}; +// 惑星の配置を行うための透明な平面を描画するコンポーネント +export function PlacementSurface({ + enabled, + yLevel, + onPlace, +}: PlacementSurfaceProps) { + const handlePointerDown = (event: ThreeEvent) => { + if (!enabled) { + return; + } + + event.stopPropagation(); + const { x, y, z } = event.point; + const step = 0.2; + const round = (value: number) => Math.round(value / step) * step; + onPlace([round(x), round(y), round(z)]); + }; + + return ( + + + + + ); +} diff --git a/src/pages/Simulation/index.tsx b/src/pages/Simulation/index.tsx index 2aa7aaf..9d91b18 100644 --- a/src/pages/Simulation/index.tsx +++ b/src/pages/Simulation/index.tsx @@ -1,13 +1,18 @@ import { OrbitControls, Stars, useTexture } from "@react-three/drei"; -import { Canvas, type ThreeEvent, useFrame } from "@react-three/fiber"; +import { Canvas, useFrame } from "@react-three/fiber"; import { button, useControls } from "leva"; import { useEffect, useMemo, useRef, useState } from "react"; import * as THREE from "three"; -import { Explosion } from "@/components/Explosion"; import { earth, jupiter, mars, sun, venus } from "@/data/planets"; import type { ExplosionData } from "@/types/Explosion"; import type { Planet } from "@/types/planet"; import { isColliding } from "@/utils/isColliding"; +import { Explosion } from "./components/Explosion"; +import { PlanetMesh } from "./components/PlanetMesh"; +import { + PlacementSurface, + PreviewPlanet, +} from "./components/PlanetPlacementView"; const planetTexturePaths = [ earth.texturePath, @@ -18,95 +23,6 @@ const planetTexturePaths = [ ]; useTexture.preload(planetTexturePaths); -type PlanetMeshProps = { - planet: Planet; -}; - -function PlanetMesh({ planet }: PlanetMeshProps) { - const meshRef = useRef(null); - - // Load the texture (you can use any public Earth texture URL) - const [colorMap] = useTexture([planet.texturePath]); - - // This hook runs every frame (approx 60fps) - useFrame((_state, delta) => { - if (meshRef.current) { - // Rotate the planet on its Y-axis - meshRef.current.rotation.y += delta * planet.rotationSpeedY; - // 位置を planet.position に同期 - meshRef.current.position.set( - planet.position.x, - planet.position.y, - planet.position.z, - ); - } - }); - - return ( - - {/* args: [radius, widthSegments, heightSegments] - Higher segments = smoother sphere - */} - - - - ); -} - -type PreviewPlanetProps = { - radius: number; - position: [number, number, number]; -}; -// 惑星の配置プレビュー用の半透明の球体を描画するコンポーネント -function PreviewPlanet({ radius, position }: PreviewPlanetProps) { - return ( - - - - - ); -} - -type PlacementSurfaceProps = { - enabled: boolean; - yLevel: number; - onPlace: (position: [number, number, number]) => void; -}; -// 惑星の配置を行うための透明な平面を描画するコンポーネント -function PlacementSurface({ enabled, yLevel, onPlace }: PlacementSurfaceProps) { - const handlePointerDown = (event: ThreeEvent) => { - if (!enabled) { - return; - } - - event.stopPropagation(); - const { x, y, z } = event.point; - const step = 0.2; - const round = (value: number) => Math.round(value / step) * step; - onPlace([round(x), round(y), round(z)]); - }; - - return ( - - - - - ); -} - const planetTemplates = { earth, sun, mars, jupiter, venus } as const; type SimulationProps = { From 42b45eaae54aaab8d4781457b4f0ad012e10087f Mon Sep 17 00:00:00 2001 From: faithia-anastasia <211831874+faithia-anastasia@users.noreply.github.com> Date: Tue, 3 Mar 2026 12:10:02 +0900 Subject: [PATCH 3/5] feat: add reset camera position button in Helpers --- src/pages/Simulation/index.tsx | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/pages/Simulation/index.tsx b/src/pages/Simulation/index.tsx index 9d91b18..5199973 100644 --- a/src/pages/Simulation/index.tsx +++ b/src/pages/Simulation/index.tsx @@ -3,6 +3,7 @@ import { Canvas, useFrame } from "@react-three/fiber"; import { button, useControls } from "leva"; import { useEffect, useMemo, useRef, useState } from "react"; import * as THREE from "three"; +import type { OrbitControls as Controls } from "three-stdlib"; import { earth, jupiter, mars, sun, venus } from "@/data/planets"; import type { ExplosionData } from "@/types/Explosion"; import type { Planet } from "@/types/planet"; @@ -76,6 +77,8 @@ export function Simulation({ planets, onExplosion }: SimulationProps) { } export default function Page() { + const orbitControlsRef = useRef(null); + const [planets, setPlanets] = useState([earth]); const [explosions, setExplosions] = useState([]); @@ -152,6 +155,13 @@ export default function Page() { showGrid: true, showAxes: true, showPreview: true, + resetCameraPosition: button(() => { + if (orbitControlsRef.current) { + orbitControlsRef.current.reset(); + orbitControlsRef.current.target.set(0, 0, 0); + orbitControlsRef.current.update(); + } + }), }); const previewPosition = useMemo<[number, number, number]>( @@ -222,7 +232,7 @@ export default function Page() { fade speed={1} /> - +
From ad461ebb35c1da2d4d3bb17844abcf69a98fb524 Mon Sep 17 00:00:00 2001 From: faithia-anastasia <211831874+faithia-anastasia@users.noreply.github.com> Date: Tue, 3 Mar 2026 13:35:53 +0900 Subject: [PATCH 4/5] refactor: replace useEffect with Leva onChange for planetType --- src/pages/Simulation/index.tsx | 21 ++++++++++----------- 1 file changed, 10 insertions(+), 11 deletions(-) diff --git a/src/pages/Simulation/index.tsx b/src/pages/Simulation/index.tsx index 5199973..7bb35cb 100644 --- a/src/pages/Simulation/index.tsx +++ b/src/pages/Simulation/index.tsx @@ -1,7 +1,7 @@ import { OrbitControls, Stars, useTexture } from "@react-three/drei"; import { Canvas, useFrame } from "@react-three/fiber"; import { button, useControls } from "leva"; -import { useEffect, useMemo, useRef, useState } from "react"; +import { useMemo, useRef, useState } from "react"; import * as THREE from "three"; import type { OrbitControls as Controls } from "three-stdlib"; import { earth, jupiter, mars, sun, venus } from "@/data/planets"; @@ -97,6 +97,15 @@ export default function Page() { Jupiter: "jupiter", Venus: "venus", }, + onChange: (value) => { + const selectedType = + (value as keyof typeof planetTemplates) ?? "earth"; + const template = planetTemplates[selectedType] ?? earth; + setPlanetControls({ + radius: template.radius, + rotationSpeedY: template.rotationSpeedY, + }); + }, }, radius: { value: 1.2, min: 0.2, max: 6, step: 0.1 }, posX: { value: 0, min: -200, max: 200, step: 0.2 }, @@ -106,16 +115,6 @@ export default function Page() { }), ); - useEffect(() => { - const selectedType = - (planetControls.planetType as keyof typeof planetTemplates) ?? "earth"; - const template = planetTemplates[selectedType] ?? earth; - setPlanetControls({ - radius: template.radius, - rotationSpeedY: template.rotationSpeedY, - }); - }, [planetControls.planetType, setPlanetControls]); - useControls("New Planet", { addPlanet: button(() => { const selectedType = From 167b4c88e05407801e1b22bea30baf137d32d5f8 Mon Sep 17 00:00:00 2001 From: faithia-anastasia <211831874+faithia-anastasia@users.noreply.github.com> Date: Tue, 3 Mar 2026 13:42:58 +0900 Subject: [PATCH 5/5] chore: remove unused files and routes --- src/pages/PlanetsArrangement/index.tsx | 303 ------------------------- src/router/index.tsx | 2 - 2 files changed, 305 deletions(-) delete mode 100644 src/pages/PlanetsArrangement/index.tsx diff --git a/src/pages/PlanetsArrangement/index.tsx b/src/pages/PlanetsArrangement/index.tsx deleted file mode 100644 index fc1b2fb..0000000 --- a/src/pages/PlanetsArrangement/index.tsx +++ /dev/null @@ -1,303 +0,0 @@ -import { OrbitControls, Stars, useTexture } from "@react-three/drei"; -import { Canvas, type ThreeEvent, useFrame } from "@react-three/fiber"; -import { button, useControls } from "leva"; -import { useEffect, useMemo, useRef, useState } from "react"; -import * as THREE from "three"; -import { earth, jupiter, mars, sun, venus } from "@/data/planets"; -import type { Planet } from "@/types/planet"; - -const planetTexturePaths = [ - earth.texturePath, - sun.texturePath, - mars.texturePath, - jupiter.texturePath, - venus.texturePath, -]; -useTexture.preload(planetTexturePaths); - -type PlanetMeshProps = { - planet: Planet; -}; - -function PlanetMesh({ planet }: PlanetMeshProps) { - const meshRef = useRef(null); - - // Load the texture (you can use any public Earth texture URL) - const [colorMap] = useTexture([planet.texturePath]); - - // This hook runs every frame (approx 60fps) - useFrame((_state, delta) => { - if (meshRef.current) { - // Rotate the planet on its Y-axis - meshRef.current.rotation.y += delta * planet.rotationSpeedY; - } - }); - - return ( - - {/* args: [radius, widthSegments, heightSegments] - Higher segments = smoother sphere - */} - - - - ); -} - -type PreviewPlanetProps = { - radius: number; - position: [number, number, number]; -}; -// 惑星の配置プレビュー用の半透明の球体を描画するコンポーネント -function PreviewPlanet({ radius, position }: PreviewPlanetProps) { - return ( - - - - - ); -} - -interface PlacementSurfaceProps { - enabled: boolean; - yLevel: number; - onPlace: (position: [number, number, number]) => void; -} -// 惑星の配置を行うための透明な平面を描画するコンポーネント -function PlacementSurface({ enabled, yLevel, onPlace }: PlacementSurfaceProps) { - const handlePointerDown = (event: ThreeEvent) => { - if (!enabled) { - return; - } - - event.stopPropagation(); - const { x, y, z } = event.point; - const step = 0.2; - const round = (value: number) => Math.round(value / step) * step; - onPlace([round(x), round(y), round(z)]); - }; - - return ( - - - - - ); -} - -const planetTemplates = { earth, sun, mars, jupiter, venus } as const; - -export default function Page() { - const [planets, setPlanets] = useState([earth]); - - const [placementMode, setPlacementMode] = useState(false); - const [placementPanelOpen, setPlacementPanelOpen] = useState(true); - - const [planetControls, setPlanetControls, getPlanetControl] = useControls( - "New Planet", - () => ({ - planetType: { - value: "earth", - options: { - Earth: "earth", - Sun: "sun", - Mars: "mars", - Jupiter: "jupiter", - Venus: "venus", - }, - }, - radius: { value: 1.2, min: 0.2, max: 6, step: 0.1 }, - posX: { value: 0, min: -200, max: 200, step: 0.2 }, - posY: { value: 0, min: -200, max: 200, step: 0.2 }, - posZ: { value: 0, min: -200, max: 200, step: 0.2 }, - rotationSpeedY: { value: 0.6, min: 0, max: 10, step: 0.1 }, - }), - ); - - useEffect(() => { - const selectedType = - (planetControls.planetType as keyof typeof planetTemplates) ?? "earth"; - const template = planetTemplates[selectedType] ?? earth; - setPlanetControls({ - radius: template.radius, - rotationSpeedY: template.rotationSpeedY, - }); - }, [planetControls.planetType, setPlanetControls]); - - useControls("New Planet", { - addPlanet: button(() => { - const selectedType = - (getPlanetControl("planetType") as keyof typeof planetTemplates) ?? - "earth"; - const template = planetTemplates[selectedType] ?? earth; - const settings = { - radius: getPlanetControl("radius"), - posX: getPlanetControl("posX"), - posY: getPlanetControl("posY"), - posZ: getPlanetControl("posZ"), - rotationSpeedY: getPlanetControl("rotationSpeedY"), - }; - - setPlanets((prev) => [ - ...prev, - { - id: crypto.randomUUID(), - name: template.name, - texturePath: template.texturePath, - rotationSpeedY: settings.rotationSpeedY, - radius: settings.radius, - width: 64, - height: 64, - position: new THREE.Vector3( - settings.posX, - settings.posY, - settings.posZ, - ), - velocity: new THREE.Vector3(0, 0, 0), - }, - ]); - }), - }); - - const { showGrid, showAxes, showPreview } = useControls("Helpers", { - showGrid: true, - showAxes: true, - showPreview: true, - }); - - const previewPosition = useMemo<[number, number, number]>( - () => [planetControls.posX, planetControls.posY, planetControls.posZ], - [planetControls.posX, planetControls.posY, planetControls.posZ], - ); - - const handlePlacement = (position: [number, number, number]) => { - setPlanetControls({ - posX: position[0], - posY: position[1], - posZ: position[2], - }); - }; - - const removePlanet = (planetIndex: number) => { - setPlanets((prev) => prev.filter((_, index) => index !== planetIndex)); - }; - - return ( -
- { - gl.setClearColor("#000000", 1); - }} - style={{ width: "100vw", height: "100vh" }} - > - {/* Adds ambient and directional light so we can see the 3D shape */} - - - - {planets.map((planet) => ( - - ))} - - - - {showPreview && ( - - )} - {showGrid && } - {showAxes && } - - {/* Optional background and controls */} - - - - -
-
- クリック配置 -
- - -
-
- {placementPanelOpen && ( - <> -

- ONの間は水色の面をクリックすると、座標が自動入力されます。 -

- - 追加済み惑星 ({planets.length}) -
    - {planets.map((planet) => ( -
  • -
    -
    {planet.name}
    -
    - r={planet.radius.toFixed(1)} / ( - {planet.position.x.toFixed(1)}, - {planet.position.y.toFixed(1)},{" "} - {planet.position.z.toFixed(1)}) -
    -
    - -
    • - ))} -
- - )} -
-
- ); -} diff --git a/src/router/index.tsx b/src/router/index.tsx index 26768cf..b30c8c0 100644 --- a/src/router/index.tsx +++ b/src/router/index.tsx @@ -1,6 +1,5 @@ import { BrowserRouter, Route, Routes } from "react-router-dom"; import Home from "@/pages/Home"; -import PlanetsArrangement from "@/pages/PlanetsArrangement"; import Simulation from "@/pages/Simulation"; export const AppRouter = () => ( @@ -8,7 +7,6 @@ export const AppRouter = () => ( } /> } /> - } /> );