From 774adf9baa203588e1c0f7943a826377f5fa8369 Mon Sep 17 00:00:00 2001
From: Mary Kate <mk@marykatefain.com>
Date: Tue, 28 Jul 2020 21:30:35 -0500
Subject: [PATCH] update reason or joining form to simpletextarea

---
 app/soapbox/features/forms/index.js                        | 2 +-
 .../features/landing_page/components/registration_form.js  | 7 ++++---
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/app/soapbox/features/forms/index.js b/app/soapbox/features/forms/index.js
index 24857c33f..471a173f8 100644
--- a/app/soapbox/features/forms/index.js
+++ b/app/soapbox/features/forms/index.js
@@ -70,7 +70,7 @@ LabelInput.propTypes = {
 
 export const LabelTextarea = ({ label, dispatch, ...props }) => (
   <LabelInputContainer label={label}>
-    <intextarea {...props} />
+    <textarea {...props} />
   </LabelInputContainer>
 );
 
diff --git a/app/soapbox/features/landing_page/components/registration_form.js b/app/soapbox/features/landing_page/components/registration_form.js
index 2b172910c..0d6a9db71 100644
--- a/app/soapbox/features/landing_page/components/registration_form.js
+++ b/app/soapbox/features/landing_page/components/registration_form.js
@@ -9,6 +9,7 @@ import {
   SimpleForm,
   SimpleInput,
   TextInput,
+  SimpleTextarea,
   Checkbox,
 } from 'soapbox/features/forms';
 import { register } from 'soapbox/actions/auth';
@@ -24,7 +25,6 @@ const messages = defineMessages({
   confirm: { id: 'registration.fields.confirm_placeholder', defaultMessage: 'Password (again)' },
   agreement: { id: 'registration.agreement', defaultMessage: 'I agree to the {tos}.' },
   tos: { id: 'registration.tos', defaultMessage: 'Terms of Service' },
-  reason: { id: 'registration.reason', defaultMessage: 'Reason for Joining' },
 });
 
 const mapStateToProps = (state, props) => ({
@@ -138,8 +138,9 @@ class RegistrationForm extends ImmutablePureComponent {
                 required
               />
               {instance.get('approval_required') &&
-                <TextInput
-                  placeholder={intl.formatMessage(messages.reason)}
+                <SimpleTextarea
+                  label={<FormattedMessage id='registration.reason' defaultMessage='Why do you want to join?' />}
+                  hint={<FormattedMessage id='registration.reason_hint' defaultMessage='This will help us review your application' />}
                   name='reason'
                   maxLength={500}
                   autoComplete='off'