diff options
-rw-r--r-- | package.json | 16 | ||||
-rw-r--r-- | src/web/js/components/MainApp.react.js | 4 | ||||
-rw-r--r-- | src/web/js/components/Menu.react.js | 50 | ||||
-rw-r--r-- | src/web/js/components/MiddlePanel.react.js | 28 | ||||
-rw-r--r-- | src/web/js/components/Navbar.react.js | 3 | ||||
-rw-r--r-- | src/web/js/components/RightPanel.react.js | 12 | ||||
-rw-r--r-- | src/web/js/components/time.react.js | 8 |
7 files changed, 67 insertions, 54 deletions
diff --git a/package.json b/package.json index c446a5d5..b2e09c04 100644 --- a/package.json +++ b/package.json @@ -20,19 +20,21 @@ "bootstrap": "^3.3.7", "bower": "^1.7.9", "classnames": "^2.2.5", - "flux": "^2.1.1", + "create-react-class": "^15.6.2", + "flux": "^3.1.3", "jquery": "^3.1.1", "keymirror": "^0.1.1", "object-assign": "^4.1.0", - "react": "^15.3.2", - "react-bootstrap": "^0.30.3", - "react-dom": "^15.3.2" + "prop-types": "^15.6.0", + "react": "^16.0.0", + "react-bootstrap": "^0.31.3", + "react-dom": "^16.0.0" }, "devDependencies": { - "browserify": "^13.1.0", - "envify": "^3.4.1", + "browserify": "^14.4.0", + "envify": "^4.1.0", "reactify": "^1.1.1", - "uglify-js": "^2.7.3", + "uglify-js": "^3.1.2", "watchify": "^3.7.0" }, "scripts": { diff --git a/src/web/js/components/MainApp.react.js b/src/web/js/components/MainApp.react.js index 8105d32f..32bb663e 100644 --- a/src/web/js/components/MainApp.react.js +++ b/src/web/js/components/MainApp.react.js @@ -1,13 +1,15 @@ var React = require('react'); +var createReactClass = require('create-react-class'); var Col = require('react-bootstrap/lib/Col'); var Grid = require('react-bootstrap/lib/Grid'); +var PropTypes = require('prop-types'); var Menu = require('./Menu.react'); var MiddlePanel = require('./MiddlePanel.react'); var RightPanel = require('./RightPanel.react'); -var MainApp = React.createClass({ +var MainApp = createReactClass({ render: function() { return (<div> <Grid fluid id="newspipe-container"> diff --git a/src/web/js/components/Menu.react.js b/src/web/js/components/Menu.react.js index 925802a6..64672240 100644 --- a/src/web/js/components/Menu.react.js +++ b/src/web/js/components/Menu.react.js @@ -1,21 +1,23 @@ var React = require('react'); +var createReactClass = require('create-react-class'); var Col = require('react-bootstrap/lib/Col'); var Badge = require('react-bootstrap/lib/Badge'); var Button = require('react-bootstrap/lib/Button'); var ButtonGroup = require('react-bootstrap/lib/ButtonGroup'); var Glyphicon = require('react-bootstrap/lib/Glyphicon'); +var PropTypes = require('prop-types'); var MenuStore = require('../stores/MenuStore'); var MenuActions = require('../actions/MenuActions'); var MiddlePanelActions = require('../actions/MiddlePanelActions'); -var FeedItem = React.createClass({ - propTypes: {feed_id: React.PropTypes.number.isRequired, - title: React.PropTypes.string.isRequired, - unread: React.PropTypes.number.isRequired, - error_count: React.PropTypes.number.isRequired, - icon_url: React.PropTypes.string, - active: React.PropTypes.bool.isRequired, +var FeedItem = createReactClass({ + propTypes: {feed_id: PropTypes.number.isRequired, + title: PropTypes.string.isRequired, + unread: PropTypes.number.isRequired, + error_count: PropTypes.number.isRequired, + icon_url: PropTypes.string, + active: PropTypes.bool.isRequired, }, render: function() { var icon = null; @@ -48,10 +50,10 @@ var FeedItem = React.createClass({ }, }); -var Category = React.createClass({ - propTypes: {category_id: React.PropTypes.number, - active_type: React.PropTypes.string, - active_id: React.PropTypes.number}, +var Category = createReactClass({ + propTypes: {category_id: PropTypes.number, + active_type: PropTypes.string, + active_id: PropTypes.number}, render: function() { var classes = "nav-cat"; if((this.props.active_type == 'category_id' @@ -76,15 +78,15 @@ var Category = React.createClass({ }, }); -var CategoryGroup = React.createClass({ - propTypes: {cat_id: React.PropTypes.number.isRequired, - filter: React.PropTypes.string.isRequired, - active_type: React.PropTypes.string, - active_id: React.PropTypes.number, - name: React.PropTypes.string.isRequired, - feeds: React.PropTypes.array.isRequired, - unread: React.PropTypes.number.isRequired, - folded: React.PropTypes.bool, +var CategoryGroup = createReactClass({ + propTypes: {cat_id: PropTypes.number.isRequired, + filter: PropTypes.string.isRequired, + active_type: PropTypes.string, + active_id: PropTypes.number, + name: PropTypes.string.isRequired, + feeds: PropTypes.array.isRequired, + unread: PropTypes.number.isRequired, + folded: PropTypes.bool, }, getInitialState: function() { return {folded: false}; @@ -148,9 +150,9 @@ var CategoryGroup = React.createClass({ }, }); -var MenuFilter = React.createClass({ - propTypes: {feed_in_error: React.PropTypes.bool, - filter: React.PropTypes.string.isRequired}, +var MenuFilter = createReactClass({ + propTypes: {feed_in_error: PropTypes.bool, + filter: PropTypes.string.isRequired}, getInitialState: function() { return {allFolded: false}; }, @@ -219,7 +221,7 @@ var MenuFilter = React.createClass({ }, }); -var Menu = React.createClass({ +var Menu = createReactClass({ getInitialState: function() { return {filter: 'unread', categories: {}, feeds: {}, all_folded: false, active_type: null, active_id: null}; diff --git a/src/web/js/components/MiddlePanel.react.js b/src/web/js/components/MiddlePanel.react.js index 2a8ab96e..fc7c763a 100644 --- a/src/web/js/components/MiddlePanel.react.js +++ b/src/web/js/components/MiddlePanel.react.js @@ -1,9 +1,11 @@ var React = require('react'); +var createReactClass = require('create-react-class'); var Row = require('react-bootstrap/lib/Row'); var Button = require('react-bootstrap/lib/Button'); var ButtonGroup = require('react-bootstrap/lib/ButtonGroup'); var Glyphicon = require('react-bootstrap/lib/Glyphicon'); +var PropTypes = require('prop-types'); var MiddlePanelStore = require('../stores/MiddlePanelStore'); var MiddlePanelActions = require('../actions/MiddlePanelActions'); @@ -11,16 +13,16 @@ var RightPanelActions = require('../actions/RightPanelActions'); var JarrTime = require('./time.react'); -var TableLine = React.createClass({ - propTypes: {article_id: React.PropTypes.number.isRequired, - feed_title: React.PropTypes.string.isRequired, - icon_url: React.PropTypes.string, - title: React.PropTypes.string.isRequired, - rel_date: React.PropTypes.string.isRequired, - date: React.PropTypes.string.isRequired, - read: React.PropTypes.bool.isRequired, - selected: React.PropTypes.bool.isRequired, - liked: React.PropTypes.bool.isRequired, +var TableLine = createReactClass({ + propTypes: {article_id: PropTypes.number.isRequired, + feed_title: PropTypes.string.isRequired, + icon_url: PropTypes.string, + title: PropTypes.string.isRequired, + rel_date: PropTypes.string.isRequired, + date: PropTypes.string.isRequired, + read: PropTypes.bool.isRequired, + selected: PropTypes.bool.isRequired, + liked: PropTypes.bool.isRequired, }, getInitialState: function() { return {read: this.props.read, liked: this.props.liked, @@ -86,7 +88,7 @@ var TableLine = React.createClass({ }, }); -var MiddlePanelSearchRow = React.createClass({ +var MiddlePanelSearchRow = createReactClass({ getInitialState: function() { return {query: MiddlePanelStore._datas.query, search_title: MiddlePanelStore._datas.search_title, @@ -143,7 +145,7 @@ var MiddlePanelSearchRow = React.createClass({ }, }); -var MiddlePanelFilter = React.createClass({ +var MiddlePanelFilter = createReactClass({ getInitialState: function() { return {filter: MiddlePanelStore._datas.filter, display_search: MiddlePanelStore._datas.display_search}; @@ -219,7 +221,7 @@ var MiddlePanelFilter = React.createClass({ }, }); -var MiddlePanel = React.createClass({ +var MiddlePanel = createReactClass({ getInitialState: function() { return {filter: MiddlePanelStore._datas.filter, articles: []}; }, diff --git a/src/web/js/components/Navbar.react.js b/src/web/js/components/Navbar.react.js index ca2ff27b..83f3c72c 100644 --- a/src/web/js/components/Navbar.react.js +++ b/src/web/js/components/Navbar.react.js @@ -1,4 +1,5 @@ var React = require('react'); +var createReactClass = require('create-react-class'); var Glyphicon = require('react-bootstrap/lib/Glyphicon'); var Nav = require('react-bootstrap/lib/Nav'); var NavItem = require('react-bootstrap/lib/NavItem'); @@ -11,7 +12,7 @@ var Input = require('react-bootstrap/lib/Input'); var MenuStore = require('../stores/MenuStore'); -JarrNavBar = React.createClass({ +JarrNavBar = createReactClass({ getInitialState: function() { return {is_admin: MenuStore._datas.is_admin, crawling_method: MenuStore._datas.crawling_method, diff --git a/src/web/js/components/RightPanel.react.js b/src/web/js/components/RightPanel.react.js index 60ef426e..6384cdfe 100644 --- a/src/web/js/components/RightPanel.react.js +++ b/src/web/js/components/RightPanel.react.js @@ -1,9 +1,11 @@ var React = require('react'); +var createReactClass = require('create-react-class'); var Col = require('react-bootstrap/lib/Col'); var Glyphicon = require('react-bootstrap/lib/Glyphicon'); var Button = require('react-bootstrap/lib/Button'); var ButtonGroup = require('react-bootstrap/lib/ButtonGroup'); var Modal = require('react-bootstrap/lib/Modal'); +var PropTypes = require('prop-types'); var RightPanelActions = require('../actions/RightPanelActions'); var RightPanelStore = require('../stores/RightPanelStore'); @@ -11,7 +13,7 @@ var MenuStore = require('../stores/MenuStore'); var JarrTime = require('./time.react'); var PanelMixin = { - propTypes: {obj: React.PropTypes.object.isRequired}, + propTypes: {obj: PropTypes.object.isRequired}, getInitialState: function() { return {edit_mode: false, obj: this.props.obj, showModal: false}; }, @@ -164,7 +166,7 @@ var PanelMixin = { }, }; -var Article = React.createClass({ +var Article = createReactClass({ mixins: [PanelMixin], isEditable: function() {return false;}, isRemovable: function() {return true;}, @@ -183,7 +185,7 @@ var Article = React.createClass({ } }); -var Feed = React.createClass({ +var Feed = createReactClass({ mixins: [PanelMixin], isEditable: function() {return true;}, isRemovable: function() {return true;}, @@ -354,7 +356,7 @@ var Feed = React.createClass({ }, }); -var Category = React.createClass({ +var Category = createReactClass({ mixins: [PanelMixin], isEditable: function() { if(this.props.obj.id != 0) {return true;} @@ -372,7 +374,7 @@ var Category = React.createClass({ }, }); -var RightPanel = React.createClass({ +var RightPanel = createReactClass({ getInitialState: function() { return {category: null, feed: null, article: null, current: null}; }, diff --git a/src/web/js/components/time.react.js b/src/web/js/components/time.react.js index c293e638..07e1fbdf 100644 --- a/src/web/js/components/time.react.js +++ b/src/web/js/components/time.react.js @@ -1,8 +1,10 @@ var React = require('react'); +var createReactClass = require('create-react-class'); +var PropTypes = require('prop-types'); -var JarrTime = React.createClass({ - propTypes: {stamp: React.PropTypes.string.isRequired, - text: React.PropTypes.string.isRequired}, +var JarrTime = createReactClass({ + propTypes: {stamp: PropTypes.string.isRequired, + text: PropTypes.string.isRequired}, render: function() { return (<time dateTime={this.props.text} title={this.props.text}> {this.props.stamp} |