"use client";
import classNames from "classnames";
import { useEffect, useState } from "react";
import { EVENT_TYPES, useEventHandlerStore } from "@store/EventHandler.Store";
import style from "./Loading.module.css";
export default function Loading() {
    const eventHandler = useEventHandlerStore();
    const [classesNames, setClassesNames] = useState(
        classNames(style.loading, style.loadingHidden)
    );

    useEffect(() => {
        switch (eventHandler.eventType) {
            case EVENT_TYPES.SAVE:
                setClassesNames(classNames(style.loading, style.loadingVisible));
                break;
            case EVENT_TYPES.FILTER:
                setClassesNames(classNames(style.loading, style.loadingVisible));
                break;
            case EVENT_TYPES.LOADING:
                setClassesNames(classNames(style.loading, style.loadingVisible));
                break;
            default:
                setClassesNames(classNames(style.loading, style.loadingHidden));
                break;
        }
    }, [eventHandler.eventType]);

    return (
        <>
            <div className={classesNames}>&nbsp;</div>
        </>
    );
}