import { pool } from '@/lib/db'
import { notFound } from 'next/navigation'

export default async function PublicPage({ params }: { params: { id: string } }){
  const userId = params.id

  const [users]: any = await pool.query('SELECT id,name,picture,level FROM users WHERE id=?', [userId])
  if(users.length === 0) return notFound()
  const user = users[0]

  // 차단된 회원(0) 이면 404
  if(user.level === 0) return notFound()

  const [items]: any = await pool.query('SELECT * FROM items WHERE user_id=? AND is_soft_deleted=0 ORDER BY sort_order ASC, id DESC', [userId])

  return (
    <div className="min-h-screen bg-[#f8f8f8] flex justify-center py-10 px-4">
      <div className="w-full max-w-[420px] bg-white rounded-[24px] shadow-xl p-6">
        <div className="text-center mb-6">
          <img src={user.picture || '/default.png'} className="w-20 h-20 rounded-full mx-auto" alt="" />
          <h1 className="mt-3 text-xl font-bold">{user.name}의 Pick</h1>
          <p className="text-sm text-gray-400">i.yjm.kr/u/{userId}</p>
        </div>

        <div className="space-y-3">
          {items.map((it:any)=>(
            <a
              key={it.id}
              href={it.url}
              target="_blank"
              rel="noreferrer noopener"
              referrerPolicy="no-referrer"
              className="flex gap-3 p-3 border rounded-xl hover:bg-gray-50 transition"
            >
              {it.image && <img src={it.image} className="w-16 h-16 rounded-lg object-cover" alt="" />}
              <div className="flex-1">
                <div className="font-semibold text-sm line-clamp-2">{it.title || it.url}</div>
                <div className="text-xs text-gray-500 line-clamp-1">{it.description}</div>
              </div>
            </a>
          ))}
          {items.length===0 && <div className="text-center text-gray-400 py-10">아직 아이템이 없습니다.</div>}
        </div>

        <div className="mt-8 text-center text-[11px] text-gray-300">ⓒ i.yjm.kr - noreferrer로 안전하게 이동됩니다</div>
      </div>
    </div>
  )
}
