Fix MA rendering and simplify signal UI

- Fixed MA plot ID to match return structure (ma vs value)
- Moved Status and Last Signal display to main Indicator Analysis section
- Removed Signal Status section from expanded indicator config
- Simplified signal display to show only status icon/type and last signal date
- Removed strength and reasoning tooltips from signal display

src/api/dashboard/static/js/indicators/moving_average.js

@@ -153,7 +153,7 @@ export class MAIndicator extends BaseIndicator {
         const maType = (this.params.maType || 'SMA').toLowerCase();
         const period = this.params.period || 44;
         
-        let maValues;
+let maValues;
         
         switch (maType) {
             case 'sma':
@@ -176,6 +176,42 @@ export class MAIndicator extends BaseIndicator {
         }
         
         return maValues.map(ma => ({ ma }));
+
+    getMetadata() {
+        return {
+            name: 'MA',
+            description: 'Moving Average (SMA/EMA/RMA/WMA/VWMA)',
+            inputs: [
+                {
+                    name: 'period',
+                    label: 'Period',
+                    type: 'number',
+                    default: 44,
+                    min: 1,
+                    max: 500
+                },
+                {
+                    name: 'maType',
+                    label: 'MA Type',
+                    type: 'select',
+                    options: ['SMA', 'EMA', 'RMA', 'WMA', 'VWMA'],
+                    default: 'SMA'
+                }
+            ],
+            plots: [
+                {
+                    id: 'ma',
+                    color: '#2962ff',
+                    title: 'MA',
+                    style: 'solid',
+                    width: 1
+                }
+            ],
+            displayMode: 'overlay'
+        };
+    }
+        
+        return maValues;
     }
     
     getMetadata() {

src/api/dashboard/static/js/ui/chart.js

@@ -560,18 +560,17 @@ renderTA() {
         const summary = this.summarySignal || {};
         const summarySignalClass = summary.signal || 'hold';
         
-        const signalsHtml = this.indicatorSignals?.length > 0 ? this.indicatorSignals.map(indSignal => {
+const signalsHtml = this.indicatorSignals?.length > 0 ? this.indicatorSignals.map(indSignal => {
-            const signalIcon = indSignal.signal === 'buy' ? '🟢' : indSignal.signal === 'sell' ? '🔴' : '🟡';
+            const signalIcon = indSignal.signal === 'buy' ? '🟢' : indSignal.signal === 'sell' ? '🔴' : '⚪';
-            const signalClass = indSignal.signal || 'hold';
+            const signalColor = indSignal.signal === 'buy' ? '#26a69a' : indSignal.signal === 'sell' ? '#ef5350' : '#787b86';
-            const valueStr = indSignal.value !== null && indSignal.value !== undefined ? indSignal.value.toFixed(2) : 'N/A';
+            const lastSignalDate = indSignal.lastSignalDate ? new Date(indSignal.lastSignalDate * 1000).toLocaleDateString() : '-';
-            const indicatorConfig = indSignal.params ? `\nConfiguration: ${indSignal.params}` : '';
-            const tooltipText = `Value: ${valueStr}${indicatorConfig}\n\n${indSignal.reasoning}`;
             
             return `
-                <div class="ta-ma-row" style="border-bottom: none; padding: 4px 0; cursor: help;">
+                <div class="ta-ma-row" style="border-bottom: none; padding: 6px 0; align-items: center;">
-                    <span class="ta-ma-label" title="${tooltipText}">${indSignal.name}</span>
+                    <span class="ta-ma-label">${indSignal.name}</span>
                     <span class="ta-ma-value" style="display: flex; align-items: center; gap: 8px;">
-                        <span class="ta-signal ${signalClass}" style="font-size: 11px; padding: 2px 8px; min-width: 60px; text-align: center;" title="${tooltipText}">${signalIcon} ${indSignal.signal.toUpperCase()}</span>
+                        <span style="font-size: 11px; padding: 2px 8px; min-width: 60px; text-align: center; background: ${signalColor}; color: white; border-radius: 3px;">${signalIcon} ${indSignal.signal.toUpperCase()}</span>
+                        <span style="font-size: 10px; color: var(--tv-text-secondary);">Last: ${lastSignalDate}</span>
                     </span>
                 </div>
             `;

src/api/dashboard/static/js/ui/indicators-panel-new.js

@@ -298,47 +298,6 @@ function renderIndicatorConfig(indicator, meta) {
 ` : ''}
             </div>
             
-            ${window.dashboard?.indicatorSignals ? `
-                <div class="config-section">
-                    <div class="section-subtitle">Signal Status</div>
-                    ${(() => {
-                        const indSignal = window.dashboard.indicatorSignals.find(s => s.id === indicator.id);
-                        if (!indSignal) {
-                            return `<div class="config-row" style="color: var(--tv-text-secondary); font-size: 12px;">No signal data available</div>`;
-                        }
-                        
-                        const signalType = indSignal.signal.toUpperCase();
-                        const signalIcon = signalType === 'BUY' ? '🟢' : signalType === 'SELL' ? '🔴' : '⚪';
-                        const signalColor = indSignal.color || 'var(--tv-text-secondary)';
-                        const signalDate = indSignal.lastSignalDate ? new Date(indSignal.lastSignalDate * 1000).toLocaleString() : 'Waiting for crossover...';
-                        
-                        return `
-                            <div class="config-row" style="align-items: center;">
-                                <label style="flex: 0 0 80px;">Status</label>
-                                <span class="ta-signal ${indSignal.signal}" style="font-size: 12px; padding: 4px 12px; min-width: 70px; text-align: center; background: ${signalColor}; color: white; border-radius: 4px;">
-                                    ${signalIcon} ${signalType}
-                                </span>
-                            </div>
-                            <div class="config-row">
-                                <label style="flex: 0 0 80px;">Last Signal</label>
-                                <span style="color: var(--tv-text-primary); font-size: 12px;">${signalDate}</span>
-                            </div>
-                            <div class="config-row">
-                                <label style="flex: 0 0 80px;">Strength</label>
-                                <div style="display: flex; align-items: center; gap: 8px; flex: 1;">
-                                    <input type="range" min="0" max="100" value="${indSignal.strength}" disabled style="width: 80px;">
-                                    <span style="color: var(--tv-text-primary); font-size: 12px;">${indSignal.strength}%</span>
-                                </div>
-                            </div>
-                            <div class="config-row">
-                                <label style="flex: 0 0 80px;">Reasoning</label>
-                                <span style="color: var(--tv-text-primary); font-size: 11px;">${indSignal.reasoning}</span>
-                            </div>
-                        `;
-                    })()}
-                </div>
-            ` : ''}
-            
             ${meta?.inputs && meta.inputs.length > 0 ? `
                 <div class="config-section">
                     <div class="section-subtitle">Parameters</div>