diff --git a/app/javascript/components/Comments/Comment.tsx b/app/javascript/components/Comments/Comment.tsx
index 3886f529..fbe74762 100644
--- a/app/javascript/components/Comments/Comment.tsx
+++ b/app/javascript/components/Comments/Comment.tsx
@@ -23,6 +23,7 @@ interface Props {
isLoggedIn: boolean;
isPowerUser: boolean;
+ currentUserEmail: string;
}
const Comment = ({
@@ -39,6 +40,7 @@ const Comment = ({
isLoggedIn,
isPowerUser,
+ currentUserEmail,
}: Props) => (
@@ -73,6 +75,7 @@ const Comment = ({
handleSubmit={handleSubmitComment}
isLoggedIn={isLoggedIn}
+ userEmail={currentUserEmail}
/>
:
null
diff --git a/app/javascript/components/Comments/CommentList.tsx b/app/javascript/components/Comments/CommentList.tsx
index a1a6a6c3..443a67ee 100644
--- a/app/javascript/components/Comments/CommentList.tsx
+++ b/app/javascript/components/Comments/CommentList.tsx
@@ -17,6 +17,7 @@ interface Props {
isLoggedIn: boolean;
isPowerUser: boolean;
+ userEmail: string;
}
const CommentList = ({
@@ -31,6 +32,7 @@ const CommentList = ({
isLoggedIn,
isPowerUser,
+ userEmail,
}: Props) => (
{comments.map((comment, i) => {
@@ -50,6 +52,7 @@ const CommentList = ({
isLoggedIn={isLoggedIn}
isPowerUser={isPowerUser}
+ currentUserEmail={userEmail}
/>
);
diff --git a/app/javascript/components/Comments/CommentsP.tsx b/app/javascript/components/Comments/CommentsP.tsx
index 314a8dbc..e778c1c9 100644
--- a/app/javascript/components/Comments/CommentsP.tsx
+++ b/app/javascript/components/Comments/CommentsP.tsx
@@ -12,6 +12,7 @@ interface Props {
postId: number;
isLoggedIn: boolean;
isPowerUser: boolean;
+ userEmail: string;
authenticityToken: string;
comments: Array
;
@@ -48,6 +49,7 @@ class CommentsP extends React.Component {
const {
isLoggedIn,
isPowerUser,
+ userEmail,
comments,
replyForms,
@@ -75,6 +77,7 @@ class CommentsP extends React.Component {
handleSubmit={this._handleSubmitComment}
isLoggedIn={isLoggedIn}
+ userEmail={userEmail}
/>
{ areLoading ? : null }
@@ -94,6 +97,7 @@ class CommentsP extends React.Component {
level={1}
isLoggedIn={isLoggedIn}
isPowerUser={isPowerUser}
+ userEmail={userEmail}
/>
);
diff --git a/app/javascript/components/Comments/NewComment.tsx b/app/javascript/components/Comments/NewComment.tsx
index 2df74cd7..f1d1aaf7 100644
--- a/app/javascript/components/Comments/NewComment.tsx
+++ b/app/javascript/components/Comments/NewComment.tsx
@@ -1,4 +1,5 @@
import * as React from 'react';
+import Gravatar from 'react-gravatar';
import Button from '../shared/Button';
import Spinner from '../shared/Spinner';
@@ -13,6 +14,7 @@ interface Props {
handleSubmit(body: string, parentId: number): void;
isLoggedIn: boolean;
+ userEmail: string;
}
const NewComment = ({
@@ -24,12 +26,14 @@ const NewComment = ({
handleSubmit,
isLoggedIn,
+ userEmail,
}: Props) => (
{
isLoggedIn ?
+
diff --git a/app/javascript/stylesheets/components/Comments.scss b/app/javascript/stylesheets/components/Comments.scss
index 2ca835f3..21bed4cf 100644
--- a/app/javascript/stylesheets/components/Comments.scss
+++ b/app/javascript/stylesheets/components/Comments.scss
@@ -4,6 +4,13 @@
.d-flex,
.my-3;
+ .currentUserAvatar {
+ @extend
+ .gravatar,
+ .align-self-end,
+ .mr-2;
+ }
+
.newCommentBody {
@extend
.form-control,