From 7d3e123bf1ab310bf51f437c29cb2c0ec31cf95b Mon Sep 17 00:00:00 2001
From: Matthias Kretschmann <m@kretschmann.io>
Date: Wed, 13 Feb 2019 12:30:05 +0100
Subject: [PATCH] use hidden input to collect files array

---
 src/routes/Publish/Files/index.tsx | 17 ++++++++++++++---
 src/routes/Publish/index.tsx       |  6 ++++--
 2 files changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/routes/Publish/Files/index.tsx b/src/routes/Publish/Files/index.tsx
index 1f774ea..6b582ef 100644
--- a/src/routes/Publish/Files/index.tsx
+++ b/src/routes/Publish/Files/index.tsx
@@ -9,7 +9,9 @@ import styles from './index.module.scss'
 interface FilesProps {
     files: string[]
     placeholder: string
-    help: string
+    help?: string
+    name: string
+    onChange: any
     // resetForm: any
 }
 
@@ -40,11 +42,20 @@ export default class Files extends PureComponent<FilesProps, FilesStates> {
 
     public render() {
         const { isFormShown } = this.state
-        const { files, help, placeholder } = this.props
+        const { files, help, placeholder, name, onChange } = this.props
 
         return (
             <>
-                <Help>{help}</Help>
+                {help && <Help>{help}</Help>}
+
+                {/* Use hidden input to collect files */}
+                <input
+                    type="hidden"
+                    name={name}
+                    value={files}
+                    onChange={onChange}
+                />
+
                 <div className={styles.newItems}>
                     {files.length > 0 && (
                         <TransitionGroup
diff --git a/src/routes/Publish/index.tsx b/src/routes/Publish/index.tsx
index 20a5055..ea66641 100644
--- a/src/routes/Publish/index.tsx
+++ b/src/routes/Publish/index.tsx
@@ -67,8 +67,10 @@ class Publish extends Component<{}, PublishState> {
                         </Label>
                         <Files
                             placeholder={value.placeholder}
+                            name={value.name}
                             help={value.help}
                             files={this.state.files}
+                            onChange={onChange}
                         />
                     </Row>
                 )
@@ -95,7 +97,7 @@ class Publish extends Component<{}, PublishState> {
         event: ChangeEvent<HTMLInputElement> | ChangeEvent<HTMLSelectElement>
     ) => {
         this.setState({
-            [event.target.name]: event.target.value
+            [event.currentTarget.name]: event.currentTarget.value
         })
     }
 
@@ -103,7 +105,7 @@ class Publish extends Component<{}, PublishState> {
         event: ChangeEvent<HTMLInputElement> | ChangeEvent<HTMLSelectElement>
     ) => {
         this.setState({
-            [event.target.name]: [event.target.value]
+            [event.currentTarget.name]: [event.currentTarget.value]
         })
     }