Add report reopening and message for reopening a report (#1550)

components/ui/thread/ConversationThread.vue

@@ -49,9 +49,12 @@
         @update-thread="() => updateThreadLocal()"
       />
     </div>
-    <span v-if="report && report.closed">
-      This thread is closed and new messages cannot be sent to it.
-    </span>
+    <template v-if="report && report.closed">
+      <p>This thread is closed and new messages cannot be sent to it.</p>
+      <button v-if="isStaff(auth.user)" class="iconified-button" @click="reopenReport()">
+        <CloseIcon /> Reopen thread
+      </button>
+    </template>
     <template v-else-if="!report || !report.closed">
       <div class="markdown-editor-spacing">
         <MarkdownEditor
@@ -354,6 +357,25 @@ async function closeReport(reply) {
   }
 }
 
+async function reopenReport() {
+  try {
+    await useBaseFetch(`report/${props.report.id}`, {
+      method: 'PATCH',
+      body: {
+        closed: false,
+      },
+    })
+    await updateThreadLocal()
+  } catch (err) {
+    app.$notify({
+      group: 'main',
+      title: 'Error reopening report',
+      text: err.data ? err.data.description : err,
+      type: 'error',
+    })
+  }
+}
+
 const replyWithSubmission = ref(false)
 const submissionConfirmation = ref(false)
 

components/ui/thread/ThreadMessage.vue

@@ -72,6 +72,7 @@
         </span>
       </template>
       <span v-else-if="message.body.type === 'thread_closure'">closed the thread.</span>
+      <span v-else-if="message.body.type === 'thread_reopen'">reopened the thread.</span>
     </div>
     <span class="message__date">
       <span v-tooltip="$dayjs(message.created).format('MMMM D, YYYY [at] h:mm A')">