feat: SWOT output as structured text parsed into HTML tables

- Backend: Updated analyzer prompt OUTPUT FORMAT to use structured text
format: [M##] Metric: Value - Insight
- Backend: Updated revision prompt to match the same format
- Frontend: Added parseSwotLine() parser to extract ref, metric, insight
- Frontend: Replaced SWOT list display with HTML tables (3 columns)
- Frontend: Removed unused icon imports (Zap, AlertCircle)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

frontend/src/App.tsx

@@ -27,10 +27,8 @@ import {
   AlertTriangle,
   CheckCircle,
   XCircle,
-  AlertCircle,
   BarChart3,
   RefreshCw,
-  Zap,
   Play,
   Copy,
   Download,
@@ -94,6 +92,51 @@ const cleanMarkdown = (text: string): string => {
     .trim()
 }
 
+// Parse structured SWOT line: "[M01] Revenue: $394.3B - Strong market position"
+// Returns { ref, metric, insight } or null if line doesn't match pattern
+interface SwotRow {
+  ref: string
+  metric: string
+  insight: string
+}
+
+const parseSwotLine = (line: string): SwotRow | null => {
+  // Clean markdown first
+  const cleaned = cleanMarkdown(line)
+
+  // Pattern: [M##] Metric: Value - Insight
+  // Also handle: [M##] Metric: Value | Insight (pipe separator)
+  const match = cleaned.match(/^\[?(M\d+)\]?\s*(.+?)\s*[-|]\s*(.+)$/i)
+  if (match) {
+    return {
+      ref: match[1],
+      metric: match[2].trim(),
+      insight: match[3].trim()
+    }
+  }
+
+  // Fallback: no ref pattern, just "Metric: Value - Insight"
+  const fallback = cleaned.match(/^(.+?)\s*[-|]\s*(.+)$/)
+  if (fallback) {
+    return {
+      ref: '',
+      metric: fallback[1].trim(),
+      insight: fallback[2].trim()
+    }
+  }
+
+  // Last resort: just return the cleaned line as insight
+  if (cleaned.length > 0) {
+    return {
+      ref: '',
+      metric: '',
+      insight: cleaned
+    }
+  }
+
+  return null
+}
+
 const Index = () => {
   const [selectedStock, setSelectedStock] = useState<StockResult | null>(null)
   const [isLoading, setIsLoading] = useState(false)
@@ -781,119 +824,130 @@ Generated by Instant SWOT Agent`
                     />
                   )}
 
-                  {/* SWOT Analysis */}
+                  {/* SWOT Analysis - Tables */}
                   <div className="space-y-6">
-                    {/* Strengths */}
+                    {/* Strengths Table */}
                     <div>
                       <h3 className="flex items-center gap-2 text-base font-semibold text-emerald-500 mb-3 border-b border-emerald-500/30 pb-2">
                         <TrendingUp className="h-5 w-5" />
                         Strengths
                       </h3>
-                      <ul className="space-y-2 pl-1">
-                        {analysisResult.swot_data.strengths.map((item, i) => (
-                          <li key={i} className="flex gap-2 text-sm text-foreground">
-                            <CheckCircle className="h-4 w-4 text-emerald-500 shrink-0 mt-0.5" />
-                            <span>{cleanMarkdown(item)}</span>
-                          </li>
-                        ))}
-                      </ul>
+                      <table className="w-full text-sm border-collapse">
+                        <thead>
+                          <tr className="border-b border-border">
+                            <th className="text-left py-2 px-2 w-12 text-muted-foreground font-medium">Ref</th>
+                            <th className="text-left py-2 px-2 w-1/3 text-muted-foreground font-medium">Metric</th>
+                            <th className="text-left py-2 px-2 text-muted-foreground font-medium">Insight</th>
+                          </tr>
+                        </thead>
+                        <tbody>
+                          {analysisResult.swot_data.strengths.map((item, i) => {
+                            const parsed = parseSwotLine(item)
+                            if (!parsed) return null
+                            return (
+                              <tr key={i} className="border-b border-border/50 hover:bg-emerald-500/5">
+                                <td className="py-2 px-2 text-emerald-500 font-mono text-xs">{parsed.ref}</td>
+                                <td className="py-2 px-2 text-foreground">{parsed.metric}</td>
+                                <td className="py-2 px-2 text-muted-foreground">{parsed.insight}</td>
+                              </tr>
+                            )
+                          })}
+                        </tbody>
+                      </table>
                     </div>
 
-                    {/* Weaknesses */}
+                    {/* Weaknesses Table */}
                     <div>
                       <h3 className="flex items-center gap-2 text-base font-semibold text-red-500 mb-3 border-b border-red-500/30 pb-2">
                         <TrendingDown className="h-5 w-5" />
                         Weaknesses
                       </h3>
-                      <ul className="space-y-2 pl-1">
-                        {analysisResult.swot_data.weaknesses.map((item, i) => (
-                          <li key={i} className="flex gap-2 text-sm text-foreground">
-                            <XCircle className="h-4 w-4 text-red-500 shrink-0 mt-0.5" />
-                            <span>{cleanMarkdown(item)}</span>
-                          </li>
-                        ))}
-                      </ul>
+                      <table className="w-full text-sm border-collapse">
+                        <thead>
+                          <tr className="border-b border-border">
+                            <th className="text-left py-2 px-2 w-12 text-muted-foreground font-medium">Ref</th>
+                            <th className="text-left py-2 px-2 w-1/3 text-muted-foreground font-medium">Metric</th>
+                            <th className="text-left py-2 px-2 text-muted-foreground font-medium">Insight</th>
+                          </tr>
+                        </thead>
+                        <tbody>
+                          {analysisResult.swot_data.weaknesses.map((item, i) => {
+                            const parsed = parseSwotLine(item)
+                            if (!parsed) return null
+                            return (
+                              <tr key={i} className="border-b border-border/50 hover:bg-red-500/5">
+                                <td className="py-2 px-2 text-red-500 font-mono text-xs">{parsed.ref}</td>
+                                <td className="py-2 px-2 text-foreground">{parsed.metric}</td>
+                                <td className="py-2 px-2 text-muted-foreground">{parsed.insight}</td>
+                              </tr>
+                            )
+                          })}
+                        </tbody>
+                      </table>
                     </div>
 
-                    {/* Opportunities */}
+                    {/* Opportunities Table */}
                     <div>
                       <h3 className="flex items-center gap-2 text-base font-semibold text-blue-500 mb-3 border-b border-blue-500/30 pb-2">
                         <Target className="h-5 w-5" />
                         Opportunities
                       </h3>
-                      <ul className="space-y-2 pl-1">
-                        {analysisResult.swot_data.opportunities.map((item, i) => (
-                          <li key={i} className="flex gap-2 text-sm text-foreground">
-                            <Zap className="h-4 w-4 text-blue-500 shrink-0 mt-0.5" />
-                            <span>{cleanMarkdown(item)}</span>
-                          </li>
-                        ))}
-                      </ul>
+                      <table className="w-full text-sm border-collapse">
+                        <thead>
+                          <tr className="border-b border-border">
+                            <th className="text-left py-2 px-2 w-12 text-muted-foreground font-medium">Ref</th>
+                            <th className="text-left py-2 px-2 w-1/3 text-muted-foreground font-medium">Metric</th>
+                            <th className="text-left py-2 px-2 text-muted-foreground font-medium">Insight</th>
+                          </tr>
+                        </thead>
+                        <tbody>
+                          {analysisResult.swot_data.opportunities.map((item, i) => {
+                            const parsed = parseSwotLine(item)
+                            if (!parsed) return null
+                            return (
+                              <tr key={i} className="border-b border-border/50 hover:bg-blue-500/5">
+                                <td className="py-2 px-2 text-blue-500 font-mono text-xs">{parsed.ref}</td>
+                                <td className="py-2 px-2 text-foreground">{parsed.metric}</td>
+                                <td className="py-2 px-2 text-muted-foreground">{parsed.insight}</td>
+                              </tr>
+                            )
+                          })}
+                        </tbody>
+                      </table>
                     </div>
 
-                    {/* Threats */}
+                    {/* Threats Table */}
                     <div>
                       <h3 className="flex items-center gap-2 text-base font-semibold text-yellow-500 mb-3 border-b border-yellow-500/30 pb-2">
                         <AlertTriangle className="h-5 w-5" />
                         Threats
                       </h3>
-                      <ul className="space-y-2 pl-1">
-                        {analysisResult.swot_data.threats.map((item, i) => (
-                          <li key={i} className="flex gap-2 text-sm text-foreground">
-                            <AlertCircle className="h-4 w-4 text-yellow-500 shrink-0 mt-0.5" />
-                            <span>{cleanMarkdown(item)}</span>
-                          </li>
-                        ))}
-                      </ul>
+                      <table className="w-full text-sm border-collapse">
+                        <thead>
+                          <tr className="border-b border-border">
+                            <th className="text-left py-2 px-2 w-12 text-muted-foreground font-medium">Ref</th>
+                            <th className="text-left py-2 px-2 w-1/3 text-muted-foreground font-medium">Metric</th>
+                            <th className="text-left py-2 px-2 text-muted-foreground font-medium">Insight</th>
+                          </tr>
+                        </thead>
+                        <tbody>
+                          {analysisResult.swot_data.threats.map((item, i) => {
+                            const parsed = parseSwotLine(item)
+                            if (!parsed) return null
+                            return (
+                              <tr key={i} className="border-b border-border/50 hover:bg-yellow-500/5">
+                                <td className="py-2 px-2 text-yellow-500 font-mono text-xs">{parsed.ref}</td>
+                                <td className="py-2 px-2 text-foreground">{parsed.metric}</td>
+                                <td className="py-2 px-2 text-muted-foreground">{parsed.insight}</td>
+                              </tr>
+                            )
+                          })}
+                        </tbody>
+                      </table>
                     </div>
                   </div>
 
-                  {/* Data Quality Notes */}
-                  <Card>
-                    <CardHeader>
-                      <CardTitle className="text-base flex items-center gap-2">
-                        <Target className="h-4 w-4" />
-                        Data Quality Notes
-                      </CardTitle>
-                    </CardHeader>
-                    <CardContent className="space-y-4">
-                      {analysisResult.quality_notes?.high_confidence?.length > 0 && (
-                        <div>
-                          <h4 className="font-medium text-sm mb-2">Metrics with High Confidence</h4>
-                          <ul className="text-sm text-muted-foreground space-y-1">
-                            {analysisResult.quality_notes.high_confidence.map((m: string, i: number) => (
-                              <li key={i}>- {m}</li>
-                            ))}
-                          </ul>
-                        </div>
-                      )}
-                      {analysisResult.quality_notes?.gaps_or_stale?.length > 0 && (
-                        <div>
-                          <h4 className="font-medium text-sm mb-2">Data Gaps or Staleness</h4>
-                          <ul className="text-sm text-muted-foreground space-y-1">
-                            {analysisResult.quality_notes.gaps_or_stale.map((m: string, i: number) => (
-                              <li key={i}>- {m}</li>
-                            ))}
-                          </ul>
-                        </div>
-                      )}
-                      {analysisResult.quality_notes?.assumptions?.length > 0 && (
-                        <div>
-                          <h4 className="font-medium text-sm mb-2">Assumptions Made</h4>
-                          <ul className="text-sm text-muted-foreground space-y-1">
-                            {analysisResult.quality_notes.assumptions.map((a: string, i: number) => (
-                              <li key={i}>- {a}</li>
-                            ))}
-                          </ul>
-                        </div>
-                      )}
-                      {(!analysisResult.quality_notes?.high_confidence?.length &&
-                        !analysisResult.quality_notes?.gaps_or_stale?.length &&
-                        !analysisResult.quality_notes?.assumptions?.length) && (
-                        <p className="text-sm text-muted-foreground">No quality notes available.</p>
-                      )}
-                    </CardContent>
-                  </Card>
+                  {/* Data Quality Notes - Hidden for now, will revisit later */}
                 </div>
               )}
             </TabsContent>

src/nodes/analyzer.py

@@ -1348,17 +1348,29 @@ Weighted Score: {critique_details.get('weighted_score', 0):.1f} / 10
 
 ### OUTPUT INSTRUCTIONS
 
-Produce a complete, revised SWOT analysis using TABLE format:
+Produce a complete, revised SWOT analysis with this exact structure (3-5 points per section):
 
 ## Strengths
-| Ref | Metric | Insight |
-|-----|--------|---------|
-| M## | Metric: Value | Strategic insight in one sentence |
+- [M01] Revenue: $394.3B - Strong market position with substantial scale
+- [M02] Net Margin: 24.3% - High profitability indicates pricing power
 
-(Same table format for Weaknesses, Opportunities, Threats)
+## Weaknesses
+- [M04] Debt/Equity: 1.87 - Elevated leverage increases financial risk
+
+## Opportunities
+- [M12] GDP Growth: 4.3% - Favorable macro environment for expansion
+
+## Threats
+- [M13] Interest Rate: 3.72% - Higher borrowing costs may impact margins
+
+CRITICAL REQUIREMENTS:
+1. Each point MUST start with metric reference in brackets: [M##]
+2. Format: [M##] Metric: Value - Strategic insight
+3. Use EXACT values from the METRIC REFERENCE TABLE - do NOT round
+4. Keep insights concise (one sentence)
+5. Include 3-5 points per section
 
 Do not:
-- Use bullet points or **bold** labels - use tables only
 - Include any preamble about revisions
 - Reference the Critic's feedback in your output
 
@@ -1404,42 +1416,27 @@ def _build_analyzer_prompt(company: str, ticker: str, formatted_data: str,
 
 === OUTPUT FORMAT ===
 
-Produce a SWOT analysis using TABLES with this exact structure:
+Produce a SWOT analysis with this exact structure (3-5 points per section):
 
 ## Strengths
-| Ref | Metric | Insight |
-|-----|--------|---------|
-| M01 | Revenue: $394.3B | Strong market position with substantial scale |
-| M02 | Net Margin: 24.3% | High profitability indicates pricing power |
-
-(Include 3-5 rows per section)
+- [M01] Revenue: $394.3B - Strong market position with substantial scale
+- [M02] Net Margin: 24.3% - High profitability indicates pricing power
 
 ## Weaknesses
-| Ref | Metric | Insight |
-|-----|--------|---------|
-| M04 | Debt/Equity: 1.87 | Elevated leverage increases financial risk |
+- [M04] Debt/Equity: 1.87 - Elevated leverage increases financial risk
 
 ## Opportunities
-| Ref | Metric | Insight |
-|-----|--------|---------|
-| M12 | GDP Growth: 4.3% | Favorable macro environment for expansion |
+- [M12] GDP Growth: 4.3% - Favorable macro environment for expansion
 
 ## Threats
-| Ref | Metric | Insight |
-|-----|--------|---------|
-| M13 | Interest Rate: 3.72% | Higher borrowing costs may impact margins |
-
-## Data Quality Notes
-- Metrics Used: [List key metrics analyzed]
-- Data Gaps: [Any unavailable metrics]
-- Confidence: [High/Medium/Low]
+- [M13] Interest Rate: 3.72% - Higher borrowing costs may impact margins
 
 CRITICAL REQUIREMENTS:
-1. Use TABLE format as shown above - NOT bullet points
-2. Every row MUST cite a metric reference [M##] in the Ref column
-3. Metric column: Name and value (e.g., "Revenue: $394.3B")
-4. Insight column: One concise sentence explaining strategic implication
-5. Use EXACT values from the METRIC REFERENCE TABLE - do NOT round"""
+1. Each point MUST start with metric reference in brackets: [M##]
+2. Format: [M##] Metric: Value - Strategic insight
+3. Use EXACT values from the METRIC REFERENCE TABLE - do NOT round
+4. Keep insights concise (one sentence)
+5. Include 3-5 points per section"""
 
     return prompt, metric_lookup, ref_hash