From 06594bde8f70c5bbf04b03a3e1c9ad99539787e2 Mon Sep 17 00:00:00 2001 From: Artem Baskal Date: Tue, 8 Sep 2020 13:18:19 +0300 Subject: [PATCH] - client: Add link to 'update_failed' error toast Close #2062 Squashed commit of the following: commit a1a1d4fe74dd414f83477d972bc07062e2c890ab Merge: 9535e109 84938c56 Author: ArtemBaskal Date: Tue Sep 8 10:21:47 2020 +0300 Merge branch 'master' into fix/2062 commit 9535e10934c57c2592df234a030bad183c0086cd Author: ArtemBaskal Date: Mon Sep 7 13:59:57 2020 +0300 Fix translation commit e6f912d1d2793fd008c22b4418681abcc54896d0 Author: ArtemBaskal Date: Mon Sep 7 12:03:45 2020 +0300 - client: Add link to 'update_failed' error toast --- client/package-lock.json | 6 +++--- client/package.json | 2 +- client/src/__locales/en.json | 2 +- client/src/actions/index.js | 12 ++++++++++-- client/src/components/Toasts/Toast.js | 12 +++++++++--- client/src/helpers/constants.js | 13 ++++++++----- client/src/reducers/toasts.js | 2 ++ 7 files changed, 34 insertions(+), 15 deletions(-) diff --git a/client/package-lock.json b/client/package-lock.json index 84c8e186..42cac10f 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -12377,9 +12377,9 @@ } }, "react-i18next": { - "version": "11.4.0", - "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-11.4.0.tgz", - "integrity": "sha512-lyOZSSQkif4H9HnHN3iEKVkryLI+WkdZSEw3VAZzinZLopfYRMHVY5YxCopdkXPLEHs6S5GjKYPh3+j0j336Fg==", + "version": "11.7.2", + "resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-11.7.2.tgz", + "integrity": "sha512-Djj3K3hh5Tecla2CI9rLO3TZBYGMFrGilm0JY4cLofAQONCi5TK6nVmUPKoB59n1ZffgjfgJt6zlbE9aGF6Q0Q==", "requires": { "@babel/runtime": "^7.3.1", "html-parse-stringify2": "2.0.1" diff --git a/client/package.json b/client/package.json index fdc19c9d..4ad8d5eb 100644 --- a/client/package.json +++ b/client/package.json @@ -28,7 +28,7 @@ "react": "^16.13.1", "react-click-outside": "^3.0.1", "react-dom": "^16.13.1", - "react-i18next": "^11.4.0", + "react-i18next": "^11.7.2", "react-modal": "^3.11.2", "react-popper-tooltip": "^2.11.1", "react-redux": "^7.2.0", diff --git a/client/src/__locales/en.json b/client/src/__locales/en.json index 6cce0d91..56b6988f 100644 --- a/client/src/__locales/en.json +++ b/client/src/__locales/en.json @@ -363,7 +363,7 @@ "fix": "Fix", "dns_providers": "Here is a <0>list of known DNS providers to choose from.", "update_now": "Update now", - "update_failed": "Auto-update failed. Please follow the steps to update manually.", + "update_failed": "Auto-update failed. Please follow these steps to update manually.", "processing_update": "Please wait, AdGuard Home is being updated", "clients_title": "Clients", "clients_desc": "Configure devices connected to AdGuard Home", diff --git a/client/src/actions/index.js b/client/src/actions/index.js index d4018bb0..ff039af1 100644 --- a/client/src/actions/index.js +++ b/client/src/actions/index.js @@ -4,9 +4,10 @@ import axios from 'axios'; import endsWith from 'lodash/endsWith'; import escapeRegExp from 'lodash/escapeRegExp'; +import React from 'react'; import { splitByNewLine, sortClients } from '../helpers/helpers'; import { - BLOCK_ACTIONS, CHECK_TIMEOUT, STATUS_RESPONSE, SETTINGS_NAMES, FORM_NAME, + BLOCK_ACTIONS, CHECK_TIMEOUT, STATUS_RESPONSE, SETTINGS_NAMES, FORM_NAME, GETTING_STARTED_LINK, } from '../helpers/constants'; import { areEqualVersions } from '../helpers/version'; import { getTlsStatus } from './encryption'; @@ -184,7 +185,14 @@ export const getUpdate = () => async (dispatch, getState) => { dispatch(getUpdateRequest()); const handleRequestError = () => { - dispatch(addNoticeToast({ error: 'update_failed' })); + const options = { + components: { + a: , + }, + }; + + dispatch(addNoticeToast({ error: 'update_failed', options })); dispatch(getUpdateFailure()); }; diff --git a/client/src/components/Toasts/Toast.js b/client/src/components/Toasts/Toast.js index a4c58aad..4c46078a 100644 --- a/client/src/components/Toasts/Toast.js +++ b/client/src/components/Toasts/Toast.js @@ -1,6 +1,6 @@ import React, { useEffect, useState } from 'react'; import PropTypes from 'prop-types'; -import { useTranslation } from 'react-i18next'; +import { Trans } from 'react-i18next'; import { useDispatch } from 'react-redux'; import { TOAST_TIMEOUTS } from '../../helpers/constants'; import { removeToast } from '../../actions'; @@ -9,8 +9,8 @@ const Toast = ({ id, message, type, + options, }) => { - const { t } = useTranslation(); const dispatch = useDispatch(); const [timerId, setTimerId] = useState(null); @@ -30,7 +30,12 @@ const Toast = ({ return
-

{t(message)}

+

+ +