1  import React from 'react';
 2  import { Progress } from 'antd';
 3  import { getResourceColor } from '../utils/status';
 4  
 5  interface ResourceProgressProps {
 6    /** Resource usage percentage (0-100) */
 7    value: number;
 8    /** Progress display size */
 9    size?: 'small' | 'default';
10    /** Override color (otherwise auto-calculated from thresholds) */
11    color?: string;
12  }
13  
14  /**
15   * Resource usage progress bar with automatic color thresholds.
16   * > 80% → red, > 60% → yellow, else → green
17   */
18  const ResourceProgress: React.FC<ResourceProgressProps> = ({
19    value,
20    size = 'small',
21    color,
22  }) => {
23    const val = Number((value ?? 0).toFixed(1));
24    return (
25      <Progress
26        percent={val}
27        size={size}
28        strokeColor={color ?? getResourceColor(val)}
29      />
30    );
31  };
32  
33  export default ResourceProgress;