const RISK_LABEL = {
  low: 'low',
  medium: 'medium',
  high: 'high',
  local: 'local',
  irreversible_external: 'irreversible',
};

function riskClass(level) {
  if (level === 'irreversible_external') return 'irreversible';
  if (level === 'local') return 'low';
  return level || 'low';
}

/**
 * Risk-tier dot + caps label. Pure presentational, server-renderable.
 *
 * @param {{ level?: string }} props
 */
export default function RiskDot({ level }) {
  if (!level) return null;
  const cls = riskClass(level);
  const label = RISK_LABEL[level] || level;
  return (
    <span className="mkt-risk">
      <span className={`mkt-risk-dot ${cls}`} aria-hidden="true" />
      {label}
    </span>
  );
}
