stephane-klein / react-admin-and-postgraphile-playground Goto Github PK

Thank you for the demo app!
Have you had any success adding reference fields?
https://marmelab.com/react-admin/Fields.html#reference-fields

Doesn't work for me for some reason.

The project builds fine but I noticed the following when loading the RA dashboard at port 3000:

I intend to use my own database but I'm not sure if the issue comes from the example database or from something in this extension.

I look for how to enable identification with React-Admin and BowlingX/ra-postgraphile.

I'm working in add-security-support branch.

In add-security-support branch, I have enabled ApolloClient.connectToDevTools=true option

But when I open "Apollo Client Developer Tools" tab in my browesr, I have this error message: « We couldn't detect Apollo Client in your app! ».

I didn't know if this is Postgraphile or ApolloClient configuration mistake 🤔

I am wondering if these warnings are specific to my environment. I made sure I used the correct version of nodejs for the project.
I am attempt to fix it in my fork. It does build I prefer to fix warnings when possible.

npm install
npm WARN [email protected] requires a peer of immutable@^3.8.1 || ^4.0.0-rc.1 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of seamless-immutable@^7.1.3 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of ra-data-graphql@^2|^3 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of react-admin@^2|^3 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of react@^16.13.1 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of typescript@^3.2.1 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of node-sass@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of sass@^1.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of fibers@>= 3.1.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of typescript@>=3.7.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/jest-haste-map/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/watchpack-chokidar2/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/webpack-dev-server/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

I am getting apollo Unhandled Rejection (Error): Network error: NetworkError when attempting to fetch resource. It may be related to the following depreciation warning:
npm WARN depreciated [email protected]: for the best quick start with Apollo Client, please use apollow-boost instead

The following comes up in my browser:

Unhandled Rejection (Error): Network error: NetworkError when attempting to fetch resource.
ApolloError
src/errors/ApolloError.ts:46

  43 | // Constructs an instance of ApolloError given a GraphQLError
  44 | // or a network error. Note that one of these has to be a valid
  45 | // value or the constructed error will be meaningless.
> 46 | constructor({
     | ^  47 |   graphQLErrors,
  48 |   networkError,
  49 |   errorMessage,

./node_modules/apollo-client/bundle.esm.js/QueryManager</QueryManager.prototype.queryListenerForObserver/<
src/core/QueryManager.ts:576

  573 | // If we have either a GraphQL error or a network error, we create
  574 | // an error and tell the observer about it.
  575 | if (errorPolicy === 'none' && hasGraphQLErrors || queryStoreValue.networkError) {
> 576 |   return invoke('error', new ApolloError({
      | ^  577 |     graphQLErrors: queryStoreValue.graphQLErrors,
  578 |     networkError: queryStoreValue.networkError,
  579 |   }));

./node_modules/apollo-client/bundle.esm.js/QueryManager</QueryManager.prototype.broadcastQueries/</<
src/core/QueryManager.ts:1091

  1088 |     // it's possible for the listener to be undefined if the query is being stopped
  1089 |     // See here for more detail: https://github.com/apollostack/apollo-client/issues/231
  1090 |     if (listener) {
> 1091 |       listener(this.queryStore.get(id), info.newData);
       | ^  1092 |     }
  1093 |   });
  1094 | }

./node_modules/apollo-client/bundle.esm.js/QueryManager</QueryManager.prototype.broadcastQueries/<
src/core/QueryManager.ts:1087

  1084 | this.onBroadcast();
  1085 | this.queries.forEach((info, id) => {
  1086 |   if (info.invalidated) {
> 1087 |     info.listeners.forEach(listener => {
       | ^  1088 |       // it's possible for the listener to be undefined if the query is being stopped
  1089 |       // See here for more detail: https://github.com/apollostack/apollo-client/issues/231
  1090 |       if (listener) {

./node_modules/apollo-client/bundle.esm.js/QueryManager</QueryManager.prototype.broadcastQueries
src/core/QueryManager.ts:1085

  1082 | 
  1083 | public broadcastQueries() {
  1084 |   this.onBroadcast();
> 1085 |   this.queries.forEach((info, id) => {
       | ^  1086 |     if (info.invalidated) {
  1087 |       info.listeners.forEach(listener => {
  1088 |         // it's possible for the listener to be undefined if the query is being stopped

./node_modules/apollo-client/bundle.esm.js/QueryManager</QueryManager.prototype.fetchQuery/</</networkResult<
src/core/QueryManager.ts:434

  431 |     this.queryStore.markQueryError(queryId, error, fetchMoreForQueryId);
  432 |     this.invalidate(queryId);
  433 |     this.invalidate(fetchMoreForQueryId);
> 434 |     this.broadcastQueries();
      | ^  435 |   }
  436 |   throw new ApolloError({ networkError: error });
  437 | }

This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.  Click the 'X' or hit ESC to dismiss this message.