fix: add photo_path fields to frontend Item interface to display saved photos

The backend returns photo_path, photo_thumbnail_path, and photo_upload_date
from the AI auto-save feature, but the frontend Item interface was missing
these fields, causing images not to display in ItemDetailModal and InventoryTable.

Updated:
- frontend/lib/db.ts: Added missing photo fields to Item interface
- frontend/components/ItemDetailModal.tsx: Use photo_path first, fallback to image_url
- frontend/components/InventoryTable.tsx: Use photo_path first, fallback to image_url

This ensures the UI can now display photos saved by the auto-photo-save feature.
This commit is contained in:
2026-04-21 19:45:19 +03:00
parent 2e61dfe935
commit b5fb2a8cdb
3 changed files with 13 additions and 6 deletions

View File

@@ -106,7 +106,7 @@ export default function InventoryTable({
onClick={() => handleItemClick(item)}
className="flex items-center gap-3 flex-1 min-w-0 pr-4 cursor-pointer"
>
{item.image_url ? (
{item.photo_path || item.image_url ? (
<div
onClick={(e) => {
e.stopPropagation();
@@ -115,7 +115,7 @@ export default function InventoryTable({
className="w-12 h-12 rounded-xl shrink-0 border-2 border-slate-300 overflow-hidden cursor-pointer hover:border-primary transition-colors active:scale-95"
>
<img
src={item.image_url}
src={item.photo_path || item.image_url || ''}
alt={item.name}
className="w-full h-full object-cover"
loading="lazy"
@@ -128,7 +128,7 @@ export default function InventoryTable({
)}
<div className="truncate">
<h4 className="card-title truncate">{item.name}</h4>
{item.image_url ? (
{item.photo_path || item.image_url ? (
<p className="card-subtitle mt-0 lowercase opacity-80 text-xs">Tap photo for details</p>
) : (
<>
@@ -163,9 +163,9 @@ export default function InventoryTable({
/>
)}
{selectedPhotoItem && selectedPhotoItem.image_url && (
{selectedPhotoItem && (selectedPhotoItem.photo_path || selectedPhotoItem.image_url) && (
<PhotoModal
photoUrl={selectedPhotoItem.image_url}
photoUrl={selectedPhotoItem.photo_path || selectedPhotoItem.image_url || ''}
title={selectedPhotoItem.name}
onClose={() => setSelectedPhotoItem(null)}
/>