[v8.5.x] GraphNG: uPlot 1.6.22 (#51945) (#51991)

* GraphNG: uPlot 1.6.22 (#51945)

(cherry picked from commit fda7f064ad)

# Conflicts:
#	.betterer.results
#	package.json
#	packages/grafana-data/package.json
#	packages/grafana-data/src/transformations/transformers/joinDataFrames.ts
#	packages/grafana-ui/package.json
#	yarn.lock

* revert changes to isLikelyAscendingVector()

* types

package.json

@@ -384,7 +384,7 @@
     "tether-drop": "https://github.com/torkelo/drop",
     "tinycolor2": "1.4.2",
     "tslib": "2.3.1",
-    "uplot": "1.6.19",
+    "uplot": "1.6.22",
     "uuid": "8.3.2",
     "vendor": "link:./public/vendor",
     "visjs-network": "4.25.0",

packages/grafana-data/package.json

@@ -38,7 +38,7 @@
     "regenerator-runtime": "0.13.9",
     "rxjs": "7.5.5",
     "tslib": "2.3.1",
-    "uplot": "1.6.19",
+    "uplot": "1.6.22",
     "xss": "1.0.11"
   },
   "devDependencies": {

packages/grafana-data/src/transformations/transformers/joinDataFrames.ts

@@ -230,7 +230,20 @@ export function outerJoinDataFrames(options: JoinOptions): DataFrame | undefined
 //--------------------------------------------------------------------------------
 
 // Copied from uplot
-export type AlignedData = [number[], ...Array<Array<number | null | undefined>>];
+export type TypedArray =
+  | Int8Array
+  | Uint8Array
+  | Int16Array
+  | Uint16Array
+  | Int32Array
+  | Uint32Array
+  | Uint8ClampedArray
+  | Float32Array
+  | Float64Array;
+
+export type AlignedData =
+  | TypedArray[]
+  | [xValues: number[] | TypedArray, ...yValues: Array<Array<number | null | undefined> | TypedArray>];
 
 // nullModes
 const NULL_REMOVE = 0; // nulls are converted to undefined (e.g. for spanGaps: true)

packages/grafana-ui/package.json

@@ -90,7 +90,7 @@
     "slate-plain-serializer": "0.7.10",
     "tinycolor2": "1.4.2",
     "tslib": "2.3.1",
-    "uplot": "1.6.19",
+    "uplot": "1.6.22",
     "uuid": "8.3.2"
   },
   "devDependencies": {

packages/grafana-ui/src/components/uPlot/Plot.tsx

@@ -102,14 +102,6 @@ export class UPlotChart extends React.Component<PlotProps, UPlotChartState> {
       this.reinitPlot();
     } else if (!sameData(prevProps, this.props)) {
       plot?.setData(this.props.data as AlignedData);
-
-      // this is a uPlot cache-busting hack for bar charts in case x axis labels changed
-      // since the x scale's "range" doesnt change, the axis size doesnt get recomputed, which is where the tick labels are regenerated & cached
-      // the more expensive, more proper/thorough way to do this is to force all axes to recalc: plot?.redraw(false, true);
-      if (plot && typeof this.props.data[0]?.[0] === 'string') {
-        //@ts-ignore
-        plot.axes[0]._values = this.props.data[0];
-      }
     } else if (!sameTimeRange(prevProps, this.props)) {
       plot?.setScale('x', {
         min: this.props.timeRange.from.valueOf(),

public/app/plugins/panel/barchart/bars.ts

@@ -477,7 +477,7 @@ export function getConfig(opts: BarsOptions, theme: GrafanaTheme2) {
 
       // map per-bar colors
       for (let i = 1; i < u.data.length; i++) {
-        let colors = u.data[i].map((value, valueIdx) => {
+        let colors = (u.data[i] as Array<number | null>).map((value, valueIdx) => {
           if (value != null) {
             return getColor!(i, valueIdx, value);
           }

public/app/plugins/panel/histogram/Histogram.tsx

@@ -221,7 +221,7 @@ const prepConfig = (frame: DataFrame, theme: GrafanaTheme2) => {
 };
 
 const preparePlotData = (frame: DataFrame) => {
-  let data: AlignedData = [] as any;
+  let data = [];
 
   for (const field of frame.fields) {
     if (field.name !== histogramFrameBucketMaxFieldName) {
@@ -240,7 +240,7 @@ const preparePlotData = (frame: DataFrame) => {
     }
   }
 
-  return data;
+  return data as AlignedData;
 };
 
 interface State {

public/app/plugins/panel/timeseries/plugins/OutsideRangePlugin.tsx

@@ -20,7 +20,7 @@ export const OutsideRangePlugin: React.FC<ThresholdControlsPluginProps> = ({ con
     });
 
     config.addHook('setScale', (u) => {
-      setTimeValues(u.data?.[0] ?? []);
+      setTimeValues((u.data?.[0] as number[]) ?? []);
       setTimeRange(u.scales['x'] ?? undefined);
     });
   }, [config]);

yarn.lock

@@ -4035,7 +4035,7 @@ __metadata:
     tinycolor2: 1.4.2
     tslib: 2.3.1
     typescript: 4.4.4
-    uplot: 1.6.19
+    uplot: 1.6.22
     xss: 1.0.11
   languageName: unknown
   linkType: soft
@@ -4488,7 +4488,7 @@ __metadata:
     ts-loader: 8.0.11
     tslib: 2.3.1
     typescript: 4.4.4
-    uplot: 1.6.19
+    uplot: 1.6.22
     uuid: 8.3.2
     webpack: 5.70.0
     webpack-filter-warnings-plugin: 1.2.1
@@ -20804,7 +20804,7 @@ __metadata:
     ts-node: 10.7.0
     tslib: 2.3.1
     typescript: 4.4.4
-    uplot: 1.6.19
+    uplot: 1.6.22
     uuid: 8.3.2
     vendor: "link:./public/vendor"
     visjs-network: 4.25.0
@@ -36211,10 +36211,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"uplot@npm:1.6.19":
-  version: 1.6.19
-  resolution: "uplot@npm:1.6.19"
-  checksum: 181cb158e920bc452940292f356eca4a75c31ebabbe9cd40b77e00a3ba90ac76e62e97fde9c06b45c4cd61e34734da0dbefb32c2689bf0d0c24b5d42aa38763a
+"uplot@npm:1.6.22":
+  version: 1.6.22
+  resolution: "uplot@npm:1.6.22"
+  checksum: 4a73835b93fcbd0f62d99c062aac75d0d9d2e3f383fcc77b022abbecd936cd989188ed60da756e45d4306353c6d0e38baaac73b372a674d9e2f47bff7f7d11a6
   languageName: node
   linkType: hard