import React, { useState } from 'react';
import { VersionInfo } from '../../shared/types';
import '../styles/UpdateNotification.css';

interface UpdateNotificationProps {
  versionInfo: VersionInfo;
  onClose: () => void;
}

const UpdateNotification: React.FC<UpdateNotificationProps> = ({
  versionInfo,
  onClose,
}) => {
  const [isDownloading, setIsDownloading] = useState(false);

  const handleUpdate = async () => {
    setIsDownloading(true);

    try {
      const installerPath = await window.electronAPI.downloadUpdate(
        versionInfo.downloadUrl
      );
      alert(`Обновление загружено: ${installerPath}\nПриложение будет закрыто для установки.`);
      // App will close automatically after opening installer
    } catch (error) {
      console.error('Error downloading update:', error);
      alert('Ошибка при загрузке обновления');
      setIsDownloading(false);
    }
  };

  return (
    <div className="update-notification">
      <div className="update-content">
        <h3>Доступно обновление!</h3>
        <p className="version">
          Версия <strong>{versionInfo.latestVersion}</strong>
        </p>
        <div className="changelog">
          <h4>Что нового:</h4>
          <pre>{versionInfo.changelog}</pre>
        </div>
        <div className="update-actions">
          <button
            className="button-primary"
            onClick={handleUpdate}
            disabled={isDownloading}
          >
            {isDownloading ? 'Загрузка...' : 'Обновить сейчас'}
          </button>
          <button className="button-secondary" onClick={onClose}>
            Напомнить позже
          </button>
        </div>
      </div>
    </div>
  );
};

export default UpdateNotification;