Fix student registration localization

Add missing strings, actually translate the content of the steps

src/components/registration/steps.jsx

@@ -742,13 +742,9 @@ module.exports = {
             );
         }
     })),
-    ClassInviteStep: React.createClass({
+    ClassInviteStep: intl.injectIntl(React.createClass({
         getDefaultProps: function () {
             return {
-                messages: {
-                    'general.getStarted': 'Get Started',
-                    'registration.classroomInviteStepDescription': 'has invited you to join the class:'
-                },
                 waiting: false
             };
         },
@@ -756,6 +752,7 @@ module.exports = {
             this.props.onNextStep();
         },
         render: function () {
+            var formatMessage = this.props.intl.formatMessage;
             return (
                 <Slide className="registration-step class-invite-step">
                     {this.props.waiting ? [
@@ -765,7 +762,7 @@ module.exports = {
                                 src={this.props.classroom.educator.profile.images['50x50']} />,
                         <h2>{this.props.classroom.educator.username}</h2>,
                         <p className="description">
-                            {this.props.messages['registration.classroomInviteStepDescription']}
+                            {formatMessage({id: 'registration.classroomInviteStepDescription'})}
                         </p>,
                         <Card>
                             <div className="contents">
@@ -774,24 +771,17 @@ module.exports = {
                             </div>
                             <NextStepButton onClick={this.onNextStep}
                                             waiting={this.props.waiting}
-                                            text={this.props.messages['general.getStarted']} />
+                                            text={formatMessage({id: 'general.getStarted'})} />
                         </Card>,
                         <StepNavigation steps={this.props.totalSteps - 1} active={this.props.activeStep} />
                     ]}
                 </Slide>
             );
         }
-    }),
-    ClassWelcomeStep: React.createClass({
+    })),
+    ClassWelcomeStep: intl.injectIntl(React.createClass({
         getDefaultProps: function () {
             return {
-                messages: {
-                    'registration.goToClass': 'Go to Class',
-                    'registration.welcomeStepDescription': 'You have successfully set up a Scratch account! ' +
-                                                                  'You are now a member of the class:',
-                    'registration.welcomeStepPrompt': 'To get started, click on the button below.',
-                    'registration.welcomeStepTitle': 'Hurray! Welcome to Scratch!'
-                },
                 waiting: false
             };
         },
@@ -799,32 +789,33 @@ module.exports = {
             this.props.onNextStep();
         },
         render: function () {
+            var formatMessage = this.props.intl.formatMessage;
             return (
                 <Slide className="registration-step class-welcome-step">
                     {this.props.waiting ? [
                         <Spinner />
                     ] : [
-                        <h2>{this.props.messages['registration.welcomeStepTitle']}</h2>,
-                        <p className="description">{this.props.messages['registration.welcomeStepDescription']}</p>,
+                        <h2>{formatMessage({id: 'registration.welcomeStepTitle'})}</h2>,
+                        <p className="description">{formatMessage({id: 'registration.welcomeStepDescription'})}</p>,
                         <Card>
                             {this.props.classroom ? (
                                 <div className="contents">
                                     <h3>{this.props.classroom.title}</h3>
                                     <img className="class-image" src={this.props.classroom.images['250x150']} />
-                                    <p>{this.props.messages['registration.welcomeStepPrompt']}</p>
+                                    <p>{formatMessage({id: 'registration.welcomeStepPrompt'})}</p>
                                 </div>
                             ) : (
                                 null
                             )}
                             <NextStepButton onClick={this.onNextStep}
                                             waiting={this.props.waiting}
-                                            text={this.props.messages['registration.goToClass']} />
+                                            text={formatMessage({id: 'registration.goToClass'})} />
                         </Card>
                     ]}
                 </Slide>
             );
         }
-    }),
+    })),
     RegistrationError: intl.injectIntl(React.createClass({
         render: function () {
             return (

src/l10n.json

@@ -22,6 +22,7 @@
     "general.forParents": "For Parents",
     "general.forEducators": "For Educators",
     "general.forDevelopers": "For Developers",
+    "general.getStarted": "Get Started",
     "general.gender": "Gender",
     "general.guidelines": "Community Guidelines",
     "general.help": "Help",
@@ -107,6 +108,7 @@
 
     "registration.checkOutResources": "Get Started with Resources",
     "registration.checkOutResourcesDescription": "Explore materials for educators and facilitators written by the Scratch Team, including <a href='/educators#resources'>tips, tutorials, and guides</a>.",
+    "registration.classroomInviteStepDescription": "has invited you to join the class:",
     "registration.confirmYourEmail": "Confirm Your Email",
     "registration.confirmYourEmailDescription": "If you haven't already, please click the link in the confirmation email sent to:",
     "registration.createUsername": "Create a Username",

src/views/studentregistration/studentregistration.jsx

@@ -103,7 +103,6 @@ var StudentRegistration = intl.injectIntl(React.createClass({
                 :
                     <Progression {... this.state}>
                         <Steps.ClassInviteStep classroom={this.state.classroom}
-                                               messages={this.props.messages}
                                                onNextStep={this.advanceStep}
                                                waiting={this.state.waiting || !this.state.classroom} />
                         <Steps.UsernameStep onNextStep={this.advanceStep}
@@ -116,7 +115,6 @@ var StudentRegistration = intl.injectIntl(React.createClass({
                                                 onNextStep={this.register}
                                                 waiting={this.state.waiting} />
                         <Steps.ClassWelcomeStep classroom={this.state.classroom}
-                                                messages={this.props.messages}
                                                 onNextStep={this.goToClass}
                                                 waiting={this.state.waiting || !this.state.classroom} />
                     </Progression>