import { useState, useEffect } from 'react';
import { useNavigate } from 'react-router-dom';
import { useAuth } from '../context/AuthContext';
import { getDownloadInfo } from '../api/download';
import './DownloadSection.css';

export default function DownloadSection() {
  const [info, setInfo] = useState(null);
  const { user } = useAuth();
  const navigate = useNavigate();

  useEffect(() => {
    getDownloadInfo().then(setInfo);
  }, []);

  const handleDownload = (e) => {
    if (!user) {
      e.preventDefault();
      navigate('/login');
    }
  };

  if (!info) return null;

  return (
    <section className="download-section">
      <div className="download-content">
        <h2 className="download-title">게임 런처 다운로드</h2>
        <p className="download-meta">
          {info.fileName} &middot; {info.fileSize} &middot; {info.version}
        </p>
        <a href={info.url} download onClick={handleDownload} className="btn-download">
          {user ? '다운로드' : '로그인 후 다운로드'}
        </a>
      </div>
    </section>
  );
}