refactor connected dispatches

Author: ShMcK

lib/components/Alert/index.js

@@ -31,16 +31,14 @@ var Alert = (function (_super) {
         _super.apply(this, arguments);
     }
     Alert.prototype.render = function () {
-        var _a = this.props, alert = _a.alert, close = _a.close;
+        var _a = this.props, alert = _a.alert, alertClose = _a.alertClose;
         var action = alert.action, message = alert.message, open = alert.open, duration = alert.duration, color = alert.color;
-        return (React.createElement(Snackbar_1.default, {style: styles, bodyStyle: { color: color }, open: open, message: message || '', action: action || '', autoHideDuration: duration || 2000, onActionTouchTap: close, onRequestClose: close}));
+        return (React.createElement(Snackbar_1.default, {style: styles, bodyStyle: { color: color }, open: open, message: message || '', action: action || '', autoHideDuration: duration || 2000, onActionTouchTap: alertClose, onRequestClose: alertClose}));
     };
     Alert = __decorate([
         react_redux_1.connect(function (state) { return ({
             alert: state.alert,
-        }); }, function (dispatch) { return ({
-            close: function () { dispatch(actions_1.alertClose()); },
-        }); }), 
+        }); }, { alertClose: actions_1.alertClose }), 
         __metadata('design:paramtypes', [])
     ], Alert);
     return Alert;

lib/components/AppMenu/CloseWindow.js

@@ -27,9 +27,7 @@ var CloseWindow = (function (_super) {
         return (React.createElement(IconButton_1.default, {onClick: this.props.windowToggle}, React.createElement(close_1.default, {color: 'white'})));
     };
     CloseWindow = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            windowToggle: function () { dispatch(actions_1.windowToggle()); },
-        }); }), 
+        react_redux_1.connect(null, { windowToggle: actions_1.windowToggle }), 
         __metadata('design:paramtypes', [])
     ], CloseWindow);
     return CloseWindow;

lib/components/AppMenu/MenuLink/index.js

@@ -27,13 +27,11 @@ var MenuLink = (function (_super) {
         _super.apply(this, arguments);
     }
     MenuLink.prototype.render = function () {
-        var _a = this.props, route = _a.route, title = _a.title, routeTo = _a.routeTo;
-        return (React.createElement(MenuItem_1.default, {style: styles, primaryText: title ? title : route, onTouchTap: routeTo.bind(this, route), key: route}));
+        var _a = this.props, route = _a.route, title = _a.title, routeSet = _a.routeSet;
+        return (React.createElement(MenuItem_1.default, {style: styles, primaryText: title ? title : route, onTouchTap: routeSet.bind(this, route), key: route}));
     };
     MenuLink = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            routeTo: function (route) { dispatch(actions_1.routeSet(route)); },
-        }); }), 
+        react_redux_1.connect(null, { routeSet: actions_1.routeSet }), 
         __metadata('design:paramtypes', [])
     ], MenuLink);
     return MenuLink;

lib/components/Common/RouteButton.js

@@ -23,13 +23,11 @@ var RouteButton = (function (_super) {
         _super.apply(this, arguments);
     }
     RouteButton.prototype.render = function () {
-        var _a = this.props, label = _a.label, route = _a.route, style = _a.style, routeTo = _a.routeTo;
-        return (React.createElement(RaisedButton_1.default, {label: label, style: style || {}, onTouchTap: routeTo.bind(this, route), secondary: true}));
+        var _a = this.props, label = _a.label, route = _a.route, style = _a.style, routeSet = _a.routeSet;
+        return (React.createElement(RaisedButton_1.default, {label: label, style: style || {}, onTouchTap: routeSet.bind(this, route), secondary: true}));
     };
     RouteButton = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            routeTo: function (route) { dispatch(actions_1.routeSet(route)); },
-        }); }), 
+        react_redux_1.connect(null, { routeSet: actions_1.routeSet }), 
         __metadata('design:paramtypes', [])
     ], RouteButton);
     return RouteButton;

lib/components/Page/Hints/HintButton.js

@@ -24,21 +24,19 @@ var HintButton = (function (_super) {
         _super.apply(this, arguments);
     }
     HintButton.prototype.render = function () {
-        var _a = this.props, hintPosition = _a.hintPosition, hintsLength = _a.hintsLength, label = _a.label, type = _a.type, hintSet = _a.hintSet;
+        var _a = this.props, hintPosition = _a.hintPosition, hintsLength = _a.hintsLength, label = _a.label, type = _a.type, hintPositionSet = _a.hintPositionSet;
         switch (type) {
             case 'next':
-                return (React.createElement(FlatButton_1.default, {label: label, disabled: hintPosition > hintsLength - 2, onTouchTap: hintSet.bind(this, hintPosition + 1)}));
+                return (React.createElement(FlatButton_1.default, {label: label, disabled: hintPosition > hintsLength - 2, onTouchTap: hintPositionSet.bind(this, hintPosition + 1)}));
             case 'prev':
-                return (React.createElement(FlatButton_1.default, {label: label, disabled: hintPosition === 0, onTouchTap: hintSet.bind(this, hintPosition - 1)}));
+                return (React.createElement(FlatButton_1.default, {label: label, disabled: hintPosition === 0, onTouchTap: hintPositionSet.bind(this, hintPosition - 1)}));
         }
     };
     HintButton = __decorate([
         react_redux_1.connect(function (state) { return ({
             hintPosition: state.hintPosition,
             hintsLength: selectors_1.hintsSelector(state).length,
-        }); }, function (dispatch) { return ({
-            hintSet: function (position) { dispatch(actions_1.hintPositionSet(position)); },
-        }); }), 
+        }); }, { hintPositionSet: actions_1.hintPositionSet }), 
         __metadata('design:paramtypes', [])
     ], HintButton);
     return HintButton;

lib/components/Page/PageToolbar/Continue/index.js

@@ -30,12 +30,10 @@ var Continue = (function (_super) {
         _super.apply(this, arguments);
     }
     Continue.prototype.render = function () {
-        return (React.createElement(RaisedButton_1.default, {style: styles, label: 'Continue', primary: true, onTouchTap: this.props.callNextPage}));
+        return (React.createElement(RaisedButton_1.default, {style: styles, label: 'Continue', primary: true, onTouchTap: this.props.pageNext}));
     };
     Continue = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            callNextPage: function () { dispatch(actions_1.pageNext()); },
-        }); }), 
+        react_redux_1.connect(null, { pageNext: actions_1.pageNext }), 
         __metadata('design:paramtypes', [])
     ], Continue);
     return Continue;

lib/components/Page/PageToolbar/Save/index.js

@@ -30,12 +30,10 @@ var Save = (function (_super) {
         _super.apply(this, arguments);
     }
     Save.prototype.render = function () {
-        return (React.createElement(RaisedButton_1.default, {label: 'Save', style: styles, secondary: true, onTouchTap: this.props.save}));
+        return (React.createElement(RaisedButton_1.default, {label: 'Save', style: styles, secondary: true, onTouchTap: this.props.editorSave}));
     };
     Save = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            save: function () { dispatch(actions_1.editorSave()); },
-        }); }), 
+        react_redux_1.connect(null, { editorSave: actions_1.editorSave }), 
         __metadata('design:paramtypes', [])
     ], Save);
     return Save;

lib/components/Page/PageToolbar/ToggleDevTools/index.js

@@ -28,13 +28,11 @@ var ToggleDevTools = (function (_super) {
         _super.apply(this, arguments);
     }
     ToggleDevTools.prototype.render = function () {
-        return (React.createElement(FlatButton_1.default, {style: styles, icon: React.createElement(code_1.default, null), onTouchTap: this.props.toggle}));
+        return (React.createElement(FlatButton_1.default, {style: styles, icon: React.createElement(code_1.default, null), onTouchTap: this.props.editorDevToolsToggle}));
     };
     ;
     ToggleDevTools = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            toggle: function () { dispatch(actions_1.editorDevToolsToggle()); },
-        }); }), 
+        react_redux_1.connect(null, { editorDevToolsToggle: actions_1.editorDevToolsToggle }), 
         __metadata('design:paramtypes', [])
     ], ToggleDevTools);
     return ToggleDevTools;

lib/components/Progress/index.js

@@ -46,9 +46,7 @@ var Progress = (function (_super) {
             pagePosition: state.pagePosition,
             info: state.tutorial.info,
             tutorial: state.tutorial
-        }); }, function (dispatch) { return ({
-            progressLoad: function () { dispatch(actions_1.progressLoad()); }
-        }); }), 
+        }); }, { progressLoad: actions_1.progressLoad }), 
         __metadata('design:paramtypes', [])
     ], Progress);
     return Progress;

lib/components/Start/Checks/VerifyButton.js

@@ -23,12 +23,10 @@ var VerifyButton = (function (_super) {
         _super.apply(this, arguments);
     }
     VerifyButton.prototype.render = function () {
-        return (React.createElement(FlatButton_1.default, {label: 'Verify Setup Complete', primary: true, onTouchTap: this.props.verify}));
+        return (React.createElement(FlatButton_1.default, {label: 'Verify Setup Complete', primary: true, onTouchTap: this.props.setupVerify}));
     };
     VerifyButton = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            verify: function () { dispatch(actions_1.setupVerify()); },
-        }); }), 
+        react_redux_1.connect(null, { setupVerify: actions_1.setupVerify }), 
         __metadata('design:paramtypes', [])
     ], VerifyButton);
     return VerifyButton;

lib/components/Tutorials/LoadTutorials/index.js

@@ -27,9 +27,7 @@ var LoadTutorials = (function (_super) {
         return (React.createElement(FlatButton_1.default, {label: 'Check for Tutorials', secondary: true, onTouchTap: tutorialsFind}));
     };
     LoadTutorials = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            tutorialsFind: function () { dispatch(actions_1.tutorialsFind()); },
-        }); }), 
+        react_redux_1.connect(null, { tutorialsFind: actions_1.tutorialsFind }), 
         __metadata('design:paramtypes', [])
     ], LoadTutorials);
     return LoadTutorials;

lib/components/Tutorials/SelectTutorial/index.js

@@ -30,14 +30,12 @@ var SelectTutorial = (function (_super) {
         }
     };
     SelectTutorial.prototype.render = function () {
-        var _a = this.props, tutorial = _a.tutorial, selectTutorial = _a.selectTutorial;
+        var _a = this.props, tutorial = _a.tutorial, tutorialSet = _a.tutorialSet;
         var name = tutorial.name;
-        return (React.createElement(FlatButton_1.default, {label: this.displayName(name), primary: true, onTouchTap: selectTutorial.bind(this, name)}));
+        return (React.createElement(FlatButton_1.default, {label: this.displayName(name), primary: true, onTouchTap: tutorialSet.bind(this, name)}));
     };
     SelectTutorial = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            selectTutorial: function (name) { dispatch(actions_1.tutorialSet(name)); },
-        }); }), 
+        react_redux_1.connect(null, { tutorialSet: actions_1.tutorialSet }), 
         __metadata('design:paramtypes', [])
     ], SelectTutorial);
     return SelectTutorial;

lib/components/Tutorials/UpdateTutorial/index.js

@@ -37,9 +37,7 @@ var UpdateTutorial = (function (_super) {
         return (React.createElement("span", null, React.createElement(update_1.default, {style: styles.icon, color: colors_1.pink500, onTouchTap: tutorialUpdate.bind(this, tutorial.name)}), "``", React.createElement("span", {style: styles.latest}, tutorial.latest)));
     };
     UpdateTutorial = __decorate([
-        react_redux_1.connect(null, function (dispatch) { return ({
-            tutorialUpdate: function (title) { dispatch(actions_1.tutorialUpdate(title)); },
-        }); }), 
+        react_redux_1.connect(null, { tutorialUpdate: actions_1.tutorialUpdate }), 
         __metadata('design:paramtypes', [])
     ], UpdateTutorial);
     return UpdateTutorial;

lib/components/Tutorials/index.js

@@ -30,7 +30,7 @@ var Tutorials = (function (_super) {
         _super.call(this, props);
     }
     Tutorials.prototype.componentDidMount = function () {
-        this.props.loadTutorials();
+        this.props.tutorialsFind();
     };
     Tutorials.prototype.render = function () {
         var tutorials = this.props.tutorials;
@@ -43,9 +43,7 @@ var Tutorials = (function (_super) {
     Tutorials = __decorate([
         react_redux_1.connect(function (state) { return ({
             tutorials: state.tutorials,
-        }); }, function (dispatch) { return ({
-            loadTutorials: function () { dispatch(actions_1.tutorialsFind()); },
-        }); }), 
+        }); }, { tutorialsFind: actions_1.tutorialsFind }), 
         __metadata('design:paramtypes', [Object])
     ], Tutorials);
     return Tutorials;

src/components/Alert/index.tsx

@@ -15,14 +15,12 @@ const styles = {
 
 @connect(state => ({
   alert: state.alert,
-}), dispatch => ({
-  close() { dispatch(alertClose()); },
-}))
+}), {alertClose})
 export default class Alert extends React.Component<{
-  alert?: CR.Alert, close?: any
+  alert?: CR.Alert, alertClose?: any
 }, {}> {
   render() {
-    const {alert, close} = this.props;
+    const {alert, alertClose} = this.props;
     const {action, message, open, duration, color} = alert;
     return (
       <Snackbar
@@ -32,8 +30,8 @@ export default class Alert extends React.Component<{
           message={message || ''}
           action={action || ''}
           autoHideDuration={duration || 2000}
-          onActionTouchTap={close}
-          onRequestClose={close}
+          onActionTouchTap={alertClose}
+          onRequestClose={alertClose}
       />
     );
   }

src/components/AppMenu/CloseWindow.tsx

@@ -4,9 +4,7 @@ import IconButton from 'material-ui/IconButton';
 import NavigationClose from 'material-ui/svg-icons/navigation/close';
 import {windowToggle} from '../../actions';
 
-@connect(null, dispatch => ({
-  windowToggle() { dispatch(windowToggle()); },
-}))
+@connect(null, { windowToggle })
 export default class CloseWindow extends React.Component<{
   windowToggle?: any}, {}> {
   render() {

src/components/AppMenu/MenuLink/index.tsx

@@ -8,19 +8,17 @@ const styles = {
   padding: '0px 2px',
 };
 
-@connect(null, dispatch => ({
-  routeTo(route: string) { dispatch(routeSet(route)); },
-}))
+@connect(null, {routeSet})
 export default class MenuLink extends React.Component<{
-  route: string, title?: string, routeTo?: any
+  route: string, title?: string, routeSet?: any
 }, {}> {
   render() {
-    const {route, title, routeTo} = this.props;
+    const {route, title, routeSet} = this.props;
     return (
       <MenuItem
         style={styles}
         primaryText={title ? title : route}
-        onTouchTap={routeTo.bind(this, route)}
+        onTouchTap={routeSet.bind(this, route)}
         key={route}
       />
     );

src/components/Common/RouteButton.tsx

@@ -3,19 +3,17 @@ import {connect} from 'react-redux';
 import RaisedButton from 'material-ui/RaisedButton';
 import {routeSet} from '../../actions';
 
-@connect(null, dispatch => ({
-  routeTo(route: string) { dispatch(routeSet(route)); },
-}))
+@connect(null, {routeSet})
 export default class RouteButton extends React.Component<{
-  label: string, route: string, routeTo?: any, style?: Object
+  label: string, route: string, routeSet?: any, style?: Object
 }, {}> {
   render() {
-    const {label, route, style, routeTo} = this.props;
+    const {label, route, style, routeSet} = this.props;
     return (
         <RaisedButton
           label={label}
           style={style || {}}
-          onTouchTap={routeTo.bind(this, route)}
+          onTouchTap={routeSet.bind(this, route)}
           secondary={true}
         />
     );

src/components/Page/Hints/HintButton.tsx

@@ -7,30 +7,28 @@ import {hintsSelector} from 'core-coderoad/lib/selectors';
 @connect(state => ({
   hintPosition: state.hintPosition,
   hintsLength: hintsSelector(state).length,
-}), dispatch => ({
-  hintSet(position: number) { dispatch(hintPositionSet(position)); },
-}))
+}), {hintPositionSet})
 export default class HintButton extends React.Component<{
   hintPosition?: number, hintsLength?: number, type: 'next'|'prev', label: string
-  hintSet?: any
+  hintPositionSet?: any
 }, {}> {
   render() {
-    const {hintPosition, hintsLength, label, type, hintSet} = this.props;
+    const {hintPosition, hintsLength, label, type, hintPositionSet} = this.props;
     switch (type) {
       case 'next':
       return (
         <FlatButton
           label={label}
           disabled={hintPosition > hintsLength - 2}
-          onTouchTap={hintSet.bind(this, hintPosition + 1)}
+          onTouchTap={hintPositionSet.bind(this, hintPosition + 1)}
         />
       );
       case 'prev':
       return (
         <FlatButton
           label={label}
           disabled={hintPosition === 0}
-          onTouchTap={hintSet.bind(this, hintPosition - 1)}
+          onTouchTap={hintPositionSet.bind(this, hintPosition - 1)}
         />
       );
     }

src/components/Page/PageToolbar/Continue/index.tsx

@@ -11,19 +11,17 @@ const styles = {
   top: '10px',
 };
 
-@connect(null, dispatch => ({
-  callNextPage() { dispatch(pageNext()); },
-}))
+@connect(null, {pageNext})
 export default class Continue extends React.Component<{
-  callNextPage?: any
+  pageNext?: any
 }, {}> {
   render() {
     return (
       <RaisedButton
         style={styles}
         label='Continue'
         primary={true}
-        onTouchTap={this.props.callNextPage}
+        onTouchTap={this.props.pageNext}
       />
     );
   }

src/components/Page/PageToolbar/Save/index.tsx

@@ -11,19 +11,17 @@ const styles = {
   top: '10px',
 };
 
-@connect(null, dispatch => ({
-  save() { dispatch(editorSave()); },
-}))
+@connect(null, {editorSave})
 export default class Save extends React.Component<{
-  save?: any
+  editorSave?: any
 }, {}> {
   render() {
     return (
       <RaisedButton
         label='Save'
         style={styles}
         secondary={true}
-        onTouchTap={this.props.save}
+        onTouchTap={this.props.editorSave}
       />
     );
   }