1 files changed, 103 insertions, 0 deletions
diff --git a/frontend/src/components/SimulationActions.tsx b/frontend/src/components/SimulationActions.tsx
new file mode 100644
index 0000000..c91b933
--- /dev/null
+++ b/frontend/src/components/SimulationActions.tsx
@@ -0,0 +1,103 @@
+import { useState, type Dispatch, type SetStateAction } from "react";
+import type { ErrorResponse } from "../types/error";
+
+type Props = {
+    apiUrl: string;
+    token: string | null;
+    setErrorMessage: Dispatch<SetStateAction<string>>;
+};
+
+function SimulationActions({ apiUrl, token, setErrorMessage }: Props) {
+    const [isSimulationActive, setIsSimulationActive] =
+        useState<boolean>(false);
+
+    // TODO type responses
+    async function handleStartAllRobots() {
+        setIsSimulationActive(true);
+
+        try {
+            const response = await fetch(`${apiUrl}/robots/move`, {
+                method: "POST",
+                headers: {
+                    Authorization: `Bearer ${token}`,
+                    "Content-Type": "application/json",
+                },
+            });
+
+            if (!response.ok) {
+                const errorData: ErrorResponse = await response.json();
+                throw new Error(
+                    errorData.message || "Failed to set all robots moving."
+                );
+            }
+
+            console.log("All robots set moving.");
+        } catch (error) {
+            console.error("Error starting robots:", error);
+
+            if (error instanceof Error) {
+                setErrorMessage(error.message);
+            } else {
+                setErrorMessage("An unexpected error occurred.");
+            }
+
+            setIsSimulationActive(false);
+        }
+    }
+
+    async function handleStopAllRobots() {
+        setIsSimulationActive(false);
+
+        try {
+            const response = await fetch(`${apiUrl}/robots/stop`, {
+                method: "POST",
+                headers: {
+                    Authorization: `Bearer ${token}`,
+                    "Content-Type": "application/json",
+                },
+            });
+
+            if (!response.ok) {
+                const errorData: ErrorResponse = await response.json();
+                throw new Error(
+                    errorData.message || "Failed to set all robots idle."
+                );
+            }
+
+            console.log("All robots set idle.");
+        } catch (error) {
+            console.error("Error stopping robots:", error);
+
+            if (error instanceof Error) {
+                setErrorMessage(error.message);
+            } else {
+                setErrorMessage("An unexpected error occurred.");
+            }
+
+            setIsSimulationActive(true);
+        }
+    }
+
+    return (
+        <div className="simulation-actions">
+            <button
+                className="btn btn-start"
+                onClick={handleStartAllRobots}
+                disabled={isSimulationActive}
+            >
+                Start simulation
+            </button>
+
+            <button
+                className="btn btn-stop"
+                onClick={handleStopAllRobots}
+                disabled={!isSimulationActive}
+            >
+                Stop simulation
+            </button>
+        </div>
+    );
+}
+
+export default SimulationActions;
+