fix: default files

.gitignore

@@ -1,4 +1,3 @@
 node_modules
-types
-*.js
 *.log
+.DS_Store

examples/default/gatsby-browser.js

@@ -0,0 +1,10 @@
+/**
+ * Implement Gatsby's Browser APIs in this file.
+ *
+ * See: https://www.gatsbyjs.org/docs/browser-apis/
+ */
+
+// You can delete this file if you're not using it
+const { registerLinkResolver } = require('gatsby-source-prismic-graphql');
+
+registerLinkResolver(require('./src/utils/linkResolver').linkResolver);

examples/default/gatsby-config.js

@@ -0,0 +1,48 @@
+module.exports = {
+  siteMetadata: {
+    title: `Gatsby Default Starter`,
+    description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`,
+    author: `@gatsbyjs`,
+  },
+  plugins: [
+    {
+      resolve: `gatsby-source-prismic-graphql`,
+      options: {
+        repositoryName: 'ueno-starter-kit-universally-test',
+        pages: [
+          {
+            type: 'Article',
+            match: '/article/:uid',
+            path: '/article',
+            component: require.resolve('./src/templates/article.js'),
+          },
+        ],
+      },
+    },
+    `gatsby-plugin-react-helmet`,
+    {
+      resolve: `gatsby-source-filesystem`,
+      options: {
+        name: `images`,
+        path: `${__dirname}/src/images`,
+      },
+    },
+    `gatsby-transformer-sharp`,
+    `gatsby-plugin-sharp`,
+    {
+      resolve: `gatsby-plugin-manifest`,
+      options: {
+        name: `gatsby-starter-default`,
+        short_name: `starter`,
+        start_url: `/`,
+        background_color: `#663399`,
+        theme_color: `#663399`,
+        display: `minimal-ui`,
+        icon: `src/images/gatsby-icon.png`, // This path is relative to the root of the site.
+      },
+    },
+    // this (optional) plugin enables Progressive Web App + Offline functionality
+    // To learn more, visit: https://gatsby.dev/offline
+    // 'gatsby-plugin-offline',
+  ],
+};

examples/default/gatsby-node.js

@@ -0,0 +1,5 @@
+/**
+ * Implement Gatsby's Node APIs in this file.
+ *
+ * See: https://www.gatsbyjs.org/docs/node-apis/
+ */

examples/default/gatsby-ssr.js

@@ -0,0 +1,7 @@
+/**
+ * Implement Gatsby's SSR (Server Side Rendering) APIs in this file.
+ *
+ * See: https://www.gatsbyjs.org/docs/ssr-apis/
+ */
+
+// You can delete this file if you're not using it

examples/default/src/components/header.js

@@ -0,0 +1,42 @@
+import { Link } from 'gatsby';
+import PropTypes from 'prop-types';
+import React from 'react';
+
+const Header = ({ siteTitle }) => (
+  <header
+    style={{
+      background: `rebeccapurple`,
+      marginBottom: `1.45rem`,
+    }}
+  >
+    <div
+      style={{
+        margin: `0 auto`,
+        maxWidth: 960,
+        padding: `1.45rem 1.0875rem`,
+      }}
+    >
+      <h1 style={{ margin: 0 }}>
+        <Link
+          to="/"
+          style={{
+            color: `white`,
+            textDecoration: `none`,
+          }}
+        >
+          {siteTitle}
+        </Link>
+      </h1>
+    </div>
+  </header>
+);
+
+Header.propTypes = {
+  siteTitle: PropTypes.string,
+};
+
+Header.defaultProps = {
+  siteTitle: ``,
+};
+
+export default Header;

examples/default/src/components/image.js

@@ -0,0 +1,32 @@
+import React from 'react';
+import { StaticQuery, graphql } from 'gatsby';
+import Img from 'gatsby-image';
+
+/*
+ * This component is built using `gatsby-image` to automatically serve optimized
+ * images with lazy loading and reduced file sizes. The image is loaded using a
+ * `StaticQuery`, which allows us to load the image from directly within this
+ * component, rather than having to pass the image data down from pages.
+ *
+ * For more information, see the docs:
+ * - `gatsby-image`: https://gatsby.dev/gatsby-image
+ * - `StaticQuery`: https://gatsby.dev/staticquery
+ */
+
+const Image = () => (
+  <StaticQuery
+    query={graphql`
+      query {
+        placeholderImage: file(relativePath: { eq: "gatsby-astronaut.png" }) {
+          childImageSharp {
+            fluid(maxWidth: 300) {
+              ...GatsbyImageSharpFluid
+            }
+          }
+        }
+      }
+    `}
+    render={data => <Img fluid={data.placeholderImage.childImageSharp.fluid} />}
+  />
+);
+export default Image;

examples/default/src/components/layout.js

@@ -0,0 +1,53 @@
+/**
+ * Layout component that queries for data
+ * with Gatsby's StaticQuery component
+ *
+ * See: https://www.gatsbyjs.org/docs/static-query/
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import { StaticQuery, graphql } from 'gatsby';
+
+import Header from './header';
+import './layout.css';
+
+const Layout = ({ children }) => (
+  <StaticQuery
+    query={graphql`
+      query SiteTitleQuery {
+        site {
+          siteMetadata {
+            title
+          }
+        }
+      }
+    `}
+    render={data => (
+      <>
+        <Header siteTitle={data.site.siteMetadata.title} />
+        <div
+          style={{
+            margin: `0 auto`,
+            maxWidth: 960,
+            padding: `0px 1.0875rem 1.45rem`,
+            paddingTop: 0,
+          }}
+        >
+          <main>{children}</main>
+          <footer>
+            © {new Date().getFullYear()}, Built with
+            {` `}
+            <a href="https://www.gatsbyjs.org">Gatsby</a>
+          </footer>
+        </div>
+      </>
+    )}
+  />
+);
+
+Layout.propTypes = {
+  children: PropTypes.node.isRequired,
+};
+
+export default Layout;

examples/default/src/components/seo.js

@@ -0,0 +1,98 @@
+/**
+ * SEO component that queries for data with
+ *  Gatsby's useStaticQuery React hook
+ *
+ * See: https://www.gatsbyjs.org/docs/use-static-query/
+ */
+
+import React from 'react';
+import PropTypes from 'prop-types';
+import Helmet from 'react-helmet';
+import { useStaticQuery, graphql } from 'gatsby';
+
+function SEO({ description, lang, meta, keywords, title }) {
+  const { site } = useStaticQuery(
+    graphql`
+      query {
+        site {
+          siteMetadata {
+            title
+            description
+            author
+          }
+        }
+      }
+    `
+  );
+
+  const metaDescription = description || site.siteMetadata.description;
+
+  return (
+    <Helmet
+      htmlAttributes={{
+        lang,
+      }}
+      title={title}
+      titleTemplate={`%s | ${site.siteMetadata.title}`}
+      meta={[
+        {
+          name: `description`,
+          content: metaDescription,
+        },
+        {
+          property: `og:title`,
+          content: title,
+        },
+        {
+          property: `og:description`,
+          content: metaDescription,
+        },
+        {
+          property: `og:type`,
+          content: `website`,
+        },
+        {
+          name: `twitter:card`,
+          content: `summary`,
+        },
+        {
+          name: `twitter:creator`,
+          content: site.siteMetadata.author,
+        },
+        {
+          name: `twitter:title`,
+          content: title,
+        },
+        {
+          name: `twitter:description`,
+          content: metaDescription,
+        },
+      ]
+        .concat(
+          keywords.length > 0
+            ? {
+                name: `keywords`,
+                content: keywords.join(`, `),
+              }
+            : []
+        )
+        .concat(meta)}
+    />
+  );
+}
+
+SEO.defaultProps = {
+  lang: `en`,
+  meta: [],
+  keywords: [],
+};
+
+SEO.propTypes = {
+  description: PropTypes.string,
+  lang: PropTypes.string,
+  meta: PropTypes.array,
+  keywords: PropTypes.arrayOf(PropTypes.string),
+  title: PropTypes.string.isRequired,
+};
+
+export default SEO;

examples/default/src/pages/404.js

@@ -0,0 +1,14 @@
+import React from 'react';
+
+import Layout from '../components/layout';
+import SEO from '../components/seo';
+
+const NotFoundPage = () => (
+  <Layout>
+    <SEO title="404: Not found" />
+    <h1>NOT FOUND</h1>
+    <p>You just hit a route that doesn&#39;t exist... the sadness.</p>
+  </Layout>
+);
+
+export default NotFoundPage;

examples/default/src/pages/example.js

@@ -0,0 +1,31 @@
+import { graphql, Link } from 'gatsby';
+import React from 'react';
+
+export const query = graphql`
+  query {
+    prismic {
+      allArticles {
+        edges {
+          node {
+            _meta {
+              uid
+            }
+            title
+          }
+        }
+      }
+    }
+  }
+`;
+
+const Example = ({ data, ...props }) => {
+  console.log(data, props);
+
+  return (
+    <p>
+      ELLO <Link to="/article/the-wordpress-question">yes</Link>
+    </p>
+  );
+};
+
+export default Example;

examples/default/src/templates/article.js

@@ -0,0 +1,33 @@
+import React from 'react';
+import { graphql } from 'gatsby';
+import { get } from 'lodash';
+
+export const query = graphql`
+  query ArticleQuery($uid: String) {
+    prismic {
+      allArticles(uid: $uid) {
+        edges {
+          node {
+            _meta {
+              uid
+            }
+            title
+          }
+        }
+      }
+    }
+  }
+`;
+
+const Article = props => {
+  console.log('Article.props', props);
+  const title = get(props.data, 'prismic.allArticles.edges.0.node.title.0.text');
+  return (
+    <article>
+      <h1>{title}</h1>
+      <p>article body</p>
+    </article>
+  );
+};
+
+export default Article;

examples/default/src/utils/linkResolver.js

@@ -0,0 +1,9 @@
+module.exports = {
+  linkResolver(doc) {
+    if (doc.type === 'article') {
+      return `/article/${doc.uid}`;
+    }
+
+    return '/';
+  },
+};