Adjust sorting, return type, integrate feedback

src/components/moderation/ReportDialog/action.ts

@@ -36,11 +36,11 @@ export function useSubmitReportMutation() {
       const labelerSupportedReasonTypes = labeler.reasonTypes || []
 
       let reasonType = state.selectedOption.reason
-      const backwardsCompatableReasonType = NEW_TO_OLD_REASONS_MAP[reasonType]
+      const backwardsCompatibleReasonType = NEW_TO_OLD_REASONS_MAP[reasonType]
       const supportsNewReasonType =
         labelerSupportedReasonTypes.includes(reasonType)
       const supportsOldReasonType = labelerSupportedReasonTypes.includes(
-        backwardsCompatableReasonType,
+        backwardsCompatibleReasonType,
       )
 
       /*
@@ -49,7 +49,7 @@ export function useSubmitReportMutation() {
        * supported reason types, send the new version.
        */
       if (supportsOldReasonType && !supportsNewReasonType) {
-        reasonType = backwardsCompatableReasonType
+        reasonType = backwardsCompatibleReasonType
       }
 
       let report:

src/components/moderation/ReportDialog/const.ts

@@ -99,7 +99,7 @@ export const OTHER_REPORT_REASONS: Set<OzoneReportDefs.ReasonType> = new Set([
 ])
 
 /**
- * Set of report reasons that should only be sent Bluesky's moderation service.
+ * Set of report reasons that should only be sent to Bluesky's moderation service.
  */
 export const BSKY_LABELER_ONLY_REPORT_REASONS: Set<OzoneReportDefs.ReasonType> =
   new Set([

src/components/moderation/ReportDialog/index.tsx

@@ -103,7 +103,7 @@ function Inner(props: ReportDialogProps) {
   } = useMyLabelersQuery({excludeNonConfigurableLabelers: true})
   const isLoading = useDelayedLoading(500, isLabelerLoading)
   const copy = useCopyForSubject(props.subject)
-  const {sortedCategories, getCategory} = useReportOptions()
+  const {categories, getCategory} = useReportOptions()
   const [state, dispatch] = React.useReducer(reducer, initialState)
 
   /**
@@ -274,7 +274,7 @@ function Inner(props: ReportDialogProps) {
                 </View>
               ) : (
                 <View style={[a.gap_sm]}>
-                  {sortedCategories.map(o => (
+                  {categories.map(o => (
                     <CategoryCard
                       key={o.key}
                       option={o}

src/components/moderation/ReportDialog/utils/useReportOptions.ts

@@ -1,3 +1,4 @@
+import {useMemo} from 'react'
 import * as OzoneReportDefs from '@atproto/api/dist/client/types/tools/ozone/report/defs'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
@@ -29,7 +30,102 @@ export type ReportOption = {
 export function useReportOptions() {
   const {_} = useLingui()
 
+  return useMemo(() => {
     const categories: Record<ReportCategory, ReportCategoryConfig> = {
+      misleading: {
+        key: 'misleading',
+        title: _(msg`Misleading`),
+        description: _(msg`Spam, scams, bots, false info, or impersonation`),
+        sort: 5,
+        options: [
+          {
+            title: _(msg`Spam`),
+            reason: OzoneReportDefs.REASONMISLEADINGSPAM,
+          },
+          {
+            title: _(msg`Scam`),
+            reason: OzoneReportDefs.REASONMISLEADINGSCAM,
+          },
+          {
+            title: _(msg`Fake account or bot`),
+            reason: OzoneReportDefs.REASONMISLEADINGBOT,
+          },
+          {
+            title: _(msg`Impersonation`),
+            reason: OzoneReportDefs.REASONMISLEADINGIMPERSONATION,
+          },
+          {
+            title: _(msg`False information about elections`),
+            reason: OzoneReportDefs.REASONMISLEADINGELECTIONS,
+          },
+          {
+            title: _(msg`Other misleading content`),
+            reason: OzoneReportDefs.REASONMISLEADINGOTHER,
+          },
+        ],
+      },
+      sexualAdultContent: {
+        key: 'sexualAdultContent',
+        title: _(msg`Sexual and adult content`),
+        description: _(msg`Adult, child or animal sexual abuse`),
+        sort: 3,
+        options: [
+          {
+            title: _(msg`Unlabeled adult content`),
+            reason: OzoneReportDefs.REASONSEXUALUNLABELED,
+          },
+          {
+            title: _(msg`Adult sexual abuse content`),
+            reason: OzoneReportDefs.REASONSEXUALABUSECONTENT,
+          },
+          {
+            title: _(msg`Non-consensual intimate imagery`),
+            reason: OzoneReportDefs.REASONSEXUALNCII,
+          },
+          {
+            title: _(msg`Deepfake adult content`),
+            reason: OzoneReportDefs.REASONSEXUALDEEPFAKE,
+          },
+          {
+            title: _(msg`Animal sexual abuse`),
+            reason: OzoneReportDefs.REASONSEXUALANIMAL,
+          },
+          {
+            title: _(msg`Other sexual violence content`),
+            reason: OzoneReportDefs.REASONSEXUALOTHER,
+          },
+        ],
+      },
+      harassmentHate: {
+        key: 'harassmentHate',
+        title: _(msg`Harassment or hate`),
+        description: _(
+          msg`Targeted attacks, hate speech, or organized harassment`,
+        ),
+        sort: 4,
+        options: [
+          {
+            title: _(msg`Trolling`),
+            reason: OzoneReportDefs.REASONHARASSMENTTROLL,
+          },
+          {
+            title: _(msg`Targeted harassment`),
+            reason: OzoneReportDefs.REASONHARASSMENTTARGETED,
+          },
+          {
+            title: _(msg`Hate speech`),
+            reason: OzoneReportDefs.REASONHARASSMENTHATESPEECH,
+          },
+          {
+            title: _(msg`Doxxing`),
+            reason: OzoneReportDefs.REASONHARASSMENTDOXXING,
+          },
+          {
+            title: _(msg`Other harassing or hateful content`),
+            reason: OzoneReportDefs.REASONHARASSMENTOTHER,
+          },
+        ],
+      },
       childSafety: {
         key: 'childSafety',
         title: _(msg`Child safety`),
@@ -96,124 +192,6 @@ export function useReportOptions() {
           },
         ],
       },
-    sexualAdultContent: {
-      key: 'sexualAdultContent',
-      title: _(msg`Sexual and adult content`),
-      description: _(msg`Adult, child or animal sexual abuse`),
-      sort: 3,
-      options: [
-        {
-          title: _(msg`Adult sexual abuse content`),
-          reason: OzoneReportDefs.REASONSEXUALABUSECONTENT,
-        },
-        {
-          title: _(msg`Non-consensual intimate imagery`),
-          reason: OzoneReportDefs.REASONSEXUALNCII,
-        },
-        {
-          title: _(msg`Deepfake adult content`),
-          reason: OzoneReportDefs.REASONSEXUALDEEPFAKE,
-        },
-        {
-          title: _(msg`Animal sexual abuse`),
-          reason: OzoneReportDefs.REASONSEXUALANIMAL,
-        },
-        {
-          title: _(msg`Unlabeled adult content`),
-          reason: OzoneReportDefs.REASONSEXUALUNLABELED,
-        },
-        {
-          title: _(msg`Other sexual violence content`),
-          reason: OzoneReportDefs.REASONSEXUALOTHER,
-        },
-      ],
-    },
-    harassmentHate: {
-      key: 'harassmentHate',
-      title: _(msg`Harassment or hate`),
-      description: _(
-        msg`Targeted attacks, hate speech, or organized harassment`,
-      ),
-      sort: 4,
-      options: [
-        {
-          title: _(msg`Trolling`),
-          reason: OzoneReportDefs.REASONHARASSMENTTROLL,
-        },
-        {
-          title: _(msg`Targeted harassment`),
-          reason: OzoneReportDefs.REASONHARASSMENTTARGETED,
-        },
-        {
-          title: _(msg`Hate speech`),
-          reason: OzoneReportDefs.REASONHARASSMENTHATESPEECH,
-        },
-        {
-          title: _(msg`Doxxing`),
-          reason: OzoneReportDefs.REASONHARASSMENTDOXXING,
-        },
-        {
-          title: _(msg`Other harassing or hateful content`),
-          reason: OzoneReportDefs.REASONHARASSMENTOTHER,
-        },
-      ],
-    },
-    misleading: {
-      key: 'misleading',
-      title: _(msg`Misleading`),
-      description: _(msg`Spam, scams, bots, false info, or impersonation`),
-      sort: 5,
-      options: [
-        {
-          title: _(msg`Fake account or bot`),
-          reason: OzoneReportDefs.REASONMISLEADINGBOT,
-        },
-        {
-          title: _(msg`Impersonation`),
-          reason: OzoneReportDefs.REASONMISLEADINGIMPERSONATION,
-        },
-        {
-          title: _(msg`Spam`),
-          reason: OzoneReportDefs.REASONMISLEADINGSPAM,
-        },
-        {
-          title: _(msg`Scam`),
-          reason: OzoneReportDefs.REASONMISLEADINGSCAM,
-        },
-        {
-          title: _(msg`False information about elections`),
-          reason: OzoneReportDefs.REASONMISLEADINGELECTIONS,
-        },
-        {
-          title: _(msg`Other misleading content`),
-          reason: OzoneReportDefs.REASONMISLEADINGOTHER,
-        },
-      ],
-    },
-    ruleBreaking: {
-      key: 'ruleBreaking',
-      title: _(msg`Breaking network rules`),
-      description: _(msg`Hacking, stolen content, or prohibited sales`),
-      sort: 6,
-      options: [
-        {
-          title: _(msg`Hacking or system attacks`),
-          reason: OzoneReportDefs.REASONRULESITESECURITY,
-        },
-        {
-          title: _(msg`Promoting or selling prohibited items or services`),
-          reason: OzoneReportDefs.REASONRULEPROHIBITEDSALES,
-        },
-        {
-          title: _(msg`Banned user returning`),
-          reason: OzoneReportDefs.REASONRULEBANEVASION,
-        },
-        {
-          title: _(msg`Other network rule-breaking`),
-          reason: OzoneReportDefs.REASONRULEOTHER,
-        },
-      ],
-    },
       selfHarm: {
         key: 'selfHarm',
         title: _(msg`Self-harm`),
@@ -242,6 +220,30 @@ export function useReportOptions() {
           },
         ],
       },
+      ruleBreaking: {
+        key: 'ruleBreaking',
+        title: _(msg`Breaking network rules`),
+        description: _(msg`Hacking, stolen content, or prohibited sales`),
+        sort: 6,
+        options: [
+          {
+            title: _(msg`Hacking or system attacks`),
+            reason: OzoneReportDefs.REASONRULESITESECURITY,
+          },
+          {
+            title: _(msg`Promoting or selling prohibited items or services`),
+            reason: OzoneReportDefs.REASONRULEPROHIBITEDSALES,
+          },
+          {
+            title: _(msg`Banned user returning`),
+            reason: OzoneReportDefs.REASONRULEBANEVASION,
+          },
+          {
+            title: _(msg`Other network rule-breaking`),
+            reason: OzoneReportDefs.REASONRULEOTHER,
+          },
+        ],
+      },
       other: {
         key: 'other',
         title: _(msg`Other`),
@@ -257,13 +259,11 @@ export function useReportOptions() {
       },
     }
 
-  const sortedCategories = (
+    return {
-    Object.values(categories) as ReportCategoryConfig[]
+      categories: Object.values(categories) as ReportCategoryConfig[],
-  ).sort((a, b) => a.sort - b.sort)
+      getCategory(reasonName: ReportCategory) {
-
-  const getCategory = (reasonName: ReportCategory) => {
         return categories[reasonName]
+      },
     }
-
+  }, [_])
-  return {categories, sortedCategories, getCategory}
 }