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":"joe@doe.com",
"mobile":"",
"id":"11111"}]
Screenshot of Referencefield rendering