import { createContext, useContext, useState, ReactNode } from 'react';

interface HeaderMetric {
  label: string;
  value: string | number;
  accentColor: 'blue' | 'green' | 'amber' | 'purple';
}

interface HeaderMetricsContextType {
  metrics: HeaderMetric[];
  setMetrics: (metrics: HeaderMetric[]) => void;
  clearMetrics: () => void;
}

const HeaderMetricsContext = createContext<HeaderMetricsContextType | undefined>(undefined);

export const useHeaderMetrics = () => {
  const context = useContext(HeaderMetricsContext);
  if (!context) {
    throw new Error('useHeaderMetrics must be used within a HeaderMetricsProvider');
  }
  return context;
};

interface HeaderMetricsProviderProps {
  children: ReactNode;
}

export const HeaderMetricsProvider: React.FC<HeaderMetricsProviderProps> = ({ children }) => {
  const [metrics, setMetrics] = useState<HeaderMetric[]>([]);

  const clearMetrics = () => {
    setMetrics([]);
  };

  return (
    <HeaderMetricsContext.Provider value={{ metrics, setMetrics, clearMetrics }}>
      {children}
    </HeaderMetricsContext.Provider>
  );
};

