import React, { createContext, useContext, useState } from "react";

const FabContext = createContext();

export const FabProvider = ({ children }) => {
  const [actions, setActions] = useState([]);
  const [showTrigger, setShowTrigger] = useState(true);
    const [isOffcanvasOpen, setIsOffcanvasOpen] = useState(false); 
    const [offcanvas, setOffcanvas] = useState({
    isOpen: false,
    title: "",
    content: null,
  });

  const openOffcanvas = (title, content) => {
    setOffcanvas({ isOpen: true, title, content });
    setTimeout(() => {
      const offcanvasElement = document.getElementById("globalOffcanvas");
      if (offcanvasElement) {
        const bsOffcanvas = new window.bootstrap.Offcanvas(offcanvasElement);
        bsOffcanvas.show();
      }
    }, 100); 
  };
const setOffcanvasContent = (title, content) => {
  setOffcanvas(prev => ({ ...prev, title, content }));
};

  return (
    <FabContext.Provider value={{ actions, setActions, offcanvas, openOffcanvas, showTrigger, setShowTrigger,isOffcanvasOpen, setIsOffcanvasOpen, setOffcanvasContent,  }}>
      {children}
    </FabContext.Provider>
  );
};

export const useFab = () => useContext(FabContext);