import { Button } from "@contentful/f36-components";
import { useAuth } from "@/contexts/AuthContext";
import type { ComponentProps } from "react";

interface PermissionButtonProps extends Omit<ComponentProps<typeof Button>, "children"> {
  menuId: string;
  action: string; // 'add' | 'edit' | 'delete' | 'view' | 'export' | 'import' | ...
  children: React.ReactNode;
}

/**
 * 带权限控制的按钮组件
 * 如果用户没有权限，按钮将不会渲染
 */
export default function PermissionButton({
  menuId,
  action,
  children,
  ...buttonProps
}: PermissionButtonProps) {
  const { hasPermission } = useAuth();

  if (!hasPermission(menuId, action)) {
    return null;
  }

  return <Button {...buttonProps}>{children}</Button>;
}