fix: error message

new-lamassu-admin/src/pages/LoyaltyPanel/CouponCodes.js

@@ -60,22 +60,27 @@ const Coupons = () => {
     refetchQueries: () => ['coupons']
   })
 
-  const addCoupon = async (code, discount) => {
+  const addCoupon = (code, discount) => {
     setErrorMsg(null)
-    const res = await createCoupon({
+    createCoupon({
       variables: { code: code, discount: discount }
     })
+      .then(res => {
+        if (!res.errors) {
+          return setShowModal(false)
+        } else {
+          const duplicateCouponError = res.errors.some(e => {
+            return e.message.includes('duplicate')
+          })
 
-    if (!res.errors) {
-      return setShowModal(false)
-    }
-
-    const duplicateCouponError = res.errors.some(e => {
-      return e.message.includes('duplicate')
-    })
-
-    if (duplicateCouponError)
-      setErrorMsg('There is already a coupon with that code!')
+          if (duplicateCouponError)
+            setErrorMsg('There is already a coupon with that code!')
+        }
+      })
+      .catch(err => {
+        setErrorMsg('Failed to save')
+        console.log(err)
+      })
   }
 
   const elements = [

new-lamassu-admin/src/pages/LoyaltyPanel/CouponCodes.styles.js

@@ -7,7 +7,9 @@ import {
 
 const styles = {
   footer: {
-    margin: [['auto', 0, spacer * 3, 'auto']]
+    display: 'flex',
+    flexDirection: 'row',
+    margin: [['auto', 0, spacer * 3, 0]]
   },
   modalLabel1: {
     marginTop: 20
@@ -40,6 +42,9 @@ const styles = {
     display: 'flex',
     flexDirection: 'column',
     height: '100%'
+  },
+  submit: {
+    margin: [['auto', 0, 0, 'auto']]
   }
 }
 

new-lamassu-admin/src/pages/LoyaltyPanel/CouponCodesModal.js

@@ -4,6 +4,7 @@ import * as R from 'ramda'
 import React from 'react'
 import * as Yup from 'yup'
 
+import ErrorMessage from 'src/components/ErrorMessage'
 import Modal from 'src/components/Modal'
 import { Tooltip } from 'src/components/Tooltip'
 import { Button } from 'src/components/buttons'
@@ -50,9 +51,8 @@ const CouponCodesModal = ({ showModal, onClose, errorMsg, addCoupon }) => {
           <Formik
             initialValues={initialValues}
             validationSchema={validationSchema}
-            onSubmit={({ code, discount }, { resetForm }) => {
+            onSubmit={({ code, discount }) => {
               handleAddCoupon(code, discount)
-              resetForm()
             }}>
             <Form id="coupon-form" className={classes.form}>
               <H3 className={classes.modalLabel1}>Coupon code name</H3>
@@ -93,9 +93,12 @@ const CouponCodesModal = ({ showModal, onClose, errorMsg, addCoupon }) => {
                   %
                 </TL1>
               </div>
-              <span className={classes.error}>{errorMsg}</span>
               <div className={classes.footer}>
-                <Button type="submit" form="coupon-form">
+                {errorMsg && <ErrorMessage>{errorMsg}</ErrorMessage>}
+                <Button
+                  type="submit"
+                  form="coupon-form"
+                  className={classes.submit}>
                   Add coupon
                 </Button>
               </div>