---
import type { ComWhtwndBlogEntryRecord } from '../../lib/generated/com-whtwnd-blog-entry';
import { marked } from 'marked';

interface Props {
  record: ComWhtwndBlogEntryRecord;
  showTags?: boolean;
  showTimestamp?: boolean;
}

const { record, showTags = true, showTimestamp = true } = Astro.props;

const formatDate = (dateString: string) => {
  return new Date(dateString).toLocaleDateString('en-US', {
    year: 'numeric',
    month: 'long',
    day: 'numeric',
  });
};

const published = record.createdAt;
const isValidDate = published ? !isNaN(new Date(published).getTime()) : false;
---

<article class="bg-white dark:bg-gray-800 rounded-lg shadow-sm border border-gray-200 dark:border-gray-700 p-6 mb-6">
  <header class="mb-4">
    <h2 class="text-2xl font-bold text-gray-900 dark:text-white mb-2">
      {record.title}
    </h2>
    
    {showTimestamp && isValidDate && (
      <div class="text-sm text-gray-500 dark:text-gray-400 mb-3">
        Published on {formatDate(published!)}
      </div>
    )}
  </header>
  
  <div class="prose prose-gray dark:prose-invert max-w-none">
    <div class="text-gray-700 dark:text-gray-300 leading-relaxed">
      <Fragment set:html={await marked(record.content || '')} />
    </div>
  </div>
</article>