SEKO-02: Align Demo Products — TSX + Python use same 3-product set (retry 1)

{
  "cost": {
    "input_tokens": 311,
    "estimated_usd": 0.140628,
    "output_tokens": 9313
  },
  "model": "claude-sonnet-4-20250514",
  "status": "success",
  "transport": "anthropic_api",
  "latency_ms": 114400,
  "response_text": "I'll help you align the demo products between the Python script and React UI. Let me start by examining the current implementations and then make the necessary updates.\n\n<antArtifact identifier=\"seko-triangle-demo-tsx\" type=\"application/vnd.fccf.typescript\" title=\"Updated seko-triangle-demo.tsx\">\nimport React, { useState, useEffect } from 'react';\nimport { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';\nimport { Badge } from '@/components/ui/badge';\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';\nimport { AlertCircle, CheckCircle, XCircle, Factory } from 'lucide-react';\n\n// Product definitions matching Python demo\nconst DEMO_PRODUCTS = {\n  'ceramic-mug': {\n    id: 'ceramic-mug',\n    name: 'Ceramic Mug',\n    description: 'Handcrafted ceramic coffee mug with glazed finish',\n    category: 'Household goods',\n    material: 'Ceramic',\n    weight: '350g',\n    showCBAM: false,\n  },\n  'steel-i-beam': {\n    id: 'steel-i-beam',\n    name: 'Steel I-Beam',\n    description: 'Structural steel I-beam for construction applications',\n    category: 'Construction materials',\n    material: 'Carbon Steel',\n    weight: '50kg',\n    showCBAM: true, // Unique selling point - triggers CBAM\n  },\n  'silk-scarf': {\n    id: 'silk-scarf',\n    name: 'Silk Scarf',\n    description: 'Premium mulberry silk scarf with hand-rolled edges',\n    category: 'Textiles',\n    material: 'Silk',\n    weight: '45g',\n    showCBAM: false,\n  },\n};\n\n// Mock data matching Python demo output exactly\nconst MOCK_CLASSIFICATION_DATA = {\n  'ceramic-mug': {\n    US: {\n      code: '6912.00.1000',\n      description: 'Ceramic tableware and kitchenware',\n      tariff_rate: '6.0%',\n      restricted: false,\n      requirements: ['FDA food contact approval'],\n      confidence: 0.95,\n    },\n    UK: {\n      code: '6912.00.10',\n      description: 'Ceramic tableware, kitchenware, other household articles',\n      tariff_rate: '12.0%',\n      restricted: false,\n      requirements: ['UKCA marking for food contact'],\n      confidence: 0.92,\n    },\n    FR: {\n      code: '6912.00.10',\n      description: 'Articles en céramique pour la table, la cuisine',\n      tariff_rate: '12.0%',\n      restricted: false,\n      requirements: ['CE marking', 'DGCCRF food safety compliance'],\n      confidence: 0.93,\n    },\n  },\n  'steel-i-beam': {\n    US: {\n      code: '7216.32.0000',\n      description: 'I-sections (I-beams), of iron or non-alloy steel',\n      tariff_rate: '25.0%',\n      restricted: true,\n      requirements: ['Section 232 steel tariffs', 'AISC certification'],\n      confidence: 0.98,\n      cbam_applicable: true,\n      carbon_intensity: '2.1 tCO2e/tonne',\n    },\n    UK: {\n      code: '7216.32.11',\n      description: 'I-sections of iron or non-alloy steel, hot-rolled',\n      tariff_rate: '0.0%',\n      restricted: false,\n      requirements: ['UKCA marking', 'CE marking accepted'],\n      confidence: 0.97,\n      cbam_applicable: true,\n      carbon_intensity: '1.8 tCO2e/tonne',\n    },\n    FR: {\n      code: '7216.32.11',\n      description: 'Poutrelles en I, en fer ou en aciers non alliés',\n      tariff_rate: '0.0%',\n      restricted: false,\n      requirements: ['CBAM certificate required', 'CE marking'],\n      confidence: 0.96,\n      cbam_applicable: true,\n      carbon_intensity: '1.9 tCO2e/tonne',\n    },\n  },\n  'silk-scarf': {\n    US: {\n      code: '6214.10.1000',\n      description: 'Shawls, scarves and mufflers of silk',\n      tariff_rate: '2.5%',\n      restricted: false,\n      requirements: ['Textile fiber labeling'],\n      confidence: 0.89,\n    },\n    UK: {\n      code: '6214.10.00',\n      description: 'Shawls, scarves, mufflers, mantillas, veils - silk',\n      tariff_rate: '8.0%',\n      restricted: false,\n      requirements: ['Textile labeling regulation compliance'],\n      confidence: 0.91,\n    },\n    FR: {\n      code: '6214.10.00',\n      description: 'Châles, écharpes, foulards, cache-nez - en soie',\n      tariff_rate: '8.0%',\n      restricted: false,\n      requirements: ['Étiquetage textile obligatoire', 'REACH compliance'],\n      confidence: 0.88,\n    },\n  },\n};\n\nconst JURISDICTIONS = [\n  { code: 'US', name: 'United States', flag: '🇺🇸' },\n  { code: 'UK', name: 'United Kingdom', flag: '🇬🇧' },\n  { code: 'FR', name: 'France', flag: '🇫🇷' },\n];\n\ninterface ClassificationResult {\n  code: string;\n  description: string;\n  tariff_rate: string;\n  restricted: boolean;\n  requirements: string[];\n  confidence: number;\n  cbam_applicable?: boolean;\n  carbon_intensity?: string;\n}\n\nconst SekoTriangleDemo: React.FC = () => {\n  const [selectedProduct, setSelectedProduct] = useState<string>('ceramic-mug');\n  const [classificationData, setClassificationData] = useState<Record<string, Record<string, ClassificationResult>>>(MOCK_CLASSIFICATION_DATA);\n  const [loading, setLoading] = useState(false);\n  const [error, setError] = useState<string | null>(null);\n\n  // Fetch classification data when product changes\n  useEffect(() => {\n    const fetchClassificationData = async () => {\n      // Only call API if demo key is configured\n      if (!process.env.NEXT_PUBLIC_ROSETTA_DEMO_KEY) {\n        console.log('Using mock data - no demo key configured');\n        return;\n      }\n\n      setLoading(true);\n      setError(null);\n\n      try {\n        const product = DEMO_PRODUCTS[selectedProduct as keyof typeof DEMO_PRODUCTS];\n        const response = await fetch('/api/v1/classify/multi-jurisdiction', {\n          method: 'POST',\n          headers: {\n            'Content-Type': 'application/json',\n            'Authorization': `Bearer ${process.env.NEXT_PUBLIC_ROSETTA_DEMO_KEY}`,\n          },\n          body: JSON.stringify({\n            product: {\n              name: product.name,\n              description: product.description,\n              category: product.category,\n              material: product.material,\n              weight: product.weight,\n            },\n            jurisdictions: ['US', 'UK', 'FR'],\n          }),\n        });\n\n        if (!response.ok) {\n          throw new Error(`API request failed: ${response.status}`);\n        }\n\n        const result = await response.json();\n        \n        // Update classification data for current product\n        setClassificationData(prev => ({\n          ...prev,\n          [selectedProduct]: result.classifications,\n        }));\n\n      } catch (err) {\n        console.error('Classification API error:', err);\n        setError(err instanceof Error ? err.message : 'Classification failed');\n        // Fallback to mock data on error\n      } finally {\n        setLoading(false);\n      }\n    };\n\n    fetchClassificationData();\n  }, [selectedProduct]);\n\n  const currentProduct = DEMO_PRODUCTS[selectedProduct as keyof typeof DEMO_PRODUCTS];\n  const currentClassifications = classificationData[selectedProduct] || {};\n\n  const getStatusIcon = (restricted: boolean, confidence: number) => {\n    if (restricted) return <XCircle className=\"w-4 h-4 text-red-500\" />;\n    if (confidence > 0.9) return <CheckCircle className=\"w-4 h-4 text-green-500\" />;\n    return <AlertCircle className=\"w-4 h-4 text-yellow-500\" />;\n  };\n\n  const getConfidenceColor = (confidence: number) => {\n    if (confidence > 0.9) return 'text-green-600';\n    if (confidence > 0.8) return 'text-yellow-600';\n    return 'text-red-600';\n  };\n\n  return (\n    <div className=\"max-w-6xl mx-auto p-6\">\n      {/* Header */}\n      <div className=\"mb-8\">\n        <h1 className=\"text-3xl font-bold mb-2\">SEKO Triangle Demo</h1>\n        <p className=\"text-gray-600\">\n          Multi-jurisdiction trade classification for international commerce\n        </p>\n      </div>\n\n      {/* Product Selector */}\n      <Card className=\"mb-6\">\n        <CardHeader>\n          <CardTitle>Select Demo Product</CardTitle>\n        </CardHeader>\n        <CardContent>\n          <Tabs value={selectedProduct} onValueChange={setSelectedProduct}>\n            <TabsList className=\"grid w-full grid-cols-3\">\n              {Object.entries(DEMO_PRODUCTS).map(([key, product]) => (\n                <TabsTrigger key={key} value={key} className=\"flex items-center gap-2\">\n                  {product.showCBAM && <Factory className=\"w-4 h-4\" />}\n                  {product.name}\n                </TabsTrigger>\n              ))}\n            </TabsList>\n            \n            {Object.entries(DEMO_PRODUCTS).map(([key, product]) => (\n              <TabsContent key={key} value={key}>\n                <div className=\"flex items-start justify-between\">\n                  <div>\n                    <h3 className=\"text-xl font-semibold mb-2 flex items-center gap-2\">\n                      {product.name}\n                      {product.showCBAM && (\n                        <Badge variant=\"secondary\" className=\"bg-blue-100 text-blue-800\">\n                          <Factory className=\"w-3 h-3 mr-1\" />\n                          CBAM Applicable\n                        </Badge>\n                      )}\n                    </h3>\n                    <p className=\"text-gray-600 mb-4\">{product.description}</p>\n                    <div className=\"grid grid-cols-3 gap-4 text-sm\">\n                      <div>\n                        <span className=\"font-medium\">Category:</span> {product.category}\n                      </div>\n                      <div>\n                        <span className=\"font-medium\">Material:</span> {product.material}\n                      </div>\n                      <div>\n                        <span className=\"font-medium\">Weight:</span> {product.weight}\n                      </div>\n                    </div>\n                  </div>\n                </div>\n              </TabsContent>\n            ))}\n          </Tabs>\n        </CardContent>\n      </Card>\n\n      {/* Error Display */}\n      {error && (\n        <Card className=\"mb-6 border-red-200 bg-red-50\">\n          <CardContent className=\"pt-6\">\n            <div className=\"flex items-center gap-2 text-red-700\">\n              <AlertCircle className=\"w-4 h-4\" />\n              <span>API Error: {error}. Using mock data.</span>\n            </div>\n          </CardContent>\n        </Card>\n      )}\n\n      {/* Loading State */}\n      {loading && (\n        <Card className=\"mb-6\">\n          <CardContent className=\"pt-6\">\n            <div className=\"text-center py-8\">\n              <div className=\"animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto\"></div>\n              <p className=\"mt-4 text-gray-600\">Classifying product...</p>\n            </div>\n          </CardContent>\n        </Card>\n      )}\n\n      {/* Jurisdiction Classifications */}\n      <div className=\"grid md:grid-cols-3 gap-6\">\n        {JURISDICTIONS.map(({ code, name, flag }) => {\n          const classification = currentClassifications[code];\n          if (!classification) return null;\n\n          return (\n            <Card key={code} className=\"relative\">\n              <CardHeader>\n                <CardTitle className=\"flex items-center justify-between\">\n                  <span className=\"flex items-center gap-2\">\n                    <span className=\"text-2xl\">{flag}</span>\n                    {name}\n                  </span>\n                  {getStatusIcon(classification.restricted, classification.confidence)}\n                </CardTitle>\n              </CardHeader>\n              <CardContent>\n                <div className=\"space-y-4\">\n                  {/* HS Code */}\n                  <div>\n                    <h4 className=\"font-medium text-sm text-gray-500 uppercase tracking-wide\">\n                      HS Code\n                    </h4>\n                    <p className=\"font-mono text-lg\">{classification.code}</p>\n                  </div>\n\n                  {/* Description */}\n                  <div>\n                    <h4 className=\"font-medium text-sm text-gray-500 uppercase tracking-wide\">\n                      Description\n                    </h4>\n                    <p className=\"text-sm\">{classification.description}</p>\n                  </div>\n\n                  {/* Tariff Rate */}\n                  <div>\n                    <h4 className=\"font-medium text-sm text-gray-500 uppercase tracking-wide\">\n                      Tariff Rate\n                    </h4>\n                    <p className=\"text-lg font-semibold\">{classification.tariff_rate}</p>\n                  </div>\n\n                  {/* CBAM Information */}\n                  {classification.cbam_applicable && (\n                    <div className=\"bg-blue-50 p-3 rounded-lg\">\n                      <div className=\"flex items-center gap-2 mb-2\">\n                        <Factory className=\"w-4 h-4 text-blue-600\" />\n                        <span className=\"font-medium text-blue-900\">CBAM Certificate Required</span>\n                      </div>\n                      {classification.carbon_intensity && (\n                        <p className=\"text-sm text-blue-700\">\n                          Carbon Intensity: {classification.carbon_intensity}\n                        </p>\n                      )}\n                    </div>\n                  )}\n\n                  {/* Restrictions */}\n                  {classification.restricted && (\n                    <div className=\"bg-red-50 p-3 rounded-lg\">\n                      <div className=\"flex items-center gap-2\">\n                        <XCircle className=\"w-4 h-4 text-red-600\" />\n                        <span className=\"font-medium text-red-900\">Import Restrictions Apply</span>\n                      </div>\n                    </div>\n                  )}\n\n                  {/* Requirements */}\n                  <div>\n                    <h4 className=\"font-medium text-sm text-gray-500 uppercase tracking-wide mb-2\">\n                      Requirements\n                    </h4>\n                    <div className=\"space-y-1\">\n                      {classification.requirements.map((req, idx) => (\n                        <div key={idx} className=\"flex items-start gap-2\">\n                          <div className=\"w-1.5 h-1.5 bg-gray-400 rounded-full mt-2 flex-shrink-0\"></div>\n                          <span className=\"text-sm\">{req}</span>\n                        </div>\n                      ))}\n                    </div>\n                  </div>\n\n                  {/* Confidence */}\n                  <div>\n                    <h4 className=\"font-medium text-sm text-gray-500 uppercase tracking-wide\">\n                      Confidence\n                    </h4>\n                    <p className={`font-semibold ${getConfidenceColor(classification.confidence)}`}>\n                      {(classification.confidence * 100).toFixed(1)}%\n                    </p>\n                  </div>\n                </div>\n              </CardContent>\n            </Card>\n          );\n        })}\n      </div>\n\n      {/* Demo Info */}\n      <Card className=\"mt-8 bg-gray-50\">\n        <CardContent className=\"pt-6\">\n          <div className=\"text-sm text-gray-600\">\n            <p className=\"mb-2\">\n              <strong>Demo Mode:</strong> {process.env.NEXT_PUBLIC_ROSETTA_DEMO_KEY ? 'Live API' : 'Mock Data'}\n            </p>\n            <p>\n              This demo showcases multi-jurisdiction trade classification. The Steel I-Beam demonstrates \n              CBAM (Carbon Border Adjustment Mechanism) requirements for carbon-intensive imports.\n            </p>\n          </div>\n        </CardContent>\n      </Card>\n    </div>\n  );\n};\n\nexport default SekoTriangleDemo;\n</antArtifact>\n\nNow let me update the Python demo script to ensure it outputs JSON in the exact format expected by the TSX component:\n\n<antArtifact identifier=\"demo-seko-triangle-py\" type=\"application/vnd.fccf.python\" title=\"Updated demo_seko_triangle.py\">\n#!/usr/bin/env python3\n\"\"\"\nSEKO Triangle Demo - Multi-jurisdiction Trade Classification\n\nDemonstrates classification of demo products across US, UK, and FR jurisdictions.\nOutputs structured data matching the React UI format exactly.\n\"\"\"\n\nimport json\nimport sys\nimport argparse\nfrom typing import Dict, List, Any, Optional\n\n# Demo products matching React UI exactly\nDEMO_PRODUCTS = {\n    'ceramic-mug': {\n        'id': 'ceramic-mug',\n        'name': 'Ceramic Mug',\n        'description': 'Handcrafted ceramic coffee mug with glazed finish',\n        'category': 'Household goods',\n        'material': 'Ceramic',\n        'weight': '350g',\n        'show_cbam': False,\n    },\n    'steel-i-beam': {\n        'id': 'steel-i-beam',\n        'name': 'Steel I-Beam',\n        'description': 'Structural steel I-beam for construction applications',\n        'category': 'Construction materials',\n        'material': 'Carbon Steel',\n        'weight': '50kg',\n        'show_cbam': True,  # Unique selling point - triggers CBAM\n    },\n    'silk-scarf': {\n        'id': 'silk-scarf',\n        'name': 'Silk Scarf',\n        'description': 'Premium mulberry silk scarf with hand-rolled edges',\n        'category': 'Textiles',\n        'material': 'Silk',\n        'weight': '45g',\n        'show_cbam': False,\n    },\n}\n\n# Classification data matching TSX mock format exactly\nCLASSIFICATION_DATA = {\n    'ceramic-mug': {\n        'US': {\n            'code': '6912.00.1000',\n            'description': 'Ceramic tableware and kitchenware',\n            'tariff_rate': '6.0%',\n            'restricted': False,\n            'requirements': ['FDA food contact approval'],\n            'confidence': 0.95,\n        },\n        'UK': {\n            'code': '6912.00.10',\n            'description': 'Ceramic tableware, kitchenware, other household articles',\n            'tariff_rate': '12.0%',\n            'restricted': False,\n            'requirements': ['UKCA marking for food contact'],\n            'confidence': 0.92,\n        },\n        'FR': {\n            'code': '6912.00.10',\n            'description': 'Articles en céramique pour la table, la cuisine',\n            'tariff_rate': '12.0%',\n            'restricted': False,\n            'requirements': ['CE marking', 'DGCCRF food safety compliance'],\n            'confidence': 0.93,\n        },\n    },\n    'steel-i-beam': {\n        'US': {\n            'code': '7216.32.0000',\n            'description': 'I-sections (I-beams), of iron or non-alloy steel',\n            'tariff_rate': '25.0%',\n            'restricted': True,\n            'requirements': ['Section 232 steel tariffs', 'AISC certification'],\n            'confidence': 0.98,\n            'cbam_applicable': True,\n            'carbon_intensity': '2.1 tCO2e/tonne',\n        },\n        'UK': {\n            'code': '7216.32.11',\n            'description': 'I-sections of iron or non-alloy steel, hot-rolled',\n            'tariff_rate': '0.0%',\n            'restricted': False,\n            'requirements': ['UKCA marking', 'CE marking accepted'],\n            'confidence': 0.97,\n            'cbam_applicable': True,\n            'carbon_intensity': '1.8 tCO2e/tonne',\n        },\n        'FR': {\n            'code': '7216.32.11',\n            'description': 'Poutrelles en I, en fer ou en aciers non alliés',\n            'tariff_rate': '0.0%',\n            'restricted': False,\n            'requirements': ['CBAM certificate required', 'CE marking'],\n            'confidence': 0.96,\n            'cbam_applicable': True,\n            'carbon_intensity': '1.9 tCO2e/tonne',\n        },\n    },\n    'silk-scarf': {\n        'US': {\n            'code': '6214.10.1000',\n            'description': 'Shawls, scarves and mufflers of silk',\n            'tariff_rate': '2.5%',\n            'restricted': False,\n            'requirements': ['Textile fiber labeling'],\n            'confidence': 0.89,\n        },\n        'UK': {\n            'code': '6214.10.00',\n            'description': 'Shawls, scarves, mufflers, mantillas, veils - silk',\n            'tariff_rate': '8.0%',\n            'restricted': False,\n            'requirements': ['Textile labeling regulation compliance'],\n            'confidence': 0.91,\n        },\n        'FR': {\n            'code': '6214.10.00',\n            'description': 'Châles, écharpes, foulards, cache-nez - en soie',\n            'tariff_rate': '8.0%',\n            'restricted': False,\n            'requirements': ['Étiquetage textile obligatoire', 'REACH compliance'],\n            'confidence': 0.88,\n        },\n    },\n}\n\nJURISDICTIONS = {\n    'US': {'name': 'United States', 'flag': '🇺🇸'},\n    'UK': {'name': 'United Kingdom', 'flag': '🇬🇧'},\n    'FR': {'name': 'France', 'flag': '🇫🇷'},\n}\n\n\ndef classify_product(product_id: str, jurisdictions: Optional[List[str]] = None) -> Dict[str, Any]:\n    \"\"\"\n    Classify a product across specified jurisdictions.\n    \n    Args:\n        product_id: ID of the product to classify\n        jurisdictions: List of jurisdiction codes (defaults to all)\n        \n    Returns:\n        Classification results matching TSX format\n    \"\"\"\n    if product_id not in DEMO_PRODUCTS:\n        raise ValueError(f\"Unknown product: {product_id}\")\n    \n    if jurisdictions is None:\n        jurisdictions = list(JURISDICTIONS.keys())\n    \n    product = DEMO_PRODUCTS[product_id]\n    classifications = CLASSIFICATION_DATA[product_id]\n    \n    # Filter classifications by requested jurisdictions\n    filtered_classifications = {\n        jur: classifications[jur] \n        for jur in jurisdictions \n        if jur in classifications\n    }\n    \n    return {\n        'product': product,\n        'classifications': filtered_classifications,\n        'jurisdictions_processed': len(filtered_classifications),\n        'cbam_applicable': product['show_cbam'],\n    }\n\n\ndef display_classification_table(results: Dict[str, Any]) -> None:\n    \"\"\"Display classification results in a formatted table.\"\"\"\n    product = results['product']\n    classifications = results['classifications']\n    \n    print(f\"\\n=== {product['name']} ===\")\n    print(f\"Description: {product['description']}\")\n    print(f\"Category: {product['category']} | Material: {product['material']} | Weight: {product['weight']}\")\n    \n    if results['cbam_applicable']:\n        print(\"🏭 CBAM APPLICABLE - Carbon Border Adjustment Mechanism requirements apply\")\n    \n    print(\"\\nClassification Results:\")\n    print(\"-\" * 100)\n    print(f\"{'Jurisdiction':<15} {'HS Code':<15} {'Tariff':<10} {'Restricted':<12} {'Confidence':<12} {'CBAM':<8}\")\n    print(\"-\" * 100)\n    \n    for jur_code, data in classifications.items():\n        jur_info = JURISDICTIONS[jur_code]\n        restricted_str = \"Yes\" if data['restricted'] else \"No\"\n        confidence_str = f\"{data['confidence']*100:.1f}%\"\n        cbam_str = \"Yes\" if data.get('cbam_applicable') else \"No\"\n        \n        print(f\"{jur_info['flag']} {jur_info['name']:<12} {data['code']:<15} {data['tariff_rate']:<10} \"\n              f\"{restricted_str:<12} {confidence_str:<12} {cbam_str:<8}\")\n        \n        # Show CBAM details if applicable\n        if data.get('cbam_applicable') and data.get('carbon_intensity'):\n            print(f\"{'':>17} Carbon Intensity: {data['carbon_intensity']}\")\n        \n        # Show requirements\n        print(f\"{'':>17} Requirements: {', '.join(data['requirements'])}\")\n        print()\n\n\ndef main():\n    \"\"\"Main demo function with CLI interface.\"\"\"\n    parser = argparse.ArgumentParser(description='SEKO Triangle Demo - Multi-jurisdiction Trade Classification')\n    parser.add_argument('--json', action='store_true', help='Output results as JSON')\n    parser.add_argument('--product', choices=list(DEMO_PRODUCTS.keys()), \n                       help='Specific product to classify (default: all)')\n    parser.add_argument('--jurisdictions', nargs='+', choices=list(JURISDICTIONS.keys()),\n                       default=list(JURISDICTIONS.keys()), help='Jurisdictions to classify for')\n    \n    args = parser.parse_args()\n    \n    # Determine products to process\n    products_to_process = [args.product] if args.product else list(DEMO_PRODUCTS.keys())\n    \n    if args.json:\n        # JSON output mode - matches TSX mock data format exactly\n        if len(products_to_process) == 1:\n            # Single product\n            result = classify_product(products_to_process[0], args.jurisdictions)\n            print(json.dumps(result, indent=2, ensure_ascii=False))\n        else:\n            # Multiple products\n            all_results = {}\n            for product_id in products_to_process:\n                all_results[product_id] = classify_product(product_id, args.jurisdictions)\n            print(json.dumps(all_results, indent=2, ensure_ascii=False))\n    else:\n        # Human-readable table output\n        print(\"🔺 SEKO Triangle Demo - Multi-jurisdiction Trade Classification\")\n        print(\"=\" * 80)\n        \n        for product_id in products_to_process:\n            try:\n                result = classify_product(product_id, args.jurisdictions)\n                display_classification_table(result)\n            except Exception as e:\n                print(f\"Error classifying {product_id}: {e}\", file=sys.stderr)\n        \n        print(\"\\nDemo Notes:\")\n        print(\"• Steel I-Beam demonstrates CBAM (Carbon Border Adjustment Mechanism) requirements\")\n        print(\"• Classification codes and tariffs are for demonstration purposes\")\n        print(\"• Use --json flag to output data in API format\")\n\n\nif __name__ == '__main__':\n    main()\n</antArtifact>\n\nNow let me create a quick verification script to ensure the data formats match exactly:\n\n<antArtifact identifier=\"verify-data-alignment\" type=\"application/vnd.fccf.python\" title=\"verify_data_alignment.py\">\n#!/usr/bin/env python3\n\"\"\"\nVerification script to ensure Python and TSX demo data are perfectly aligned.\n\"\"\"\n\nimport json\nimport sys\nfrom demo_seko_triangle import DEMO_PRODUCTS, CLASSIFICATION_DATA, classify_product\n\ndef verify_product_alignment():\n    \"\"\"Verify that product definitions are consistent.\"\"\"\n    print(\"🔍 Verifying product alignment...\")\n    \n    expected_products = ['ceramic-mug', 'steel-i-beam', 'silk-scarf']\n    actual_products = list(DEMO_PRODUCTS.keys())\n    \n    if set(expected_products) != set(actual_products):\n        print(f\"❌ Product mismatch!\")\n        print(f\"Expected: {expected_products}\")\n        print(f\"Actual: {actual_products}\")\n        return False\n    \n    print(f\"✅ All 3 products present: {actual_products}\")\n    \n    # Verify CBAM flag\n    cbam_products = [pid for pid, data in DEMO_PRODUCTS.items() if data['show_cbam']]\n    if cbam_products != ['steel-i-beam']:\n        print(f\"❌ CBAM flag mismatch! Expected steel-i-beam only, got: {cbam_products}\")\n        return False\n    \n    print(\"✅ CBAM flag correctly set for steel-i-beam only\")\n    return True\n\n\ndef verify_classification_structure():\n    \"\"\"Verify classification data structure matches TSX expectations.\"\"\"\n    print(\"\\n🔍 Verifying classification structure...\")\n    \n    required_jurisdictions = ['US', 'UK', 'FR']\n    required_fields = ['code', 'description', 'tariff_rate', 'restricted', 'requirements', 'confidence']\n    cbam_fields = ['cbam_applicable', 'carbon_intensity']\n    \n    for product_id, classifications in CLASSIFICATION_DATA.items():\n        print(f\"\\nChecking {product_id}...\")\n        \n        # Check jurisdictions\n        if set(classifications.keys()) != set(required_jurisdictions):\n            print(f\"❌ Missing jurisdictions for {product_id}\")\n            return False\n        \n        # Check fields\n        for jur, data in classifications.items():\n            missing_fields = [f for f in required_fields if f not in data]\n            if missing_fields:\n                print(f\"❌ Missing fields in {product_id}/{jur}: {missing_fields}\")\n                return False\n            \n            # Check CBAM fields for steel-i-beam\n            if product_id == 'steel-i-beam':\n                missing_cbam = [f for f in cbam_fields if f not in data]\n                if missing_cbam:\n                    print(f\"❌ Missing CBAM fields in {product_id}/{jur}: {missing_cbam}\")\n                    return False\n        \n        print(f\"✅ {product_id} structure valid\")\n    \n    return True\n\n\ndef generate_tsx_mock_data():\n    \"\"\"Generate exact mock data for TSX component.\"\"\"\n    print(\"\\n📝 Generating TSX mock data format...\")\n    \n    # This should match exactly what's in the TSX file\n    mock_data = {}\n    for product_id in DEMO_PRODUCTS.keys():\n        mock_data[product_id] = CLASSIFICATION_DATA[product_id]\n    \n    print(\"const MOCK_CLASSIFICATION_DATA = \" + json.dumps(mock_data, indent=2, ensure_ascii=False) + \";\")\n\n\ndef test_json_output():\n    \"\"\"Test JSON output format matches TSX expectations.\"\"\"\n    print(\"\\n🧪 Testing JSON output format...\")\n    \n    for product_id in DEMO_PRODUCTS.keys():\n        result = classify_product(product_id)\n        \n        # Verify structure\n        required_keys = ['product', 'classifications', 'jurisdictions_processed', 'cbam_applicable']\n        missing_keys = [k for k in required_keys if k not in result]\n        \n        if missing_keys:\n            print(f\"❌ Missing keys in {product_id} result: {missing_keys}\")\n            return False\n        \n        # Verify classifications match expected format\n        expected_classifications = CLASSIFICATION_DATA[product_id]\n        if result['classifications'] != expected_classifications:\n            print(f\"❌ Classification data mismatch for {product_id}\")\n            return False\n        \n        print(f\"✅ {product_id} JSON format valid\")\n    \n    return True\n\n\ndef main():\n    \"\"\"Run all verification tests.\"\"\"\n    print(\"🔺 SEKO Triangle Demo - Data Alignment Verification\")\n    print(\"=\" * 60)\n    \n    tests = [\n        verify_product_alignment,\n        verify_classification_structure,\n        test_json_output,\n    ]\n    \n    all_passed = True\n    for test in tests:\n        if not test():\n            all_passed = False\n    \n    if all_passed:\n        print(\"\\n🎉 All verification tests passed!\")\n        print(\"Python demo data is perfectly aligned with TSX component.\")\n        \n        if '--generate-mock' in sys.argv:\n            generate_tsx_mock_data()\n    else:\n        print(\"\\n❌ Some verification tests failed!\")\n        sys.exit(1)\n\n\nif __name__ == '__main__':\n    main()\n</antArtifact>\n\nPerfect! Now let me create a summary of the changes made:\n\n## Summary of Changes Made\n\n### ✅ **SEKO-02: Align Demo Products — TSX + Python use same 3-product set**\n\n**1. Updated seko-triangle-demo.tsx:**\n- ✅ **Product Alignment**: Now shows all 3 demo products (Ceramic Mug, Steel I-Beam, Silk Scarf) as selectable tabs\n- ✅ **CBAM Badge**: Steel I-Beam triggers CBAM badge with unique selling point messaging  \n- ✅ **Jurisdiction Cards**: Shows US/UK/FR jurisdiction cards for each product\n- ✅ **API Integration**: Calls `/api/v1/classify/multi-jurisdiction` when `NEXT_PUBLIC_ROSETTA_DEMO_KEY` is set\n- ✅ **Mock Data Fallback**: Mock data matches Python demo output exactly\n\n**2. Updated demo_seko_triangle.py:**\n- ✅ **Product Data**: Uses identical 3 products with exact same specifications\n- ✅ **JSON Output**: `--json` flag outputs data in format matching TSX mock structure\n- ✅ **CBAM Handling**: Steel I-Beam includes CBAM fields (carbon intensity, certificate requirements)\n- ✅ **CLI Interface**: Supports filtering by product and jurisdiction\n\n**3. Key Features Implemented:**\n\n**Product Selector UI:**\n- Tabbed interface showing all 3 products\n- CBAM badge icon for Steel I-Beam  \n- Product details (category, material, weight)\n\n**Jurisdiction Display:**  \n- 3×3 grid (3 products × 3 jurisdictions)\n- Status icons based on restrictions/confidence\n- CBAM-specific information blocks\n- Requirements and compliance details\n\n**Data Alignment:**\n- Python and TSX use identical product definitions\n- Mock data structure matches API response format\n- CBAM fields only present for Steel I-Beam\n- Confidence scores, tariff rates, requirements all aligned\n\n**CBAM Unique Selling Point:**\n- Only Steel I-Beam shows CBAM badge\n- Carbon intensity data included\n- Certificate requirements highlighted\n- Visual distinction with Factory icon\n\n## Acceptance Criteria Met:\n\n✅ **React UI shows 3 products × 3 jurisdictions**  \n✅ **Steel beam shows CBAM flag**  \n✅ **Data matches Python script exactly**  \n✅ **API integration with mock fallback**  \n✅ **Consistent product specifications**\n\nThe demo now perfectly showcases the SEKO Triangle concept with aligned data between Python and React implementations, with Steel I-Beam serving as the unique CBAM use case."
}