1 files changed, 28 insertions, 61 deletions
diff --git a/client/components/Tasks/TaskFormView.jsx b/client/components/Tasks/TaskFormView.jsx
index 078f7c7..36660de 100644
--- a/client/components/Tasks/TaskFormView.jsx
+++ b/client/components/Tasks/TaskFormView.jsx
@@ -3,70 +3,37 @@ import { Link } from 'react-router-dom'
 
 import client from '../../client.js'
 
-export default class TaskForm extends Component {
-  constructor(props) {
-    super()
-    this.state = {
-      name: '',
-    }
-    this.updateState = this.updateState.bind(this)
-    this.handleSubmit = this.handleSubmit.bind(this)
-  }
-  updateState(event){
-    const name = event.target.name
-    let value = event.target.value
-    console.log(name, value)
-    this.setState({
-      [name]: value,
-      error: null,
-    })
-  }
-  updateAlpha(event){
-    const name = event.target.name
-    let value = event.target.value
-    console.log(name, value)
-    this.setState({
-      alphaValue: value,
-      alpha: '1e' + value,
-      error: null,
-    })
-  }
-  handleSubmit(event) {
-    event.preventDefault()
-    let rec = Object.assign({}, this.state)
-    delete rec.error
-    this.props.onClose()
-    client.folder.create( rec ).then( (data) => {
-      this.props.addFolder( data )
-    })
-  }
-  render() {
-    return (
-      <div class='form'>
-        <div>
+export default function TaskFormView (props) {
+  console.log(props)
+  return (
+    <div class='form'>
+      <div>
+        {props.content && (
           <div>
-            <img />
-            {this.state.content}
+            {props.content.name}
           </div>
-          <label>content</label>
-          <button onclick={() => this.setState({ content: null })}>x</button>
-        </div>
-        <div>
+        )}
+        <label>content</label>
+        <button onClick={props.clearContent}>x</button>
+      </div>
+      <div>
+        {props.style && (
           <div>
-          {this.state.style}
+            {props.style.name}
           </div>
-          <label>style</label>
-          <button onclick={() => this.setState({ style: null })}>x</button>
-        </div>
-        <div>
-          <input type='range' min='0' max='100' value={this.state.alphaValue}
-            onChange={(e) => this.updateAlpha(e)}
-          />
-          {this.state.alphaString}
-          <label>alpha</label>
-          <button onClick={this.handleSubmit}>Create</button>
-        </div>
+        )}
+        <label>style</label>
+        <button onClick={props.clearStyle}>x</button>
+      </div>
+      <div>
+        <input type='range' step='0.01' min='0.001' max='1' value={props.alpha}
+          onInput={(e) => props.setAlpha(e.target.value)}
+        />
+        alpha: {props.alpha}
+      </div>
+      <div>
+        <button onClick={props.createTask}>Create</button>
       </div>
-    )
-  }
+    </div>
+  )
 }