rule_id --> rule_ids

app/soapbox/features/ui/components/modals/report-modal/__tests__/report-modal.test.tsx

@@ -28,6 +28,7 @@ describe('<ReportModal />', () => {
         new: {
           account_id: '1',
           status_ids: ImmutableSet(['1']),
+          rule_ids: ImmutableSet(),
         },
       }),
       statuses: ImmutableMap({

app/soapbox/features/ui/components/modals/report-modal/report-modal.tsx

@@ -84,7 +84,7 @@ const ReportModal = ({ onClose }: IReportModal) => {
   const isBlocked = useAppSelector((state) => state.reports.getIn(['new', 'block']) as boolean);
   const isSubmitting = useAppSelector((state) => state.reports.getIn(['new', 'isSubmitting']) as boolean);
   const rules = useAppSelector((state) => state.rules.items);
-  const ruleId = useAppSelector((state) => state.reports.getIn(['new', 'rule_id']) as string);
+  const ruleIds = useAppSelector((state) => state.reports.getIn(['new', 'rule_ids']) as ImmutableSet<string>);
   const selectedStatusIds = useAppSelector((state) => state.reports.getIn(['new', 'status_ids']) as ImmutableSet<string>);
 
   const shouldRequireRule = rules.length > 0;
@@ -152,8 +152,8 @@ const ReportModal = ({ onClose }: IReportModal) => {
       return false;
     }
 
-    return isSubmitting || (shouldRequireRule && !ruleId) || selectedStatusIds.size === 0;
+    return isSubmitting || (shouldRequireRule && ruleIds.isEmpty()) || selectedStatusIds.size === 0;
-  }, [currentStep, isSubmitting, shouldRequireRule, ruleId, selectedStatusIds.size]);
+  }, [currentStep, isSubmitting, shouldRequireRule, ruleIds, selectedStatusIds.size]);
 
   const calculateProgress = useCallback(() => {
     switch (currentStep) {

app/soapbox/features/ui/components/modals/report-modal/steps/reason-step.tsx

@@ -8,6 +8,7 @@ import { fetchRules } from 'soapbox/actions/rules';
 import { FormGroup, Stack, Text, Textarea } from 'soapbox/components/ui';
 import { useAppSelector } from 'soapbox/hooks';
 
+import type { Set as ImmutableSet } from 'immutable';
 import type { ReducerAccount } from 'soapbox/reducers/accounts';
 
 const messages = defineMessages({
@@ -32,7 +33,7 @@ const ReasonStep = (_props: IReasonStep) => {
 
   const comment = useAppSelector((state) => state.reports.getIn(['new', 'comment']) as string);
   const rules = useAppSelector((state) => state.rules.items);
-  const ruleId = useAppSelector((state) => state.reports.getIn(['new', 'rule_id']) as boolean);
+  const ruleIds = useAppSelector((state) => state.reports.getIn(['new', 'rule_ids']) as ImmutableSet<string>);
   const shouldRequireRule = rules.length > 0;
 
   const handleCommentChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {
@@ -87,7 +88,7 @@ const ReasonStep = (_props: IReasonStep) => {
               ref={rulesListRef}
             >
               {rules.map((rule, idx) => {
-                const isSelected = String(ruleId) === String(rule.id);
+                const isSelected = ruleIds.includes(String(rule.id));
 
                 return (
                   <button

app/soapbox/reducers/__tests__/reports-test.js

@@ -12,7 +12,7 @@ describe('reports reducer', () => {
         comment: '',
         forward: false,
         block: false,
-        rule_id: null,
+        rule_ids: ImmutableSet(),
       }),
     }));
   });