From 17f809aecab5c1f5a25bf5382054807ad04cc023 Mon Sep 17 00:00:00 2001 From: Ivan Diaz Date: Sat, 3 Dec 2016 20:26:57 -0300 Subject: [PATCH] Ivan - Add articles in user dashboard [skip ci] --- client/src/app-components/articles-list.js | 7 +- client/src/app-components/topic-viewer.js | 18 +++-- client/src/app/Routes.js | 2 +- .../dashboard-article-page.js | 72 ++++++++++++++++++- .../dashboard-article-page.scss | 8 +++ .../dashboard-list-articles-page.js | 7 +- client/src/data/languages/en.js | 2 +- 7 files changed, 103 insertions(+), 13 deletions(-) create mode 100644 client/src/app/main/dashboard/dashboard-article/dashboard-article-page.scss diff --git a/client/src/app-components/articles-list.js b/client/src/app-components/articles-list.js index 716b0f8f..732e6ed7 100644 --- a/client/src/app-components/articles-list.js +++ b/client/src/app-components/articles-list.js @@ -16,6 +16,7 @@ class ArticlesList extends React.Component { static propTypes = { editable: React.PropTypes.bool, + articlePath: React.PropTypes.string, loading: React.PropTypes.bool, topics: React.PropTypes.array }; @@ -47,7 +48,11 @@ class ArticlesList extends React.Component { {this.props.topics.map((topic, index) => { return (
- +
); diff --git a/client/src/app-components/topic-viewer.js b/client/src/app-components/topic-viewer.js index 9a97ebbf..51273272 100644 --- a/client/src/app-components/topic-viewer.js +++ b/client/src/app-components/topic-viewer.js @@ -45,11 +45,7 @@ class TopicViewer extends React.Component { ); @@ -81,6 +77,16 @@ class TopicViewer extends React.Component { ); } + renderAddNewArticle() { + return ( +
  • + +
  • + ); + } + renderEditModal() { let props = { topicId: this.props.id, @@ -96,7 +102,7 @@ class TopicViewer extends React.Component { ); } - renderAddNewArticle() { + renderAddNewArticleModal() { let props = { topicId: this.props.id, position: this.props.articles.length, diff --git a/client/src/app/Routes.js b/client/src/app/Routes.js index 9406720d..86e8a7c3 100644 --- a/client/src/app/Routes.js +++ b/client/src/app/Routes.js @@ -66,7 +66,7 @@ export default ( - + diff --git a/client/src/app/main/dashboard/dashboard-article/dashboard-article-page.js b/client/src/app/main/dashboard/dashboard-article/dashboard-article-page.js index 15d5a134..a43ff5a5 100644 --- a/client/src/app/main/dashboard/dashboard-article/dashboard-article-page.js +++ b/client/src/app/main/dashboard/dashboard-article/dashboard-article-page.js @@ -1,14 +1,80 @@ import React from 'react'; +import _ from 'lodash'; +import {connect} from 'react-redux'; + +import ArticlesActions from 'actions/articles-actions'; +import SessionStore from 'lib-app/session-store'; +import i18n from 'lib-app/i18n'; +import DateTransformer from 'lib-core/date-transformer'; + +import Header from 'core-components/header'; +import Loading from 'core-components/loading'; class DashboardArticlePage extends React.Component { + static propTypes = { + topics: React.PropTypes.array, + loading: React.PropTypes.bool + }; + + static defaultProps = { + topics: [], + loading: true + }; + + componentDidMount() { + if(SessionStore.getItem('topics')) { + this.props.dispatch(ArticlesActions.initArticles()); + } else { + this.props.dispatch(ArticlesActions.retrieveArticles()); + } + } + render() { return ( -
    - DASHBOARD ARTICLE +
    + {(this.props.loading) ? : this.renderContent()}
    ); } + + renderContent() { + let article = this.findArticle(); + + return (article) ? this.renderArticlePreview(article) : i18n('ARTICLE_NOT_FOUND'); + } + + renderArticlePreview(article) { + return ( +
    +
    + +
    +
    +
    +
    + {i18n('LAST_EDITED_IN', {date: DateTransformer.transformToString(article.lastEdited)})} +
    +
    + ); + } + + findArticle() { + let article = null; + + _.forEach(this.props.topics, (topic) => { + if(!article) { + article = _.find(topic.articles, {id: this.props.params.articleId * 1}); + } + }); + + return article; + } } -export default DashboardArticlePage; +export default connect((store) => { + return { + topics: store.articles.topics, + loading: store.articles.loading + }; +})(DashboardArticlePage); diff --git a/client/src/app/main/dashboard/dashboard-article/dashboard-article-page.scss b/client/src/app/main/dashboard/dashboard-article/dashboard-article-page.scss new file mode 100644 index 00000000..b165a2cd --- /dev/null +++ b/client/src/app/main/dashboard/dashboard-article/dashboard-article-page.scss @@ -0,0 +1,8 @@ +.dashboard-article-page { + + &__last-edited { + font-style: italic; + text-align: right; + margin-top: 20px; + } +} \ No newline at end of file diff --git a/client/src/app/main/dashboard/dashboard-list-articles/dashboard-list-articles-page.js b/client/src/app/main/dashboard/dashboard-list-articles/dashboard-list-articles-page.js index 552b8198..b798d2c2 100644 --- a/client/src/app/main/dashboard/dashboard-list-articles/dashboard-list-articles-page.js +++ b/client/src/app/main/dashboard/dashboard-list-articles/dashboard-list-articles-page.js @@ -1,11 +1,16 @@ import React from 'react'; +import i18n from 'lib-app/i18n'; +import ArticlesList from 'app-components/articles-list'; +import Header from 'core-components/header'; + class DashboardListArticlesPage extends React.Component { render() { return (
    - DASHBOARD ARTICLES LIST +
    +
    ); } diff --git a/client/src/data/languages/en.js b/client/src/data/languages/en.js index b82c3b8d..1a865e33 100644 --- a/client/src/data/languages/en.js +++ b/client/src/data/languages/en.js @@ -42,7 +42,7 @@ export default { 'CUSTOM_RESPONSES': 'Custom Responses', 'LIST_USERS': 'List Users', 'BAN_USERS': 'Ban Users', - 'LIST_ARTICLES': 'List Articles', + 'LIST_ARTICLES': 'Article List', 'STAFF_MEMBERS': 'Staff Members', 'DEPARTMENTS': 'Departments', 'SYSTEM_PREFERENCES': 'System Preferences',