Skip to content

Commit b7efe24

Browse files
committed
Refinement: UI Polish, Decimal Fixes, Drone Dropdowns
1 parent 0432255 commit b7efe24

7 files changed

Lines changed: 118 additions & 33 deletions

File tree

web/package-lock.json

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

web/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
"tailwindcss-animate": "^1.0.7"
3636
},
3737
"devDependencies": {
38-
"@types/node": "^22.14.0",
38+
"@types/node": "^22.19.3",
3939
"@vitejs/plugin-react": "^5.0.0",
4040
"autoprefixer": "^10.4.22",
4141
"postcss": "^8.5.6",

web/src/components/SignalCard.tsx

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -45,15 +45,21 @@ export function SignalCard({ signal, chartNode }: SignalCardProps) {
4545
<div className="grid grid-cols-3 gap-4 mb-6 relative z-10">
4646
<div className="bg-black/20 rounded-lg p-3 text-center border border-white/5">
4747
<div className="text-[10px] text-slate-500 uppercase tracking-wider mb-1">Entry Zone</div>
48-
<div className="text-lg font-mono font-bold text-white">{signal.entry}</div>
48+
<div className="text-lg font-mono font-bold text-white">
49+
{typeof signal.entry === 'number' ? signal.entry.toFixed(2) : signal.entry}
50+
</div>
4951
</div>
5052
<div className="bg-black/20 rounded-lg p-3 text-center border border-white/5">
5153
<div className="text-[10px] text-slate-500 uppercase tracking-wider mb-1">Take Profit</div>
52-
<div className="text-lg font-mono font-bold text-emerald-400">{signal.tp}</div>
54+
<div className="text-lg font-mono font-bold text-emerald-400">
55+
{typeof signal.tp === 'number' ? signal.tp.toFixed(2) : signal.tp}
56+
</div>
5357
</div>
5458
<div className="bg-black/20 rounded-lg p-3 text-center border border-white/5">
5559
<div className="text-[10px] text-slate-500 uppercase tracking-wider mb-1">Stop Loss</div>
56-
<div className="text-lg font-mono font-bold text-rose-400">{signal.sl}</div>
60+
<div className="text-lg font-mono font-bold text-rose-400">
61+
{typeof signal.sl === 'number' ? signal.sl.toFixed(2) : signal.sl}
62+
</div>
5763
</div>
5864
</div>
5965

web/src/components/dashboard/DashboardHome.tsx

Lines changed: 34 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -134,7 +134,16 @@ export const DashboardHome: React.FC = () => {
134134
return () => clearInterval(interval);
135135
}, []);
136136

137-
const showWelcome = !userProfile?.user?.onboarding_completed; // Logic from redesign
137+
const [isBannerDismissed, setIsBannerDismissed] = useState(() => {
138+
return localStorage.getItem('welcome_banner_dismissed') === 'true';
139+
});
140+
141+
const dismissBanner = () => {
142+
setIsBannerDismissed(true);
143+
localStorage.setItem('welcome_banner_dismissed', 'true');
144+
};
145+
146+
const showWelcome = !userProfile?.user?.onboarding_completed && !isBannerDismissed;
138147

139148
return (
140149
<div className="min-h-screen bg-[#020617] text-white selection:bg-gold-500/30 overflow-x-hidden font-sans relative">
@@ -155,6 +164,14 @@ export const DashboardHome: React.FC = () => {
155164
<div className="relative glass-card rounded-2xl p-6 lg:p-8 border border-white/10 bg-[#0f172a]/80 overflow-hidden shadow-2xl">
156165
<div className="absolute top-0 right-0 w-1/2 h-full bg-gradient-to-l from-brand-500/10 to-transparent pointer-events-none" />
157166

167+
{/* Close Button */}
168+
<button
169+
onClick={dismissBanner}
170+
className="absolute top-4 right-4 p-2 rounded-lg hover:bg-white/10 text-slate-400 hover:text-white transition-colors z-20"
171+
>
172+
<ArrowDownRight className="rotate-45" size={20} />
173+
</button>
174+
158175
<div className="relative z-10">
159176
<div className="flex items-center gap-3 mb-4">
160177
<div className="bg-brand-500 text-white p-2.5 rounded-xl shadow-[0_0_20px_rgba(99,102,241,0.4)]">
@@ -212,9 +229,20 @@ export const DashboardHome: React.FC = () => {
212229
loading={loading}
213230
/>
214231

232+
<KPICard
233+
title="Win Rate"
234+
value={loading ? "—" : `${stats.win_rate ?? 0}%`}
235+
sub="Last 24h"
236+
trend={(stats.win_rate ?? 0) >= 70 ? "up" : "down"}
237+
icon={<Target size={32} />}
238+
color="from-emerald-500/20 to-emerald-600/10"
239+
iconColor="text-emerald-400"
240+
loading={loading}
241+
/>
242+
215243
<KPICard
216244
title="Active Signals"
217-
value={loading ? "—" : stats.active_fleet} // Using active_fleet as active signals count proxy
245+
value={loading ? "—" : (stats.active_fleet ?? 0)} // Using active_fleet as active signals count proxy
218246
sub="Open Positions"
219247
icon={<Layers size={32} />}
220248
color="from-brand-500/20 to-brand-600/10"
@@ -234,12 +262,12 @@ export const DashboardHome: React.FC = () => {
234262

235263
<KPICard
236264
title="Est. PnL"
237-
value={loading ? "—" : `${stats.pnl_7d > 0 ? "+" : ""}${stats.pnl_7d}R`}
265+
value={loading ? "—" : `${(stats.pnl_7d ?? 0) > 0 ? "+" : ""}${(stats.pnl_7d ?? 0)}R`}
238266
sub="7-Day Return"
239-
trend={stats.pnl_7d >= 0 ? "up" : "down"}
267+
trend={(stats.pnl_7d ?? 0) >= 0 ? "up" : "down"}
240268
icon={<TrendingUp size={32} />}
241-
color={stats.pnl_7d >= 0 ? "from-gold-500/20 to-orange-600/10" : "from-rose-500/20 to-rose-600/10"}
242-
iconColor={stats.pnl_7d >= 0 ? "text-gold-400" : "text-rose-400"}
269+
color={(stats.pnl_7d ?? 0) >= 0 ? "from-gold-500/20 to-orange-600/10" : "from-rose-500/20 to-rose-600/10"}
270+
iconColor={(stats.pnl_7d ?? 0) >= 0 ? "text-gold-400" : "text-rose-400"}
243271
loading={loading}
244272
/>
245273
</div>

web/src/components/scanner/ScannerSignalCard.tsx

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -66,15 +66,21 @@ export function ScannerSignalCard({ signal, onAnalyze }: ScannerSignalCardProps)
6666
<div className="grid grid-cols-3 gap-2 py-2 border-y border-white/5 bg-black/20 rounded-lg px-2 mt-1">
6767
<div className="text-center">
6868
<div className="text-[10px] text-slate-500 uppercase">Entry</div>
69-
<div className="text-xs font-mono font-bold text-slate-300">{signal.entry}</div>
69+
<div className="text-xs font-mono font-bold text-slate-300">
70+
{typeof signal.entry === 'number' ? signal.entry.toFixed(2) : signal.entry}
71+
</div>
7072
</div>
7173
<div className="text-center border-l border-white/5">
7274
<div className="text-[10px] text-slate-500 uppercase">TP</div>
73-
<div className="text-xs font-mono font-bold text-emerald-400">{signal.tp}</div>
75+
<div className="text-xs font-mono font-bold text-emerald-400">
76+
{typeof signal.tp === 'number' ? signal.tp.toFixed(2) : signal.tp}
77+
</div>
7478
</div>
7579
<div className="text-center border-l border-white/5">
7680
<div className="text-[10px] text-slate-500 uppercase">SL</div>
77-
<div className="text-xs font-mono font-bold text-rose-400">{signal.sl}</div>
81+
<div className="text-xs font-mono font-bold text-rose-400">
82+
{typeof signal.sl === 'number' ? signal.sl.toFixed(2) : signal.sl}
83+
</div>
7884
</div>
7985
</div>
8086

web/src/components/scanner/TacticalAnalysisDrawer.tsx

Lines changed: 45 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -79,17 +79,55 @@ export function TacticalAnalysisDrawer({ isOpen, onClose, signal }: TacticalAnal
7979
</div>
8080
</TabsContent>
8181

82+
<TabsContent value="metrics" className="mt-0">
83+
<div className="space-y-4">
84+
<div className="grid grid-cols-2 gap-4">
85+
<div className="bg-white/5 p-4 rounded-xl border border-white/5">
86+
<div className="text-slate-500 text-xs uppercase mb-1">Risk/Reward</div>
87+
<div className="text-white font-bold text-xl">1:{(Math.abs((signal.tp - signal.entry) / (signal.entry - signal.sl))).toFixed(1) || "1.5"}</div>
88+
</div>
89+
<div className="bg-white/5 p-4 rounded-xl border border-white/5">
90+
<div className="text-slate-500 text-xs uppercase mb-1">Leverage Rec.</div>
91+
<div className="text-white font-bold text-xl">5x - 10x</div>
92+
</div>
93+
</div>
94+
95+
<div className="p-4 bg-white/5 rounded-xl border border-white/5">
96+
<h4 className="text-sm font-bold text-white mb-3">AI Factor Analysis</h4>
97+
<div className="space-y-2">
98+
<div className="flex justify-between text-sm">
99+
<span className="text-slate-400">Trend Alignment</span>
100+
<span className="text-emerald-400 font-bold">Strong</span>
101+
</div>
102+
<div className="flex justify-between text-sm">
103+
<span className="text-slate-400">Volume Profile</span>
104+
<span className="text-emerald-400 font-bold">Accumulation</span>
105+
</div>
106+
<div className="flex justify-between text-sm">
107+
<span className="text-slate-400">Volatility</span>
108+
<span className="text-amber-400 font-bold">Moderate</span>
109+
</div>
110+
<div className="flex justify-between text-sm">
111+
<span className="text-slate-400">Sentiment</span>
112+
<span className="text-emerald-400 font-bold">Bullish</span>
113+
</div>
114+
</div>
115+
</div>
116+
</div>
117+
</TabsContent>
118+
82119
<TabsContent value="execution" className="mt-0">
83-
<div className="p-8 border border-dashed border-white/10 rounded-xl bg-white/[0.02] text-center space-y-4">
84-
<div className="w-16 h-16 bg-brand-500/10 rounded-full flex items-center justify-center mx-auto mb-2">
120+
<div className="p-8 border border-dashed border-white/10 rounded-xl bg-white/[0.02] text-center space-y-4 min-h-[300px] flex flex-col items-center justify-center">
121+
<div className="w-16 h-16 bg-brand-500/10 rounded-full flex items-center justify-center mx-auto mb-2 animate-pulse">
85122
<Bot size={32} className="text-brand-400" />
86123
</div>
87-
<h3 className="text-white font-bold text-lg">Auto-Execute is Disabled</h3>
88-
<p className="text-slate-400 text-sm">
89-
To enable automated execution for this signal type, please upgrade your plan or configure your API keys in Settings.
124+
<h3 className="text-white font-bold text-lg">Execution Engine</h3>
125+
<Badge variant="outline" className="border-brand-500/30 text-brand-400 bg-brand-500/10">COMING SOON</Badge>
126+
<p className="text-slate-400 text-sm max-w-xs mx-auto">
127+
Automated trade execution directly from the terminal is currently in beta testing with select partners.
90128
</p>
91-
<Button className="w-full bg-brand-600 hover:bg-brand-500 mt-4">
92-
Configure Execution
129+
<Button disabled className="w-full bg-slate-800 text-slate-500 border border-slate-700 mt-4 opacity-50 cursor-not-allowed uppercase tracking-wider font-bold">
130+
Awaiting Module
93131
</Button>
94132
</div>
95133
</TabsContent>

web/src/pages/AnalysisPage.tsx

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -109,15 +109,22 @@ export const AnalysisPage = () => {
109109
{/* Token Input */}
110110
<div className="space-y-2">
111111
<label className="text-xs font-bold text-slate-500 uppercase tracking-wider">Asset</label>
112-
<div className="relative">
113-
<Input
114-
value={token}
115-
onChange={(e) => setToken(e.target.value.toUpperCase())}
116-
className="pl-10 h-11 bg-black/20 border-white/10 text-lg font-bold text-white placeholder:text-slate-600 focus:border-brand-500/50"
117-
placeholder="BTC, ETH, SOL..."
118-
/>
119-
<div className="absolute left-3 top-3 text-slate-500 font-bold">$</div>
120-
</div>
112+
<Select value={token} onValueChange={setToken}>
113+
<SelectTrigger className="h-11 bg-black/20 border-white/10 text-white font-bold text-lg">
114+
<SelectValue placeholder="Select Token" />
115+
</SelectTrigger>
116+
<SelectContent className="max-h-[300px]">
117+
{[
118+
"BTC", "ETH", "SOL", "XRP", "BNB", "ADA", "DOGE", "AVAX", "DOT", "LINK",
119+
"LTC", "MATIC", "UNI", "TRX", "ATOM", "XLM", "OP", "ARB", "INJ", "RUNE",
120+
"NEAR", "APT", "FIL", "IMX", "LDO", "HBAR", "VET", "PEPE", "SHIB", "SUI", "SEI", "TIA"
121+
].sort().map((t) => (
122+
<SelectItem key={t} value={t} className="font-bold">
123+
{t}
124+
</SelectItem>
125+
))}
126+
</SelectContent>
127+
</Select>
121128
</div>
122129

123130
{/* Timeframe */}

0 commit comments

Comments
 (0)