Frontpage removed private feedback, added file uploader to contacts

src/components/composer.js

@@ -4,26 +4,10 @@ import Modal from './modal'
 
 import styles from './composer.module.css'
 
-function FileUploader({ onChange }) {
-  return (
-    <div className={styles.inputArea}>
-      <div className={styles.textTitle}>Fájl csatolása</div>
-      <input
-        className={styles.fileInput}
-        type="file"
-        name="file"
-        onChange={onChange}
-      />
-    </div>
-  )
-}
-
 export default function Composer({ onSubmit }) {
   const [editorShowing, setEditorShowing] = useState(false)
   const [val, setVal] = useState('')
-  const [type, setType] = useState('public')
   const [title, setTitle] = useState('')
-  const [file, setFile] = useState()
 
   return (
     <>
@@ -44,7 +28,6 @@ export default function Composer({ onSubmit }) {
           }}
         >
           <div className={styles.container}>
-            {type !== 'private' && (
             <input
               placeholder={'Téma...'}
               required
@@ -53,7 +36,6 @@ export default function Composer({ onSubmit }) {
                 setTitle(e.target.value)
               }}
             />
-            )}
             <textarea
               placeholder={'Írj ide valamit...'}
               required
@@ -62,50 +44,19 @@ export default function Composer({ onSubmit }) {
                 setVal(e.target.value)
               }}
             />
-            {type === 'private' && (
-              <FileUploader
-                onChange={(e) => {
-                  setFile(e.target.files[0])
-                }}
-              />
-            )}
-            <div id="radiolabel">
-              <p>
-                <b>A poszt típusa:</b>
-              </p>
-            </div>
-            <div className={styles.typeSelector}>
-              <div title="A főoldalon mindenki láthatja, reagálhat rá és kommentelhet alá">
-                <input
-                  onChange={(e) => {
-                    setType(e.target.value)
-                  }}
-                  type="radio"
-                  name="type"
-                  value="public"
-                  defaultChecked
-                />
-                Publikus
-              </div>
-              <div title="Csak admin bácsi látja">
-                <input
-                  onChange={(e) => {
-                    setType(e.target.value)
-                  }}
-                  type="radio"
-                  name="type"
-                  value="private"
-                />
-                Privát
-              </div>
-            </div>
-            <div className={styles.tip}>
-              <b>Tipp:</b> vidd a kurzort a poszt-típusok fölé több infóért!
-            </div>
             <div className={styles.composerAction}>
               <span
                 onClick={() => {
-                  onSubmit(type, title, val, file)
+                  if (!title) {
+                    alert('Üres a tartalom!')
+                    return
+                  }
+                  if (!val) {
+                    alert('Üres a téma!')
+                    return
+                  }
+
+                  onSubmit(title, val)
                   setEditorShowing(false)
                 }}
               >

src/components/composer.module.css

@@ -2,6 +2,7 @@
   display: flex;
   flex-flow: column;
   max-width: 400px;
+  width: 900px;
 }
 
 .container > input,

src/components/feedbackArea.js

@@ -3,8 +3,23 @@ import React, { useState } from 'react'
 import styles from './feedbackArea.module.css'
 import constants from '../constants.json'
 
-function submitFeedback(msg, from) {
+function FileUploader({ onChange }) {
+  return (
+    <div className={styles.inputArea}>
+      <div className={styles.textTitle}>Fájl csatolása</div>
+      <input
+        className={styles.fileInput}
+        type="file"
+        name="file"
+        onChange={onChange}
+      />
+    </div>
+  )
+}
+
+function submitFeedback(from, content, file) {
   return new Promise((resolve) => {
+    const promises = [
       fetch(constants.apiUrl + 'postfeedback', {
         method: 'POST',
         credentials: 'include',
@@ -13,29 +28,41 @@ function submitFeedback(msg, from) {
           'Content-Type': 'application/json',
         },
         body: JSON.stringify({
-        newTask: msg,
+          content: content,
           from: from,
         }),
+      }).then((res) => {
+        return res.json()
+      }),
+    ]
+
+    if (file) {
+      const formData = new FormData() // eslint-disable-line
+      formData.append('file', file)
+
+      promises.push(
+        fetch(constants.apiUrl + 'postfeedbackfile', {
+          method: 'POST',
+          credentials: 'include',
+          headers: {
+            Accept: 'application/json',
+          },
+          body: formData,
+        }).then((res) => {
+          return res.json()
         })
-      .then((resp) => {
-        return resp.json()
-      })
-      .then((resp) => {
-        if (resp.success) {
-          resolve()
-        } else {
-          alert('Hiba küldés közben!')
+      )
     }
-      })
-      .catch((err) => {
-        alert('Hiba küldés közben!')
-        console.error(err)
+
+    Promise.all(promises).then((res) => {
+      resolve(res)
     })
   })
 }
 
-export default function FeedbackArea({ from }) {
+export default function FeedbackArea({ from, allowFile }) {
   const [feedback, setFeedback] = useState('')
+  const [file, setFile] = useState()
 
   return (
     <div className={styles.inputArea}>
@@ -46,13 +73,22 @@ export default function FeedbackArea({ from }) {
           value={feedback}
           className={styles.contactFeedback}
         />
+        {allowFile && (
+          <div className={styles.fileContainer}>
+            <FileUploader
+              onChange={(e) => {
+                setFile(e.target.files[0])
+              }}
+            />
+          </div>
+        )}
       </center>
       <center>
         <div className={`${styles.send} buttonContainer`}>
           <div
             onClick={() => {
               if (feedback) {
-                submitFeedback(feedback, from).then(() => {
+                submitFeedback(from, feedback, file).then(() => {
                   alert('Üzenet elküldve!')
                   setFeedback('')
                 })

src/components/feedbackArea.module.css

@@ -18,3 +18,8 @@
 .inputArea {
   display: block;
 }
+
+.fileContainer {
+  width: 400px;
+  margin: 5px;
+}

src/pages/contact.js

@@ -47,7 +47,7 @@ export default function Contact() {
           bal alsó postaládába (📬 ikon) fog érkezni.
         </div>
       </div>
-      <FeedbackArea from={'contact'} />
+      <FeedbackArea from={'contact'} allowFile />
       <div className={styles.container}>
         {contacts ? (
           <>

src/pages/index.js

@@ -58,48 +58,6 @@ function addPost(title, content) {
   })
 }
 
-function postFeedback(content, file) {
-  return new Promise((resolve) => {
-    const promises = [
-      fetch(constants.apiUrl + 'postfeedback', {
-        method: 'POST',
-        credentials: 'include',
-        headers: {
-          Accept: 'application/json',
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({
-          content: content,
-        }),
-      }).then((res) => {
-        return res.json()
-      }),
-    ]
-
-    if (file) {
-      const formData = new FormData() // eslint-disable-line
-      formData.append('file', file)
-
-      promises.push(
-        fetch(constants.apiUrl + 'postfeedbackfile', {
-          method: 'POST',
-          credentials: 'include',
-          headers: {
-            Accept: 'application/json',
-          },
-          body: formData,
-        }).then((res) => {
-          return res.json()
-        })
-      )
-    }
-
-    Promise.all(promises).then((res) => {
-      resolve(res)
-    })
-  })
-}
-
 function updateForumPost(forum, postKey, postData) {
   return Object.keys(forum).reduce((acc, key) => {
     const entry = forum[key]
@@ -293,21 +251,7 @@ export default function Index({ globalData }) {
           <div className={styles.title}>Fórum/Hírek</div>
           <hr />
           <Composer
-            onSubmit={(type, title, content, file) => {
-              if (!content) {
-                alert('Üres a tartalom!')
-                return
-              }
-              if (type === 'private') {
-                postFeedback(content, file).then((res) => {
-                  console.log(res)
-                  alert('Privát visszajelzés elküldve!')
-                })
-              } else {
-                if (!title) {
-                  alert('Üres a téma!')
-                  return
-                }
+            onSubmit={(title, content) => {
               addPost(title, content).then((res) => {
                 const { success, newPostKey, newEntry, msg } = res
                 if (success) {
@@ -316,7 +260,6 @@ export default function Index({ globalData }) {
                   alert(msg)
                 }
               })
-              }
             }}
           />
           <div>{newsItems}</div>