'use client';

/**
 * Lab Scroll Context
 *
 * Shares scroll state between the main content area and the header.
 * Used to collapse the main header when user scrolls in the lab section.
 */

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

type LabScrollContextValue = {
  isScrolled: boolean;
  setIsScrolled: (value: boolean) => void;
};

const LabScrollContext = createContext<LabScrollContextValue | null>(null);

export const useLabScroll = () => {
  const context = useContext(LabScrollContext);
  if (!context) {
    throw new Error('useLabScroll must be used within LabScrollProvider');
  }
  return context;
};

type LabScrollProviderProps = {
  children: ReactNode;
};

export const LabScrollProvider = ({ children }: LabScrollProviderProps) => {
  const [isScrolled, setIsScrolled] = useState(false);

  return (
    <LabScrollContext.Provider value={{ isScrolled, setIsScrolled }}>
      {children}
    </LabScrollContext.Provider>
  );
};