working load from current state

yhattav · Jan 15, 2025 · 7e8ada7 · 7e8ada7
1 parent 510f71d
commit 7e8ada7
Show file tree

Hide file tree

Showing 3 changed files with 73 additions and 40 deletions.
diff --git a/src/components/GravitySimulator/GravitySimulator.tsx b/src/components/GravitySimulator/GravitySimulator.tsx
@@ -301,6 +301,7 @@ export const GravitySimulator: React.FC<GravitySimulatorProps> = ({
     handleSelectScenario,
     handleScenarioPanelToggle,
     handleSettingsPanelToggle,
+    getCurrentScenario,
   } = useScenarioManagement({
     physicsConfig,
     gravityPoints,
@@ -611,6 +612,7 @@ export const GravitySimulator: React.FC<GravitySimulatorProps> = ({
               isOpen={isJsonPanelOpen}
               onClose={() => setIsJsonPanelOpen(false)}
               onApplyScenario={handleSelectScenario}
+              getCurrentScenario={getCurrentScenario}
             />
 
             <SaveScenarioModal

diff --git a/src/components/JsonScenarioPanel/JsonScenarioPanel.tsx b/src/components/JsonScenarioPanel/JsonScenarioPanel.tsx
@@ -5,17 +5,20 @@ import { Scenario } from "../../types/scenario";
 import { IoClose } from "react-icons/io5";
 import { ScenarioSchema } from "../../schemas/scenario";
 import { fromZodError } from "zod-validation-error";
+import { VscSync } from "react-icons/vsc";
 
 interface JsonScenarioPanelProps {
   isOpen: boolean;
   onClose: () => void;
   onApplyScenario: (scenario: Scenario) => void;
+  getCurrentScenario: () => Scenario;
 }
 
 export const JsonScenarioPanel: React.FC<JsonScenarioPanelProps> = ({
   isOpen,
   onClose,
   onApplyScenario,
+  getCurrentScenario,
 }) => {
   const [jsonError, setJsonError] = useState<string | null>(null);
   const [editorContent, setEditorContent] = useState<string>(`{
@@ -76,6 +79,18 @@ export const JsonScenarioPanel: React.FC<JsonScenarioPanelProps> = ({
     }
   };
 
+  const handleLoadCurrentState = () => {
+    try {
+      const currentScenario = getCurrentScenario();
+      setEditorContent(JSON.stringify(currentScenario, null, 2));
+      setJsonError(null);
+    } catch (error) {
+      setJsonError(
+        error instanceof Error ? error.message : "Failed to load current state"
+      );
+    }
+  };
+
   return (
     <AnimatePresence>
       {isOpen && (
@@ -102,22 +117,41 @@ export const JsonScenarioPanel: React.FC<JsonScenarioPanelProps> = ({
               }}
             >
               <h3 style={{ margin: 0 }}>Load JSON Scenario</h3>
-              <motion.button
-                onClick={onClose}
-                whileHover={{ scale: 1.1 }}
-                whileTap={{ scale: 0.9 }}
-                style={{
-                  background: "none",
-                  border: "none",
-                  color: "white",
-                  cursor: "pointer",
-                  padding: 0,
-                  display: "flex",
-                  alignItems: "center",
-                }}
-              >
-                <IoClose size={24} />
-              </motion.button>
+              <div style={{ display: "flex", gap: "12px" }}>
+                <motion.button
+                  onClick={handleLoadCurrentState}
+                  whileHover={{ scale: 1.1 }}
+                  whileTap={{ scale: 0.9 }}
+                  style={{
+                    background: "none",
+                    border: "none",
+                    color: "white",
+                    cursor: "pointer",
+                    padding: 0,
+                    display: "flex",
+                    alignItems: "center",
+                  }}
+                  title="Load Current State"
+                >
+                  <VscSync size={20} />
+                </motion.button>
+                <motion.button
+                  onClick={onClose}
+                  whileHover={{ scale: 1.1 }}
+                  whileTap={{ scale: 0.9 }}
+                  style={{
+                    background: "none",
+                    border: "none",
+                    color: "white",
+                    cursor: "pointer",
+                    padding: 0,
+                    display: "flex",
+                    alignItems: "center",
+                  }}
+                >
+                  <IoClose size={24} />
+                </motion.button>
+              </div>
             </div>
           </div>
 

diff --git a/src/hooks/useScenarioManagement.ts b/src/hooks/useScenarioManagement.ts
@@ -47,6 +47,7 @@ interface UseScenarioManagementReturn {
   handleSelectScenario: (scenario: Scenario) => void;
   handleScenarioPanelToggle: (e: React.MouseEvent) => void;
   handleSettingsPanelToggle: (e: React.MouseEvent) => void;
+  getCurrentScenario: () => Scenario;
 }
 
 export const useScenarioManagement = ({
@@ -68,44 +69,39 @@ export const useScenarioManagement = ({
   const [isSaveModalOpen, setIsSaveModalOpen] = useState(false);
   const [shareableLink, setShareableLink] = useState("");
 
+  const getCurrentScenario = useCallback((): Scenario => {
+    return {
+      id: Math.random().toString(36).substr(2, 9),
+      name: "Current State",
+      description: "Current simulator state",
+      data: {
+        settings: physicsConfig,
+        gravityPoints: gravityPoints.map(toSerializableGravityPoint),
+        particles: particles.map(toSerializableParticle),
+        paths: paths.map(toSerializableSimulatorPath),
+      },
+    };
+  }, [physicsConfig, gravityPoints, particles, paths]);
+
   const handleExportScenario = useCallback(
     (e: React.MouseEvent) => {
       e.stopPropagation();
-      const scenario: Scenario = {
-        id: Math.random().toString(36).substr(2, 9),
-        name: "",
-        description: "User saved scenario",
-        data: {
-          settings: physicsConfig,
-          gravityPoints: gravityPoints.map(toSerializableGravityPoint),
-          particles: particles.map(toSerializableParticle),
-          paths: paths.map(toSerializableSimulatorPath),
-        },
-      };
+      const scenario = getCurrentScenario();
       setShareableLink(createShareableLink(scenario));
       setIsPaused(true);
       setIsSaveModalOpen(true);
     },
-    [physicsConfig, gravityPoints, particles, paths, setIsPaused]
+    [getCurrentScenario, setIsPaused]
   );
 
   const handleSaveScenario = useCallback(
     (name: string) => {
-      const scenario: Scenario = {
-        id: Math.random().toString(36).substr(2, 9),
-        name,
-        description: "User saved scenario",
-        data: {
-          settings: physicsConfig,
-          gravityPoints: gravityPoints.map(toSerializableGravityPoint),
-          particles: particles.map(toSerializableParticle),
-          paths: paths.map(toSerializableSimulatorPath),
-        },
-      };
+      const scenario = getCurrentScenario();
+      scenario.name = name;
       saveScenario(scenario);
       setIsSaveModalOpen(false);
     },
-    [physicsConfig, gravityPoints, particles, paths, saveScenario]
+    [getCurrentScenario, saveScenario]
   );
 
   const handleSelectScenario = useCallback(
@@ -197,5 +193,6 @@ export const useScenarioManagement = ({
     handleSelectScenario,
     handleScenarioPanelToggle,
     handleSettingsPanelToggle,
+    getCurrentScenario,
   };
 };