Skip to content

Instantly share code, notes, and snippets.

@praveenweb
Created February 11, 2019 07:55
Show Gist options
  • Save praveenweb/c2ee8f84bbcc23766dcd82884e08a9d9 to your computer and use it in GitHub Desktop.
Save praveenweb/c2ee8f84bbcc23766dcd82884e08a9d9 to your computer and use it in GitHub Desktop.
react-static routing with GraphQL data fetch
import client from './src/apollo'
import {GET_AUTHOR, GET_ARTICLE} from './src/graphql/queries'
export default {
getSiteData: () => ({
title: 'React Static with Hasura GraphQL',
}),
getRoutes: async () => {
const {
data: { author },
} = await client.query({
query: GET_AUTHOR,
})
return [
{
path: '/blog',
getData: () => ({author}),
children: author.map(item => ({
path: `/${item.id.toString()}`,
component: 'src/containers/Post',
getData: (resolvedRoute) => {
const path = resolvedRoute.route.path
const author_id = path.split("/")[1]
return client.query({
query: GET_ARTICLE,
variables: {author: author_id}
}).then( (resp) => {
const articles = resp.data.article;
if(articles) { // return if there are articles
return {articles}
}
return {articles: []} // return empty if there are no articles
})
},
})),
},
]
},
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment