react-admin: Rest-admin won't redirect to /login page when {(permissions) => {}} is passed as a child of instead of list of

I expect my react-admin app to show me the login page when I’m not logged in yet. And when I have a function as the <Admin /> only child.

In fact I stuck with the Loading page saying “The page is loading, just a moment please.”.

I tried to reproduce it on a clean install taken from the Tutorial and got the same result.

// in src/App.js
import React from 'react';
import { Admin, Resource } from 'react-admin';
import jsonServerProvider from 'ra-data-json-server';
import authProvider from './authProvider';

import { PostList } from './posts';
import Dashboard from './Dashboard';

const App = () => (
    <Admin
      dataProvider={jsonServerProvider('http://jsonplaceholder.typicode.com')}
      dashboard={Dashboard}
      authProvider={authProvider}
    >{(auth)=>
        <Resource name="posts" list={PostList} />
     }
    </Admin>
);

export default App;

Auth provider here is also a provider taken from the tutorial.

Environment

Admin-on-rest version: react-admin: ^2.0.0-beta2
React version: 16.2.0
Browser: Chrome 64.0.3282.186

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 5
Comments: 23 (17 by maintainers)

Commits related to this issue

Log the user out if AUTH_GET_PERMISSIONS throws Fixes #1605 — committed to marmelab/react-admin by fzaninotto 6 years ago

Most upvoted comments

No, the doc is correct, but the react-admin code should behave differently when the authProvider throws. It should log the user out. I’ll open a PR for that.

fzaninotto on Mar 14, 2018

I’ve encountered this behavior when filtered all resources to the empty array, i.e. these code snippets could probably result in the same way

// in src/App.js
import React from 'react';
import { Admin, Resource } from 'react-admin';
import jsonServerProvider from 'ra-data-json-server';
import authProvider from './authProvider';

import { PostList } from './posts';
import Dashboard from './Dashboard';

const App = () => (
    <Admin
      dataProvider={jsonServerProvider('http://jsonplaceholder.typicode.com')}
      dashboard={Dashboard}
      authProvider={authProvider}
    >
     {(auth)=>[]}
    </Admin>
);

export default App;

// in src/App.js
import React from 'react';
import { Admin, Resource } from 'react-admin';
import jsonServerProvider from 'ra-data-json-server';
import authProvider from './authProvider';

import { PostList } from './posts';
import Dashboard from './Dashboard';

const App = () => (
    <Admin
      dataProvider={jsonServerProvider('http://jsonplaceholder.typicode.com')}
      dashboard={Dashboard}
      authProvider={authProvider}
    >
     {[]}
    </Admin>
);

export default App;

102 on Mar 5, 2018