client/src/components/CategoriesTooltip.js
changeset 168 ea92f4fe783d
parent 167 1f340f3597a8
child 169 f98efa1bddd1
--- a/client/src/components/CategoriesTooltip.js	Tue Oct 09 19:07:47 2018 +0200
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,71 +0,0 @@
-import React, { Component } from 'react';
-
-class CategoriesTooltip extends Component {
-
-  state = {
-    activeCategory: null,
-    showCommentControl: false
-  }
-
-  componentDidUpdate = () => {
-    if (this.state.showCommentControl) {
-      this.commentControl.focus();
-    }
-  }
-
-  isCategoryActive = (category) => {
-    return this.state.activeCategory && this.state.activeCategory.key === category.key
-  }
-
-  onButtonClick = (category) => {
-    if (category.hasOwnProperty('hasComment') && category.hasComment === true) {
-      this.setState({
-        activeCategory: this.state.activeCategory ? null : category,
-        showCommentControl: !this.state.showCommentControl
-      })
-    } else {
-      if (typeof this.props.onCategoryClick === 'function') {
-        this.props.onCategoryClick(category)
-      }
-    }
-  }
-
-  onSubmit = (e) => {
-    e.preventDefault();
-    if (this.state.showCommentControl) {
-      const comment = this.commentControl.value;
-      const { activeCategory } = this.state;
-      Object.assign(activeCategory, { comment: comment });
-      if (typeof this.props.onCategoryClick === 'function') {
-        this.props.onCategoryClick(activeCategory)
-      }
-    }
-  }
-
-  render() {
-    return (
-      <div className="categories-tooltip">
-        <form onSubmit={ this.onSubmit }>
-          <div className="form-group buttons">
-          {this.props.categories.map((category) =>
-            <button type="button"
-              key={ category.name }
-              className="btn btn-sm text-secondary"
-              style={{ backgroundColor: category.color }}
-              active={ this.isCategoryActive(category)  }
-              onClick={ this.onButtonClick.bind(this, category) }>{ category.name }</button>
-          )}
-          </div>
-          {this.state.showCommentControl &&
-          <div className="form-group">
-            <input className="form-control"
-            // inputRef={(ref) => { this.commentControl = ref; }}
-            ref={(commentControl) => { this.commentControl = commentControl; }}/>
-          </div>}
-        </form>
-      </div>
-    );
-  }
-}
-
-export default CategoriesTooltip