prisma / awesome-links Goto Github PK
View Code? Open in Web Editor NEWUsers browse through a list of curated links and bookmark their favorite ones. Code for prisma.io course.
Users browse through a list of curated links and bookmark their favorite ones. Code for prisma.io course.
Hi, I just cloned the repo and made a fresh installation of node_modules; but Typescript throwing the following error at graphql/types/Links.ts
,
Property 'connectionField' does not exist on type 'ObjectDefinitionBlock<"Query">'
Any solution how to fix it other than downgrading packages? I didn't upgrade any version number form package.json, just a fresh "yarn install"
Hi, first and foremost "Thank you"
Thanks to your tutorial i have been able to start a personal project using :
All of which are new to me.
I'm a beginner in the database/ORM/GraphQL world
I have been stuck a bit on an issue lately
"How to use DateTime inside Nexus ?"
To explain a bit, following/adapting your tutorial i did this
// graphql/types/recipe.ts
export const Recipe = objectType({
name: 'Recipe',
definition(t) {
t.string('id')
t.string('name')
t.string('description')
t.string('url')
t.string('category')
t.string('createdAt') // Not the good Type (should be a "DateTime")
t.string('updatedAt') // Not the good Type (should be a "DateTime")
},
})
But i had seated "this" inside schema.prisma
// schema.prisma
model Recipe {
id String @id @unique
name String
description String
url String
category String
createdAt DateTime @default(now())
updatedAt DateTime @updatedAt
}
Finally i had a Typescript error on a query "resolver". I took a bit of time to found that error.
Copy past are evil
From my understanding , nexus doesn't support "DateTime" natively
In order to implement DateTime type you need to setup some complexe "mapping" inside the makeSchema method (could you point me on the documentation ?)
Or use nexus-prisma in order to make prisma and nexus communicate about the types.
Is there another way? I am missing something else ?
If you're close to the team developing nexus-prisma tell them i'm waiting for this plugin π
You're helping me becoming a better developer
I completed the first 4 blog posts and thought I was understanding everything but then I tried to make an extremely small modification and everything stopped working. I changed the Link object to another name in both Prisma + Nexus and did a prisma db push and confirmed the DB was updated. Now I see that Nexus updated my queries and all the names look right, but none of my queries work. They all say "GRAPHQL_VALIDATION_FAILED".
Any advice appreciated. Trying to read through the Nexus documentation and see if I'm misunderstanding something.
Hey @m-abdelwahab, love the first two blog posts for this! Are you still planning to write a post for part 3? I noticed the part-3
branch hasn't been updated in a couple of months.
Hi, I'm trying to follow along, and am stuck at the last step of the 2nd instalment.
I can see there is an instruction to update the resolver, but I can't see how or where to do that. The part 2 repo no longer has a resolvers file in the graphql folder. Where did that go?
I have an error message with the form of the index.tsx file, that says: Property 'links' does not exist on type 'unknown'. I don't seem to be defining links in that file. How did you do that?
Thank you?
In the tutorial series it says it uses cursor-based pagination:
https://www.prisma.io/blog/fullstack-nextjs-graphql-prisma-2-fwpc6ds155#pagination-at-the-database-level
However, the code says something different:
https://github.com/prisma/awesome-links/blob/main/graphql/types/Link.ts#L28
Doesn't seem to me that it uses cursor-based pagination π€
Hi, thanks for this great tutorial. Can't wait to see the upcoming release of part-3. However, there's a vulnerabilities issue for Next.js if the version is below 11.1.1. Is it convenient to update this project to the latest Next.js version? Thanks in advance!
link: GHSA-9gr3-7897-pp7m
reproduce: run npm install
My app works fine locally and is able to pull data through the data proxy, but when I deploy I get this error.
[31mERRοΏ½[0m ReferenceError: prisma is not defined
at resolve (/var/task/.next/server/pages/api/graphql.js:154:68)
at file:///var/task/node_modules/@pothos/plugin-prisma/esm/field-builder.js:72:37
at resolvePrismaCursorConnection (file:///var/task/node_modules/@pothos/plugin-prisma/esm/util/cursors.js:234:27)
at resolve (file:///var/task/node_modules/@pothos/plugin-prisma/esm/field-builder.js:54:51)
at executeField (file:///var/task/node_modules/@graphql-tools/executor/esm/execution/execute.js:294:24)
at executeFields (file:///var/task/node_modules/@graphql-tools/executor/esm/execution/execute.js:241:28)
at executeOperation (file:///var/task/node_modules/@graphql-tools/executor/esm/execution/execute.js:205:18)
at file:///var/task/node_modules/@graphql-tools/executor/esm/execution/execute.js:62:37
at new ValueOrPromise (/var/task/node_modules/value-or-promise/build/main/ValueOrPromise.js:14:21)
at executeImpl (file:///var/task/node_modules/@graphql-tools/executor/esm/execution/execute.js:62:12) {
path: [ 'links' ],
locations: [ { line: 2, column: 3 } ],
extensions: [Object: null prototype] {}
}
I have "vercel-build": "npx prisma generate --data-proxy && next build",
in the scripts in package.json. And I can see prisma is getting generated in the deployment logs on Vercel:
Running build in Cleveland, USA (East) β cle1
--
19:52:47.943 | Cloning github.com/chriscreber/awesome-links-done (Branch: main, Commit: 12a8d69)
19:52:48.254 | Cloning completed: 310.432ms
19:52:51.502 | Restored build cache
19:52:51.533 | Running "vercel build"
19:52:52.046 | Vercel CLI 29.3.6
19:52:52.305 | Installing dependencies...
19:52:52.592 | yarn install v1.22.17
19:52:52.622 | info No lockfile found.
19:52:52.627 | [1/4] Resolving packages...
19:52:57.424 | warning aws-sdk > [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
19:52:57.425 | warning aws-sdk > url > [email protected]: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
19:53:03.700 | [2/4] Fetching packages...
19:53:18.994 | [3/4] Linking dependencies...
19:53:18.997 | warning "graphql-yoga > @envelop/[email protected]" has incorrect peer dependency "@envelop/core@^3.0.6".
19:53:18.998 | warning "graphql-yoga > @envelop/[email protected]" has incorrect peer dependency "@envelop/core@^3.0.6".
19:53:18.998 | warning "react-hot-toast > [email protected]" has unmet peer dependency "csstype@^3.0.10".
19:53:31.896 | [4/4] Building fresh packages...
19:53:32.929 | success Saved lockfile.
19:53:32.932 | $ npx prisma generate --data-proxy
19:53:33.755 | Prisma schema loaded from prisma/schema.prisma
19:53:34.393 | Β
19:53:34.394 | β Generated Prisma Client (4.15.0 \| dataproxy) to ./node_modules/@prisma/client in 171ms
19:53:34.394 | Β
19:53:34.394 | β Generated Pothos integration to ./node_modules/@pothos/plugin-prisma/generated.ts in 18ms
19:53:34.394 | You can now start using Prisma Client in your code. Reference: https://pris.ly/d/client
19:53:34.394 | ```
19:53:34.394 | import { PrismaClient } from '@prisma/client'
19:53:34.395 | const prisma = new PrismaClient()
19:53:34.395 | ```
19:53:34.395 | Β
19:53:34.395 | To use Prisma Client in edge runtimes like Cloudflare Workers or Vercel Edge Functions, import it like this:
19:53:34.395 | ```
19:53:34.396 | import { PrismaClient } from '@prisma/client/edge'
19:53:34.396 | ```
19:53:34.396 | Β
19:53:34.397 | You will need a Prisma Data Proxy connection string. See documentation: https://pris.ly/d/data-proxy
19:53:34.397 | Β
19:53:34.457 | Done in 41.87s.
19:53:34.498 | Detected Next.js version: 13.4.4
19:53:34.499 | Running "yarn run build"
19:53:34.700 | yarn run v1.22.17
19:53:34.732 | $ next build
19:53:35.247 | - info Linting and checking validity of types...
19:53:45.170 | - info Creating an optimized production build...
19:53:54.943 | - info Compiled successfully
19:53:54.950 | - info Collecting page data...
19:53:55.485 | in prisma file
19:53:55.485 | production
19:53:55.485 | 1
19:53:55.485 | 2
19:53:55.490 | 3
19:53:55.490 | 4
19:54:07.122 | - info Generating static pages (0/5)
19:54:07.194 | - info Generating static pages (1/5)
19:54:07.206 | - info Generating static pages (2/5)
19:54:07.207 | in index file
19:54:07.207 | new changes
19:54:07.207 | production
19:54:07.208 | true
19:54:07.208 | user: undefined
19:54:07.209 | Β
19:54:07.216 | - info Generating static pages (3/5)
19:54:07.231 | - info Generating static pages (5/5)
19:54:07.428 | - info Finalizing page optimization...
19:54:07.431 | Β
19:54:07.443 | Route (pages) Size First Load JS
19:54:07.443 | β β / 3.84 kB 134 kB
19:54:07.443 | β /_app 0 B 122 kB
19:54:07.443 | β β /404 182 B 122 kB
19:54:07.443 | β β /about 270 B 122 kB
19:54:07.443 | β Ξ» /admin 13.8 kB 144 kB
19:54:07.443 | β Ξ» /api/auth/[...auth0] 0 B 122 kB
19:54:07.443 | β Ξ» /api/auth/hook 0 B 122 kB
19:54:07.443 | β Ξ» /api/graphql 0 B 122 kB
19:54:07.443 | β Ξ» /api/upload-image 0 B 122 kB
19:54:07.443 | β β /favorites 3.5 kB 133 kB
19:54:07.443 | β Ξ» /link/[id] 5.87 kB 136 kB
19:54:07.443 | + First Load JS shared by all 127 kB
19:54:07.443 | β chunks/framework-cda2f1305c3d9424.js 45.2 kB
19:54:07.444 | β chunks/main-6f0913649682f6ca.js 26.8 kB
19:54:07.445 | β chunks/pages/_app-080515f3b3b51fac.js 48.7 kB
19:54:07.445 | β chunks/webpack-87b3a303122f2f0d.js 995 B
19:54:07.445 | β css/eea48206b604b5a0.css 4.92 kB
19:54:07.445 | Β
19:54:07.445 | Ξ» (Server) server-side renders at runtime (uses getInitialProps or getServerSideProps)
19:54:07.445 | β (Static) automatically rendered as static HTML (uses no initial props)
19:54:07.445 | Β
19:54:08.129 | Done in 33.43s.
19:54:11.246 | Traced Next.js server files in: 3.080s
19:54:14.128 | Created all serverless functions in: 2.880s
19:54:14.134 | Collected static files (public/, static/, .next/static): 4.086ms
19:54:15.663 | Build Completed in /vercel/output [1m]
19:54:16.246 | Deploying outputs...
19:54:24.378 | Deployment completed
19:54:29.654 | Uploading build cache [115.83 MB]...
19:54:32.320 | Build cache uploaded: 2.666s
Please help.
When passing a Nexus-generated schema to ApolloServer like this:
const apolloServer = new ApolloServer({
schema,
resolvers,
context: createContext,
});
the editor starts screaming at me saying Type 'NexusGraphQLSchema' is missing the following properties from type 'GraphQLSchema': _queryType, _mutationType, _subscriptionType, _directives, and 3 more.
.
Here is my graphql.ts
file:
import { ApolloServer } from "apollo-server-micro";
import { schema } from "../../graphql/schema";
import { resolvers } from "../../graphql/resolvers";
import { createContext } from "../../graphql/context";
import Cors from "micro-cors";
const cors = Cors();
const apolloServer = new ApolloServer({
schema,
resolvers,
context: createContext,
});
const startServer = apolloServer.start();
const handler = async (req, res) => {
if (req.method === "OPTIONS") {
res.end();
return false;
}
await startServer;
await apolloServer.createHandler({
path: "/api/graphql",
})(req, res);
};
export default cors(handler);
export const config = {
api: {
bodyParser: false,
},
};
And my schema.ts
file:
import { makeSchema } from "nexus";
import { join } from "path";
import * as types from "./types";
export const schema = makeSchema({
types,
outputs: {
typegen: join(
process.cwd(),
"node_modules",
"@types",
"nexus-typegen",
"index.d.ts"
),
schema: join(process.cwd(), "graphql", "schema.graphql"),
},
contextType: {
export: "Context",
module: join(process.cwd(), "graphql", "context.ts"),
},
});
So far I haven't been able to solve the issue nor find any reference of it online, apart from a comment under your Building a GraphQL schema using Nexus, Prisma and Nextjs video mentioning the same error message.
Hi team,
I was following the tutorial and after part 3 (Adding authentication with Auth0). I am unable to query the Graphql with Apollo Studio anymore.
I believe it must because I am unable to pass token to query to Apollo Studio so it query it as anonymous user. Do you guys have any tip how to use Apollo Studio after part 3?
Thank you very much.
Best regards,
Hoang Phi
Full error:
- event compiled successfully in 118 ms (91 modules)
- error Error [TypeError]: Cannot read properties of undefined (reading 'Symbol(Pothos.contextCache)')
at file:///Users/bee/projects/biowerks/software/awesome-links/node_modules/@pothos/core/esm/utils/context-cache.js:10:33
at SchemaBuilder.prismaObject (file:///Users/bee/projects/biowerks/software/awesome-links/node_modules/@pothos/plugin-prisma/esm/schema-builder.js:18:22)
at eval (webpack-internal:///(api)/./graphql/types/Link.ts:8:47) {
digest: undefined
Node version: 16.15.1
Repro steps:
git checkout part-3
rm -Rf node_modules
rm -f package-lock.json
npm install
npx prisma generate
npm run dev
`
When the browser tries to fetch localhost:3000 the error above occurs.
Hi, the awesome-links example doesn't trigger autocomplete intellisense in the IDE when accesing the prisma client in ctx, but this other example does.
Why is that? How can I make the intellisense work with awesome-links. I can't tell why it is not working.
Importing the Context type from the context file and manually assigning it to the ctx variable helps intellense figure out the prisma object is in ctx, but it doesn't generate suggestions beyond that.
Hi...
Any reason why the new blog posts (parts 2 and 3) related to this course are not published? :(
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.