diff --git a/client/homebrew/editor/metadataEditor/metadataEditor.jsx b/client/homebrew/editor/metadataEditor/metadataEditor.jsx
index 0f1f6ad54..6ee607eab 100644
--- a/client/homebrew/editor/metadataEditor/metadataEditor.jsx
+++ b/client/homebrew/editor/metadataEditor/metadataEditor.jsx
@@ -6,7 +6,7 @@ const _     = require('lodash');
 const request = require('../../utils/request-middleware.js');
 const Nav = require('naturalcrit/nav/nav.jsx');
 const Combobox = require('client/components/combobox.jsx');
-const StringArrayEditor = require('../stringArrayEditor/stringArrayEditor.jsx');
+const TagInput = require('../tagInput/tagInput.jsx');
 
 
 const Themes = require('themes/themes.json');
@@ -344,7 +344,7 @@ const MetadataEditor = createClass({
 				{this.renderThumbnail()}
 			</div>
 
-			<StringArrayEditor label='tags' valuePatterns={[/^(?:(?:group|meta|system|type):)?[A-Za-z0-9][A-Za-z0-9 \/.\-]{0,40}$/]}
+			<TagInput label='tags' valuePatterns={[/^(?:(?:group|meta|system|type):)?[A-Za-z0-9][A-Za-z0-9 \/.\-]{0,40}$/]}
 				placeholder='add tag' unique={true}
 				values={this.props.metadata.tags}
 				onChange={(e)=>this.handleFieldChange('tags', e)}/>
@@ -368,7 +368,7 @@ const MetadataEditor = createClass({
 
 			{this.renderAuthors()}
 
-			<StringArrayEditor label='invited authors' valuePatterns={[/.+/]}
+			<TagInput label='invited authors' valuePatterns={[/.+/]}
 				validators={[(v)=>!this.props.metadata.authors?.includes(v)]}
 				placeholder='invite author' unique={true}
 				values={this.props.metadata.invitedAuthors}
diff --git a/client/homebrew/editor/stringArrayEditor/stringArrayEditor.jsx b/client/homebrew/editor/tagInput/tagInput-class.jsx
similarity index 97%
rename from client/homebrew/editor/stringArrayEditor/stringArrayEditor.jsx
rename to client/homebrew/editor/tagInput/tagInput-class.jsx
index 8f06ae561..b7acf31d0 100644
--- a/client/homebrew/editor/stringArrayEditor/stringArrayEditor.jsx
+++ b/client/homebrew/editor/tagInput/tagInput-class.jsx
@@ -2,8 +2,8 @@ const React = require('react');
 const createClass = require('create-react-class');
 const _     = require('lodash');
 
-const StringArrayEditor = createClass({
-	displayName     : 'StringArrayEditor',
+const TagInput = createClass({
+	displayName     : 'TagInput',
 	getDefaultProps : function() {
 		return {
 			label         : '',
@@ -146,4 +146,4 @@ const StringArrayEditor = createClass({
 	}
 });
 
-module.exports = StringArrayEditor;
\ No newline at end of file
+module.exports = TagInput;
\ No newline at end of file
diff --git a/client/homebrew/editor/tagInput/tagInput.jsx b/client/homebrew/editor/tagInput/tagInput.jsx
new file mode 100644
index 000000000..289432175
--- /dev/null
+++ b/client/homebrew/editor/tagInput/tagInput.jsx
@@ -0,0 +1,21 @@
+const React = require('react');
+const { useState, useRef, useEffect } = React;
+const _     = require('lodash');
+
+const TagInput = ({unique, ...props})=>{
+
+	const [temporaryValue, setTemporaryValue] = useState('');
+
+	return (
+		<div className='field tag-input'>
+			<label>{props.label}
+				<input type='text'
+					className={`value`}
+					placeholder={props.placeholder}
+					value={temporaryValue} />
+			</label>
+		</div>
+	)
+}
+
+module.exports = TagInput;
\ No newline at end of file