{"version":3,"file":"component---src-pages-index-js-2e84f35139383e50e578.js","mappings":"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","sources":["webpack://gatsby-london/./src/components/signup.js","webpack://gatsby-london/./src/components/signup.module.css","webpack://gatsby-london/./src/components/postCard.js","webpack://gatsby-london/./src/pages/index.js"],"sourcesContent":["import React, {useState} from 'react';\r\nimport * as signupStyles from \"./signup.module.css\"\r\nimport { useGoogleReCaptcha } from 'react-google-recaptcha-v3'\r\nimport Helmet from \"react-helmet\"\r\n\r\nfunction validateEmail(email) {\r\n    const re = /^(([^<>()\\[\\]\\\\.,;:\\s@\"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$/;\r\n    return re.test(String(email).toLowerCase());\r\n}\r\n  \r\nexport default function Signup() {\r\n    const { executeRecaptcha } = useGoogleReCaptcha()\r\n    console.log('executeRecaptcha', executeRecaptcha)\r\n\r\n    const [email, setEmail] = useState('');\r\n    const [valid, setValid] = useState(true);\r\n    const [mode, setMode] = useState(0);\r\n\r\n    const handleEmailChange = (e) => setEmail(e.target.value);\r\n\r\n    const handleSubmit = async (e) => {\r\n        e.preventDefault();\r\n\r\n        setMode(1)\r\n\r\n        try {\r\n            console.log(\"handleSubmit\", e)\r\n\r\n            if (!executeRecaptcha) {\r\n                console.log(\"!executeRecaptcha\")\r\n                throw \"Not Ready\"\r\n            }\r\n\r\n            // VALIDATE\r\n            if (!validateEmail(email)) {\r\n                console.log(\"not valid\")\r\n                setValid(false)\r\n                setMode(0)\r\n                return\r\n            }\r\n\r\n            const token = await executeRecaptcha('signup')\r\n            console.log('token', token)\r\n\r\n            const data = JSON.stringify({email, token})\r\n\r\n            console.log('data', data)\r\n\r\n            const submitResult = await fetch('https://cwzrokjccj.execute-api.us-east-1.amazonaws.com/001/signup', {\r\n                method: 'POST',\r\n                headers: {\r\n                    'Accept': 'application/json, text/plain, */*',\r\n                    'Content-type': 'application/json'\r\n                },\r\n                body: data \r\n            })\r\n\r\n            const finalResult = await submitResult.json()\r\n\r\n            console.log('finalResult', finalResult);\r\n\r\n            if(finalResult.result == \"OK\") {\r\n                setMode(2)\r\n                return\r\n            } \r\n\r\n            throw \"Unexpected Result\"\r\n        \r\n        } catch(e) {\r\n            console.log(e)\r\n            setMode(3)\r\n        }\r\n    };\r\n\r\n    return (\r\n        <div className={signupStyles.container}>\r\n        <Helmet>\r\n            <link href=\"https://use.fontawesome.com/releases/v5.15.2/css/all.css\"  crossorigin=\"anonymous\" rel=\"stylesheet\" type=\"text/css\" />\r\n        </Helmet>\r\n        {\r\n            {\r\n            0: <div>\r\n                {/* <div className={signupStyles.title}>Join my inner circle,</div> */}\r\n                <div className={signupStyles.descripton}>If you’d like emails when I make something new, sign up here.</div>\r\n                <form onSubmit={handleSubmit} style={{marginBottom: 0}}>\r\n                    <div className={signupStyles.inputRow}>\r\n                        <div className={signupStyles.inputContainer}>\r\n                            <input className={signupStyles.emailInput} type=\"email\" name=\"email\" id=\"email\" value={email} onChange={handleEmailChange} placeholder=\"Email Address\" required/>\r\n                            <button type=\"submit\" className={signupStyles.submitButton}>  \r\n                            <i class=\"fas fa-chevron-right\"></i>\r\n                            <span class=\"sr-only\">Join</span></button>\r\n                        </div>\r\n                    </div>\r\n\r\n                    {!valid && <span className={signupStyles.validation}>Please enter a valid email address.</span>}\r\n                </form>\r\n                {/* <div className={signupStyles.privacy}></div> */}\r\n            </div>,\r\n            1: <div>\r\n                <div className={signupStyles.working}>Working...</div>\r\n            </div>,\r\n            2: <div>\r\n                <div className={signupStyles.done}>Done. Thank you for joining!</div>\r\n            </div>,\r\n            3: <div>\r\n                <div className={signupStyles.oops}>Oops, unable not join, refresh and try agian.</div>\r\n            </div>\r\n            }[mode]\r\n        }\r\n        </div>\r\n    )\r\n  \r\n}\r\n","// extracted by mini-css-extract-plugin\nexport var container = \"signup-module--container--TNhyb\";\nexport var descripton = \"signup-module--descripton--lt+sc\";\nexport var done = \"signup-module--done--Jkq8n\";\nexport var emailInput = \"signup-module--emailInput--NzfMi\";\nexport var inputContainer = \"signup-module--inputContainer--MBIa7\";\nexport var inputRow = \"signup-module--inputRow--+rASG\";\nexport var oops = \"signup-module--oops--sAcT9\";\nexport var privacy = \"signup-module--privacy--qLyzf\";\nexport var submitButton = \"signup-module--submitButton--0UC4F\";\nexport var title = \"signup-module--title--gwaEE\";\nexport var validation = \"signup-module--validation--Kt9tx\";\nexport var working = \"signup-module--working--tEWS8\";","import React from \"react\"\r\nimport { Link } from \"gatsby\"\r\nimport { GatsbyImage } from \"gatsby-plugin-image\"\r\n\r\nexport default props => {\r\n  const { node } = props\r\n  const image = node.frontmatter.thumbnail?.childImageSharp?.gatsbyImageData\r\n\r\n  return (\r\n    <article className=\"post-card\">\r\n      <div className=\"image-container\">\r\n        <Link to={node.fields.slug} className=\"post-card-link\">\r\n          {image && (\r\n            <GatsbyImage\r\n              image={image}\r\n              alt={node.frontmatter.title || \"Artwork\"}\r\n            />\r\n          )}\r\n          {node.frontmatter.available === true && (\r\n            <span className=\"availability-label\">Available</span>\r\n          )}\r\n        </Link>\r\n      </div>\r\n      <div className=\"post-card-title\">\r\n        {node.frontmatter.title}\r\n      </div>\r\n    </article>\r\n  )\r\n}\r\n\r\n// import React from \"react\"\r\n// import { Link } from \"gatsby\"\r\n// import { GatsbyImage } from \"gatsby-plugin-image\"\r\n\r\n// export default props => (\r\n//   <article\r\n//     className={`post-card ${props.postClass} ${\r\n//       props.node.frontmatter.thumbnail ? `with-image` : `no-image`\r\n//     }`}\r\n//   >\r\n\r\n//     <div style={{ display: \"grid\" }}>\r\n//       {/* You can use a GatsbyImage component if the image is dynamic */}\r\n\r\n//       {props.node.frontmatter.thumbnail &&\r\n//         <GatsbyImage\r\n//           style={{\r\n//             gridArea: \"1/1\",\r\n//             // You can set a maximum height for the image, if you wish.\r\n//             // maxHeight: 600,\r\n//           }}\r\n//           // layout=\"constrained\"\r\n//           // You can optionally force an aspect ratio for the generated image\r\n//           // This is a presentational image, so the alt should be an empty string\r\n//           alt=\"\"\r\n//           // Assisi, Perúgia, Itália by Bernardo Ferrari, via Unsplash\r\n//           image={props.node.frontmatter.thumbnail.childImageSharp.gatsbyImageData}\r\n//           // formats={[\"auto\", \"webp\"]}\r\n//         />\r\n//       }\r\n\r\n//       <div\r\n//         style={{\r\n//           // By using the same grid area for both, they are stacked on top of each other\r\n//           gridArea: \"1/1\",\r\n//           position: \"relative\",\r\n//           // This centers the other elements inside the hero component\r\n//           placeItems: \"center\",\r\n//           display: \"grid\",\r\n//         }}\r\n//       >\r\n//         {/* Any content here will be centered in the component */}\r\n//         <Link to={props.node.fields.slug} className=\"post-card-link\">\r\n//           <div className=\"post-card-content\">\r\n//             <h2 className=\"post-card-title\">\r\n//               {props.node.frontmatter.title || props.node.fields.slug}\r\n//             </h2>\r\n//           </div>\r\n//         </Link>\r\n//       </div>\r\n//     </div>\r\n\r\n\r\n\r\n//   </article>\r\n// )\r\n\r\n// // ${props.count % 3 === 0 && `post-card-large`}\r\n","import React from \"react\"\r\nimport { graphql } from \"gatsby\"\r\n\r\nimport Layout from \"../components/layout\"\r\nimport SEO from \"../components/seo\"\r\nimport PostCard from \"../components/postCard\"\r\nimport Signup from \"../components/signup\"\r\n\r\nimport \"../utils/styles.css\"\r\nimport \"../utils/normalize.css\"\r\nimport \"../utils/css/screen.css\"\r\n\r\nconst BlogIndex = ({ data, location }) => {\r\n  // console.error(\"Missing data:\", data)\r\n  \r\n  // if (!data || !data.site) {\r\n  //   console.error(\"Missing data:\", data)\r\n  //   return null // or fallback UI\r\n  // }\r\n  \r\n  const siteTitle = data.site.siteMetadata.title\r\n  const posts = data.allMarkdownRemark.edges\r\n  let postCounter = 0\r\n\r\n\r\n  return (\r\n    <Layout title={siteTitle}>\r\n      <SEO\r\n        title=\"Portfolio\"\r\n        keywords={[\r\n          `Parametric`,\r\n          `Wall Sculpture`,\r\n          `Contemporary Art`,\r\n          `Dimensional Wall Art`,\r\n          `3D Wall Art `,\r\n          `Modern Art`,\r\n          `Flower Art`,\r\n          `Mosaic Art`,\r\n          `Wood Wall Art`,\r\n          `Sacred Geometry`,\r\n          `Abstract Art`,\r\n          `Wall Object`,\r\n          `3D Printing`,\r\n          `Mandala Art`,\r\n          `Geometric Art`,\r\n          `Trippy Art`,\r\n        ]}\r\n      />\r\n \r\n      <header className=\"page-head\" style={{padding: \"5vh 0 10vh 0\", maxWidth: \"800px\"}}>\r\n          <h2 style={{fontSize: \"3.5rem\"}}>\r\n          Glad you’re here. Look around, take your time.\r\n          </h2>\r\n       \r\n\r\n        <div style={{marginTop: \"2em\", marginBottom: \"0em\"}}><Signup/></div>\r\n        </header>\r\n      {/* <div style={{ display: \"flex\", justifyContent: \"center\", marginBottom: \"50px\"}}><Signup/></div> */}\r\n\r\n      <div className=\"post-feed\">\r\n        {posts.map(({ node }) => {\r\n          postCounter++\r\n          return (\r\n            <PostCard\r\n              key={node.fields.slug}\r\n              count={postCounter}\r\n              node={node}\r\n              postClass={`post`}\r\n            />\r\n          )\r\n        })}\r\n      </div>\r\n    </Layout>\r\n  )\r\n}\r\n\r\n\r\nexport const query = graphql`\r\n  query {\r\n    site {\r\n      siteMetadata {\r\n        title\r\n        description\r\n      }\r\n    }\r\n\r\n    allMarkdownRemark(\r\n      filter: {fileAbsolutePath: {regex: \"/content/blog/\"}}\r\n      sort: { fields: [frontmatter___date], order: DESC }\r\n    ) {\r\n      edges {\r\n        node {\r\n          excerpt\r\n          fields {\r\n            slug\r\n          }\r\n          frontmatter {\r\n            date(formatString: \"MMMM DD, YYYY\")\r\n            title\r\n            description\r\n            thumbnail {\r\n              childImageSharp {\r\n                gatsbyImageData(layout: CONSTRAINED, width: 640)\r\n              }\r\n            }\r\n            available\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n`\r\n\r\nexport default BlogIndex\r\n\r\n"],"names":["validateEmail","email","test","String","toLowerCase","Signup","executeRecaptcha","useGoogleReCaptcha","console","log","useState","setEmail","valid","setValid","mode","setMode","handleSubmit","e","preventDefault","token","data","JSON","stringify","fetch","method","headers","body","submitResult","json","finalResult","result","className","Helmet","href","crossorigin","rel","type","onSubmit","style","marginBottom","name","id","value","onChange","target","placeholder","required","class","props","node","image","frontmatter","thumbnail","childImageSharp","gatsbyImageData","Link","to","fields","slug","G","alt","title","available","siteTitle","location","site","siteMetadata","posts","allMarkdownRemark","edges","postCounter","keywords","padding","maxWidth","fontSize","marginTop","map","key","count","postClass"],"sourceRoot":""}