import Link from 'next/link';
import { AppSidebar, AppTopbar, EmptyChart, MetricCard, MobileDock, PremiumFarmScene, ProgressRing, StatusPill, VisualNotice } from '../components/ui';
import { apiGet, defaultProjectId, displayNumber } from '../lib/api';

export const dynamic = 'force-dynamic';

type Overview={configured:boolean;metrics:null|{eggs_today?:number;mortality_7d?:number;feed_today?:number;latest_poultry?:number};recentReports:Array<Record<string,unknown>>;openTasks:Array<Record<string,unknown>>;alerts:Array<Record<string,unknown>>};
type Summary={configured:boolean;finance?:{sales_total?:number;expenses_total?:number}};

export default async function DashboardPage() {
  const projectId=defaultProjectId();
  const now=new Date(); const from=`${now.getUTCFullYear()}-${String(now.getUTCMonth()+1).padStart(2,'0')}-01`; const to=now.toISOString().slice(0,10);
  const [overview,summary]=projectId?await Promise.all([
    apiGet<Overview>(`/operations/overview?projectId=${encodeURIComponent(projectId)}`),
    apiGet<Summary>(`/reports/summary?projectId=${encodeURIComponent(projectId)}&from=${from}&to=${to}`)
  ]):[null,null];
  const sales=Number(summary?.finance?.sales_total||0), expenses=Number(summary?.finance?.expenses_total||0);
  const net=summary?.configured?sales-expenses:null;
  const connected=Boolean(overview?.configured && projectId);

  return (
    <main className="app-shell">
      <AppSidebar />
      <section className="app-content">
        <AppTopbar title="مرحباً بك" subtitle="نظرة تشغيلية موحدة على المزرعة والمشاريع" />

        <section className="dashboard-hero premium-dashboard-hero">
          <div className="dashboard-hero-copy">
            <StatusPill tone={connected?'green':'amber'}>{connected?'بيانات تشغيلية متصلة':'بانتظار ربط المشروع'}</StatusPill>
            <h2>المزرعة تحت عينك، من الإنتاج إلى التقارير</h2>
            <p>كل الأرقام تظهر فقط بعد إدخال بيانات تشغيلية فعلية وربطها بالمشروع.</p>
            <div className="hero-meta-row"><span>◉ خان النص</span><span>◫ {projectId?'DEFAULT_PROJECT_ID مضبوط':'حدد DEFAULT_PROJECT_ID بعد إنشاء المشروع'}</span></div>
          </div>
          <div className="dashboard-scene-wrap"><PremiumFarmScene compact /></div>
          <div className="weather-placeholder"><small>الموقع التقريبي</small><strong>خان النص</strong><span>كربلاء — النجف</span></div>
        </section>

        <div className="metric-grid dashboard-metrics">
          <MetricCard label="صافي التدفق الشهري" value={net===null?'—':displayNumber(net)} hint="المبيعات - المصروفات" icon="↗" />
          <MetricCard label="المصاريف الشهرية" value={summary?.configured?displayNumber(expenses):'—'} hint="من القيود الفعلية" icon="◷" accent="amber" />
          <MetricCard label="إنتاج البيض اليوم" value={displayNumber(overview?.metrics?.eggs_today)} hint="من التقرير اليومي" icon="◉" accent="blue" />
          <MetricCard label="إجمالي الدجاج الحالي" value={displayNumber(overview?.metrics?.latest_poultry)} hint="آخر إغلاق مسجل" icon="◌" accent="rose" />
        </div>

        <div className="dashboard-grid dashboard-main-grid">
          <article className="content-card chart-card premium-lift">
            <div className="card-head"><div><span className="eyebrow">الإنتاج</span><h3>أداء الإنتاج</h3></div><StatusPill tone="gray">آخر 30 يوم</StatusPill></div>
            <EmptyChart label="أداء الإنتاج" />
          </article>
          <article className="content-card chart-card premium-lift">
            <div className="card-head"><div><span className="eyebrow">المالية</span><h3>الإيرادات والمصروفات</h3></div><StatusPill tone="gray">من القيود</StatusPill></div>
            <EmptyChart label="الإيرادات والمصروفات" variant="bars" />
          </article>
          <article className="content-card progress-card premium-lift">
            <div className="card-head"><div><span className="eyebrow">المشروع</span><h3>تقدم المشروع</h3></div></div>
            <ProgressRing value={0} label="يرتبط بالمراحل" />
            <div className="mini-status-list"><div><span>المستندات</span><b>مركز مستقل</b></div><div><span>الإنتاج</span><b>{connected?'متصل':'بانتظار البيانات'}</b></div><div><span>التقارير</span><b>{summary?.configured?'متصلة':'بانتظار البيانات'}</b></div></div>
          </article>
        </div>

        <div className="dashboard-grid two">
          <article id="projects" className="content-card premium-lift">
            <div className="card-head"><div><span className="eyebrow">المشروع</span><h3>مشروع المزرعة</h3></div><StatusPill tone={projectId?'green':'amber'}>{projectId?'محدد':'يحتاج ربط'}</StatusPill></div>
            <div className="project-row-card"><div className="project-thumb"><span>دواجن وبيض</span></div><div><h4>توسعة مزرعة دواجن وبيض</h4><p>خان النص — موقع تقريبي</p><StatusPill tone="gray">لا تعرض بيانات غير موثقة</StatusPill></div></div>
          </article>
          <article className="content-card premium-lift">
            <div className="card-head"><div><span className="eyebrow">المتابعة</span><h3>آخر المهام والإشارات</h3></div></div>
            <div className="activity-list">
              {overview?.alerts?.slice(0,2).map((alert,index)=><div key={String(alert.id??index)}><span className="activity-dot"/><p><strong>{String(alert.title??'إشارة تشغيلية')}</strong><small>{String(alert.summary??'')}</small></p></div>)}
              {overview?.openTasks?.slice(0,2).map((task,index)=><div key={String(task.id??index)}><span className="activity-dot"/><p><strong>{String(task.title??'مهمة')}</strong><small>{String(task.due_at??'بدون موعد')}</small></p></div>)}
              {!overview?.alerts?.length && !overview?.openTasks?.length && <><div><span className="activity-dot" /><p><strong>Cron Scheduler مجهز لـ cPanel</strong><small>يفحص المهام والوثائق والصحة بعد النشر.</small></p></div><div><span className="activity-dot muted" /><p><strong>لا توجد تنبيهات فعلية بعد</strong><small>تظهر الإشارات من البيانات التشغيلية فقط.</small></p></div></>}
            </div>
          </article>
        </div>

        <div className="quick-action-grid">
          <Link href="/dashboard/farm"><span>＋</span><b>السجل اليومي</b><small>إنتاج وتشغيل</small></Link>
          <Link href="/dashboard/documents"><span>▤</span><b>المستندات</b><small>الملكية والتراخيص</small></Link>
          <Link href="/dashboard/reports"><span>▥</span><b>التقارير</b><small>PDF / Excel / CSV</small></Link>
          <Link href="/dashboard/ai"><span>✦</span><b>تحليل ذكي</b><small>إشارات تشغيلية</small></Link>
        </div>

        <VisualNotice>القيم المالية والإنتاجية الفعلية تأتي من قاعدة البيانات. الإيداع والسحب والاستثمار تعمل كطلبات وقيود داخلية بمراجعة الإدارة، بدون بوابة دفع إلكترونية.</VisualNotice>
      </section>
      <MobileDock />
    </main>
  );
}