'use client';

/**
 * Home Page
 *
 * Story 3.1: History Feed UI integration
 *
 * The home screen IS the history feed. Shows:
 * - History feed with lazy loading
 * - FAB (Floating Action Button) to start new vent
 * - HistoryDetailSheet for viewing past entries
 *
 * User Flow:
 * - Returning users see their journal of completed posts
 * - First-time users see empty state with CTA
 * - FAB navigates to chat for new venting session
 * - Tapping history card opens detail sheet
 */

import { HistoryFeed, HistoryDetailSheet } from '@/components/features/journal';
import { Plus } from 'lucide-react';
import Link from 'next/link';
import { AppHeader } from '@/components/layout';

export default function HomePage() {
  return (
    <div className="min-h-screen bg-background">
      {/* Header */}
      <AppHeader />

      {/* Main Content - History Feed */}
      <main className="pb-24">
        <HistoryFeed />
      </main>

      {/* Floating Action Button - New Vent */}
      <Link
        href="/chat?new=true"
        className="fixed bottom-6 right-6 min-h-[56px] w-14 bg-slate-800 text-white rounded-full shadow-lg hover:bg-slate-700 transition-colors flex items-center justify-center"
        aria-label="Start new vent"
      >
        <Plus className="w-6 h-6" aria-hidden="true" />
      </Link>

      {/* History Detail Sheet */}
      <HistoryDetailSheet />
    </div>
  );
}
