feat(report): allow anonymous reporting

components/report/ReportModal.vue

@@ -21,13 +21,30 @@ const availableStatuses = ref(status ? [status] : [])
 const selectedStatusIds = ref(status ? [status.id] : [])
 const additionalComments = ref('')
 const forwardReport = ref(false)
+const isAuthorized = ref(await checkAuthorization())
+
+const server = useRuntimeConfig().public.defaultServer
+const anonymousReportUrl = `https://${server}/api/v1/anonymous-reports`
 
 const dismissButton = ref<HTMLDivElement>()
 
 loadStatuses() // Load statuses asynchronously ahead of time
 
+// We need to know if the user is authorized so we can route the report correctly
+// NOTE: If there is a better way to grab an `isAuth'd` value, let me know
+async function checkAuthorization() {
+ try {
+ await client.value.v1.accounts.verifyCredentials()
+ return true
+ }
+ catch {
+ return false
+ }
+}
+
 function categoryChosen() {
- step.value = reportReason.value === 'dontlike' ? 'furtherActions' : 'selectStatuses'
+ const dontLikeAction = isAuthorized.value ? 'furtherActions' : 'finalAnonymous'
+ step.value = reportReason.value === 'dontlike' ? dontLikeAction : 'selectStatuses'
  resetModal()
 }
 
@@ -69,6 +86,29 @@ async function submitReport() {
  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,
+ })
+
+ await fetch(anonymousReportUrl, {
+ method: 'POST',
+ headers: {
+ 'Accept': 'application/json',
+ 'Content-Type': 'application/json',
+ },
+ body,
+ })
+
+ step.value = 'finalAnonymous'
+ resetModal()
+}
+
 function unfollow() {
  emit('close')
  toggleFollowAccount(useRelationship(account).value!, account)
@@ -205,7 +245,7 @@ function resetModal() {
  </table>
  <button
  btn-solid mxa mt-5
- @click="submitReport()"
+ @click="isAuthorized ? submitReport() : submitAnonymousReport()"
  >
  {{ $t('report.submit') }}
  </button>
@@ -247,6 +287,19 @@ function resetModal() {
  {{ $t('action.done') }}
  </button>
  </template>
+
+ <template v-else-if="step === 'finalAnonymous'">
+ <h1 mxa text-4xl mb4>
+ {{ reportReason === 'dontlike' ? $t('report.further_actions.limit.title') : $t('report.further_actions.report.title') }}
+ </h1>
+ <p text-xl>
+ {{ reportReason === 'dontlike' ? $t('report.further_actions.limit.signup') : '' }}
+ </p>
+
+ <button btn-solid mxa mt-10 @click="emit('close')">
+ {{ $t('action.done') }}
+ </button>
+ </template>
  </div>
 </template>
 

components/status/StatusActionsMore.vue

@@ -322,15 +322,14 @@ function report() {
  @click="toggleBlockDomain(useRelationship(status.account).value!, status.account)"
  />
  </template>
-
- <CommonDropdownItem
- :text="$t('menu.report_account', [`@${status.account.acct}`])"
- icon="i-ri:flag-2-line"
- :command="command"
- @click="report"
- />
  </template>
  </template>
+ <CommonDropdownItem
+ :text="$t('menu.report_account', [`@${status.account.acct}`])"
+ icon="i-ri:flag-2-line"
+ :command="command"
+ @click="report"
+ />
  </div>
  </template>
  </CommonDropdown>

locales/en.json

@@ -415,6 +415,7 @@
  "further_actions": {
  "limit": {
  "description": "Here are your options for controlling what you see:",
+ "signup": "You will need to create an account in order to block or mute users.",
  "title": "Don't want to see this?"
  },
  "report": {