import type { ReactNode } from 'react';
import { authService } from '../services/auth';

interface HasPermissionProps {
  /** 需要的权限码，如 device:control */
  permission: string;
  children: ReactNode;
  /** 无权限时渲染的替代内容，默认不渲染 */
  fallback?: ReactNode;
}

/**
 * 按钮级权限控制组件
 * 当当前用户拥有指定权限码时渲染 children，否则渲染 fallback
 */
export const HasPermission = ({ permission, children, fallback = null }: HasPermissionProps) => {
  if (authService.hasPermission(permission)) {
    return <>{children}</>;
  }
  return <>{fallback}</>;
};

export default HasPermission;
