refactor out all UI events into reducers

ShMcK · ShMcK · commit bf4079edf436 · 2016-05-03T22:24:08.000-07:00
diff --git a/lib/actions/_types.js b/lib/actions/_types.js
@@ -3,14 +3,17 @@ exports.ALERT_REPLAY = 'ALERT_REPLAY';
 exports.ALERT_TOGGLE = 'ALERT_TOGGLE';
 exports.COMPLETE_PAGE = 'COMPLETE_PAGE';
 exports.COMPLETE_TUTORIAL = 'COMPLETE_TUTORIAL';
+exports.DEVTOOLS_TOGGLE = 'DEVTOOLS_TOGGLE';
 exports.HINT_POSITION_SET = 'HINT_POSITION_SET';
 exports.HINT_SHOW = 'HINT_SHOW';
 exports.PACKAGE_SET = 'PACKAGE_SET';
 exports.PAGE_SET = 'PAGE_SET';
 exports.PAGE_POSITION_LOAD = 'POSITION_LOAD';
 exports.PAGE_POSITION_SET = 'POSITION_SET';
 exports.PROGRESS_LOAD = 'PROGRESS_LOAD';
+exports.QUIT = 'QUIT';
 exports.ROUTE_SET = 'ROUTE_SET';
+exports.TEST_SAVE = 'TEST_SAVE';
 exports.SETUP_VERIFY = 'SETUP_VERIFY';
 exports.TEST_COMPLETE = 'TEST_COMPLETE';
 exports.TEST_RESULT = 'TEST_RESULT';
diff --git a/lib/actions/index.js b/lib/actions/index.js
@@ -22,10 +22,13 @@ var test_1 = require('./test');
 exports.testRun = test_1.testRun;
 exports.testComplete = test_1.testComplete;
 exports.testResult = test_1.testResult;
+exports.testSave = test_1.testSave;
 exports.testsLoad = test_1.testsLoad;
 var tutorial_1 = require('./tutorial');
 exports.tutorialsFind = tutorial_1.tutorialsFind;
 exports.tutorialSet = tutorial_1.tutorialSet;
 exports.tutorialUpdate = tutorial_1.tutorialUpdate;
-var window_1 = require('./window');
-exports.windowToggle = window_1.windowToggle;
+var toggle_1 = require('./toggle');
+exports.windowToggle = toggle_1.windowToggle;
+exports.devToolsToggle = toggle_1.devToolsToggle;
+exports.quit = toggle_1.quit;
diff --git a/lib/actions/test.js b/lib/actions/test.js
@@ -17,6 +17,10 @@ function testComplete() {
     return { type: _types_1.TEST_COMPLETE };
 }
 exports.testComplete = testComplete;
+function testSave() {
+    return { type: _types_1.TEST_SAVE };
+}
+exports.testSave = testSave;
 function testsLoad(pagePosition) {
     return { type: _types_1.TESTS_LOAD, payload: { pagePosition: pagePosition } };
 }
diff --git a/lib/actions/toggle.js b/lib/actions/toggle.js
@@ -0,0 +1,14 @@
+"use strict";
+var _types_1 = require('./_types');
+function windowToggle() {
+    return { type: _types_1.WINDOW_TOGGLE };
+}
+exports.windowToggle = windowToggle;
+function devToolsToggle() {
+    return { type: _types_1.DEVTOOLS_TOGGLE };
+}
+exports.devToolsToggle = devToolsToggle;
+function quit() {
+    return { type: _types_1.QUIT };
+}
+exports.quit = quit;
diff --git a/lib/components/AppMenu/Quit/index.js b/lib/components/AppMenu/Quit/index.js
@@ -16,7 +16,6 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 var React = require('react');
 var react_redux_1 = require('react-redux');
 var actions_1 = require('../../../actions');
-var subscriptions_1 = require('../../../atom/subscriptions');
 var MenuItem_1 = require('material-ui/MenuItem');
 var styles = {
     textAlign: 'center',
@@ -34,8 +33,7 @@ var Quit = (function (_super) {
         react_redux_1.connect(null, function (dispatch) {
             return {
                 quit: function () {
-                    dispatch(actions_1.windowToggle());
-                    subscriptions_1.onDeactivate();
+                    dispatch(actions_1.quit());
                 }
             };
         }), 
diff --git a/lib/components/Page/PageToolbar/Save/index.js b/lib/components/Page/PageToolbar/Save/index.js
@@ -1,7 +1,41 @@
 "use strict";
+var __extends = (this && this.__extends) || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
 var React = require('react');
+var react_redux_1 = require('react-redux');
 var FlatButton_1 = require('material-ui/FlatButton');
-var editor_1 = require('../../../../atom/editor');
-var Save = function () { return (React.createElement(FlatButton_1.default, {label: 'Save', secondary: true, onTouchTap: editor_1.save})); };
+var actions_1 = require('../../../../actions');
+var Save = (function (_super) {
+    __extends(Save, _super);
+    function Save() {
+        _super.apply(this, arguments);
+    }
+    Save.prototype.render = function () {
+        return (React.createElement(FlatButton_1.default, {label: 'Save', secondary: true, onTouchTap: this.props.save}));
+    };
+    Save = __decorate([
+        react_redux_1.connect(null, function (dispatch, state) {
+            return {
+                save: function () {
+                    dispatch(actions_1.testSave());
+                }
+            };
+        }), 
+        __metadata('design:paramtypes', [])
+    ], Save);
+    return Save;
+}(React.Component));
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = Save;
diff --git a/lib/components/Page/PageToolbar/ToggleLog/index.js b/lib/components/Page/PageToolbar/ToggleLog/index.js
@@ -1,8 +1,43 @@
 "use strict";
+var __extends = (this && this.__extends) || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+};
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
 var React = require('react');
 var code_1 = require('material-ui/svg-icons/action/code');
-var editor_1 = require('../../../../atom/editor');
+var react_redux_1 = require('react-redux');
+var actions_1 = require('../../../../actions');
 var FlatButton_1 = require('material-ui/FlatButton');
-var ToggleLog = function () { return (React.createElement(FlatButton_1.default, {icon: React.createElement(code_1.default, null), onTouchTap: editor_1.toggleDevTools})); };
+var ToggleLog = (function (_super) {
+    __extends(ToggleLog, _super);
+    function ToggleLog() {
+        _super.apply(this, arguments);
+    }
+    ToggleLog.prototype.render = function () {
+        return (React.createElement(FlatButton_1.default, {icon: React.createElement(code_1.default, null), onTouchTap: this.props.toggleDevTools}));
+    };
+    ;
+    ToggleLog = __decorate([
+        react_redux_1.connect(null, function (dispatch, state) {
+            return {
+                toggleDevTools: function () {
+                    dispatch(actions_1.devToolsToggle());
+                }
+            };
+        }), 
+        __metadata('design:paramtypes', [])
+    ], ToggleLog);
+    return ToggleLog;
+}(React.Component));
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = ToggleLog;
diff --git a/lib/reducers/devTools-toggle/index.js b/lib/reducers/devTools-toggle/index.js
@@ -0,0 +1,15 @@
+"use strict";
+var _types_1 = require('../../actions/_types');
+var editor_1 = require('../../atom/editor');
+function devToolsToggleReducer(open, action) {
+    if (open === void 0) { open = false; }
+    switch (action.type) {
+        case _types_1.DEVTOOLS_TOGGLE:
+            editor_1.toggleDevTools();
+            return !open;
+        default:
+            return open;
+    }
+}
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = devToolsToggleReducer;
diff --git a/lib/reducers/index.js b/lib/reducers/index.js
@@ -2,6 +2,7 @@
 var redux_1 = require('redux');
 var alert_1 = require('./alert');
 var checks_1 = require('./checks');
+var devTools_toggle_1 = require('./devTools-toggle');
 var dir_1 = require('./dir');
 var task_actions_1 = require('./task-actions');
 var hint_position_1 = require('./hint-position');
@@ -19,7 +20,7 @@ var tutorial_list_1 = require('./tutorial-list');
 var window_toggle_1 = require('./window-toggle');
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = redux_1.combineReducers({
-    alert: alert_1.default, checks: checks_1.default, dir: dir_1.default, taskActions: task_actions_1.default, hintPosition: hint_position_1.default, page: page_1.default,
+    alert: alert_1.default, checks: checks_1.default, dir: dir_1.default, devToolsToggle: devTools_toggle_1.default, taskActions: task_actions_1.default, hintPosition: hint_position_1.default, page: page_1.default,
     packageJson: package_json_1.default, pagePosition: page_position_1.default, progress: progress_1.default, route: route_1.default, taskPosition: task_position_1.default,
     taskTests: task_tests_1.default, tasks: tasks_1.default, testRun: test_run_1.default, tutorial: tutorial_1.default, tutorialList: tutorial_list_1.default, windowToggle: window_toggle_1.default
 });
diff --git a/lib/reducers/test-run/index.js b/lib/reducers/test-run/index.js
@@ -1,6 +1,7 @@
 "use strict";
 var _types_1 = require('../../actions/_types');
 var run_1 = require('./run');
+var editor_1 = require('../../atom/editor');
 var pageTimeout = 800;
 var previous = new Date().getTime();
 function runTestReducer(testRun, action) {
@@ -18,6 +19,8 @@ function runTestReducer(testRun, action) {
         case _types_1.PAGE_SET:
             previous = new Date().getTime();
             return false;
+        case _types_1.TEST_SAVE:
+            editor_1.save();
         default:
             return testRun;
     }
diff --git a/lib/reducers/window-toggle/index.js b/lib/reducers/window-toggle/index.js
@@ -1,10 +1,14 @@
 "use strict";
 var _types_1 = require('../../actions/_types');
+var subscriptions_1 = require('../../atom/subscriptions');
 function windowToggleReducer(open, action) {
     if (open === void 0) { open = false; }
     switch (action.type) {
         case _types_1.WINDOW_TOGGLE:
             return !open;
+        case _types_1.QUIT:
+            subscriptions_1.onDeactivate();
+            return false;
         default:
             return open;
     }
diff --git a/src/actions/_types.ts b/src/actions/_types.ts
@@ -2,14 +2,17 @@ export const ALERT_REPLAY = 'ALERT_REPLAY';
 export const ALERT_TOGGLE = 'ALERT_TOGGLE';
 export const COMPLETE_PAGE = 'COMPLETE_PAGE';
 export const COMPLETE_TUTORIAL = 'COMPLETE_TUTORIAL';
+export const DEVTOOLS_TOGGLE = 'DEVTOOLS_TOGGLE';
 export const HINT_POSITION_SET = 'HINT_POSITION_SET';
 export const HINT_SHOW = 'HINT_SHOW';
 export const PACKAGE_SET = 'PACKAGE_SET';
 export const PAGE_SET = 'PAGE_SET';
 export const PAGE_POSITION_LOAD = 'POSITION_LOAD';
 export const PAGE_POSITION_SET = 'POSITION_SET';
 export const PROGRESS_LOAD = 'PROGRESS_LOAD';
+export const QUIT = 'QUIT';
 export const ROUTE_SET = 'ROUTE_SET';
+export const TEST_SAVE = 'TEST_SAVE';
 export const SETUP_VERIFY = 'SETUP_VERIFY';
 export const TEST_COMPLETE = 'TEST_COMPLETE';
 export const TEST_RESULT = 'TEST_RESULT';
diff --git a/src/actions/index.ts b/src/actions/index.ts
@@ -7,9 +7,9 @@ export {pageSet, pageNext, pagePositionLoad, pagePositionSet} from './page';
 export {routeSet} from './route';
 export {setupVerify} from './setup';
 export {
-  testRun, testComplete, testResult, testsLoad
+  testRun, testComplete, testResult, testSave, testsLoad
 } from './test';
 export {
   tutorialsFind, tutorialSet, tutorialUpdate
 } from './tutorial';
-export {windowToggle} from './window';
+export {windowToggle, devToolsToggle, quit} from './toggle';
diff --git a/src/actions/test.ts b/src/actions/test.ts
@@ -1,5 +1,5 @@
 import {
-  TEST_RUN, TEST_RESULT, TEST_COMPLETE, TESTS_LOAD
+  TEST_RUN, TEST_RESULT, TEST_COMPLETE, TESTS_LOAD, TEST_SAVE
 } from './_types';
 import store from '../store';
 
@@ -19,6 +19,10 @@ export function testComplete(): Action {
   return { type: TEST_COMPLETE };
 }
 
+export function testSave(): Action {
+  return { type: TEST_SAVE };
+}
+
 export function testsLoad(pagePosition: CR.PagePosition): Action {
   return { type: TESTS_LOAD, payload: { pagePosition } };
 }
diff --git a/src/actions/toggle.ts b/src/actions/toggle.ts
@@ -0,0 +1,13 @@
+import {WINDOW_TOGGLE, DEVTOOLS_TOGGLE, QUIT} from './_types';
+
+export function windowToggle(): Action {
+  return { type: WINDOW_TOGGLE };
+}
+
+export function devToolsToggle(): Action {
+  return { type: DEVTOOLS_TOGGLE };
+}
+
+export function quit(): Action {
+  return { type: QUIT };
+}
diff --git a/src/actions/window.ts b/src/actions/window.ts
diff --git a/src/components/AppMenu/Quit/index.tsx b/src/components/AppMenu/Quit/index.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {connect} from 'react-redux';
-import {windowToggle} from '../../../actions';
-import {onDeactivate} from '../../../atom/subscriptions';
+import {quit} from '../../../actions';
 import MenuItem from 'material-ui/MenuItem';
 
 const styles = {
@@ -12,8 +11,7 @@ const styles = {
 @connect(null, (dispatch) => {
   return {
     quit: () => {
-      dispatch(windowToggle());
-      onDeactivate();
+      dispatch(quit());
     }
   };
 })
diff --git a/src/components/FinalPage/index.tsx b/src/components/FinalPage/index.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import * as ReactDOM from 'react-dom';
 import Paper from 'material-ui/Paper';
 import Divider from 'material-ui/Divider';
 import {Card, CardTitle, CardText, CardActions} from 'material-ui/Card';
diff --git a/src/components/Page/PageToolbar/Save/index.tsx b/src/components/Page/PageToolbar/Save/index.tsx
@@ -1,12 +1,25 @@
 import * as React from 'react';
+import {connect} from 'react-redux';
 import FlatButton from 'material-ui/FlatButton';
-import {save} from '../../../../atom/editor';
+import {testSave} from '../../../../actions';
 
-const Save = () => (
-  <FlatButton
-    label='Save'
-    secondary={true}
-    onTouchTap={save}
-  />
-);
-export default Save;
+@connect(null, (dispatch, state) => {
+  return {
+    save: () => {
+      dispatch(testSave());
+    }
+  };
+})
+export default class Save extends React.Component<{
+  save?: any
+}, {}> {
+  render() {
+    return (
+      <FlatButton
+        label='Save'
+        secondary={true}
+        onTouchTap={this.props.save}
+      />
+    );
+  }
+}
diff --git a/src/components/Page/PageToolbar/ToggleLog/index.tsx b/src/components/Page/PageToolbar/ToggleLog/index.tsx
@@ -1,14 +1,27 @@
 import * as React from 'react';
 import Code from 'material-ui/svg-icons/action/code';
-import {toggleDevTools} from '../../../../atom/editor';
+import {connect} from 'react-redux';
+import {devToolsToggle} from '../../../../actions';
 import FlatButton from 'material-ui/FlatButton';
 
-const ToggleLog = () => (
-  <FlatButton
-    icon={
-      <Code />
+@connect(null, (dispatch, state) => {
+  return {
+    toggleDevTools: () => {
+      dispatch(devToolsToggle());
     }
-    onTouchTap={toggleDevTools}
-  />
-);
-export default ToggleLog;
+  };
+})
+export default class ToggleLog extends React.Component<{
+  toggleDevTools?: any
+}, {}> {
+  render() {
+    return (
+      <FlatButton
+        icon={
+          <Code />
+        }
+        onTouchTap={this.props.toggleDevTools}
+      />
+    );
+  };
+}
diff --git a/src/reducers/devTools-toggle/index.ts b/src/reducers/devTools-toggle/index.ts
diff --git a/src/reducers/index.ts b/src/reducers/index.ts
diff --git a/src/reducers/route/index.ts b/src/reducers/route/index.ts
diff --git a/src/reducers/test-run/index.ts b/src/reducers/test-run/index.ts
diff --git a/src/reducers/window-toggle/index.ts b/src/reducers/window-toggle/index.ts
diff --git a/tsconfig.json b/tsconfig.json

Original file line number	Diff line number	Diff line change
`@@ -17,6 +17,10 @@ function testComplete() {`
`17`	`17`	`return { type: _types_1.TEST_COMPLETE };`
`18`	`18`	`}`
`19`	`19`	`exports.testComplete = testComplete;`
	`20`	`+function testSave() {`
	`21`	`+ return { type: _types_1.TEST_SAVE };`
	`22`	`+}`
	`23`	`+exports.testSave = testSave;`
`20`	`24`	`function testsLoad(pagePosition) {`
`21`	`25`	`return { type: _types_1.TESTS_LOAD, payload: { pagePosition: pagePosition } };`
`22`	`26`	`}`