Retain configured hostname (#173)

Retain configured hostname when selecting new network from network scanner
This commit is contained in:
rjwats 2020-07-19 19:57:59 +01:00 committed by GitHub
parent c16f7693fd
commit 25f04c3d7f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 27 additions and 28 deletions

View File

@ -1,8 +1,7 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import {restController, RestControllerProps, RestFormLoader, SectionContent } from '../components'; import { restController, RestControllerProps, RestFormLoader, SectionContent } from '../components';
import WiFiSettingsForm from './WiFiSettingsForm'; import WiFiSettingsForm from './WiFiSettingsForm';
import { WiFiConnectionContext } from './WiFiConnectionContext';
import { WIFI_SETTINGS_ENDPOINT } from '../api'; import { WIFI_SETTINGS_ENDPOINT } from '../api';
import { WiFiSettings } from './types'; import { WiFiSettings } from './types';
@ -10,39 +9,15 @@ type WiFiSettingsControllerProps = RestControllerProps<WiFiSettings>;
class WiFiSettingsController extends Component<WiFiSettingsControllerProps> { class WiFiSettingsController extends Component<WiFiSettingsControllerProps> {
static contextType = WiFiConnectionContext;
context!: React.ContextType<typeof WiFiConnectionContext>;
componentDidMount() { componentDidMount() {
const { selectedNetwork } = this.context;
if (selectedNetwork) {
const wifiSettings: WiFiSettings = {
ssid: selectedNetwork.ssid,
password: "",
hostname: "esp8266-react",
static_ip_config: false,
}
this.props.setData(wifiSettings);
} else {
this.props.loadData();
}
}
deselectNetworkAndLoadData = () => {
this.context.deselectNetwork();
this.props.loadData(); this.props.loadData();
} }
componentWillUnmount() {
this.context.deselectNetwork();
}
render() { render() {
return ( return (
<SectionContent title="WiFi Settings"> <SectionContent title="WiFi Settings">
<RestFormLoader <RestFormLoader
{...this.props} {...this.props}
loadData={this.deselectNetworkAndLoadData}
render={formProps => <WiFiSettingsForm {...formProps} />} render={formProps => <WiFiSettingsForm {...formProps} />}
/> />
</SectionContent> </SectionContent>

View File

@ -24,15 +24,39 @@ class WiFiSettingsForm extends React.Component<WiFiStatusFormProps> {
static contextType = WiFiConnectionContext; static contextType = WiFiConnectionContext;
context!: React.ContextType<typeof WiFiConnectionContext>; context!: React.ContextType<typeof WiFiConnectionContext>;
constructor(props: WiFiStatusFormProps, context: WiFiConnectionContext) {
super(props);
const { selectedNetwork } = context;
if (selectedNetwork) {
const wifiSettings: WiFiSettings = {
ssid: selectedNetwork.ssid,
password: "",
hostname: props.data.hostname,
static_ip_config: false,
}
props.setData(wifiSettings);
}
}
componentWillMount() { componentWillMount() {
ValidatorForm.addValidationRule('isIP', isIP); ValidatorForm.addValidationRule('isIP', isIP);
ValidatorForm.addValidationRule('isHostname', isHostname); ValidatorForm.addValidationRule('isHostname', isHostname);
ValidatorForm.addValidationRule('isOptionalIP', optional(isIP)); ValidatorForm.addValidationRule('isOptionalIP', optional(isIP));
} }
deselectNetworkAndLoadData = () => {
this.context.deselectNetwork();
this.props.loadData();
}
componentWillUnmount() {
this.context.deselectNetwork();
}
render() { render() {
const { selectedNetwork, deselectNetwork } = this.context; const { selectedNetwork, deselectNetwork } = this.context;
const { data, handleValueChange, saveData, loadData } = this.props; const { data, handleValueChange, saveData } = this.props;
return ( return (
<ValidatorForm onSubmit={saveData} ref="WiFiSettingsForm"> <ValidatorForm onSubmit={saveData} ref="WiFiSettingsForm">
{ {
@ -167,7 +191,7 @@ class WiFiSettingsForm extends React.Component<WiFiStatusFormProps> {
<FormButton startIcon={<SaveIcon />} variant="contained" color="primary" type="submit"> <FormButton startIcon={<SaveIcon />} variant="contained" color="primary" type="submit">
Save Save
</FormButton> </FormButton>
<FormButton variant="contained" color="secondary" onClick={loadData}> <FormButton variant="contained" color="secondary" onClick={this.deselectNetworkAndLoadData}>
Reset Reset
</FormButton> </FormButton>
</FormActions> </FormActions>