Refactor: Move image display into PhotoPrintAreaField component

- Move current image display from parent edit page into PhotoPrintAreaField
- Allows component to control visibility based on client-side removal state
- Image now properly disappears when Remove button is clicked
- Both front and back photo sections now managed entirely by component
- Verified: Remove button works, image disappears immediately, persists to database
This commit is contained in:
Andymick
2026-07-19 12:05:28 +01:00
parent 285a8ab21f
commit 3bb188ed7f
3 changed files with 10 additions and 17 deletions
+8
View File
@@ -102,6 +102,14 @@ export default function PhotoPrintAreaField({
return (
<div>
{currentImageUrl && !showPrintAreaEditor && (
<div className="mb-3 flex items-center gap-3">
{/* eslint-disable-next-line @next/next/no-img-element */}
<img src={currentImageUrl} alt="Product preview" className="h-20 w-20 border border-line object-contain" />
<p className="text-xs text-muted">Current photo. Upload a new one below to replace it.</p>
</div>
)}
{!currentImageUrl || !showPrintAreaEditor ? (
<>
<input