add: new messages file with French translations

docs/adding-new-world-checklist.md

@@ -23,7 +23,7 @@
   `'All worlds should be displayed as options and only one is checked'`
   test in `WorldSelector.test.js` for the new world
 - Add entries to `messages.json`
-  - `<WorldName>.name`: the name of the world
+  - `UI.<WorldName>.name`: the name of the world
   - `<WorldName>.character`: the name of the character
   - `<WorldName>.label`: the label used for the world in the
     Scene Background dialog

src/ActionPanel.test.js

@@ -24,7 +24,7 @@ function createMountActionPanel(props) {
                 {},
                 {
                     focusedOptionName: null,
-                    selectedCommandName: 'right45',
+                    selectedActionName: 'right45',
                     programSequence: new ProgramSequence(
                         [
                             {block: 'forward1'},
@@ -101,10 +101,10 @@ describe('ActionPanel options', () => {
     test('Given that there is no selected action, then the Replace button should be disabled', () => {
         const { wrapper } = createMountActionPanel({
             pressedStepIndex: 1,
-            selectedCommandName: null
+            selectedActionName: null
         });
         const replaceButton = getActionPanelOptionButtons(wrapper, 'replaceCurrentStep');
-        const expectedAriaLabel = 'Replace Step 2 turn left 45 degrees ';
+        const expectedAriaLabel = 'Replace Step 2 turn left 45 degrees';
         expect(replaceButton.get(0).props['aria-label']).toBe(expectedAriaLabel);
         expect(replaceButton.get(0).props['disabled']).toBe(true);
     });
@@ -127,7 +127,7 @@ describe('ActionPanel options', () => {
             pressedStepIndex: 0
         });
         const moveToPreviousStepButton = getActionPanelOptionButtons(wrapper, 'moveToPreviousStep');
-        const expectedAriaLabel = 'Move Step 1 forward 1 square ';
+        const expectedAriaLabel = 'Move Step 1 forward 1 square';
         expect(moveToPreviousStepButton.get(0).props['aria-label']).toBe(expectedAriaLabel);
         expect(moveToPreviousStepButton.get(0).props['disabled']).toBe(true);
         moveToPreviousStepButton.simulate('click');
@@ -150,7 +150,7 @@ describe('ActionPanel options', () => {
             pressedStepIndex: 0
         });
         const moveToPreviousStepButton = getActionPanelOptionButtons(wrapper, 'moveToPreviousStep');
-        const expectedAriaLabel = "Move Step 1 loop A ";
+        const expectedAriaLabel = "Move Step 1 loop A";
         expect(moveToPreviousStepButton.get(0).props['disabled']).toBe(true);
         moveToPreviousStepButton.simulate('click');
         expect(moveToPreviousStepButton.get(0).props['aria-label']).toBe(expectedAriaLabel);
@@ -173,7 +173,7 @@ describe('ActionPanel options', () => {
             pressedStepIndex: 2
         });
         const moveToPreviousStepButton = getActionPanelOptionButtons(wrapper, 'moveToPreviousStep');
-        const expectedAriaLabel = "Move Step 3 loop A ";
+        const expectedAriaLabel = "Move Step 3 loop A";
         expect(moveToPreviousStepButton.get(0).props['disabled']).toBe(true);
         moveToPreviousStepButton.simulate('click');
         expect(moveToPreviousStepButton.get(0).props['aria-label']).toBe(expectedAriaLabel);
@@ -328,7 +328,7 @@ describe('ActionPanel options', () => {
             pressedStepIndex: 2
         });
         const moveToNextStepButton = getActionPanelOptionButtons(wrapper, 'moveToNextStep');
-        const expectedAriaLabel = 'Move Step 3 turn right 45 degrees ';
+        const expectedAriaLabel = 'Move Step 3 turn right 45 degrees';
         expect(moveToNextStepButton.get(0).props['aria-label']).toBe(expectedAriaLabel);
         expect(moveToNextStepButton.get(0).props['disabled']).toBe(true);
         moveToNextStepButton.simulate('click');
@@ -351,7 +351,7 @@ describe('ActionPanel options', () => {
             pressedStepIndex: 0
         });
         const moveToNextStepButton = getActionPanelOptionButtons(wrapper, 'moveToNextStep');
-        const expectedAriaLabel = "Move Step 1 loop A ";
+        const expectedAriaLabel = "Move Step 1 loop A";
         expect(moveToNextStepButton.get(0).props['disabled']).toBe(true);
         moveToNextStepButton.simulate('click');
         expect(moveToNextStepButton.get(0).props['aria-label']).toBe(expectedAriaLabel);
@@ -374,7 +374,7 @@ describe('ActionPanel options', () => {
             pressedStepIndex: 2
         });
         const moveToNextStepButton = getActionPanelOptionButtons(wrapper, 'moveToNextStep');
-        const expectedAriaLabel = "Move Step 3 loop A ";
+        const expectedAriaLabel = "Move Step 3 loop A";
         expect(moveToNextStepButton.get(0).props['disabled']).toBe(true);
         moveToNextStepButton.simulate('click');
         expect(moveToNextStepButton.get(0).props['aria-label']).toBe(expectedAriaLabel);

src/ActionsMenuItem.js

@@ -34,8 +34,8 @@ export class ActionsMenuItem extends React.Component< ActionsMenuItemProps, {} >
 
     render () {
         // We don't use FormattedMessage as we are working with a complex chain of templates.
-        let commandName = this.props.intl.formatMessage({ id: `ActionsMenuItem.command.${this.props.itemKey}` });
-        const usedLabel = this.props.intl.formatMessage({ id: 'ActionsMenuItem.usedItemToggleLabel' });
+        let commandName = this.props.intl.formatMessage({ id: `UI.ActionsMenuItem.command.${this.props.itemKey}` });
+        const usedLabel = this.props.intl.formatMessage({ id: 'UI.ActionsMenuItem.usedItemToggleLabel' });
         if (this.props.isUsed) {
             commandName += " " + usedLabel;
         }

src/ActionsSimplificationModal.js

@@ -54,14 +54,14 @@ class ActionsSimplificationModal extends React.Component<ActionsSimplificationMo
 
     render() {
         const cancelButtonProperties = {
-            label: this.props.intl.formatMessage({ id: 'ActionsSimplificationModal.cancel'} ),
+            label: this.props.intl.formatMessage({ id: 'UI.Cancel'} ),
             isPrimary: false,
             onClick: this.handleOnCancel
         };
         const saveButtonProperties = {
             id: 'ActionSimplificationModal-done',
             isPrimary: true,
-            label: this.props.intl.formatMessage({ id: 'ActionsSimplificationModal.save'} ),
+            label: this.props.intl.formatMessage({ id: 'UI.Save'} ),
             onClick: this.saveChanges
         };
         return (
@@ -75,14 +75,14 @@ class ActionsSimplificationModal extends React.Component<ActionsSimplificationMo
             >
                 <ModalHeader
                     id='ActionsSimplificationModal__header'
-                    title={this.props.intl.formatMessage({ id: 'ActionsSimplificationModal.title'})}
+                    title={this.props.intl.formatMessage({ id: 'UI.ActionsSimplificationModal.title'})}
                 >
                     <SimplificationIcon aria-hidden='true'/>
                 </ModalHeader>
 
                 <ModalBody>
                     <h3 className='ActionsSimplificationModal__section-heading'>
-                        <FormattedMessage id="CommandPalette.movementsTitle"/>
+                        <FormattedMessage id="UI.CommandPalette.movementsTitle"/>
                     </h3>
 
                     <div className='ActionsSimplificationModal__section'>
@@ -91,7 +91,7 @@ class ActionsSimplificationModal extends React.Component<ActionsSimplificationMo
 
 
                     <h3 className='ActionsSimplificationModal__section-heading'>
-                        <FormattedMessage id="CommandPalette.controlsTitle"/>
+                        <FormattedMessage id="UI.CommandPalette.controlsTitle"/>
                     </h3>
 
                     <div className='ActionsSimplificationModal__section'>

src/AnnouncementBuilder.js

@@ -16,43 +16,43 @@ export default class AnnouncementBuilder {
     }
 
     buildSelectActionAnnouncement(action: string): AnnouncementData {
-        let commandType = null;
+        let actionType = null;
         if (action === 'loop') {
-            commandType = this.intl.formatMessage({
+            actionType = this.intl.formatMessage({
                 id: 'Announcement.control'
             });
         } else {
-            commandType = this.intl.formatMessage({
+            actionType = this.intl.formatMessage({
                 id: 'Announcement.movement'
             });
         }
         return {
             messageIdSuffix: 'actionSelected',
             values: {
-                commandType: commandType,
-                command: this.intl.formatMessage({
+                actionType,
+                actionName: this.intl.formatMessage({
                     id: `Announcement.${action}`
                 }),
             }
         };
     }
 
     buildAddStepAnnouncement(action: string): AnnouncementData {
-        let commandType = null;
+        let actionType = null;
         if (action === 'loop') {
-            commandType = this.intl.formatMessage({
+            actionType = this.intl.formatMessage({
                 id: 'Announcement.control'
             });
         } else {
-            commandType = this.intl.formatMessage({
+            actionType = this.intl.formatMessage({
                 id: 'Announcement.movement'
             });
         }
         return {
             messageIdSuffix: 'add',
             values: {
-                commandType: commandType,
-                command: this.intl.formatMessage({
+                actionType,
+                actionName: this.intl.formatMessage({
                     id: `Announcement.${action}`
                 }),
             }
@@ -64,10 +64,10 @@ export default class AnnouncementBuilder {
             return {
                 messageIdSuffix: 'delete',
                 values: {
-                    commandType: this.intl.formatMessage({
+                    actionType: this.intl.formatMessage({
                         id: "Announcement.control"
                     }),
-                    command: this.intl.formatMessage(
+                    actionName: this.intl.formatMessage(
                         {
                             id: `Announcement.${programBlock.block}`
                         },
@@ -81,10 +81,10 @@ export default class AnnouncementBuilder {
             return {
                 messageIdSuffix: 'delete',
                 values: {
-                    commandType: this.intl.formatMessage({
+                    actionType: this.intl.formatMessage({
                         id: "Announcement.movement"
                     }),
-                    command: this.intl.formatMessage(
+                    actionName: this.intl.formatMessage(
                         {
                             id: `Announcement.${programBlock.block}`
                         }
@@ -100,10 +100,10 @@ export default class AnnouncementBuilder {
         return {
             messageIdSuffix: 'replace',
             values: {
-                oldCommand: this.intl.formatMessage({
+                oldActionName: this.intl.formatMessage({
                     id: `Announcement.${programBlock.block}`
                 }),
-                newCommand: this.intl.formatMessage({
+                newActionName: this.intl.formatMessage({
                     id: `Announcement.${selectedAction}`
                 })
             }

src/AnnouncementBuilder.test.js

@@ -22,16 +22,16 @@ test('Test buildSelectActionAnnouncement()', () => {
     expect(announcementBuilder.buildSelectActionAnnouncement('loop')).toStrictEqual({
         messageIdSuffix: 'actionSelected',
         values: {
-            commandType: 'control',
-            command: 'loop'
+            actionType: 'control',
+            actionName: 'loop'
         }
     });
 
     expect(announcementBuilder.buildSelectActionAnnouncement('forward1')).toStrictEqual({
         messageIdSuffix: 'actionSelected',
         values: {
-            commandType: 'movement',
-            command: 'forward 1 square'
+            actionType: 'movement',
+            actionName: 'forward 1 square'
         }
     });
 });
@@ -44,16 +44,16 @@ test('Test buildAddStepAnnouncement()', () => {
     expect(announcementBuilder.buildAddStepAnnouncement('loop')).toStrictEqual({
         messageIdSuffix: 'add',
         values: {
-            commandType: 'control',
-            command: 'loop'
+            actionType: 'control',
+            actionName: 'loop'
         }
     });
 
     expect(announcementBuilder.buildAddStepAnnouncement('forward1')).toStrictEqual({
         messageIdSuffix: 'add',
         values: {
-            commandType: 'movement',
-            command: 'forward 1 square'
+            actionType: 'movement',
+            actionName: 'forward 1 square'
         }
     });
 });
@@ -71,8 +71,8 @@ describe('Test buildDeleteStepAnnouncement()', () => {
         expect(announcementBuilder.buildDeleteStepAnnouncement(startLoopBlock)).toStrictEqual({
             messageIdSuffix: 'delete',
             values: {
-                commandType: 'control',
-                command: 'loop A'
+                actionType: 'control',
+                actionName: 'loop A'
             }
         });
     });
@@ -88,8 +88,8 @@ describe('Test buildDeleteStepAnnouncement()', () => {
         expect(announcementBuilder.buildDeleteStepAnnouncement(endLoopBlock)).toStrictEqual({
             messageIdSuffix: 'delete',
             values: {
-                commandType: 'control',
-                command: 'loop A'
+                actionType: 'control',
+                actionName: 'loop A'
             }
         });
     });
@@ -104,8 +104,8 @@ describe('Test buildDeleteStepAnnouncement()', () => {
         expect(announcementBuilder.buildDeleteStepAnnouncement(forwardBlock)).toStrictEqual({
             messageIdSuffix: 'delete',
             values: {
-                commandType: 'movement',
-                command: 'forward 1 square'
+                actionType: 'movement',
+                actionName: 'forward 1 square'
             }
         });
     });
@@ -123,8 +123,8 @@ test('Test buildReplaceStepAnnouncement()', () => {
     expect(announcementBuilder.buildReplaceStepAnnouncement(forwardBlock, 'right45')).toStrictEqual({
         messageIdSuffix: 'replace',
         values: {
-            oldCommand: 'forward 1 square',
-            newCommand: 'turn right 45 degrees'
+            oldActionName: 'forward 1 square',
+            newActionName: 'turn right 45 degrees'
         }
     });
 });

src/App.js

@@ -266,7 +266,7 @@ export class App extends React.Component<AppProps, AppState> {
         });
     }
 
-    getSelectedCommandName() {
+    getSelectedActionName() {
         if (this.state.selectedAction !== null) {
             return this.state.selectedAction;
         } else {
@@ -960,7 +960,7 @@ export class App extends React.Component<AppProps, AppState> {
                     <CommandPaletteCommand
                         key={`CommandBlock-${index}`}
                         commandName={value}
-                        selectedCommandName={this.getSelectedCommandName()}
+                        selectedActionName={this.getSelectedActionName()}
                         audioManager={this.audioManager}
                         isDraggingCommand={this.state.isDraggingCommand}
                         onSelect={this.handleCommandFromCommandPalette}
@@ -1268,13 +1268,13 @@ export class App extends React.Component<AppProps, AppState> {
                         className="App__PrivacyModal__toggle-button"
                         onClick={this.handleClickPrivacyButton}
                     >
-                        <FormattedMessage id='App.privacyModalToggle'/>
+                        <FormattedMessage id='UI.App.privacyModalToggle'/>
                     </button>
                 </div>
                 <div className='App__header-menu'>
                     <IconButton
                         className="App__header-soundOptions"
-                        ariaLabel={this.props.intl.formatMessage({ id: 'SoundOptionsModal.title' })}
+                        ariaLabel={this.props.intl.formatMessage({ id: 'UI.SoundOptionsModal.title' })}
                         onClick={this.handleClickSoundIcon}
                     >
                         <AudioIcon
@@ -1423,14 +1423,14 @@ export class App extends React.Component<AppProps, AppState> {
             <React.Fragment>
                 <div className='App__ActionsMenu__header'>
                     <h2 className='App__ActionsMenu__header-heading'>
-                        <FormattedMessage id='ActionsMenu.title' />
+                        <FormattedMessage id='UI.ActionsMenu.title' />
                     </h2>
                 </div>
                 <div className='App__command-palette-command-container'>
                     <div className='App__command-palette-section'>
                         <div className='App__command-palette-section-heading-container'>
                             <h3 className='App__command-palette-section-heading'>
-                                <FormattedMessage id='CommandPalette.movementsTitle'/>
+                                <FormattedMessage id='UI.CommandPalette.movementsTitle'/>
                             </h3>
                         </div>
                         <div className='App__command-palette-section-body'>
@@ -1455,7 +1455,7 @@ export class App extends React.Component<AppProps, AppState> {
                     <div className='App__command-palette-section'>
                         <div className='App__command-palette-section-heading-container'>
                             <h3 className='App__command-palette-section-heading'>
-                                <FormattedMessage id='CommandPalette.controlsTitle'/>
+                                <FormattedMessage id='UI.CommandPalette.controlsTitle'/>
                             </h3>
                         </div>
 
@@ -1548,7 +1548,7 @@ export class App extends React.Component<AppProps, AppState> {
                             aria-hidden={true}
                         />
                         <div className='App__ShareButton__label'>
-                            {this.props.intl.formatMessage({id:'ShareButton'})}
+                            {this.props.intl.formatMessage({id:'UI.ShareButton'})}
                         </div>
                     </button>
                 </div>