From 7e95ce9136fe5df88bde3238cfd7cb914df30139 Mon Sep 17 00:00:00 2001 From: Ildar Kamalov Date: Tue, 22 Jan 2019 17:17:33 +0300 Subject: [PATCH] Add device configuration instruction --- client/src/__locales/en.json | 19 +++++++++ client/src/actions/index.js | 55 +++++++++++++------------- client/src/components/Filters/index.js | 2 +- client/src/components/ui/Tab.js | 2 +- client/src/components/ui/Tabs.css | 9 +++++ client/src/components/ui/Tabs.js | 2 +- client/src/helpers/constants.js | 7 ++++ client/src/install/Setup/Devices.js | 53 ++++++++++++++++++------- 8 files changed, 105 insertions(+), 44 deletions(-) diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index 7bc64008..6c0f6b44 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -184,6 +184,25 @@ "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.", + "install_devices_windows_list_1": "Open Control Panel through Start menu or Windows search.", + "install_devices_windows_list_2": "Go to Network and Internet category and then to Network and Sharing Center.", + "install_devices_windows_list_3": "On the left side of the screen find Change adapter settings and click on it.", + "install_devices_windows_list_4": "Select your active connection, right-click on it and choose Properties.", + "install_devices_windows_list_5": "Find Internet Protocol Version 4 (TCP/IP) in the list, select it and then click on Properties again.", + "install_devices_windows_list_6": "Choose Use the following DNS server addresses and enter your AdGuard Home server addresses.", + "install_devices_macos_list_1": "Click on Apple icon and go to System Preferences.", + "install_devices_macos_list_2": "Click on Network.", + "install_devices_macos_list_3": "Select the first connection in your list and click Advanced.", + "install_devices_macos_list_4": "Select the DNS tab and enter your AdGuard Home server addresses.", + "install_devices_android_list_1": "From the Android Menu home screen, tap Settings.", + "install_devices_android_list_2": "Tap Wi-Fi on the menu. The screen listing all of the available networks will be shown (it is impossible to set custom DNS for mobile connection).", + "install_devices_android_list_3": "Long press the network you're connected to, and tap Modify Network.", + "install_devices_android_list_4": "On some devices, you may need to check the box for Advanced to see further settings. To adjust your Android DNS settings, you will need to switch the IP settings from DHCP to Static.", + "install_devices_android_list_5": "Change set DNS 1 and DNS 2 values to your AdGuard Home server addresses.", + "install_devices_ios_list_1": "From the home screen, tap Settings.", + "install_devices_ios_list_2": "Choose Wi-Fi in the left menu (it is impossible to configure DNS for mobile networks).", + "install_devices_ios_list_3": "Tap on the name of the currently active network.", + "install_devices_ios_list_4": "In the DNS field enter your AdGuard Home server addresses.", "get_started": "Get Started", "next": "Next", "open_dashboard": "Open Dashboard", diff --git a/client/src/actions/index.js b/client/src/actions/index.js index e6a2a6c8..aa7f539c 100644 --- a/client/src/actions/index.js +++ b/client/src/actions/index.js @@ -4,6 +4,7 @@ import { t } from 'i18next'; import { showLoading, hideLoading } from 'react-redux-loading-bar'; import { normalizeHistory, normalizeFilteringStatus, normalizeLogs } from '../helpers/helpers'; +import { SETTINGS_NAMES } from '../helpers/constants'; import Api from '../api/Api'; const apiClient = new Api(); @@ -18,9 +19,8 @@ export const showSettingsFailure = createAction('SETTINGS_FAILURE_SHOW'); export const toggleSetting = (settingKey, status) => async (dispatch) => { let successMessage = ''; try { - // TODO move setting keys to constants switch (settingKey) { - case 'filtering': + case SETTINGS_NAMES.filtering: if (status) { successMessage = 'disabled_filtering_toast'; await apiClient.disableFiltering(); @@ -30,7 +30,7 @@ export const toggleSetting = (settingKey, status) => async (dispatch) => { } dispatch(toggleSettingStatus({ settingKey })); break; - case 'safebrowsing': + case SETTINGS_NAMES.safebrowsing: if (status) { successMessage = 'disabled_safe_browsing_toast'; await apiClient.disableSafebrowsing(); @@ -40,7 +40,7 @@ export const toggleSetting = (settingKey, status) => async (dispatch) => { } dispatch(toggleSettingStatus({ settingKey })); break; - case 'parental': + case SETTINGS_NAMES.parental: if (status) { successMessage = 'disabled_parental_toast'; await apiClient.disableParentalControl(); @@ -50,7 +50,7 @@ export const toggleSetting = (settingKey, status) => async (dispatch) => { } dispatch(toggleSettingStatus({ settingKey })); break; - case 'safesearch': + case SETTINGS_NAMES.safesearch: if (status) { successMessage = 'disabled_safe_search_toast'; await apiClient.disableSafesearch(); @@ -434,7 +434,6 @@ export const downloadQueryLogRequest = createAction('DOWNLOAD_QUERY_LOG_REQUEST' export const downloadQueryLogFailure = createAction('DOWNLOAD_QUERY_LOG_FAILURE'); export const downloadQueryLogSuccess = createAction('DOWNLOAD_QUERY_LOG_SUCCESS'); -// TODO create some common flasher with all server errors export const downloadQueryLog = () => async (dispatch) => { let data; dispatch(downloadQueryLogRequest()); @@ -575,34 +574,36 @@ export const setDhcpConfigFailure = createAction('SET_DHCP_CONFIG_FAILURE'); // TODO rewrite findActiveDhcp part export const setDhcpConfig = config => async (dispatch) => { dispatch(setDhcpConfigRequest()); - try { - if (config.interface_name) { - dispatch(findActiveDhcpRequest()); - try { - const activeDhcp = await apiClient.findActiveDhcp(config.interface_name); - dispatch(findActiveDhcpSuccess(activeDhcp)); - if (!activeDhcp.found) { - await apiClient.setDhcpConfig(config); - dispatch(addSuccessToast('dhcp_config_saved')); - dispatch(setDhcpConfigSuccess()); - dispatch(getDhcpStatus()); - } else { - dispatch(addErrorToast({ error: 'dhcp_found' })); - } - } catch (error) { - dispatch(addErrorToast({ error })); - dispatch(findActiveDhcpFailure()); + if (config.interface_name) { + dispatch(findActiveDhcpRequest()); + try { + const activeDhcp = await apiClient.findActiveDhcp(config.interface_name); + dispatch(findActiveDhcpSuccess(activeDhcp)); + + if (!activeDhcp.found) { + await apiClient.setDhcpConfig(config); + dispatch(addSuccessToast('dhcp_config_saved')); + dispatch(setDhcpConfigSuccess()); + dispatch(getDhcpStatus()); + } else { + dispatch(addErrorToast({ error: 'dhcp_found' })); } - } else { + } catch (error) { + dispatch(addErrorToast({ error })); + dispatch(findActiveDhcpFailure()); + dispatch(setDhcpConfigFailure()); + } + } else { + try { await apiClient.setDhcpConfig(config); dispatch(addSuccessToast('dhcp_config_saved')); dispatch(setDhcpConfigSuccess()); dispatch(getDhcpStatus()); + } catch (error) { + dispatch(addErrorToast({ error })); + dispatch(setDhcpConfigFailure()); } - } catch (error) { - dispatch(addErrorToast({ error })); - dispatch(setDhcpConfigFailure()); } }; diff --git a/client/src/components/Filters/index.js b/client/src/components/Filters/index.js index 6b749e83..daf5b6e9 100644 --- a/client/src/components/Filters/index.js +++ b/client/src/components/Filters/index.js @@ -84,7 +84,7 @@ class Filters extends Component { columns={this.columns} showPagination={true} defaultPageSize={10} - minRows={4} // TODO find out what to show if rules.length is 0 + minRows={4} // Text previousText={ t('previous_btn') } nextText={ t('next_btn') } diff --git a/client/src/components/ui/Tab.js b/client/src/components/ui/Tab.js index b97e4f60..1498e3ab 100644 --- a/client/src/components/ui/Tab.js +++ b/client/src/components/ui/Tab.js @@ -23,7 +23,7 @@ class Tab extends Component { className={tabClass} onClick={this.handleClick} > - + {label} diff --git a/client/src/components/ui/Tabs.css b/client/src/components/ui/Tabs.css index 141b2a7f..9c7c567f 100644 --- a/client/src/components/ui/Tabs.css +++ b/client/src/components/ui/Tabs.css @@ -40,3 +40,12 @@ margin-bottom: 6px; fill: #4a4a4a; } + +.tab__text { + line-height: 1.7; +} + +.tab__text li, +.tab__text p { + margin-bottom: 5px; +} diff --git a/client/src/components/ui/Tabs.js b/client/src/components/ui/Tabs.js index 38546b98..f376e825 100644 --- a/client/src/components/ui/Tabs.js +++ b/client/src/components/ui/Tabs.js @@ -31,9 +31,9 @@ class Tabs extends Component { return ( ); diff --git a/client/src/helpers/constants.js b/client/src/helpers/constants.js index 21e5a961..3460c452 100644 --- a/client/src/helpers/constants.js +++ b/client/src/helpers/constants.js @@ -63,3 +63,10 @@ export const LANGUAGES = [ export const INSTALL_FIRST_STEP = 1; export const INSTALL_TOTAL_STEPS = 5; + +export const SETTINGS_NAMES = { + filtering: 'filtering', + safebrowsing: 'safebrowsing', + parental: 'parental', + safesearch: 'safesearch', +}; diff --git a/client/src/install/Setup/Devices.js b/client/src/install/Setup/Devices.js index 6754c0e9..0a13b095 100644 --- a/client/src/install/Setup/Devices.js +++ b/client/src/install/Setup/Devices.js @@ -21,17 +21,11 @@ const Devices = () => ( install_devices_router
- install_devices_router_desc +

install_devices_router_desc

    -
  1. - install_devices_router_list_1 -
    2. -
  2. - install_devices_router_list_2 -
    3. -
  3. - install_devices_router_list_3 -
    4. +
  4. install_devices_router_list_1
    5. +
  5. install_devices_router_list_2
    6. +
  6. install_devices_router_list_3
@@ -39,25 +33,56 @@ const Devices = () => (
Windows
-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti sapiente magnam autem excepturi repellendus, voluptatem officia sint quas nulla maiores velit odit dolore commodi quia reprehenderit vero repudiandae adipisci aliquam.
+
+
    +
  1. install_devices_windows_list_1
    2. +
  2. install_devices_windows_list_2
    3. +
  3. install_devices_windows_list_3
    4. +
  4. install_devices_windows_list_4
    5. +
  5. install_devices_windows_list_5
    6. +
  6. install_devices_windows_list_6
    7. +
+
macOS
-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti sapiente magnam autem excepturi repellendus, voluptatem officia sint quas nulla maiores velit odit dolore commodi quia reprehenderit vero repudiandae adipisci aliquam.
+
+
    +
  1. install_devices_macos_list_1
    2. +
  2. install_devices_macos_list_2
    3. +
  3. install_devices_macos_list_3
    4. +
  4. install_devices_macos_list_4
    5. +
+
Android
-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti sapiente magnam autem excepturi repellendus, voluptatem officia sint quas nulla maiores velit odit dolore commodi quia reprehenderit vero repudiandae adipisci aliquam.
+
+
    +
  1. install_devices_android_list_1
    2. +
  2. install_devices_android_list_2
    3. +
  3. install_devices_android_list_3
    4. +
  4. install_devices_android_list_4
    5. +
  5. install_devices_android_list_5
    6. +
+
iOS
-
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti sapiente magnam autem excepturi repellendus, voluptatem officia sint quas nulla maiores velit odit dolore commodi quia reprehenderit vero repudiandae adipisci aliquam.
+
+
    +
  1. install_devices_ios_list_1
    2. +
  2. install_devices_ios_list_2
    3. +
  3. install_devices_ios_list_3
    4. +
  4. install_devices_ios_list_4
    5. +
+