1 files changed, 40 insertions, 6 deletions
diff --git a/frontend/app/views/index/components/graph.form.js b/frontend/app/views/index/components/graph.form.js
index 4b3a7af..5710beb 100644
--- a/frontend/app/views/index/components/graph.form.js
+++ b/frontend/app/views/index/components/graph.form.js
@@ -10,6 +10,9 @@ const newGraph = () => ({
   title: '',
   username: session('username'),
   description: '',
+  settings: {
+    custom_header: "",
+  }
 })
 
 export default class GraphForm extends Component {
@@ -20,6 +23,14 @@ export default class GraphForm extends Component {
     errorFields: new Set([]),
   }
 
+  constructor(props){
+    super(props)
+    this.handleChange = this.handleChange.bind(this)
+    this.handleSettingsChange = this.handleSettingsChange.bind(this)
+    this.handleSettingsSelect = this.handleSettingsSelect.bind(this)
+    this.handleSubmit = this.handleSubmit.bind(this)
+  }
+
   componentDidMount() {
     const { data, isNew } = this.props
     const title = isNew ? 'new project' : 'editing ' + data.title
@@ -54,6 +65,23 @@ export default class GraphForm extends Component {
     })
   }
 
+  handleSettingsChange(e) {
+    const { name, value } = e.target
+    this.handleSettingsSelect(name, value)
+  }
+
+  handleSettingsSelect(name, value) {
+    this.setState({
+      data: {
+        ...this.state.data,
+        settings: {
+          ...this.state.data.settings,
+          [name]: value,
+        }
+      }
+    })
+  }
+
   handleSelect(name, value) {
     const { errorFields } = this.state
     if (errorFields.has(name)) {
@@ -73,7 +101,7 @@ export default class GraphForm extends Component {
     const { isNew, onSubmit } = this.props
     const { data } = this.state
     const requiredKeys = "title username path description".split(" ")
-    const validKeys = "title username path description".split(" ")
+    const validKeys = "title username path description settings".split(" ")
     const validData = validKeys.reduce((a,b) => { a[b] = data[b]; return a }, {})
     const errorFields = requiredKeys.filter(key => !validData[key])
     if (errorFields.length) {
@@ -104,7 +132,7 @@ export default class GraphForm extends Component {
             required
             data={data}
             error={errorFields.has('path')}
-            onChange={this.handleChange.bind(this)}
+            onChange={this.handleChange}
             autoComplete="off"
           />
           <LabelDescription>
@@ -118,7 +146,7 @@ export default class GraphForm extends Component {
             required
             data={data}
             error={errorFields.has('title')}
-            onChange={this.handleChange.bind(this)}
+            onChange={this.handleChange}
             autoComplete="off"
           />
           <TextInput
@@ -127,18 +155,24 @@ export default class GraphForm extends Component {
             required
             data={data}
             error={errorFields.has('username')}
-            onChange={this.handleChange.bind(this)}
+            onChange={this.handleChange}
             autoComplete="off"
           />
           <TextArea
             title="Description"
             name="description"
             data={data}
-            onChange={this.handleChange.bind(this)}
+            onChange={this.handleChange}
+          />
+          <TextArea
+            title="Header tags"
+            name="custom_header"
+            data={data.settings}
+            onChange={this.handleSettingsChange}
           />
           <SubmitButton
             title={submitTitle}
-            onClick={this.handleSubmit.bind(this)}
+            onClick={this.handleSubmit}
           />
           {!!errorFields.size &&
             <label>