import {useSite} from '@site/lib/site-context';

/** 승인해 함께 발행한 소식의 사본. 플랫폼 인용·임베드·JSON-LD 사실로 취급하지 않는다. */
export function SocialPostsSection() {
  const posts = useSite().socialPosts ?? [];
  if (!posts.length) return null;
  return <section id="social-posts" className="mx-auto w-full max-w-5xl px-6 py-12">
    <h2 className="mb-3 text-2xl font-semibold">함께 발행한 소식</h2>
    <p className="mb-6 text-sm opacity-85">사장님이 승인해 홈페이지와 Threads에 함께 전한 소식입니다.</p>
    <div className="grid gap-4 md:grid-cols-3">{posts.map((post) => <article key={post.postId} className="rounded-xl border border-current/15 p-5">
      <time dateTime={post.postedAt} className="text-sm opacity-85">{new Date(post.postedAt).toLocaleDateString('sv-SE', {timeZone: 'Asia/Seoul'})} (한국시간)</time>
      <p className="my-4 whitespace-pre-wrap break-words">{post.body}</p>
      {post.permalink && <a href={post.permalink} target="_blank" rel="noopener noreferrer" className="text-sm underline underline-offset-4">SNS에 올린 글 보기</a>}
    </article>)}</div>
  </section>;
}