From 7c5d605184cb1f9fe95b039da01e2b2b440fd0f6 Mon Sep 17 00:00:00 2001
From: Anton Korneyev <an.korn.zasekin@gmail.com>
Date: Sun, 2 Jul 2017 18:31:46 +0400
Subject: [PATCH 1/3] articles now an object, not array

---
 src/components/ArticleList.js    | 11 ++++++-----
 src/components/Filters/Select.js | 12 +++++++-----
 src/reducer/articles.js          | 13 +++++++++++--
 src/selectors/index.js           | 15 +++++++++++----
 4 files changed, 35 insertions(+), 16 deletions(-)

diff --git a/src/components/ArticleList.js b/src/components/ArticleList.js
index 24568b6..5bfb096 100644
--- a/src/components/ArticleList.js
+++ b/src/components/ArticleList.js
@@ -8,7 +8,7 @@ import {filtratedArticlesSelector} from '../selectors'
 class ArticleList extends Component {
     static propTypes = {
         //from connect
-        articles: PropTypes.array.isRequired,
+        articles: PropTypes.object.isRequired,
         //from accordion
         openItemId: PropTypes.string,
         toggleOpenItem: PropTypes.func.isRequired
@@ -17,11 +17,12 @@ class ArticleList extends Component {
     render() {
         console.log('---', 'update article list')
         const { articles, openItemId, toggleOpenItem } = this.props
-        const articleElements = articles.map(article => <li key={article.id}>
+        const articleElements = Object.keys(articles).map(key => 
+        <li key={key}>
             <Article
-                article = {article}
-                isOpen = {article.id === openItemId}
-                toggleOpen = {toggleOpenItem(article.id)}
+                article = {articles[key]}
+                isOpen = {key === openItemId}
+                toggleOpen = {toggleOpenItem(key)}
             />
         </li>)
 
diff --git a/src/components/Filters/Select.js b/src/components/Filters/Select.js
index fdd66aa..1a76d13 100644
--- a/src/components/Filters/Select.js
+++ b/src/components/Filters/Select.js
@@ -7,17 +7,19 @@ 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(key => {
+            return {
+                label: articles[key].title,
+                value: key
+            }
+        })
 
         return <Select
             options={options}
diff --git a/src/reducer/articles.js b/src/reducer/articles.js
index 087ac44..2b7f800 100644
--- a/src/reducer/articles.js
+++ b/src/reducer/articles.js
@@ -1,11 +1,20 @@
-import {normalizedArticles as defaultArticles} from '../fixtures'
+import {normalizedArticles} from '../fixtures'
 import {DELETE_ARTICLE} from '../constants'
 
+ const defaultArticles = normalizedArticles.reduce((acc, article) => {
+    acc[article.id] = article
+    return acc
+ }, {})
+
 export default (articleState = defaultArticles, action) => {
     const {type, payload} = action
 
+    articleState = Object.assign({}, articleState)
+
     switch (type) {
-        case DELETE_ARTICLE: return articleState.filter(article => article.id !== payload.id)
+        case DELETE_ARTICLE:
+            delete articleState[payload.id]
+            return articleState
     }
 
     return articleState
diff --git a/src/selectors/index.js b/src/selectors/index.js
index 876a588..811d3cc 100644
--- a/src/selectors/index.js
+++ b/src/selectors/index.js
@@ -9,11 +9,18 @@ export const filtratedArticlesSelector = createSelector(articlesGetter, filtersG
     const {selected, dateRange: {from, to}} = filters
     console.log('---', 'recomputing filtration')
 
-    return articles.filter(article => {
-        const published = Date.parse(article.date)
-        return (!selected.length || selected.includes(article.id)) &&
-            (!from || !to || (published > from && published < to))
+    const filtered = {}
+
+    Object.keys(articles).forEach((key) => {
+        const published = Date.parse(articles[key].date)
+
+        if ((!selected.length || selected.includes(articles[key])) &&
+        (!from || !to || (published > from && published < to))) {
+            filtered[key] = articles[key]
+        }
     })
+
+    return filtered
 })
 
 export const commentSelectorFactory = () => createSelector(commentsGetter, idGetter, (comments, id) => {

From 6ef34e6e287baf8015a39a4ec0974d7dfa9d1473 Mon Sep 17 00:00:00 2001
From: Anton Korneyev <an.korn.zasekin@gmail.com>
Date: Sun, 2 Jul 2017 20:45:24 +0400
Subject: [PATCH 2/3] made add comment feature

---
 src/AC/index.js                     | 13 ++++++++++++-
 src/components/Article/index.js     |  2 +-
 src/components/CommentForm/index.js |  9 +++++++--
 src/components/CommentList.js       |  9 +++++----
 src/constants.js                    |  4 +++-
 src/middlewares/idGenerator.js      | 25 +++++++++++++++++++++++++
 src/reducer/articles.js             |  5 ++++-
 src/reducer/comments.js             |  6 +++++-
 src/store/index.js                  |  3 ++-
 9 files changed, 64 insertions(+), 12 deletions(-)
 create mode 100644 src/middlewares/idGenerator.js

diff --git a/src/AC/index.js b/src/AC/index.js
index 67c4b5a..4cdf75b 100644
--- a/src/AC/index.js
+++ b/src/AC/index.js
@@ -1,4 +1,4 @@
-import {DELETE_ARTICLE, INCREMENT, CHANGE_DATE_RANGE, CHANGE_SELECTION} from '../constants'
+import {DELETE_ARTICLE, INCREMENT, CHANGE_DATE_RANGE, CHANGE_SELECTION, ADD_COMMENT} from '../constants'
 
 export function increment() {
     return {
@@ -26,3 +26,14 @@ export function changeSelection(selected) {
         payload: { selected }
     }
 }
+
+export function addComment(user, text, parentArticleId) {
+    return {
+        type: ADD_COMMENT,
+        payload: {
+            user,
+            text,
+            parentArticleId
+        }
+    }
+}
diff --git a/src/components/Article/index.js b/src/components/Article/index.js
index 0a744e7..9fb4a8b 100644
--- a/src/components/Article/index.js
+++ b/src/components/Article/index.js
@@ -69,7 +69,7 @@ class Article extends PureComponent {
             <section>
                {article.text}
                 <button onClick = {() => this.setState({updateIndex: this.state.updateIndex + 1})}>update</button>
-               <CommentList comments = {article.comments} ref = {this.setCommentsRef} key = {this.state.updateIndex}/>
+               <CommentList comments = {article.comments} articleId = {article.id} ref = {this.setCommentsRef} key = {this.state.updateIndex}/>
             </section>
         )
     }
diff --git a/src/components/CommentForm/index.js b/src/components/CommentForm/index.js
index 08b837f..6a582de 100644
--- a/src/components/CommentForm/index.js
+++ b/src/components/CommentForm/index.js
@@ -1,10 +1,14 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import './style.css'
+import {connect} from 'react-redux'
+import {addComment} from '../../AC'
 
 class CommentForm extends Component {
     static propTypes = {
-
+        articleId: PropTypes.string,
+        // from connect
+        addComment: PropTypes.func
     };
 
     state = {
@@ -28,6 +32,7 @@ class CommentForm extends Component {
 
     handleSubmit = ev => {
         ev.preventDefault()
+        this.props.addComment(this.state.user, this.state.text, this.props.articleId)
         this.setState({
             user: '',
             text: ''
@@ -57,4 +62,4 @@ const limits = {
     }
 }
 
-export default CommentForm
\ No newline at end of file
+export default connect(null, { addComment })(CommentForm)
\ No newline at end of file
diff --git a/src/components/CommentList.js b/src/components/CommentList.js
index 1071384..2997710 100644
--- a/src/components/CommentList.js
+++ b/src/components/CommentList.js
@@ -4,24 +4,25 @@ import Comment from './Comment'
 import CommentForm from './CommentForm'
 import toggleOpen from '../decorators/toggleOpen'
 
-function CommentList({comments = [], isOpen, toggleOpen}) {
+function CommentList({comments = [], isOpen, toggleOpen, articleId}) {
     const text = isOpen ? 'hide comments' : 'show comments'
     return (
         <div>
             <button onClick={toggleOpen}>{text}</button>
-            {getBody({comments, isOpen})}
+            {getBody({comments, isOpen, articleId})}
         </div>
     )
 }
 
 CommentList.propTypes = {
     comments: PropTypes.array,
+    articleId: PropTypes.string,
     //from toggleOpen decorator
     isOpen: PropTypes.bool,
     toggleOpen: PropTypes.func
 }
 
-function getBody({comments, isOpen}) {
+function getBody({comments, isOpen, articleId}) {
     if (!isOpen) return null
     if (!comments.length) return (
         <div>
@@ -35,7 +36,7 @@ function getBody({comments, isOpen}) {
             <ul>
                 {comments.map(id => <li key={id}><Comment id = {id}/></li>)}
             </ul>
-            <CommentForm/>
+            <CommentForm articleId = {articleId}/>
         </div>
     )
 }
diff --git a/src/constants.js b/src/constants.js
index c0eece7..54b4b2a 100644
--- a/src/constants.js
+++ b/src/constants.js
@@ -3,4 +3,6 @@ export const DELETE_ARTICLE = 'DELETE_ARTICLE'
 export const INCREMENT = 'INCREMENT'
 
 export const CHANGE_DATE_RANGE = 'CHANGE_DATE_RANGE'
-export const CHANGE_SELECTION = 'CHANGE_SELECTION'
\ No newline at end of file
+export const CHANGE_SELECTION = 'CHANGE_SELECTION'
+
+export const ADD_COMMENT = 'ADD_COMMENT'
\ No newline at end of file
diff --git a/src/middlewares/idGenerator.js b/src/middlewares/idGenerator.js
new file mode 100644
index 0000000..8f1e9ad
--- /dev/null
+++ b/src/middlewares/idGenerator.js
@@ -0,0 +1,25 @@
+import { ADD_COMMENT } from '../constants'
+
+export default store => next => action => {
+    const { type, payload } = action
+    const newAction = Object.assign({}, action)
+
+    if (type === ADD_COMMENT) {
+        newAction.payload.id = getId()
+    }
+
+    next(newAction)
+}
+
+function getId(min = 1000, max = 1000000) {
+    const id = '' + (Math.floor(Math.random() * (max - min)) + min)
+    
+    if(isFree(id)){
+        return id
+    }
+    return getId()
+}
+
+function isFree(id) {
+    return true
+}
\ No newline at end of file
diff --git a/src/reducer/articles.js b/src/reducer/articles.js
index 2b7f800..1a375e1 100644
--- a/src/reducer/articles.js
+++ b/src/reducer/articles.js
@@ -1,5 +1,5 @@
 import {normalizedArticles} from '../fixtures'
-import {DELETE_ARTICLE} from '../constants'
+import {DELETE_ARTICLE, ADD_COMMENT} from '../constants'
 
  const defaultArticles = normalizedArticles.reduce((acc, article) => {
     acc[article.id] = article
@@ -15,6 +15,9 @@ export default (articleState = defaultArticles, action) => {
         case DELETE_ARTICLE:
             delete articleState[payload.id]
             return articleState
+        case ADD_COMMENT:
+            articleState[payload.parentArticleId].comments.push(payload.id)
+            return articleState
     }
 
     return articleState
diff --git a/src/reducer/comments.js b/src/reducer/comments.js
index 9399bc3..f8bc1d0 100644
--- a/src/reducer/comments.js
+++ b/src/reducer/comments.js
@@ -1,5 +1,5 @@
 import {normalizedComments as defaulComments} from '../fixtures'
-import {} from '../constants'
+import {ADD_COMMENT} from '../constants'
 
 const commentsMap = defaulComments.reduce((acc, comment) => {
     acc[comment.id] = comment
@@ -10,6 +10,10 @@ export default (commentsState = commentsMap, action) => {
     const {type, payload} = action
 
     switch (type) {
+        case ADD_COMMENT:
+            const newState = Object.assign({}, commentsState)
+            newState[payload.id] = payload
+            return newState
     }
 
     return commentsState
diff --git a/src/store/index.js b/src/store/index.js
index 13f891d..3aeca58 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,8 +1,9 @@
 import {createStore, applyMiddleware} from 'redux'
 import reducer from '../reducer'
 import logger from '../middlewares/logger'
+import idGenerator from '../middlewares/idGenerator'
 
-const enhancer = applyMiddleware(logger)
+const enhancer = applyMiddleware(logger, idGenerator)
 
 const store = createStore(reducer, {}, enhancer)
 

From 55a5674d5d8b7f5e043d658ba49105ff4d0fa890 Mon Sep 17 00:00:00 2001
From: Anton Korneyev <an.korn.zasekin@gmail.com>
Date: Sun, 2 Jul 2017 21:27:26 +0400
Subject: [PATCH 3/3] fixed bug in filteredArticlesSelector logic

---
 src/components/Filters/Select.js | 10 ++++++----
 src/selectors/index.js           |  3 +--
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/Filters/Select.js b/src/components/Filters/Select.js
index 1a76d13..9c2ad23 100644
--- a/src/components/Filters/Select.js
+++ b/src/components/Filters/Select.js
@@ -14,13 +14,15 @@ class SelectFilter extends Component {
 
     render() {
         const { articles, selected } = this.props
-        const options = Object.keys(articles).map(key => {
-            return {
+
+        const options = []
+        Object.keys(articles).forEach(key => {
+            options.push({
                 label: articles[key].title,
                 value: key
-            }
+            })
         })
-
+        
         return <Select
             options={options}
             value={selected}
diff --git a/src/selectors/index.js b/src/selectors/index.js
index 811d3cc..7ed252a 100644
--- a/src/selectors/index.js
+++ b/src/selectors/index.js
@@ -14,12 +14,11 @@ export const filtratedArticlesSelector = createSelector(articlesGetter, filtersG
     Object.keys(articles).forEach((key) => {
         const published = Date.parse(articles[key].date)
 
-        if ((!selected.length || selected.includes(articles[key])) &&
+        if ((!selected.length || selected.includes(key)) &&
         (!from || !to || (published > from && published < to))) {
             filtered[key] = articles[key]
         }
     })
-
     return filtered
 })