From 1f7d78406c5c1e971888ddb748aa4a007a9c3463 Mon Sep 17 00:00:00 2001
From: Angelina Filippova <linakirsanova@gmail.com>
Date: Sun, 19 Apr 2020 02:25:04 +0300
Subject: [PATCH] Update Reports for cases when actor or account is missing

---
 src/lang/en.js                                |  4 +-
 .../components/ModerateUserDropdown.vue       | 31 +++++++------
 src/views/reports/components/Report.vue       | 46 +++++++++++--------
 3 files changed, 49 insertions(+), 32 deletions(-)

diff --git a/src/lang/en.js b/src/lang/en.js
index 74891c59..74eaa909 100644
--- a/src/lang/en.js
+++ b/src/lang/en.js
@@ -293,6 +293,7 @@ export default {
   },
   reports: {
     reports: 'Reports',
+    report: 'Report',
     reply: 'Reply',
     from: 'From',
     showNotes: 'Show notes',
@@ -332,7 +333,8 @@ export default {
     statusDeleted: 'This status has been deleted',
     leaveNote: 'Leave a note',
     postNote: 'Send',
-    deleteNote: 'Delete'
+    deleteNote: 'Delete',
+    notFound: 'account not found'
   },
   reportsFilter: {
     inputPlaceholder: 'Select filter',
diff --git a/src/views/reports/components/ModerateUserDropdown.vue b/src/views/reports/components/ModerateUserDropdown.vue
index 2d368999..fdae9c18 100644
--- a/src/views/reports/components/ModerateUserDropdown.vue
+++ b/src/views/reports/components/ModerateUserDropdown.vue
@@ -1,6 +1,6 @@
 <template>
   <el-dropdown trigger="click">
-    <el-button plain size="small" icon="el-icon-files">{{ $t('reports.moderateUser') }}
+    <el-button :disabled="!account.id" plain size="small" icon="el-icon-files">{{ $t('reports.moderateUser') }}
       <i class="el-icon-arrow-down el-icon--right"/>
     </el-button>
     <el-dropdown-menu slot="dropdown">
@@ -16,42 +16,42 @@
       </el-dropdown-item>
       <el-dropdown-item
         :divided="true"
-        :class="{ 'active-tag': account.tags.includes('force_nsfw') }"
+        :class="{ 'active-tag': tags.includes('force_nsfw') }"
         @click.native="toggleTag(account, 'force_nsfw')">
         {{ $t('users.forceNsfw') }}
-        <i v-if="account.tags.includes('force_nsfw')" class="el-icon-check"/>
+        <i v-if="tags.includes('force_nsfw')" class="el-icon-check"/>
       </el-dropdown-item>
       <el-dropdown-item
-        :class="{ 'active-tag': account.tags.includes('strip_media') }"
+        :class="{ 'active-tag': tags.includes('strip_media') }"
         @click.native="toggleTag(account, 'strip_media')">
         {{ $t('users.stripMedia') }}
-        <i v-if="account.tags.includes('strip_media')" class="el-icon-check"/>
+        <i v-if="tags.includes('strip_media')" class="el-icon-check"/>
       </el-dropdown-item>
       <el-dropdown-item
-        :class="{ 'active-tag': account.tags.includes('force_unlisted') }"
+        :class="{ 'active-tag': tags.includes('force_unlisted') }"
         @click.native="toggleTag(account, 'force_unlisted')">
         {{ $t('users.forceUnlisted') }}
-        <i v-if="account.tags.includes('force_unlisted')" class="el-icon-check"/>
+        <i v-if="tags.includes('force_unlisted')" class="el-icon-check"/>
       </el-dropdown-item>
       <el-dropdown-item
-        :class="{ 'active-tag': account.tags.includes('sandbox') }"
+        :class="{ 'active-tag': tags.includes('sandbox') }"
         @click.native="toggleTag(account, 'sandbox')">
         {{ $t('users.sandbox') }}
-        <i v-if="account.tags.includes('sandbox')" class="el-icon-check"/>
+        <i v-if="tags.includes('sandbox')" class="el-icon-check"/>
       </el-dropdown-item>
       <el-dropdown-item
         v-if="account.local"
-        :class="{ 'active-tag': account.tags.includes('disable_remote_subscription') }"
+        :class="{ 'active-tag': tags.includes('disable_remote_subscription') }"
         @click.native="toggleTag(account, 'disable_remote_subscription')">
         {{ $t('users.disableRemoteSubscription') }}
-        <i v-if="account.tags.includes('disable_remote_subscription')" class="el-icon-check"/>
+        <i v-if="tags.includes('disable_remote_subscription')" class="el-icon-check"/>
       </el-dropdown-item>
       <el-dropdown-item
         v-if="account.local"
-        :class="{ 'active-tag': account.tags.includes('disable_any_subscription') }"
+        :class="{ 'active-tag': tags.includes('disable_any_subscription') }"
         @click.native="toggleTag(account, 'disable_any_subscription')">
         {{ $t('users.disableAnySubscription') }}
-        <i v-if="account.tags.includes('disable_any_subscription')" class="el-icon-check"/>
+        <i v-if="tags.includes('disable_any_subscription')" class="el-icon-check"/>
       </el-dropdown-item>
     </el-dropdown-menu>
   </el-dropdown>
@@ -66,6 +66,11 @@ export default {
       required: true
     }
   },
+  computed: {
+    tags() {
+      return this.account.tags || []
+    }
+  },
   methods: {
     handleDeactivation({ nickname }) {
       this.$store.dispatch('ToggleUserActivation', nickname)
diff --git a/src/views/reports/components/Report.vue b/src/views/reports/components/Report.vue
index d837546d..565b3cb0 100644
--- a/src/views/reports/components/Report.vue
+++ b/src/views/reports/components/Report.vue
@@ -10,7 +10,8 @@
         <el-card class="report">
           <div class="report-header-container">
             <div class="title-container">
-              <h3 class="report-title">{{ $t('reports.reportOn') }} {{ report.account.display_name }}</h3>
+              <h3 v-if="accountExists(report.account, 'display_name')" class="report-title">{{ $t('reports.reportOn') }} {{ report.account.display_name }}</h3>
+              <h3 v-else class="report-title">{{ $t('reports.report') }}</h3>
               <h5 class="id">{{ $t('reports.id') }}: {{ report.id }}</h5>
             </div>
             <div>
@@ -29,17 +30,20 @@
           <div>
             <el-divider class="divider"/>
             <span class="report-row-key">{{ $t('reports.account') }}:</span>
-            <img
-              :src="report.account.avatar"
-              alt="avatar"
-              class="avatar-img">
-            <a v-if="!report.account.deactivated" :href="report.account.url" target="_blank" class="account">
-              <span>{{ report.account.display_name }}</span>
-            </a>
-            <span v-else>
-              {{ report.account.display_name }}
-              <span class="deactivated"> (deactivated)</span>
+            <span v-if="accountExists(report.account, 'avatar') && accountExists(report.account, 'display_name')">
+              <img
+                :src="report.account.avatar"
+                alt="avatar"
+                class="avatar-img">
+              <a v-if="!report.account.deactivated" :href="report.account.url" target="_blank" class="account">
+                <span>{{ report.account.display_name }}</span>
+              </a>
+              <span v-else>
+                {{ report.account.display_name }}
+                <span class="deactivated"> (deactivated)</span>
+              </span>
             </span>
+            <span v-else class="deactivated">({{ $t('reports.notFound') }})</span>
           </div>
           <div v-if="report.content && report.content.length > 0">
             <el-divider class="divider"/>
@@ -50,13 +54,16 @@
           <div :style="showStatuses(report.statuses) ? '' : 'margin-bottom:15px'">
             <el-divider class="divider"/>
             <span class="report-row-key">{{ $t('reports.actor') }}:</span>
-            <img
-              :src="report.actor.avatar"
-              alt="avatar"
-              class="avatar-img">
-            <a :href="report.actor.url" target="_blank" class="account">
-              <span>{{ report.actor.display_name }}</span>
-            </a>
+            <span v-if="accountExists(report.actor, 'avatar') && accountExists(report.actor, 'display_name')">
+              <img
+                :src="report.actor.avatar"
+                alt="avatar"
+                class="avatar-img">
+              <a :href="report.actor.url" target="_blank" class="account">
+                <span>{{ report.actor.display_name }}</span>
+              </a>
+            </span>
+            <span v-else class="deactivated">({{ $t('reports.notFound') }})</span>
           </div>
           <div v-if="showStatuses(report.statuses)" class="statuses">
             <el-collapse>
@@ -135,6 +142,9 @@ export default {
     }
   },
   methods: {
+    accountExists(account, key) {
+      return account[key]
+    },
     changeReportState(state, id) {
       this.$store.dispatch('ChangeReportState', [{ state, id }])
     },