Despliegue en VPS

src/App.jsx

@@ -2,50 +2,71 @@ import { useEffect, useState } from "react";
 import MapView from "./components/MapView.jsx";
 import Sidebar from "./components/Sidebar.jsx";
 import SubmitForm from "./components/SubmitForm.jsx";
+import AdminPanel from "./components/AdminPanel.jsx";
 import { getApproved, submit } from "./services/businessRepository.js";
 
 export default function App() {
   const [businesses, setBusinesses] = useState([]);
   const [selectedId, setSelectedId] = useState(null);
-  const [formOpen, setFormOpen] = useState(false);
+  const [formStep, setFormStep] = useState(null); // null | 'picking' | 'editing'
   const [pickedLocation, setPickedLocation] = useState(null);
+  const [adminOpen, setAdminOpen] = useState(false);
 
-  useEffect(() => {
-    setBusinesses(getApproved());
-  }, []);
+  async function loadBusinesses() {
+    setBusinesses(await getApproved());
+  }
+
+  useEffect(() => { loadBusinesses(); }, []);
 
   const selected = businesses.find((b) => b.id === selectedId) || null;
 
-  function handleSubmit(data) {
-    submit(data);
-    setFormOpen(false);
+  function handlePickLocation(loc) {
+    setPickedLocation(loc);
+    if (formStep === "picking") setFormStep("editing");
+  }
+
+  async function handleSubmit(data) {
+    await submit(data);
+    setFormStep(null);
     setPickedLocation(null);
     alert("¡Gracias! Tu propuesta queda pendiente de revisión.");
   }
 
+  function handleCancel() {
+    setFormStep(null);
+    setPickedLocation(null);
+  }
+
   return (
     <div className="app">
       <Sidebar
         business={selected}
-        onContribute={() => setFormOpen(true)}
+        onContribute={() => setFormStep("picking")}
         onClose={() => setSelectedId(null)}
+        picking={formStep === "picking"}
+        onCancelPicking={handleCancel}
+        onAdmin={() => setAdminOpen(true)}
       />
       <MapView
         businesses={businesses}
         selectedId={selectedId}
         onSelect={setSelectedId}
-        pickingLocation={formOpen}
-        onPickLocation={setPickedLocation}
+        pickingLocation={formStep === "picking"}
+        onPickLocation={handlePickLocation}
         pickedLocation={pickedLocation}
       />
-      {formOpen && (
+      {formStep === "editing" && (
         <SubmitForm
           pickedLocation={pickedLocation}
           onSubmit={handleSubmit}
-          onCancel={() => {
-            setFormOpen(false);
-            setPickedLocation(null);
-          }}
+          onCancel={handleCancel}
+          onRepick={() => setFormStep("picking")}
+        />
+      )}
+      {adminOpen && (
+        <AdminPanel
+          onClose={() => setAdminOpen(false)}
+          onApproved={loadBusinesses}
         />
       )}
     </div>