From 394a98b42495bced130c646b5a65c052467d1e1d Mon Sep 17 00:00:00 2001
From: fernandomg <fernando.greco@gmail.com>
Date: Fri, 29 May 2020 21:43:56 -0300
Subject: [PATCH] create form error component

---
 .../FormErrorMessage/index.tsx                | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 src/routes/safe/components/Balances/SendModal/screens/ContractInteraction/FormErrorMessage/index.tsx

diff --git a/src/routes/safe/components/Balances/SendModal/screens/ContractInteraction/FormErrorMessage/index.tsx b/src/routes/safe/components/Balances/SendModal/screens/ContractInteraction/FormErrorMessage/index.tsx
new file mode 100644
index 00000000..9f259c69
--- /dev/null
+++ b/src/routes/safe/components/Balances/SendModal/screens/ContractInteraction/FormErrorMessage/index.tsx
@@ -0,0 +1,27 @@
+import { makeStyles } from '@material-ui/core/styles'
+import React from 'react'
+import { useFormState } from 'react-final-form'
+
+import Row from 'src/components/layout/Row'
+import Paragraph from 'src/components/layout/Paragraph'
+import { styles } from 'src/routes/safe/components/Balances/SendModal/screens/ContractInteraction/style'
+
+const useStyles = makeStyles(styles as any)
+
+const FormErrorMessage = () => {
+  const classes = useStyles()
+  const { modifiedSinceLastSubmit, submitError } = useFormState({
+    subscription: { modifiedSinceLastSubmit: true, submitError: true },
+  })
+
+  const hasNewSubmitError = !!submitError && !modifiedSinceLastSubmit
+  return hasNewSubmitError ? (
+    <Row align="center" className={classes.fullWidth} margin="xs">
+      <Paragraph color="error" noMargin size="md" style={{ letterSpacing: '-0.5px' }}>
+        {submitError}
+      </Paragraph>
+    </Row>
+  ) : null
+}
+
+export default FormErrorMessage