Skip to content

fix(Indent): Used deep check for props equality in Indent component #961

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

fix(Indent): Used deep check for props equality in Indent component #961

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e2f2076
fix(Indent): Used deep check for props equality in Indent component
mfabek Jul 3, 2025
dd13c43
Merge branch 'master' into fix/indent-shallow-prop-check
afc163 Jul 4, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion src/Indent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import classNames from 'classnames';
import * as React from 'react';
import { areArraysEqual } from './utils/diffUtil';

interface IndentProps {
prefixCls: string;
Expand Down Expand Up @@ -30,4 +31,13 @@ const Indent: React.FC<IndentProps> = ({ prefixCls, level, isStart, isEnd }) =>
);
};

export default React.memo(Indent);
function arePropsEqual(prev: IndentProps, next: IndentProps) {
return (
prev.prefixCls === next.prefixCls &&
prev.level === next.level &&
areArraysEqual(prev.isStart, next.isStart) &&
areArraysEqual(prev.isEnd, next.isEnd)
);
}

export default React.memo(Indent, arePropsEqual);
4 changes: 4 additions & 0 deletions src/utils/diffUtil.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,3 +43,7 @@ export function getExpandRange(shorter: FlattenNode[], longer: FlattenNode[], ke
}
return longer.slice(longerStartIndex + 1);
}

export function areArraysEqual(a: any[], b: any[]) {
return a.length === b.length && a.every((val, i) => val === b[i]);
}
Comment on lines +47 to +49
Copy link

@coderabbitai coderabbitai bot Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

建议改进类型安全性和边界情况处理

当前实现存在以下问题：

  1. 使用 any[] 类型降低了类型安全性
  2. 缺乏对 null 或 undefined 的处理，可能导致运行时错误

建议应用以下改进：

-export function areArraysEqual(a: any[], b: any[]) {
-  return a.length === b.length && a.every((val, i) => val === b[i]);
+export function areArraysEqual<T>(a: T[], b: T[]): boolean {
+  if (a === b) return true;
+  if (!a || !b) return false;
+  return a.length === b.length && a.every((val, i) => val === b[i]);

这样可以：

  • 提供更好的类型安全性
  • 处理相同引用的快速路径
  • 安全处理 null/undefined 情况
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
export function areArraysEqual(a: any[], b: any[]) {
return a.length === b.length && a.every((val, i) => val === b[i]);
}
export function areArraysEqual<T>(a: T[], b: T[]): boolean {
if (a === b) return true;
if (!a || !b) return false;
return a.length === b.length && a.every((val, i) => val === b[i]);
}
🤖 Prompt for AI Agents 
In src/utils/diffUtil.ts around lines 47 to 49, the function areArraysEqual uses
any[] which reduces type safety and does not handle null or undefined inputs,
risking runtime errors. Update the function to use generic types for better type
safety, add a quick check for reference equality to optimize performance, and
include explicit checks to safely handle cases where either input is null or
undefined before proceeding with element-wise comparison.

Loading