update nomination status to reflect main ruleset change when picking a ruleset to nominate

Author: notbakaneko

resources/js/beatmap-discussions/discussions-state.ts

@@ -53,6 +53,7 @@ export default class DiscussionsState {
   @observable pinnedNewDiscussion = false;
 
   @observable readPostIds = new Set<number>();
+  @observable selectedNominatedRulesets: GameMode[] = [];
   @observable selectedUserId: number | null = null;
   @observable showDeleted = true; // this toggle only affects All and deleted discussion filters, other filters don't show deleted
 
@@ -231,6 +232,13 @@ export default class DiscussionsState {
     return moment(maxLastUpdate).unix();
   }
 
+  get calculatedMainRuleset() {
+    return this.beatmapset.main_ruleset
+      // The main ruleset not being set yet implies there are either no nominations
+      // or an equal number of nominations for each ruleset, so the next selection should make it the main ruleset.
+      ?? (this.selectedNominatedRulesets.length === 1 ? this.selectedNominatedRulesets[0] : null);
+  }
+
   @computed
   get nonDeletedDiscussions() {
     return this.discussionsArray.filter((discussion) => discussion.deleted_at == null);

resources/js/beatmap-discussions/nominations.tsx

@@ -479,7 +479,9 @@ export class Nominations extends React.Component<Props> {
             current={nominations.current[ruleset] ?? 0}
             label={hybrid ? <i className={`fal fa-extra-mode-${ruleset}`} /> : null}
             modifiers={{ 'beatmapset-nomination-hybrid' : hybrid }}
-            total={required}
+            // set all non-main ruleset to 1
+            // TODO: add main/non-main required to response
+            total={this.props.discussionsState.calculatedMainRuleset == null || this.props.discussionsState.calculatedMainRuleset === ruleset ? required : 1}
           />
         ))}
       </div>

resources/js/beatmap-discussions/nominator.tsx

@@ -30,14 +30,17 @@ const bn = 'nomination-dialog';
 export class Nominator extends React.Component<Props> {
   private readonly checkboxContainerRef = React.createRef<HTMLDivElement>();
   @observable private loading = false;
-  @observable private selectedModes: GameMode[] = [];
   @observable private visible = false;
   private xhr?: JQuery.jqXHR<BeatmapsetWithDiscussionsJson>;
 
   private get beatmapset() {
     return this.props.discussionsState.beatmapset;
   }
 
+  private get calculatedMainRuleset() {
+    return this.props.discussionsState.calculatedMainRuleset;
+  }
+
   private get currentHype() {
     return this.props.discussionsState.totalHypeCount;
   }
@@ -73,6 +76,10 @@ export class Nominator extends React.Component<Props> {
       : Object.keys(this.beatmapset.nominations.required) as GameMode[];
   }
 
+  private get selectedModes() {
+    return this.props.discussionsState.selectedNominatedRulesets;
+  }
+
   private get users() {
     return this.props.store.users;
   }
@@ -128,13 +135,6 @@ export class Nominator extends React.Component<Props> {
     );
   }
 
-  private get calculatedMode() {
-    return this.beatmapset.main_ruleset
-      // The main ruleset not being set yet implies there are either no nominations
-      // or an equal number of nominations for each ruleset, so the next selection should make it the main ruleset.
-      ?? (this.selectedModes.length === 1 ? this.selectedModes[0] : null);
-  }
-
   private hasFullNomination(mode: GameMode) {
     return this.nominationEvents.some((event) => {
       const user = this.users.get(event.user_id);
@@ -186,7 +186,7 @@ export class Nominator extends React.Component<Props> {
     }
 
     return curr >= req
-      || this.calculatedMode != null && this.calculatedMode !== mode && this.nominationCountWithSelections(mode) > 0;
+      || this.calculatedMainRuleset != null && this.calculatedMainRuleset !== mode && this.nominationCountWithSelections(mode) > 0;
   }
 
   private nominationCountWithSelections(mode: GameMode) {
@@ -259,7 +259,7 @@ export class Nominator extends React.Component<Props> {
   }
 
   private renderModalContentHybrid() {
-    const currentMode = this.calculatedMode ?? 'undefined';
+    const currentMode = this.calculatedMainRuleset ?? 'undefined';
 
     return (
       <>
@@ -324,7 +324,7 @@ export class Nominator extends React.Component<Props> {
   @action
   private readonly updateCheckboxes = () => {
     const checkedBoxes = map(this.checkboxContainerRef.current?.querySelectorAll<HTMLInputElement>('input[type=checkbox]:checked'), (node) => node.value);
-    this.selectedModes = checkedBoxes as GameMode[];
+    this.props.discussionsState.selectedNominatedRulesets = checkedBoxes as GameMode[];
   };
 
   private userCanNominateMode(mode: GameMode) {