feat: cockpit

frontend/src/pages/Dashboard.tsx

@@ -417,13 +417,18 @@ export default function Dashboard() {
                 <div className="h-[110px] flex items-center justify-center text-slate-600 text-[10px]">No chart data for {activeWatchlistName}</div>
               )}
               <div className="mt-1.5 pt-1.5 border-t border-slate-700/30 space-y-0.5">
-                {((watchlistQuotesData as any)?.items ?? []).map((it: any) => (
+                {((watchlistQuotesData as any)?.items ?? []).map((it: any) => {
+                  const inCatalog = (instrumentCatalogIds as Set<string> | undefined)?.has(it.ticker.toUpperCase())
+                  return (
                   <div
                     key={it.ticker}
+                    onDoubleClick={() => { if (inCatalog) navigate(`/instruments/${encodeURIComponent(it.ticker)}`) }}
                     className={clsx(
                       'flex items-center justify-between gap-1.5 text-[10px] whitespace-nowrap rounded px-1 -mx-1 py-0.5 transition-colors',
-                      it.ticker === activeWatchlistTicker ? 'bg-blue-900/20' : 'hover:bg-dark-700/40'
+                      it.ticker === activeWatchlistTicker ? 'bg-blue-900/20' : 'hover:bg-dark-700/40',
+                      inCatalog && 'cursor-pointer'
                     )}
+                    title={inCatalog ? `Double-click to open ${it.name || it.ticker} in Instrument Analysis` : undefined}
                   >
                     <button
                       type="button"
@@ -448,7 +453,7 @@ export default function Dashboard() {
                           </span>
                         )}
                       </span>
-                      {(instrumentCatalogIds as Set<string> | undefined)?.has(it.ticker.toUpperCase()) && (
+                      {inCatalog && (
                         <Link
                           to={`/instruments/${encodeURIComponent(it.ticker)}`}
                           className="text-slate-600 hover:text-blue-400 shrink-0 transition-colors"
@@ -459,7 +464,8 @@ export default function Dashboard() {
                       )}
                     </div>
                   </div>
-                ))}
+                  )
+                })}
               </div>
             </>
           ) : (
@@ -813,11 +819,11 @@ export default function Dashboard() {
                 <span className="section-title mb-0 text-[10px]">🛡️ Risk</span>
                 <ArrowUpRight className="w-3 h-3 text-slate-600" />
               </div>
-              <div className={clsx('text-lg font-bold mt-0.5 flex items-center gap-2', alertCount > 0 ? 'text-red-400' : 'text-emerald-400')}>
+              <div className={clsx('text-[10px] font-bold mt-0.5 flex items-center gap-2', alertCount > 0 ? 'text-red-400' : 'text-emerald-400')}>
                 {alertCount > 0 ? `${alertCount} alert${alertCount > 1 ? 's' : ''}` : 'OK'}
               </div>
               {radarAxes.length > 0 && (
-                <ResponsiveContainer width="100%" height={110}>
+                <ResponsiveContainer width="100%" height={180}>
                   <RadarChart data={radarAxes}>
                     <PolarGrid stroke="#1e2d4d" />
                     <PolarAngleAxis dataKey="axis" tick={{ fill: '#94a3b8', fontSize: 9 }} />