diff --git a/src/pages/makerspace/EquipmentCard.tsx b/src/pages/makerspace/EquipmentCard.tsx index dd06308..70b411f 100644 --- a/src/pages/makerspace/EquipmentCard.tsx +++ b/src/pages/makerspace/EquipmentCard.tsx @@ -17,6 +17,7 @@ import type { Category } from "../../types/Category"; interface EquipmentCardProps { equipment: Equipment; + onUpdate: () => void; } type EquipmentStatus = "available" | "error" | "paused" | "busy" | "offline"; @@ -51,11 +52,14 @@ const { Paragraph } = Typography; const EquipmentCard: React.FC = ({ equipment, + onUpdate, }: EquipmentCardProps) => { const [category, setCategory] = useState(); const [isLoading, setIsLoading] = useState(true); const navigate = useNavigate(); + const delay = 5000; + useEffect(() => { const fetchData = async () => { const response = await axios.get( @@ -64,9 +68,29 @@ const EquipmentCard: React.FC = ({ }` ); setCategory(response.data); + setIsLoading(false); }; + + const fetchStatus = async () => { + if (equipment.ipUrl) { + const updatedStatus = await axios.get( + `${import.meta.env.VITE_BACKEND_URL}/equipment/status/${ + equipment._id + }` + ); + if (equipment !== updatedStatus.data) { + onUpdate(); + } + } + }; fetchData(); + + const interval = setInterval(() => { + fetchStatus(); + }, delay); + + return () => clearInterval(interval); }, [equipment]); return ( @@ -119,13 +143,13 @@ const EquipmentCard: React.FC = ({ > = ({ > {equipment.status} - } > -