import {
  createContext,
  type Dispatch,
  type SetStateAction,
  useContext,
  useState,
} from 'react';

export type MobileContextValue = {
  isMobile: boolean;
  setIsMobile: Dispatch<SetStateAction<boolean>>;
};

const MobileContext = createContext<MobileContextValue>({
  isMobile: false,
  setIsMobile: () => null,
});

export const MobileProvider = ({ children }: { children: React.ReactNode }) => {
  const [isMobile, setIsMobile] = useState(false);

  return (
    <MobileContext.Provider value={{ isMobile, setIsMobile }}>
      {children}
    </MobileContext.Provider>
  );
};

export const useMobile = () => useContext(MobileContext);