rsnext/examples/cms-graphcms/lib/graphcms.js
Jesse d3704a66f8
added graphcms (#14026)
* added graphcms

* Updated readme and environment variables

* Removed gitignore

* Updated tailwind config

* Some fixes in pages

* Updated api endpoints

* lint fix

* Updated readme

* Updated og image

* Updated cms examples to include this one

* Added example to docs

* Added preview demo link

* Updated step

Co-authored-by: Luis Alvarez <luis@vercel.com>
2020-06-15 12:03:34 -05:00

150 lines
3.1 KiB
JavaScript

async function fetchAPI(query, { variables, preview } = {}) {
const res = await fetch(process.env.GRAPHCMS_PROJECT_API, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
Authorization: `Bearer ${
preview
? process.env.GRAPHCMS_DEV_AUTH_TOKEN
: process.env.GRAPHCMS_PROD_AUTH_TOKEN
}`,
},
body: JSON.stringify({
query,
variables,
}),
})
const json = await res.json()
if (json.errors) {
console.log(process.env.NEXT_EXAMPLE_CMS_GCMS_PROJECT_ID)
console.error(json.errors)
throw new Error('Failed to fetch API')
}
return json.data
}
export async function getPreviewPostBySlug(slug) {
const data = await fetchAPI(
`
query PostBySlug($slug: String!, $stage: Stage!) {
post(where: {slug: $slug}, stage: $stage) {
slug
}
}`,
{
preview: true,
variables: {
stage: 'DRAFT',
slug,
},
}
)
return data.post
}
export async function getAllPostsWithSlug() {
const data = await fetchAPI(`
{
posts {
slug
}
}
`)
return data.posts
}
export async function getAllPostsForHome(preview) {
const data = await fetchAPI(
`
{
posts(orderBy: date_DESC, first: 20) {
title
slug
excerpt
date
coverImage {
url(transformation: {
image: {
resize: {
fit:crop,
width:2000,
height:1000
}
}
})
}
author {
name
picture {
url(transformation: {
image: {
resize: {
width:100,
height:100,
fit:crop
}
}
})
}
}
}
}
`,
{ preview }
)
return data.posts
}
export async function getPostAndMorePosts(slug, preview) {
const data = await fetchAPI(
`
query PostBySlug($slug: String!, $stage: Stage!) {
post(stage: $stage, where: {slug: $slug}) {
title
slug
content {
html
}
date
ogImage: coverImage {
url(transformation: {image: {resize: {fit: crop, width: 2000, height: 1000}}})
}
coverImage {
url(transformation: {image: {resize: {fit: crop, width: 2000, height: 1000}}})
}
author {
name
picture {
url(transformation: {image: {resize: {fit: crop, width: 100, height: 100}}})
}
}
}
morePosts: posts(orderBy: date_DESC, first: 2, where: {slug_not_in: [$slug]}) {
title
slug
excerpt
date
coverImage {
url(transformation: {image: {resize: {fit: crop, width: 2000, height: 1000}}})
}
author {
name
picture {
url(transformation: {image: {resize: {fit: crop, width: 100, height: 100}}})
}
}
}
}
`,
{
preview,
variables: {
stage: preview ? 'DRAFT' : 'PUBLISHED',
slug,
},
}
)
return data
}