@@ -89,16 +89,4 @@ class TaskAdd extends Component {
}
}
-import { connect } from 'react-redux';
-import { addTask, addVersion, showAddTaskForm } from 'reduxApp/modules/tasks';
-
-import need from 'utils/need';
-
-export default connect(
- state => ({
- statuses: state.tasks.statuses,
- users: state.users.users,
- versions: state.tasks.versions,
- assignee: state.auth.user ? state.auth.user.id : null,
- })
-, { addTask, addVersion })(need(showAddTaskForm)(TaskAdd));
+export default TaskAddForm;
diff --git a/frontend/src/containers/TaskAdd/index.jsx b/frontend/src/containers/TaskAdd/index.jsx
new file mode 100644
index 0000000..2a37e15
--- /dev/null
+++ b/frontend/src/containers/TaskAdd/index.jsx
@@ -0,0 +1,25 @@
+import React, { Component } from 'react';
+import TaskAddForm from './TaskAddForm/';
+
+import { observer } from 'mobx-react';
+
+@observer(['taskAdd'])
+class TaskAdd extends Component {
+ componentDidMount() {
+ const {
+ params,
+ taskAdd,
+ } = this.props;
+
+ taskAdd.showPage(params);
+ }
+ render() {
+ return (
+
+
+
+ );
+ }
+}
+
+export default TaskAdd;
diff --git a/frontend/src/containers/TaskAdd/state.jsx b/frontend/src/containers/TaskAdd/state.jsx
new file mode 100644
index 0000000..0b8b660
--- /dev/null
+++ b/frontend/src/containers/TaskAdd/state.jsx
@@ -0,0 +1,35 @@
+import axios from 'axios';
+
+import { observable } from 'mobx';
+class Store {
+ @observable versions = [];
+ params = null;
+
+ showPage = (params) => {
+ this.params = params;
+ this.getAllVersions();
+ }
+
+ getAllVersions = () => {
+ return axios.get('/api/version')
+ .then(response => {
+ this.versions.replace(response.data);
+ });
+ }
+
+ addVersion = () => {
+ const title = prompt('Create new Version', '');
+ axios.post('/api/version', { title })
+ .then(() => this.getAllVersions());
+ }
+
+ addTask = (data) => {
+ const { projectId } = this.params;
+ axios.post('/api/tasks', data)
+ .then(() => {
+ window.location = `/projects/${projectId}/tasks`;
+ });
+ }
+}
+
+export default Store;
diff --git a/frontend/src/containers/TaskDetails/AddComentForm/index.jsx b/frontend/src/containers/TaskDetails/AddComentForm/index.jsx
new file mode 100644
index 0000000..d33fa69
--- /dev/null
+++ b/frontend/src/containers/TaskDetails/AddComentForm/index.jsx
@@ -0,0 +1,42 @@
+
+import React, { Component, PropTypes } from 'react';
+import { Button, Input } from 'react-bootstrap';
+
+import { observer } from 'mobx-react';
+
+@observer(['taskDetails'])
+class AddComentForm extends Component {
+
+ state = { value: '' }
+
+ static propTypes = {
+ addComment: PropTypes.func,
+ }
+
+ onChange = (e) => {
+ this.setState({ value: e.target.value });
+ }
+
+ addComment = () => {
+ this.props.taskDetails.addComment(this.props.taskId, this.state.value);
+ this.setState({ value: '' });
+ }
+
+ render() {
+ return (
+
+
+
+ );
+ }
+}
+
+export default AddComentForm;
diff --git a/frontend/src/containers/TaskDetails/CommentsList/index.jsx b/frontend/src/containers/TaskDetails/CommentsList/index.jsx
new file mode 100644
index 0000000..d6964db
--- /dev/null
+++ b/frontend/src/containers/TaskDetails/CommentsList/index.jsx
@@ -0,0 +1,35 @@
+
+import React, { PropTypes } from 'react';
+import { Button } from 'react-bootstrap';
+
+import { observer } from 'mobx-react';
+
+const CommentsList = observer(['taskDetails'], ({
+ taskDetails: { comments, deleteComment },
+ taskId,
+}) => (
+
+ {comments.map(comment => (
+
+
+ {comment.userName}
+
+
+
+
{comment.text}
+
+
+ ))}
+
+));
+
+CommentsList.propTypes = {
+ comments: PropTypes.array,
+ deleteComment: PropTypes.func,
+};
+
+export default CommentsList;
diff --git a/frontend/src/containers/TaskDetails/TaskInfo/index.jsx b/frontend/src/containers/TaskDetails/TaskInfo/index.jsx
new file mode 100644
index 0000000..7288fcc
--- /dev/null
+++ b/frontend/src/containers/TaskDetails/TaskInfo/index.jsx
@@ -0,0 +1,32 @@
+
+import React, { PropTypes } from 'react';
+import { Button } from 'react-bootstrap';
+
+import { observer } from 'mobx-react';
+
+const TaskInfo = observer(['taskDetails'], ({
+ taskDetails: { task: { title, description }, deleteTask },
+ projectId,
+}) => {
+ return (
+
+
+
{title}
+
+ {description}
+
+
+
+
+ );
+});
+
+
+TaskInfo.propTypes = {
+ task: PropTypes.object,
+ deleteTask: PropTypes.func,
+};
+
+export default TaskInfo;
+
+
diff --git a/frontend/src/containers/TaskDetails/index.jsx b/frontend/src/containers/TaskDetails/index.jsx
new file mode 100644
index 0000000..59d99c9
--- /dev/null
+++ b/frontend/src/containers/TaskDetails/index.jsx
@@ -0,0 +1,43 @@
+import React, { Component } from 'react';
+
+import TaskInfo from './TaskInfo/';
+import AddComentForm from './AddComentForm/';
+import CommentsList from './CommentsList/';
+
+import { observer } from 'mobx-react';
+
+@observer(['taskDetails'])
+class TaskDetails extends Component {
+ state = {
+ loading: true,
+ }
+
+ componentDidMount() {
+ const {
+ params,
+ taskDetails,
+ } = this.props;
+
+ taskDetails.showPage(params).then(() => {
+ this.setState({ loading: false });
+ });
+ }
+
+ render() {
+ const {
+ params: { projectId, id },
+ } = this.props;
+
+ return (
+
+ {!this.state.loading &&
}
+
+ );
+ }
+}
+
+export default TaskDetails;
diff --git a/frontend/src/containers/TaskDetails/state.jsx b/frontend/src/containers/TaskDetails/state.jsx
new file mode 100644
index 0000000..f88907a
--- /dev/null
+++ b/frontend/src/containers/TaskDetails/state.jsx
@@ -0,0 +1,49 @@
+
+import axios from 'axios';
+
+import { observable } from 'mobx';
+class Store {
+ @observable task = null;
+ @observable comments = [];
+
+ showPage = ({ id }) => {
+ return Promise.all([
+ this.loadComments(id),
+ this.loadTask(id),
+ ]);
+ }
+
+ loadTask = (id) => {
+ return axios.get(`/api/tasks/${id}`)
+ .then(response => {
+ this.task = response.data;
+ });
+ }
+
+ deleteTask = (projectId) => {
+ const { id } = this.task;
+ axios.delete(`/api/tasks/${id}`)
+ .then(() => {
+ window.location = `/projects/${projectId}/tasks`;
+ });
+ }
+
+ addComment = (taskId, text) => {
+ axios.post(`/api/tasks/${taskId}/comments`, { text, userName: 'vasa' })
+ .then(() => this.loadComments(taskId));
+ }
+
+ loadComments = (taskId) => {
+ return axios.get(`/api/tasks/${taskId}/comments/page/0/5`)
+ .then((response) => {
+ this.comments.replace(response.data.items);
+ });
+ }
+
+ deleteComment = (taskId, comment) => {
+ axios.delete(`/api/tasks/${taskId}/comments/${comment.id}`)
+ .then(() => this.loadComments(taskId));
+ }
+}
+
+export default Store;
diff --git a/frontend/src/containers/TasksList/TaskFilter/StatusSelect.jsx b/frontend/src/containers/TasksList/TaskFilter/StatusSelect.jsx
new file mode 100644
index 0000000..0413a39
--- /dev/null
+++ b/frontend/src/containers/TasksList/TaskFilter/StatusSelect.jsx
@@ -0,0 +1,22 @@
+
+import React from 'react';
+import Select from 'react-select';
+
+import { observer } from 'mobx-react';
+
+export const StatusSelect = observer(['taskList', 'app'], ({
+ taskList: { status, changeStatus },
+ app: { getStatusesOptions },
+}) => {
+ console.log('render status');
+ return (
+