import type { DashboardPage } from '@/business/dashboard/types';
import { DashboardFramePreview } from '@/components/dashboard/DashboardFramePreview';
import { DashboardHero } from '@/components/dashboard/DashboardHero';
import { DashboardQuickActions } from '@/components/dashboard/DashboardQuickActions';
import { DashboardQuotePanel } from '@/components/dashboard/DashboardQuotePanel';
import { DashboardSignOfWeek } from '@/components/dashboard/DashboardSignOfWeek';
import { DashboardUpcomingEvents } from '@/components/dashboard/DashboardUpcomingEvents';
import { DashboardWeeklyProgress } from '@/components/dashboard/DashboardWeeklyProgress';
import { DashboardZoneCheckIn } from '@/components/dashboard/DashboardZoneCheckIn';

interface DashboardViewProps {
  readonly page: DashboardPage;
}

export function DashboardView({ page }: DashboardViewProps) {
  return (
    <div className="space-y-6">
      <DashboardHero
        greeting={page.greeting}
        userName={page.userName}
        latestFrame={page.latestFrame}
      />

      <DashboardQuotePanel quote={page.todayQuote} state={page.quoteState} />

      <DashboardZoneCheckIn
        zones={page.zoneOptions}
        activeZone={page.activeZone}
        isSaving={page.isZoneSaving}
        errorMessage={page.zoneErrorMessage}
        onCheckIn={page.checkInZone}
        onReset={page.resetZone}
      />

      <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
        <DashboardFramePreview
          latestFrame={page.latestFrame}
          onNavigate={page.goToModule}
        />

        <div className="space-y-6">
          <DashboardUpcomingEvents
            events={page.upcomingEvents}
            state={page.eventsState}
          />
          <DashboardWeeklyProgress
            items={page.complianceItems}
            state={page.complianceState}
          />
          <DashboardSignOfWeek
            sign={page.signOfWeek}
            state={page.signOfWeekState}
            onNavigate={page.goToModule}
          />
        </div>
      </div>

      <DashboardQuickActions
        actions={page.quickActions}
        onNavigate={page.goToModule}
      />
    </div>
  );
}
