Creating a custom rest client admin-on-rest

Question

I'm not asking for help I just think you have something wrong with the custom json-server implementation. I'm using: "admin-on-rest": "^1.1.0"

This is my App.js:

...
import restClient from './restClient';

const App = () => (
  <Admin
    title="Glasses"
    dashboard={Dashboard}
    menu={Menu}
    restClient={restClient}
    authClient={authClient}
  >
    <Resource name="products" list={ProductList} />
  </Admin>
);

The restClient.js file is a copy of https://github.com/marmelab/admin-on-rest/blob/master/src/rest/jsonServer.js I just changed the import paths like this:

import {
  GET_LIST,
  GET_ONE,
  GET_MANY,
  GET_MANY_REFERENCE,
  CREATE,
  UPDATE,
  DELETE,
  fetchUtils
} from 'admin-on-rest';

const { queryParameters, fetchJson } = fetchUtils;
...

The rest of the restClient.js is one by one as in the git "jsonServer.js".

When I click on "products" in my menu, I got a notification: "REST response must contain a data key" and in the console: "Warning: Missing translation for key: "REST response must contain a data key"

Now of course it looks like the server doesn't return "data" object in the response BUT the problem is that there is no even request! when I go to my "networks" tab (in chrome console filter to All networks) I don't see any request to the API so how it is possible to receive this kind of error?

I added "console.log" to the first row of this code in the bottom of my restClient.js file (jsonServer.js):

return (type, resource, params) => {
    console.log('test'); // THIS WHAT I ADDED
    // json-server doesn't handle WHERE IN requests, so we fallback to calling GET_ONE n times instead
    if (type === GET_MANY) {
      return Promise.all(params.ids.map(id => httpClient(`${apiUrl}/${resource}/${id}`)))
        .then(responses => ({ data: responses.map(response => response.json) }));
    }
    const { url, options } = convertRESTRequestToHTTP(type, resource, params);
    return httpClient(url, options)
      .then(response => convertHTTPResponseToREST(response, type, resource, params));
  };

but the "test" is not been printed to the console.

Any advice? Did I do something wrong?

Video which can help: https://nimbus.everhelper.me/client/notes/share/982310/35f8rwpu6qohrftn8h1h The restClient.js file: http://pasted.co/2024e00f

Thank you in advanced.

Leo.

score 3 · Accepted Answer · answered Jun 26 '17 at 12:48

3

So my mistake was where I declared the restClient attribute inside the Admin component without URL.

This is the right way to do it:

const App = () => (
  <Admin
    title="Express Glasses"
    dashboard={Dashboard}
    menu={Menu}
    restClient={restClient('http://UrlToApi.com/api')}
    authClient={authClient}
  >
    <Resource name="products" list={ProductList} />
  </Admin>
);

answered Jun 26 '17 at 12:48

llioor

5,804
4
36
44

Hi @lioor, I believe I've followed the same steps as you to get this to work but I get an error "TypeError: __webpack_require__.i(...)(...).then is not a function". Did you get the same, and if so, how did you fix it? Thanks – cbarlow123 Jan 22 '18 at 16:39
@cbarlow123 sorry my friend, I didn't have this error. – llioor Jan 27 '18 at 20:49

Creating a custom rest client admin-on-rest

1 Answers1