import client from '../api/client'
import { useState } from 'react'

export default function OfflinePage() {
  const [checking, setChecking] = useState(false)

  async function retry() {
    setChecking(true)
    try {
      await client.get('/api/system/health')
      window.location.href = '/'
    } catch {
      setChecking(false)
    }
  }

  return (
    <div className="page page--centered">
      <div style={{ textAlign: 'center', maxWidth: 300 }}>
        <p style={{ fontSize: 48, marginBottom: 16 }}>📡</p>
        <h2 style={{ color: '#e2e8f0', marginBottom: 8 }}>Δεν υπάρχει σύνδεση</h2>
        <p style={{ color: '#64748b', marginBottom: 32 }}>
          Δεν είναι δυνατή η επικοινωνία με το σύστημα. Ελέγξτε τη σύνδεση WiFi.
        </p>
        <button className="btn btn--primary btn--lg" onClick={retry} disabled={checking}>
          {checking ? 'Έλεγχος…' : 'Επανάληψη'}
        </button>
      </div>
    </div>
  )
}
