"use client";

import type { Dispatch, ReactNode, SetStateAction } from "react";
import React, { useState } from "react";

interface ContextType {
  isIndicating: boolean;
  isActive: boolean;
  setIsActive: Dispatch<SetStateAction<boolean>>;
  setIsIndicating: Dispatch<SetStateAction<boolean>>;
  hasBorderOnHover?: boolean;
}

export const Context = React.createContext<ContextType>({
  isIndicating: false,
  isActive: false,
  setIsActive: () => {},
  setIsIndicating: () => {},
  hasBorderOnHover: undefined,
});

interface ProviderProps {
  children: ReactNode;
  hasBorderOnHover?: boolean;
}

export const Provider: React.FC<ProviderProps> = (props) => {
  const [isIndicating, setIsIndicating] = useState(false);
  const [isActive, setIsActive] = useState(false);

  return (
    <Context.Provider
      value={{
        isIndicating,
        setIsIndicating,
        isActive,
        setIsActive,
        hasBorderOnHover: props.hasBorderOnHover,
      }}
    >
      {props.children}
    </Context.Provider>
  );
};