PropTypes: comments

src/components/post/wrapper.js

@@ -17,12 +17,13 @@
  */
 import React from 'react';
 
+import { CommentsByCategory as CommentsByCategoryPropType } from '../../prop-types/comments';
+
 import bem from '../../utils/bemClassNames';
 import PostFooter from './footer';
 import Preview from './preview';
 import Comments from './comments';
 
-
 const PostWrapper = ({
   users,
   comments,
@@ -69,4 +70,8 @@ const PostWrapper = ({
   );
 };
 
+PostWrapper.propTypes = {
+  comments: CommentsByCategoryPropType.isRequired
+};
+
 export default PostWrapper;

src/components/river_of_posts.js

@@ -18,6 +18,8 @@
 import React, { PropTypes } from 'react';
 import { isUndefined } from 'lodash';
 
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
+
 import * as PostTypes  from '../consts/postTypeConstants';
 import { ShortTextPost, PostWrapper } from './post';
 import TagLikePost from './tag-like-post';
@@ -80,7 +82,7 @@ const RiverOfPostsComponent = (props) => {
 RiverOfPostsComponent.displayName = 'RiverOfPostsComponent';
 
 RiverOfPostsComponent.propTypes = {
-  comments: PropTypes.shape({}).isRequired,
+  comments: CommentsByCategoryPropType.isRequired,
   river: PropTypes.arrayOf(PropTypes.string),
   ui: PropTypes.shape({}).isRequired
 };

src/pages/geotag.js

@@ -26,6 +26,7 @@ import {
   mapOf as mapOfPropType
 } from '../prop-types/common';
 import { Posts as PostsPropType } from '../prop-types/posts';
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
 import { GeotagsMap as GeotagsMapPropType } from '../prop-types/geotags';
 import { SchoolsMap as SchoolsMapPropType } from '../prop-types/schools';
 
@@ -46,6 +47,7 @@ export class GeotagPage extends Component {
   static displayName = 'GeotagPage';
 
   static propTypes = {
+    comments: CommentsByCategoryPropType.isRequired,
     geotag_posts: mapOfPropType(urlPropType, PostsPropType).isRequired,
     geotags: GeotagsMapPropType.isRequired,
     params: PropTypes.shape({

src/pages/list.js

@@ -21,6 +21,7 @@ import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import Helmet from 'react-helmet';
 
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
 import { SchoolsMap as SchoolsMapPropType } from '../prop-types/schools';
 
 import VisibilitySensor from '../components/visibility-sensor';
@@ -59,6 +60,7 @@ export class List extends React.Component {
   static displayName = 'List';
 
   static propTypes = {
+    comments: CommentsByCategoryPropType.isRequired,
     create_post_form: PropTypes.shape({
       text: PropTypes.string.isRequired
     }),

src/pages/post.js

@@ -22,7 +22,12 @@ import Gravatar from 'react-gravatar';
 import { truncate } from 'grapheme-utils';
 import { Link } from 'react-router';
 
-import { uuid4 as uuid4PropType } from '../prop-types/common';
+import {
+  uuid4 as uuid4PropType,
+  mapOf as mapOfPropType
+} from '../prop-types/common';
+import { Posts as PostsPropType } from '../prop-types/posts';
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
 import { PostsMap as PostsMapPropType } from '../prop-types/posts';
 
 import {
@@ -49,10 +54,12 @@ import { URL_NAMES, getUrl } from '../utils/urlGenerator';
 
 export class PostPage extends React.Component {
   static propTypes = {
+    comments: CommentsByCategoryPropType.isRequired,
     params: PropTypes.shape({
       uuid: uuid4PropType.isRequired
     }).isRequired,
-    posts: PostsMapPropType.isRequired
+    posts: PostsMapPropType.isRequired,
+    related_posts: mapOfPropType(uuid4PropType, PostsPropType)
   };
 
   static async fetchData(params, store, client) {
@@ -64,27 +71,38 @@ export class PostPage extends React.Component {
   }
 
   render() {
-    const post_uuid = this.props.params.uuid;
-
-    if (!(post_uuid in this.props.posts)) {
+    const {
+      comments,
+      current_user,
+      is_logged_in,
+      params,
+      posts,
+      related_posts,
+      ui,
+      users
+    } = this.props;
+
+    const post_uuid = params.uuid;
+
+    if (!(post_uuid in posts)) {
       // not loaded yet
       return <script />;
     }
 
-    const current_post = this.props.posts[post_uuid];
+    const current_post = posts[post_uuid];
 
     if (current_post === false) {
       return <NotFound />;
     }
 
-    const author = this.props.users[current_post.user_id];
+    const author = users[current_post.user_id];
 
     const client = new ApiClient(API_HOST);
     const triggers = new ActionsTrigger(client, this.props.dispatch);
 
-    const relatedPostIds = this.props.related_posts[current_post.id];
+    const relatedPostIds = related_posts[current_post.id];
     const relatedPosts = (relatedPostIds)
-                         ? relatedPostIds.map(id => this.props.posts[id])
+                         ? relatedPostIds.map(id => posts[id])
                          : null;
 
     const authorUrl = getUrl(URL_NAMES.USER, { username: author.username });
@@ -97,7 +115,7 @@ export class PostPage extends React.Component {
     return (
       <div>
         <Helmet title={`${current_post.more.pageTitle} on `} />
-        <Header is_logged_in={this.props.is_logged_in} current_user={this.props.current_user}>
+        <Header is_logged_in={is_logged_in} current_user={current_user}>
           <HeaderLogo small />
           <Breadcrumbs title={truncate(current_post.text, { length: 16 })}>
             <Link
@@ -111,17 +129,17 @@ export class PostPage extends React.Component {
         </Header>
 
         <Page>
-          <Sidebar current_user={this.props.current_user} />
+          <Sidebar current_user={current_user} />
           <PageMain>
             <PageBody>
               <PageContent>
                 <PostWrapper
                   author={author}
-                  current_user={this.props.current_user}
-                  users={this.props.users}
+                  current_user={current_user}
+                  users={users}
                   post={current_post}
-                  comments={this.props.comments}
-                  ui={this.props.ui}
+                  comments={comments}
+                  ui={ui}
                   showAllComments
                   triggers={triggers}
                 >
@@ -130,10 +148,10 @@ export class PostPage extends React.Component {
               </PageContent>
               <SidebarAlt>
                 <RelatedPosts
-                  current_user={this.props.current_user}
+                  current_user={current_user}
                   posts={relatedPosts}
                   triggers={triggers}
-                  users={this.props.users}
+                  users={users}
                 />
               </SidebarAlt>
             </PageBody>

src/pages/school.js

@@ -29,6 +29,7 @@ import {
   Posts as PostsPropType,
   PostsMap as PostsMapPropType
 } from '../prop-types/posts';
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
 import { SchoolsMap as SchoolsMapPropType } from '../prop-types/schools';
 
 import { resetCreatePostForm, updateCreatePostForm } from '../actions/posts';
@@ -45,6 +46,7 @@ import { TAG_SCHOOL } from '../consts/tags';
 
 export class SchoolPage extends React.Component {
   static propTypes = {
+    comments: CommentsByCategoryPropType.isRequired,
     params: PropTypes.shape({
       school_name: PropTypes.string.isRequired
     }),

src/pages/tag.js

@@ -26,6 +26,7 @@ import {
   mapOf as mapOfPropType
 } from '../prop-types/common';
 import { Posts as PostsPropType } from '../prop-types/posts';
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
 import { HashtagsMap as HashtagsMapPropType } from '../prop-types/hashtags';
 import { SchoolsMap as SchoolsMapPropType } from '../prop-types/schools';
 
@@ -45,6 +46,7 @@ export class TagPage extends Component {
   static displayName = 'TagPage';
 
   static propTypes = {
+    comments: CommentsByCategoryPropType.isRequired,
     hashtags: HashtagsMapPropType.isRequired,
     params: PropTypes.shape({
       tag: PropTypes.string.isRequired
@@ -79,6 +81,7 @@ export class TagPage extends Component {
 
   render() {
     const {
+      comments,
       is_logged_in,
       current_user,
       posts,
@@ -89,8 +92,7 @@ export class TagPage extends Component {
       params,
       hashtags,
       schools,
-      ui,
-      comments
+      ui
     } = this.props;
 
     const client = new ApiClient(API_HOST);

src/pages/user-favorites.js

@@ -20,9 +20,12 @@ import { connect } from 'react-redux';
 import _ from 'lodash';
 import Helmet from 'react-helmet';
 
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
+
 import NotFound from './not-found';
 import BaseUserFavoritesPage from './base/user';
 import River from '../components/river_of_posts';
+
 import ApiClient from '../api/client';
 import { API_HOST } from '../config';
 import { addUser } from '../actions/users';
@@ -34,6 +37,10 @@ import { defaultSelector } from '../selectors';
 class UserFavoritesPage extends React.Component {
   static displayName = 'UserFavoritesPage';
 
+  static propTypes = {
+    comments: CommentsByCategoryPropType.isRequired
+  };
+
   static async fetchData(params, store, client) {
     const userInfo = await client.userInfo(params.username);
     store.dispatch(addUser(userInfo));

src/pages/user-likes.js

@@ -22,6 +22,8 @@ import { connect } from 'react-redux';
 import _ from 'lodash';
 import Helmet from 'react-helmet';
 
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
+
 import NotFound from './not-found';
 import BaseUserLikesPage from './base/user';
 import River from '../components/river_of_posts';
@@ -37,6 +39,10 @@ import { defaultSelector } from '../selectors';
 class UserLikesPage extends Component {
   static displayName = 'UserLikesPage';
 
+  static propTypes = {
+    comments: CommentsByCategoryPropType.isRequired
+  };
+
   static async fetchData(params, store, client) {
     const userInfo = await client.userInfo(params.username);
     store.dispatch(addUser(userInfo));

src/pages/user.js

@@ -20,6 +20,8 @@ import { connect } from 'react-redux';
 import _ from 'lodash';
 import Helmet from 'react-helmet';
 
+import { CommentsByCategory as CommentsByCategoryPropType } from '../prop-types/comments';
+
 import NotFound from './not-found';
 import BaseUserPage from './base/user';
 import River from '../components/river_of_posts';
@@ -36,6 +38,7 @@ class UserPage extends React.Component {
   static displayName = 'UserPage';
 
   static propTypes = {
+    comments: CommentsByCategoryPropType.isRequired,
     location: PropTypes.shape({}).isRequired
   };
 

src/prop-types/comments.js

@@ -0,0 +1,32 @@
+/*
+ This file is a part of libertysoil.org website
+ Copyright (C) 2016  Loki Education (Social Enterprise)
+
+ This program is free software: you can redistribute it and/or modify
+ it under the terms of the GNU Affero General Public License as published by
+ the Free Software Foundation, either version 3 of the License, or
+ (at your option) any later version.
+
+ This program is distributed in the hope that it will be useful,
+ but WITHOUT ANY WARRANTY; without even the implied warranty of
+ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ GNU Affero General Public License for more details.
+
+ You should have received a copy of the GNU Affero General Public License
+ along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+import { PropTypes } from 'react';
+
+import { date, uuid4, mapOf } from '../prop-types/common';
+
+export const Comment = PropTypes.shape({
+  _sphinx_id: PropTypes.string.isRequired,
+  created_at: date.isRequired,
+  id: uuid4.isRequired,
+  post_id: uuid4.isRequired,
+  text: PropTypes.string.isRequired,
+  updated_at: date.isRequired,
+  user_id: uuid4.isRequired
+});
+
+export const CommentsByCategory = mapOf(uuid4, PropTypes.arrayOf(Comment));

src/prop-types/index.js

@@ -26,3 +26,4 @@ export const hashtags = require('./hashtags');
 export const schools = require('./schools');
 
 export const posts = require('./posts');
+export const comments = require('./comments');

src/prop-types/posts.js

@@ -47,7 +47,7 @@ export const Post = PropTypes.shape({
   text: PropTypes.string,
   type: PropTypes.oneOf(postTypes).isRequired,
   updated_at: date.isRequired,
-  url_name: url.isRequired,
+  url_name: url, // likes don't have url_name
   user_id: uuid4.isRequired
 });
 

test/unit/pages/geotag.js

@@ -27,6 +27,7 @@ describe('GeotagPage', () => {
 
     renderer.render(
       <GeotagPage
+        comments={{}}
         geotag_posts={{}}
         geotags={{}}
         params={{ url_name: 'test' }}
@@ -44,6 +45,7 @@ describe('GeotagPage', () => {
     try {
       renderer.render(
         <GeotagPage
+          comments={{}}
           geotag_posts={{}}
           geotags={{ test: {} }}
           params={{ url_name: 'test' }}
@@ -62,6 +64,7 @@ describe('GeotagPage', () => {
 
     renderer.render(
       <GeotagPage
+        comments={{}}
         geotag_posts={{}}
         geotags={{ test: {} }}
         params={{ url_name: 'test' }}

test/unit/pages/post.js

@@ -28,6 +28,7 @@ describe('Post page', () => {
     const renderer = TestUtils.createRenderer();
     renderer.render(
       <PostPage
+        comments={{}}
         params={{ uuid: uuid4Example }}
         posts={{}}
       />
@@ -44,6 +45,7 @@ describe('Post page', () => {
     const renderer = TestUtils.createRenderer();
     renderer.render(
       <PostPage
+        comments={{}}
         params={{ uuid: uuid4Example }}
         posts={{ [uuid4Example]: false }}
       />