NETOBSERV-919 Histogram user experience feedback

[jpinsonneau]

• animations for time range change in histogram (check recording below)

• improved tooltips texts
  

• auto refresh disabled while using histogram
  

• pointer loading state
  

• dark overlay in guided tour

• guided tour popover styling
  

• improved no result state + reset action
  

• fix zoom issues (https://issues.redhat.com/browse/NETOBSERV-923)

---

Screencast.from.2023-03-20.11-57-43.webm

[codecov]

Codecov Report

Merging #304 (b7d39a5) into main (61a4f9b) will decrease coverage by 0.31%.
The diff coverage is 22.91%.

@@            Coverage Diff             @@
##             main     #304      +/-   ##
==========================================
- Coverage   58.81%   58.50%   -0.31%     
==========================================
  Files         147      148       +1     
  Lines        6458     6528      +70     
  Branches      769      780      +11     
==========================================
+ Hits         3798     3819      +21     
- Misses       2447     2495      +48     
- Partials      213      214       +1     

Flag	Coverage Δ
uitests	59.07% <22.91%> (-0.43%)	⬇️
unittests	56.84% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
web/src/components/netflow-traffic.tsx	54.00% <0.00%> (-0.25%)	⬇️
web/src/components/metrics/histogram.tsx	16.51% <11.11%> (-0.97%)	⬇️
web/src/utils/highlight-hook.ts	15.21% <15.21%> (ø)
web/src/components/guided-tour/guided-tour.tsx	57.37% <59.09%> (+6.26%)	⬆️

... and 1 file with indirect coverage changes

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

[Amoghrd]

/ok-to-test

[github-actions]

New image: ["quay.io/netobserv/network-observability-console-plugin:cb4e5d2"]. It will expire after two weeks.

[Amoghrd]

Wow the improvements look really cool!
/label qe-approved

[jpinsonneau]

Wow the improvements look really cool! /label qe-approved

Glad you like it ! Thanks for your feedback @Amoghrd @memodi @andrew-ronaldson 🎉

[jotak]

/lgtm

[jpinsonneau]

/approve

[openshift-ci]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: jpinsonneau

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Needs approval from an approver in each of these files:

• OWNERS [jpinsonneau]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment