Fix editing custom activities (#9916)

* Rename const

* Move commonActivityCodes to utils

* Handle custom activities in humanizeActivityCode

* Fix dependency cycle for commonActivityCodes

* Localize names for humanizeActivityCode

* Move commonActivityCodes back to EditActivityModal

* Export new keys to JS

* Mark keys as used

* Use i18n on otherActivityCodes

(formerly commonActivityCodes)

app/webpacker/components/EditSchedule/EditActivities/EditActivityModal.js

@@ -6,24 +6,25 @@ import {
   Modal,
 } from 'semantic-ui-react';
 import { DateTime } from 'luxon';
+import I18n from '../../../lib/i18n';
 import useInputState from '../../../lib/hooks/useInputState';
 
-const commonActivityCodes = {
-  'other-registration': 'On-site registration',
-  'other-checkin': 'Check-in',
-  'other-tutorial': 'Tutorial for new competitors',
-  'other-multi': 'Cube submission for 3x3x3 Multi-Blind',
-  'other-breakfast': 'Breakfast',
-  'other-lunch': 'Lunch',
-  'other-dinner': 'Dinner',
-  'other-awards': 'Awards',
-  'other-misc': 'Other',
-};
+const otherActivityCodes = [
+  'other-registration',
+  'other-checkin',
+  'other-tutorial',
+  'other-multi',
+  'other-breakfast',
+  'other-lunch',
+  'other-dinner',
+  'other-awards',
+  'other-misc',
+];
 
-const otherActivityCodeOptions = Object.entries(commonActivityCodes)
-  .map(([activityCode, description]) => ({
+const otherActivityCodeOptions = otherActivityCodes
+  .map((activityCode) => ({
     key: activityCode,
-    text: description,
+    text: I18n.t(`activity.${activityCode.substring(6)}`),
     value: activityCode,
   }));
 
@@ -44,7 +45,7 @@ function EditActivityModal({
 
     // only if there is no name yet: assign a default name based on the activity code
     if (!activityName && newActivityCode) {
-      setActivityName(commonActivityCodes[newActivityCode]);
+      setActivityName(I18n.t(`activity.${newActivityCode.substring(6)}`));
     }
 
     setActivityCode(evt, data);

app/webpacker/lib/utils/wcif.js

@@ -104,19 +104,23 @@ export const localizeActivityCode = (activityCode, wcifRound, wcifEvent) => {
 };
 
 export const humanizeActivityCode = (activityCode) => {
+  if (activityCode.startsWith('other-')) {
+    return I18n.t(`activity.${activityCode.substring(6)}`);
+  }
+
   const { eventId, roundNumber, attempt } = parseActivityCode(activityCode);
 
   const eventName = I18n.t(`events.${eventId}`);
   const roundName = I18n.t('round.round_number', { round_number: roundNumber });
 
-  const tooltipText = `${eventName}, ${roundName}`;
+  const eventAndRoundName = `${eventName}, ${roundName}`;
 
   if (attempt) {
     const attemptName = I18n.t('attempts.attempt_name', { number: attempt });
-    return `${tooltipText}, ${attemptName}`;
+    return `${eventAndRoundName}, ${attemptName}`;
   }
 
-  return tooltipText;
+  return eventAndRoundName;
 };
 
 export const shortLabelForActivityCode = (activityCode) => {

config/i18n-tasks.yml.erb

@@ -112,6 +112,7 @@ ignore_unused:
   - 'contact.*.info'
   - 'organizer_guidelines.*'
   - 'merch.paragraphs.*'
+  - 'activity.*'
   # Mark all events/continents/countries as used.
   # FYI if a language doesn't translate one of them, it will appear in the missing keys, as long as it exists in English
   - 'events.*'

config/i18n.yml

@@ -34,6 +34,7 @@ translations:
     patterns:
       - "*.about.*"
       - "*.activerecord.attributes.user.*"
+      - "*.activity.*"
       - "*.common.*"
       - "*.competitions.*"
       - "*.countries.*"

config/locales/en.yml

@@ -206,6 +206,17 @@ en:
     deadline:
       description: "Qualification Deadline"
       by_date: "by %{date}"
+  #context: other activities which occur in the schedule
+  activity:
+    registration: "On-site registration"
+    checkin: "Check-in"
+    tutorial: "Tutorial for new competitors"
+    multi: "Cube submission for 3x3x3 Multi-Blind"
+    breakfast: "Breakfast"
+    lunch: "Lunch"
+    dinner: "Dinner"
+    awards: "Awards"
+    misc: "Other"
   #context: Common word used in multiple places on the website
   common:
     world: "World"