import type { ReactNode } from 'react'
import { hasPermission } from '@platform-modules/auth'
import { useCurrentUser } from './useCurrentUser.js'

export interface RequireCapabilityProps {
  capability: string
  fallback?: ReactNode
  children: ReactNode
}

/**
 * UX-only capability guard — hides children when the current user lacks the capability.
 * Authorization path: `hasPermission` from `@platform-modules/auth`. The server route
 * MUST re-authorize; hiding a button is not access control.
 */
export function RequireCapability({ capability, fallback = null, children }: RequireCapabilityProps) {
  const { user, loading } = useCurrentUser()

  if (loading || !user) return fallback

  return hasPermission(user, capability) ? children : fallback
}
