feat(cc-052): enhance Intelligence Overview with Market Signals section

src/app/dashboard/intelligence/page.tsx

@@ -3,50 +3,61 @@
 import Link from 'next/link';
 import { useQuery } from '@tanstack/react-query';
 import { apiFetch } from '../../../lib/api';
-import type { SavedSegment, ResearchBrief } from '../../../lib/api';
+import type { SavedSegment, ResearchBrief, FinancialSignal } from '../../../lib/api';
 import { useSession } from '../../../components/session-provider';
 
 const B = '/dashboard';
 
-interface StatCard { label: string; value: number | string; href: string; sublabel?: string }
+const SEV_CFG = {
+  critical: { borderClass: 'border-l-signal-danger', badgeClass: 'bg-signal-danger text-white', icon: '!' },
+  warning:  { borderClass: 'border-l-signal-warn',   badgeClass: 'bg-signal-warn text-white',   icon: '⚠' },
+  info:     { borderClass: 'border-l-bronze-deep',   badgeClass: 'bg-bronze-wash text-bronze-deep', icon: 'i' },
+} as const;
+
+const CAT_LABEL: Record<string, string> = {
+  macro: 'Macro', fx: 'Valute', rates: 'Rate', news: 'Știri', commodity: 'Materii prime',
+};
 
 export default function IntelligenceOverviewPage() {
   const { activeTenant } = useSession();
   const tenantId = activeTenant?.tenantId ?? '';
+  const opts = { enabled: Boolean(tenantId), staleTime: 60_000 };
 
   const { data: segments = [], isLoading: loadingSegs } = useQuery({
     queryKey: ['segments-intel', tenantId],
     queryFn: () => apiFetch<SavedSegment[]>('/v1/segments', { tenantId }),
-    enabled: Boolean(tenantId),
-    staleTime: 60_000,
+    ...opts,
   });
 
   const { data: briefs = [], isLoading: loadingBriefs } = useQuery({
     queryKey: ['briefs-intel', tenantId],
     queryFn: () => apiFetch<ResearchBrief[]>('/v1/research-briefs', { tenantId }),
-    enabled: Boolean(tenantId),
-    staleTime: 60_000,
+    ...opts,
   });
 
-  const isLoading = loadingSegs || loadingBriefs;
+  const { data: signals = [], isLoading: loadingSignals } = useQuery({
+    queryKey: ['financial-signals', tenantId],
+    queryFn: () => apiFetch<FinancialSignal[]>('/v1/financial-intelligence/signals?limit=20', { tenantId }),
+    ...opts,
+    staleTime: 300_000,
+  });
+
+  const isLoading = loadingSegs || loadingBriefs || loadingSignals;
 
   const recentBriefs = [...briefs].sort(
     (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(),
-  ).slice(0, 5);
+  ).slice(0, 4);
 
-  const stats: StatCard[] = [
-    { label: 'Segmente salvate', value: segments.length, href: `${B}/segments`, sublabel: 'Căutări B2B salvate' },
-    { label: 'Research Briefs', value: briefs.length, href: `${B}/research`, sublabel: 'Rapoarte de cercetare' },
-    { label: 'Companii B2B', value: '147M+', href: `${B}/companies`, sublabel: 'Apollo/ClickHouse' },
-    { label: 'Contact match AI', value: 'live', href: `${B}/companies`, sublabel: 'intelligence-api activ' },
-  ];
+  const criticalSignals = signals.filter((s) => s.severity === 'critical');
+  const warningSignals  = signals.filter((s) => s.severity === 'warning');
+  const lastSignalAt = signals[0]?.publishedAt;
 
   return (
     <div className="max-w-5xl space-y-6">
       <div>
         <h1 className="font-display text-2xl font-semibold text-ink">Intelligence Overview</h1>
         <p className="mt-1 text-sm text-ink-faint">
-          Motorul de intelligence B2B — companii, segmente, research și insight-uri.
+          Motorul de intelligence B2B + semnale de piață financiară internațională.
         </p>
       </div>
 
@@ -54,26 +65,118 @@ export default function IntelligenceOverviewPage() {
         <p className="text-sm text-ink-faint">Se încarcă…</p>
       ) : (
         <>
+          {/* ── MARKET SIGNALS ─────────────────────────────────────────── */}
+          <section className="space-y-3">
+            <div className="flex items-center justify-between">
+              <h2 className="text-xs font-semibold uppercase tracking-wider text-ink-faint">
+                Market Intelligence
+                {(criticalSignals.length > 0 || warningSignals.length > 0) && (
+                  <span className="ml-2 rounded-full bg-signal-danger px-2 py-0.5 text-[10px] text-white">
+                    {criticalSignals.length + warningSignals.length} alerte
+                  </span>
+                )}
+              </h2>
+              {lastSignalAt && (
+                <span className="text-[11px] text-ink-line">
+                  Actualizat: {new Date(lastSignalAt).toLocaleString('ro-RO', {
+                    month: 'short', day: 'numeric', hour: '2-digit', minute: '2-digit',
+                  })}
+                </span>
+              )}
+            </div>
+
+            {signals.length === 0 ? (
+              <div className="card p-8 text-center">
+                <p className="text-sm font-medium text-ink">Niciun semnal de piață disponibil</p>
+                <p className="mt-1 text-xs text-ink-faint">
+                  Semnalele sunt generate automat de n8n din World Bank, IMF și Eurostat.
+                </p>
+                <p className="mt-2 text-[11px] font-mono text-ink-line">
+                  Importați workflow-ul n8n din /dashboard/data sau contactați administratorul.
+                </p>
+              </div>
+            ) : (
+              <div className="grid grid-cols-1 gap-3 lg:grid-cols-2">
+                {signals.slice(0, 8).map((sig) => {
+                  const cfg = SEV_CFG[sig.severity as keyof typeof SEV_CFG] ?? SEV_CFG.info;
+                  return (
+                    <article
+                      key={sig.id}
+                      className={`card border-l-2 ${cfg.borderClass} px-4 py-3`}
+                    >
+                      <div className="flex items-start justify-between gap-2">
+                        <div className="min-w-0 flex-1">
+                          <div className="flex flex-wrap items-center gap-1.5">
+                            <span className={`rounded px-1.5 py-0.5 text-[10px] font-semibold ${cfg.badgeClass}`}>
+                              {cfg.icon}
+                            </span>
+                            <span className="rounded bg-paper-sunken px-1.5 py-0.5 text-[10px] text-ink-faint capitalize">
+                              {CAT_LABEL[sig.category] ?? sig.category}
+                            </span>
+                            <span className="rounded bg-paper-sunken px-1.5 py-0.5 text-[10px] text-ink-faint uppercase">
+                              {sig.region}
+                            </span>
+                            {sig.niche && (
+                              <span className="rounded bg-bronze-wash px-1.5 py-0.5 text-[10px] font-medium text-bronze-deep capitalize">
+                                {sig.niche}
+                              </span>
+                            )}
+                          </div>
+                          <p className="mt-1.5 text-sm font-semibold text-ink leading-snug">
+                            {sig.title}
+                          </p>
+                          {sig.rawValue != null && (
+                            <p className="mt-0.5 font-mono text-xs text-ink-faint">
+                              {Number(sig.rawValue).toFixed(2)}{sig.unit ? ` ${sig.unit}` : ''}
+                              {sig.changePercent != null && (
+                                <span className={Number(sig.changePercent) >= 0 ? 'text-signal-ok ml-1' : 'text-signal-danger ml-1'}>
+                                  ({Number(sig.changePercent) >= 0 ? '+' : ''}{Number(sig.changePercent).toFixed(2)}%)
+                                </span>
+                              )}
+                            </p>
+                          )}
+                          <p className="mt-1 text-xs text-ink-faint leading-relaxed line-clamp-2">{sig.summary}</p>
+                        </div>
+                        <div className="shrink-0 text-right">
+                          <p className="text-[10px] text-ink-line font-mono uppercase">{sig.source}</p>
+                          <p className="text-[10px] text-ink-line">
+                            {new Date(sig.publishedAt).toLocaleDateString('ro-RO')}
+                          </p>
+                        </div>
+                      </div>
+                    </article>
+                  );
+                })}
+                {signals.length > 8 && (
+                  <div className="card p-4 text-center text-xs text-ink-faint lg:col-span-2">
+                    +{signals.length - 8} semnale suplimentare disponibile
+                  </div>
+                )}
+              </div>
+            )}
+          </section>
+
+          {/* ── B2B INTELLIGENCE STATS ─────────────────────────────────── */}
           <div className="grid grid-cols-2 gap-4 sm:grid-cols-4">
-            {stats.map((s) => (
-              <Link key={s.label} href={s.href} className="card p-5 transition-colors hover:border-bronze-deep">
+            {[
+              { label: 'Segmente salvate', value: segments.length, href: `${B}/segments` },
+              { label: 'Research Briefs', value: briefs.length, href: `${B}/research` },
+              { label: 'Companii B2B', value: '147M+', href: `${B}/companies` },
+              { label: 'Semnale piață', value: signals.length, href: '#' },
+            ].map((s) => (
+              <Link key={s.label} href={s.href} className="card p-5 hover:border-bronze-deep transition-colors">
                 <p className="text-xs font-medium uppercase tracking-wider text-ink-faint">{s.label}</p>
                 <p className="mt-1 font-display text-3xl font-semibold text-ink">{s.value}</p>
-                {s.sublabel && <p className="mt-0.5 text-[11px] text-ink-line">{s.sublabel}</p>}
               </Link>
             ))}
           </div>
 
+          {/* ── B2B MODULES ────────────────────────────────────────────── */}
           <div className="grid grid-cols-1 gap-6 lg:grid-cols-2">
-            {/* Recent research briefs */}
             <section className="card p-5">
               <div className="mb-4 flex items-center justify-between">
-                <h2 className="text-xs font-semibold uppercase tracking-wider text-ink-faint">
-                  Research recente
-                </h2>
-                <Link href={`${B}/research`} className="text-xs text-bronze-deep hover:underline">
-                  Vezi toate →
-                </Link>
+                <h2 className="text-xs font-semibold uppercase tracking-wider text-ink-faint">Research recente</h2>
+                <Link href={`${B}/research`} className="text-xs text-bronze-deep hover:underline">Toate →</Link>
               </div>
               {recentBriefs.length === 0 ? (
                 <p className="text-sm text-ink-faint">Niciun brief creat.</p>
@@ -83,12 +186,8 @@ export default function IntelligenceOverviewPage() {
                     <li key={b.id} className="border-b border-paper-sunken pb-3 last:border-0 last:pb-0">
                       <p className="text-sm font-medium text-ink">{b.title}</p>
                       <div className="mt-1 flex items-center gap-2">
-                        <span className="rounded bg-paper-sunken px-1.5 py-0.5 text-[10px] font-medium capitalize text-ink-faint">
-                          {b.status}
-                        </span>
-                        <span className="text-[11px] text-ink-line">
-                          {new Date(b.createdAt).toLocaleDateString('ro-RO')}
-                        </span>
+                        <span className="rounded bg-paper-sunken px-1.5 py-0.5 text-[10px] font-medium capitalize text-ink-faint">{b.status}</span>
+                        <span className="text-[11px] text-ink-line">{new Date(b.createdAt).toLocaleDateString('ro-RO')}</span>
                       </div>
                     </li>
                   ))}
@@ -96,15 +195,10 @@ export default function IntelligenceOverviewPage() {
               )}
             </section>
 
-            {/* Active segments */}
             <section className="card p-5">
               <div className="mb-4 flex items-center justify-between">
-                <h2 className="text-xs font-semibold uppercase tracking-wider text-ink-faint">
-                  Segmente active
-                </h2>
-                <Link href={`${B}/segments`} className="text-xs text-bronze-deep hover:underline">
-                  Gestionează →
-                </Link>
+                <h2 className="text-xs font-semibold uppercase tracking-wider text-ink-faint">Segmente active</h2>
+                <Link href={`${B}/segments`} className="text-xs text-bronze-deep hover:underline">Gestionează →</Link>
               </div>
               {segments.length === 0 ? (
                 <p className="text-sm text-ink-faint">Niciun segment salvat.</p>
@@ -128,23 +222,23 @@ export default function IntelligenceOverviewPage() {
             {/* Capability map */}
             <section className="card p-5 lg:col-span-2">
               <h2 className="mb-4 text-xs font-semibold uppercase tracking-wider text-ink-faint">
-                Capabilități platformă Intelligence
+                Capabilități Intelligence
               </h2>
               <div className="grid grid-cols-2 gap-3 sm:grid-cols-4">
                 {[
                   { label: 'Company Search', status: 'live', href: `${B}/companies` },
                   { label: 'Saved Segments', status: 'live', href: `${B}/segments` },
                   { label: 'Research Briefs', status: 'live', href: `${B}/research` },
-                  { label: 'People Intelligence', status: 'a3', href: `${B}/people-intelligence` },
+                  { label: 'Market Signals', status: signals.length > 0 ? 'live' : 'setup', href: '#' },
+                  { label: 'People Intelligence', status: 'a3', href: '#' },
                   { label: 'Market Intelligence', status: 'a4', href: '#' },
                   { label: 'Insights Engine', status: 'a3', href: '#' },
-                  { label: 'Trends & Patterns', status: 'a3', href: '#' },
                   { label: 'Digital Twin', status: 'a4', href: '#' },
                 ].map((cap) => (
-                  <div key={cap.label} className={`rounded-lg border px-3 py-2 ${cap.status === 'live' ? 'border-signal-ok/30 bg-signal-ok/5' : 'border-paper-sunken bg-paper-sunken/50'}`}>
+                  <div key={cap.label} className={`rounded-lg border px-3 py-2 ${cap.status === 'live' ? 'border-signal-ok/30 bg-signal-ok/5' : cap.status === 'setup' ? 'border-signal-warn/30 bg-signal-warn/5' : 'border-paper-sunken bg-paper-sunken/50'}`}>
                     <p className="text-xs font-medium text-ink">{cap.label}</p>
-                    <span className={`mt-0.5 inline-block text-[10px] font-semibold uppercase ${cap.status === 'live' ? 'text-signal-ok' : 'text-ink-line'}`}>
-                      {cap.status === 'live' ? '● live' : cap.status}
+                    <span className={`mt-0.5 inline-block text-[10px] font-semibold uppercase ${cap.status === 'live' ? 'text-signal-ok' : cap.status === 'setup' ? 'text-signal-warn' : 'text-ink-line'}`}>
+                      {cap.status === 'live' ? '● live' : cap.status === 'setup' ? '○ setup' : cap.status}
                     </span>
                   </div>
                 ))}