Search code examples
reactjsadmin-on-rest

Not able to integrate Admin on rest with my rest api

I have created a rest api in express which returns the customers. And I am trying to use Admin on rest to show them in on admin panel.

I am not able to display all the customers but only last customer is getting displayed. I am not sure what is the problem.

Below is my App code.

import React, { Component } from 'react';
import { jsonServerRestClient, Admin, Resource } from 'admin-on-rest';


import  {UserList}  from './users';


class App extends Component {

  render() {
    console.log({UserList});
    return (
      <Admin restClient={jsonServerRestClient('http://localhost:8080/api')}>
        <Resource name="customer" list={UserList} /> 
      </Admin>
    );
  }
}

export default App;[enter image description here][1]

below is the users.js 

import React from 'react';
import { List, Datagrid, EmailField, TextField } from 'admin-on-rest';

export const UserList = (props) => (
    <List title="All users" {...props}>      
        <Datagrid>            
            <TextField source="name" />           
            <EmailField source="emailId" />
        </Datagrid>
    </List>
);

But whenever I am integrating the List is showing only the last customer details . Also there is a warning in the console saying

Warning: Each child in an array or iterator should have a unique "key" prop.

Check the render method of `DatagridBody`. 
    in TableRow (created by DatagridBody)
    in DatagridBody (created by shouldUpdate(DatagridBody))
    in shouldUpdate(DatagridBody) (created by Datagrid)
    in table (created by Table)
    in div (created by Table)
    in div (created by Table)
    in Table (created by Datagrid)
    in Datagrid (created by MuiComponent)
    in MuiComponent (at users.js:6)
    in div (created by List)
    in div (created by Card)
    in div (created by Paper)
    in Paper (created by Card)
    in Card (created by List)
    in div (created by List)
    in List (created by WithPermissionsFilteredChildren)
    in WithPermissionsFilteredChildren (created by getContext(WithPermissionsFilteredChildren))
    in getContext(WithPermissionsFilteredChildren) (created by TranslatedComponent(getContext(WithPermissionsFilteredChildren)))
    in TranslatedComponent(getContext(WithPermissionsFilteredChildren)) (created by Connect(TranslatedComponent(getContext(WithPermissionsFilteredChildren))))
    in Connect(TranslatedComponent(getContext(WithPermissionsFilteredChildren))) (at users.js:5)

Please help me .. I tried all the options i could .. but luck. I have attached the screen shots of the app enter image description here

Solution

  • That may be because you're using _id when admin-on-rest expect an id.

    This is documented: https://marmelab.com/admin-on-rest/FAQ.html#can-i-have-custom-identifiersprimary-keys-for-my-resources