Refactor reassigned props (#2722)

FormidableLabs · Jan 17, 2024 · 8c1feea · 8c1feea · vercel · Jan 17, 2024
1 parent 0d54830
commit 8c1feea
Show file tree

Hide file tree

Showing 29 changed files with 136 additions and 93 deletions.
diff --git a/packages/victory-area/src/area.tsx b/packages/victory-area/src/area.tsx
@@ -102,8 +102,8 @@ const defaultProps = {
 /**
  * The area primitive used by VictoryArea
  */
-export const Area: React.FC<AreaProps> = (props) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const Area: React.FC<AreaProps> = (initialProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
   const {
     ariaLabel,
     role,

diff --git a/packages/victory-area/src/helper-methods.tsx b/packages/victory-area/src/helper-methods.tsx
@@ -64,9 +64,13 @@ const getCalculatedValues = (props) => {
   return { style, data, scale, domain, origin };
 };
 
-export const getBaseProps = (props, fallbackProps) => {
-  const modifiedProps = Helpers.modifyProps(props, fallbackProps, "area");
-  props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
+export const getBaseProps = (initialProps, fallbackProps) => {
+  const modifiedProps = Helpers.modifyProps(
+    initialProps,
+    fallbackProps,
+    "area",
+  );
+  const props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
   const {
     data,
     domain,

diff --git a/packages/victory-axis/src/helper-methods.tsx b/packages/victory-axis/src/helper-methods.tsx
@@ -543,8 +543,8 @@ const getCalculatedValues = (props) => {
   };
 };
 
-export const getBaseProps = (props, fallbackProps) => {
-  props = Axis.modifyProps(props, fallbackProps);
+export const getBaseProps = (initialProps, fallbackProps) => {
+  const props = Axis.modifyProps(initialProps, fallbackProps);
   const calculatedValues = getCalculatedValues(props);
   const {
     axis,

diff --git a/packages/victory-bar/src/bar.tsx b/packages/victory-bar/src/bar.tsx
@@ -74,10 +74,10 @@ const defaultProps: Partial<BarProps> = {
 
 // eslint-disable-next-line prefer-arrow-callback
 export const Bar = forwardRef<SVGPathElement, BarProps>(function Bar(
-  props,
+  initialProps,
   ref,
 ) {
-  props = evaluateProps({ ...defaultProps, ...props });
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
   const { polar, origin, style, barWidth, cornerRadius } = props;
 
   const path = polar

diff --git a/packages/victory-bar/src/helper-methods.ts b/packages/victory-bar/src/helper-methods.ts
@@ -65,9 +65,9 @@ const getCalculatedValues = (props) => {
   return { style, data, scale, domain, origin };
 };
 
-export const getBaseProps = (props, fallbackProps) => {
-  const modifiedProps = Helpers.modifyProps(props, fallbackProps, "bar");
-  props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
+export const getBaseProps = (initialProps, fallbackProps) => {
+  const modifiedProps = Helpers.modifyProps(initialProps, fallbackProps, "bar");
+  const props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
   const {
     alignment,
     barRatio,

diff --git a/packages/victory-box-plot/src/helper-methods.tsx b/packages/victory-box-plot/src/helper-methods.tsx
@@ -457,9 +457,13 @@ const isDatumOutOfBounds = (datum, domain) => {
   return yOutOfBounds || xOutOfBounds;
 };
 
-export const getBaseProps = (props, fallbackProps) => {
-  const modifiedProps = Helpers.modifyProps(props, fallbackProps, "boxplot");
-  props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
+export const getBaseProps = (initialProps, fallbackProps) => {
+  const modifiedProps = Helpers.modifyProps(
+    initialProps,
+    fallbackProps,
+    "boxplot",
+  );
+  const props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
   const {
     groupComponent,
     width,

diff --git a/packages/victory-candlestick/src/helper-methods.ts b/packages/victory-candlestick/src/helper-methods.ts
@@ -370,9 +370,9 @@ const getLabelProps = (props, text, style, type?: string) => {
 };
 /* eslint-enable max-params*/
 
-export const getBaseProps = (props, fallbackProps) => {
+export const getBaseProps = (initialProps, fallbackProps) => {
   // eslint-disable-line max-statements
-  props = Helpers.modifyProps(props, fallbackProps, "candlestick");
+  const props = Helpers.modifyProps(initialProps, fallbackProps, "candlestick");
   const calculatedValues = getCalculatedValues(props);
   const { data, style, scale, domain, origin, labelOrientation } =
     calculatedValues;

diff --git a/packages/victory-chart/src/helper-methods.tsx b/packages/victory-chart/src/helper-methods.tsx
@@ -82,9 +82,9 @@ function getStyles(props) {
   };
 }
 
-export function getCalculatedProps(props, childComponents) {
-  const style = getStyles(props);
-  props = Helpers.modifyProps(props, fallbackProps, "chart");
+export function getCalculatedProps(initialProps, childComponents) {
+  const style = getStyles(initialProps);
+  const props = Helpers.modifyProps(initialProps, fallbackProps, "chart");
   const { horizontal, polar } = props;
   const allStrings = Wrapper.getStringsFromChildren(props, childComponents);
   const categories = Wrapper.getCategories(props, childComponents, allStrings);

diff --git a/packages/victory-core/src/victory-label/victory-label.tsx b/packages/victory-core/src/victory-label/victory-label.tsx
@@ -121,8 +121,10 @@ const getStyles = (style, props) => {
     };
   }
   const getSingleStyle = (s) => {
-    s = s ? defaults({}, s, defaultStyles) : defaultStyles;
-    const baseStyles = Helpers.evaluateStyle(s, props);
+    const baseStyles = Helpers.evaluateStyle(
+      s ? defaults({}, s, defaultStyles) : defaultStyles,
+      props,
+    );
     return assign({}, baseStyles, { fontSize: getFontSize(baseStyles) });
   };
 
@@ -584,8 +586,8 @@ const defaultProps = {
 export const VictoryLabel: {
   role: string;
   defaultStyles: typeof defaultStyles;
-} & React.FC<VictoryLabelProps> = (props) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+} & React.FC<VictoryLabelProps> = (initialProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
 
   if (props.text === null || props.text === undefined) {
     return null;
@@ -596,7 +598,7 @@ export const VictoryLabel: {
     calculatedProps;
 
   const tspanValues = (text as string[]).map((line, i) => {
-    const currentStyle = getSingleValue(style!, i);
+    const currentStyle = getSingleValue(style, i);
     const capHeightPx = TextSize.convertLengthToPixels(
       `${capHeight}em`,
       currentStyle.fontSize as number,
@@ -607,7 +609,7 @@ export const VictoryLabel: {
       fontSize: currentStyle.fontSize || defaultStyles.fontSize,
       capHeight: capHeightPx,
       text: line,
-      // @ts-expect-error TODO: This looks like a bug:
+      // TODO: This looks like a bug:
       textSize: TextSize.approximateTextSize(line, currentStyle),
       lineHeight: currentLineHeight,
       backgroundPadding: getSingleValue(backgroundPadding, i),

diff --git a/packages/victory-core/src/victory-primitives/arc.tsx b/packages/victory-core/src/victory-primitives/arc.tsx
@@ -68,8 +68,8 @@ const defaultProps = {
   shapeRendering: "auto",
 };
 
-export const Arc = (props: ArcProps) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const Arc = (initialProps: ArcProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
 
   return React.cloneElement(props.pathComponent!, {
     ...props.events,

diff --git a/packages/victory-core/src/victory-primitives/background.tsx b/packages/victory-core/src/victory-primitives/background.tsx
@@ -37,8 +37,8 @@ const defaultProps = {
   shapeRendering: "auto",
 };
 
-export const Background = (props: BackgroundProps) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const Background = (initialProps: BackgroundProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
 
   return props.polar
     ? React.cloneElement(props.circleComponent!, {

diff --git a/packages/victory-core/src/victory-primitives/border.tsx b/packages/victory-core/src/victory-primitives/border.tsx
@@ -43,8 +43,8 @@ const defaultProps = {
   shapeRendering: "auto",
 };
 
-export const Border = (props: BorderProps) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const Border = (initialProps: BorderProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
 
   return React.cloneElement(props.rectComponent!, {
     ...props.events,

diff --git a/packages/victory-core/src/victory-primitives/line-segment.tsx b/packages/victory-core/src/victory-primitives/line-segment.tsx
@@ -44,8 +44,8 @@ const defaultProps = {
   shapeRendering: "auto",
 };
 
-export const LineSegment = (props: LineSegmentProps) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const LineSegment = (initialProps: LineSegmentProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
 
   return React.cloneElement(props.lineComponent!, {
     ...props.events,

diff --git a/packages/victory-core/src/victory-primitives/point.tsx b/packages/victory-core/src/victory-primitives/point.tsx
@@ -72,8 +72,8 @@ const defaultProps = {
   shapeRendering: "auto",
 };
 
-export const Point = (props: PointProps) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const Point = (initialProps: PointProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
   const userProps = UserProps.getSafeUserProps(props);
 
   return React.cloneElement(props.pathComponent!, {

diff --git a/packages/victory-core/src/victory-primitives/whisker.tsx b/packages/victory-core/src/victory-primitives/whisker.tsx
@@ -47,8 +47,8 @@ const defaultProps = {
   shapeRendering: "auto",
 };
 
-export const Whisker = (props: WhiskerProps) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const Whisker = (initialProps: WhiskerProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
   const {
     ariaLabel,
     groupComponent,
@@ -77,17 +77,17 @@ export const Whisker = (props: WhiskerProps) => {
     shapeRendering,
   };
 
-  return React.cloneElement(groupComponent!, {}, [
+  return React.cloneElement(groupComponent, {}, [
     React.cloneElement(
-      lineComponent!,
+      lineComponent,
       assign(
         { key: "major-whisker", "aria-label": ariaLabel },
         baseProps,
         majorWhisker,
       ),
     ),
     React.cloneElement(
-      lineComponent!,
+      lineComponent,
       assign(
         { key: "minor-whisker", "aria-label": ariaLabel },
         baseProps,

diff --git a/packages/victory-errorbar/src/error-bar.tsx b/packages/victory-errorbar/src/error-bar.tsx
@@ -116,8 +116,10 @@ const defaultProps = {
   shapeRendering: "auto",
 };
 
-export const ErrorBar = (props: ErrorBarProps & typeof ErrorBar.default) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const ErrorBar = (
+  initialProps: ErrorBarProps & typeof ErrorBar.default,
+) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
   const { groupComponent } = props;
   const userProps = UserProps.getSafeUserProps(props);
   const { tabIndex, ariaLabel } = props;

diff --git a/packages/victory-errorbar/src/helper-methods.tsx b/packages/victory-errorbar/src/helper-methods.tsx
@@ -165,9 +165,13 @@ const getLabelProps = (dataProps, text, style) => {
   return defaults({}, labelProps, Helpers.omit(tooltipTheme, ["style"]));
 };
 
-export const getBaseProps = (props, fallbackProps) => {
-  const modifiedProps = Helpers.modifyProps(props, fallbackProps, "errorbar");
-  props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
+export const getBaseProps = (initialProps, fallbackProps) => {
+  const modifiedProps = Helpers.modifyProps(
+    initialProps,
+    fallbackProps,
+    "errorbar",
+  );
+  const props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
   const {
     borderWidth,
     data,

diff --git a/packages/victory-group/src/helper-methods.tsx b/packages/victory-group/src/helper-methods.tsx
@@ -12,9 +12,9 @@ const fallbackProps = {
 };
 
 // eslint-disable-next-line max-statements
-export function getCalculatedProps(props, childComponents) {
+export function getCalculatedProps(initialProps, childComponents) {
   const role = "group";
-  props = Helpers.modifyProps(props, fallbackProps, role);
+  const props = Helpers.modifyProps(initialProps, fallbackProps, role);
   const style = Wrapper.getStyle(props.theme, props.style, role);
   const { offset, colorScale, color, polar, horizontal } = props;
   const categories =
@@ -188,24 +188,24 @@ function getDataWithOffset(props, defaultDataset = [], offset) {
   });
 }
 
-export function getChildren(props, childComponents?, calculatedProps?) {
-  props = Helpers.modifyProps(props, fallbackProps, "stack");
-  childComponents = childComponents || React.Children.toArray(props.children);
-  calculatedProps =
-    calculatedProps || getCalculatedProps(props, childComponents);
-  const { datasets } = calculatedProps;
+export function getChildren(initialProps, childComponents?, calculatedProps?) {
+  const props = Helpers.modifyProps(initialProps, fallbackProps, "stack");
+  const children = childComponents || React.Children.toArray(props.children);
+  const newCalculatedProps =
+    calculatedProps || getCalculatedProps(props, children);
+  const { datasets } = newCalculatedProps;
   const { labelComponent, polar } = props;
-  const childProps = getChildProps(props, calculatedProps);
+  const childProps = getChildProps(props, newCalculatedProps);
   const parentName = props.name || "group";
-  return childComponents.map((child, index) => {
+  return children.map((child, index) => {
     const role = child.type && child.type.role;
     const xOffset = polar
-      ? getPolarX0(props, calculatedProps, index, role)
-      : getX0(props, calculatedProps, index, role);
+      ? getPolarX0(props, newCalculatedProps, index, role)
+      : getX0(props, newCalculatedProps, index, role);
     const style =
       role === "voronoi" || role === "tooltip" || role === "label"
         ? child.props.style
-        : Wrapper.getChildStyle(child, index, calculatedProps);
+        : Wrapper.getChildStyle(child, index, newCalculatedProps);
     const labels = props.labels
       ? getLabels(props, datasets, index)
       : child.props.labels;

diff --git a/packages/victory-histogram/src/helper-methods.ts b/packages/victory-histogram/src/helper-methods.ts
@@ -181,9 +181,13 @@ const getCalculatedValues = (props) => {
   return { style, data, scale, domain };
 };
 
-export const getBaseProps = (props, fallbackProps) => {
-  const modifiedProps = Helpers.modifyProps(props, fallbackProps, "histogram");
-  props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
+export const getBaseProps = (initialProps, fallbackProps) => {
+  const modifiedProps = Helpers.modifyProps(
+    initialProps,
+    fallbackProps,
+    "histogram",
+  );
+  const props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
 
   const {
     binSpacing,

diff --git a/packages/victory-legend/src/helper-methods.ts b/packages/victory-legend/src/helper-methods.ts
@@ -205,9 +205,13 @@ const getBorderProps = (props, contentHeight, contentWidth) => {
   return { x, y, height, width, style: assign({ fill: "none" }, style.border) };
 };
 
-export const getDimensions = (props, fallbackProps) => {
-  const modifiedProps = Helpers.modifyProps(props, fallbackProps, "legend");
-  props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
+export const getDimensions = (initialProps, fallbackProps) => {
+  const modifiedProps = Helpers.modifyProps(
+    initialProps,
+    fallbackProps,
+    "legend",
+  );
+  const props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
   const { title, titleOrientation } = props;
   const groupedData = groupData(props);
   const columnWidths = getColumnWidths(props, groupedData);
@@ -228,9 +232,13 @@ export const getDimensions = (props, fallbackProps) => {
   };
 };
 
-export const getBaseProps = (props, fallbackProps) => {
-  const modifiedProps = Helpers.modifyProps(props, fallbackProps, "legend");
-  props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
+export const getBaseProps = (initialProps, fallbackProps) => {
+  const modifiedProps = Helpers.modifyProps(
+    initialProps,
+    fallbackProps,
+    "legend",
+  );
+  const props = assign({}, modifiedProps, getCalculatedValues(modifiedProps));
   const {
     data,
     standalone,
@@ -265,7 +273,7 @@ export const getBaseProps = (props, fallbackProps) => {
   const { height, width } = getDimensions(props, fallbackProps);
   const borderProps = getBorderProps(props, height, width);
   const titleProps = getTitleProps(props, borderProps);
-  const initialProps = {
+  const initialChildProps = {
     parent: {
       data,
       standalone,
@@ -307,5 +315,5 @@ export const getBaseProps = (props, fallbackProps) => {
     childProps[eventKey] = { data: dataProps, labels: labelProps };
 
     return childProps;
-  }, initialProps);
+  }, initialChildProps);
 };
diff --git a/packages/victory-line/src/curve.tsx b/packages/victory-line/src/curve.tsx
@@ -41,8 +41,8 @@ const defaultProps = {
   shapeRendering: "auto",
 };
 
-export const Curve: React.FC<CurveProps> = (props) => {
-  props = evaluateProps({ ...defaultProps, ...props });
+export const Curve: React.FC<CurveProps> = (initialProps) => {
+  const props = evaluateProps({ ...defaultProps, ...initialProps });
   const userProps = UserProps.getSafeUserProps(props);
   const { polar, origin } = props;
   const lineFunction = LineHelpers.getLineFunction(props);