46 lines
1.3 KiB
TypeScript
46 lines
1.3 KiB
TypeScript
import React, { useEffect } from "react";
|
|
import mqtt from "mqtt";
|
|
import { useDrieUIValue } from "../../../store/store";
|
|
|
|
const MqttEvents = () => {
|
|
const { setTouch, setTemperature, setHumidity } = useDrieUIValue();
|
|
useEffect(() => {
|
|
|
|
const client = mqtt.connect(`ws://${process.env.REACT_APP_SERVER_MQTT_URL}`);
|
|
|
|
client.subscribe("touch");
|
|
client.subscribe("temperature");
|
|
client.subscribe("humidity");
|
|
|
|
const handleMessage = (topic: string, message: any) => {
|
|
const value = message.toString();
|
|
|
|
if (topic === "touch") {
|
|
setTouch(value);
|
|
} else if (topic === "temperature") {
|
|
setTemperature(parseFloat(value));
|
|
} else if (topic === "humidity") {
|
|
setHumidity(parseFloat(value));
|
|
}
|
|
};
|
|
|
|
client.on("message", handleMessage);
|
|
|
|
client.on("error", (err) => {
|
|
console.error("MQTT Connection Error:", err);
|
|
});
|
|
|
|
client.on("close", () => {
|
|
console.log("MQTT Connection Closed");
|
|
});
|
|
|
|
return () => {
|
|
client.end();
|
|
};
|
|
}, [setTouch, setTemperature, setHumidity]);
|
|
|
|
return null;
|
|
};
|
|
|
|
export default MqttEvents;
|