import React, { useEffect } from 'react';
import { CheckCircle, AlertCircle } from 'lucide-react';
import { InstallResult } from '../../types';
import { Alert, AlertDescription, AlertTitle } from '../../components/ui/alert';

interface InstallResultMessageProps {
  result: InstallResult;
  onDismiss: () => void;
}

export const InstallResultMessage: React.FC<InstallResultMessageProps> = ({ result, onDismiss }) => {
  useEffect(() => {
    if (result.success) {
      const timer = setTimeout(() => {
        onDismiss();
      }, 5000);
      return () => clearTimeout(timer);
    }
  }, [result.success, onDismiss]);

  if (result.success) {
    return (
      <Alert variant="success">
        <CheckCircle className="h-5 w-5" />
        <AlertDescription>
          <AlertTitle className="text-sm mb-1">Installation Successful</AlertTitle>
          <p className="text-sm">{result.message}</p>
        </AlertDescription>
      </Alert>
    );
  }

  return (
    <Alert variant="destructive">
      <AlertCircle className="h-5 w-5" />
      <AlertDescription>
        <AlertTitle className="text-sm mb-1">Installation Failed</AlertTitle>
        <p className="text-sm">{result.message}</p>
      </AlertDescription>
    </Alert>
  );
};
