diff --git a/app/assets/stylesheets/common/_index.scss b/app/assets/stylesheets/common/_index.scss index e7654fb1..04d3163c 100644 --- a/app/assets/stylesheets/common/_index.scss +++ b/app/assets/stylesheets/common/_index.scss @@ -276,4 +276,9 @@ body { vertical-align: middle; } +} + +.staffIcon { + font-size: 24px; + margin: 0 4px; } \ No newline at end of file diff --git a/app/controllers/comments_controller.rb b/app/controllers/comments_controller.rb index e4c2fbd3..015be6ae 100644 --- a/app/controllers/comments_controller.rb +++ b/app/controllers/comments_controller.rb @@ -12,6 +12,7 @@ class CommentsController < ApplicationController :updated_at, 'users.full_name as user_full_name', 'users.email as user_email', + 'users.role as user_role', ) .where(post_id: params[:post_id]) .left_outer_joins(:user) @@ -28,7 +29,7 @@ class CommentsController < ApplicationController SendNotificationForCommentWorkflow.new(comment: @comment).run render json: @comment.attributes.merge( - { user_full_name: current_user.full_name, user_email: current_user.email } + { user_full_name: current_user.full_name, user_email: current_user.email, user_role: current_user.role_before_type_cast } ), status: :created else render json: { @@ -43,7 +44,7 @@ class CommentsController < ApplicationController if @comment.update(comment_update_params) render json: @comment.attributes.merge( - { user_full_name: @comment.user.full_name, user_email: @comment.user.email } + { user_full_name: @comment.user.full_name, user_email: @comment.user.email, user_role: @comment.user.role_before_type_cast } ) else render json: { diff --git a/app/javascript/components/Comments/Comment.tsx b/app/javascript/components/Comments/Comment.tsx index fcba9d36..e7fb91a5 100644 --- a/app/javascript/components/Comments/Comment.tsx +++ b/app/javascript/components/Comments/Comment.tsx @@ -9,6 +9,7 @@ import { ReplyFormState } from '../../reducers/replyFormReducer'; import CommentEditForm from './CommentEditForm'; import CommentFooter from './CommentFooter'; +import { StaffIcon } from '../common/Icons'; interface Props { id: number; @@ -16,6 +17,7 @@ interface Props { isPostUpdate: boolean; userFullName: string; userEmail: string; + userRole: number; createdAt: string; updatedAt: string; @@ -68,6 +70,7 @@ class Comment extends React.Component { isPostUpdate, userFullName, userEmail, + userRole, createdAt, updatedAt, @@ -88,6 +91,9 @@ class Comment extends React.Component {
{userFullName} + + { userRole > 0 && } + { isPostUpdate ? diff --git a/app/javascript/components/common/Icons.tsx b/app/javascript/components/common/Icons.tsx index eb7b07bf..6d8885a8 100644 --- a/app/javascript/components/common/Icons.tsx +++ b/app/javascript/components/common/Icons.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import I18n from 'i18n-js'; import { BsReply } from 'react-icons/bs'; import { FiEdit, FiDelete } from 'react-icons/fi'; @@ -7,6 +8,7 @@ import { TbLock, TbLockOpen } from 'react-icons/tb'; import { MdContentCopy, MdDone, MdOutlineArrowBack } from 'react-icons/md'; import { GrTest } from 'react-icons/gr'; import { MdOutlineLibraryBooks } from "react-icons/md"; +import { MdVerified } from "react-icons/md"; export const EditIcon = () => ; @@ -28,4 +30,10 @@ export const BackIcon = () => ; export const ReplyIcon = () => ; -export const LearnMoreIcon = () => ; \ No newline at end of file +export const LearnMoreIcon = () => ; + +export const StaffIcon = () => ( + + + +); diff --git a/app/javascript/interfaces/IComment.ts b/app/javascript/interfaces/IComment.ts index 3a08ab0b..3f884aef 100644 --- a/app/javascript/interfaces/IComment.ts +++ b/app/javascript/interfaces/IComment.ts @@ -5,6 +5,7 @@ interface IComment { isPostUpdate: boolean; userFullName: string; userEmail: string; + userRole: number; createdAt: string; updatedAt: string; } diff --git a/app/javascript/interfaces/json/IComment.ts b/app/javascript/interfaces/json/IComment.ts index 73c1dcd2..9e145b41 100644 --- a/app/javascript/interfaces/json/IComment.ts +++ b/app/javascript/interfaces/json/IComment.ts @@ -5,6 +5,7 @@ interface ICommentJSON { is_post_update: boolean; user_full_name: string; user_email: string; + user_role: number; created_at: string; updated_at: string; } diff --git a/app/javascript/reducers/commentReducer.ts b/app/javascript/reducers/commentReducer.ts index 0fd9460d..183546ba 100644 --- a/app/javascript/reducers/commentReducer.ts +++ b/app/javascript/reducers/commentReducer.ts @@ -17,6 +17,7 @@ const initialState: IComment = { isPostUpdate: false, userFullName: '', userEmail: 'example@example.com', + userRole: 0, createdAt: undefined, updatedAt: undefined, }; @@ -35,6 +36,7 @@ const commentReducer = ( isPostUpdate: action.comment.is_post_update, userFullName: action.comment.user_full_name, userEmail: action.comment.user_email, + userRole: action.comment.user_role, createdAt: action.comment.created_at, updatedAt: action.comment.updated_at, }; diff --git a/config/locales/en.yml b/config/locales/en.yml index e7bf107d..1591d99c 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -44,6 +44,7 @@ en: enabled: 'Enabled' disabled: 'Disabled' copied: 'Copied!' + user_staff: 'Staff' buttons: new: 'New' edit: 'Edit' diff --git a/package.json b/package.json index 9d7f864d..5ddae32b 100644 --- a/package.json +++ b/package.json @@ -31,7 +31,7 @@ "react-dom": "16.9.0", "react-gravatar": "2.6.3", "react-hook-form": "7.33.1", - "react-icons": "4.4.0", + "react-icons": "5.0.1", "react-infinite-scroller": "1.2.4", "react-markdown": "5.0.3", "react-redux": "7.1.1", diff --git a/yarn.lock b/yarn.lock index f9a6aa7c..43e6b24f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2411,10 +2411,10 @@ react-hook-form@7.33.1: resolved "https://registry.yarnpkg.com/react-hook-form/-/react-hook-form-7.33.1.tgz#8c4410e3420788d3b804d62cc4c142915c2e46d0" integrity sha512-ydTfTxEJdvgjCZBj5DDXRc58oTEfnFupEwwTAQ9FSKzykEJkX+3CiAkGtAMiZG7IPWHuzgT6AOBfogiKhUvKgg== -react-icons@4.4.0: - version "4.4.0" - resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-4.4.0.tgz#a13a8a20c254854e1ec9aecef28a95cdf24ef703" - integrity sha512-fSbvHeVYo/B5/L4VhB7sBA1i2tS8MkT0Hb9t2H1AVPkwGfVHLJCqyr2Py9dKMxsyM63Eng1GkdZfbWj+Fmv8Rg== +react-icons@5.0.1: + version "5.0.1" + resolved "https://registry.yarnpkg.com/react-icons/-/react-icons-5.0.1.tgz#1694e11bfa2a2888cab47dcc30154ce90485feee" + integrity sha512-WqLZJ4bLzlhmsvme6iFdgO8gfZP17rfjYEJ2m9RsZjZ+cc4k1hTzknEz63YS1MeT50kVzoa1Nz36f4BEx+Wigw== react-infinite-scroller@1.2.4: version "1.2.4"