feat(report): Adding illegal-content fields in the report form

components/report/ReportModal.vue

@@ -16,6 +16,9 @@ const { client } = useMasto()
 const step = ref('selectCategory')
 const serverRules = ref((await client.value.v2.instance.fetch()).rules || [])
 const reportReason = ref('')
+const illegalContent = ref(false)
+const illegalContentCountry = ref('')
+const illegalContentSignature = ref(false)
 const selectedRuleIds = ref([])
 const availableStatuses = ref(status ? [status] : [])
 const selectedStatusIds = ref(status ? [status.id] : [])
@@ -24,7 +27,7 @@ const forwardReport = ref(false)
 const isAuthorized = ref(await checkAuthorization())
 
 const server = useRuntimeConfig().public.defaultServer
-const anonymousReportUrl = `https://${server}/api/v1/anonymous-reports`
+const reportUrl = `https://${server}/api/v1/reports`
 
 const dismissButton = ref<HTMLDivElement>()
 
@@ -74,38 +77,33 @@ async function loadStatuses() {
 }
 
 async function submitReport() {
-  await client.value.v1.reports.create({
-    accountId: account.id,
-    statusIds: selectedStatusIds.value,
-    comment: additionalComments.value,
-    forward: forwardReport.value,
-    category: reportReason.value === 'spam' ? 'spam' : reportReason.value === 'violation' ? 'violation' : 'other',
-    ruleIds: reportReason.value === 'violation' ? selectedRuleIds.value : null,
-  })
-  step.value = 'furtherActions'
-  resetModal()
-}
-
-async function submitAnonymousReport() {
   const body = JSON.stringify({
     account_id: account.id,
     status_ids: selectedStatusIds.value,
     comment: additionalComments.value,
     forward: forwardReport.value,
     category: reportReason.value === 'spam' ? 'spam' : reportReason.value === 'violation' ? 'violation' : 'other',
     rule_ids: reportReason.value === 'violation' ? selectedRuleIds.value : null,
+    illegal_content: illegalContent.value,
+    illegal_content_country: illegalContentCountry.value,
   })
 
-  await fetch(anonymousReportUrl, {
+  const headers = {
+    'Accept': 'application/json',
+    'Content-Type': 'application/json',
+  }
+
+  const accessToken = client?.value?.config?.props?.accessToken
+  if (accessToken)
+    headers.Authorization = accessToken
+
+  await fetch(reportUrl, {
     method: 'POST',
-    headers: {
-      'Accept': 'application/json',
-      'Content-Type': 'application/json',
-    },
+    headers,
     body,
   })
 
-  step.value = 'finalAnonymous'
+  step.value = isAuthorized.value ? 'furtherActions' : 'finalAnonymous'
   resetModal()
 }
 
@@ -193,11 +191,30 @@ function resetModal() {
         </p>
       </div>
 
-      <div v-if="reportReason && reportReason !== 'dontlike'">
-        <h3 mt-8 mb-4 font-bold>
+      <div>
+        <input id="illegal_content" v-model="illegalContent" type="checkbox" value="illegal_content">
+        <label pl-2 for="illegal_content" font-bold>{{ $t('report.illegal_content') }}</label>
+      </div>
+
+      <div v-if="(reportReason && reportReason !== 'dontlike') || illegalContent">
+        <h3 mt-8 mb-4 font-bold :hidden="illegalContent">
           {{ $t('report.anything_else') }}
         </h3>
+        <h3 mt-8 mb-4 font-bold :hidden="!illegalContent">
+          {{ $t('report.anything_else_illegal_content') }}
+        </h3>
         <textarea v-model="additionalComments" w-full h-20 p-3 border :placeholder="$t('report.additional_comments')" />
+        <p :hidden="!illegalContent">
+          {{ $t('report.illegal_content_footer') }}
+        </p>
+      </div>
+
+      <div v-if="illegalContent">
+        <label pl-2 for="illegal_content_country" font-bold>{{ $t('report.illegal_content_country') }}</label>
+        <input id="illegal_content_country" v-model="illegalContentCountry" type="text">
+      </div>
+
+      <div v-if="(reportReason && reportReason !== 'dontlike') || illegalContent">
         <div v-if="getServerName(account) && getServerName(account) !== currentServer">
           <h3 mt-8 mb-2 font-bold>
             {{ $t('report.another_server') }}
@@ -210,9 +227,14 @@ function resetModal() {
         </div>
       </div>
 
+      <div v-if="illegalContent">
+        <input id="illegal_content_signature" v-model="illegalContentSignature" type="checkbox" value="illegal_content_signature">
+        <label pl-2 for="illegal_content_signature" font-bold>{{ $t('report.illegal_content_signature') }}</label>
+      </div>
+
       <button
         btn-solid mxa mt-10
-        :disabled="!reportReason || (reportReason === 'violation' && selectedRuleIds.length < 1)"
+        :disabled="!reportReason || (reportReason === 'violation' && selectedRuleIds.length < 1) || (illegalContent && !additionalComments) || (illegalContent && !illegalContentSignature)"
         @click="categoryChosen()"
       >
         {{ $t('action.next') }}
@@ -245,7 +267,7 @@ function resetModal() {
       </table>
       <button
         btn-solid mxa mt-5
-        @click="isAuthorized ? submitReport() : submitAnonymousReport()"
+        @click="submitReport()"
       >
         {{ $t('report.submit') }}
       </button>

locales/en.json

@@ -407,6 +407,7 @@
     "additional_comments": "Additional comments",
     "another_server": "The user you're reporting is from another server",
     "anything_else": "Is there anything else you think we should know?",
+    "anything_else_illegal_content": "Please provide additional details, including sufficient information for Mozilla to understand the specific law(s) or requirement(s) you believe has been broken.",
     "block_desc": "You will no longer see any posts from this user. They will not be able to see your posts or follow you. They will be able to tell that they are blocked.",
     "dontlike": "I don't like it",
     "dontlike_desc": "It is not something you want to see",
@@ -423,6 +424,10 @@
         "title": "Thanks for reporting, we'll look into this."
       }
     },
+    "illegal_content": "I think this content is illegal in my jurisdiction",
+    "illegal_content_country": "Country in which you believe the content is illegal.",
+    "illegal_content_footer": "Please note that we will not be able to conduct a legal review if you don’t precisely specify what you allege to be illegal about the content. We may, however, still review under our content policies.",
+    "illegal_content_signature": "By submitting this report I certify, under penalty of perjury, that the allegations it contains are complete and accurate, to the best of my knowledge.",
     "limiting": "Limiting {0}",
     "mute_desc": "You will no longer see any posts from this user. They can still follow you and see your posts. They will not know that they are muted.",
     "other": "It's something else",