authProvider calls "AUTH_ERROR" with only 2XX responses - react-admin

Question

i have big issues debugging react-admin...
I have a node.js web server acting as an API which returns only 2XX responses but manages to trigger "AUTH_ERROR" inside my authProvider and i get Warning: Missing translation for key: "Cannot read property 'hasOwnProperty' of undefined" inside the console.
This is my networking when i trigger this issue:
as you can see no 4XX / 5XX codes only 2XX, the token gets removed from the localStorage causing the provider to go back to Login, but it shouldn't since I only got 2XX responses.
This is my code for the Auth Provider (it's the exemple for the documentation iirc)
// in src/authProvider.js
import { AUTH_LOGIN, AUTH_LOGOUT, AUTH_ERROR, AUTH_GET_PERMISSIONS, AUTH_CHECK } from 'react-admin';
import decodeJwt from 'jwt-decode';
export default (type, params) => {
if (type === AUTH_LOGIN) {
const { username, password } = params;
const request = new Request('http://localhost:1337/api/v1/auth/login', {
method: 'POST',
body: JSON.stringify({ username, password }),
headers: new Headers({ 'Content-Type': 'application/json' }),
})
return fetch(request)
.then(response => {
if (response.status < 200 || response.status >= 300) {
throw new Error(response.statusText);
}
return response.json();
})
.then(({ token }) => {
const decodedToken = decodeJwt(token);
localStorage.setItem('token', token);
localStorage.setItem('role', decodedToken.role);
});
}
if (type === AUTH_LOGOUT) {
localStorage.removeItem('token');
localStorage.removeItem('role');
return Promise.resolve();
}
if (type === AUTH_ERROR) {
console.log("AUTH ERROR");
}
if (type === AUTH_CHECK) {
return localStorage.getItem('token') ? Promise.resolve() : Promise.reject();
}
if (type === AUTH_GET_PERMISSIONS) {
const role = localStorage.getItem('role');
return role ? Promise.resolve(role) : Promise.reject();
}
return Promise.reject('Unknown method');
};
This is "EDIT" form that causes this issue, all the other entities / CRUD operations do work ...
import React from "react";
import { List, Datagrid, TextField, ReferenceField, NumberField, Create, SimpleForm, TextInput, NumberInput, ReferenceInput, SelectInput, Edit, EditButton, DeleteButton, DisabledInput } from "react-admin";
export const CharacterList = (props) => (
<List {...props}>
<Datagrid>
<NumberField source="id" />
<TextField source="name" />
<TextField source="race" />
<TextField source="class" />
<NumberField source="level" />
<ReferenceField
label="user"
source="user_id"
reference="users"
linkType="show"
>
<TextField source="username" />
</ReferenceField>
<EditButton />
<DeleteButton />
</Datagrid>
</List>
);
export const CharacterCreate = (props) => (
<Create {...props}>
<SimpleForm>
<TextInput source="name"/>
<TextInput source="race"/>
<TextInput source="class"/>
<NumberInput source="level"/>
<ReferenceInput label="Owner" source="user_id" reference="users">
<SelectInput optionText="username" />
</ReferenceInput>
</SimpleForm>
</Create>
);
export const CharacterEdit = (props) => (
<Edit {...props}>
<SimpleForm>
<DisabledInput source="id"/>
<TextInput source="name"/>
<TextInput source="race"/>
<TextInput source="class"/>
<NumberInput source="level"/>
</SimpleForm>
</Edit>
);
I can provide more code samples if needed. And if some people has ideas on how to have more debug / verbose, because honestly this is one of the worst frameworks to debug ...
Thanks in advance everyone <3

Answer 1

Modifying the AuthProvider fixed the disconnection issue, coding a real AUTH_ERROR did wonders !
Now I'm left with the "OwnProperty" Error on Update on my Character entity...
New authProvider for reference in case somebody wants it:
import {AUTH_LOGIN, AUTH_LOGOUT, AUTH_ERROR, AUTH_CHECK} from 'react-admin';
export default (type, params) => {
// called when the user attempts to log in
if (type === AUTH_LOGIN) {
const {username, password} = params;
console.log(username, password);
const request = new Request (process.env.REACT_APP_API_URL + '/auth/login', {
method: 'POST',
body: JSON.stringify ({username, password}),
headers: new Headers ({'Content-Type': 'application/json'}),
});
return fetch (request)
.then (response => {
if (response.status < 200 || response.status >= 300) {
throw new Error (response.statusText);
}
return response.json ();
})
.then (({token}) => {
localStorage.setItem ('token', token);
return Promise.resolve ();
});
}
if (type === AUTH_LOGOUT) {
localStorage.removeItem ('username');
return Promise.resolve ();
}
// called when the API returns an error
if (type === AUTH_ERROR) {
const {status} = params;
if (status === 401 || status === 403) {
localStorage.removeItem ('username');
return Promise.reject ();
}
return Promise.resolve ();
}
// called when the user navigates to a new location
if (type === AUTH_CHECK) {
return localStorage.getItem ('token')
? Promise.resolve ()
: Promise.reject ();
}
return Promise.reject ('Unknown method');
};