import { useRegisterSW } from 'virtual:pwa-register/react'

export default function UpdatePrompt() {
  const {
    needRefresh: [needRefresh],
    updateServiceWorker,
  } = useRegisterSW()

  if (!needRefresh) return null

  return (
    <div style={{
      position: 'fixed',
      bottom: 80,
      left: '50%',
      transform: 'translateX(-50%)',
      zIndex: 9999,
      background: 'var(--bg2)',
      border: '1px solid var(--accent)',
      borderRadius: 16,
      padding: '14px 20px',
      display: 'flex',
      alignItems: 'center',
      gap: 16,
      boxShadow: '0 8px 32px rgba(0,0,0,0.4)',
      whiteSpace: 'nowrap',
    }}>
      <span style={{ fontSize: 14, color: 'var(--text)', fontWeight: 500 }}>
        Νέα έκδοση διαθέσιμη
      </span>
      <button
        onClick={() => updateServiceWorker(true)}
        style={{
          background: 'var(--accent)',
          color: '#0f172a',
          border: 'none',
          borderRadius: 10,
          padding: '8px 16px',
          fontSize: 14,
          fontWeight: 700,
          cursor: 'pointer',
        }}
      >
        Ενημέρωση
      </button>
    </div>
  )
}
