React: Remove uses of React.createClass in code-studio/components #17624
Conversation
| constructor(props) { | ||
| super(props); | ||
| this.state = { | ||
| selectedOption: (props.onClickExport && 'export') || 'embed', |
There was a problem hiding this comment.
This seems better expressed as props.onClickExport ? 'export' : 'embed', but I guess that's out of scope for this change.
| const top = Math.min(dragStart.row, row), | ||
| left = Math.min(dragStart.col, col), | ||
| bottom = Math.max(dragStart.row, row), | ||
| right = Math.max(dragStart.col, col); |
There was a problem hiding this comment.
nit: isnt this too much indenting? should be either 2 or 4 spaces
There was a problem hiding this comment.
👍 Was following the original pattern here, but happy to update.
There was a problem hiding this comment.
I dont really care too much either way, but one could argue that the original pattern is okay because it's 5 spaces, and the latter pattern is not because it's five (though both align with the text from the first line).
| if (this.props.serializedMaze) { | ||
| cells = this.props.serializedMaze.map(function (row) { | ||
| if (props.serializedMaze) { | ||
| cells = props.serializedMaze.map(function (row) { |
There was a problem hiding this comment.
nit: could be arrow func, here and line 68
| @@ -150,7 +151,7 @@ var GridEditor = React.createClass({ | |||
| }, this); | |||
| }, this); | |||
|
|
|||
| var serializedData = cells.map(function (row) { | |||
| const serializedData = cells.map(function (row) { | |||
| return row.map(function (cell) { | |||
| return cell.serialize(); | |||
| }); | |||
There was a problem hiding this comment.
here and lines 145-148 are more places we could use arrow funcs. Not sure how completely you're trying to ES6ify (will prob stop commenting on this if there are other places like it).
| }; | ||
|
|
||
| render() { | ||
| const cyan = '#0094ca'; |
There was a problem hiding this comment.
neat: a color not in our color file :(
| @@ -44,8 +44,8 @@ const style = { | |||
| }, | |||
| }; | |||
|
|
|||
| const AdvancedShareOptions = Radium(React.createClass({ | |||
| propTypes: { | |||
| const AdvancedShareOptions = Radium(class extends React.Component { | |||
There was a problem hiding this comment.
Out of scope for this PR, but have we considered adding decorator support and using @Radium to add Radium to our components?
There was a problem hiding this comment.
That would be awesome. I loved using annotations in AS3.
More work extracted from #16861 getting us ready to update to React 15.6+.
React.createClassis deprecated, and I'm slowly upgrading our components to ES6 classes.This third batch is components within src/code-studio/components.