3 files changed, 26 insertions, 3 deletions
diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js
index 37458ba2..67879307 100644
--- a/src/components/user_card/user_card.js
+++ b/src/components/user_card/user_card.js
@@ -4,6 +4,7 @@ import ProgressButton from '../progress_button/progress_button.vue'
 import FollowButton from '../follow_button/follow_button.vue'
 import ModerationTools from '../moderation_tools/moderation_tools.vue'
 import AccountActions from '../account_actions/account_actions.vue'
+import UserNote from '../user_note/user_note.vue'
 import Select from '../select/select.vue'
 import UserLink from '../user_link/user_link.vue'
 import RichContent from 'src/components/rich_content/rich_content.jsx'
@@ -39,7 +40,8 @@ export default {
     'rounded',
     'bordered',
     'avatarAction', // default - open profile, 'zoom' - zoom, function - call function
-    'onClose'
+    'onClose',
+    'hasNoteEditor'
   ],
   data () {
     return {
@@ -125,6 +127,16 @@ export default {
     hideFollowersCount () {
       return this.isOtherUser && this.user.hide_followers_count
     },
+    showModerationMenu () {
+      const privileges = this.loggedIn.privileges
+      return this.loggedIn.role === 'admin' || privileges.includes('users_manage_activation_state') || privileges.includes('users_delete') || privileges.includes('users_manage_tags')
+    },
+    hasNote () {
+      return this.relationship.note
+    },
+    supportsNote () {
+      return 'note' in this.relationship
+    },
     ...mapGetters(['mergedConfig'])
   },
   components: {
@@ -136,7 +148,8 @@ export default {
     FollowButton,
     Select,
     RichContent,
-    UserLink
+    UserLink,
+    UserNote
   },
   methods: {
     muteUser () {
diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index a0bbc6a6..cdb8cb57 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -315,6 +315,10 @@
       margin: 0;
     }
   }
+
+  .user-note {
+    margin: 0 .75em .6em 0;
+  }
 }
 
 .sidebar .edit-profile-button {
diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue
index b84ff27d..349c7cb1 100644
--- a/src/components/user_card/user_card.vue
+++ b/src/components/user_card/user_card.vue
@@ -258,7 +258,7 @@
             </button>
           </div>
           <ModerationTools
-            v-if="loggedIn.role === &quot;admin&quot;"
+            v-if="showModerationMenu"
             :user="user"
           />
         </div>
@@ -268,6 +268,12 @@
         >
           <RemoteFollow :user="user" />
         </div>
+        <UserNote
+          v-if="loggedIn && isOtherUser && (hasNote || (hasNoteEditor && supportsNote))"
+          :user="user"
+          :relationship="relationship"
+          :editable="hasNoteEditor"
+        />
       </div>
     </div>
     <div