From 9a72d6c09340205083344a7a041241128db37fcf Mon Sep 17 00:00:00 2001
From: Torjus <torjusti@gmail.com>
Date: Fri, 27 Jul 2018 11:24:13 +0200
Subject: [PATCH] Use button for adding files instead of raw input element

---
 app/lib/components/Chat/FileSharing.jsx | 21 ++++++++++++++++++++-
 1 file changed, 20 insertions(+), 1 deletion(-)

diff --git a/app/lib/components/Chat/FileSharing.jsx b/app/lib/components/Chat/FileSharing.jsx
index 63a60db..60bd479 100644
--- a/app/lib/components/Chat/FileSharing.jsx
+++ b/app/lib/components/Chat/FileSharing.jsx
@@ -32,6 +32,8 @@ class FileSharing extends Component
 	constructor(props)
 	{
 		super(props);
+
+		this.fileInput = React.createRef();
 	}
 
 	handleFileChange = (event) =>
@@ -42,10 +44,27 @@ class FileSharing extends Component
 		}
 	};
 
+	handleClick = () =>
+	{
+		// We want to open the file dialog when we click a button
+		// instead of actually rendering the input element itself.
+		this.fileInput.current.click();
+	};
+
 	render()
 	{
 		return (
-			<input type='file' onChange={this.handleFileChange} multiple />
+			<div>
+				<input
+					style={{ display: 'none' }}
+					ref={this.fileInput}
+					type='file'
+					onChange={this.handleFileChange}
+					multiple
+				/>
+
+				<button onClick={this.handleClick}>share file</button>
+			</div>
 		);
 	}
 }