{"version":3,"sources":["pages/Contact/index.js"],"names":["Contact","window","location"],"mappings":"qHA+PeA,UALf,WACE,OAAQC,OAAOC,SAAW","file":"static/js/18.37a471f5.chunk.js","sourcesContent":["{/*import { useState, useCallback, useRef } from 'react';\nimport classNames from 'classnames';\nimport { TransitionGroup, Transition } from 'react-transition-group';\nimport { Helmet } from 'react-helmet';\nimport Input from 'components/Input';\nimport DecoderText from 'components/DecoderText';\nimport Divider from 'components/Divider';\nimport { Button } from 'components/Button';\nimport Section from 'components/Section';\nimport Icon from 'components/Icon';\nimport Heading from 'components/Heading';\nimport Text from 'components/Text';\nimport { useScrollRestore, useFormInput, useRouteTransition } from 'hooks';\nimport { reflow, isVisible } from 'utils/transition';\nimport prerender from 'utils/prerender';\nimport { msToNum, numToPx, numToMs } from 'utils/style';\nimport { tokens } from 'components/ThemeProvider/theme';\nimport './index.css';\n\nconst initDelay = tokens.base.durationS;\n\nfunction getStatusError({\n  status,\n  errorMessage,\n  fallback = 'There was a problem with your request',\n}) {\n  if (status === 200) return false;\n\n  const statuses = {\n    500: 'There was a problem with the server, try again later',\n    404: 'There was a problem connecting to the server. Make sure you are connected to the internet',\n  };\n\n  if (errorMessage) {\n    return errorMessage;\n  }\n\n  return statuses[status] || fallback;\n}\n\nfunction getDelay(delayMs, initDelayMs = numToMs(0), multiplier = 1) {\n  const numDelay = msToNum(delayMs) * multiplier;\n  return { '--delay': numToMs((msToNum(initDelayMs) + numDelay).toFixed(0)) };\n}\n\nconst Contact = () => {\n  const { status } = useRouteTransition();\n  const errorRef = useRef();\n  const email = useFormInput('');\n  const message = useFormInput('');\n  const [sending, setSending] = useState(false);\n  const [complete, setComplete] = useState(false);\n  const [statusError, setStatusError] = useState('');\n  useScrollRestore();\n\n  const onSubmit = useCallback(\n    async event => {\n      event.preventDefault();\n      setStatusError('');\n\n      if (sending) return;\n\n      try {\n        setSending(true);\n\n        const response = await fetch('/api/message', {\n          method: 'POST',\n          mode: 'cors',\n          headers: {\n            'Content-Type': 'application/json',\n          },\n          body: JSON.stringify({\n            email: email.value,\n            message: message.value,\n          }),\n        });\n\n        const responseMessage = await response.json();\n\n        const statusError = getStatusError({\n          status: response?.status,\n          errorMessage: responseMessage?.error,\n          fallback: 'There was a problem sending your message',\n        });\n\n        if (statusError) throw new Error(statusError);\n\n        setComplete(true);\n        setSending(false);\n      } catch (error) {\n        setSending(false);\n        setStatusError(error.message);\n      }\n    },\n    [email.value, message.value, sending]\n  );\n\n  return (\n    <Section className={classNames('contact', `contact--${status}`)}>\n      <Helmet>\n        <title>Contact | Cody Bennett</title>\n        <meta\n          name=\"description\"\n          content=\"Send me a message if you’re interested in discussing a project or if you just want to say hi\"\n        />\n      </Helmet>\n      <TransitionGroup component={null}>\n        {!complete && (\n          <Transition appear mountOnEnter unmountOnExit timeout={1600} onEnter={reflow}>\n            {status => (\n              <form className=\"contact__form\" method=\"post\" onSubmit={onSubmit}>\n                <Heading\n                  className={classNames('contact__title', `contact__title--${status}`, {\n                    'contact__title--hidden': prerender,\n                  })}\n                  level={3}\n                  as=\"h1\"\n                  style={getDelay(tokens.base.durationXS, initDelay, 0.3)}\n                >\n                  <DecoderText\n                    text=\"Say hello\"\n                    start={status !== 'exited' && !prerender}\n                    delay={300}\n                  />\n                </Heading>\n                <Divider\n                  className={classNames(\n                    'contact__divider',\n                    `contact__divider--${status}`,\n                    { 'contact__divider--hidden': prerender }\n                  )}\n                  style={getDelay(tokens.base.durationXS, initDelay, 0.4)}\n                />\n                <Input\n                  required\n                  className={classNames('contact__input', `contact__input--${status}`, {\n                    'contact__input--hidden': prerender,\n                  })}\n                  style={getDelay(tokens.base.durationXS, initDelay)}\n                  autoComplete=\"email\"\n                  label=\"Your Email\"\n                  type=\"email\"\n                  maxLength={512}\n                  {...email}\n                />\n                <Input\n                  required\n                  multiline\n                  className={classNames('contact__input', `contact__input--${status}`, {\n                    'contact__input--hidden': prerender,\n                  })}\n                  style={getDelay(tokens.base.durationS, initDelay)}\n                  autoComplete=\"off\"\n                  label=\"Message\"\n                  maxLength={4096}\n                  {...message}\n                />\n                <TransitionGroup component={null}>\n                  {!!statusError && (\n                    <Transition timeout={msToNum(tokens.base.durationM)}>\n                      {errorStatus => (\n                        <div\n                          className={classNames(\n                            'contact__form-error',\n                            `contact__form-error--${errorStatus}`\n                          )}\n                          style={{\n                            '--height': isVisible(errorStatus)\n                              ? numToPx(errorRef.current?.getBoundingClientRect().height)\n                              : '0px',\n                          }}\n                        >\n                          <div className=\"contact__form-error-content\" ref={errorRef}>\n                            <div className=\"contact__form-error-message\">\n                              <Icon className=\"contact__form-error-icon\" icon=\"error\" />\n                              {statusError}\n                            </div>\n                          </div>\n                        </div>\n                      )}\n                    </Transition>\n                  )}\n                </TransitionGroup>\n                <Button\n                  className={classNames('contact__button', `contact__button--${status}`, {\n                    'contact__button--hidden': prerender,\n                    'contact__button--sending': sending,\n                  })}\n                  style={getDelay(tokens.base.durationM, initDelay)}\n                  disabled={sending}\n                  loading={sending}\n                  loadingText=\"Sending...\"\n                  icon=\"send\"\n                  type=\"submit\"\n                >\n                  Send Message\n                </Button>\n              </form>\n            )}\n          </Transition>\n        )}\n        {complete && (\n          <Transition appear mountOnEnter unmountOnExit onEnter={reflow} timeout={0}>\n            {status => (\n              <div className=\"contact__complete\" aria-live=\"polite\">\n                <Heading\n                  level={3}\n                  as=\"h3\"\n                  className={classNames(\n                    'contact__complete-title',\n                    `contact__complete-title--${status}`\n                  )}\n                >\n                  Message Sent\n                </Heading>\n                <Text\n                  size=\"l\"\n                  className={classNames(\n                    'contact__complete-text',\n                    `contact__complete-text--${status}`\n                  )}\n                  style={getDelay(tokens.base.durationXS)}\n                >\n                  I’ll get back to you within a couple days\n                </Text>\n                <Button\n                  secondary\n                  iconHoverShift\n                  className={classNames(\n                    'contact__complete-button',\n                    `contact__complete-button--${status}`\n                  )}\n                  style={getDelay(tokens.base.durationM)}\n                  href=\"/\"\n                  icon=\"chevronRight\"\n                >\n                  Back to homepage\n                </Button>\n              </div>\n            )}\n          </Transition>\n        )}\n      </TransitionGroup>\n    </Section>\n  );\n};\n\nexport default Contact;\n*/}\n\nfunction Contact() {\n  return (window.location = 'mailto:areebhammad@gmail.com');\n}\n<div onclick=\"sendEmail();\">Send e-mail</div>;\n\nexport default Contact;\n"],"sourceRoot":""}