{"version":3,"sources":["webpack:///./src/components/SubscribeForm.tsx","webpack:///./src/pages/subscribe.tsx","webpack:///./src/components/Flex.tsx","webpack:///./src/components/Bold.ts"],"names":["ErrorMessage","styled","div","withConfig","displayName","componentId","Topic","label","SubscribeForm","_ref","disableEmail","_ref$displayedTopics","displayedTopics","_useFormikContext","useFormikContext","setFieldValue","errors","touched","t","useI18next","useEffect","getClientId","then","userId","topics","key","description","availableTopics","filter","topic","includes","React","createElement","Fragment","htmlFor","Trans","parent","style","margin","Input","type","name","disabled","className","email","pointerEvents","opacity","backgroundColor","firstName","map","Field","marginTop","marginRight","Flex","direction","Bold","Form","form","SubscribePage","_useI18next","language","_useState","useState","loading","setLoading","_useState2","error","setError","_useState3","success","setSuccess","formData","lastName","MonthlyNewsletter","PeriodicReminder","Announcements","unsubscribe","validationSchema","yup","shape","required","metaTitle","Helmet","charSet","content","Content","sx","padding","maxWidth","Formik","initialValues","onSubmit","formValues","values","Object","fromEntries","entries","v","push","NewBlogPost","fetch","links","pinpointApi","method","headers","body","JSON","stringify","assign","result","json","statusCode","message","setTimeout","finally","enableReinitialize","_ref2","handleSubmit","Button","variant","width","Loader","StyledP","color","colors","green","bottom","query","id","source","toString","this","StyledDiv","props","justifyContent","alignItems","gap","span"],"mappings":"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","file":"component---src-pages-subscribe-tsx-2d5efcb47f32659a6471.js","sourcesContent":["import {Field, useFormikContext} from 'formik';\nimport {Trans, useI18next} from 'gatsby-plugin-react-i18next';\nimport {Input} from './Field';\nimport {Flex} from './Flex';\nimport Bold from './Bold';\nimport React, {useEffect} from 'react';\nimport {getClientId} from 'utils/helpers';\nimport styled from 'styled-components';\nimport {TFunction} from 'i18next';\n\nexport type UserConfig = {\n  userId?: string;\n  email: string;\n  firstName: string;\n  lastName: string;\n  language: string;\n  MonthlyNewsletter: boolean;\n  PeriodicReminder: boolean;\n  Announcements: boolean;\n  unsubscribe: boolean;\n};\n\nconst ErrorMessage = styled.div`\n  color: #f5222d;\n  position: absolute;\n`;\nexport const availableTopics = (t: TFunction) => [\n  {\n    key: 'Announcements',\n    label: t('New product and feature announcements'),\n    description: t(\n      'Stay in the loop when we launch new products and features, including more payment methods.'\n    )\n  },\n  {\n    key: 'MonthlyNewsletter',\n    label: t('Monthly newsletter'),\n    description: t(\n      'You will receive a monthly newsletter with the latest blog articles, payment insights and trends, expert business tips, and MONEI news.'\n    )\n  },\n  {\n    key: 'PeriodicReminder',\n    label: t('Periodic reminder'),\n    description: t('You will periodically receive reminders about your application status.')\n  }\n];\n\nconst Topic = styled.label`\n  display: grid;\n  grid-template-columns: 20px 1fr;\n  align-items: baseline;\n`;\n\nexport const SubscribeForm: React.FC<{disableEmail?: boolean; displayedTopics?: string[]}> = ({\n  disableEmail,\n  displayedTopics = ['Announcements', 'MonthlyNewsletter', 'PeriodicReminder']\n}) => {\n  const {setFieldValue, errors, touched} = useFormikContext<UserConfig>();\n  const {t} = useI18next();\n\n  useEffect(() => {\n    getClientId().then((userId) => {\n      setFieldValue('userId', userId);\n    });\n  }, []);\n\n  const topics = availableTopics(t).filter((topic) => displayedTopics.includes(topic.key));\n\n  return (\n    <>\n      <label htmlFor=\"email\">\n        <Trans parent=\"p\" style={{margin: 0}}>\n          Email\n        </Trans>\n        <Input\n          type=\"text\"\n          name=\"email\"\n          disabled={disableEmail}\n          className={errors.email && touched.email ? 'has-error' : ''}\n          style={\n            disableEmail ? {pointerEvents: 'none', opacity: '0.75', backgroundColor: '#f7f7f7'} : {}\n          }\n        />\n        {touched.email && <ErrorMessage>{errors.email}</ErrorMessage>}\n      </label>\n\n      <label htmlFor=\"firstName\">\n        <Trans parent=\"p\" style={{margin: 0}}>\n          First name\n        </Trans>\n        <Input\n          type=\"text\"\n          className={errors.firstName && touched.firstName ? 'has-error' : ''}\n          name=\"firstName\"\n        />\n        {touched.firstName && <ErrorMessage>{errors.firstName}</ErrorMessage>}\n      </label>\n\n      <label htmlFor=\"lastName\">\n        <Trans parent=\"p\" style={{margin: 0}}>\n          Last name\n        </Trans>\n        <Input type=\"text\" name=\"lastName\" />\n      </label>\n\n      {topics.map((topic) => (\n        <Topic>\n          <Field type=\"checkbox\" name={topic.key} style={{marginTop: '6px', marginRight: '6px'}} />\n          <Flex direction=\"column\">\n            <Bold>{topic.label}</Bold>\n            <span>{topic.description}</span>\n          </Flex>\n        </Topic>\n      ))}\n    </>\n  );\n};\n","// i18next-extract-mark-ns-start subscribe\nimport {Content} from 'components/Content';\nimport {graphql} from 'gatsby';\n\nimport React, {useState} from 'react';\nimport {Formik} from 'formik';\nimport {Helmet, Trans, useI18next} from 'gatsby-plugin-react-i18next';\nimport {Button} from 'components/Button';\nimport styled from 'styled-components';\nimport {colors, links} from '../global.config';\nimport {Loader} from 'components/Loader';\nimport {StyledP} from 'components/StyledSx';\nimport * as yup from 'yup';\nimport {SubscribeForm, UserConfig} from 'components/SubscribeForm';\n\nconst Form = styled.form`\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n  align-items: flex-start;\n  justify-content: flex-start;\n  label {\n    width: 100%;\n  }\n`;\nconst ErrorMessage = styled.div`\n  color: #f5222d;\n`;\nconst SubscribePage: React.FC = () => {\n  const {t, language} = useI18next();\n  const [loading, setLoading] = useState(false);\n  const [error, setError] = useState('');\n  const [success, setSuccess] = useState('');\n\n  const formData = {\n    userId: '',\n    email: '',\n    firstName: '',\n    lastName: '',\n    language,\n    MonthlyNewsletter: false,\n    PeriodicReminder: false,\n    Announcements: false,\n    unsubscribe: false\n  };\n\n  const validationSchema = yup.object().shape({\n    email: yup\n      .string()\n      .email(t('Please, enter a correct email'))\n      .required(t('Please, enter an email')),\n    firstName: yup.string().required(t('Please, enter your name'))\n  });\n\n  const onSubmit = (formValues: any) => {\n    setSuccess('');\n    const values = Object.fromEntries(\n      Object.entries(formValues).filter(([_, v]) => v !== null && v !== '')\n    );\n\n    const topics = [];\n    if (values.MonthlyNewsletter) {\n      topics.push('MonthlyNewsletter');\n    }\n    if (values.NewBlogPost) {\n      topics.push('NewBlogPost');\n    }\n    if (values.PeriodicReminder) {\n      topics.push('PeriodicReminder');\n    }\n    if (values.Announcements) {\n      topics.push('Announcements');\n    }\n\n    setLoading(true);\n    if (!values.userId) delete values.userId;\n    fetch(links.pinpointApi + `user/subscribe`, {\n      method: 'POST',\n      headers: {\n        'Content-Type': 'application/json'\n      },\n      body: JSON.stringify({...values, topics, language})\n    })\n      .then((result) => result.json())\n\n      .then((result) => {\n        if (result.statusCode >= 400) {\n          setError(result.message);\n          return;\n        }\n        setSuccess(t('Thanks for subscribing!'));\n        setLoading(false);\n        setTimeout(() => {\n          setSuccess('');\n        }, 3000);\n      })\n      .finally(() => {\n        setLoading(false);\n      });\n  };\n\n  const metaTitle = t('Subscribe to our newsletter');\n\n  return (\n    <>\n      <Helmet>\n        <meta charSet=\"utf-8\" />\n        <title>{metaTitle} | MONEI</title>\n        <meta name=\"robots\" content=\"noindex,nofollow\" />\n      </Helmet>\n      <Content sx={{padding: '0 20px', maxWidth: '624px', margin: '60px auto 120px'}}>\n        <Trans parent=\"h1\">Subscribe to our newsletter</Trans>\n\n        <Formik<UserConfig>\n          initialValues={formData}\n          onSubmit={onSubmit}\n          enableReinitialize\n          validationSchema={validationSchema}>\n          {({handleSubmit}) => (\n            <Form onSubmit={handleSubmit}>\n              <SubscribeForm displayedTopics={['Announcements', 'MonthlyNewsletter']} />\n              <Button type=\"submit\" variant=\"light\" style={{width: '100%'}}>\n                {loading ? <Loader /> : <Trans>Subscribe</Trans>}\n              </Button>\n              {success && (\n                <div>\n                  <StyledP sx={{color: colors.green, bottom: '0', margin: '0'}}>{success}</StyledP>\n                </div>\n              )}\n              {error && <ErrorMessage>{error}</ErrorMessage>}\n            </Form>\n          )}\n        </Formik>\n      </Content>\n    </>\n  );\n};\n\nexport default SubscribePage;\n\nexport const query = graphql`\n  query ($language: String!) {\n    locales: allLocale(filter: {ns: {in: [\"subscribe\", \"common\"]}, language: {eq: $language}}) {\n      edges {\n        node {\n          ns\n          data\n          language\n        }\n      }\n    }\n  }\n`;\n","import styled from 'styled-components';\nimport {StyledDiv} from './StyledSx';\n\ninterface FlexProps {\n  direction?: 'row' | 'column';\n  justifyContent?:\n    | 'flex-start'\n    | 'flex-end'\n    | 'center'\n    | 'space-between'\n    | 'space-around'\n    | 'space-evenly';\n  alignItems?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around';\n  gap?: number;\n}\n\nexport const Flex = styled(StyledDiv)<FlexProps>`\n  display: flex;\n  flex-direction: ${(props) => props.direction || 'row'};\n  justify-content: ${(props) => props.justifyContent || 'flex-start'};\n  align-items: ${(props) => props.alignItems || 'flex-start'};\n  grid-gap: ${(props) => props.gap || 0}px;\n`;\n","import styled from 'styled-components';\n\nexport default styled.span`\n  font-weight: 600;\n`;\n"],"sourceRoot":""}