add linting for react/jsx-props-no-spreading and fix resulting lintin…

…g errors

.eslintrc.js

@@ -85,7 +85,7 @@ module.exports = {
 		'react/jsx-curly-newline': [0],
 		'react/jsx-indent': [1, 'tab'],
 		'react/jsx-indent-props': [1, 'tab'],
-		'react/jsx-props-no-spreading': [0], // TODO: enable this check
+		'react/jsx-props-no-spreading': [1],
 		'react/no-access-state-in-setstate': [1],
 		'react/no-danger': [0],
 		'react/prop-types': [0],

app/hub/Views/AppView/AppViewContainer.jsx

@@ -36,11 +36,13 @@ class AppViewContainer extends Component {
 	 * @return {JSX} JSX for rendering the Home View of the Hub app
 	 */
 	render() {
-		const childProps = {
-			...this.props,
-			exitToast: this._exitToast,
-		};
-		return <AppView {...childProps} />;
+		const { app, children } = this.props;
+
+		return (
+			<AppView app={app} exitToast={this._exitToast}>
+				{children}
+			</AppView>
+		);
 	}
 }
 

app/hub/Views/CreateAccountView/CreateAccountViewContainer.jsx

@@ -172,30 +172,26 @@ class CreateAccountViewContainer extends Component {
 			passwordInvalidError,
 			passwordLengthError,
 		} = this.state;
-		const createAccountChildProps = {
-			email,
-			emailError,
-			confirmEmail,
-			confirmEmailError,
-			firstName,
-			lastName,
-			legalConsentChecked,
-			legalConsentNotCheckedError,
-			password,
-			passwordInvalidError,
-			passwordLengthError,
-			handleInputChange: this._handleInputChange,
-			handleLegalConsentCheckboxChange: this._handleLegalConsentCheckboxChange,
-			handleSubmit: this._handleCreateAccountAttempt
-		};
-		const signedInChildProps = {
-			email: (user && user.email) || email,
-		};
 
 		return loggedIn ? (
-			<SignedInView {...signedInChildProps} />
+			<SignedInView email={(user && user.email) || email} />
 		) : (
-			<CreateAccountView {...createAccountChildProps} />
+			<CreateAccountView
+				email={email}
+				emailError={emailError}
+				confirmEmail={confirmEmail}
+				confirmEmailError={confirmEmailError}
+				firstName={firstName}
+				lastName={lastName}
+				legalConsentChecked={legalConsentChecked}
+				legalConsentNotCheckedError={legalConsentNotCheckedError}
+				password={password}
+				passwordInvalidError={passwordInvalidError}
+				passwordLengthError={passwordLengthError}
+				handleInputChange={this._handleInputChange}
+				handleLegalConsentCheckboxChange={this._handleLegalConsentCheckboxChange}
+				handleSubmit={this._handleCreateAccountAttempt}
+			/>
 		);
 	}
 }

app/hub/Views/HomeView/HomeViewContainer.jsx

@@ -124,15 +124,6 @@ class HomeViewContainer extends Component {
 			tutorial_complete,
 			enable_metrics,
 		} = home;
-		const childProps = {
-			justInstalled,
-			setup_complete,
-			tutorial_complete,
-			enable_metrics,
-			changeMetrics: this._handleToggleMetrics,
-			email: user ? user.email : '',
-			isPlus,
-		};
 
 		const showPromoModal = !premium_promo_modal_shown && !this._premiumSubscriber();
 
@@ -147,7 +138,15 @@ class HomeViewContainer extends Component {
 					handleGetPlusClick={this._handleGetPlusClick}
 					handleTryMidnightClick={this._handleTryMidnightClick}
 				/>
-				<HomeView {...childProps} />
+				<HomeView
+					justInstalled={justInstalled}
+					setup_complete={setup_complete}
+					tutorial_complete={tutorial_complete}
+					enable_metrics={enable_metrics}
+					changeMetrics={this._handleToggleMetrics}
+					email={user ? user.email : ''}
+					isPlus={isPlus}
+				/>
 			</div>
 		);
 	}

app/hub/Views/LogInView/LogInViewContainer.jsx

@@ -128,22 +128,18 @@ class LogInViewContainer extends Component {
 			emailError,
 			passwordError,
 		} = this.state;
-		const logInChildProps = {
-			email,
-			password,
-			emailError,
-			passwordError,
-			handleInputChange: this._handleInputChange,
-			handleSubmit: this._handleLoginAttempt,
-		};
-		const signedInChildProps = {
-			email: (user && user.email) || 'email',
-		};
 
 		return loggedIn ? (
-			<SignedInView {...signedInChildProps} />
+			<SignedInView email={(user && user.email) || 'email'} />
 		) : (
-			<LogInView {...logInChildProps} />
+			<LogInView
+				email={email}
+				password={password}
+				emailError={emailError}
+				passwordError={passwordError}
+				handleInputChange={this._handleInputChange}
+				handleSubmit={this._handleLoginAttempt}
+			/>
 		);
 	}
 }

app/hub/Views/PlusView/PlusViewContainer.jsx

@@ -43,12 +43,12 @@ class PlusViewContainer extends Component {
 	 * @return {JSX} JSX for rendering the Plus View of the Hub app
 	 */
 	render() {
-		const childProps = {
-			isPlus: (this.props.user && this.props.user.subscriptionsPlus) || false,
-			onPlusClick: this._sendPlusPing,
-		};
-
-		return <PlusView {...childProps} />;
+		return (
+			<PlusView
+				isPlus={(this.props.user && this.props.user.subscriptionsPlus) || false}
+				onPlusClick={this._sendPlusPing}
+			/>
+		);
 	}
 }
 

app/hub/Views/SetupView/SetupView.jsx

@@ -36,7 +36,7 @@ const SetupView = (props) => {
 						path={step.path}
 						render={() => (
 							<div>
-								<SetupHeader {...step.headerProps} />
+								<SetupHeader title={step.headerProps.title} titleImage={step.headerProps.titleImage} />
 								<step.bodyComponent index={step.index} sendMountActions={sendMountActions} />
 							</div>
 						)}

app/hub/Views/SetupViews/SetupHumanWebView/SetupHumanWebViewContainer.jsx

@@ -58,11 +58,12 @@ class SetupHumanWebViewContainer extends Component {
 	 * @return {JSX} JSX for rendering the Setup Human Web View of the Hub app
 	 */
 	render() {
-		const childProps = {
-			enableHumanWeb: this.props.setup.enable_human_web,
-			changeHumanWeb: this._handleToggle,
-		};
-		return <SetupHumanWebView {...childProps} />;
+		return (
+			<SetupHumanWebView
+				enableHumanWeb={this.props.setup.enable_human_web}
+				changeHumanWeb={this._handleToggle}
+			/>
+		);
 	}
 }
 

app/hub/Views/SetupViews/SetupNavigation/SetupNavigationContainer.jsx

@@ -22,12 +22,19 @@ import { SteppedNavigation } from '../../../../shared-components';
  */
 const SetupNavigationContainer = (props) => {
 	const { totalSteps, setup } = props;
-	const childProps = {
-		totalSteps,
-		...setup.navigation,
-	};
 
-	return <SteppedNavigation {...childProps} />;
+	return (
+		<SteppedNavigation
+			totalSteps={totalSteps}
+			activeIndex={setup.navigation.activeIndex}
+			hrefPrev={setup.navigation.hrefPrev}
+			hrefNext={setup.navigation.hrefNext}
+			hrefDone={setup.navigation.hrefDone}
+			textPrev={setup.navigation.textPrev}
+			textNext={setup.navigation.textNext}
+			textDone={setup.navigation.textDone}
+		/>
+	);
 };
 
 // PropTypes ensure we pass required props of the correct type

app/hub/Views/SideNavigationView/SideNavigationViewContainer.jsx

@@ -68,13 +68,14 @@ class SideNavigationViewContainer extends Component {
 				icon: 'profile',
 			},
 		];
-		const childProps = {
-			menuItems,
-			bottomItems,
-			disableNav: disableRegEx.test(location.pathname),
-		};
 
-		return <SideNavigationView {...childProps} />;
+		return (
+			<SideNavigationView
+				menuItems={menuItems}
+				bottomItems={bottomItems}
+				disableNav={disableRegEx.test(location.pathname)}
+			/>
+		);
 	}
 }
 

app/hub/Views/TutorialViews/TutorialNavigation/TutorialNavigationContainer.jsx

@@ -22,11 +22,19 @@ import { SteppedNavigation } from '../../../../shared-components';
  */
 const TutorialNavigationContainer = (props) => {
 	const { totalSteps, tutorial } = props;
-	const childProps = {
-		totalSteps,
-		...tutorial.navigation,
-	};
-	return <SteppedNavigation {...childProps} />;
+
+	return (
+		<SteppedNavigation
+			totalSteps={totalSteps}
+			activeIndex={tutorial.navigation.activeIndex}
+			hrefPrev={tutorial.navigation.hrefPrev}
+			hrefNext={tutorial.navigation.hrefNext}
+			hrefDone={tutorial.navigation.hrefDone}
+			textPrev={tutorial.navigation.textPrev}
+			textNext={tutorial.navigation.textNext}
+			textDone={tutorial.navigation.textDone}
+		/>
+	);
 };
 
 // PropTypes ensure we pass required props of the correct type