Jann/investment-sandbox
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Closes #016 - Deploy Native KaTeX Rig & Dual-Handbook System

Browse Source
This commit is contained in:
Antigravity Agent
2026-06-13 15:16:57 +02:00
parent 59e0a04bfa
commit 94ccf63a38
26 changed files with 1074 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

99
components/modules/scanner/ScannerBlueprintModal.tsx Normal file
View File

@@ -0,0 +1,99 @@
import React from 'react';
import { Settings, X } from 'lucide-react';
interface ScannerBlueprintModalProps {
isOpen: boolean;
onClose: () => void;
}
export default function ScannerBlueprintModal({ isOpen, onClose }: ScannerBlueprintModalProps) {
React.useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
if (e.key === 'Escape') {
onClose();
}
};
if (isOpen) {
window.addEventListener('keydown', handleKeyDown);
}
return () => {
window.removeEventListener('keydown', handleKeyDown);
};
}, [isOpen, onClose]);
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-900/85 backdrop-blur-md p-4 sm:p-6 md:p-8 animate-fade-in">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
<div className="flex justify-between items-center px-6 py-4 bg-slate-950/45 border-b border-slate-800/60">
<div>
<h2 className="text-base font-bold bg-gradient-to-r from-emerald-400 to-teal-400 bg-clip-text text-transparent flex items-center gap-2">
<Settings className="w-5 h-5 text-emerald-400" /> Anomalies Scanner - Operational Blueprint
</h2>
<p className="text-[10px] text-slate-500 font-mono">System User Manual &amp; Interface Mechanics</p>
</div>
<button
onClick={onClose}
className="text-slate-400 hover:text-slate-200 bg-slate-950/50 border border-slate-800 hover:border-slate-700 p-2 rounded-xl transition-all cursor-pointer flex items-center justify-center"
aria-label="Close modal"
>
<X className="w-4 h-4" />
</button>
</div>
{/* Modal Body */}
<div className="flex-1 overflow-y-auto p-6 sm:p-8 space-y-8 text-slate-350 scrollbar-thin">
<div className="border-b border-slate-800/80 pb-3">
<h3 className="text-base font-bold text-slate-200">Scanner Metrics &amp; Signals</h3>
<p className="text-xs text-slate-400 mt-1">Operational details of the anomaly scanner and valuation filters.</p>
</div>
{/* Core Mechanics */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-emerald-400 uppercase tracking-wider font-mono">1. 52-Week Drop Mechanics</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Filters the stock database for liquid companies trading at significant percentage discounts relative to their 52-week peak. Isolates severe drawdowns caused by asymmetric market overreactions.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-emerald-400 uppercase tracking-wider font-mono">2. Welles Wilder RSI-14 Velocity</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Uses the smoothed Wilder Relative Strength Index to identify deep oversold thresholds (RSI &lt; 25). Momentum velocity measures standard deviation shocks in the indicator to forecast buy-exhaustion and selloff capitulations.
</p>
</div>
<div className="p-4 rounded-xl border border-slate-800/60 bg-slate-950/40 space-y-2">
<h4 className="text-xs font-bold text-emerald-400 uppercase tracking-wider font-mono">3. FMP Valuation Overlay</h4>
<p className="text-xs text-slate-400 leading-relaxed font-sans">
Parses active valuation multiples: Price-to-Earnings (P/E), Price-to-Book (P/B), Dividend Yield, and Price/Earnings-to-Growth (PEG) ratios. Analyzes whether the selloff is justified fundamentally or is a dislocation from value.
</p>
</div>
</div>
{/* Interface Specifications */}
<div className="space-y-3">
<h3 className="text-sm font-bold text-slate-200 border-b border-slate-800 pb-2">User Actions &amp; Interface Mechanics</h3>
<div className="text-xs text-slate-400 space-y-3 leading-relaxed">
<p>
<strong className="text-emerald-400 font-semibold">Diagnostic Drawers:</strong> Clicking on any row in the scanner table opens an interactive drawer where you can analyze the drop catalyst: *Systemic Selloff, Supply Chain Disruption, Executive Shift, Regulatory Issue / Fine,* or *Earnings Miss*.
</p>
<p>
<strong className="text-emerald-400 font-semibold">GJR-GARCH Rebound Probability:</strong> The drawer displays a real-time rebound probability score. The GJR-GARCH model calculates conditional downside volatility, while the selected catalyst dynamically adjusts the rebound expectations based on historical asset-recovery statistics.
</p>
<p>
<strong className="text-emerald-400 font-semibold">Deep-Check Search Mask:</strong> Permits manual lookup of individual tickers. Ingests cash flow and balance sheet metrics from the backend API, displaying current Sloan ratios and GJR-GARCH conditional Value-at-Risk limits.
</p>
</div>
</div>
</div>
</div>
</div>
);
}

13
components/modules/scanner/ScannerDemo.tsx
View File

@@ -7,6 +7,7 @@ import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContai
import 'katex/dist/katex.min.css';
import { BlockMath, InlineMath } from 'react-katex';
import ScannerMathModal from './ScannerMathModal';
import ScannerBlueprintModal from './ScannerBlueprintModal';
import {
ShieldAlert, Sparkles, RefreshCw, Flame, Search, Plus, Trash2,
ChevronDown, ChevronUp, AlertTriangle, CheckCircle2, XCircle, Info, Clock, Play,
@@ -48,6 +49,7 @@ export default function ScannerDemo() {
const [showMathAccordion, setShowMathAccordion] = useState(false);
const [isMathModalOpen, setIsMathModalOpen] = useState(false);
const [isBlueprintModalOpen, setIsBlueprintModalOpen] = useState(false);
const [isShieldActive, setIsShieldActive] = useState(false);
// Cache for metadata and prices retrieved dynamically
@@ -344,7 +346,7 @@ export default function ScannerDemo() {
const renderCategoryTable = (title: string, description: string, assets: any[]) => {
return (
<div className="bg-slate-955/40 border border-slate-850 rounded-2xl p-5 space-y-3">
<div className="bg-slate-900/40 border border-slate-850 rounded-2xl p-5 space-y-3">
<div className="flex justify-between items-center border-b border-slate-900 pb-2">
<div>
<h4 className="font-bold text-white text-sm">{title}</h4>
@@ -586,6 +588,14 @@ export default function ScannerDemo() {
<span>📖 Quantitative Handbook</span>
</button>
<button
onClick={() => setIsBlueprintModalOpen(true)}
className="flex items-center gap-1.5 px-4 py-3 rounded-xl bg-slate-950/80 hover:bg-slate-900 border border-slate-800 hover:border-slate-700 transition-all font-semibold text-xs tracking-wider text-amber-400 justify-center animate-pulse-slow"
>
<Info className="w-3.5 h-3.5" />
<span>⚙️ Operational Blueprint</span>
</button>
<button
onClick={handleMarketScan}
disabled={scanning}
@@ -934,6 +944,7 @@ export default function ScannerDemo() {
</div>
<ScannerMathModal isOpen={isMathModalOpen} onClose={() => setIsMathModalOpen(false)} />
<ScannerBlueprintModal isOpen={isBlueprintModalOpen} onClose={() => setIsBlueprintModalOpen(false)} />
</div>
);
}

30
components/modules/scanner/ScannerMathModal.tsx
View File

@@ -26,7 +26,7 @@ export default function ScannerMathModal({ isOpen, onClose }: ScannerMathModalPr
if (!isOpen) return null;
return (
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-955/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="fixed inset-0 z-50 flex items-center justify-center bg-slate-950/90 backdrop-blur-md p-4 sm:p-6 md:p-8">
<div className="bg-slate-900 border border-slate-800/80 rounded-3xl w-full max-w-4xl h-[80vh] flex flex-col overflow-hidden shadow-2xl relative text-slate-350">
{/* Modal Header */}
@@ -60,15 +60,15 @@ export default function ScannerMathModal({ isOpen, onClose }: ScannerMathModalPr
Scans the entire corporate equity universe daily, segmenting equities into three distinct market capitalization classes to identify localized overreactions:
</p>
<div className="grid grid-cols-3 gap-3 text-[11px] text-slate-400 font-mono text-center">
<div className="bg-slate-955/40 p-3 rounded-lg border border-slate-800/50">
<div className="bg-slate-950/40 p-3 rounded-lg border border-slate-800/50">
<span className="block font-bold text-slate-300">Mega Caps</span>
<span>&gt; $100B</span>
</div>
<div className="bg-slate-955/40 p-3 rounded-lg border border-slate-800/50">
<div className="bg-slate-950/40 p-3 rounded-lg border border-slate-800/50">
<span className="block font-bold text-slate-300">Mid Caps</span>
<span>$10B - $100B</span>
</div>
<div className="bg-slate-955/40 p-3 rounded-lg border border-slate-800/50">
<div className="bg-slate-950/40 p-3 rounded-lg border border-slate-800/50">
<span className="block font-bold text-slate-300">Small Caps</span>
<span>&lt; $10B</span>
</div>
@@ -80,21 +80,21 @@ export default function ScannerMathModal({ isOpen, onClose }: ScannerMathModalPr
<p className="text-xs leading-relaxed text-slate-400">
Calculates price distance ratios relative to support levels:
</p>
<div className="bg-slate-955/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div>
<p className="text-xs text-slate-400 mb-1">1. 52-Week High Deviation:</p>
<BlockMath math="\\Delta_{52w} = \\frac{P_{\\text{current}} - P_{52w\\_high}}{P_{52w\\_high}}" />
<BlockMath math="\Delta_{52w} = \frac{P_{\text{current}} - P_{52w\_high}}{P_{52w\_high}}" />
</div>
<div>
<p className="text-xs text-slate-400 mb-1">2. 50-Day Moving Average Drop:</p>
<BlockMath math="\\Delta_{MA} = \\frac{P_{\\text{current}} - \\text{MA}_{50}}{\\text{MA}_{50}}" />
<BlockMath math="\Delta_{MA} = \frac{P_{\text{current}} - \text{MA}_{50}}{\text{MA}_{50}}" />
</div>
<div>
<p className="text-xs text-slate-400 mb-1">3. Relative Strength Index (RSI-14) with smoothing:</p>
<BlockMath math="\\text{RSI} = 100 - \\frac{100}{1 + \\text{RS}}" />
<BlockMath math="\\text{RS} = \\frac{\\text{Smoothed Gain}_t}{\\text{Smoothed Loss}_t}" />
<BlockMath math="\text{RSI} = 100 - \frac{100}{1 + \text{RS}}" />
<BlockMath math="\text{RS} = \frac{\text{Smoothed Gain}_t}{\text{Smoothed Loss}_t}" />
<p className="text-[11px] text-slate-500 mt-2 font-mono">
where smoothed elements use Welles Wilder alpha = 1/14. Deep oversold signals trigger at RSI &lt; 30.
where smoothed elements use Welles Wilder <InlineMath math="\alpha = 1/14" />. Deep oversold signals trigger at <InlineMath math="\text{RSI} < 30" />.
</p>
</div>
</div>
@@ -105,21 +105,21 @@ export default function ScannerMathModal({ isOpen, onClose }: ScannerMathModalPr
<p className="text-xs leading-relaxed text-slate-400">
To avoid value traps, technical drop factors are coupled with valuation metrics fetched in real-time from FMP:
</p>
<div className="bg-slate-955/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<div className="bg-slate-950/40 p-4 rounded-xl border border-slate-800/60 my-2 space-y-4">
<ul className="list-disc pl-5 text-xs text-slate-400 space-y-2 font-mono">
<li><strong>Trailing P/E</strong>: Measures the price relative to trailing 12-month earnings.</li>
<li><strong>Price-to-Book</strong>: Measures the asset backing relative to equity capital.</li>
<li><strong>Dividend Yield (%)</strong>: Tangible dividend payouts to measure cash backflow support.</li>
<li><strong>PEG Ratio</strong>: Relates PE multiple to annual earnings growth:
<BlockMath math="\\text{PEG} = \\frac{\\text{PE Ratio}}{\\text{Earnings Growth Rate} \\times 100}" />
<BlockMath math="\text{PEG} = \frac{\text{PE Ratio}}{\text{Earnings Growth Rate} \times 100}" />
</li>
</ul>
<div className="border-t border-slate-850 pt-3">
<p className="text-xs text-slate-400 mb-1">Implicit Forward P/E calculation from PEG relationship:</p>
<BlockMath math="\\text{Forward PE} = \\frac{\\text{Trailing PE}}{1 + g_{\\text{implicit}}}" />
<BlockMath math="g_{\\text{implicit}} = \\frac{\\text{Trailing PE}}{\\text{PEG} \\times 100}" />
<BlockMath math="\text{Forward PE} = \frac{\text{Trailing PE}}{1 + g_{\text{implicit}}}" />
<BlockMath math="g_{\text{implicit}} = \frac{\text{Trailing PE}}{\text{PEG} \times 100}" />
<p className="text-[11px] text-slate-500 mt-2 font-mono">
If PEG is unavailable, a default growth rate of 10% is assumed as a conservative fallback baseline.
If PEG is unavailable, a default growth rate of <InlineMath math="10\%" /> is assumed as a conservative fallback baseline.
</p>
</div>
</div>