import { AlertCircle } from 'lucide-react';

import { StatePanel } from '@/components/ui/state-panel';
import { getErrorMessage } from '@/shared/errors/errorMessages';

interface PolicyStatusPanelsProps {
  readonly isLoading: boolean;
  readonly queryError: unknown;
  readonly mutationError: unknown;
}

export function PolicyStatusPanels({
  isLoading,
  queryError,
  mutationError,
}: PolicyStatusPanelsProps) {
  return (
    <>
      {isLoading && (
        <StatePanel tone="violet" loading>
          Loading policies from backend...
        </StatePanel>
      )}

      {queryError && (
        <StatePanel icon={AlertCircle} tone="red" role="alert">
          {getErrorMessage(queryError)}
        </StatePanel>
      )}

      {mutationError && (
        <StatePanel icon={AlertCircle} tone="red" role="alert">
          {getErrorMessage(mutationError)}
        </StatePanel>
      )}
    </>
  );
}
