fix reporting modal

src/components/list/list.js

@@ -21,8 +21,8 @@ const List = {
       default: () => '',
     },
     preSelect: {
-      type: Array,
-      default: [],
+      type: Set,
+      default: new Set(),
     },
     nonInteractive: {
       type: Boolean,

src/components/user_reporting_modal/user_reporting_modal.js

@@ -56,7 +56,7 @@ const UserReportingModal = {
       // Reset state
       this.comment = ''
       this.forward = false
-      this.statusIdsToReport = new Set(this.reportModal.preTickedIds)
+      this.statusIdsToReport = new Set(this.reportModal.preTickedIds) // cloning
       this.processing = false
       this.error = false
     },

src/components/user_reporting_modal/user_reporting_modal.vue

@@ -52,8 +52,9 @@
         </div>
         <div class="user-reporting-panel-right">
           <List
-            :external-items="reportModal.statuses"
+            :external-items="reportModal.statusIds"
             :pre-select="reportModal.preTickedIds"
+            :get-key="(item) => item"
             selectable
             @select="onListSelect"
           >
@@ -61,7 +62,7 @@
               <Status
                 :in-conversation="false"
                 :focused="false"
-                :statusoid="item"
+                :status-id="item"
               />
             </template>
           </List>

src/stores/reports.js

@@ -1,4 +1,3 @@
-import { filter } from 'lodash'
 import { defineStore } from 'pinia'
 
 import { useInterfaceStore } from 'src/stores/interface.js'
@@ -11,28 +10,23 @@ export const useReportsStore = defineStore('reports', {
   state: () => ({
     reportModal: {
       userId: null,
-      statuses: [],
-      preTickedIds: [],
+      statusIds: new Set(),
+      preTickedIds: new Set(),
       activated: false,
     },
     reports: {},
   }),
   actions: {
     openUserReportingModal({ userId, statusIds = [] }) {
-      const preTickedStatuses = statusIds.map((id) =>
-        useStatusesStore().allStatuses.get(id),
-      )
-      const preTickedIds = statusIds
-      const statuses = preTickedStatuses.concat(
-        filter(
-          window.vuex.state.statuses.allStatuses,
-          (status) =>
-            status.user.id === userId && !preTickedIds.includes(status.id),
-        ),
-      )
+      const preTickedIds = new Set(statusIds)
+      // There shouldn't be a case where this is undefined
+      const userAllStatusesIds = useStatusesStore().statusesPerUser.get(userId)
+      // Set constructor should take care of duplicated IDs and order,
+      // later duplicated IDs will be dropped in favor of earlier
+      const sortedIds = new Set([...preTickedIds, ...userAllStatusesIds])
 
       this.reportModal.userId = userId
-      this.reportModal.statuses = statuses
+      this.reportModal.statusIds = sortedIds
       this.reportModal.preTickedIds = preTickedIds
       this.reportModal.activated = true
     },

src/stores/statuses.js

@@ -30,6 +30,7 @@ import {
 
 export const defaultState = () => ({
   allStatuses: new Map(),
+  statusesPerUser: new Map(),
   timestamps: new WeakMap(),
   scrobblesNextFetch: {},
   conversations: new Map(),
@@ -83,6 +84,12 @@ export const useStatusesStore = defineStore('statuses', {
       // in case of likes (which are not statuses) it should return null
       const addStatus = (data) => {
         const [status] = this.mergeOrAdd(this.allStatuses, data, timestamp)
+        let userSet = this.statusesPerUser.get(status.user.id)
+        if (userSet === undefined) {
+          userSet = new Set()
+          this.statusesPerUser.set(status.user.id, userSet)
+        }
+        userSet.add(status.id)
 
         // Add to conversation
         const conversations = this.conversations
@@ -527,14 +534,11 @@ export const useStatusesStore = defineStore('statuses', {
 
     // For when blocking a user
     wipeUserStatuses(userId) {
-      const removed = new Set()
-      this.allStatuses.forEach((status) => {
-        if (status.user.id === userId) {
-          this.allStatuses.delete(status.id)
-
-          removed.add(status.id)
-        }
+      const removed = this.statusesPerUser.get(userId)
+      removed.forEach((statusId) => {
+        this.allStatuses.delete(statusId)
       })
+      this.statusesPerUser.delete(userId)
       return removed
     },
   },