import { usePage } from '@inertiajs/react';
import React from 'react';
import { PageProps } from '@/types';

interface CanProps {
    ability: string | string[];
    children: React.ReactNode;
    fallback?: React.ReactNode;
}

export function Can({ ability, children, fallback = null }: CanProps) {
    const { permissions } = usePage<PageProps>().props.auth;
    const abilities = Array.isArray(ability) ? ability : [ability];
    
    const allowed = abilities.some(a => permissions.includes(a));
    
    return allowed ? <>{children}</> : <>{fallback}</>;
}