Merge remote-tracking branch 'upstream/develop' into birthdays

2 files changed, 19 insertions, 11 deletions

diff --git a/src/components/user_reporting_modal/user_reporting_modal.js b/src/components/user_reporting_modal/user_reporting_modal.js
index 8d171b2d..67fde084 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.js
+++ b/src/components/user_reporting_modal/user_reporting_modal.js
@@ -1,15 +1,16 @@
-
 import Status from '../status/status.vue'
 import List from '../list/list.vue'
 import Checkbox from '../checkbox/checkbox.vue'
 import Modal from '../modal/modal.vue'
+import UserLink from '../user_link/user_link.vue'
 
 const UserReportingModal = {
   components: {
     Status,
     List,
     Checkbox,
-    Modal
+    Modal,
+    UserLink
   },
   data () {
     return {
@@ -21,14 +22,17 @@ const UserReportingModal = {
     }
   },
   computed: {
+    reportModal () {
+      return this.$store.state.reports.reportModal
+    },
     isLoggedIn () {
       return !!this.$store.state.users.currentUser
     },
     isOpen () {
-      return this.isLoggedIn && this.$store.state.reports.modalActivated
+      return this.isLoggedIn && this.reportModal.activated
     },
     userId () {
-      return this.$store.state.reports.userId
+      return this.reportModal.userId
     },
     user () {
       return this.$store.getters.findUser(this.userId)
@@ -37,10 +41,10 @@ const UserReportingModal = {
       return !this.user.is_local && this.user.screen_name.substr(this.user.screen_name.indexOf('@') + 1)
     },
     statuses () {
-      return this.$store.state.reports.statuses
+      return this.reportModal.statuses
     },
     preTickedIds () {
-      return this.$store.state.reports.preTickedIds
+      return this.reportModal.preTickedIds
     }
   },
   watch: {
diff --git a/src/components/user_reporting_modal/user_reporting_modal.vue b/src/components/user_reporting_modal/user_reporting_modal.vue
index 429a66e2..092c514e 100644
--- a/src/components/user_reporting_modal/user_reporting_modal.vue
+++ b/src/components/user_reporting_modal/user_reporting_modal.vue
@@ -5,9 +5,13 @@
   >
     <div class="user-reporting-panel panel">
       <div class="panel-heading">
-        <div class="title">
-          {{ $t('user_reporting.title', [user.screen_name_ui]) }}
-        </div>
+        <i18n-t
+          tag="div"
+          keypath="user_reporting.title"
+          class="title"
+        >
+          <UserLink :user="user" />
+        </i18n-t>
       </div>
       <div class="panel-body">
         <div class="user-reporting-panel-left">
@@ -68,7 +72,7 @@
 <script src="./user_reporting_modal.js"></script>
 
 <style lang="scss">
-@import '../../_variables.scss';
+@import "../../variables";
 
 .user-reporting-panel {
   width: 90vw;
@@ -117,7 +121,7 @@
     }
 
     .alert {
-      margin: 1em 0 0 0;
+      margin: 1em 0 0;
       line-height: 1.3em;
     }
   }