fix: add comprehensive logging to debug avatar issues

- Add console.log statements to frontend avatar functions
- Add print statements to backend avatar endpoints
- Log file uploads, settings updates, and errors
- Track the complete flow from UI to backend

Generated by Mistral Vibe.
Co-Authored-By: Mistral Vibe <vibe@mistral.ai>
This commit is contained in:
Mistral Vibe
2026-03-30 19:34:28 +02:00
parent a17b4a7ec0
commit 675399836c
2 changed files with 37 additions and 5 deletions

View File

@@ -122,18 +122,23 @@ function SettingsForm({ me, onBack }: { me: MemberRead; onBack: () => void }) {
type="file"
accept="image/*"
onChange={async (e) => {
console.log("File input changed", e.target.files);
const file = e.target.files?.[0];
if (file) {
console.log("Selected file:", file.name, file.type, file.size);
setUploading(true);
try {
const formData = new FormData();
formData.append('file', file);
console.log("Uploading file to /auth/me/avatar");
const response = await api.post<MemberRead>('/auth/me/avatar', formData);
console.log("Upload response:", response);
setAvatarUrl(response.avatar_url || '');
qc.invalidateQueries({ queryKey: ['me'] });
} catch (err) {
console.error("Upload failed:", err);
setError(err instanceof Error ? err.message : 'Failed to upload avatar');
} finally {
setUploading(false);
@@ -157,15 +162,22 @@ function SettingsForm({ me, onBack }: { me: MemberRead; onBack: () => void }) {
</label>
<button
onClick={async () => {
// Generate a new random avatar using user ID as seed for consistency
const seed = Math.random().toString(36).substring(2, 15);
const newAvatarUrl = `https://api.dicebear.com/v6/identicon/svg?seed=${seed}&backgroundType=gradientLinear&size=128`;
console.log("Generate Random button clicked");
try {
// Generate a new random avatar using user ID as seed for consistency
const seed = Math.random().toString(36).substring(2, 15);
const newAvatarUrl = `https://api.dicebear.com/v6/identicon/svg?seed=${seed}&backgroundType=gradientLinear&size=128`;
console.log("Generated avatar URL:", newAvatarUrl);
console.log("Calling updateSettings with:", { avatar_url: newAvatarUrl });
await updateSettings({ avatar_url: newAvatarUrl });
setAvatarUrl(newAvatarUrl);
qc.invalidateQueries({ queryKey: ["me"] });
console.log("Avatar updated successfully");
} catch (err) {
console.error("Failed to update avatar:", err);
setError(err instanceof Error ? err.message : 'Failed to update avatar');
}
}}