{"version":3,"sources":["webpack:///./src/pages/contact-us.js"],"names":["ContactUs","sites","data","allMysqlSites","edges","filter","node","is_active","sort","a","b","x","site_name","toLowerCase","y","recaptchaRef","useRef","finalValues","useState","msg","setMsg","isProcessing","setIsProcessing","msgSent","setMsgSent","serverError","setServerError","errType","setErrType","email","setEmail","friend","setFriend","validateForm","includes","handleFormSubmit","tok","FormData","append","current","fetch","API","SUPPORT","method","body","headers","XSRF","then","res","json","specialErrMsg","success","error","title","className","src","alt","action","href","htmlFor","type","id","value","onChange","e","target","name","cols","rows","map","site","key","mysqlId","ref","theme","badge","size","sitekey","onClick","preventDefault","execute"],"mappings":"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","file":"component---src-pages-contact-us-js-95141411307539cbbfc7.js","sourcesContent":["import React, { useRef, useState } from \"react\"\r\nimport { graphql } from \"gatsby\"\r\nimport Layout from \"../components/layout\"\r\nimport ContactSuccess from \"../components/contact-success\"\r\nimport SEO from \"../components/seo\"\r\nimport API from \"../constants/api\"\r\nimport ReCAPTCHA from \"react-google-recaptcha\"\r\nimport \"../contact.css\"\r\n\r\nconst ContactUs = ({ data }) => {\r\n  const sites = data.allMysqlSites.edges\r\n    .filter(node => node.node.is_active === \"y\")\r\n    .sort((a, b) => {\r\n      let x = a.node.site_name[0].toLowerCase()\r\n      let y = b.node.site_name[0].toLowerCase()\r\n      if (x < y) {\r\n        return -1\r\n      }\r\n      if (x > y) {\r\n        return 1\r\n      }\r\n      return 0\r\n    })\r\n\r\n  const recaptchaRef = useRef(null)\r\n  const finalValues = useRef(null)\r\n  const [msg, setMsg] = useState(\"\")\r\n  const [isProcessing, setIsProcessing] = useState(false)\r\n  const [msgSent, setMsgSent] = useState(false)\r\n  const [serverError, setServerError] = useState(\"\")\r\n  const [errType, setErrType] = useState(\"\")\r\n  const [email, setEmail] = useState(\"\")\r\n  const [friend, setFriend] = useState(\"\")\r\n  const handleSubmit = e => {\r\n    e.preventDefault()\r\n\r\n    const vali = validateForm()\r\n    if (vali) {\r\n      setIsProcessing(true)\r\n      setErrType(\"\")\r\n      finalValues.current = { msg: msg, email: email, friend: friend }\r\n      recaptchaRef.current.execute()\r\n    }\r\n  }\r\n  const validateForm = () => {\r\n    if (email === \"\" || !email.includes(\"@\") || !email.includes(\".\")) {\r\n      setErrType(\"email\")\r\n      return false\r\n    }\r\n\r\n    if (msg === \"\") {\r\n      setErrType(\"msg\")\r\n      return false\r\n    }\r\n\r\n    if (friend === \"\") {\r\n      setErrType(\"friend\")\r\n      return false\r\n    }\r\n\r\n    return true\r\n  }\r\n  const formSuccess = () => {\r\n    setMsgSent(true)\r\n  }\r\n  const fromHasError = specialErrMsg => {\r\n    setServerError(specialErrMsg)\r\n  }\r\n  const handleFormSubmit = tok => {\r\n    let data = new FormData()\r\n    data.append(\"email\", finalValues.current.email)\r\n    data.append(\"msg\", finalValues.current.msg)\r\n    data.append(\"friend\", finalValues.current.friend)\r\n    data.append(\"token\", tok)\r\n    fetch(`${API.SUPPORT}get_help.php`, {\r\n      method: \"POST\",\r\n      body: data,\r\n      headers: {\r\n        \"X-XSRF-Header\": API.XSRF,\r\n      },\r\n    })\r\n      .then(res => res.json())\r\n      .then(res => {\r\n        if (res.success) {\r\n          formSuccess()\r\n        } else {\r\n          fromHasError(res.error)\r\n        }\r\n      })\r\n  }\r\n  return (\r\n    <Layout>\r\n      <SEO title=\"Contact Us\" />\r\n      <div className=\"section_form\">\r\n        <div className=\"section_background\">\r\n          <img src={\"/af-bg.jpg\"} alt=\"\" />\r\n        </div>\r\n        <div className=\"block_form\">\r\n          <form action=\"#\">\r\n            <div className=\"block_form_wrapper\">\r\n              {msgSent ? (\r\n                <ContactSuccess />\r\n              ) : (\r\n                <>\r\n                  <div className=\"heading\">\r\n                    <h2 className=\"title\">\r\n                      Contact <strong>Us</strong>\r\n                    </h2>\r\n                    <p>\r\n                      The more we know about why you are contacting us, the\r\n                      better we can assist you. Please include as much detail as\r\n                      possible! If you're a member, please include the email\r\n                      address you signed up with, that is important. We will get\r\n                      back to you as soon as possible. You can try and{\" \"}\r\n                      <a href=\"/reset/\">reset your account</a> and login again\r\n                      to see if that clears up any issues.\r\n                      {serverError !== \"\" ? (\r\n                        <div className=\"errorServer\">\r\n                          ERROR: {serverError}, Please contact us directly{\" \"}\r\n                          <a href=\"mailto:service@addfriends.com\">\r\n                            service@addfriends.com\r\n                          </a>\r\n                        </div>\r\n                      ) : null}\r\n                    </p>\r\n                  </div>\r\n                  {serverError !== \"\" ? null : (\r\n                    <div className=\"field\">\r\n                      <div className=\"row\">\r\n                        <div className=\"wrap\">\r\n                          <label htmlFor=\"email\" className=\"label\">\r\n                            Email\r\n                          </label>\r\n                          <input\r\n                            type=\"email\"\r\n                            id=\"email\"\r\n                            className={\r\n                              errType === \"email\" ? \"input error\" : \"input\"\r\n                            }\r\n                            value={email}\r\n                            onChange={e => setEmail(e.target.value)}\r\n                          />\r\n                          {errType === \"email\" ? (\r\n                            <div className=\"errorMsg\">Error</div>\r\n                          ) : null}\r\n                        </div>\r\n                      </div>\r\n                      <div className=\"row\">\r\n                        <div className=\"wrap\">\r\n                          <label htmlFor=\"message\" className=\"label\">\r\n                            How can we help?\r\n                          </label>\r\n                          <textarea\r\n                            name=\"message\"\r\n                            id=\"message\"\r\n                            cols=\"30\"\r\n                            rows=\"10\"\r\n                            className={\r\n                              errType === \"msg\" ? \"textarea error\" : \"textarea\"\r\n                            }\r\n                            onChange={e => setMsg(e.target.value)}\r\n                            value={msg}\r\n                          ></textarea>\r\n                          {errType === \"msg\" ? (\r\n                            <div className=\"errorMsg msgErr\">Error</div>\r\n                          ) : null}\r\n                        </div>\r\n                      </div>\r\n                      <div className=\"row\">\r\n                        <div className=\"wrap\">\r\n                          <label htmlFor=\"message\" className=\"label\">\r\n                            What Friend?\r\n                          </label>\r\n                          <select\r\n                            className={\r\n                              errType === \"friend\"\r\n                                ? \"afSelect wError\"\r\n                                : \"afSelect\"\r\n                            }\r\n                            onChange={e => {\r\n                              setFriend(e.target.value)\r\n                            }}\r\n                          >\r\n                            <option value=\"\">PICK ONE</option>\r\n                            {sites.map(site => (\r\n                              <option\r\n                                value={site.node.site_name}\r\n                                key={`cu${site.node.mysqlId}`}\r\n                              >\r\n                                {site.node.site_name}\r\n                              </option>\r\n                            ))}\r\n                          </select>\r\n                        </div>\r\n                      </div>\r\n                      <div className=\"row\">\r\n                        <ReCAPTCHA\r\n                          ref={recaptchaRef}\r\n                          onChange={e =>\r\n                            handleFormSubmit(e, msg, email, friend)\r\n                          }\r\n                          theme=\"dark\"\r\n                          badge=\"inline\"\r\n                          size=\"invisible\"\r\n                          sitekey=\"6LdFnKgUAAAAAMMrHjMOzd42QrbFzhO-aO_Rme2k\"\r\n                        />\r\n                      </div>\r\n\r\n                      <div className=\"row\">\r\n                        <button\r\n                          className={\r\n                            isProcessing\r\n                              ? \"button_more processing\"\r\n                              : \"button_more\"\r\n                          }\r\n                          onClick={handleSubmit}\r\n                        >\r\n                          Submit\r\n                          <div className=\"nk-spinner\"></div>\r\n                        </button>\r\n                        {/* <button\r\n                          className=\"button_more\"\r\n                          //onClick={handleSubmit}\r\n                          onClick={e => {\r\n                            e.preventDefault()\r\n                            handleFormSubmit(\"faketok\")\r\n                          }}\r\n                        >\r\n                          Submit\r\n                        </button> */}\r\n                      </div>\r\n                    </div>\r\n                  )}\r\n                </>\r\n              )}\r\n            </div>\r\n          </form>\r\n        </div>\r\n      </div>\r\n    </Layout>\r\n  )\r\n}\r\n\r\nexport const pageQuerySucc = graphql`\r\n  query SuccQuery {\r\n    allMysqlSites {\r\n      edges {\r\n        node {\r\n          free_snapchat\r\n          site_name\r\n          is_active\r\n          site_url\r\n          mysqlId\r\n          sitestat {\r\n            likes\r\n            videos\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n`\r\n\r\nexport default ContactUs\r\n"],"sourceRoot":""}