import type { ReactNode } from 'react';
import { Result } from 'antd';
import { useAuth } from '../hooks/useAuth';

export function RequireRole({ role, children }: { role: string; children: ReactNode }) {
  const { user } = useAuth();

  if (!user || !user.roles.includes(role)) {
    return (
      <Result
        status="403"
        title="403"
        subTitle="You do not have permission to view this page."
      />
    );
  }

  return <>{children}</>;
}