/**
 * Action signal badge — colored pill with label.
 */

const SIGNAL_CONFIG = {
	quick_wins:         { label: 'Quick Win',       color: 'blue' },
	content_decline:    { label: 'Declining',       color: 'red' },
	stale_content:      { label: 'Stale',           color: 'orange' },
	noindex_candidates: { label: 'Noindex?',        color: 'gray' },
	low_engagement:     { label: 'Low Engagement',  color: 'yellow' },
};

export function SignalBadge( { signal } ) {
	if ( ! signal ) return null;

	const config = SIGNAL_CONFIG[ signal ] || { label: signal, color: 'gray' };

	return (
		<span className={ `repivot-signal-badge repivot-signal-badge--${ config.color }` }>
			{ config.label }
		</span>
	);
}