// Copyright: © 2026 TWWIM UG. All rights reserved. (www.twwim.com)
/**
 * SaveErrorBanner — red banner surfacing the mutation failure message.
 *
 * @layer Presentation
 */

import { AlertCircle } from 'lucide-react';
import type { TFunction } from '../lib/constants';

interface SaveErrorBannerProps {
  error: Error;
  t: TFunction;
}

export function SaveErrorBanner({ error, t }: SaveErrorBannerProps) {
  return (
    <div className="bg-red-50 border border-red-200 rounded-lg p-4 flex gap-3">
      <AlertCircle className="text-red-600 shrink-0 mt-0.5" size={18} />
      <div className="text-sm">
        <p className="font-medium text-red-900 mb-1">
          {t('tenants.pluginSettings.saveFailed')}
        </p>
        <p className="text-red-800">{error.message}</p>
      </div>
    </div>
  );
}