{"version":3,"sources":["webpack:///./src/pages/search.tsx"],"names":["pageQuery","Search","props","posts","data","allMarkdownRemark","edges","useState","value","setValue","isTitleOnly","setIsTitleOnly","filteredPosts","filter","post","node","frontmatter","rawMarkdownBody","title","lowerValue","toLocaleLowerCase","includes","id","className","icon","faSearch","type","name","placeholder","autoComplete","autoFocus","onChange","e","currentTarget","style","opacity","onClick","length"],"mappings":"4OAgFaA,G,UAAY,cAsBVC,UAvFA,SAACC,GAAuB,IAE/BC,EADWD,EAATE,KACWC,kBAAkBC,MAFA,EAIXC,mBAAS,IAA5BC,EAJ8B,KAIvBC,EAJuB,OAKCF,oBAAS,GAAxCG,EAL8B,KAKjBC,EALiB,KAO/BC,EAAuBT,EAAMU,QAAO,SAACC,GAAc,IAC/CC,EAASD,EAATC,KACAC,EAAiCD,EAAjCC,YAAaC,EAAoBF,EAApBE,gBACbC,EAAUF,EAAVE,MACFC,EAAaX,EAAMY,oBAEzB,QAAKV,IAAeO,EAAgBG,oBAAoBC,SAASF,KAE1DD,EAAME,oBAAoBC,SAASF,MAG5C,OACE,gBAAC,IAAD,KACE,gBAAC,IAAD,CAAKD,MAAM,WACX,uBAAKI,GAAG,UACN,uBAAKC,UAAU,qBACb,uBAAKA,UAAU,cACb,gBAAC,IAAD,CAAIC,KAAMC,MACV,yBACEC,KAAK,OACLC,KAAK,SACLL,GAAG,cACHd,MAAOA,EACPoB,YAAY,SACZC,aAAa,MACbC,WAAS,EACTC,SAAU,SAACC,GACTvB,EAASuB,EAAEC,cAAczB,UAG7B,uBAAKe,UAAU,iBACb,wBACEW,MAAO,CAAEC,QAASzB,EAAc,GAAM,KACtC0B,QAAS,WACPzB,GAAe,KAHnB,YAQA,wBACEuB,MAAO,CAAEC,QAAUzB,EAAoB,IAAN,IACjC0B,QAAS,WACPzB,GAAe,KAHnB,sBAWO,KAAVH,GAAiBI,EAAcyB,OAAgE,KAAvD,wBAAMd,UAAU,aAAhB,qBACzC,gBAAC,IAAD,CAAUpB,MAAiB,KAAVK,EAAeL,EAAQS","file":"component---src-pages-search-tsx-4e425d476c467277f98e.js","sourcesContent":["import * as React from 'react';\nimport { useState } from 'react';\nimport { FontAwesomeIcon as Fa } from '@fortawesome/react-fontawesome';\nimport { faSearch } from '@fortawesome/free-solid-svg-icons';\n\nimport Layout from '../components/Layout';\nimport SEO from '../components/seo';\nimport { graphql } from 'gatsby';\nimport PostList from '../components/PostList';\nimport './styles/search.scss';\n\nexport interface SearchProps {\n  data: any;\n}\n\nconst Search = (props: SearchProps) => {\n  const { data } = props;\n  const posts = data.allMarkdownRemark.edges;\n\n  const [value, setValue] = useState('');\n  const [isTitleOnly, setIsTitleOnly] = useState(true);\n\n  const filteredPosts: any[] = posts.filter((post: any) => {\n    const { node } = post;\n    const { frontmatter, rawMarkdownBody } = node;\n    const { title } = frontmatter;\n    const lowerValue = value.toLocaleLowerCase();\n\n    if (!isTitleOnly && rawMarkdownBody.toLocaleLowerCase().includes(lowerValue)) return true;\n\n    return title.toLocaleLowerCase().includes(lowerValue);\n  });\n\n  return (\n    <Layout>\n      <SEO title=\"Search\" />\n      <div id=\"Search\">\n        <div className=\"search-inner-wrap\">\n          <div className=\"input-wrap\">\n            <Fa icon={faSearch} />\n            <input\n              type=\"text\"\n              name=\"search\"\n              id=\"searchInput\"\n              value={value}\n              placeholder=\"Search\"\n              autoComplete=\"off\"\n              autoFocus\n              onChange={(e: React.FormEvent<HTMLInputElement>) => {\n                setValue(e.currentTarget.value);\n              }}\n            />\n            <div className=\"search-toggle\">\n              <span\n                style={{ opacity: isTitleOnly ? 0.8 : 0.15 }}\n                onClick={() => {\n                  setIsTitleOnly(true);\n                }}\n              >\n                in Title\n              </span>\n              <span\n                style={{ opacity: !isTitleOnly ? 0.8 : 0.15 }}\n                onClick={() => {\n                  setIsTitleOnly(false);\n                }}\n              >\n                in Title+Content\n              </span>\n            </div>\n          </div>\n\n          {value !== '' && !filteredPosts.length ? <span className=\"no-result\">No search results</span> : null}\n          <PostList posts={value === '' ? posts : filteredPosts} />\n        </div>\n      </div>\n    </Layout>\n  );\n};\n\nexport const pageQuery = graphql`\n  query {\n    allMarkdownRemark(sort: { fields: [frontmatter___date], order: DESC }) {\n      edges {\n        node {\n          rawMarkdownBody\n          excerpt(format: PLAIN)\n          fields {\n            slug\n          }\n          frontmatter {\n            date(formatString: \"YYYY-MM-DD\")\n            title\n            tags\n            update(formatString: \"YYYY-MM-DD\")\n          }\n        }\n      }\n    }\n  }\n`;\n\nexport default Search;\n"],"sourceRoot":""}