Bump typescript from 4.3.2 to 4.4.2 in /graylog2-web-interface/packag…

…es/graylog-web-plugin (#11214)

* Bump typescript in /graylog2-web-interface/packages/graylog-web-plugin

Bumps [typescript](https://github.com/Microsoft/TypeScript) from 4.3.2 to 4.4.2.
- [Release notes](https://github.com/Microsoft/TypeScript/releases)
- [Commits](microsoft/TypeScript@v4.3.2...v4.4.2)

---
updated-dependencies:
- dependency-name: typescript
  dependency-type: direct:production
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>

* Fixing usage of non-overlapping `Rows | Events` type.

Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Dennis Oelkers <dennis@graylog.com>

graylog2-web-interface/packages/graylog-web-plugin/package.json

@@ -59,7 +59,7 @@
     "reflux": "0.2.13",
     "styled-components": "5.2.3",
     "stylelint-config-graylog": "file:../stylelint-config-graylog",
-    "typescript": "4.3.2",
+    "typescript": "4.4.2",
     "webpack": "4.44.2",
     "webpack-cleanup-plugin": "0.5.1",
     "webpack-cli": "3.3.12",

graylog2-web-interface/src/views/components/datatable/DataTable.tsx

@@ -94,7 +94,7 @@ const DataTable = ({ config, currentView, data, fields }: Props) => {
   useEffect(onRenderComplete, [onRenderComplete]);
 
   const { columnPivots, rowPivots, series, rollup } = config;
-  const rows = data.chart || Object.values(data)[0] || [];
+  const rows = (data.chart ?? Object.values(data)[0] ?? []) as Rows;
 
   const rowFieldNames = rowPivots.map<string>((pivot) => pivot.field);
   const columnFieldNames = columnPivots.map((pivot) => pivot.field);
@@ -103,7 +103,7 @@ const DataTable = ({ config, currentView, data, fields }: Props) => {
   const effectiveFields = Immutable.OrderedSet(rowFieldNames.map((field) => ({ field, source: field })))
     .merge(seriesToMerge.map((s) => ({ field: s.effectiveName, source: s.function })));
 
-  const expandedRows = expandRows(rowFieldNames.slice(), columnFieldNames.slice(), rows.filter((r) => r.source === 'leaf') as Array<Leaf>);
+  const expandedRows = expandRows(rowFieldNames.slice(), columnFieldNames.slice(), rows.filter((r): r is Leaf => r.source === 'leaf'));
 
   const actualColumnPivotFields = _extractColumnPivotValues(rows);
 

graylog2-web-interface/src/views/components/visualizations/area/AreaVisualization.tsx

@@ -23,6 +23,7 @@ import type { VisualizationComponentProps } from 'views/components/aggregationbu
 import { AggregationType, AggregationResult } from 'views/components/aggregationbuilder/AggregationBuilderPropTypes';
 import AreaVisualizationConfig from 'views/logic/aggregationbuilder/visualizations/AreaVisualizationConfig';
 import { makeVisualization } from 'views/components/aggregationbuilder/AggregationBuilder';
+import { Rows } from 'views/logic/searchtypes/pivot/PivotHandler';
 
 import type { ChartDefinition } from '../ChartData';
 import XYPlot from '../XYPlot';
@@ -54,7 +55,9 @@ const AreaVisualization = makeVisualization(({ config, data, effectiveTimerange,
     line: { shape: toPlotly(interpolation) },
   }), [interpolation]);
 
-  const chartDataResult = chartData(config, data.chart || Object.values(data)[0], 'scatter', chartGenerator);
+  const rows = (data.chart ?? Object.values(data)[0]) as Rows;
+
+  const chartDataResult = chartData(config, rows, 'scatter', chartGenerator);
   const layout: { shapes?: Shapes } = {};
 
   if (config.eventAnnotation && data.events) {

graylog2-web-interface/src/views/components/visualizations/bar/BarVisualization.tsx

@@ -23,6 +23,7 @@ import EventHandler, { Shapes } from 'views/logic/searchtypes/events/EventHandle
 import { DateType } from 'views/logic/aggregationbuilder/Pivot';
 import { makeVisualization } from 'views/components/aggregationbuilder/AggregationBuilder';
 import BarVisualizationConfig from 'views/logic/aggregationbuilder/visualizations/BarVisualizationConfig';
+import { Rows } from 'views/logic/searchtypes/pivot/PivotHandler';
 
 import { chartData } from '../ChartData';
 import XYPlot from '../XYPlot';
@@ -91,7 +92,7 @@ const BarVisualization = makeVisualization(({ config, data, effectiveTimerange,
 
   const _seriesGenerator = (type, name, labels, values): ChartDefinition => ({ type, name, x: labels, y: values, opacity });
 
-  const rows = data.chart || Object.values(data)[0];
+  const rows = (data.chart ?? Object.values(data)[0]) as Rows;
   const chartDataResult = chartData(config, rows, 'bar', _seriesGenerator);
 
   if (config.eventAnnotation && data.events) {

graylog2-web-interface/src/views/components/visualizations/heatmap/HeatmapVisualization.tsx

@@ -21,6 +21,7 @@ import { AggregationType, AggregationResult } from 'views/components/aggregation
 import type { VisualizationComponentProps } from 'views/components/aggregationbuilder/AggregationBuilder';
 import { makeVisualization } from 'views/components/aggregationbuilder/AggregationBuilder';
 import HeatmapVisualizationConfig from 'views/logic/aggregationbuilder/visualizations/HeatmapVisualizationConfig';
+import { Rows } from 'views/logic/searchtypes/pivot/PivotHandler';
 
 import type { ChartDefinition, ExtractedSeries } from '../ChartData';
 import GenericPlot from '../GenericPlot';
@@ -130,7 +131,7 @@ const _leafSourceMatcher = ({ source }) => source.endsWith('leaf') && source !==
 
 const HeatmapVisualization = makeVisualization(({ config, data }: VisualizationComponentProps) => {
   const visualizationConfig = (config.visualizationConfig || HeatmapVisualizationConfig.empty()) as HeatmapVisualizationConfig;
-  const rows = data.chart || Object.values(data)[0];
+  const rows = (data.chart ?? Object.values(data)[0]) as Rows;
   const heatmapData = chartData(config, rows, 'heatmap', _generateSeries(visualizationConfig), _formatSeries(visualizationConfig), _leafSourceMatcher);
   const layout = _chartLayout(heatmapData);
 

graylog2-web-interface/src/views/components/visualizations/line/LineVisualization.tsx

@@ -23,6 +23,7 @@ import LineVisualizationConfig from 'views/logic/aggregationbuilder/visualizatio
 import toPlotly from 'views/logic/aggregationbuilder/visualizations/Interpolation';
 import EventHandler, { Shapes } from 'views/logic/searchtypes/events/EventHandler';
 import { makeVisualization } from 'views/components/aggregationbuilder/AggregationBuilder';
+import { Rows } from 'views/logic/searchtypes/pivot/PivotHandler';
 
 import type { ChartDefinition } from '../ChartData';
 import { chartData } from '../ChartData';
@@ -53,7 +54,8 @@ const LineVisualization = makeVisualization(({ config, data, effectiveTimerange,
     line: { shape: toPlotly(interpolation) },
   }), [interpolation]);
 
-  const chartDataResult = chartData(config, data.chart || Object.values(data)[0], 'scatter', chartGenerator);
+  const rows = (data.chart ?? Object.values(data)[0]) as Rows;
+  const chartDataResult = chartData(config, rows, 'scatter', chartGenerator);
   const layout: { shapes?: Shapes } = {};
 
   if (config.eventAnnotation && data.events) {

graylog2-web-interface/src/views/components/visualizations/number/NumberVisualization.tsx

@@ -109,7 +109,7 @@ const NumberVisualization = ({ config, currentView, fields, data }: Props) => {
 
   useEffect(onRenderComplete, [onRenderComplete]);
   const { activeQuery } = currentView;
-  const chartRows = data.chart || Object.values(data)[0];
+  const chartRows = (data.chart ?? Object.values(data)[0]) as Rows;
   const trendRows = data.trend;
   const { value } = _extractValueAndField(chartRows);
   const { value: previousValue } = _extractValueAndField(trendRows || []);

graylog2-web-interface/src/views/components/visualizations/pie/PieVisualization.tsx

@@ -21,6 +21,7 @@ import { AggregationType, AggregationResult } from 'views/components/aggregation
 import type { VisualizationComponentProps } from 'views/components/aggregationbuilder/AggregationBuilder';
 import { makeVisualization } from 'views/components/aggregationbuilder/AggregationBuilder';
 import PlotLegend from 'views/components/visualizations/PlotLegend';
+import { Rows } from 'views/logic/searchtypes/pivot/PivotHandler';
 
 import GenericPlot from '../GenericPlot';
 import { chartData } from '../ChartData';
@@ -82,7 +83,8 @@ const labelMapper = (data: Array<{ labels: Array<string>}>) => data.reduce((acc,
 }, []);
 
 const PieVisualization = makeVisualization(({ config, data }: VisualizationComponentProps) => {
-  const transformedData = chartData(config, data.chart || Object.values(data)[0], 'pie', _generateSeries);
+  const rows = (data.chart ?? Object.values(data)[0]) as Rows;
+  const transformedData = chartData(config, rows, 'pie', _generateSeries);
 
   return (
     <PlotLegend config={config} chartData={transformedData} labelMapper={labelMapper} neverHide>

graylog2-web-interface/src/views/components/visualizations/scatter/ScatterVisualization.tsx

@@ -21,6 +21,7 @@ import EventHandler, { Shapes } from 'views/logic/searchtypes/events/EventHandle
 import { AggregationType, AggregationResult } from 'views/components/aggregationbuilder/AggregationBuilderPropTypes';
 import type { VisualizationComponentProps } from 'views/components/aggregationbuilder/AggregationBuilder';
 import { makeVisualization } from 'views/components/aggregationbuilder/AggregationBuilder';
+import { Rows } from 'views/logic/searchtypes/pivot/PivotHandler';
 
 import { chartData } from '../ChartData';
 import XYPlot from '../XYPlot';
@@ -30,7 +31,8 @@ const seriesGenerator = (type, name, labels, values) => ({ type, name, x: labels
 const setChartColor = (chart, colors) => ({ marker: { color: colors.get(chart.name) } });
 
 const ScatterVisualization = makeVisualization(({ config, data, effectiveTimerange, height }: VisualizationComponentProps) => {
-  const chartDataResult = chartData(config, data.chart || Object.values(data)[0], 'scatter', seriesGenerator);
+  const rows = (data.chart ?? Object.values(data)[0]) as Rows;
+  const chartDataResult = chartData(config, rows, 'scatter', seriesGenerator);
   const layout: { shapes?: Shapes } = {};
 
   if (config.eventAnnotation && data.events) {

graylog2-web-interface/yarn.lock

@@ -5153,10 +5153,10 @@ concat-stream@~2.0.0:
     readable-stream "^3.0.2"
     typedarray "^0.0.6"
 
-confusing-browser-globals@^1.0.9:
-  version "1.0.9"
-  resolved "https://registry.yarnpkg.com/confusing-browser-globals/-/confusing-browser-globals-1.0.9.tgz#72bc13b483c0276801681871d4898516f8f54fdd"
-  integrity sha512-KbS1Y0jMtyPgIxjO7ZzMAuUpAKMt1SzCL9fsrKsX6b0zJPTaT0SiSPmewwVZg9UAO83HVIlEhZF84LIjZ0lmAw==
+confusing-browser-globals@^1.0.10:
+  version "1.0.10"
+  resolved "https://registry.yarnpkg.com/confusing-browser-globals/-/confusing-browser-globals-1.0.10.tgz#30d1e7f3d1b882b25ec4933d1d1adac353d20a59"
+  integrity sha512-gNld/3lySHwuhaVluJUKLePYirM3QNCKzVxqAdhJII9/WXKVX5PURzMVJspS1jTslSqjeuG4KMVTSouit5YPHA==
 
 connect-history-api-fallback@^1.4.0, connect-history-api-fallback@^1.6.0:
   version "1.6.0"
@@ -6706,22 +6706,22 @@ escodegen@^2.0.0:
   optionalDependencies:
     source-map "~0.6.1"
 
-eslint-config-airbnb-base@^14.2.0:
-  version "14.2.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-airbnb-base/-/eslint-config-airbnb-base-14.2.0.tgz#fe89c24b3f9dc8008c9c0d0d88c28f95ed65e9c4"
-  integrity sha512-Snswd5oC6nJaevs3nZoLSTvGJBvzTfnBqOIArkf3cbyTyq9UD79wOk8s+RiL6bhca0p/eRO6veczhf6A/7Jy8Q==
+eslint-config-airbnb-base@^14.2.1:
+  version "14.2.1"
+  resolved "https://registry.yarnpkg.com/eslint-config-airbnb-base/-/eslint-config-airbnb-base-14.2.1.tgz#8a2eb38455dc5a312550193b319cdaeef042cd1e"
+  integrity sha512-GOrQyDtVEc1Xy20U7vsB2yAoB4nBlfH5HZJeatRXHleO+OS5Ot+MWij4Dpltw4/DyIkqUfqz1epfhVR5XWWQPA==
   dependencies:
-    confusing-browser-globals "^1.0.9"
-    object.assign "^4.1.0"
+    confusing-browser-globals "^1.0.10"
+    object.assign "^4.1.2"
     object.entries "^1.1.2"
 
-eslint-config-airbnb@18.2.0:
-  version "18.2.0"
-  resolved "https://registry.yarnpkg.com/eslint-config-airbnb/-/eslint-config-airbnb-18.2.0.tgz#8a82168713effce8fc08e10896a63f1235499dcd"
-  integrity sha512-Fz4JIUKkrhO0du2cg5opdyPKQXOI2MvF8KUvN2710nJMT6jaRUpRE2swrJftAjVGL7T1otLM5ieo5RqS1v9Udg==
+eslint-config-airbnb@18.2.1:
+  version "18.2.1"
+  resolved "https://registry.yarnpkg.com/eslint-config-airbnb/-/eslint-config-airbnb-18.2.1.tgz#b7fe2b42f9f8173e825b73c8014b592e449c98d9"
+  integrity sha512-glZNDEZ36VdlZWoxn/bUR1r/sdFKPd1mHPbqUtkctgNG4yT2DLLtJ3D+yCV+jzZCc2V1nBVkmdknOJBZ5Hc0fg==
   dependencies:
-    eslint-config-airbnb-base "^14.2.0"
-    object.assign "^4.1.0"
+    eslint-config-airbnb-base "^14.2.1"
+    object.assign "^4.1.2"
     object.entries "^1.1.2"
 
 "eslint-config-graylog@file:packages/eslint-config-graylog":
@@ -6731,12 +6731,12 @@ eslint-config-airbnb@18.2.0:
     "@typescript-eslint/eslint-plugin" "4.29.1"
     "@typescript-eslint/parser" "4.29.1"
     eslint "7.32.0"
-    eslint-config-airbnb "18.2.0"
+    eslint-config-airbnb "18.2.1"
     eslint-import-resolver-webpack "0.13.1"
     eslint-plugin-compat "3.12.0"
     eslint-plugin-import "2.24.0"
     eslint-plugin-jest "24.4.0"
-    eslint-plugin-jest-dom "3.8.1"
+    eslint-plugin-jest-dom "3.9.0"
     eslint-plugin-jest-formatting "2.0.1"
     eslint-plugin-jsx-a11y "6.4.1"
     eslint-plugin-react "7.24.0"
@@ -6811,10 +6811,10 @@ eslint-plugin-import@2.24.0:
     resolve "^1.20.0"
     tsconfig-paths "^3.9.0"
 
-eslint-plugin-jest-dom@3.8.1:
-  version "3.8.1"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-jest-dom/-/eslint-plugin-jest-dom-3.8.1.tgz#699691b4de4df572bfdf544db37f576d33eddc62"
-  integrity sha512-Qcx1XTy4VCJPOkCynRIzPl67az3pj8EJgfRZYGIBxbp4nxtulWFRzWrkD7nNag5JWAWiujgJS44SCjNyFzl1fQ==
+eslint-plugin-jest-dom@3.9.0:
+  version "3.9.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-jest-dom/-/eslint-plugin-jest-dom-3.9.0.tgz#dab0b532f1a3e2285b74e3a6d32f7ce197975dcf"
+  integrity sha512-Ou3cuAAY9s6pYZv+KKPa9XquSzUAWW2CgE5al7cQ0yew25w/kp5kNsUJgESb3Pj00Y6pzvznepppL2sk7UOQKg==
   dependencies:
     "@babel/runtime" "^7.9.6"
     "@testing-library/dom" "^7.28.1"
@@ -8638,11 +8638,11 @@ graceful-fs@^4.2.4:
     "@babel/preset-env" "7.13.10"
     "@babel/preset-typescript" "7.13.0"
     create-react-class "15.7.0"
-    eslint-config-graylog "file:packages/eslint-config-graylog"
+    eslint-config-graylog "file:../../../../.cache/yarn/v6/npm-graylog-web-plugin-4.2.0-SNAPSHOT-13e91f90-d825-4366-905f-493507ab71aa-1630048752648/node_modules/eslint-config-graylog"
     formik "2.2.6"
     html-webpack-plugin "^4.2.0"
     javascript-natural-sort "0.7.1"
-    jest-preset-graylog "file:packages/jest-preset-graylog"
+    jest-preset-graylog "file:../../../../.cache/yarn/v6/npm-graylog-web-plugin-4.2.0-SNAPSHOT-13e91f90-d825-4366-905f-493507ab71aa-1630048752648/node_modules/jest-preset-graylog"
     jquery "3.5.1"
     moment "2.29.1"
     moment-timezone "0.5.31"
@@ -8656,8 +8656,8 @@ graceful-fs@^4.2.4:
     react-router-dom "5.2.0"
     reflux "0.2.13"
     styled-components "5.2.3"
-    stylelint-config-graylog "file:packages/stylelint-config-graylog"
-    typescript "4.3.2"
+    stylelint-config-graylog "file:../../../../.cache/yarn/v6/npm-graylog-web-plugin-4.2.0-SNAPSHOT-13e91f90-d825-4366-905f-493507ab71aa-1630048752648/node_modules/stylelint-config-graylog"
+    typescript "4.4.2"
     webpack "4.44.2"
     webpack-cleanup-plugin "0.5.1"
     webpack-cli "3.3.12"
@@ -16805,10 +16805,10 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@4.3.2:
-  version "4.3.2"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.3.2.tgz#399ab18aac45802d6f2498de5054fcbbe716a805"
-  integrity sha512-zZ4hShnmnoVnAHpVHWpTcxdv7dWP60S2FsydQLV8V5PbS3FifjWFFRiHSWpDJahly88PRyV5teTSLoq4eG7mKw==
+typescript@4.4.2:
+  version "4.4.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.4.2.tgz#6d618640d430e3569a1dfb44f7d7e600ced3ee86"
+  integrity sha512-gzP+t5W4hdy4c+68bfcv0t400HVJMMd2+H9B7gae1nQlBzCqvrXX+6GL/b3GAgyTH966pzrZ70/fRjwAtZksSQ==
 
 ua-parser-js@^0.7.12:
   version "0.7.22"