Disable submits if values missing

packages/concordia-app/src/components/PostCreate/index.jsx

@@ -28,8 +28,6 @@ const PostCreate = (props) => {
   const [postSubject, setPostSubject] = useState(initialPostSubject);
   const [postContent, setPostContent] = useState('');
   const [userProfilePictureUrl, setUserProfilePictureUrl] = useState();
-  const [postSubjectInputEmptySubmit, setPostSubjectInputEmptySubmit] = useState(false);
-  const [postContentInputEmptySubmit, setPostContentInputEmptySubmit] = useState(false);
   const [createPostCacheSendStackId, setCreatePostCacheSendStackId] = useState('');
   const [posting, setPosting] = useState(false);
   const [storingPost, setStoringPost] = useState(false);
@@ -102,8 +100,6 @@ const PostCreate = (props) => {
             setPostContent('');
             setPosting(false);
             setStoringPost(false);
-            setPostSubjectInputEmptySubmit(false);
-            setPostContentInputEmptySubmit(false);
             setCreatePostCacheSendStackId('');
           })
           .catch((reason) => {
@@ -119,13 +115,7 @@ const PostCreate = (props) => {
   ]);
 
   const savePost = useCallback(() => {
-    if (postSubject === '') {
+    if (postSubject === '' || postContent === '') {
-      setPostSubjectInputEmptySubmit(true);
-      return;
-    }
-
-    if (postContent === '') {
-      setPostContentInputEmptySubmit(true);
       return;
     }
 
@@ -161,7 +151,6 @@ const PostCreate = (props) => {
                             name="postSubject"
                             className="subject-input"
                             size="mini"
-                            error={postSubjectInputEmptySubmit}
                             value={postSubject}
                             onChange={handleInputChange}
                           />
@@ -175,10 +164,8 @@ const PostCreate = (props) => {
                           <TextArea
                             placeholder={t('post.form.content.field.placeholder')}
                             name="postContent"
-                            className="content-input"
                             size="mini"
                             rows={4}
-                            error={postContentInputEmptySubmit}
                             value={postContent}
                             onChange={handleInputChange}
                           />

packages/concordia-app/src/views/Topic/TopicCreate/index.jsx

@@ -23,8 +23,6 @@ const TopicCreate = (props) => {
   const transactions = useSelector((state) => state.transactions);
   const [subjectInput, setSubjectInput] = useState('');
   const [contentInput, setContentInput] = useState('');
-  const [topicSubjectInputEmptySubmit, setTopicSubjectInputEmptySubmit] = useState(false);
-  const [topicMessageInputEmptySubmit, setTopicMessageInputEmptySubmit] = useState(false);
   const [createTopicCacheSendStackId, setCreateTopicCacheSendStackId] = useState('');
   const [posting, setPosting] = useState(false);
 
@@ -88,13 +86,7 @@ const TopicCreate = (props) => {
   }, [createTopicCacheSendStackId, history, contentInput, posting, subjectInput, transactionStack, transactions]);
 
   const validateAndPost = useCallback(() => {
-    if (subjectInput === '') {
+    if (subjectInput === '' || contentInput === '') {
-      setTopicSubjectInputEmptySubmit(true);
-      return;
-    }
-
-    if (contentInput === '') {
-      setTopicMessageInputEmptySubmit(true);
       return;
     }
 
@@ -114,7 +106,6 @@ const TopicCreate = (props) => {
                     placeholder={t('topic.create.form.subject.field.placeholder')}
                     name="subjectInput"
                     className="form-input"
-                    error={topicSubjectInputEmptySubmit}
                     value={subjectInput}
                     onChange={handleSubjectInputChange}
                   />
@@ -126,9 +117,6 @@ const TopicCreate = (props) => {
                   <TextArea
                     id="form-topic-create-field-message"
                     name="contentInput"
-                    className={topicMessageInputEmptySubmit
-                      ? 'form-textarea-required'
-                      : ''}
                     value={contentInput}
                     placeholder={t('topic.create.form.content.field.placeholder')}
                     rows={5}
@@ -142,7 +130,7 @@ const TopicCreate = (props) => {
                     key="form-topic-create-button-submit"
                     type="button"
                     color="green"
-                    disabled={posting}
+                    disabled={posting || subjectInput === '' || contentInput === ''}
                     onClick={validateAndPost}
                   >
                       <Button.Content visible>