Skip to content

Commit f5fcfa6

Browse files
ShMcKShMcK
committed
refactor checks into component
1 parent 4a265ff commit f5fcfa6

File tree

7 files changed

+93
-34
lines changed

7 files changed

+93
-34
lines changed

‎lib/components/checks/checks.js

Lines changed: 54 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,61 @@
11
"use strict";
2+
var __extends = (this && this.__extends) || function (d, b) {
3+
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
4+
function __() { this.constructor = d; }
5+
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
6+
};
7+
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
8+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
9+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
10+
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;
11+
return c > 3 && r && Object.defineProperty(target, key, r), r;
12+
};
13+
var __metadata = (this && this.__metadata) || function (k, v) {
14+
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
15+
};
216
var React = require('react');
317
var paper_1 = require('material-ui/lib/paper');
418
var raised_button_1 = require('material-ui/lib/raised-button');
519
var dynamic_stepper_1 = require('./dynamic-stepper');
620
var VerticalStep_1 = require('material-ui/lib/Stepper/VerticalStep');
721
var flat_button_1 = require('material-ui/lib/flat-button');
8-
exports.Checks = function (_a) {
9-
var checks = _a.checks;
10-
return (React.createElement(paper_1.default, {className: 'cr-start'}, React.createElement("div", {className: 'cr-start-header'}, React.createElement("span", {className: 'title'}, "CodeRoad"), React.createElement("p", {className: 'tagline'}, "Tutorials in the Editor"), React.createElement("p", {className: 'version'}, "Beta"), React.createElement(dynamic_stepper_1.default, {title: 'Dependency Checks'}, React.createElement(VerticalStep_1.default, {orderStepLabel: '1', stepLabel: 'Node >= 0.10', actions: [
11-
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
12-
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
13-
]}, React.createElement("div", null, "Install a newer version of ", React.createElement("a", {href: 'https://nodejs.org'}, "Node"))), React.createElement(VerticalStep_1.default, {orderStepLabel: '2', stepLabel: 'NPM >= 3', actions: [
14-
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
15-
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
16-
]}, React.createElement("div", null, "Update your version of NPM.", React.createElement("br", null), "`> npm update -g npm`"))), React.createElement(dynamic_stepper_1.default, {title: 'Setup Checks'}, React.createElement(VerticalStep_1.default, {orderStepLabel: '1', stepLabel: 'working directory', actions: [
17-
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
18-
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
19-
]}, React.createElement("div", null, "File -> Open (a new folder)")), React.createElement(VerticalStep_1.default, {orderStepLabel: '2', stepLabel: 'package.json', actions: [
20-
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
21-
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
22-
]}, React.createElement("div", null, "Create a package.json by running", React.createElement("br", null), "`> npm init -y`")), React.createElement(VerticalStep_1.default, {orderStepLabel: '3', stepLabel: 'install tutorial', actions: [
23-
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
24-
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
25-
]}, React.createElement("div", null, "Install a tutorial using npm. For example:", React.createElement("br", null), "`> npm install coderoad-functional-school --save-dev`"))), React.createElement("div", {className: 'setup-guide'}, React.createElement("span", null, "Check the", React.createElement("a", {href: 'https://coderoad.github.io/docs#install'}, " ", React.createElement("strong", null, "Install Guide")))))));
26-
};
22+
var react_redux_1 = require('react-redux');
23+
var store_1 = require('../../store/store');
24+
var Action = require('../../actions/actions');
25+
var Checks = (function (_super) {
26+
__extends(Checks, _super);
27+
function Checks() {
28+
_super.apply(this, arguments);
29+
}
30+
Checks.prototype.render = function () {
31+
var _a = this.props, checks = _a.checks, routeToTutorials = _a.routeToTutorials;
32+
return React.createElement(paper_1.default, {className: 'cr-start'}, React.createElement("div", {className: 'cr-start-header'}, React.createElement("span", {className: 'title'}, "CodeRoad"), React.createElement("p", {className: 'tagline'}, "Tutorials in the Editor"), React.createElement("p", {className: 'version'}, "Beta"), checks.system.passed ? null : React.createElement(dynamic_stepper_1.default, {title: 'Dependency Checks'}, React.createElement(VerticalStep_1.default, {orderStepLabel: '1', stepLabel: 'Node >= 0.10', actions: [
33+
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
34+
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
35+
]}, React.createElement("div", null, "Install a newer version of ", React.createElement("a", {href: 'https://nodejs.org'}, "Node"))), React.createElement(VerticalStep_1.default, {orderStepLabel: '2', stepLabel: 'NPM >= 3', actions: [
36+
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
37+
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
38+
]}, React.createElement("div", null, "Update your version of NPM.", React.createElement("br", null), "`> npm update -g npm`"))), checks.setup.passed ? null : React.createElement(dynamic_stepper_1.default, {title: 'Setup Checks'}, React.createElement(VerticalStep_1.default, {orderStepLabel: '1', stepLabel: 'working directory', actions: [
39+
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
40+
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
41+
]}, React.createElement("div", null, "File -> Open (a new folder)")), React.createElement(VerticalStep_1.default, {orderStepLabel: '2', stepLabel: 'package.json', actions: [
42+
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
43+
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
44+
]}, React.createElement("div", null, "Create a package.json by running", React.createElement("br", null), "`> npm init -y`")), React.createElement(VerticalStep_1.default, {orderStepLabel: '3', stepLabel: 'install tutorial', actions: [
45+
React.createElement(raised_button_1.default, {key: 0, primary: true, label: 'Verify', onTouchTap: function () { return; }}),
46+
React.createElement(flat_button_1.default, {key: 1, label: 'Cancel'})
47+
]}, React.createElement("div", null, "Install a tutorial using npm. For example:", React.createElement("br", null), "`> npm install coderoad-functional-school --save-dev`"))), checks.passed
48+
? React.createElement(flat_button_1.default, {label: 'Begin', primary: true, onTouchTap: routeToTutorials})
49+
: React.createElement("div", {className: 'setup-guide'}, React.createElement("span", null, "Check the", React.createElement("a", {href: 'https://coderoad.github.io/docs#install'}, " ", React.createElement("strong", null, "Install Guide"))))));
50+
};
51+
Checks = __decorate([
52+
react_redux_1.connect(null, function (dispatch) {
53+
return {
54+
routeToTutorials: function () { return store_1.store.dispatch(Action.setRoute('tutorials')); }
55+
};
56+
}),
57+
__metadata('design:paramtypes', [])
58+
], Checks);
59+
return Checks;
60+
}(React.Component));
61+
exports.Checks = Checks;

‎lib/reducers/route/route.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
"use strict";
22
var Type = require('../../actions/actionTypes');
3-
var defaultRoute = 'tutorials';
3+
var defaultRoute = 'checks';
44
function routeReducer(route, action) {
55
if (route === void 0) { route = defaultRoute; }
66
switch (action.type) {

‎src/components/_app.less

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@
66
@import './page/_task';
77
@import './progress/_progress';
88
@import './alert/_alert';
9+
@import './tutorials/_tutorials';
10+
@import './checks/_checks';
911

1012
atom-panel-container > atom-panel > #crv {
1113
animation: slide 0.5s forwards;

‎src/components/tutorials/_start.less renamed to ‎src/components/checks/_checks.less

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,3 @@
3232
}
3333
}
3434
}
35-
.cr-tutorials {
36-
padding: 10px;
37-
}

‎src/components/checks/checks.tsx

Lines changed: 32 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,29 @@ import DynamicStepper from './dynamic-stepper';
55
import Step from 'material-ui/lib/Stepper/VerticalStep';
66
import FlatButton from 'material-ui/lib/flat-button';
77

8-
export const Checks = ({checks}) => (
9-
<Paper className='cr-start'>
8+
import {connect} from 'react-redux';
9+
import {store} from '../../store/store';
10+
import * as Action from '../../actions/actions';
11+
12+
@connect(null, (dispatch) => {
13+
return {
14+
routeToTutorials: () => store.dispatch(Action.setRoute('tutorials'))
15+
};
16+
})
17+
export class Checks extends React.Component<{
18+
checks: CR.Checks, routeToTutorials?: any
19+
}, {}> {
20+
render() {
21+
const {checks, routeToTutorials} = this.props;
22+
return <Paper className='cr-start'>
1023
<div className='cr-start-header'>
1124
<span className='title'>CodeRoad</span>
1225
<p className='tagline'>Tutorials in the Editor</p>
1326
<p className='version'>Beta</p>
1427

15-
<DynamicStepper title='Dependency Checks'>
28+
{/* System Checks */}
29+
30+
{checks.system.passed ? null : <DynamicStepper title='Dependency Checks'>
1631
<Step orderStepLabel='1'
1732
stepLabel='Node >= 0.10'
1833
actions={[
@@ -38,9 +53,11 @@ export const Checks = ({checks}) => (
3853
`> npm update -g npm`
3954
</div>
4055
</Step>
41-
</DynamicStepper>
56+
</DynamicStepper>}
4257
43-
<DynamicStepper title='Setup Checks'>
58+
{/* Setup Checks */}
59+
60+
{checks.setup.passed ? null : <DynamicStepper title='Setup Checks'>
4461
<Step orderStepLabel='1'
4562
stepLabel='working directory'
4663
actions={[
@@ -79,13 +96,18 @@ export const Checks = ({checks}) => (
7996
`> npm install coderoad-functional-school --save-dev`
8097
</div>
8198
</Step>
82-
</DynamicStepper>
99+
</DynamicStepper>}
100+
101+
{/* Install Guide || Continue */}
83102

84-
<div className='setup-guide'>
103+
{checks.passed
104+
? <FlatButton label='Begin' primary={true} onTouchTap={routeToTutorials}/>
105+
: <div className='setup-guide'>
85106
<span>Check the
86107
<a href='https://coderoad.github.io/docs#install'> <strong>Install Guide</strong></a></span>
87-
</div>
108+
</div>}
88109

89110
</div>
90-
</Paper>
91-
);
111+
</Paper>;
112+
}
113+
}

‎src/components/tutorials/_tutorials.less

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.cr-tutorials {
2+
padding: 10px;
3+
}

‎src/reducers/route/route.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import * as Type from '../../actions/actionTypes';
22
import {store} from '../../store/store';
33
import * as Action from '../../actions/task-actions';
44

5-
const defaultRoute: string = 'tutorials';
5+
const defaultRoute: string = 'checks';
66

77
export default function routeReducer(route = defaultRoute, action: CR.Action): string {
88
switch (action.type) {

0 commit comments

Comments
 (0)