feat: add divlo.fr

components/Contact/FormState.tsx

@@ -0,0 +1,39 @@
+import useTranslation from 'next-translate/useTranslation'
+
+export interface FormStateProps extends React.ComponentPropsWithRef<'p'> {
+  state: 'success' | 'error' | 'loading'
+  children: string
+}
+
+export const FormState: React.FC<FormStateProps> = props => {
+  const { state, children, ...rest } = props
+  const { t } = useTranslation()
+
+  return (
+    <>
+      <div className='form-result text-center'>
+        <p className={state} {...rest}>
+          {['error', 'success'].includes(state) && (
+            <b>
+              {state === 'error' ? t('home:contact.error') : t('home:contact.success')}:
+            </b>
+          )}{' '}
+          {children}
+        </p>
+      </div>
+
+      <style jsx>{`
+        .form-result {
+          margin: 30px;
+        }
+        .success {
+          color: #90ee90;
+        }
+        .error {
+          color: #ff7f7f;
+        }
+      `}
+      </style>
+    </>
+  )
+}