diff --git a/src/AC/index.js b/src/AC/index.js
index dda2dd6..ee1f241 100644
--- a/src/AC/index.js
+++ b/src/AC/index.js
@@ -1,4 +1,4 @@
-import {INCREMENT, DELETE_ARTICLE, CHANGE_DATE_RANGE, CHANGE_SELECTION} from '../constants'
+import {INCREMENT, DELETE_ARTICLE, ADD_COMMENT, CHANGE_DATE_RANGE, CHANGE_SELECTION} from '../constants'
 
 export function increment() {
     return {
@@ -26,3 +26,10 @@ export function changeSelection(selected) {
         payload: { selected }
     }
 }
+
+export function addComment(text) {
+    return {
+        type: ADD_COMMENT,
+        payload: { text }
+    }
+}
diff --git a/src/components/article-list/index.js b/src/components/article-list/index.js
index f2cebc8..c5b5fdf 100644
--- a/src/components/article-list/index.js
+++ b/src/components/article-list/index.js
@@ -20,13 +20,13 @@ export class ArticleList extends Component {
 
     render() {
         const { articles, openItemId, toggleItem } = this.props
-        console.log('---', 'rendering ArticlList')
-        const articleElements = articles.map(article =>
-            <li key = {article.id} className = "test__article-list--item">
+        console.log('---', 'rendering ArticlList', articles)
+        const articleElements = articles.map(id =>
+            <li key = {id} className = "test__article-list--item">
                 <Article
-                    article = {article}
+                    id = {id}
                     onButtonClick = {toggleItem}
-                    isOpen = {openItemId === article.id}
+                    isOpen = {openItemId === id}
                 />
             </li>
         )
@@ -43,4 +43,4 @@ export default connect(state => {
     return {
         articles: filtratedArticles(state)
     }
-})(accordion(ArticleList))
\ No newline at end of file
+})(accordion(ArticleList))
diff --git a/src/components/article/index.js b/src/components/article/index.js
index 96261d8..6ec65e8 100644
--- a/src/components/article/index.js
+++ b/src/components/article/index.js
@@ -4,6 +4,7 @@ import CSSTransition from 'react-addons-css-transition-group'
 import { connect } from 'react-redux'
 import CommentList from '../comment-list'
 import { deleteArticle } from '../../AC'
+import { createArticleSelector } from '../../selectors'
 import './style.css'
 
 class Article extends PureComponent {
@@ -48,6 +49,10 @@ class Article extends PureComponent {
         )
     }
 
+    handleAdd = () => {
+
+    }
+
     handleDelete = () => {
         const { deleteArticle, article } = this.props
         deleteArticle(article.id)
@@ -73,4 +78,13 @@ Article.propTypes = {
     onButtonClick: PropTypes.func
 }
 
-export default connect(null, { deleteArticle })(Article)
\ No newline at end of file
+const createMapStateToProps = () => {
+    const articleSelector = createArticleSelector()
+
+    return (state, ownProps) => ({
+        article: articleSelector(state, ownProps)
+    })
+}
+
+
+export default connect(createMapStateToProps, { deleteArticle })(Article)
diff --git a/src/components/comment-list/index.js b/src/components/comment-list/index.js
index 91c4f08..f43a08c 100644
--- a/src/components/comment-list/index.js
+++ b/src/components/comment-list/index.js
@@ -1,12 +1,15 @@
-import React, {Component} from 'react'
+import React, {Component, Fragment} from 'react'
 import PropTypes from 'prop-types'
 import CSSTransition from 'react-addons-css-transition-group'
 import Comment from '../comment'
 import toggleOpen from '../../decorators/toggleOpen'
+import { addComment } from '../../AC'
+import { connect } from 'react-redux'
 import './style.css'
 
 class CommentList extends Component {
     static defaultProps = {
+        comment: '',
         comments: []
     }
 
@@ -17,6 +20,19 @@ class CommentList extends Component {
         toggleOpen: PropTypes.func
     }
 
+    handleAdd = () => {
+        const { comment } = this.state
+        const { addComment } = this.props
+        console.log('add', comment)
+        addComment(comment)
+        this.setState({comment: ''})
+    }
+
+    handleChange = (event) => {
+      console.log('change', event.target.value)
+      this.setState({comment: event.target.value})
+    }
+
     render() {
         const {isOpen, toggleOpen} = this.props
         const text = isOpen ? 'hide comments' : 'show comments'
@@ -30,6 +46,14 @@ class CommentList extends Component {
                 >
                     {this.getBody()}
                 </CSSTransition>
+
+                { isOpen && <Fragment>
+                    <textarea onChange = {this.handleChange} style={{ width: '100%'}} />
+                    <br/>
+                    <button onClick = {this.handleAdd}>
+                        add comment
+                    </button>
+                </Fragment> }
             </div>
         )
     }
@@ -50,6 +74,7 @@ class CommentList extends Component {
     }
 
     getComments() {
+      console.log('comments', this.props.comments)
         return (
             <ul>
                 {
@@ -63,5 +88,13 @@ class CommentList extends Component {
     }
 }
 
+const createMapStateToProps = (state, ownProps) => {
+  console.log('---', 'comnent list connect')
+  console.log('---', 'ownProps', ownProps)
+  return {
+      comments: ownProps.comments
+  }
+}
 
-export default toggleOpen(CommentList)
\ No newline at end of file
+// export default toggleOpen(CommentList)
+export default toggleOpen(connect(createMapStateToProps, { addComment })(CommentList))
diff --git a/src/components/counter.js b/src/components/counter.js
index b49ee19..345c5f2 100644
--- a/src/components/counter.js
+++ b/src/components/counter.js
@@ -29,4 +29,4 @@ const mapStateToProps = state => ({
     count: state.counter
 })
 
-export default connect(mapStateToProps)(Counter)
\ No newline at end of file
+export default connect(mapStateToProps)(Counter)
diff --git a/src/components/filters/select.js b/src/components/filters/select.js
index 1a91857..c8dccb3 100644
--- a/src/components/filters/select.js
+++ b/src/components/filters/select.js
@@ -8,16 +8,16 @@ import 'react-select/dist/react-select.css'
 
 class SelectFilter extends Component {
     static propTypes = {
-        articles: PropTypes.array.isRequired
+        articles: PropTypes.object.isRequired
     };
 
     handleChange = selected => this.props.changeSelection(selected.map(option => option.value))
 
     render() {
         const { articles, selected } = this.props
-        const options = articles.map(article => ({
-            label: article.title,
-            value: article.id
+        const options = Object.keys(articles).map(id => ({
+            label: articles[id].title,
+            value: id
         }))
 
         return <Select
@@ -32,4 +32,4 @@ class SelectFilter extends Component {
 export default connect(state => ({
     selected: state.filters.selected,
     articles: state.articles
-}), { changeSelection })(SelectFilter)
\ No newline at end of file
+}), { changeSelection })(SelectFilter)
diff --git a/src/constants/index.js b/src/constants/index.js
index a2f0a80..88cc994 100644
--- a/src/constants/index.js
+++ b/src/constants/index.js
@@ -1,6 +1,7 @@
 export const INCREMENT = 'INCREMENT'
 
 export const DELETE_ARTICLE = 'DELETE_ARTICLE'
+export const ADD_COMMENT = 'ADD_COMMENT'
 
 export const CHANGE_SELECTION = 'CHANGE_SELECTION'
-export const CHANGE_DATE_RANGE = 'CHANGE_DATE_RANGE'
\ No newline at end of file
+export const CHANGE_DATE_RANGE = 'CHANGE_DATE_RANGE'
diff --git a/src/fixtures.js b/src/fixtures.js
index 97eed41..ca39cb3 100644
--- a/src/fixtures.js
+++ b/src/fixtures.js
@@ -85,7 +85,7 @@ export const normalizedArticles = [
     {
         "id": "56c782f18990ecf954f6e027",
         "date": "2016-06-09T15:03:23.000Z",
-        "title": "Commodo qui incididunt",
+        "title": "Commodo qui incididunt 2",
         "text": "Commodo qui incididunt ex ut ea nulla et eu aliquip duis. Aute deserunt excepteur ullamco fugiat sunt aliquip exercitation do sint incididunt. Amet consectetur sint irure reprehenderit fugiat amet mollit. In commodo mollit ullamco cillum pariatur eiusmod cillum aute mollit. Culpa non sint eiusmod ad dolor velit dolore voluptate do adipisicing. Cupidatat sint est magna officia qui magna eu elit qui excepteur fugiat duis ex labore.\n\nAliquip veniam ad reprehenderit mollit exercitation id enim ut exercitation. Esse irure ipsum minim laborum reprehenderit irure ut. Tempor excepteur nisi nulla nostrud amet id cillum. Sint velit sint officia aliqua sint quis deserunt.\n\nAliquip dolor cillum deserunt enim nulla dolor amet irure cupidatat commodo laboris id aliqua. Labore aliqua adipisicing Lorem id adipisicing. Ad cupidatat et do anim ex commodo elit magna ad consequat. Nostrud sit eu laborum ut consequat fugiat aute culpa. Lorem tempor quis sunt ad consequat excepteur est. Enim voluptate cillum Lorem ex fugiat ea qui. Irure aute magna dolore eiusmod minim non ad anim dolore sint et.",
         "comments": ["qwerqwer", "lkjhsdlfkg", "zxcvzcxvzxcv", "fghjfghjfghj", "ertyoertywte"]
     },
@@ -137,7 +137,7 @@ export default [
     {
         "id": "56c782f18990ecf954f6e027",
         "date": "2016-06-09T15:03:23.000Z",
-        "title": "Commodo qui incididunt",
+        "title": "Commodo qui incididunt 4",
         "text": "Commodo qui incididunt ex ut ea nulla et eu aliquip duis. Aute deserunt excepteur ullamco fugiat sunt aliquip exercitation do sint incididunt. Amet consectetur sint irure reprehenderit fugiat amet mollit. In commodo mollit ullamco cillum pariatur eiusmod cillum aute mollit. Culpa non sint eiusmod ad dolor velit dolore voluptate do adipisicing. Cupidatat sint est magna officia qui magna eu elit qui excepteur fugiat duis ex labore.\n\nAliquip veniam ad reprehenderit mollit exercitation id enim ut exercitation. Esse irure ipsum minim laborum reprehenderit irure ut. Tempor excepteur nisi nulla nostrud amet id cillum. Sint velit sint officia aliqua sint quis deserunt.\n\nAliquip dolor cillum deserunt enim nulla dolor amet irure cupidatat commodo laboris id aliqua. Labore aliqua adipisicing Lorem id adipisicing. Ad cupidatat et do anim ex commodo elit magna ad consequat. Nostrud sit eu laborum ut consequat fugiat aute culpa. Lorem tempor quis sunt ad consequat excepteur est. Enim voluptate cillum Lorem ex fugiat ea qui. Irure aute magna dolore eiusmod minim non ad anim dolore sint et.",
         "comments": [
             {
@@ -269,4 +269,4 @@ export default [
         "text": "Commodo laborum sit nostrud reprehenderit cupidatat officia laboris. Ipsum minim culpa in enim. Voluptate dolor ea irure nisi incididunt enim magna.\n\nCupidatat quis cillum velit culpa tempor esse irure nostrud ea consectetur officia fugiat irure qui. Enim quis officia do in. Velit veniam ipsum consequat aliqua duis voluptate. Minim nisi ex aute ad.\n\nNisi Lorem ex tempor adipisicing labore. Quis occaecat fugiat pariatur labore culpa cillum laboris. Labore occaecat ut laborum sit ex do sit. Deserunt consectetur elit aute laboris est deserunt officia ullamco sit laboris officia aliquip. Aliqua ut sunt nostrud voluptate excepteur quis incididunt Lorem ut."
     }
 
-]
\ No newline at end of file
+]
diff --git a/src/middlewares/uuid.js b/src/middlewares/uuid.js
new file mode 100644
index 0000000..bffa20c
--- /dev/null
+++ b/src/middlewares/uuid.js
@@ -0,0 +1,14 @@
+export default store => next => action => {
+  let uuid
+
+  function s4() {
+    return Math.floor((1 + Math.random()) * 0x10000)
+      .toString(16)
+      .substring(1);
+  }
+  uuid = s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
+
+  action.payload.uuid = uuid;
+
+  next(action)
+}
diff --git a/src/reducer/articles.js b/src/reducer/articles.js
index 1c2e629..f654788 100644
--- a/src/reducer/articles.js
+++ b/src/reducer/articles.js
@@ -1,14 +1,26 @@
-import { normalizedArticles as defaultArticles } from '../fixtures'
-import { DELETE_ARTICLE } from '../constants'
+import {normalizedArticles} from '../fixtures'
+import { DELETE_ARTICLE, ADD_COMMENT } from '../constants'
+
+const defaultArticles = normalizedArticles.reduce((acc, article) => ({
+    ...acc,
+    [article.id]: article
+})
+, {})
 
 export default (articlesState = defaultArticles, action) => {
     const { type, payload } = action
 
+    console.log('ARTICLES', articlesState)
     switch (type) {
+        case ADD_COMMENT:
+            let id = Object.keys(articlesState)[0]
+            articlesState[id].comments.push(action.payload.uuid)
+            return articlesState
+
         case DELETE_ARTICLE:
             return articlesState.filter(article => article.id !== payload.id)
 
         default:
             return articlesState
     }
-}
\ No newline at end of file
+}
diff --git a/src/reducer/comments.js b/src/reducer/comments.js
index 0bd398a..b9503ae 100644
--- a/src/reducer/comments.js
+++ b/src/reducer/comments.js
@@ -1,4 +1,4 @@
-import {} from '../constants'
+import {ADD_COMMENT} from '../constants'
 import { normalizedComments } from '../fixtures'
 
 const defaultComments = normalizedComments.reduce((acc, comment) => ({
@@ -11,8 +11,16 @@ export default (commentsState = defaultComments, action) => {
     const {type} = action
 
     switch (type) {
+        case ADD_COMMENT:
+            let comment = {}
+            comment['id'] = action.payload.uuid
+            comment['text'] = action.payload.text
+            comment['user'] = 'USER1'
+            commentsState[action.payload.uuid] = comment
+            console.log('COMMENT STATE', commentsState)
+            return commentsState
 
         default:
             return commentsState
     }
-}
\ No newline at end of file
+}
diff --git a/src/reducer/index.js b/src/reducer/index.js
index c2bbd36..80d8a03 100644
--- a/src/reducer/index.js
+++ b/src/reducer/index.js
@@ -7,4 +7,4 @@ import filters from './filters'
 export default combineReducers({
     counter: counterReducer,
     articles, comments, filters
-})
\ No newline at end of file
+})
diff --git a/src/reducer/select.js b/src/reducer/select.js
new file mode 100644
index 0000000..a1efaef
--- /dev/null
+++ b/src/reducer/select.js
@@ -0,0 +1,7 @@
+import { CHANGE_SELECTED } from '../constants'
+
+export default (selectState = null, action) => {
+    const { type, payload } = action
+
+    return type === CHANGE_SELECTED ? payload.selection : selectState
+}
diff --git a/src/selectors/index.js b/src/selectors/index.js
index d503ae7..42e19a9 100644
--- a/src/selectors/index.js
+++ b/src/selectors/index.js
@@ -1,19 +1,22 @@
 import { createSelector } from 'reselect'
 
-const articleListSelector = state => state.articles
+const articlesSelector = state => state.articles
 const commentsSelector = state => state.comments
 const filtersSelector = state => state.filters
 const idSelector = (_, props) => props.id
 
-export const filtratedArticles = createSelector(articleListSelector, filtersSelector, (articles, filters) => {
+export const filtratedArticles = createSelector(articlesSelector, filtersSelector, (articles, filters) => {
     const {selected, dateRange: {from, to}} = filters
     console.log('---', 'recomputing filtration')
 
-    return articles.filter(article => {
+    return Object.keys(articles).filter(id => {
+        const article = articles[id]
         const published = Date.parse(article.date)
         return (!selected.length || selected.includes(article.id)) &&
             (!from || !to || (published > from && published < to))
     })
 })
 
-export const createCommentSelector = () => createSelector(commentsSelector, idSelector, (comments, id) => comments[id])
\ No newline at end of file
+export const createCommentSelector = () => createSelector(commentsSelector, idSelector, (comments, id) => comments[id])
+
+export const createArticleSelector = () => createSelector(articlesSelector, idSelector, (articles, id) => articles[id])
diff --git a/src/store/index.js b/src/store/index.js
index e3ddcc8..fa02f42 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,12 +1,13 @@
 import { createStore, applyMiddleware } from 'redux'
 import reducer from '../reducer'
 import logger from '../middlewares/logger'
+import uuid from '../middlewares/uuid'
 
-const enhancer = applyMiddleware(logger)
+const enhancer = applyMiddleware(logger, uuid)
 
 const store = createStore(reducer, enhancer)
 
 //dev only, no need in prod
 window.store = store
 
-export default store
\ No newline at end of file
+export default store