feat(webapp): update timeline appearance/ flot pugins refactor [WIP]

[pavelpashkovsky]

Short summary on this PR We don't edit any code in Flot anymore. But there are cases when new functionality based on some built-in plugins. In case of upgrading time selection functionality I extracted react-flot/flot/jquery.flot.selection.min into a file ./TimelineChartSelection, where I customised existing logic in accordance with task requirements. It's important to note, that there are 2 types of timeline selection: double and single. All customisation was applied only for single type of selection. Double works in old fashion way (using built-in Flot selection, not plugin-built one).

---

I also extended in a bit TimelineChartWrapper API. Now you can set colors for selection boundaries and overlay. Adding colors depending on color mode is in progress

[github-actions[bot]]

size-limit report 📦

Path	Size	Loading time (3g)	Running time (snapdragon)	Total time
webapp/public/assets/app.js	411.17 KB (+0.27% 🔺)	8.3 s (+0.27% 🔺)	3.5 s (+9.32% 🔺)	11.8 s
webapp/public/assets/app.css	14.01 KB (0%)	281 ms (0%)	0 ms (+100% 🔺)	281 ms
webapp/public/assets/styles.css	9.82 KB (0%)	197 ms (0%)	0 ms (+100% 🔺)	197 ms
packages/pyroscope-flamegraph/dist/index.js	90.13 KB (0%)	1.9 s (0%)	1.3 s (-6.49% 🔽)	3.1 s
packages/pyroscope-flamegraph/dist/index.node.js	81.46 KB (0%)	1.7 s (0%)	680 ms (+27.98% 🔺)	2.4 s
packages/pyroscope-flamegraph/dist/index.css	5.83 KB (0%)	117 ms (0%)	0 ms (+100% 🔺)	117 ms

[codecov[bot]]

Codecov Report

Merging #1323 (227a088) into main (eab8ef9) will not change coverage. The diff coverage is 100.00%.

@@           Coverage Diff           @@
##             main    #1323   +/-   ##
=======================================
  Coverage   67.55%   67.55%           
=======================================
  Files         123      123           
  Lines        4040     4040           
  Branches      930      930           
=======================================
  Hits         2729     2729           
  Misses       1307     1307           
  Partials        4        4           

Impacted Files	Coverage Δ
...javascript/pages/tagExplorer/components/Legend.tsx	100.00% <100.00%> (ø)

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

[pavelpashkovsky]

/create-server

[pavelpashkovsky]

looks like selection boundaries and overlay are too much pale.

[pavelpashkovsky]

@Rperry2174, I can be wrong, but I've just remembered that you wanted to remove these captions several months ago? Should I do this?

[Rperry2174]

@Rperry2174, I can be wrong, but I've just remembered that you wanted to remove these captions several months ago? Should I do this?

Yeah we can remove these now.

Given the current way that the code is structured what would be the steps to be able to control the selection like this?

[eh-am]

/create-server

[Rperry2174]

/create-server

[pavelpashkovsky]

/create-server

[eh-am]

/create-server

[Rperry2174]

/create-server

[eh-am]

/create-server

[Rperry2174]

almost there! I definitely like these selectors better.. Can we make this cursor an "open" hand:

[pavelpashkovsky]

@Rperry2174, I changed resize cursor to open hand, please re/create-server

[Rperry2174]

/create-server