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

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.

frontend/src/api/hooks.ts

@@ -596,9 +596,11 @@ export function useCorporateDecisions(ticker: string | undefined) {
 // ---------------------------------------------------------------------------
 
 export interface CompetitiveStatus {
-  enabled: boolean;
+  enabled?: boolean;
+  competitive_enabled?: boolean;
   toggled_at: string | null;
   toggled_by: string | null;
+  source?: string;
 }
 
 export function useCompetitiveStatus() {
@@ -720,9 +722,11 @@ export function useTrendProjection(trendId: string | undefined) {
 // ---------------------------------------------------------------------------
 
 export interface MacroStatus {
-  enabled: boolean;
+  enabled?: boolean;
+  macro_enabled?: boolean;
   toggled_at: string | null;
   toggled_by: string | null;
+  source?: string;
 }
 
 export function useMacroStatus() {

frontend/src/pages/Trading.tsx

@@ -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?
+              Are you sure you want to {macroEnabled ? 'disable' : 'enable'} the macro signal layer?
-              {macroStatus?.enabled
+              {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?
+              Are you sure you want to {competitiveEnabled ? 'disable' : 'enable'} the competitive signal layer?
-              {competitiveStatus?.enabled
+              {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"