import React, { useState } from 'react';
import { Logo } from './Navbar/types.d';

type ContextType = {
  isSideBarVisible: boolean;
  toggleSideBarVisibility: (isVisible?: boolean) => void;

  logo: Logo;
  setLogo: (logo: Logo) => void;
};

export const Context = React.createContext<ContextType>({
  isSideBarVisible: true,
  toggleSideBarVisibility: () => {},
  logo: { light: () => null, dark: () => null, onClick: () => {} },
  setLogo: () => {},
});

export const useInitContext = (): ContextType => {
  const [isSideBarVisible, setIsSideBarVisible] = useState(false);
  const [logo, setLogo] = useState<Logo>({ light: () => null, dark: () => null, onClick: () => {} });
  const toggleSideBarVisibility = (isVisible?: boolean) => setIsSideBarVisible((prevState) => isVisible ?? !prevState);
  return { isSideBarVisible, toggleSideBarVisibility, logo, setLogo };
};
