import React from 'react'
import axios from 'axios'
import Link from 'next/link'
import { useRouter } from 'next/router'
import AppContainer from './appContainer'
import { AppUrl } from '../lib/api'
import { newsSeo } from '../lib/seo'

export default function News({ data = [], unavailable = false, children }) {
  const router = useRouter()
  const isHome = router.pathname === '/'
  const posts = (Array.isArray(data) ? data : []).filter(post => post && post.title && /^\d+$/.test(String(post.id)))
  if (isHome && posts.length === 0) return null

  const content = (
    <section className='lg:mx-20 sm:mx-5 my-5 RTL' aria-labelledby='news-title'>
      {isHome ? <h2 id='news-title'>اخبار و اطلاعیه‌ها</h2> : <h1 id='news-title'>اخبار و اطلاعیه‌های بیمارستان مهر پرند</h1>}
      <hr />
      {unavailable && <p role='status'>دریافت اخبار موقتاً امکان‌پذیر نیست. لطفاً کمی بعد دوباره مراجعه کنید.</p>}
      <div className='row row-cols-1 row-cols-md-3 g-4'>
        {posts.map(post => (
          <article className='col' key={post.id}>
            <div className='card h-100 p-4'>
              <h2 className='h5'>
                <Link href={`/page/news/${post.id}`}><a>{post.title}</a></Link>
              </h2>
              <p>{newsSeo(post, post.id).description}</p>
              <Link href={`/page/news/${post.id}`}><a>مشاهده خبر</a></Link>
            </div>
          </article>
        ))}
      </div>
      {!isHome && (
        <div className='mt-4'>
          <h2 className='h5'>فایل‌های معرفی بیمارستان</h2>
          <p><a download href='/take-stock.pdf'>دانلود دفترچه معرفی و فروش سهام عمومی بیمارستان مهر پرند</a></p>
          <p><a download href='/Explanatory_plan_of_Mehr_ranian_Parand_Hospital.pdf'>دانلود طرح توجیهی بیمارستان مهر پرند</a></p>
        </div>
      )}
      {children}
    </section>
  )

  return isHome ? content : <AppContainer>{content}</AppContainer>
}

export async function getServerSideProps({ res }) {
  try {
    const { data } = await axios.get(AppUrl('news'), { timeout: 10000 })
    const posts = Array.isArray(data) ? data : data && data.data
    if (!Array.isArray(posts)) throw new Error('Unexpected news response')
    return { props: { data: posts } }
  } catch (error) {
    console.warn('News list: API unavailable:', error.message)
    res.statusCode = 503
    res.setHeader('Retry-After', '60')
    return { props: { data: [], unavailable: true } }
  }
}