Completely updated React, fixed #11, (hopefully)

goTorrentWebUI/src/TopMenu/Modals/RSSModal/RSSTorrentList.js

@@ -1,14 +1,15 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import Button from 'material-ui/Button';
+import Paper from 'material-ui/Paper';
 
 import {
-    SortingState, LocalSorting, VirtualTableLayout, SelectionState,
+    SortingState, IntegratedSorting, VirtualTableLayout, SelectionState,
 } from '@devexpress/dx-react-grid';
 
 import {
-    Grid, TableHeaderRow, PagingPanel, VirtualTableView, TableColumnResizing,
-    DragDropContext, TableColumnReordering, TableSelection,
+    Grid, TableHeaderRow, VirtualTable, TableColumnResizing,
+    DragDropProvider, TableColumnReordering, TableSelection,
 } from '@devexpress/dx-react-grid-material-ui';
 
 
@@ -31,14 +32,15 @@ class RSSTorrentList extends React.Component {
             ],
             sorting: [],
             columnOrder: ['TorrentName', 'TorrentLink', 'PublishDate'],
-            columnWidths: {TorrentName: 450, TorrentLink: 650, PublishDate: 200},
+            columnWidths: [
+                {columnName: 'TorrentName', width: 450},
+                {columnName: 'TorrentLink', width: 650},
+                {columnName: 'PublishDate', width: 200},
+            ],
             fileSelection: [],
-            selected: [],
- 
-            
+            selected: [],    
         };
 
-
         this.changeColumnOrder = columnOrder => this.setState({columnOrder});
         this.changeColumnWidths = columnWidths => this.setState({columnWidths});
         this.changeSorting = sorting => this.setState({sorting});
@@ -82,22 +84,24 @@ class RSSTorrentList extends React.Component {
         return (  
             //Buttons here 
             <div>
-                <Button raised color="primary" onClick={this.sendMagnetLinks}>
+                <Button variant="raised" color="primary" onClick={this.sendMagnetLinks}>
                     Download Torrents
                 </Button>
-                <Grid rows={this.props.RSSTorrentList} columns={this.state.columns}>
-                    <SortingState sorting={this.state.sorting} onSortingChange={this.changeSorting} />
-                    <LocalSorting />
-                    <DragDropContext />
-                    <SelectionState onSelectionChange={this.changeSelection} selection={this.state.selection}/>
-                
-                    <VirtualTableView height={500} />
-    
-                    <TableColumnResizing columnWidths={this.state.columnWidths} onColumnWidthsChange={this.changeColumnWidths}/>
-                    <TableColumnReordering order={this.state.columnOrder} onOrderChange={this.changeColumnOrder} />
-                    <TableSelection selectByRowClick highlightSelected />
-                    <TableHeaderRow allowSorting allowResizing allowDragging />
-                </Grid>
+                    <Paper>
+                    <Grid rows={this.props.RSSTorrentList} columns={this.state.columns}>
+                        <SortingState sorting={this.state.sorting} onSortingChange={this.changeSorting} />
+                        <IntegratedSorting />
+                        <DragDropProvider />
+                        <SelectionState onSelectionChange={this.changeSelection} selection={this.state.selection}/>
+                    
+                        <VirtualTable height={500} />
+        
+                        <TableColumnResizing columnWidths={this.state.columnWidths} onColumnWidthsChange={this.changeColumnWidths}/>
+                        <TableColumnReordering order={this.state.columnOrder} onOrderChange={this.changeColumnOrder} />
+                        <TableSelection selectByRowClick highlightSelected />
+                        <TableHeaderRow allowSorting allowResizing allowDragging />
+                    </Grid>
+                    </Paper>
             </div>
         );
     }
@@ -106,7 +110,6 @@ class RSSTorrentList extends React.Component {
 }
 
 
-
 const mapStateToProps = state => {
     return {
         selectionHashes: state.selectionHashes,

goTorrentWebUI/src/TopMenu/Modals/RSSModal/addRSSModal.js

@@ -59,7 +59,7 @@ const inlineStyle = {
           <ReactTooltip place="top" type="light" effect="float" />
           <RSSTorrentIcon />
         </IconButton>
-        <Dialog fullScreen open={this.props.RSSModalOpen} onRequestClose={this.handleRequestClose}>
+        <Dialog fullScreen open={this.props.RSSModalOpen} onClose={this.handleRequestClose} onEscapeKeyDown={this.handleRequestClose}>
         <DialogTitle>Manage RSS Feeds</DialogTitle>
           <RSSModalLayout />
         </Dialog>   

goTorrentWebUI/src/TopMenu/Modals/SettingsModal/SettingsModalContentTabs/apiSettingsTab.js

@@ -0,0 +1,52 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { withStyles } from 'material-ui/styles';
+import Paper from 'material-ui/Paper';
+import Grid from 'material-ui/Grid';
+
+import {connect} from 'react-redux';
+
+
+const styles = theme => ({
+    root: {
+      flexGrow: 1,
+      marginTop: 0,
+    },
+    paper: {
+      padding: 16,
+      textAlign: 'left',
+      color: theme.palette.text.primary,
+    },
+    floatRight: {
+        float: 'right',
+    }
+});
+
+
+class APISettingsTab extends React.PureComponent {
+
+
+    requestNewKey = (keyName) => {
+
+    }
+
+
+    render() {
+        const { classes } = this.props;
+        return (
+            <div className={classes.root}>    
+            Not yet implemented!
+            </div>
+        );
+    }
+}
+
+
+const mapStateToProps = state => {
+    return {
+      settingsFile: state.settingsFile,
+    };
+  }
+
+export default withStyles(styles)(connect(mapStateToProps)(APISettingsTab))
+

goTorrentWebUI/src/TopMenu/Modals/SettingsModal/addSettingsModal.js

@@ -3,7 +3,7 @@ import ReactDOM from 'react-dom';
 import Button from 'material-ui/Button';
 import TextField from 'material-ui/TextField';
 import { withStyles } from 'material-ui/styles';
-import PropTypes from 'prop-types';
+//import PropTypes from 'prop-types';
 import List, {
     ListItem,
     ListItemIcon,
@@ -61,7 +61,7 @@ const inlineStyle = {
           <ReactTooltip place="top" type="light" effect="float" />
           <SettingsIcon />
         </IconButton>
-        <Dialog fullScreen open={this.props.settingsModalOpen} onRequestClose={this.handleRequestClose}>
+        <Dialog fullScreen open={this.props.settingsModalOpen} onClose={this.handleRequestClose} onEscapeKeyDown={this.handleRequestClose}>
         <DialogTitle>Manage Settings</DialogTitle>
         <SettingsModalLayout />
         </Dialog>   

goTorrentWebUI/src/TopMenu/Modals/SettingsModal/settingsModalContent.js

@@ -9,7 +9,7 @@ import ClientSettingsTab from './SettingsModalContentTabs/clientSettingsTab';
 import LoggingSettingsTab from './SettingsModalContentTabs/loggingSettingsTab';
 import NotesTab from './SettingsModalContentTabs/notesTab';
 import ServerSettingsTab from './SettingsModalContentTabs/serverSettingsTab';
-
+import APISettingsTab from './SettingsModalContentTabs/apiSettingsTab';
 
 
 
@@ -35,11 +35,11 @@ class SettingsModalContent extends React.Component {
                 return <LoggingSettingsTab />
             case 3:
                 return <ServerSettingsTab />
+            case 4:
+                return <APISettingsTab />
             default:
                 return <NotesTab />
-        }
-        
-       
+        } 
             
     }
 }

goTorrentWebUI/src/TopMenu/Modals/SettingsModal/settingsModalList.js

@@ -91,6 +91,9 @@ const inlineStyle = {
             <ListItem  className={this.state.activeIndex==3 ? classes.active: null} button onClick={() => this.changeMenuSelection(3)}>
                 <ListItemText primary="Server Settings" />
             </ListItem>
+            <ListItem  className={this.state.activeIndex==4 ? classes.active: null} button onClick={() => this.changeMenuSelection(4)}>
+                <ListItemText primary="API Settings" />
+            </ListItem>
         </List>
       </div>
     );

goTorrentWebUI/src/TopMenu/Modals/addTorrentFileModal.js

@@ -100,7 +100,7 @@ export default class addTorrentFilePopup extends React.Component {
         <ReactTooltip place="top" type="light" effect="float" />
         <AddIcon />
       </IconButton>
-        <Dialog open={this.state.open} onRequestClose={this.handleRequestClose} onEscapeKeyUp={this.handleRequestClose} maxWidth="md">
+        <Dialog open={this.state.open} onClose={this.handleRequestClose} onEscapeKeyDown={this.handleRequestClose} maxWidth="md">
           <DialogTitle>Add Torrent File</DialogTitle>
           <DialogContent>
             <DialogContentText>

goTorrentWebUI/src/TopMenu/Modals/addTorrentLinkModal.js

@@ -81,7 +81,7 @@ export default class addTorrentPopup extends React.Component {
         <ReactTooltip place="top" type="light" effect="float" />
         <InsertLinkIcon />
       </IconButton>
-        <Dialog open={this.state.open} onRequestClose={this.handleRequestClose}>
+        <Dialog open={this.state.open} onClose={this.handleRequestClose} onEscapeKeyDown={this.handleRequestClose}>
           <DialogTitle>Add Magnet Link</DialogTitle>
           <DialogContent>
             <DialogContentText>

goTorrentWebUI/src/TopMenu/Modals/changeStorageModal.js

@@ -70,7 +70,7 @@ class ChangeStorageModal extends React.Component {
         <ReactTooltip place="top" type="light" effect="float" />
         <StorageIcon />
       </IconButton>
-        <Dialog open={this.state.open} onRequestClose={this.handleRequestClose}>
+        <Dialog open={this.state.open} onClose={this.handleRequestClose} onEscapeKeyDown={this.handleRequestClose}>
           <DialogTitle>Change Storage Value</DialogTitle>
           <DialogContent>
             <DialogContentText>

goTorrentWebUI/src/TopMenu/Modals/deleteTorrentModal.js

@@ -91,7 +91,7 @@ class DeleteTorrentModal extends React.Component {
           <ReactTooltip place="top" type="error" effect="float" />
           <DeleteTorrentIcon />
         </IconButton>
-        <Dialog open={this.state.open} onRequestClose={this.handleRequestClose} onEscapeKeyUp={this.handleRequestClose} maxWidth="md">
+        <Dialog open={this.state.open} onClose={this.handleRequestClose} onEscapeKeyDown={this.handleRequestClose} maxWidth="md">
           <DialogTitle>Delete Torrent</DialogTitle>
           <DialogContent>
           Are you sure you want to delete Torrent?