import { FC, createContext, useState, useContext } from 'react';

export type ScrollPositionContextValue = {
  setScrollPosition: (position: number) => void;
  scrollPosition: number;
};

const ScrollPositionContext = createContext<ScrollPositionContextValue>({
  setScrollPosition: () => null,
  scrollPosition: 0,
});

export const ScrollPositionProvider: FC<
  React.PropsWithChildren<unknown>
> = props => {
  const { children } = props;

  const [scrollPosition, setScrollPosition] = useState(0);

  return (
    <ScrollPositionContext.Provider
      value={{
        setScrollPosition,
        scrollPosition,
      }}
    >
      {children}
    </ScrollPositionContext.Provider>
  );
};

export const useScrollPosition = () => useContext(ScrollPositionContext);

export default ScrollPositionContext;
