mirrors/AdGuardHome
1
0
Fork 0
mirror of https://github.com/AdguardTeam/AdGuardHome.git synced 2024-11-22 04:55:33 +03:00
Code Issues Projects Releases Packages Wiki Activity

Merge: - client: check touch events for tooltips

Browse source 
Closes #1922

* commit 'ce21514246dfc89f1178d9346769317f1fff4d05':
  - client: check touch events for tooltips
  - client: tooltip show delay
This commit is contained in:
Ildar Kamalov 2020-08-03 15:41:46 +03:00
commit ed76a3cb8b
2 changed files with 14 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
client/src/components/ui/Tooltip.js
View file

@ -5,8 +5,8 @@ import { useTranslation } from 'react-i18next';
import {
HIDE_TOOLTIP_DELAY,
HIDE_TOOLTIP_CLICK_DELAY,
MEDIUM_SCREEN_SIZE,
SHOW_TOOLTIP_DELAY,
} from '../../helpers/constants';
import 'react-popper-tooltip/dist/styles.css';
import './Tooltip.css';
@ -18,22 +18,28 @@ const Tooltip = ({
className = 'tooltip-container',
placement = 'bottom',
trigger = 'hover',
delayShow = SHOW_TOOLTIP_DELAY,
delayHide = HIDE_TOOLTIP_DELAY,
}) => {
const { t } = useTranslation();
let triggerValue = trigger;
let delayValue = delayHide;
const touchEventsAvailable = 'ontouchstart' in window;
if (window.matchMedia(`(max-width: ${MEDIUM_SCREEN_SIZE}px)`).matches) {
let triggerValue = trigger;
let delayHideValue = delayHide;
let delayShowValue = delayShow;
if (window.matchMedia(`(max-width: ${MEDIUM_SCREEN_SIZE}px)`).matches || touchEventsAvailable) {
triggerValue = 'click';
delayValue = HIDE_TOOLTIP_CLICK_DELAY;
delayHideValue = 0;
delayShowValue = 0;
}
return (
<TooltipTrigger
placement={placement}
trigger={triggerValue}
delayHide={delayValue}
delayHide={delayHideValue}
delayShow={delayShowValue}
tooltip={({ tooltipRef, getTooltipProps }) => (
<div
{...getTooltipProps({
@ -71,6 +77,7 @@ Tooltip.propTypes = {
placement: propTypes.string,
trigger: propTypes.string,
delayHide: propTypes.string,
delayShow: propTypes.string,
className: propTypes.string,
triggerClass: propTypes.string,
};

2
client/src/helpers/constants.js
View file

@ -72,7 +72,7 @@ export const CHECK_TIMEOUT = 1000;
export const SUCCESS_TOAST_TIMEOUT = 5000;
export const FAILURE_TOAST_TIMEOUT = 30000;
export const HIDE_TOOLTIP_DELAY = 300;
export const HIDE_TOOLTIP_CLICK_DELAY = 100;
export const SHOW_TOOLTIP_DELAY = 200;
export const MODAL_OPEN_TIMEOUT = 150;
export const UNSAFE_PORTS = [