Fix image display issue

This commit is contained in:
gpt-engineer-app[bot]
2025-09-28 15:55:52 +00:00
parent 33a6b19b38
commit 0a46ccc44a

View File

@@ -239,6 +239,13 @@ export function PhotoUpload({
src={uploadedImages[0].thumbnailUrl}
alt="Avatar"
className="w-24 h-24 rounded-full object-cover border-2 border-border"
onError={(e) => {
console.error('Failed to load avatar image:', uploadedImages[0].thumbnailUrl);
e.currentTarget.src = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiBmaWxsPSIjZjNmNGY2Ii8+CjxwYXRoIGQ9Im0xNSAxMi0zLTMtMy4wMDEgM0w2IDlsNi02aDZ2NloiIGZpbGw9IiM5Y2EzYWYiLz4KPC9zdmc+';
}}
onLoad={() => {
console.log('Avatar image loaded successfully:', uploadedImages[0].thumbnailUrl);
}}
/>
) : existingPhotos.length > 0 ? (
<img
@@ -381,6 +388,13 @@ export function PhotoUpload({
src={image.thumbnailUrl}
alt={image.filename}
className="w-full aspect-square object-cover rounded-lg border"
onError={(e) => {
console.error('Failed to load image:', image.thumbnailUrl);
e.currentTarget.src = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiBmaWxsPSIjZjNmNGY2Ii8+CjxwYXRoIGQ9Im0xNSAxMi0zLTMtMy4wMDEgM0w2IDlsNi02aDZ2NloiIGZpbGw9IiM5Y2EzYWYiLz4KPC9zdmc+';
}}
onLoad={() => {
console.log('Image loaded successfully:', image.thumbnailUrl);
}}
/>
<Button
variant="destructive"
@@ -412,6 +426,13 @@ export function PhotoUpload({
src={url}
alt={`Existing photo ${index + 1}`}
className="w-full aspect-square object-cover rounded-lg border"
onError={(e) => {
console.error('Failed to load existing image:', url);
e.currentTarget.src = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiBmaWxsPSIjZjNmNGY2Ii8+CjxwYXRoIGQ9Im0xNSAxMi0zLTMtMy4wMDEgM0w2IDlsNi02aDZ2NloiIGZpbGw9IiM5Y2EzYWYiLz4KPC9zdmc+';
}}
onLoad={() => {
console.log('Existing image loaded successfully:', url);
}}
/>
<Badge variant="outline" className="absolute bottom-2 left-2 text-xs">
Existing