admin/stonks-oracle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: Trading Controls page field mapping for macro/competitive status

Browse Source 
The API returns macro_enabled/competitive_enabled but the TypeScript
interfaces expected 'enabled'. The toggles always showed disabled.
Now handles both field names with fallback.
This commit is contained in:
Celes Renata
2026-04-16 01:46:13 +00:00
parent 88c9f50371
commit e652a62dbc
2 changed files with 24 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/pages/Trading.tsx
+18 -14
View File
@@ -22,6 +22,10 @@ export function TradingPage() {
const reviewApproval = useReviewApproval();
const toggleMacro = useToggleMacro();
const toggleCompetitive = useToggleCompetitive();
// Normalize API field names (API returns macro_enabled/competitive_enabled, not enabled)
const macroEnabled = macroStatus?.enabled ?? macroStatus?.macro_enabled ?? false;
const competitiveEnabled = competitiveStatus?.enabled ?? competitiveStatus?.competitive_enabled ?? false;
const [confirmMode, setConfirmMode] = useState<string | null>(null);
const [confirmMacroToggle, setConfirmMacroToggle] = useState(false);
const [confirmCompetitiveToggle, setConfirmCompetitiveToggle] = useState(false);
@@ -90,20 +94,20 @@ export function TradingPage() {
<button
onClick={() => setConfirmMacroToggle(true)}
className={`relative inline-flex h-6 w-11 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus:outline-none focus:ring-2 focus:ring-brand-500 focus:ring-offset-2 focus:ring-offset-surface-900 ${
macroStatus?.enabled ? 'bg-brand-600' : 'bg-surface-700'
macroEnabled ? 'bg-brand-600' : 'bg-surface-700'
}`}
role="switch"
aria-checked={macroStatus?.enabled ?? false}
aria-checked={macroEnabled ?? false}
aria-label="Toggle macro signal layer"
>
<span
className={`pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow ring-0 transition-transform ${
macroStatus?.enabled ? 'translate-x-5' : 'translate-x-0'
macroEnabled ? 'translate-x-5' : 'translate-x-0'
}`}
/>
</button>
<span className="text-sm text-gray-300">
{macroStatus?.enabled ? 'Enabled' : 'Disabled'}
{macroEnabled ? 'Enabled' : 'Disabled'}
</span>
{macroStatus?.toggled_at && (
<span className="text-xs text-gray-500">
@@ -117,15 +121,15 @@ export function TradingPage() {
{confirmMacroToggle && (
<div className="mt-4 rounded-lg border border-orange-700/50 bg-orange-900/20 p-4">
<p className="text-sm text-orange-300">
Are you sure you want to {macroStatus?.enabled ? 'disable' : 'enable'} the macro signal layer?
{macroStatus?.enabled
Are you sure you want to {macroEnabled ? 'disable' : 'enable'} the macro signal layer?
{macroEnabled
? ' Disabling will exclude macro signals from trend summaries and recommendations.'
: ' Enabling will include global event macro signals in trend summaries and recommendations.'}
</p>
<div className="mt-3 flex gap-2">
<button
onClick={() => {
toggleMacro.mutate(!macroStatus?.enabled);
toggleMacro.mutate(!macroEnabled);
setConfirmMacroToggle(false);
}}
className="rounded-md bg-orange-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-orange-700"
@@ -150,20 +154,20 @@ export function TradingPage() {
<button
onClick={() => setConfirmCompetitiveToggle(true)}
className={`relative inline-flex h-6 w-11 shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors focus:outline-none focus:ring-2 focus:ring-brand-500 focus:ring-offset-2 focus:ring-offset-surface-900 ${
competitiveStatus?.enabled ? 'bg-brand-600' : 'bg-surface-700'
competitiveEnabled ? 'bg-brand-600' : 'bg-surface-700'
}`}
role="switch"
aria-checked={competitiveStatus?.enabled ?? false}
aria-checked={competitiveEnabled ?? false}
aria-label="Toggle competitive signal layer"
>
<span
className={`pointer-events-none inline-block h-5 w-5 rounded-full bg-white shadow ring-0 transition-transform ${
competitiveStatus?.enabled ? 'translate-x-5' : 'translate-x-0'
competitiveEnabled ? 'translate-x-5' : 'translate-x-0'
}`}
/>
</button>
<span className="text-sm text-gray-300">
{competitiveStatus?.enabled ? 'Enabled' : 'Disabled'}
{competitiveEnabled ? 'Enabled' : 'Disabled'}
</span>
{competitiveStatus?.toggled_at && (
<span className="text-xs text-gray-500">
@@ -177,15 +181,15 @@ export function TradingPage() {
{confirmCompetitiveToggle && (
<div className="mt-4 rounded-lg border border-orange-700/50 bg-orange-900/20 p-4">
<p className="text-sm text-orange-300">
Are you sure you want to {competitiveStatus?.enabled ? 'disable' : 'enable'} the competitive signal layer?
{competitiveStatus?.enabled
Are you sure you want to {competitiveEnabled ? 'disable' : 'enable'} the competitive signal layer?
{competitiveEnabled
? ' Disabling will exclude historical pattern and competitive signals from trend summaries and recommendations.'
: ' Enabling will include historical pattern and competitive signals in trend summaries and recommendations.'}
</p>
<div className="mt-3 flex gap-2">
<button
onClick={() => {
toggleCompetitive.mutate(!competitiveStatus?.enabled);
toggleCompetitive.mutate(!competitiveEnabled);
setConfirmCompetitiveToggle(false);
}}
className="rounded-md bg-orange-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-orange-700"