bytelyst/learning_ai_invt_trdg
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(ui): align wizard and overview controls

Browse Source
This commit is contained in:
Saravana Achu Mac 2026-05-09 01:55:28 -07:00
parent f3540c6b4b
commit 1300de98a9
2 changed files with 33 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
web/src/components/StrategyWizard.tsx
View File

@ -185,7 +185,9 @@ export const StrategyWizard: React.FC<{
const isLocked = !isFeatureAllowed(tier, 'risk_style', style.id);
return (
<div key={style.id} className="relative">
<button
<Button
type="button"
variant="ghost"
disabled={isLocked}
onClick={() => setState({ ...state, riskStyle: style })}
className={`${optionBaseClass} ${isLocked ? 'cursor-not-allowed opacity-40 grayscale' : 'hover:scale-[1.01] active:scale-[0.99]'
@ -211,7 +213,7 @@ export const StrategyWizard: React.FC<{
<p className="text-sm leading-relaxed text-[var(--muted-foreground)]">{style.description}</p>
</div>
</div>
</button>
</Button>
{isLocked && (
<div className="absolute top-4 right-4 text-[9px] font-black uppercase text-amber-500/80 tracking-tighter bg-amber-500/10 px-2 py-0.5 rounded border border-amber-500/20">
Pro/Elite Only
@ -246,7 +248,9 @@ export const StrategyWizard: React.FC<{
<label className={labelClass}>Select Trading Assets</label>
<div className="flex flex-wrap gap-3">
{ASSETS.map(asset => (
<button
<Button
type="button"
variant="ghost"
key={asset.id}
onClick={() => {
const newAssets = state.assets.includes(asset.id)
@ -260,7 +264,7 @@ export const StrategyWizard: React.FC<{
}`}
>
{asset.label}
</button>
</Button>
))}
</div>
</div>
@ -335,7 +339,9 @@ export const StrategyWizard: React.FC<{
<div className="grid grid-cols-1 gap-4">
{(['24/7', 'London + New York', 'Asia only'] as const).map(option => (
<button
<Button
type="button"
variant="ghost"
key={option}
onClick={() => setState({ ...state, hours: option })}
className={`rounded-2xl border-2 p-6 text-left transition-all ${state.hours === option
@ -356,7 +362,7 @@ export const StrategyWizard: React.FC<{
</span>
</div>
</div>
</button>
</Button>
))}
</div>

12
web/src/tabs/OverviewTab.tsx
View File

@ -4,6 +4,7 @@ import { useAuth } from '../components/AuthContext';
import { aggregateCanonicalLifecycleTrades } from '../lib/orderLifecycleLedger';
import { useCanonicalLifecycle } from '../hooks/useCanonicalLifecycle';
import { fetchTradeProfiles } from '../lib/profileApi';
import { Button } from '../components/ui/Primitives';
interface OverviewTabProps {
botState: BotState;
@ -623,22 +624,23 @@ export const OverviewTab = ({ botState, previewAsCustomer = false, connected = t
{WIN_RATE_WINDOW_OPTIONS.map((option) => {
const active = option.key === winRateWindow;
return (
<button
<Button
type="button"
key={option.key}
onClick={() => setWinRateWindow(option.key)}
variant={active ? 'secondary' : 'ghost'}
size="sm"
style={{
border: active ? overviewActiveBorder : overviewSoftBorder,
color: active ? overviewSuccessText : overviewQuietText,
background: active ? overviewActiveSurface : overviewMutedSurface,
borderRadius: '8px',
padding: '4px 8px',
fontSize: '0.7rem',
fontWeight: 700,
cursor: 'pointer'
fontWeight: 700
}}
>
{option.label}
</button>
</Button>
);
})}
</div>