End to End React with Prisma 2

Start at the beginning and work your way through this project. The code for each step as well as the finished project can be found in the Github repository.

6. Add Feed queries and mutations

Objective: Create all of the feed queries and the create mutation.

utils/api/typeDefs.ts

ts

import { gql } from 'apollo-server-micro'
export const typeDefs = gql`
  type Feed {
    id: String
    name: String
    url: String
  }
  input FeedCreateInput {
    id: String
    url: String
    name: String
  }
  type Query {
    hello: String
  }
  type Mutation {
    createFeed(data: FeedCreateInput): Feed
  }
`

utils/api/resolvers.ts

ts

export const resolvers = {
  Query: {
    hello: (parent, args, context) => `hi!`,
  },
  Mutation: {
    createFeed: async (parent, { data }, { prisma, user }) => {
      const result = await prisma.feed.create({ data: { ...data } })
      return result
    },
  },
}

Mutation:

graphql

mutation createFeedMutation($data: FeedCreateInput) {
  createFeed(data: $data) {
    ...FeedFragment
  }
}
fragment FeedFragment on Feed {
  id
  name
  url
}

Mutation Variables:

json

{
  "data": {
    "name": "NY Times",
    "url": "https://rss.nytimes.com/services/xml/rss/nyt/World.xml",
    "id": "1"
  }
}

Now let's add the feed and feeds query. Add them first to the resolvers and then to the typeDefs:

utils/api/typeDefs.ts

ts

import { gql } from 'apollo-server-micro'
export const typeDefs = gql`
  type Feed {
    id: String
    name: String
    url: String
  }
  input FeedInput {
    id: String
  }
  input FeedCreateInput {
    id: String
    url: String
    name: String
  }
  type Query {
    hello: String
    feed(data: FeedInput): Feed
    feeds: [Feed]
  }
  type Mutation {
    createFeed(data: FeedCreateInput): Feed
  }
`

utils/api/resolvers.ts

ts

export const resolvers = {
  Query: {
    hello: (parent, args, context) => `hi!`,
    feed: (parent, { data: { id } }, { prisma }) =>
      prisma.feed.findOne({ where: { id } }),
    feeds: (parent, args, { prisma }) => prisma.feed.findMany(),
  },
  Mutation: {
    createFeed: async (parent, { data }, { prisma, user }) => {
      const result = await prisma.feed.create({ data: { ...data } })
      return result
    },
  },
}

Query I

graphql

{
  feeds {
    id
    url
  }
}

Query II

graphql

query feedQuery($data: FeedInput) {
  feed(data: $data) {
    ...FeedFragment
  }
}
fragment FeedFragment on Feed {
  id
  name
  url
}

Query II Variables

json

{
  "data": { "id": "1" }
}