add Ethernet

interface/src/network/WiFiNetworkSelector.tsx

@@ -0,0 +1,54 @@
+import React, { Component } from 'react';
+
+import { Avatar, Badge } from '@material-ui/core';
+import { List, ListItem, ListItemIcon, ListItemText, ListItemAvatar } from '@material-ui/core';
+
+import WifiIcon from '@material-ui/icons/Wifi';
+import LockIcon from '@material-ui/icons/Lock';
+import LockOpenIcon from '@material-ui/icons/LockOpen';
+
+import { isNetworkOpen, networkSecurityMode } from './WiFiSecurityModes';
+import { NetworkConnectionContext } from './NetworkConnectionContext';
+import { WiFiNetwork, WiFiNetworkList } from './types';
+
+interface WiFiNetworkSelectorProps {
+  networkList: WiFiNetworkList;
+}
+
+class WiFiNetworkSelector extends Component<WiFiNetworkSelectorProps> {
+
+  static contextType = NetworkConnectionContext;
+  context!: React.ContextType<typeof NetworkConnectionContext>;
+
+  renderNetwork = (network: WiFiNetwork) => {
+    return (
+      <ListItem key={network.bssid} button onClick={() => this.context.selectNetwork(network)}>
+        <ListItemAvatar>
+          <Avatar>
+            {isNetworkOpen(network) ? <LockOpenIcon /> : <LockIcon />}
+          </Avatar>
+        </ListItemAvatar>
+        <ListItemText
+          primary={network.ssid}
+          secondary={"Security: " + networkSecurityMode(network) + ", Ch: " + network.channel}
+        />
+        <ListItemIcon>
+          <Badge badgeContent={network.rssi + "db"}>
+            <WifiIcon />
+          </Badge>
+        </ListItemIcon>
+      </ListItem>
+    );
+  }
+
+  render() {
+    return (
+      <List>
+        {this.props.networkList.networks.map(this.renderNetwork)}
+      </List>
+    );
+  }
+
+}
+
+export default WiFiNetworkSelector;