From ba64d01dded2c0c49930d88404d86a84d2bebbbe Mon Sep 17 00:00:00 2001
From: Shawn Erquhart <shawn@erquh.art>
Date: Tue, 28 Nov 2017 18:08:20 -0500
Subject: [PATCH] add media library support

---
 gatsby-node.js                                |  66 ++---------------
 src/components/Features.js                    |   4 +-
 src/pages/product/product.md                  |  18 ++---
 src/templates/product-page.js                 |  68 +++---------------
 static/admin/config.yml                       |   4 +-
 {src/pages/blog => static}/img/chemex.jpg     | Bin
 .../img}/coffee-gear.png                      | Bin
 .../illustrations => static/img}/coffee.png   | Bin
 .../blog => static}/img/flavor_wheel.jpg      | Bin
 .../img/products => static/img}/jumbotron.jpg | Bin
 .../img}/meeting-space.png                    | Bin
 .../img}/products-full-width.jpg              | Bin
 .../img}/products-grid1.jpg                   | Bin
 .../img}/products-grid2.jpg                   | Bin
 .../img}/products-grid3.jpg                   | Bin
 .../img}/tutorials.png                        | Bin
 16 files changed, 30 insertions(+), 130 deletions(-)
 rename {src/pages/blog => static}/img/chemex.jpg (100%)
 rename {src/pages/product/img/illustrations => static/img}/coffee-gear.png (100%)
 rename {src/pages/product/img/illustrations => static/img}/coffee.png (100%)
 rename {src/pages/blog => static}/img/flavor_wheel.jpg (100%)
 rename {src/pages/product/img/products => static/img}/jumbotron.jpg (100%)
 rename {src/pages/product/img/illustrations => static/img}/meeting-space.png (100%)
 rename {src/pages/product/img/products => static/img}/products-full-width.jpg (100%)
 rename {src/pages/product/img/products => static/img}/products-grid1.jpg (100%)
 rename {src/pages/product/img/products => static/img}/products-grid2.jpg (100%)
 rename {src/pages/product/img/products => static/img}/products-grid3.jpg (100%)
 rename {src/pages/product/img/illustrations => static/img}/tutorials.png (100%)

diff --git a/gatsby-node.js b/gatsby-node.js
index d07f840..49641ed 100644
--- a/gatsby-node.js
+++ b/gatsby-node.js
@@ -16,30 +16,12 @@ exports.createPages = ({ boundActionCreators, graphql }) => {
               path
               date
               title
-              image {
-                childImageSharp {
-                  resolutions(width: 1400) {
-                    width
-                    height
-                    src
-                    srcSet
-                  }
-                }
-              }
+              image
               heading
               description
               intro {
                 blurbs {
-                  image {
-                    childImageSharp {
-                      resolutions(width: 220) {
-                        width
-                        height
-                        src
-                        srcSet
-                      }
-                    }
-                  }
+                  image
                   text
                 }
                 heading
@@ -50,58 +32,22 @@ exports.createPages = ({ boundActionCreators, graphql }) => {
                 description
                 image1 {
                   alt
-                  image {
-                    childImageSharp {
-                      resolutions(width: 400) {
-                        width
-                        height
-                        src
-                        srcSet
-                      }
-                    }
-                  }
+                  image
                 }
                 image2 {
                   alt
-                  image {
-                    childImageSharp {
-                      resolutions(width: 400) {
-                        width
-                        height
-                        src
-                        srcSet
-                      }
-                    }
-                  }
+                  image
                 }
                 image3 {
                   alt
-                  image {
-                    childImageSharp {
-                      resolutions(width: 400) {
-                        width
-                        height
-                        src
-                        srcSet
-                      }
-                    }
-                  }
+                  image
                 }
               }
               testimonials {
                 author
                 quote
               }
-              full_image {
-                childImageSharp {
-                  resolutions(width: 400) {
-                    width
-                    height
-                    src
-                    srcSet
-                  }
-                }
-              }
+              full_image
               pricing {
                 heading
                 description
diff --git a/src/components/Features.js b/src/components/Features.js
index 28fb555..1160764 100644
--- a/src/components/Features.js
+++ b/src/components/Features.js
@@ -3,10 +3,10 @@ import React from 'react';
 const FeatureGrid = ({ gridItems }) => (
   <div className="columns is-multiline">
     {gridItems.map(item => (
-      <div key={item.image.childImageSharp.resolutions.src} className="column is-6">
+      <div key={item.image} className="column is-6">
         <section className="section">
           <p className="has-text-centered">
-            <img alt="" src={item.image.childImageSharp.resolutions.src} />
+            <img alt="" src={item.image} />
           </p>
           <p>{item.text}</p>
         </section>
diff --git a/src/pages/product/product.md b/src/pages/product/product.md
index 99ba060..ea729c6 100644
--- a/src/pages/product/product.md
+++ b/src/pages/product/product.md
@@ -2,7 +2,7 @@
 templateKey: 'product-page'
 path: /products
 title: Our Coffee
-image: ./img/products/jumbotron.jpg
+image: /img/jumbotron.jpg
 heading: What we offer
 description: >-
   Kaldi is the ultimate spot for coffee lovers who want to learn about their
@@ -11,27 +11,27 @@ description: >-
   anyone.
 intro:
   blurbs:
-    - image: ./img/illustrations/coffee.png
+    - image: /img/coffee.png
       text: >
         We sell green and roasted coffee beans that are sourced directly from
         independent farmers and farm cooperatives. We’re proud to offer a
         variety of coffee beans grown with great care for the environment and
         local communities. Check our post or contact us directly for current
         availability.
-    - image: ./img/illustrations/coffee-gear.png
+    - image: /img/coffee-gear.png
       text: >
         We offer a small, but carefully curated selection of brewing gear and
         tools for every taste and experience level. No matter if you roast your
         own beans or just bought your first french press, you’ll find a gadget
         to fall in love with in our shop.
-    - image: ./img/illustrations/tutorials.png
+    - image: /img/tutorials.png
       text: >
         Love a great cup of coffee, but never knew how to make one? Bought a
         fancy new Chemex but have no clue how to use it? Don't worry, we’re here
         to help. You can schedule a custom 1-on-1 consultation with our baristas
         to learn anything you want to know about coffee roasting and brewing.
         Email us or call the store for details.
-    - image: ./img/illustrations/meeting-space.png
+    - image: /img/meeting-space.png
       text: >
         We believe that good coffee has the power to bring people together.
         That’s why we decided to turn a corner of our shop into a cozy meeting
@@ -53,13 +53,13 @@ main:
     optimal for the plants, farmers and the local environment.
   image1:
     alt: A close-up of a paper filter filled with ground coffee
-    image: ./img/products/products-grid3.jpg
+    image: /img/products-grid3.jpg
   image2:
     alt: A green cup of a coffee on a wooden table
-    image: ./img/products/products-grid2.jpg
+    image: /img/products-grid2.jpg
   image3:
     alt: Coffee beans
-    image: ./img/products/products-grid1.jpg
+    image: /img/products-grid1.jpg
 testimonials:
   - author: Elisabeth Kaurismäki
     quote: >-
@@ -69,7 +69,7 @@ testimonials:
     quote: >-
       Kaldi is the place to go if you want the best quality coffee. I love their
       stance on empowering farmers and transparency.
-full_image: ./img/products/products-full-width.jpg
+full_image: /img/products-full-width.jpg
 pricing:
   heading: Monthly subscriptions
   description: >-
diff --git a/src/templates/product-page.js b/src/templates/product-page.js
index 279bcdb..7ed7906 100644
--- a/src/templates/product-page.js
+++ b/src/templates/product-page.js
@@ -2,10 +2,6 @@ import React from 'react';
 import Features from '../components/Features';
 import Testimonials from '../components/Testimonials';
 import Pricing from '../components/Pricing';
-import grid1 from '../pages/product/img/products/products-grid1.jpg';
-import grid2 from '../pages/product/img/products/products-grid2.jpg';
-import grid3 from '../pages/product/img/products/products-grid3.jpg';
-import fullWidth from '../pages/product/img/products/products-full-width.jpg';
 
 export default ({ data }) => {
   console.log(data);
@@ -19,7 +15,7 @@ export default ({ data }) => {
               <div className="content">
                 <div
                   className="full-width-image-container margin-top-0"
-                  style={{ backgroundImage: `url(${frontmatter.image.childImageSharp.resolutions.src})` }}
+                  style={{ backgroundImage: `url(${frontmatter.image})` }}
                 >
                   <h2
                     className="has-text-weight-bold is-size-1"
@@ -53,7 +49,7 @@ export default ({ data }) => {
                         <article className="tile is-child">
                           <img
                             style={{ borderRadius: '5px' }}
-                            src={frontmatter.main.image1.image.childImageSharp.resolutions.src}
+                            src={frontmatter.main.image1.image}
                             alt=""
                           />
                         </article>
@@ -62,7 +58,7 @@ export default ({ data }) => {
                         <article className="tile is-child">
                           <img
                             style={{ borderRadius: '5px' }}
-                            src={frontmatter.main.image2.image.childImageSharp.resolutions.src}
+                            src={frontmatter.main.image2.image}
                             alt=""
                           />
                         </article>
@@ -72,7 +68,7 @@ export default ({ data }) => {
                       <article className="tile is-child">
                         <img
                           style={{ borderRadius: '5px' }}
-                          src={frontmatter.main.image3.image.childImageSharp.resolutions.src}
+                          src={frontmatter.main.image3.image}
                           alt=""
                         />
                       </article>
@@ -82,7 +78,7 @@ export default ({ data }) => {
                 <Testimonials testimonials={frontmatter.testimonials} />
                 <div
                   className="full-width-image-container"
-                  style={{ backgroundImage: `url(${frontmatter.full_image.childImageSharp.resolutions.src})` }}
+                  style={{ backgroundImage: `url(${frontmatter.full_image})` }}
                 />
                 <h2 className="has-text-weight-semibold is-size-2">{frontmatter.pricing.heading}</h2>
                 <p className="is-size-5">{frontmatter.pricing.description}</p>
@@ -102,30 +98,12 @@ export const productPageQuery = graphql`
       frontmatter {
         title
         path
-        image {
-          childImageSharp {
-            resolutions(width: 1400) {
-              width
-              height
-              src
-              srcSet
-            }
-          }
-        }
+        image
         heading
         description
         intro {
           blurbs {
-            image {
-              childImageSharp {
-                resolutions(width: 220) {
-                  width
-                  height
-                  src
-                  srcSet
-                }
-              }
-            }
+            image
             text
           }
           heading
@@ -136,46 +114,22 @@ export const productPageQuery = graphql`
           description
           image1 {
             alt
-            image {
-              childImageSharp {
-                resolutions(width: 700) {
-                  src
-                }
-              }
-            }
+            image
           }
           image2 {
             alt
-            image {
-              childImageSharp {
-                resolutions(width: 700) {
-                  src
-                }
-              }
-            }
+            image
           }
           image3 {
             alt
-            image {
-              childImageSharp {
-                resolutions(width: 1400) {
-                  src
-                }
-              }
-            }
+            image
           }
         }
         testimonials {
           author
           quote
         }
-        full_image {
-          childImageSharp {
-            resolutions(width: 1400) {
-              src
-            }
-          }
-        }
+        full_image
         pricing {
           heading
           description
diff --git a/static/admin/config.yml b/static/admin/config.yml
index 0f1717b..5e93965 100644
--- a/static/admin/config.yml
+++ b/static/admin/config.yml
@@ -2,8 +2,8 @@ backend:
   name: git-gateway
   branch: master
 
-media_folder: "/src/pages/blog/img"
-public_folder: "img"
+media_folder: static/img
+public_folder: img
 
 collections:
   - name: "blog"
diff --git a/src/pages/blog/img/chemex.jpg b/static/img/chemex.jpg
similarity index 100%
rename from src/pages/blog/img/chemex.jpg
rename to static/img/chemex.jpg
diff --git a/src/pages/product/img/illustrations/coffee-gear.png b/static/img/coffee-gear.png
similarity index 100%
rename from src/pages/product/img/illustrations/coffee-gear.png
rename to static/img/coffee-gear.png
diff --git a/src/pages/product/img/illustrations/coffee.png b/static/img/coffee.png
similarity index 100%
rename from src/pages/product/img/illustrations/coffee.png
rename to static/img/coffee.png
diff --git a/src/pages/blog/img/flavor_wheel.jpg b/static/img/flavor_wheel.jpg
similarity index 100%
rename from src/pages/blog/img/flavor_wheel.jpg
rename to static/img/flavor_wheel.jpg
diff --git a/src/pages/product/img/products/jumbotron.jpg b/static/img/jumbotron.jpg
similarity index 100%
rename from src/pages/product/img/products/jumbotron.jpg
rename to static/img/jumbotron.jpg
diff --git a/src/pages/product/img/illustrations/meeting-space.png b/static/img/meeting-space.png
similarity index 100%
rename from src/pages/product/img/illustrations/meeting-space.png
rename to static/img/meeting-space.png
diff --git a/src/pages/product/img/products/products-full-width.jpg b/static/img/products-full-width.jpg
similarity index 100%
rename from src/pages/product/img/products/products-full-width.jpg
rename to static/img/products-full-width.jpg
diff --git a/src/pages/product/img/products/products-grid1.jpg b/static/img/products-grid1.jpg
similarity index 100%
rename from src/pages/product/img/products/products-grid1.jpg
rename to static/img/products-grid1.jpg
diff --git a/src/pages/product/img/products/products-grid2.jpg b/static/img/products-grid2.jpg
similarity index 100%
rename from src/pages/product/img/products/products-grid2.jpg
rename to static/img/products-grid2.jpg
diff --git a/src/pages/product/img/products/products-grid3.jpg b/static/img/products-grid3.jpg
similarity index 100%
rename from src/pages/product/img/products/products-grid3.jpg
rename to static/img/products-grid3.jpg
diff --git a/src/pages/product/img/illustrations/tutorials.png b/static/img/tutorials.png
similarity index 100%
rename from src/pages/product/img/illustrations/tutorials.png
rename to static/img/tutorials.png