Don't use deprecated variants in material ui.

5 years ago · 063fff5343
16 changed files with 70 additions and 51 deletions
--- a/data/www/index.html
+++ b/data/www/index.html
@ -1 +1 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><link rel="stylesheet" href="/css/roboto.css"><link rel="manifest" href="/app/manifest.json"><title>ESP8266 React</title></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script src="/js/1.b351.js"></script><script src="/js/2.9881.js"></script><script src="/js/0.d999.js"></script></body></html>
+<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><link rel="stylesheet" href="/css/roboto.css"><link rel="manifest" href="/app/manifest.json"><title>ESP8266 React</title></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script src="/js/1.b351.js"></script><script src="/js/2.9881.js"></script><script src="/js/0.da55.js"></script></body></html>
--- a/data/www/js/0.d999.js.gz
+++ b/data/www/js/0.d999.js.gz
--- a/data/www/js/0.da55.js.gz
+++ b/data/www/js/0.da55.js.gz
--- a/interface/.env.development
+++ b/interface/.env.development
@ -1 +1 @@
-REACT_APP_ENDPOINT_ROOT=http://192.168.0.26/rest/
+REACT_APP_ENDPOINT_ROOT=http://192.168.0.4/rest/
--- a/interface/package-lock.json
+++ b/interface/package-lock.json
@ -3052,7 +3052,8 @@
            },
            "ansi-regex": {
              "version": "2.1.1",
-              "bundled": true
+              "bundled": true,
+              "optional": true
            },
            "aproba": {
              "version": "1.2.0",
@ -3417,7 +3418,8 @@
            },
            "safe-buffer": {
              "version": "5.1.2",
-              "bundled": true
+              "bundled": true,
+              "optional": true
            },
            "safer-buffer": {
              "version": "2.1.2",
@ -3465,6 +3467,7 @@
            "strip-ansi": {
              "version": "3.0.1",
              "bundled": true,
+              "optional": true,
              "requires": {
                "ansi-regex": "^2.0.0"
              }
@ -3503,11 +3506,13 @@
            },
            "wrappy": {
              "version": "1.0.2",
-              "bundled": true
+              "bundled": true,
+              "optional": true
            },
            "yallist": {
              "version": "3.0.3",
-              "bundled": true
+              "bundled": true,
+              "optional": true
            }
          }
        },
@ -6600,11 +6605,13 @@
        },
        "balanced-match": {
          "version": "1.0.0",
-          "bundled": true
+          "bundled": true,
+          "optional": true
        },
        "brace-expansion": {
          "version": "1.1.11",
          "bundled": true,
+          "optional": true,
          "requires": {
            "balanced-match": "1.0.0",
            "concat-map": "0.0.1"
@ -6617,15 +6624,18 @@
        },
        "code-point-at": {
          "version": "1.1.0",
-          "bundled": true
+          "bundled": true,
+          "optional": true
        },
        "concat-map": {
          "version": "0.0.1",
-          "bundled": true
+          "bundled": true,
+          "optional": true
        },
        "console-control-strings": {
          "version": "1.1.0",
-          "bundled": true
+          "bundled": true,
+          "optional": true
        },
        "core-util-is": {
          "version": "1.0.2",
@ -6728,7 +6738,8 @@
        },
        "inherits": {
          "version": "2.0.3",
-          "bundled": true
+          "bundled": true,
+          "optional": true
        },
        "ini": {
          "version": "1.3.5",
@ -6738,6 +6749,7 @@
        "is-fullwidth-code-point": {
          "version": "1.0.0",
          "bundled": true,
+          "optional": true,
          "requires": {
            "number-is-nan": "^1.0.0"
          }
@ -6750,17 +6762,20 @@
        "minimatch": {
          "version": "3.0.4",
          "bundled": true,
+          "optional": true,
          "requires": {
            "brace-expansion": "1.1.11"
          }
        },
        "minimist": {
          "version": "0.0.8",
-          "bundled": true
+          "bundled": true,
+          "optional": true
        },
        "minipass": {
          "version": "2.2.4",
          "bundled": true,
+          "optional": true,
          "requires": {
            "safe-buffer": "^5.1.1",
            "yallist": "^3.0.0"
@ -6777,6 +6792,7 @@
        "mkdirp": {
          "version": "0.5.1",
          "bundled": true,
+          "optional": true,
          "requires": {
            "minimist": "0.0.8"
          }
@ -6849,7 +6865,8 @@
        },
        "number-is-nan": {
          "version": "1.0.1",
-          "bundled": true
+          "bundled": true,
+          "optional": true
        },
        "object-assign": {
          "version": "4.1.1",
@ -6859,6 +6876,7 @@
        "once": {
          "version": "1.4.0",
          "bundled": true,
+          "optional": true,
          "requires": {
            "wrappy": "1"
          }
@ -6964,6 +6982,7 @@
        "string-width": {
          "version": "1.0.2",
          "bundled": true,
+          "optional": true,
          "requires": {
            "code-point-at": "^1.0.0",
            "is-fullwidth-code-point": "^1.0.0",
--- a/interface/src/containers/APConfiguration.js
+++ b/interface/src/containers/APConfiguration.js
@ -25,7 +25,7 @@ class APConfiguration extends Component {
    const { selectedTab } = this.state;
    return (
      <MenuAppBar sectionTitle="AP Configuration">
-        <Tabs value={selectedTab} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" fullWidth scrollable>
+        <Tabs value={selectedTab} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" variant="scrollable">
           <Tab value="apStatus" label="AP Status" />
           <Tab value="apSettings" label="AP Settings" />
         </Tabs>
--- a/interface/src/containers/APStatus.js
+++ b/interface/src/containers/APStatus.js
@ -59,26 +59,26 @@ class APStatus extends Component {
          </Avatar>
          <ListItemText primary="Status" secondary={this.apStatus(data)} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
        <ListItem>
          <Avatar>IP</Avatar>
          <ListItemText primary="IP Address" secondary={data.ip_address} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
        <ListItem>
          <Avatar>
            <DeviceHubIcon />
          </Avatar>
          <ListItemText primary="MAC Address" secondary={data.mac_address} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
        <ListItem>
          <Avatar>
            <ComputerIcon />
          </Avatar>
          <ListItemText primary="AP Clients" secondary={data.station_num} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
      </Fragment>
    );
  }
@ -91,7 +91,7 @@ class APStatus extends Component {
            {this.createListItems(data, fullDetails, classes)}
          </Fragment>
        </List>
-        <Button variant="raised" color="secondary" className={classes.button} onClick={this.props.loadData}>
+        <Button variant="contained" color="secondary" className={classes.button} onClick={this.props.loadData}>
          Refresh
        </Button>
      </div>
@ -118,7 +118,7 @@ class APStatus extends Component {
          <Typography variant="display1" className={classes.fetching}>
            {errorMessage}
          </Typography>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={this.props.loadData}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={this.props.loadData}>
            Refresh
          </Button>
        </div>
--- a/interface/src/containers/NTPConfiguration.js
+++ b/interface/src/containers/NTPConfiguration.js
@ -23,7 +23,7 @@ class NTPConfiguration extends Component {
    const { selectedTab } = this.state;
    return (
        <MenuAppBar sectionTitle="NTP Configuration">
-        <Tabs value={selectedTab} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" fullWidth scrollable>
+        <Tabs value={selectedTab} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" variant="scrollable">
           <Tab value="ntpStatus" label="NTP Status" />
           <Tab value="ntpSettings" label="NTP Settings" />
         </Tabs>
--- a/interface/src/containers/NTPStatus.js
+++ b/interface/src/containers/NTPStatus.js
@ -60,7 +60,7 @@ class NTPStatus extends Component {
          </Avatar>
          <ListItemText primary="Status" secondary={ntpStatus(data)} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
        { isSynchronized(data) &&
          <Fragment>
            <ListItem>
@ -69,14 +69,14 @@ class NTPStatus extends Component {
              </Avatar>
              <ListItemText primary="Time Now" secondary={unixTimeToTimeAndDate(data.now)} />
            </ListItem>
-            <Divider inset component="li" />
+            <Divider variant="inset" component="li" />
            <ListItem>
              <Avatar>
                <SwapVerticalCircleIcon />
              </Avatar>
              <ListItemText primary="Last Sync" secondary={data.last_sync > 0 ? unixTimeToTimeAndDate(data.last_sync) : "never" } />
            </ListItem>
-            <Divider inset component="li" />
+            <Divider variant="inset" component="li" />
          </Fragment>
        }
        <ListItem>
@ -85,21 +85,21 @@ class NTPStatus extends Component {
          </Avatar>
          <ListItemText primary="NTP Server" secondary={data.server} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
        <ListItem>
          <Avatar>
            <TimerIcon />
          </Avatar>
          <ListItemText primary="Sync Interval" secondary={moment.duration(data.interval, 'seconds').humanize()} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
        <ListItem>
          <Avatar>
            <AvTimerIcon />
          </Avatar>
          <ListItemText primary="Uptime" secondary={moment.duration(data.uptime, 'seconds').humanize()} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
      </Fragment>
    );
  }
@ -110,7 +110,7 @@ class NTPStatus extends Component {
        <List>
          {this.createListItems(data, fullDetails, classes)}
        </List>
-        <Button variant="raised" color="secondary" className={classes.button} onClick={this.props.loadData}>
+        <Button variant="contained" color="secondary" className={classes.button} onClick={this.props.loadData}>
          Refresh
        </Button>
      </div>
@ -137,7 +137,7 @@ class NTPStatus extends Component {
          <Typography variant="display1" className={classes.fetching}>
            {errorMessage}
          </Typography>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={this.props.loadData}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={this.props.loadData}>
            Refresh
          </Button>
        </div>
--- a/interface/src/containers/WiFiConfiguration.js
+++ b/interface/src/containers/WiFiConfiguration.js
@ -38,7 +38,7 @@ class WiFiConfiguration extends Component {
    const { selectedTab } = this.state;
    return (
      <MenuAppBar sectionTitle="WiFi Configuration">
-        <Tabs value={selectedTab} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" fullWidth scrollable>
+        <Tabs value={selectedTab} onChange={this.handleTabChange} indicatorColor="primary" textColor="primary" variant="scrollable">
           <Tab value="wifiStatus" label="WiFi Status" />
           <Tab value="networkScanner" label="Network Scanner" />
           <Tab value="wifiSettings" label="WiFi Settings" />
--- a/interface/src/containers/WiFiStatus.js
+++ b/interface/src/containers/WiFiStatus.js
@ -67,7 +67,7 @@ class WiFiStatus extends Component {
          </Avatar>
          <ListItemText primary="Connection Status" secondary={connectionStatus(data)} />
        </ListItem>
-        <Divider inset component="li" />
+        <Divider variant="inset" component="li" />
        {
          (fullDetails && isConnected(data)) &&
          <Fragment>
@ -77,31 +77,31 @@ class WiFiStatus extends Component {
              </Avatar>
              <ListItemText primary="SSID" secondary={data.ssid} />
            </ListItem>
-            <Divider inset component="li" />
+            <Divider variant="inset" component="li" />
            <ListItem>
              <Avatar>IP</Avatar>
              <ListItemText primary="IP Address" secondary={data.local_ip} />
            </ListItem>
-            <Divider inset component="li" />
+            <Divider variant="inset" component="li" />
            <ListItem>
              <Avatar>#</Avatar>
              <ListItemText primary="Subnet Mask" secondary={data.subnet_mask} />
            </ListItem>
-            <Divider inset component="li" />
+            <Divider variant="inset" component="li" />
            <ListItem>
              <Avatar>
                <SettingsInputComponentIcon />
              </Avatar>
              <ListItemText primary="Gateway IP" secondary={data.gateway_ip ? data.gateway_ip : "none"} />
            </ListItem>
-            <Divider inset component="li" />
+            <Divider variant="inset" component="li" />
            <ListItem>
              <Avatar>
                <DNSIcon />
              </Avatar>
              <ListItemText primary="DNS Server IP" secondary={this.dnsServers(data)} />
            </ListItem>
-            <Divider inset component="li" />
+            <Divider variant="inset" component="li" />
          </Fragment>
        }
      </Fragment>
@ -114,7 +114,7 @@ class WiFiStatus extends Component {
        <List>
        {this.createListItems(data, fullDetails, classes)}
        </List>
-        <Button variant="raised" color="secondary" className={classes.button} onClick={this.props.loadData}>
+        <Button variant="contained" color="secondary" className={classes.button} onClick={this.props.loadData}>
          Refresh
        </Button>
      </div>
@ -142,7 +142,7 @@ class WiFiStatus extends Component {
          <Typography variant="display1" className={classes.fetching}>
            {errorMessage}
          </Typography>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={this.props.loadData}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={this.props.loadData}>
            Refresh
          </Button>
        </div>
--- a/interface/src/forms/APSettingsForm.js
+++ b/interface/src/forms/APSettingsForm.js
@ -87,10 +87,10 @@ class APSettingsForm extends React.Component {
            </Fragment>
          }

-          <Button variant="raised" color="primary" className={classes.button} type="submit">
+          <Button variant="contained" color="primary" className={classes.button} type="submit">
            Save
          </Button>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={onReset}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={onReset}>
      		  Reset
      		</Button>

@ -102,7 +102,7 @@ class APSettingsForm extends React.Component {
          <Typography variant="display1" className={classes.loadingSettingsDetails}>
            {errorMessage}
          </Typography>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={onReset}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={onReset}>
      		  Reset
      		</Button>
        </div>
--- a/interface/src/forms/NTPSettingsForm.js
+++ b/interface/src/forms/NTPSettingsForm.js
@ -75,10 +75,10 @@ class NTPSettingsForm extends React.Component {
                 margin="normal"
               />

-          <Button variant="raised" color="primary" className={classes.button} type="submit">
+          <Button variant="contained" color="primary" className={classes.button} type="submit">
            Save
          </Button>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={onReset}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={onReset}>
      		  Reset
      		</Button>

@ -90,7 +90,7 @@ class NTPSettingsForm extends React.Component {
          <Typography variant="display1" className={classes.loadingSettingsDetails}>
            {errorMessage}
          </Typography>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={onReset}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={onReset}>
      		  Reset
      		</Button>
        </div>
--- a/interface/src/forms/OTASettingsForm.js
+++ b/interface/src/forms/OTASettingsForm.js
@ -95,10 +95,10 @@ class OTASettingsForm extends React.Component {
                   margin="normal"
             />

-          <Button variant="raised" color="primary" className={classes.button} type="submit">
+          <Button variant="contained" color="primary" className={classes.button} type="submit">
            Save
          </Button>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={onReset}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={onReset}>
      		  Reset
      		</Button>

@ -110,7 +110,7 @@ class OTASettingsForm extends React.Component {
          <Typography variant="display1" className={classes.loadingSettingsDetails}>
            {errorMessage}
          </Typography>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={onReset}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={onReset}>
      		  Reset
      		</Button>
        </div>
--- a/interface/src/forms/WiFiNetworkSelector.js
+++ b/interface/src/forms/WiFiNetworkSelector.js
@ -86,7 +86,7 @@ class WiFiNetworkSelector extends Component {
          </div>
        }

-        <Button variant="raised" color="secondary" className={classes.button} onClick={requestNetworkScan} disabled={scanningForNetworks}>
+        <Button variant="contained" color="secondary" className={classes.button} onClick={requestNetworkScan} disabled={scanningForNetworks}>
          Scan again...
        </Button>
      </div>
--- a/interface/src/forms/WiFiSettingsForm.js
+++ b/interface/src/forms/WiFiSettingsForm.js
@ -201,10 +201,10 @@ class WiFiSettingsForm extends React.Component {
          		</Fragment>
      		  }

-          <Button variant="raised" color="primary" className={classes.button} type="submit">
+          <Button variant="contained" color="primary" className={classes.button} type="submit">
            Save
          </Button>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={onReset}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={onReset}>
      		  Reset
      		</Button>

@ -216,7 +216,7 @@ class WiFiSettingsForm extends React.Component {
          <Typography variant="display1" className={classes.loadingSettingsDetails}>
            {errorMessage}
          </Typography>
-          <Button variant="raised" color="secondary" className={classes.button} onClick={onReset}>
+          <Button variant="contained" color="secondary" className={classes.button} onClick={onReset}>
      		  Reset
      		</Button>
        </div>