fix: media thumbnails, product dimensions, inline 3D viewer, GLB export

Bug A: Media Library thumbnails were gray because <img src> cannot send
JWT auth headers. Added useAuthBlob() hook (fetch + createObjectURL) in
MediaBrowser.tsx. Also fixed publish_asset Celery task to populate
product_id + cad_file_id on MediaAsset for thumbnail fallback resolution.

Bug B: Product dimensions now shown in Product Details card with Ruler
icon and "from CAD" label when cad_mesh_attributes.dimensions_mm exists.

Bug C: Replaced 128×128 CAD thumbnail with InlineCadViewer component.
Queries gltf_geometry MediaAssets, fetches GLB via auth fetch → blob URL
→ Three.js Canvas with OrbitControls. Falls back to thumbnail + "Load 3D
Model" button. Polling when GLB generation is in progress.

Bug D: trimesh was in [cad] optional extra but Dockerfile only installed
[dev]. Changed to pip install -e ".[dev,cad]" — trimesh now available in
backend container, GLB + Colors export works.

Also added bbox extraction (STL-first numpy parsing) in render_step_thumbnail
and admin "Re-extract CAD Metadata" bulk endpoint.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/api/cad.ts

@@ -118,3 +118,15 @@ export async function generateGltfGeometry(cadFileId: string): Promise<GenerateG
   const res = await api.post<GenerateGltfResponse>(`/cad/${cadFileId}/generate-gltf-geometry`)
   return res.data
 }
+
+export const exportGltfColored = (id: string): Promise<void> =>
+  api.get(`/cad/${id}/export-gltf-colored`, { responseType: 'blob' }).then(r => {
+    const url = URL.createObjectURL(r.data)
+    const a = document.createElement('a')
+    a.href = url
+    a.download = `${id}_colored.glb`
+    document.body.appendChild(a)
+    a.click()
+    document.body.removeChild(a)
+    URL.revokeObjectURL(url)
+  })

frontend/src/api/media.ts

@@ -38,6 +38,8 @@ export interface MediaFilter {
   asset_types?: MediaAssetType[]
   skip?: number
   limit?: number
+  sort_by?: string
+  sort_dir?: 'asc' | 'desc'
 }
 
 export const getMediaAssets = (filters: MediaFilter = {}): Promise<MediaAsset[]> => {
@@ -48,6 +50,8 @@ export const getMediaAssets = (filters: MediaFilter = {}): Promise<MediaAsset[]>
   if (filters.asset_types?.length) filters.asset_types.forEach(t => params.append('asset_types', t))
   if (filters.skip !== undefined) params.set('skip', String(filters.skip))
   if (filters.limit !== undefined) params.set('limit', String(filters.limit))
+  if (filters.sort_by) params.set('sort_by', filters.sort_by)
+  if (filters.sort_dir) params.set('sort_dir', filters.sort_dir)
   return api.get(`/media/?${params}`).then(r => r.data)
 }
 
@@ -65,8 +69,11 @@ export const zipDownloadAssets = (ids: string[]): Promise<void> =>
     a.href = url
     a.download = 'media-export.zip'
     a.click()
-    URL.revokeObjectURL(url)
+    setTimeout(() => URL.revokeObjectURL(url), 100)
   })
 
 export const archiveMediaAsset = (id: string): Promise<void> =>
   api.delete(`/media/${id}`).then(() => undefined)
+
+export const deleteMediaAssetPermanent = (id: string): Promise<void> =>
+  api.delete(`/media/${id}/permanent`).then(() => undefined)

frontend/src/api/products.ts

@@ -57,6 +57,13 @@ export interface Product {
   processing_status: string | null
   stl_cached: string[]
   cad_parsed_objects: string[] | null
+  cad_mesh_attributes?: {
+    dimensions_mm?: { x: number; y: number; z: number }
+    bbox_center_mm?: { x: number; y: number; z: number }
+    suggested_smooth_angle?: number
+    has_mechanical_edges?: boolean
+    sharp_edge_midpoints?: number[][]
+  } | null
   arbeitspaket: string | null
   notes: string | null
   is_active: boolean