[react-cat][1] Tooltips need more time threshold

bitshares / bitshares-ui

Fully featured Graphical User Interface / Reference Wallet for the BitShares Blockchain

https://wallet.bitshares.org

MIT License

518 stars 569 forks source link

[react-cat][1] Tooltips need more time threshold #2809

Open froooze opened 5 years ago

froooze commented 5 years ago

Describe the bug Tooltip pop now up, when I move over by accident with mouse and this is annoying.

To Reproduce Steps to reproduce the behavior:

Go to Exchange/Dashboard
move over a tooltip

Expected behavior Time threshold of 500ms

Desktop (please complete the following information):

OS: MX-Linux, Light client

startailcoon commented 5 years ago

It is indeed quick, and I've reacted the same. Component is this https://ant.design/components/tooltip.

@gibbsfromncis can we change this behavior?

gibbsfromncis commented 5 years ago

@startailcoon I'm not sure how can we change the default behavior but I guess we can change it for separate tooltips. ant component https://ant.design/components/tooltip/ is based on https://github.com/react-component/tooltip. So you can use this prop mouseEnterDelay to define delay before show tooltip

froooze commented 5 years ago

@gibbsfromncis: There is no global setting for time threshold ?

sschiessl-bcp commented 5 years ago

@gibbsfromncis: There is no global setting for time threshold ?

The global setting would be what we add as default in the style-guide. Currently the default is 0.

react-cat commented 5 years ago

@sschiessl-bcp as a solution we can create a HOC for ant tooltip. So behavior will be the next. That HOC would simply pass down all props to ant tooltip and add mouseEnterDelay with delay of 0.5ms in case if that prop wasn't already passed. Pros: we will set a default dealy to all tooltips. Cons: we would have change tooltip imports all over the project and import our tooltip except ant's tooltip in future

sschiessl-bcp commented 5 years ago

That's exactly what we have bitshares-style-guide repo for, please adjust there.

startailcoon commented 5 years ago

Issue moved to bitshares/bitshares-ui-style-guide #11 via ZenHub

startailcoon commented 5 years ago

Issue opened on the style-guide repo. Bounty will be handled by the UI repo though.

react-cat commented 5 years ago

@startailcoon so if I want to take this task, should I go to bitshares-ui-style-guide repo ? Or I can do it here ?

startailcoon commented 5 years ago

@startailcoon so if I want to take this task, should I go to bitshares-ui-style-guide repo ? Or I can do it here ?

Cross repo issues are a little messy. We need an issue in this repo to track the hours. I'll assign you here if you want to work on it.

react-cat commented 5 years ago

@startailcoon So the task here is to create a HOC for Ants tooltip with default delay and an ability to set custom delay and use it all across the project ? If yes, assign me

startailcoon commented 5 years ago

@startailcoon So the task here is to create a HOC for Ants tooltip with default delay and an ability to set custom delay and use it all across the project ? If yes, assign me

Yes. The default delay should be used by all parts of the app.

react-cat commented 5 years ago

@startailcoon I left a comment for you in style-guide repo. Also I noticed that in some places we use Popover for the same purposes as Tooltip. I think we should make same changes to Popover logic.

If you agree, add 0.5 to estimate for this task, or create a new one with estimate 0.5

startailcoon commented 5 years ago

Replied on the style-guide task

react-cat commented 5 years ago

@startailcoon Created a pull request on style guide repo