- client: Add link to 'update_failed' error toast

Close #2062

Squashed commit of the following:

commit a1a1d4fe74dd414f83477d972bc07062e2c890ab
Merge: 9535e109 84938c56
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Tue Sep 8 10:21:47 2020 +0300

    Merge branch 'master' into fix/2062

commit 9535e10934c57c2592df234a030bad183c0086cd
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Mon Sep 7 13:59:57 2020 +0300

    Fix translation

commit e6f912d1d2793fd008c22b4418681abcc54896d0
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Mon Sep 7 12:03:45 2020 +0300

    - client: Add link to 'update_failed' error toast
This commit is contained in:
Artem Baskal
2020-09-08 13:18:19 +03:00
parent 84938c5603
commit 06594bde8f
7 changed files with 34 additions and 15 deletions

View File

@@ -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 <div className={`toast toast--${type}`}
onMouseOver={clearRemoveToastTimeout}
onMouseOut={setRemoveToastTimeout}>
<p className="toast__content">{t(message)}</p>
<p className="toast__content">
<Trans
i18nKey={message}
{...options}
/>
</p>
<button className="toast__dismiss" onClick={removeCurrentToast}>
<svg stroke="#fff" fill="none" width="20" height="20" strokeWidth="2"
viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
@@ -45,6 +50,7 @@ Toast.propTypes = {
id: PropTypes.string.isRequired,
message: PropTypes.string.isRequired,
type: PropTypes.string.isRequired,
options: PropTypes.object,
};
export default Toast;