Skip to content

Commit 9755237

Browse files
ShMcKShMcK
committed
fix React deprecations/warnings
1 parent 4e46600 commit 9755237

File tree

23 files changed

+68
-64
lines changed

23 files changed

+68
-64
lines changed

‎lib/components/Alert/index.js

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
'use strict';
1+
"use strict";
22
var __extends = (this && this.__extends) || function (d, b) {
33
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
44
function __() { this.constructor = d; }
@@ -15,7 +15,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
1515
};
1616
var React = require('react');
1717
var react_redux_1 = require('react-redux');
18-
var Action = require('../../actions');
18+
var actions_1 = require('../../actions');
1919
var Snackbar_1 = require('material-ui/Snackbar');
2020
var classNames = require('classnames');
2121
var defaultAlert = {
@@ -35,7 +35,7 @@ var Alert = (function (_super) {
3535
Alert = __decorate([
3636
react_redux_1.connect(null, function (dispatch) {
3737
return {
38-
alertToggle: function () { return dispatch(Action.alertToggle()); },
38+
alertToggle: function () { return dispatch(actions_1.alertToggle()); },
3939
};
4040
}),
4141
__metadata('design:paramtypes', [])

‎lib/components/Page/PageComplete/index.js

-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ var styles = {
77
backgroundColor: colors_1.cyan500,
88
zIndex: '0',
99
position: 'fixed',
10-
bottom: '20px',
1110
padding: '10px 15px 30px',
1211
right: '0px',
1312
margin: '0',

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ var Continue_1 = require('./Continue');
77
var styles = {
88
zIndex: '1000',
99
position: 'fixed',
10-
bottom: '0',
11-
right: '0',
10+
bottom: '0px',
11+
right: '0px',
1212
height: '60px',
1313
width: '400px',
1414
};

‎lib/components/Page/Tasks/Task.js renamed to ‎lib/components/Page/Task/index.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
"use strict";
22
var React = require('react');
33
var index_1 = require('../../index');
4-
var TaskCheckbox_1 = require('./TaskCheckbox');
4+
var taskCheckbox_1 = require('./taskCheckbox');
55
var List_1 = require('material-ui/List');
66
var colors_1 = require('material-ui/styles/colors');
77
var styles = {
@@ -27,5 +27,5 @@ function getStatus(index, taskPosition, testRun) {
2727
exports.Task = function (_a) {
2828
var task = _a.task, taskPosition = _a.taskPosition, index = _a.index, testRun = _a.testRun;
2929
var backgroundColor = getStatus(index, taskPosition, testRun);
30-
return (React.createElement(List_1.ListItem, {key: index, style: Object.assign({}, styles, { backgroundColor: backgroundColor })}, testRun ? React.createElement(TaskCheckbox_1.TaskCheckbox, null) : null, React.createElement("span", {style: indexStyles}, index + 1, "."), React.createElement("div", {style: descriptionStyles}, React.createElement(index_1.Markdown, null, task.description))));
30+
return (React.createElement(List_1.ListItem, {key: index, style: Object.assign({}, styles, { backgroundColor: backgroundColor })}, taskCheckbox_1.taskCheckbox(testRun), React.createElement("span", {style: indexStyles}, index + 1, "."), React.createElement("div", {style: descriptionStyles}, React.createElement(index_1.Markdown, null, task.description))));
3131
};

‎lib/components/Page/Task/taskCheckbox.js

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
"use strict";
2+
var React = require('react');
3+
var colors_1 = require('material-ui/styles/colors');
4+
var indeterminate_check_box_1 = require('material-ui/svg-icons/toggle/indeterminate-check-box');
5+
var styles = {
6+
position: 'absolute',
7+
top: '15px'
8+
};
9+
function taskCheckbox(testRun) {
10+
if (!testRun) {
11+
return null;
12+
}
13+
return (React.createElement("span", {style: styles}, React.createElement(indeterminate_check_box_1.default, {color: colors_1.orange500})));
14+
}
15+
exports.taskCheckbox = taskCheckbox;
16+
;

‎lib/components/Page/Tasks/TaskCheckbox.js

-9
This file was deleted.

‎lib/components/Page/Tasks/index.js

+4-3
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,15 @@ var React = require('react');
33
var List_1 = require('material-ui/List');
44
var Card_1 = require('material-ui/Card');
55
var Subheader_1 = require('material-ui/Subheader');
6-
var Task_1 = require('./Task');
6+
var Task_1 = require('../Task');
77
var colors_1 = require('material-ui/styles/colors');
88
function visibleTasks(tasks, taskPosition) {
99
return tasks.slice(0, taskPosition + 1);
1010
}
11+
var margin = '10px 5px';
1112
exports.Tasks = function (_a) {
1213
var tasks = _a.tasks, taskPosition = _a.taskPosition, testRun = _a.testRun, completed = _a.completed;
1314
var visTasks = visibleTasks(tasks, taskPosition);
14-
var bg = completed ? colors_1.lightGreen200 : 'white';
15-
return (React.createElement(Card_1.Card, {style: { margin: '10px 5px', backGroundColor: bg }}, React.createElement(List_1.List, null, React.createElement(Subheader_1.default, null, "Tasks"), visTasks.map(function (task, index) { return (React.createElement(Task_1.Task, {key: index, index: index, task: task, taskPosition: taskPosition, testRun: testRun})); }))));
15+
var backgroundColor = completed ? colors_1.lightGreen200 : 'white';
16+
return (React.createElement(Card_1.Card, {style: { backgroundColor: backgroundColor, margin: margin }}, React.createElement(List_1.List, null, React.createElement(Subheader_1.default, null, "Tasks"), visTasks.map(function (task, index) { return (React.createElement(Task_1.Task, {key: index, index: index, task: task, taskPosition: taskPosition, testRun: testRun})); }))));
1617
};

‎lib/components/Progress/ProgressChapter/index.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,13 @@ var List_1 = require('material-ui/List');
44
var ProgressPage_1 = require('../ProgressPage');
55
var index_1 = require('../../index');
66
var styles = {
7-
marginBottom: '0'
7+
marginBottom: '0px'
88
};
99
var descriptionStyles = {
1010
fontSize: '14px'
1111
};
1212
exports.ProgressChapter = function (_a) {
1313
var chapter = _a.chapter, chapterIndex = _a.chapterIndex, position = _a.position;
1414
var isActive = chapterIndex === position.chapter;
15-
return (React.createElement(List_1.ListItem, {key: 'c' + chapterIndex, className: isActive ? 'isActive' : null, style: styles, initiallyOpen: chapterIndex === 0, primaryTogglesNestedList: chapterIndex === position.chapter && !chapter.completed, nestedItems: chapter.pages.map(function (page, pageIndex) { return (React.createElement(ProgressPage_1.ProgressPage, {key: chapterIndex + '_' + pageIndex, pageIndex: pageIndex, page: page, chapterIndex: chapterIndex, position: position})); })}, React.createElement("h3", null, chapterIndex + 1, ". ", chapter.title), React.createElement("span", {style: descriptionStyles}, React.createElement(index_1.Markdown, null, chapter.description))));
15+
return (React.createElement(List_1.ListItem, {key: chapterIndex, className: isActive ? 'isActive' : null, style: styles, initiallyOpen: chapterIndex === 0, primaryTogglesNestedList: chapterIndex === position.chapter && !chapter.completed, nestedItems: chapter.pages.map(function (page, pageIndex) { return (React.createElement(ProgressPage_1.ProgressPage, {key: pageIndex, pageIndex: pageIndex, page: page, chapterIndex: chapterIndex, position: position})); })}, React.createElement("h3", null, chapterIndex + 1, ". ", chapter.title), React.createElement("span", {style: descriptionStyles}, React.createElement(index_1.Markdown, null, chapter.description))));
1616
};

‎lib/components/Progress/ProgresPage/index.js renamed to ‎lib/components/Progress/ProgressPage/index.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ var progressIcon_1 = require('../progressIcon');
2121
var colors_1 = require('material-ui/styles/colors');
2222
var styles = {
2323
paddingLeft: '15px',
24-
marginTop: '0',
24+
marginTop: '0px',
2525
};
2626
var ProgressPage = (function (_super) {
2727
__extends(ProgressPage, _super);
@@ -40,7 +40,7 @@ var ProgressPage = (function (_super) {
4040
var _a = this.props, page = _a.page, position = _a.position, chapterIndex = _a.chapterIndex, pageIndex = _a.pageIndex, selectPage = _a.selectPage;
4141
var isActive = chapterIndex === position.chapter && pageIndex === position.page;
4242
var canActivate = this.canActivate(isActive);
43-
return (React.createElement(List_1.ListItem, {style: Object.assign({}, styles, !canActivate ? { color: colors_1.grey400 } : {}), primaryText: (pageIndex + 1) + ". " + page.title, secondaryText: canActivate ? page.description : '', leftIcon: progressIcon_1.progressIcon(page.completed, isActive), onClick: canActivate
43+
return (React.createElement(List_1.ListItem, {key: pageIndex, style: Object.assign({}, styles, !canActivate ? { color: colors_1.grey400 } : {}), primaryText: (pageIndex + 1) + ". " + page.title, secondaryText: canActivate ? page.description : '', leftIcon: progressIcon_1.progressIcon(page.completed, isActive), onClick: canActivate
4444
? selectPage.bind(this, {
4545
chapter: chapterIndex,
4646
page: pageIndex

‎lib/components/Progress/index.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@ var Subheader_1 = require('material-ui/Subheader');
66
var ProgressChapter_1 = require('./ProgressChapter');
77
var pageStyle = {
88
width: '100%',
9-
margin: 0,
9+
margin: '0px',
1010
};
1111
exports.Progress = function (_a) {
1212
var progress = _a.progress, position = _a.position, info = _a.info;
13-
return (React.createElement(Paper_1.default, {className: 'cr-progress', style: pageStyle, zDepth: 1}, React.createElement(List_1.List, null, React.createElement(Subheader_1.default, null, info.title), progress.chapters.map(function (chapter, chapterIndex) { return (React.createElement(ProgressChapter_1.ProgressChapter, {chapter: chapter, chapterIndex: chapterIndex, position: position})); }))));
13+
return (React.createElement(Paper_1.default, {style: pageStyle}, React.createElement(List_1.List, null, React.createElement(Subheader_1.default, null, info.title), progress.chapters.map(function (chapter, chapterIndex) { return (React.createElement(ProgressChapter_1.ProgressChapter, {key: chapterIndex, chapter: chapter, chapterIndex: chapterIndex, position: position})); }))));
1414
};

‎lib/components/Start/Welcome/index.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ var styles = {
88
backgroundRepeat: 'no-repeat',
99
height: '350px',
1010
textAlign: 'center',
11-
marginTop: '0',
11+
marginTop: '0px',
1212
textShadow: '1px 1px 1px #000',
1313
};
1414
var titleStyles = {

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141
"classnames": "2.2.3",
4242
"highlights": "1.3.1",
4343
"marked": "0.3.5",
44-
"material-ui": "0.15.0-beta.1",
44+
"material-ui": "0.15.0-beta.2",
4545
"react": "15.0.1",
4646
"react-dom": "15.0.1",
4747
"react-redux": "4.4.5",

‎src/components/Alert/index.tsx

+3-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
'use strict';
21
import * as React from 'react';
32
import {connect} from 'react-redux';
4-
import * as Action from '../../actions';
3+
import {alertToggle} from '../../actions';
54
import Snackbar from 'material-ui/Snackbar';
65
const classNames = require('classnames');
76

@@ -12,12 +11,12 @@ const defaultAlert = {
1211

1312
@connect(null, (dispatch) => {
1413
return {
15-
alertToggle: () => dispatch(Action.alertToggle()),
14+
alertToggle: () => dispatch(alertToggle()),
1615
};
1716
})
1817
export class Alert extends React.Component<{
1918
alert: CR.Alert, alertToggle?: any
20-
}, CR.Alert> {
19+
}, {}> {
2120
render() {
2221
const {alert, alertToggle} = this.props;
2322
const {action, open, message, duration} = alert;

‎src/components/Page/PageComplete/index.tsx

-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ const styles = {
77
backgroundColor: cyan500,
88
zIndex: '0',
99
position: 'fixed',
10-
bottom: '20px',
1110
padding: '10px 15px 30px',
1211
right: '0px',
1312
margin: '0',

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

+2-2
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ import {Continue} from './Continue';
77
const styles = {
88
zIndex: '1000',
99
position: 'fixed',
10-
bottom: '0',
11-
right: '0',
10+
bottom: '0px',
11+
right: '0px',
1212
height: '60px',
1313
width: '400px',
1414
};

‎src/components/Page/Tasks/Task.tsx renamed to ‎src/components/Page/Task/index.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import * as React from 'react';
22
import {Markdown} from '../../index';
3-
import {TaskCheckbox} from './TaskCheckbox';
3+
import {taskCheckbox} from './taskCheckbox';
44
import {ListItem} from 'material-ui/List';
55
import {lightGreen200, orange200} from 'material-ui/styles/colors';
66

@@ -39,7 +39,7 @@ export const Task: React.StatelessComponent<{
3939
key={index}
4040
style={Object.assign({}, styles, {backgroundColor})}
4141
>
42-
{testRun ? <TaskCheckbox /> : null}
42+
{taskCheckbox(testRun)}
4343
<span style={indexStyles}>{index + 1}.</span>
4444
<div style={descriptionStyles}>
4545
<Markdown >{task.description}</Markdown>

‎src/components/Page/Tasks/TaskCheckbox.tsx renamed to ‎src/components/Page/Task/taskCheckbox.tsx

+8-5
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,11 @@ const styles = {
99
top: '15px'
1010
};
1111

12-
export const TaskCheckbox: React.StatelessComponent<{}> = () => (
13-
<span style={styles}>
14-
<IndeterminateCheckBox color={orange500} />
15-
</span>
16-
);
12+
export function taskCheckbox(testRun) {
13+
if (!testRun) { return null; }
14+
return (
15+
<span style={styles}>
16+
<IndeterminateCheckBox color={orange500} />
17+
</span>
18+
);
19+
};

‎src/components/Page/Tasks/index.tsx

+6-6
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,24 @@ import * as React from 'react';
22
import {List} from 'material-ui/List';
33
import {Card} from 'material-ui/Card';
44
import Subheader from 'material-ui/Subheader';
5-
import {Task} from './Task';
5+
import {Task} from '../Task';
66
import {lightGreen200} from 'material-ui/styles/colors';
77

8-
9-
108
function visibleTasks(tasks: CR.Task[], taskPosition: number): CR.Task[] {
119
return tasks.slice(0, taskPosition + 1);
1210
}
1311

12+
const margin = '10px 5px';
13+
1414
export const Tasks: React.StatelessComponent<{
1515
tasks: CR.Task[], taskPosition: number,
1616
testRun: boolean, completed: boolean
1717
}> = ({tasks, taskPosition, testRun, completed}) => {
1818
const visTasks = visibleTasks(tasks, taskPosition);
19-
const bg = completed ? lightGreen200 : 'white';
19+
const backgroundColor = completed ? lightGreen200 : 'white';
2020
return (
2121
<Card
22-
style={{margin: '10px 5px', backGroundColor: bg}}>
22+
style={{backgroundColor, margin}}>
2323
<List>
2424
<Subheader>Tasks</Subheader>
2525
{visTasks.map((task: CR.Task, index: number) => (
@@ -31,7 +31,7 @@ export const Tasks: React.StatelessComponent<{
3131
testRun={testRun}
3232
/>)
3333
)}
34-
</List>
34+
</List>
3535
</Card>
3636
);
3737
};

‎src/components/Progress/ProgressChapter/index.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {progressIcon} from '../progressIcon';
55
import {Markdown} from '../../index';
66

77
const styles = {
8-
marginBottom: '0'
8+
marginBottom: '0px'
99
};
1010

1111
const descriptionStyles = {
@@ -18,7 +18,7 @@ export const ProgressChapter: React.StatelessComponent<{
1818
const isActive = chapterIndex === position.chapter;
1919
return (
2020
<ListItem
21-
key={'c' + chapterIndex}
21+
key={chapterIndex}
2222
className={isActive ? 'isActive' : null}
2323
style={styles}
2424
initiallyOpen={chapterIndex === 0}
@@ -28,7 +28,7 @@ export const ProgressChapter: React.StatelessComponent<{
2828
nestedItems={
2929
chapter.pages.map((page: CR.Page, pageIndex: number) => (
3030
<ProgressPage
31-
key={chapterIndex + '_' + pageIndex}
31+
key={pageIndex}
3232
pageIndex={pageIndex}
3333
page={page}
3434
chapterIndex={chapterIndex}

‎src/components/Progress/ProgresPage/index.tsx renamed to ‎src/components/Progress/ProgressPage/index.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {grey400} from 'material-ui/styles/colors';
88

99
const styles = {
1010
paddingLeft: '15px',
11-
marginTop: '0',
11+
marginTop: '0px',
1212
};
1313

1414
@connect(null, (dispatch) => {
@@ -37,6 +37,7 @@ export class ProgressPage extends React.Component<{
3737
const canActivate = this.canActivate(isActive);
3838
return (
3939
<ListItem
40+
key={pageIndex}
4041
style={Object.assign({}, styles, !canActivate ? {color: grey400} : {})}
4142
primaryText={`${pageIndex + 1}. ${page.title}`}
4243
secondaryText={canActivate ? page.description : ''}

‎src/components/Progress/index.tsx

+3-6
Original file line numberDiff line numberDiff line change
@@ -6,21 +6,18 @@ import {ProgressChapter} from './ProgressChapter';
66

77
const pageStyle = {
88
width: '100%',
9-
margin: 0,
9+
margin: '0px',
1010
};
1111

1212
export const Progress: React.StatelessComponent<{
1313
progress: CR.Progress, position: CR.Position, info: Tutorial.Info
1414
}> = ({progress, position, info}) => (
15-
<Paper
16-
className='cr-progress'
17-
style={pageStyle}
18-
zDepth={1}
19-
>
15+
<Paper style={pageStyle}>
2016
<List>
2117
<Subheader>{info.title}</Subheader>
2218
{progress.chapters.map((chapter: CR.Chapter, chapterIndex: number) => (
2319
<ProgressChapter
20+
key={chapterIndex}
2421
chapter={chapter}
2522
chapterIndex={chapterIndex}
2623
position={position}

‎src/components/Start/Welcome/index.tsx

+1-3
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,12 @@ const imagePath = resolve(
66
__dirname, '../../../../', 'styles', 'coderoad.jpg'
77
);
88

9-
10-
119
const styles = {
1210
backgroundImage: `url(https://github.com/"%3Cspan%20class=pl-s1%3E%3Cspan%20class=pl-kos%3E$%7B%3C/span%3E%3Cspan%20class=pl-s1%3EimagePath%3C/span%3E%3Cspan%20class=pl-kos%3E%7D%3C/span%3E%3C/span%3E")`,
1311
backgroundRepeat: 'no-repeat',
1412
height: '350px',
1513
textAlign: 'center',
16-
marginTop: '0',
14+
marginTop: '0px',
1715
textShadow: '1px 1px 1px #000',
1816
};
1917

‎tsconfig.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -131,13 +131,13 @@
131131
"src/components/Page/PageToolbar/Save/index.tsx",
132132
"src/components/Page/PageToolbar/ToggleLog/index.tsx",
133133
"src/components/Page/ProgressBar/index.tsx",
134+
"src/components/Page/Task/index.tsx",
135+
"src/components/Page/Task/taskCheckbox.tsx",
134136
"src/components/Page/Tasks/index.tsx",
135-
"src/components/Page/Tasks/Task.tsx",
136-
"src/components/Page/Tasks/TaskCheckbox.tsx",
137137
"src/components/Progress/index.tsx",
138-
"src/components/Progress/ProgresPage/index.tsx",
139138
"src/components/Progress/ProgressChapter/index.tsx",
140139
"src/components/Progress/progressIcon.tsx",
140+
"src/components/Progress/ProgressPage/index.tsx",
141141
"src/components/render.tsx",
142142
"src/components/Routes/index.tsx",
143143
"src/components/Start/Checks/DynamicStepper.tsx",

0 commit comments

Comments
 (0)