import type { ReactNode } from 'react'
import { useSchoolYear } from '../../context/SchoolYearContext'

export function ReadOnlyGuard({
  children,
  fallback,
}: {
  children: ReactNode
  fallback?: ReactNode
}) {
  const { isReadOnlyYear, selectedSchoolYear } = useSchoolYear()

  if (!isReadOnlyYear) return <>{children}</>

  return (
    <div className="border rounded p-3 bg-light text-muted">
      {fallback ?? `This action is disabled because ${selectedSchoolYear?.name ?? 'the selected year'} is read-only.`}
    </div>
  )
}