import { useScopes } from '../auth/useScopes';
import { useOrgStore } from '../auth/useOrganization';

interface Props {
  scope: string;
  children: React.ReactNode;
  fallback?: React.ReactNode;
}

export function RequireScope({ scope, children, fallback }: Props) {
  const scopes = useScopes();
  const scopesReady = useOrgStore((s) => s.scopesReady);
  if (!scopesReady) return null; // Still loading — don't redirect yet
  if (!scopes.has(scope)) return fallback ? <>{fallback}</> : null;
  return <>{children}</>;
}
