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;
