import type { DrupalNode } from "@/lib/types"

interface NodeArticleTeaserProps {
  node: DrupalNode
}

export function NodeArticleTeaser({ node }: NodeArticleTeaserProps) {
  const href = node.path?.alias || `/node/${node.id}`

  return (
    <article className="group rounded-lg border border-gray-200 bg-white p-6 shadow-sm transition hover:shadow-md">
      <h3 className="mb-2 text-xl font-semibold">
        <a href={href} className="text-gray-900 group-hover:text-emerald-500">
          {node.title}
        </a>
      </h3>
      <div className="mb-3 flex items-center gap-3 text-sm text-gray-500">
        {node.uid?.display_name && (
          <span>By {node.uid.display_name}</span>
        )}
        <time dateTime={node.created}>
          {new Date(node.created).toLocaleDateString("en-US", {
            year: "numeric",
            month: "long",
            day: "numeric",
          })}
        </time>
      </div>
      {node.body?.summary && (
        <p className="line-clamp-3 text-gray-600">{node.body.summary}</p>
      )}
    </article>
  )
}