apollo-fullstack-react-postgres-ts template project error

Question

apollo-fullstack-react-postgres-ts template project error

andynicholson opened this issue 4 years ago · comments

Module:
Version:
Node.js / npm versions:
Example/snippet of the model that is causing issue

Straight out of the box, using 'apollo-fullstack-react-postgres-ts' project template, you can't create Notes using the example Create Note form, since datamodel.graphql uses "_id: ID!"

However according to 'isAutoPrimaryKey' an auto primary key can only be called "_id" if its GraphbackObjectID type, other it needs to be "id" if its "ID".

Modifying the schema to use "id: ID!" and regenerating fixes the issue.

For reference, upon the 'Add Note' button click, you get
'Unhandled Rejection (Error): Response not successful: Received status code 400'

and the stack trace in the Response, in Web Developer is
{
"stacktrace": [
"GraphQLError: Variable "$input" got invalid value { title: "fdujifdhiu", description: "985478975498745" }; Field "_id" of required type "ID!" was not provided.",
" at /home/andy/src/fas-app/node_modules/graphql/execution/values.js:116:15",
" at coerceInputValueImpl (/home/andy/src/fas-app/node_modules/graphql/utilities/coerceInputValue.js:100:11)",
" at coerceInputValueImpl (/home/andy/src/fas-app/node_modules/graphql/utilities/coerceInputValue.js:56:14)",
" at coerceInputValue (/home/andy/src/fas-app/node_modules/graphql/utilities/coerceInputValue.js:39:10)",
" at _loop (/home/andy/src/fas-app/node_modules/graphql/execution/values.js:109:69)",
" at coerceVariableValues (/home/andy/src/fas-app/node_modules/graphql/execution/values.js:121:16)",
" at getVariableValues (/home/andy/src/fas-app/node_modules/graphql/execution/values.js:50:19)",
" at buildExecutionContext (/home/andy/src/fas-app/node_modules/graphql/execution/execute.js:206:61)",
" at executeImpl (/home/andy/src/fas-app/node_modules/graphql/execution/execute.js:104:20)",
" at Object.execute (/home/andy/src/fas-app/node_modules/graphql/execution/execute.js:63:35)"
]
}

Install log was:::

andy@andy-ThinkPad-X1-Carbon-4th:~/src$ npx create-graphback fas-app
npx: installed 134 in 6.341s

/ | _ __ __ _ _ __ | | | |_ __ _ ___ | | __
| | _ | '| / | | '_ \ | '_ \ | '_ \ / _ | / __| | |/ /
| || | | | | (| | | |) | | | | | | |) | | (| | | ( | <
_| || _,| | ./ || || |_./ _,| ___| ||_
||
create-graphback can create your app from following templates:

apollo-fullstack-react-postgres-ts:
Apollo GraphQL Server connecting to Postgres database and React client using TypeScript

apollo-fullstack-react-mongo-ts:
Apollo GraphQL Server connecting to Mongo database and React client using TypeScript

apollo-mongo-server-ts:
Apollo GraphQL Server connecting to Mongo database using TypeScript

apollo-mongo-datasync-server-ts:
Apollo GraphQL Server connecting to Mongo database using TypeScript. Contains Data Synchronization features.

apollo-postgres-server-ts:
Apollo GraphQL Server connecting to Postgres database using TypeScript

[PREVIEW] apollo-mongo-apache-kafka-server-ts:
Apollo GraphQL server connecting to MongoDB database with Apache Kafka for subscriptions. This is a preview template - we are continuing to enhance it - we welcome your feedback.

? Choose a template to bootstrap apollo-fullstack-react-postgres-ts

Bootstraping graphql server 💫 ✨
✔ Downloading starter from https://api.github.com/repos/aerogear/graphback/tarball/templates-1.0.0
✔ Extracting content to /home/andy/src/fas-app/client
✔ Downloading starter from https://api.github.com/repos/aerogear/graphback/tarball/templates-1.0.0
✔ Extracting content to /home/andy/src/fas-app/

GraphQL server successfully bootstrapped 🚀

Next Steps:

Change directory into project folder - cd fas-app
Follow template README.md to start server

Wojciech Trocki · Answer 1 · Mon Jan 04 2021 16:39:26 GMT+0800 (China Standard Time)

I though I left comment here. Issue is that we use single client app for mongo and postgress. For mongo we use more specialized scalar for data and it looks like package bump introduced some coupling. Fix is needed

Arsh Sharma · Answer 2 · Mon Jan 04 2021 20:41:06 GMT+0800 (China Standard Time)

Modifying the schema to use "id: ID!" and regenerating fixes the issue.

Do you mean the datamodel? Cause I changed _id to id in the datamodel and starting the server after running yarn generate gave me this error:

npm run develop

> graphback-templates-runtime-postgres@1.1.0 develop /home/arsh/PracticeProjects/postgres-test/postgres-test-2
> ts-node src/index.ts

🚀  Server ready at http://localhost:4000/graphql
(node:44594) UnhandledPromiseRejectionWarning: error: ALTER TABLE "public"."note" DROP CONSTRAINT "note_pkey" - cannot drop constraint note_pkey on table note because other objects depend on it
    at Parser.parseErrorMessage (/home/arsh/PracticeProjects/postgres-test/postgres-test-2/node_modules/pg-protocol/src/parser.ts:357:11)
    at Parser.handlePacket (/home/arsh/PracticeProjects/postgres-test/postgres-test-2/node_modules/pg-protocol/src/parser.ts:186:21)
    at Parser.parse (/home/arsh/PracticeProjects/postgres-test/postgres-test-2/node_modules/pg-protocol/src/parser.ts:101:30)
    at Socket.<anonymous> (/home/arsh/PracticeProjects/postgres-test/postgres-test-2/node_modules/pg-protocol/src/index.ts:7:48)
    at Socket.emit (events.js:314:20)
    at Socket.EventEmitter.emit (domain.js:483:12)
    at addChunk (_stream_readable.js:297:12)
    at readableAddChunk (_stream_readable.js:272:9)
    at Socket.Readable.push (_stream_readable.js:213:10)
    at TCP.onStreamRead (internal/stream_base_commons.js:188:23)
(node:44594) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 2)
(node:44594) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:44594) UnhandledPromiseRejectionWarning: error: alter table "public"."comment" drop constraint "comment_noteid_foreign" - current transaction is aborted, commands ignored until end of transaction block
    at Parser.parseErrorMessage (/home/arsh/PracticeProjects/postgres-test/postgres-test-2/node_modules/pg-protocol/src/parser.ts:357:11)
    at Parser.handlePacket (/home/arsh/PracticeProjects/postgres-test/postgres-test-2/node_modules/pg-protocol/src/parser.ts:186:21)
    at Parser.parse (/home/arsh/PracticeProjects/postgres-test/postgres-test-2/node_modules/pg-protocol/src/parser.ts:101:30)
    at Socket.<anonymous> (/home/arsh/PracticeProjects/postgres-test/postgres-test-2/node_modules/pg-protocol/src/index.ts:7:48)
    at Socket.emit (events.js:314:20)
    at Socket.EventEmitter.emit (domain.js:483:12)
    at addChunk (_stream_readable.js:297:12)
    at readableAddChunk (_stream_readable.js:272:9)
    at Socket.Readable.push (_stream_readable.js:213:10)
    at TCP.onStreamRead (internal/stream_base_commons.js:188:23)
(node:44594) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 4)
^C

This means simply changing _id to id in the datamodel for the postgres template would not work. Also creating notes works when done using graphql playground so I guess something needs to be changed in the client template right @wtrocki?

Wojciech Trocki · Answer 3 · Mon Jan 04 2021 20:59:34 GMT+0800 (China Standard Time)

@RinkiyaKeDad problem is related to the UI/client application - server will work fine.

Client app uses schema and generates queries. Etc.

Andy Nicholson · Answer 4 · Tue Jan 05 2021 13:16:33 GMT+0800 (China Standard Time)

@RinkiyaKeDad , yes you need to make some minor fixes in the client. Changing from _id to id.
client/src/components/notes/
client/src/components/comments/
etc
The console will tell you.

You also should not rely on trying to get auto-migration working with the primary key changing. Blow the db away and start again. Much easier.

I could upload my changes @wtrocki ? Should i issue a pull ?

Wojciech Trocki · Answer 5 · Tue Jan 05 2021 13:42:16 GMT+0800 (China Standard Time)

I got little bit confused so I would really appreciate PullRequest

Arsh Sharma · Answer 6 · Fri Jan 22 2021 20:15:17 GMT+0800 (China Standard Time)

@RinkiyaKeDad problem is related to the UI/client application - server will work fine.

So should I replace _id with id in the client template? But that would make it stop working with MongoDB no?

Wojciech Trocki · Answer 7 · Fri Jan 22 2021 20:29:16 GMT+0800 (China Standard Time)

The same client is used in mongodb and postgress backend. Thus _id is needed.
This might be confusing for postgres devs who use id but that is just example app limitation - developers can use any schema they want. We still wanted to keep some client APP but I would also think if there is value in maintaining this considering it put some requirements to keep the same schema and it will break if schema is changed even slightly.

CC @craicoverflow WDYT?

Arsh Sharma · Answer 8 · Fri Jan 22 2021 21:30:47 GMT+0800 (China Standard Time)

What about having two separate client templates based on the database? We would just need to replace _id in one and then none should break regardless of schema changes.

Enda · Answer 9 · Fri Jan 22 2021 21:39:38 GMT+0800 (China Standard Time)

My thought was also to have 2 separate clients. The problem with that is it multiples the maintenance burden. Both clients will be exactly the same except for the ID, so both will need to be kept in sync manually.

Arsh Sharma · Answer 10 · Mon Jan 25 2021 16:46:45 GMT+0800 (China Standard Time)

How about using the same client but replacing instances of _id with an environment variable and we'll provide a different .env file for mongodb and postgres? That way we won't have to maintain two clients.

Enda · Answer 11 · Mon Jan 25 2021 17:20:20 GMT+0800 (China Standard Time)

How about using the same client but replacing instances of _id with an environment variable and we'll provide a different .env file for mongodb and postgres? That way we won't have to maintain two clients.

This won't work as environment variables cannot be used inside a GraphQL schema file.

What could work for this is adding a @autoIncrements annotation to Graphback which is a way to explicitly say this field should be an auto-incrementing field.

Although I feel that this is us treating a symptom of the design instead of a solution.

Have a think about other ideas and feel free to share them here so we can discuss @RinkiyaKeDad :)

Arsh Sharma · Answer 12 · Sun Jan 31 2021 16:53:13 GMT+0800 (China Standard Time)

After discussion on discord we've decided to have the client app working with postgres only (and not mongo) since we will still have client-side queries for testing. Will be raising a PR for the same.