fix(AttributePlot): fix history bookkeeping and throttle updates

Description:

This MR aims to fix the AttributePlot history display by introducing the TraceHistory class, which stores attribute values either until a specified count limit, or until the time window has been sufficiently filled.

This also introduces the useThrottledData hook, which aims to improve the widget performance to only get the values from the store and rerender the plot on a specified delay interval. This is to avoid triggering updates on every timestamp/value change.

Motivation:

The AttributePlot widget seems to only plot traces that is stored from store, which is 100 by default. The number of data points seems to not be enough for frequently updating attributes that is monitored in a relatively high time window. For instance, a 10 Hz device attribute that is monitored for 20 s should should display 200 points, which doesn't happen currently.

It also seems that the widget rerenders often, and possibly higher than 10 Hz. This is probably because rerenders are triggered on store changes (via the useSelector), which could be a concern for a plot with having two or more attributes. These values seem to update asynchronously, and might be a problem if these have high repetition rate.

Fixes:

• #57 (closed)

Changes:

Plot.tsx

• Added TraceHistory and TraceHistoryContainer
• Added sortedSearch helper to find the index of a value from start/end of the given array
• Deprecated dataAndRange function

AttributePlot.tsx

• Added useThrottledData hook
• Added getAttributeFullName and getTrace helpers
• Deprecated TracesFromAttributeInputs function

(and a bit of types/interface movement.. please feel free to let me know if I did wrong, I am relatively new to TypeScript XD)

Tests included/Docs Updated?

• Included for each change/fix?
• Passing? (Merge will not be approved unless this is checked)
• Docs updated?
• New packages used/requires npm install?
• Toggle added for new features?

Extra details

This is how it looks like for 10 Hz update with rerendering every 500 ms: