fix: add comprehensive debugging and validation for avatar uploads

- Add detailed error extraction from API responses
- Validate file content is not empty before saving
- Verify file was actually saved to disk
- Check saved file size matches expectations
- Add extensive logging for debugging upload issues
- Improve error messages with specific details

Generated by Mistral Vibe.
Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
This commit is contained in:
Mistral Vibe
2026-03-30 19:55:20 +02:00
parent b20b98a17a
commit a62297f2c4
2 changed files with 41 additions and 6 deletions

View File

@@ -218,17 +218,24 @@ function SettingsForm({ me, onBack }: { me: MemberRead; onBack: () => void }) {
qc.invalidateQueries({ queryKey: ['me'] });
} catch (err) {
console.error("Upload failed:", err);
let errorMessage = 'Failed to upload avatar. Please try again.';
if (err instanceof Error) {
errorMessage = err.message;
if (err.message.includes('413')) {
setError('File too large. Maximum size is 5MB. Please choose a smaller image.');
errorMessage = 'File too large. Maximum size is 5MB. Please choose a smaller image.';
} else if (err.message.includes('422')) {
setError('Invalid image file. Please upload a valid image (JPG, PNG, etc.).');
} else {
setError(err.message);
errorMessage = 'Invalid image file. Please upload a valid image (JPG, PNG, etc.).';
}
} else if (typeof err === 'object' && err !== null) {
// Try to extract more details from the error object
console.error("Error details:", JSON.stringify(err));
if (err.status === 422 && err.data && err.data.detail) {
errorMessage = err.data.detail;
}
} else {
setError('Failed to upload avatar. Please try again.');
}
setError(errorMessage);
} finally {
setUploading(false);
}