fix(profile): klarere Fehlermeldung bei nicht-authentifiziertem me-image-Upload

Der me-image Upload-Endpunkt wird von Wardrobe (face-banner),
Picture (reference-picker), Comic (face-banner) und der profile-
Detail-View geteilt. Bisher: wenn `authStore.getValidToken()` null
zurückgab, ging die Anfrage trotzdem ohne `Authorization`-Header
raus und der Server antwortete mit dem rohen Auth-Middleware-String
"Missing authorization header" — keine Hinweis darauf was der
Nutzer tun soll. Symptom war auch über Module hinweg verschieden:
Wardrobe-Nutzer sah's nie weil sein Token frisch war, Comic-Nutzer
mit ablaufendem Token sah's beim ersten Upload.

Zwei Härtungen in `uploadMeImageFile`:

1. Pre-flight Check — wenn `getValidToken()` null liefert, throw
   sofort mit Klartext-Anweisung "Du bist nicht eingeloggt — bitte
   aktualisiere die Seite und logge dich neu ein". Spart einen
   Server-Roundtrip und gibt actionable feedback.

2. 401 nach getToken-Erfolg — Token war zwar lokal "valid" aber
   serverseitig abgelaufen/invalidiert. Statt den Server-String
   durchzureichen, eigene "Session abgelaufen — bitte
   aktualisieren"-Meldung.

Alle Banner-UIs (Wardrobe + Comic) catchen den Fehler bereits in
`handleFaceUpload` und zeigen ihn im Banner-Error-Bereich, also
fließt die neue Meldung 1:1 durch ohne UI-Änderung.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Till JS 2026-04-26 20:01:53 +02:00
parent 1c4486ceba
commit aac1e3d55c

View file

@ -21,18 +21,35 @@ export interface UploadMeImageResult {
}
export async function uploadMeImageFile(file: File): Promise<UploadMeImageResult> {
// Fail-fast wenn der Auth-Store keinen Token liefern kann. Vorher
// schickten wir die Anfrage trotzdem ohne `Authorization`-Header
// los und der Server antwortete kryptisch mit "Missing authorization
// header" — der User hatte keinen Hinweis ob's ein Login-Problem
// oder Server-Down war. Jetzt klarer Diagnose-Pfad.
const token = await authStore.getValidToken();
if (!token) {
throw new Error(
'Du bist nicht eingeloggt — bitte aktualisiere die Seite und logge dich neu ein, dann erneut hochladen.'
);
}
const formData = new FormData();
formData.append('file', file);
const response = await fetch(`${getManaApiUrl()}/api/v1/profile/me-images/upload`, {
method: 'POST',
headers: token ? { Authorization: `Bearer ${token}` } : {},
headers: { Authorization: `Bearer ${token}` },
body: formData,
});
if (!response.ok) {
const body = await response.json().catch(() => ({ error: `HTTP ${response.status}` }));
// 401 nach getValidToken-Erfolg = Token war serverseitig schon
// abgelaufen / invalidiert. Nutzer-freundliche Meldung statt
// Server-String "Missing authorization header".
if (response.status === 401) {
throw new Error('Session abgelaufen — bitte aktualisiere die Seite und logge dich neu ein.');
}
throw new Error(body.error || `Upload failed (${response.status})`);
}