Revise localization calls

Keep localization in the container level. Ideally we should not be passing message descriptors.

src/components/asset-panel/selector.jsx

@@ -1,6 +1,5 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import {FormattedMessage} from 'react-intl';
 
 import SpriteSelectorItem from '../../containers/sprite-selector-item.jsx';
 
@@ -45,7 +44,7 @@ const Selector = props => {
                             src={img}
                         />
                         <Box className={styles.newButtonLabel}>
-                            <FormattedMessage {...message} />
+                            {message}
                         </Box>
                     </Box>
                 ))}
@@ -56,11 +55,7 @@ const Selector = props => {
 
 Selector.propTypes = {
     buttons: PropTypes.arrayOf(PropTypes.shape({
-        message: PropTypes.shape({
-            id: PropTypes.string.isRequired,
-            defaultMessage: PropTypes.string,
-            description: PropTypes.string
-        }),
+        message: PropTypes.node.isRequired,
         img: PropTypes.string.isRequired,
         onClick: PropTypes.func.isRequired
     })),

src/containers/costume-tab.jsx

@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import bindAll from 'lodash.bindall';
-import {defineMessages} from 'react-intl';
+import {FormattedMessage} from 'react-intl';
 import VM from 'scratch-vm';
 
 import AssetPanel from '../components/asset-panel/asset-panel.jsx';
@@ -61,20 +61,22 @@ class CostumeTab extends React.Component {
             return null;
         }
 
-        const messages = defineMessages({
-            addBackdrop: {
-                id: 'action.addBackdrop',
-                defaultMessage: 'Add Backdrop',
-                description: 'Button to add a backdrop in the editor tab'
-            },
-            addCostume: {
-                id: 'action.addCostume',
-                defaultMessage: 'Add Costume',
-                description: 'Button to add a costume in the editor tab'
-            }
-        });
+        const addBackdropMsg = (
+            <FormattedMessage
+                defaultMessage="Add Backdrop"
+                description="Button to add a backdrop in the editor tab"
+                id="action.addBackdrop"
+            />
+        );
+        const addCostumeMsg = (
+            <FormattedMessage
+                defaultMessage="Add Costume"
+                description="Button to add a costume in the editor tab"
+                id="action.addCostume"
+            />
+        );
 
-        const addMessage = target.isStage ? messages.addBackdrop : messages.addCostume;
+        const addMessage = target.isStage ? addBackdropMsg : addCostumeMsg;
         const addFunc = target.isStage ? onNewBackdropClick : onNewCostumeClick;
 
         return (

src/containers/sound-tab.jsx

@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import bindAll from 'lodash.bindall';
-import {defineMessages} from 'react-intl';
+import {FormattedMessage} from 'react-intl';
 import VM from 'scratch-vm';
 
 import AssetPanel from '../components/asset-panel/asset-panel.jsx';
@@ -74,27 +74,29 @@ class SoundTab extends React.Component {
             }
         )) : [];
 
-        const messages = defineMessages({
-            recordSound: {
-                id: 'action.recordSound',
-                defaultMessage: 'Record Sound',
-                description: 'Button to record a sound in the editor tab'
-            },
-            addSound: {
-                id: 'action.addSound',
-                defaultMessage: 'Add Sound',
-                description: 'Button to add a sound in the editor tab'
-            }
-        });
+        const recordSoundMsg = (
+            <FormattedMessage
+                defaultMessage="Record Sound"
+                description="Button to record a sound in the editor tab"
+                id="action.recordSound"
+            />
+        );
+        const addSoundMsg = (
+            <FormattedMessage
+                defaultMessage="Add Sound"
+                description="Button to add a sound in the editor tab"
+                id="action.addSound"
+            />
+        );
 
         return (
             <AssetPanel
                 buttons={[{
-                    message: messages.recordSound,
+                    message: recordSoundMsg,
                     img: addSoundFromRecordingIcon,
                     onClick: onNewSoundFromRecordingClick
                 }, {
-                    message: messages.addSound,
+                    message: addSoundMsg,
                     img: addSoundFromLibraryIcon,
                     onClick: onNewSoundFromLibraryClick
                 }]}