previews working and correct repo name for theme command

gatsby-browser.js

@@ -1,6 +1,8 @@
 import * as React from 'react'
 import { PreviewStoreProvider } from 'gatsby-source-prismic'
 
-export const wrapRootElement = ({ element }) => (
+const wrapRootElement = ({ element }) => (
   <PreviewStoreProvider>{element}</PreviewStoreProvider>
-)
+)
+
+export default wrapRootElement

gatsby-config.js

@@ -21,7 +21,7 @@ const gastbySourcePrismicConfig = {
     accessToken: apiKey,
     releaseID: prismicReleaseID,
     prismicToolbar: true,
-    linkResolver: () => (doc) => linkResolver(doc),
+    linkResolver: () => linkResolver,
     schemas: {
       author: authorSchema,
       blog_home: blogHomeSchema,

gatsby-ssr.js

@@ -1,6 +1,8 @@
 import * as React from 'react'
 import { PreviewStoreProvider } from 'gatsby-source-prismic'
 
-export const wrapRootElement = ({ element }) => (
+const wrapRootElement = ({ element }) => (
   <PreviewStoreProvider>{element}</PreviewStoreProvider>
-)
+)
+
+export default wrapRootElement

prismic-configuration.js

@@ -1,6 +1,6 @@
 module.exports = {
   // The repo name for your Prismic repository (found in the url of your repo: https://your-repo-name.prismic.io/)
-  prismicRepo: 'prismic-gatsby-coffee-p',
+  prismicRepo: 'your-repo-name',
 
   // Release ID to build (requires access)
   releaseID: '',

src/pages/blog.js

@@ -1,20 +1,17 @@
 import React from 'react'
 import { Link, graphql } from 'gatsby'
 import { Helmet } from 'react-helmet'
-import usePreviewData from '../utils/usePreviewData'
-import Layout from '../components/layouts/index'
 import { withPreview } from 'gatsby-source-prismic'
+import Layout from '../components/layouts/index'
 
 export const BlogTemplate = ({ data }) => {
   if (!data) return null
-  const liveData = usePreviewData(data)
-
-  const pageContent = liveData.allPrismicBlogPost
+  const pageContent = data.allPrismicBlogPost
   const page = pageContent.edges || {}
 
-  const BlogHomeTitle = liveData.allPrismicBlogHome.edges[0].node.data.meta_title.text
+  const BlogHomeTitle = data.allPrismicBlogHome.edges[0].node.data.meta_title.text
 
-  const pageLayout = liveData.prismicLayout.data
+  const pageLayout = data.prismicLayout.data
 
   return (
     <Layout layoutData={pageLayout}>

src/pages/index.js

@@ -1,21 +1,19 @@
 import React from 'react'
 import { RichText } from 'prismic-reactjs'
 import { graphql } from 'gatsby'
-import usePreviewData from '../utils/usePreviewData'
+import { withPreview } from 'gatsby-source-prismic'
 import {
   CTABanner, FeaturedItems, NumberedItems, Separator, TextBlock,
 } from '../components/slices'
 import Layout from '../components/layouts/index'
-import { withPreview } from 'gatsby-source-prismic'
 
 export const HomeTemplate = ({ data }) => {
   if (!data) return null
-  const liveData = usePreviewData(data)
 
-  const pageContent = liveData.allPrismicHomepage
+  const pageContent = data.allPrismicHomepage
   const page = pageContent.edges[0].node || {}
 
-  const pageLayout = liveData.prismicLayout.data
+  const pageLayout = data.prismicLayout.data
   return (
     <Layout layoutData={pageLayout}>
       <RenderBody home={page} />

src/pages/preview.js

@@ -1,11 +1,10 @@
 import * as React from 'react'
 import { withPreviewResolver } from 'gatsby-source-prismic'
+import linkResolver from '../utils/linkResolver'
+import { prismicRepo } from '../../prismic-configuration'
 
-import { linkResolver } from '../utils/linkResolver'
-
-const PreviewPage = ({ isPreview, isLoading }) => {
+const PreviewPage = ({ isPreview }) => {
   if (isPreview === false) return 'Not a preview!'
-
   return (
     <div>
       <p>Loading</p>
@@ -14,6 +13,6 @@ const PreviewPage = ({ isPreview, isLoading }) => {
 }
 
 export default withPreviewResolver(PreviewPage, {
-  repositoryName: 'prismic-gatsby-coffee-p',
-  linkResolver,
-})
+  repositoryName: prismicRepo,
+  linkResolver: () => linkResolver,
+})

src/pages/products.js

@@ -2,20 +2,18 @@ import React from 'react'
 import { Link, graphql } from 'gatsby'
 import { RichText } from 'prismic-reactjs'
 import { Helmet } from 'react-helmet'
-import usePreviewData from '../utils/usePreviewData'
-import Layout from '../components/layouts/index'
 import { withPreview } from 'gatsby-source-prismic'
+import Layout from '../components/layouts/index'
 
 export const ProductsTemplate = ({ data }) => {
   if (!data) return null
-  const liveData = usePreviewData(data)
 
-  const pageTitle = liveData.allPrismicProducts.nodes[0].data.title.raw
+  const pageTitle = data.allPrismicProducts.nodes[0].data.title.raw
 
-  const pageContent = liveData.allPrismicProduct
+  const pageContent = data.allPrismicProduct
   const page = pageContent.edges || {}
 
-  const pageLayout = liveData.prismicLayout.data
+  const pageLayout = data.prismicLayout.data
   return (
     <Layout layoutData={pageLayout}>
       <Helmet>

src/templates/blogPost.js

@@ -2,18 +2,16 @@ import React from 'react'
 import { RichText } from 'prismic-reactjs'
 import { Helmet } from 'react-helmet'
 import { graphql } from 'gatsby'
-import usePreviewData from '../utils/usePreviewData'
-import Layout from '../components/layouts/index'
 import { withPreview } from 'gatsby-source-prismic'
+import Layout from '../components/layouts/index'
 
 export const BlogPostTemplate = ({ data }) => {
   if (!data) return null
-  const liveData = usePreviewData(data)
 
-  const pageContent = liveData.prismicBlogPost
+  const pageContent = data.prismicBlogPost
   const page = pageContent.data || {}
 
-  const pageLayout = liveData.prismicLayout.data
+  const pageLayout = data.prismicLayout.data
 
   return (
     <Layout layoutData={pageLayout}>

src/templates/ourProduct.js

@@ -2,17 +2,16 @@ import React from 'react'
 import { RichText } from 'prismic-reactjs'
 import { Helmet } from 'react-helmet'
 import { graphql, Link } from 'gatsby'
-import usePreviewData from '../utils/usePreviewData'
-import Layout from '../components/layouts/index'
 import { withPreview } from 'gatsby-source-prismic'
+import Layout from '../components/layouts/index'
 
 export const ProductTemplate = ({ data }) => {
   if (!data) return null
-  const liveData = usePreviewData(data)
-  const pageContent = liveData.prismicProduct
+
+  const pageContent = data.prismicProduct
   const page = pageContent.data || {}
 
-  const pageLayout = liveData.prismicLayout.data
+  const pageLayout = data.prismicLayout.data
 
   return (
     <Layout layoutData={pageLayout}>
@@ -178,4 +177,3 @@ const RenderBody = ({ product }) => (
 )
 
 export default withPreview(ProductTemplate)
-