Admin-on-Rest ReferenceField not rendering properl

Question

I don't get ReferenceField to work properly as it only shows the progress bar "spinning" for the 'firstName' field.

I can successfully use the examples with data from https://jsonplaceholder.typicode.com/ to work with the simpleRest client but not with my own API end points. I see the GET_LIST request - response and then the related GET_MANY response with the Owner data but the reference field labeled 'User' doesn't render.

One of the differences in structure of API endpoints is that the reference returned in my API is fully qualified following this structure "resource:io.mydomain.#"

But since the second API call is fired off and data returned it seems that this doesn't matter. At this point I need some pointers to where to go next...

//App.js
const App = () => (
  <Admin dashboard={Dashboard} theme={getMuiTheme(darkBaseTheme)} title="Admin" authClient={authClient} restClient={restClient}>
      <Resource name="Asset" list={AssetList} label="Assets" />
      <Resource name="Owner" list={UserList}  label="Users"  />
      <Resource name="AssetTitle" list={AssetTitleList}  label="Ownership" />
 </Admin>

//users.js
 export const UserList = (props) => (
     <List title="All Users" {...props}>
         <Datagrid>
             <TextField source="id" />
             <TextField source="firstName" />
             <TextField source="lastName" />
             <TextField source="mobile" />
             <EmailField source="email" />
               <EditButton />
         </Datagrid>
     </List>
 );

 //titles.js
 export const AssetTitleList = (props) => (
     <List title="All Titles..." {...props}>
         <Datagrid>
           <TextField source="id" />
           <ReferenceField label="User" source="owner" reference="Owner" >
                          <TextField source="firstName" />
           </ReferenceField>
           <TextField source="information" />
         </Datagrid>
     </List>
 );

//AssetTitle API returns
[{"$class":"io.mydomain.AssetTitle",
"id":"12345",
"owner":"resource:io.mydomain.Owner#11111",
"asset":"resource:io.mydomain.Asset#991",
"information":""}]

//Owner API returns
[{"$class":"io.mydomain.Owner",
"firstName":"Joe",
"lastName":"Doe",
"email":"[e-mail]",
"mobile":"",
"id":"11111"}]

Screenshot of Referencefield rendering

Answer 1

You might have to clean the data returned from your API in your restClient.

I see that the owner field for the title resource is resource:io.mydomain.Owner#11111. However, the id field of the owner resource is 11111.

You'll have to implement your own restClient and "clean" all known ids such as the owner field so that they only contains the id. See the documentation about implementing your own rest client.