Review Request #9548 — Created Jan. 28, 2018 and submitted
This is the first step in rewriting sonar's frontend to use React
instead of Backbone. To start, I chose a relatively isolated set of
views (the project descriptions).The old TaskView has now been converted to Project, which is a pure
react component. This is used by two backbone views, the student project
list and the individual project view. Both of these are still backbone
views, but the innards are predominantly react-based now.
Loaded the affected pages and tested the various features thoroughly.
The only issue is some weirdness with the active item highlighting when
clicking links in the project list nav, but that seems like it might be
a regression inside the bootstrap scrollspy implementation.
| Description | From | Last Updated |
|---|---|---|
|
Instead of this, why not "extends": [ "eslint:recommended", "plugin:react/recommended", ] We're already using the plugin, why not all recommended settings? |
 brennie
|
|
|
I know its technically the same, but IMO, the following is more clear { tags || projects ? ( <div> … |
brennie
|
|
|
Component refs are the recommended way of doing this: render() { return ( <div className={this.props.className} ref={el => this._$el = $(el)}> … |
brennie
|
|
|
Col: 17 Expected an identifier and instead saw '<'. |
 reviewbot
|
|
|
Col: 18 Expected ')' and instead saw 'div'. |
reviewbot
|
|
|
Col: 21 Missing semicolon. |
reviewbot
|
|
|
Col: 32 Missing semicolon. |
reviewbot
|
|
|
Col: 21 Expected an identifier and instead saw '<'. |
reviewbot
|
|
|
Col: 21 Unrecoverable syntax error. (84% scanned). |
reviewbot
|
|
|
You can add .jsx to the list of webpack extensions so that you can import Project from './project'. See the … |
brennie
|
|
|
Your NavSection isn't a <section> :p |
brennie
|
| lib/frontend/student-project-view.js (Diff revision 1) |
|---|
| lib/frontend/student-project-view.js (Diff revision 1) |
|---|
Col: 21 Expected an identifier and instead saw '<'.
| lib/frontend/student-project-view.js (Diff revision 1) |
|---|
Col: 21 Unrecoverable syntax error. (84% scanned).
| .eslintrc.json (Diff revision 1) |
|---|
Instead of this, why not
"extends": [ "eslint:recommended", "plugin:react/recommended", ]We're already using the plugin, why not all recommended settings?
| lib/frontend/project.jsx (Diff revision 1) |
|---|
I know its technically the same, but IMO, the following is more clear
{ tags || projects ? ( <div> ... </div> ) : null}
| lib/frontend/scrollspy.jsx (Diff revision 1) |
|---|
Component refs are the recommended way of doing this:
render() { return ( <div className={this.props.className} ref={el => this._$el = $(el)}> {this.props.children} </div> ); }
| lib/frontend/student-projects-list-view.js (Diff revision 1) |
|---|
You can add
.jsxto the list of webpack extensions so that you canimport Project from './project'.See the webpack docs.
Commit: |
|
||||
|---|---|---|---|---|---|
Diff: |
Revision 2 (+474 -197) |
