Release 14.0.2 (#577)

datavisyn · Oct 18, 2024 · eee23a1 · eee23a1
2 parents 9269fad + 7acc430
commit eee23a1
Show file tree

Hide file tree

Showing 13 changed files with 954 additions and 932 deletions.
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -10,7 +10,7 @@ on:
 
 jobs:
   release:
-    uses: datavisyn/github-workflows/.github/workflows/release-source.yml@feat-automate-releases-releasenotes
-    secrets: inherit 
+    uses: datavisyn/github-workflows/.github/workflows/release-source.yml@main
+    secrets: inherit
     with:
       release_version: ${{ inputs.release_version }}
diff --git a/.yarn/releases/yarn-4.3.0.cjs b/.yarn/releases/yarn-4.3.0.cjs
diff --git a/.yarn/releases/yarn-4.5.0.cjs b/.yarn/releases/yarn-4.5.0.cjs
diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -1,3 +1,3 @@
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-4.3.0.cjs
+yarnPath: .yarn/releases/yarn-4.5.0.cjs
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "visyn_core",
   "description": "Core repository for datavisyn applications.",
-  "version": "14.0.1",
+  "version": "14.0.2",
   "author": {
     "name": "datavisyn GmbH",
     "email": "[email protected]",
@@ -154,5 +154,5 @@
       }
     }
   },
-  "packageManager": "yarn@4.3.0"
+  "packageManager": "yarn@4.5.0"
 }
diff --git a/src/demo/MainApp.tsx b/src/demo/MainApp.tsx
@@ -43,7 +43,6 @@ export function MainApp() {
     shape: null,
     dragMode: EScatterSelectSettings.RECTANGLE,
     alphaSliderVal: 1,
-    sizeSliderVal: 5,
     showLabels: ELabelingOptions.SELECTED,
     showLabelLimit: 20,
     regressionLineOptions: {

diff --git a/src/vis/scatter/Regression.tsx b/src/vis/scatter/Regression.tsx
@@ -330,11 +330,6 @@ const methods = {
   },
 };
 
-const regressionMethodsMapping = {
-  [ERegressionLineType.LINEAR]: 'linear',
-  [ERegressionLineType.POLYNOMIAL]: 'polynomial',
-};
-
 export const fitRegressionLine = (
   data: { x: number[]; y: number[] },
   method: ERegressionLineType,

diff --git a/src/vis/scatter/ScatterVis.tsx b/src/vis/scatter/ScatterVis.tsx
@@ -1,5 +1,5 @@
 /* eslint-disable react-compiler/react-compiler */
-import { useElementSize, useResizeObserver, useWindowEvent } from '@mantine/hooks';
+import { useElementSize, useWindowEvent } from '@mantine/hooks';
 import { Center, Group, Stack, Switch, Tooltip, ScrollArea } from '@mantine/core';
 import * as React from 'react';
 import cloneDeep from 'lodash/cloneDeep';
@@ -14,8 +14,6 @@ import { EColumnTypes, ENumericalColorScaleType, EScatterSelectSettings, ICommon
 import { BrushOptionButtons } from '../sidebar/BrushOptionButtons';
 import { ERegressionLineType, IInternalScatterConfig, IRegressionResult } from './interfaces';
 import { defaultRegressionLineStyle, fetchColumnData, regressionToAnnotation } from './utils';
-import { getLabelOrUnknown } from '../general/utils';
-import { truncateText } from '../general/layoutUtils';
 import { fitRegressionLine } from './Regression';
 import { useDataPreparation } from './useDataPreparation';
 import { InvalidCols } from '../general/InvalidCols';
@@ -192,7 +190,7 @@ export function ScatterVis({
             },
           ],
           results: [curveFit],
-          annotations: [regressionToAnnotation(curveFit, 3, 'x', 'y')],
+          annotations: config.regressionLineOptions.showStats !== false ? [regressionToAnnotation(curveFit, 3, 'x', 'y')] : [],
         };
       }
     }
@@ -232,9 +230,9 @@ export function ScatterVis({
       const results: IRegressionResult[] = [];
       const plotlyShapes: Partial<PlotlyTypes.Shape>[] = [];
       // eslint-disable-next-line guard-for-in
-      splom.xyPairs.forEach((pair, i) => {
+      splom.xyPairs.forEach((pair) => {
         const curveFit = fitRegressionLine(
-          { x: pair.data.x.filter((x) => x), y: pair.data.y.filter((y) => y) },
+          { x: pair.data.validIndices.map((i) => pair.data.x[i]), y: pair.data.validIndices.map((i) => pair.data.y[i]) },
           config.regressionLineOptions.type,
           pair.xref,
           pair.yref,
@@ -264,6 +262,7 @@ export function ScatterVis({
     config.regressionLineOptions.type,
     config.regressionLineOptions.fitOptions,
     config.regressionLineOptions.lineStyle,
+    config.regressionLineOptions.showStats,
     subplots,
     scatter,
     facet,
@@ -467,7 +466,7 @@ export function ScatterVis({
         </div>
       ) : null}
 
-      <div ref={ref} style={{ gridArea: 'plot', overflow: 'hidden' }}>
+      <div ref={ref} style={{ gridArea: 'plot', overflow: 'hidden', paddingBottom: '0.5rem' }}>
         {status === 'success' && layout ? (
           <PlotlyComponent
             data-testid="ScatterPlotTestId"

diff --git a/src/vis/scatter/interfaces.ts b/src/vis/scatter/interfaces.ts
@@ -13,7 +13,6 @@ export interface IScatterConfig extends BaseVisConfig {
   shape: ColumnInfo | null;
   dragMode: EScatterSelectSettings;
   alphaSliderVal: number;
-  sizeSliderVal: number;
   showLabels: ELabelingOptions;
   showLabelLimit?: number;
   regressionLineOptions?: IRegressionLineOptions;

diff --git a/src/vis/scatter/useData.tsx b/src/vis/scatter/useData.tsx
@@ -62,7 +62,7 @@ export function useData({
   subplots?: ReturnType<typeof useDataPreparation>['subplots'];
   selectedList: string[];
   shapeScale: (val: string) => string;
-  mappingFunction?: (val: string | number) => string;
+  mappingFunction?: (val: string | number | null | undefined) => string;
 }) {
   return React.useMemo<PlotlyTypes.Data[]>(() => {
     if (status !== 'success' || !value) {
@@ -93,8 +93,8 @@ export function useData({
           hovertext: subplots.ids.map((p_id, index) =>
             `${value.idToLabelMapper(p_id)}
             ${(value.resolvedLabelColumnsWithMappedValues ?? []).map((l) => `<br />${columnNameWithDescription(l.info)}: ${getLabelOrUnknown(l.mappedValues.get(p_id))}`)}
-            ${value.colorColumn ? `<br />${columnNameWithDescription(value.colorColumn.info)}: ${getLabelOrUnknown(value.colorColumn.resolvedValues[index].val)}` : ''}
-            ${value.shapeColumn && value.shapeColumn.info.id !== value.colorColumn?.info.id ? `<br />${columnNameWithDescription(value.shapeColumn.info)}: ${getLabelOrUnknown(value.shapeColumn.resolvedValues[index].val)}` : ''}`.trim(),
+            ${value.colorColumn ? `<br />${columnNameWithDescription(value.colorColumn.info)}: ${getLabelOrUnknown(value.colorColumn.resolvedValues[index]?.val)}` : ''}
+            ${value.shapeColumn && value.shapeColumn.info.id !== value.colorColumn?.info.id ? `<br />${columnNameWithDescription(value.shapeColumn.info)}: ${getLabelOrUnknown(value.shapeColumn.resolvedValues[index]?.val)}` : ''}`.trim(),
           ),
           marker: {
             color: value.colorColumn && mappingFunction ? value.colorColumn.resolvedValues.map((v) => mappingFunction(v.val)) : VIS_NEUTRAL_COLOR,
@@ -134,9 +134,9 @@ export function useData({
                 }),
           hovertext: value.validColumns[0].resolvedValues.map((v, i) =>
             `${value.idToLabelMapper(v.id)}
-  ${(value.resolvedLabelColumns ?? []).map((l) => `<br />${columnNameWithDescription(l.info)}: ${getLabelOrUnknown(l.resolvedValues[i].val)}`)}
-  ${value.colorColumn ? `<br />${columnNameWithDescription(value.colorColumn.info)}: ${getLabelOrUnknown(value.colorColumn.resolvedValues[i].val)}` : ''}
-  ${value.shapeColumn && value.shapeColumn.info.id !== value.colorColumn?.info.id ? `<br />${columnNameWithDescription(value.shapeColumn.info)}: ${getLabelOrUnknown(value.shapeColumn.resolvedValues[i].val)}` : ''}`.trim(),
+  ${(value.resolvedLabelColumns ?? []).map((l) => `<br />${columnNameWithDescription(l.info)}: ${getLabelOrUnknown(l.resolvedValues[i]?.val)}`)}
+  ${value.colorColumn ? `<br />${columnNameWithDescription(value.colorColumn.info)}: ${getLabelOrUnknown(value.colorColumn.resolvedValues[i]?.val)}` : ''}
+  ${value.shapeColumn && value.shapeColumn.info.id !== value.colorColumn?.info.id ? `<br />${columnNameWithDescription(value.shapeColumn.info)}: ${getLabelOrUnknown(value.shapeColumn.resolvedValues[i]?.val)}` : ''}`.trim(),
           ),
           marker: {
             textfont: {
@@ -195,7 +195,7 @@ export function useData({
       return plots;
     }
 
-    if (splom) {
+    if (splom && value.validColumns[0]) {
       // SPLOM case
       const plotlyDimensions = value.validColumns.map((col) => ({
         label: col.info.name,
@@ -215,9 +215,9 @@ export function useData({
           dimensions: plotlyDimensions,
           hovertext: value.validColumns[0].resolvedValues.map((v, i) =>
             `${value.idToLabelMapper(v.id)}
-  ${(value.resolvedLabelColumns ?? []).map((l) => `<br />${columnNameWithDescription(l.info)}: ${getLabelOrUnknown(l.resolvedValues[i].val)}`)}
-  ${value.colorColumn ? `<br />${columnNameWithDescription(value.colorColumn.info)}: ${getLabelOrUnknown(value.colorColumn.resolvedValues[i].val)}` : ''}
-  ${value.shapeColumn && value.shapeColumn.info.id !== value.colorColumn?.info.id ? `<br />${columnNameWithDescription(value.shapeColumn.info)}: ${getLabelOrUnknown(value.shapeColumn.resolvedValues[i].val)}` : ''}`.trim(),
+  ${(value.resolvedLabelColumns ?? []).map((l) => `<br />${columnNameWithDescription(l.info)}: ${getLabelOrUnknown(l.resolvedValues[i]?.val)}`)}
+  ${value.colorColumn ? `<br />${columnNameWithDescription(value.colorColumn.info)}: ${getLabelOrUnknown(value.colorColumn.resolvedValues[i]?.val)}` : ''}
+  ${value.shapeColumn && value.shapeColumn.info.id !== value.colorColumn?.info.id ? `<br />${columnNameWithDescription(value.shapeColumn.info)}: ${getLabelOrUnknown(value.shapeColumn.resolvedValues[i]?.val)}` : ''}`.trim(),
           ),
           ...(isEmpty(selectedList) ? {} : { selectedpoints: selectedList.map((idx) => splom.idToIndex.get(idx)) }),
           marker: {

diff --git a/src/vis/scatter/utils.ts b/src/vis/scatter/utils.ts
@@ -33,7 +33,6 @@ export const defaultConfig: IScatterConfig = {
   shape: null,
   dragMode: EScatterSelectSettings.RECTANGLE,
   alphaSliderVal: 0.5,
-  sizeSliderVal: 8,
   subplots: undefined,
   showLabels: ELabelingOptions.NEVER,
   showLabelLimit: 50,
@@ -181,7 +180,7 @@ export function regressionToAnnotation(r: IRegressionResult, precision: number,
     xanchor: 'left',
     yanchor: 'top',
     bgcolor: 'rgba(255, 255, 255, 0.8)',
-    xshift: 5,
+    xshift: 10,
     yshift: -5,
   };
 }
diff --git a/src/vis/stories/Vis/Scatter/ScatterIris.stories.tsx b/src/vis/stories/Vis/Scatter/ScatterIris.stories.tsx
@@ -50,7 +50,6 @@ Basic.args = {
     ],
     color: null,
     facets: null,
-    sizeSliderVal: 8,
     numColorScaleType: ENumericalColorScaleType.SEQUENTIAL,
     shape: null,
     dragMode: EScatterSelectSettings.RECTANGLE,
@@ -152,7 +151,6 @@ ControlledSubplots.args = {
       },
     ],
     facets: null,
-    sizeSliderVal: 8,
     numColorScaleType: ENumericalColorScaleType.SEQUENTIAL,
     shape: null,
     dragMode: EScatterSelectSettings.RECTANGLE,

diff --git a/src/vis/vishooks/hooks/useChart.ts b/src/vis/vishooks/hooks/useChart.ts
@@ -1,6 +1,6 @@
 /* eslint-disable react-compiler/react-compiler */
 import * as React from 'react';
-import { useSetState } from '@mantine/hooks';
+import { useDebouncedCallback, useSetState } from '@mantine/hooks';
 import type { ECElementEvent, ECharts, ComposeOption } from 'echarts/core';
 import { use, init } from 'echarts/core';
 import { BarChart, LineChart } from 'echarts/charts';
@@ -85,6 +85,11 @@ export function useChart({
     instance: null as ECharts | null,
   });
 
+  const debouncedResizeObserver = useDebouncedCallback((entries: ResizeObserverEntry[]) => {
+    const newDimensions = entries[0]?.contentRect;
+    setState({ width: newDimensions?.width, height: newDimensions?.height });
+  }, 250);
+
   const mouseEventsRef = React.useRef(mouseEvents);
   mouseEventsRef.current = mouseEvents;
 
@@ -132,10 +137,7 @@ export function useChart({
 
   const { ref, setRef } = useSetRef<HTMLElement>({
     register: (element) => {
-      const observer = new ResizeObserver((entries) => {
-        const newDimensions = entries[0]?.contentRect;
-        setState({ width: newDimensions?.width, height: newDimensions?.height });
-      });
+      const observer = new ResizeObserver(debouncedResizeObserver);
       // create the instance
       const instance = init(element);
       // Save the mouse events