use render callbacks for loading notification
This commit is contained in:
parent
ff85c2e661
commit
ef8061cbc3
@ -22,7 +22,7 @@ const useStyles = makeStyles(theme => ({
|
||||
|
||||
export default function LoadingNotification(props) {
|
||||
const classes = useStyles();
|
||||
const { fetched, errorMessage, onReset, children } = props;
|
||||
const { fetched, errorMessage, onReset, render } = props;
|
||||
return (
|
||||
<div>
|
||||
{
|
||||
@ -37,7 +37,7 @@ export default function LoadingNotification(props) {
|
||||
</Button>
|
||||
</div>
|
||||
:
|
||||
children
|
||||
render()
|
||||
:
|
||||
<div className={classes.loadingSettings}>
|
||||
<LinearProgress className={classes.loadingSettingsDetails} />
|
||||
@ -53,5 +53,6 @@ export default function LoadingNotification(props) {
|
||||
LoadingNotification.propTypes = {
|
||||
fetched: PropTypes.bool.isRequired,
|
||||
onReset: PropTypes.func.isRequired,
|
||||
errorMessage: PropTypes.string
|
||||
errorMessage: PropTypes.string,
|
||||
render: PropTypes.func.isRequired
|
||||
};
|
||||
|
@ -19,14 +19,16 @@ class APSettings extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
errorMessage={errorMessage}
|
||||
render={() =>
|
||||
<APSettingsForm
|
||||
apSettings={data}
|
||||
onSubmit={saveData}
|
||||
onReset={loadData}
|
||||
handleValueChange={handleValueChange}
|
||||
/>
|
||||
</LoadingNotification>
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
|
@ -107,9 +107,11 @@ class APStatus extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
{this.renderAPStatus(data, classes)}
|
||||
</LoadingNotification>
|
||||
errorMessage={errorMessage}
|
||||
render={
|
||||
() => this.renderAPStatus(data, classes)
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
|
@ -19,7 +19,8 @@ class ManageUsers extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
errorMessage={errorMessage}
|
||||
render={() =>
|
||||
<ManageUsersForm
|
||||
userData={data}
|
||||
onSubmit={saveData}
|
||||
@ -27,7 +28,8 @@ class ManageUsers extends Component {
|
||||
setData={setData}
|
||||
handleValueChange={handleValueChange}
|
||||
/>
|
||||
</LoadingNotification>
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
|
@ -19,14 +19,16 @@ class NTPSettings extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
errorMessage={errorMessage}
|
||||
render={() =>
|
||||
<NTPSettingsForm
|
||||
ntpSettings={data}
|
||||
onSubmit={saveData}
|
||||
onReset={loadData}
|
||||
handleValueChange={handleValueChange}
|
||||
/>
|
||||
</LoadingNotification>
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
|
@ -132,9 +132,11 @@ class NTPStatus extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
{this.renderNTPStatus(data, classes)}
|
||||
</LoadingNotification>
|
||||
errorMessage={errorMessage}
|
||||
render={
|
||||
() => this.renderNTPStatus(data, classes)
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
);
|
||||
}
|
||||
|
@ -19,7 +19,8 @@ class OTASettings extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
errorMessage={errorMessage}
|
||||
render={() =>
|
||||
<OTASettingsForm
|
||||
otaSettings={data}
|
||||
onSubmit={saveData}
|
||||
@ -27,7 +28,8 @@ class OTASettings extends Component {
|
||||
handleValueChange={handleValueChange}
|
||||
handleCheckboxChange={handleCheckboxChange}
|
||||
/>
|
||||
</LoadingNotification>
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
|
@ -19,14 +19,16 @@ class SecuritySettings extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
errorMessage={errorMessage}
|
||||
render={() =>
|
||||
<SecuritySettingsForm
|
||||
securitySettings={data}
|
||||
onSubmit={saveData}
|
||||
onReset={loadData}
|
||||
handleValueChange={handleValueChange}
|
||||
/>
|
||||
</LoadingNotification>
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
|
@ -84,7 +84,7 @@ class SystemStatus extends Component {
|
||||
);
|
||||
}
|
||||
|
||||
renderNTPStatus(data, classes) {
|
||||
renderSystemStatus(data, classes) {
|
||||
return (
|
||||
<div>
|
||||
<List>
|
||||
@ -104,9 +104,11 @@ class SystemStatus extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
{this.renderNTPStatus(data, classes)}
|
||||
</LoadingNotification>
|
||||
errorMessage={errorMessage}
|
||||
render={
|
||||
() => this.renderSystemStatus(data, classes)
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
|
@ -42,7 +42,8 @@ class WiFiSettings extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
errorMessage={errorMessage}
|
||||
render={() =>
|
||||
<WiFiSettingsForm
|
||||
wifiSettings={data}
|
||||
selectedNetwork={selectedNetwork}
|
||||
@ -52,7 +53,8 @@ class WiFiSettings extends Component {
|
||||
handleValueChange={handleValueChange}
|
||||
handleCheckboxChange={handleCheckboxChange}
|
||||
/>
|
||||
</LoadingNotification>
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
|
@ -144,9 +144,11 @@ class WiFiStatus extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
{this.renderWiFiStatus(data, classes)}
|
||||
</LoadingNotification>
|
||||
errorMessage={errorMessage}
|
||||
render={
|
||||
() => this.renderWiFiStatus(data, classes)
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
);
|
||||
}
|
||||
|
@ -25,14 +25,16 @@ class DemoController extends Component {
|
||||
<LoadingNotification
|
||||
onReset={loadData}
|
||||
fetched={fetched}
|
||||
errorMessage={errorMessage}>
|
||||
errorMessage={errorMessage}
|
||||
render={() =>
|
||||
<DemoControllerForm
|
||||
demoSettings={data}
|
||||
onReset={loadData}
|
||||
onSubmit={saveData}
|
||||
handleValueChange={handleValueChange}
|
||||
/>
|
||||
</LoadingNotification>
|
||||
}
|
||||
/>
|
||||
</SectionContent>
|
||||
)
|
||||
}
|
||||
@ -43,7 +45,7 @@ const useStyles = makeStyles(theme => ({
|
||||
marginRight: theme.spacing(2),
|
||||
marginTop: theme.spacing(2),
|
||||
},
|
||||
blinkSpeedLabel:{
|
||||
blinkSpeedLabel: {
|
||||
marginBottom: theme.spacing(5),
|
||||
}
|
||||
}));
|
||||
|
Loading…
Reference in New Issue
Block a user