Harden export preview handling

frontend/README.md

@@ -208,6 +208,8 @@ React + TypeScript + MapLibre foundation for project/area/dataset workflow.
 
 - Production builds split application code, React vendor code and MapLibre vendor code into separate chunks.
 - The MapLibre chunk is intentionally larger than generic app chunks because it contains the GIS map runtime; the Vite warning threshold is set to keep this known vendor dependency visible without warning on every release build.
+- Export preview rendering lives in `src/components/exports/ExportPreview.tsx`.
+- The Export Center only offers JSON preview for JSON/GeoJSON artifacts; HTML project reports are shown as download-only artifacts.
 
 ## Raster dependency visibility
 

frontend/src/App.tsx

@@ -9,6 +9,7 @@ import { DatasetDetailPanel } from './components/datasets/DatasetDetailPanel'
 import { DatasetPanel } from './components/datasets/DatasetPanel'
 import { DetectionLab } from './components/detection/DetectionLab'
 import { ExportCenter } from './components/exports/ExportCenter'
+import { ExportPreview } from './components/exports/ExportPreview'
 import { MapWorkspace } from './components/map/MapWorkspace'
 import { AreaPanel } from './components/project/AreaPanel'
 import { ProjectPanel } from './components/project/ProjectPanel'
@@ -740,12 +741,7 @@ function App(): JSX.Element {
           onPreviewContent={previewExportContent}
           onDownload={downloadExportArtifact}
         />
-        {exportPreview ? (
-          <section>
-            <h2>Export Preview</h2>
-            <pre className="job-result">{JSON.stringify(exportPreview, null, 2)}</pre>
-          </section>
-        ) : null}
+        <ExportPreview content={exportPreview} />
 
         <DatasetPanel
           selectedProjectId={selectedProjectId}

frontend/src/components/exports/ExportCenter.tsx

@@ -24,6 +24,16 @@ function isVectorDatasetType(datasetType: string): boolean {
   return datasetType === 'vector' || datasetType === 'geojson'
 }
 
+function canPreviewJson(item: ExportRead): boolean {
+  if (item.export_type === 'project_report_html') {
+    return false
+  }
+  if (item.metadata_json?.format === 'html') {
+    return false
+  }
+  return true
+}
+
 export function ExportCenter({
   selectedProjectId,
   selectedDataset,
@@ -80,9 +90,13 @@ export function ExportCenter({
             <div>status: {item.status}</div>
             <div>path: {item.storage_path}</div>
             <div>export id: {item.id}</div>
-            <button type="button" onClick={() => onPreviewContent(item.id)}>
-              Preview JSON content
-            </button>
+            {canPreviewJson(item) ? (
+              <button type="button" onClick={() => onPreviewContent(item.id)}>
+                Preview JSON content
+              </button>
+            ) : (
+              <div>Preview: download-only HTML artifact</div>
+            )}
             <button type="button" onClick={() => onDownload(item.id)}>
               Download artifact
             </button>

frontend/src/components/exports/ExportPreview.tsx

@@ -0,0 +1,16 @@
+interface ExportPreviewProps {
+  content: Record<string, unknown> | null
+}
+
+export function ExportPreview({ content }: ExportPreviewProps): JSX.Element | null {
+  if (!content) {
+    return null
+  }
+
+  return (
+    <section>
+      <h2>Export Preview</h2>
+      <pre className="job-result">{JSON.stringify(content, null, 2)}</pre>
+    </section>
+  )
+}