Add post updates

app/controllers/comments_controller.rb

@@ -7,6 +7,7 @@ class CommentsController < ApplicationController
         :id,
         :body,
         :parent_id,
+        :is_post_update,
         :updated_at,
         'users.full_name as user_full_name',
         'users.email as user_email',

app/javascript/components/Post/PostP.tsx

@@ -15,11 +15,14 @@ import { MutedText } from '../shared/CustomTexts';
 
 import friendlyDate from '../../helpers/friendlyDate';
 import { LikesState } from '../../reducers/likesReducer';
+import { CommentsState } from '../../reducers/commentsReducer';
+import PostUpdateList from './PostUpdateList';
 
 interface Props {
   postId: number;
   post: IPost;
   likes: LikesState;
+  comments: CommentsState;
   boards: Array<IBoard>;
   postStatuses: Array<IPostStatus>;
   isLoggedIn: boolean;
@@ -51,6 +54,7 @@ class PostP extends React.Component<Props> {
     const {
       post,
       likes,
+      comments,
       boards,
       postStatuses,
 
@@ -66,6 +70,12 @@ class PostP extends React.Component<Props> {
     return (
       <div className="pageContainer">
         <div className="sidebar">
+          <PostUpdateList
+            postUpdates={comments.items.filter(comment => comment.isPostUpdate === true)}
+            areLoading={comments.areLoading}
+            error={comments.error}
+          />
+
           <LikeList
             likes={likes.items}
             areLoading={likes.areLoading}

app/javascript/components/Post/PostUpdateList.tsx

@@ -0,0 +1,46 @@
+import * as React from 'react';
+import Gravatar from 'react-gravatar';
+
+import { TitleText, DangerText, CenteredMutedText, MutedText } from '../shared/CustomTexts';
+import Spinner from '../shared/Spinner';
+
+import IComment from '../../interfaces/IComment';
+
+import friendlyDate from '../../helpers/friendlyDate';
+
+interface Props {
+  postUpdates: Array<IComment>;
+  areLoading: boolean;
+  error: string;
+}
+
+const PostUpdateList = ({
+  postUpdates,
+  areLoading,
+  error,
+}: Props) => (
+  <div className="postUpdateListContainer">
+    <TitleText>Post updates:</TitleText>
+    { areLoading ? <Spinner /> : null }
+    { error ? <DangerText>{error}</DangerText> : null }
+    <div className="postUpdateList">
+      { postUpdates.length === 0 ? <CenteredMutedText>There are not post updates yet.</CenteredMutedText> : null }
+      {
+        postUpdates.map((postUpdate, i) => (
+          <div className="postUpdateListItem" key={i}>
+            <div className="postUpdateListItemHeader">
+              <Gravatar email={postUpdate.userEmail} size={28} className="gravatar" />
+              <span>{postUpdate.userFullName}</span>
+            </div>
+
+            <p className="postUpdateListItemBody">{postUpdate.body}</p>
+
+            <MutedText>{friendlyDate(postUpdate.updatedAt)}</MutedText>
+          </div>
+        ))
+      }
+    </div>
+  </div>
+);
+
+export default PostUpdateList;

app/javascript/containers/Post.tsx

@@ -12,6 +12,7 @@ import PostP from '../components/Post/PostP';
 const mapStateToProps = (state: State) => ({
   post: state.currentPost.item,
   likes: state.currentPost.likes,
+  comments: state.currentPost.comments,
 });
 
 const mapDispatchToProps = (dispatch) => ({

app/javascript/interfaces/IComment.ts

@@ -2,6 +2,7 @@ interface IComment {
   id: number;
   body: string;
   parentId: number;
+  isPostUpdate: boolean;
   userFullName: string;
   userEmail: string;
   updatedAt: string;

app/javascript/interfaces/json/IComment.ts

@@ -2,6 +2,7 @@ interface ICommentJSON {
   id: number;
   body: string;
   parent_id: number;
+  is_post_update: boolean;
   user_full_name: string;
   user_email: string;
   updated_at: string;

app/javascript/reducers/commentReducer.ts

@@ -9,6 +9,7 @@ const initialState: IComment = {
   id: 0,
   body: '',
   parentId: null,
+  isPostUpdate: false,
   userFullName: '<Unknown user>',
   userEmail: 'example@example.com',
   updatedAt: undefined,
@@ -24,6 +25,7 @@ const commentReducer = (
         id: action.comment.id,
         body: action.comment.body,
         parentId: action.comment.parent_id,
+        isPostUpdate: action.comment.is_post_update,
         userFullName: action.comment.user_full_name,
         userEmail: action.comment.user_email,
         updatedAt: action.comment.updated_at,

app/javascript/stylesheets/components/Post.scss

@@ -13,6 +13,43 @@
   }
 
   .sidebar {
+    .postUpdateListContainer {
+      @extend .sidebarCard;
+
+      .postUpdateList {
+        @extend .w-100;
+
+        max-height: 250px;
+        overflow-y: scroll;
+
+        .postUpdateListItem {
+          @extend
+            .d-flex,
+            .flex-column,
+            .p-2,
+            .my-1;
+
+          .postUpdateListItemHeader {
+            @extend .d-flex;
+
+            span {
+              @extend
+                .ml-2;
+
+              font-weight: 600;
+              vertical-align: middle;
+            }
+          }
+
+          .postUpdateListItemBody {
+            @extend .m-0;
+
+            font-size: 15px;
+          }
+        }
+      }
+    }
+
     .likeListContainer {
       @extend .sidebarCard;
 

db/migrate/20191001160859_add_is_post_update_to_comments.rb

@@ -0,0 +1,5 @@
+class AddIsPostUpdateToComments < ActiveRecord::Migration[6.0]
+  def change
+    add_column :comments, :is_post_update, :boolean, null: false, default: false
+  end
+end

db/schema.rb

@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 2019_09_27_094233) do
+ActiveRecord::Schema.define(version: 2019_10_01_160859) do
 
   # These are extensions that must be enabled in order to support this database
   enable_extension "plpgsql"
@@ -31,6 +31,7 @@ ActiveRecord::Schema.define(version: 2019_09_27_094233) do
     t.bigint "parent_id"
     t.datetime "created_at", precision: 6, null: false
     t.datetime "updated_at", precision: 6, null: false
+    t.boolean "is_post_update", default: false, null: false
     t.index ["parent_id"], name: "index_comments_on_parent_id"
     t.index ["post_id"], name: "index_comments_on_post_id"
     t.index ["user_id"], name: "index_comments_on_user_id"

spec/factories/comments.rb

@@ -4,5 +4,6 @@ FactoryBot.define do
     user
     post
     parent { nil }
+    is_post_update { false }
   end
 end

spec/models/comment_spec.rb

@@ -41,4 +41,10 @@ RSpec.describe Comment, type: :model do
 
     expect(parent.children.length).to eq(2)
   end
+
+  it 'has a flag to tell if it is a post update that defaults to false' do
+    comment = Comment.new
+    
+    expect(comment.is_post_update).to be_falsy
+  end
 end