From a7416f9c34c3fc1df3b3ececb2e9c77923059685 Mon Sep 17 00:00:00 2001 From: Ildar Kamalov Date: Mon, 21 Jan 2019 11:55:39 +0300 Subject: [PATCH] Fixed validation and added toasts --- client/src/__locales/en.json | 13 ++++++----- client/src/actions/install.js | 1 + client/src/install/Setup/Auth.js | 18 +++++++++++---- client/src/install/Setup/Controls.js | 4 ++-- client/src/install/Setup/Devices.js | 10 ++++----- client/src/install/Setup/Settings.js | 6 ++--- client/src/install/Setup/index.js | 6 +++-- client/src/install/Setup/validate.js | 11 ---------- client/src/reducers/install.js | 33 +++++++++++++++++++++++++++- 9 files changed, 68 insertions(+), 34 deletions(-) delete mode 100644 client/src/install/Setup/validate.js diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index e82d7ad5..7bc64008 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -179,13 +179,14 @@ "install_devices_desc": "In order for AdGuard Home to start working, you need to configure your devices to use it.", "install_submit_title": "Congratulations!", "install_submit_desc": "The setup procedure is finished and you are ready to start using AdGuard Home.", - "install_decices_router": "Router", - "install_decices_router_desc": "This setup will automatically cover all the devices connected to your home router and you will not need to configure each of them manually.", - "install_decices_router_list_1": "Open the preferences for your router. Usually, you can access it from your browser via a URL (like http://192.168.0.1/ or http://192.168.1.1/). You may be asked to enter the password. If you don't remember it, you can often reset the password by pressing a button on the router itself. Some routers require a specific application, which in that case should be already installed on your computer/phone.", - "install_decices_router_list_2": "Find the DHCP/DNS settings. Look for the DNS letters next to a field which allows two or three sets of numbers, each broken into four groups of one to three digits.", - "install_decices_router_list_3": "Enter your AdGuard Home server addresses there.", + "install_devices_router": "Router", + "install_devices_router_desc": "This setup will automatically cover all the devices connected to your home router and you will not need to configure each of them manually.", + "install_devices_router_list_1": "Open the preferences for your router. Usually, you can access it from your browser via a URL (like http://192.168.0.1/ or http://192.168.1.1/). You may be asked to enter the password. If you don't remember it, you can often reset the password by pressing a button on the router itself. Some routers require a specific application, which in that case should be already installed on your computer/phone.", + "install_devices_router_list_2": "Find the DHCP/DNS settings. Look for the DNS letters next to a field which allows two or three sets of numbers, each broken into four groups of one to three digits.", + "install_devices_router_list_3": "Enter your AdGuard Home server addresses there.", "get_started": "Get Started", "next": "Next", "open_dashboard": "Open Dashboard", - "install_saved": "All settings saved" + "install_saved": "All settings saved", + "form_error_password": "Password mismatched" } \ No newline at end of file diff --git a/client/src/actions/install.js b/client/src/actions/install.js index 508aa8da..144c89fc 100644 --- a/client/src/actions/install.js +++ b/client/src/actions/install.js @@ -5,6 +5,7 @@ const apiClient = new Api(); export const addErrorToast = createAction('ADD_ERROR_TOAST'); export const addSuccessToast = createAction('ADD_SUCCESS_TOAST'); +export const removeToast = createAction('REMOVE_TOAST'); export const nextStep = createAction('NEXT_STEP'); export const prevStep = createAction('PREV_STEP'); diff --git a/client/src/install/Setup/Auth.js b/client/src/install/Setup/Auth.js index ce6ca495..d8234d94 100644 --- a/client/src/install/Setup/Auth.js +++ b/client/src/install/Setup/Auth.js @@ -4,8 +4,8 @@ import { Field, reduxForm } from 'redux-form'; import { withNamespaces, Trans } from 'react-i18next'; import flow from 'lodash/flow'; +import i18n from '../../i18n'; import Controls from './Controls'; -import validate from './validate'; import renderField from './renderField'; const required = (value) => { @@ -15,11 +15,21 @@ const required = (value) => { return form_error_required; }; +const validate = (values) => { + const errors = {}; + + if (values.confirm_password !== values.password) { + errors.confirm_password = i18n.t('form_error_password'); + } + + return errors; +}; + const Auth = (props) => { const { handleSubmit, - submitting, pristine, + invalid, t, } = props; @@ -75,7 +85,7 @@ const Auth = (props) => { /> - + ); }; @@ -83,7 +93,7 @@ const Auth = (props) => { Auth.propTypes = { handleSubmit: PropTypes.func.isRequired, pristine: PropTypes.bool.isRequired, - submitting: PropTypes.bool.isRequired, + invalid: PropTypes.bool.isRequired, t: PropTypes.func.isRequired, }; diff --git a/client/src/install/Setup/Controls.js b/client/src/install/Setup/Controls.js index 37f5425b..e74931fa 100644 --- a/client/src/install/Setup/Controls.js +++ b/client/src/install/Setup/Controls.js @@ -45,7 +45,7 @@ class Controls extends Component { @@ -65,7 +65,6 @@ class Controls extends Component { type="button" className="btn btn-success btn-standard btn-lg" onClick={this.props.nextStep} - disabled={this.props.submitting || this.props.pristine} > next @@ -101,6 +100,7 @@ Controls.propTypes = { prevStep: PropTypes.func, pristine: PropTypes.bool, submitting: PropTypes.bool, + invalid: PropTypes.bool, }; const mapStateToProps = (state) => { diff --git a/client/src/install/Setup/Devices.js b/client/src/install/Setup/Devices.js index 389e9aa7..6754c0e9 100644 --- a/client/src/install/Setup/Devices.js +++ b/client/src/install/Setup/Devices.js @@ -18,19 +18,19 @@ const Devices = () => (
- install_decices_router + install_devices_router
- install_decices_router_desc + install_devices_router_desc
  1. - install_decices_router_list_1 + install_devices_router_list_1
  2. - install_decices_router_list_2 + install_devices_router_list_2
  3. - install_decices_router_list_3 + install_devices_router_list_3
diff --git a/client/src/install/Setup/Settings.js b/client/src/install/Setup/Settings.js index 756a46b3..6735463a 100644 --- a/client/src/install/Setup/Settings.js +++ b/client/src/install/Setup/Settings.js @@ -36,6 +36,7 @@ let Settings = (props) => { handleSubmit, interfaceIp, dnsIp, + invalid, } = props; return ( @@ -122,7 +123,7 @@ let Settings = (props) => { install_settings_dns_desc {dnsIp}

- + ); }; @@ -131,8 +132,7 @@ Settings.propTypes = { handleSubmit: PropTypes.func.isRequired, interfaceIp: PropTypes.string.isRequired, dnsIp: PropTypes.string.isRequired, - pristine: PropTypes.bool.isRequired, - submitting: PropTypes.bool.isRequired, + invalid: PropTypes.bool.isRequired, initialValues: PropTypes.object, }; diff --git a/client/src/install/Setup/index.js b/client/src/install/Setup/index.js index ed827edf..a5a5046c 100644 --- a/client/src/install/Setup/index.js +++ b/client/src/install/Setup/index.js @@ -13,6 +13,7 @@ import Devices from './Devices'; import Submit from './Submit'; import Progress from './Progress'; +import Toasts from '../../components/Toasts'; import Footer from '../../components/ui/Footer'; import logo from '../../components/ui/svg/logo.svg'; @@ -85,6 +86,7 @@ class Setup extends Component {