diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index ac8560c3..171df718 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -257,5 +257,7 @@ "reset_settings": "Reset settings", "update_announcement": "AdGuard Home {{version}} is now available! <0>Click here<\/0> for more info.", "setup_guide": "Setup guide", - "dns_addresses": "DNS addresses" + "dns_addresses": "DNS addresses", + "down": "Down", + "fix": "Fix" } \ No newline at end of file diff --git a/client/src/actions/install.js b/client/src/actions/install.js index c738f75d..3070ff2d 100644 --- a/client/src/actions/install.js +++ b/client/src/actions/install.js @@ -44,3 +44,18 @@ export const setAllSettings = values => async (dispatch) => { dispatch(prevStep()); } }; + +export const checkConfigRequest = createAction('CHECK_CONFIG_REQUEST'); +export const checkConfigFailure = createAction('CHECK_CONFIG_FAILURE'); +export const checkConfigSuccess = createAction('CHECK_CONFIG_SUCCESS'); + +export const checkConfig = values => async (dispatch) => { + dispatch(checkConfigRequest()); + try { + const check = await apiClient.checkConfig(values); + dispatch(checkConfigSuccess(check)); + } catch (error) { + dispatch(addErrorToast({ error })); + dispatch(checkConfigFailure()); + } +}; diff --git a/client/src/api/Api.js b/client/src/api/Api.js index a0ca7ed2..6d8a2f52 100644 --- a/client/src/api/Api.js +++ b/client/src/api/Api.js @@ -350,6 +350,7 @@ export default class Api { // Installation INSTALL_GET_ADDRESSES = { path: 'install/get_addresses', method: 'GET' }; INSTALL_CONFIGURE = { path: 'install/configure', method: 'POST' }; + INSTALL_CHECK_CONFIG = { path: 'install/check_config', method: 'POST' }; getDefaultAddresses() { const { path, method } = this.INSTALL_GET_ADDRESSES; @@ -365,6 +366,15 @@ export default class Api { return this.makeRequest(path, method, parameters); } + checkConfig(config) { + const { path, method } = this.INSTALL_CHECK_CONFIG; + const parameters = { + data: config, + headers: { 'Content-Type': 'application/json' }, + }; + return this.makeRequest(path, method, parameters); + } + // DNS-over-HTTPS and DNS-over-TLS TLS_STATUS = { path: 'tls/status', method: 'GET' }; TLS_CONFIG = { path: 'tls/configure', method: 'POST' }; diff --git a/client/src/install/Setup/Controls.js b/client/src/install/Setup/Controls.js index 5560c511..489ce08d 100644 --- a/client/src/install/Setup/Controls.js +++ b/client/src/install/Setup/Controls.js @@ -55,6 +55,8 @@ class Controls extends Component { invalid || pristine || install.processingSubmit + || install.dns.status + || install.web.status } > next diff --git a/client/src/install/Setup/Settings.js b/client/src/install/Setup/Settings.js index 25fd2d76..ff11f0ab 100644 --- a/client/src/install/Setup/Settings.js +++ b/client/src/install/Setup/Settings.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { Fragment } from 'react'; import { connect } from 'react-redux'; import PropTypes from 'prop-types'; import { Field, reduxForm, formValueSelector } from 'redux-form'; @@ -30,10 +30,25 @@ const toNumber = value => value && parseInt(value, 10); const renderInterfaces = (interfaces => ( Object.keys(interfaces).map((item) => { const option = interfaces[item]; - const { name } = option; + const { + name, + ip_addresses, + flags, + } = option; - if (option.ip_addresses && option.ip_addresses.length > 0) { + if (option && ip_addresses && ip_addresses.length > 0) { const ip = getInterfaceIp(option); + const isDown = flags && flags.includes('down'); + + if (isDown) { + return ( + + ); + } return (