chore: hoist state to context

react-component · Nov 14, 2024 · c178539 · c178539
1 parent c72c25f
commit c178539
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 28 deletions.
diff --git a/src/OptionList.tsx b/src/OptionList.tsx
@@ -45,8 +45,8 @@ const OptionList: React.ForwardRefRenderFunction<ReviseRefOptionListProps> = (_,
     treeExpandAction,
     treeTitleRender,
     onPopupScroll,
-    maxCount,
     displayValues,
+    isOverMaxCount,
   } = React.useContext(TreeSelectContext);
 
   const {
@@ -250,11 +250,6 @@ const OptionList: React.ForwardRefRenderFunction<ReviseRefOptionListProps> = (_,
       preSearchValue !== nextSearchValue && !!(nextSearchValue || nextExcludeSearchExpandedKeys),
   );
 
-  const isOverMaxCount = React.useMemo<boolean>(
-    () => multiple && maxCount !== undefined && displayValues?.length >= maxCount,
-    [multiple, maxCount, displayValues?.length],
-  );
-
   const onActiveChange = (key: Key) => {
     if (isOverMaxCount && !displayValues?.some(v => v.value === key)) {
       return;
@@ -275,7 +270,7 @@ const OptionList: React.ForwardRefRenderFunction<ReviseRefOptionListProps> = (_,
 
   const processedTreeData = React.useMemo(
     () => traverse(memoTreeData),
-    [memoTreeData, isOverMaxCount, displayValues, fieldNames],
+    [memoTreeData, isOverMaxCount],
   );
 
   // ========================== Render ==========================

diff --git a/src/TreeSelect.tsx b/src/TreeSelect.tsx
@@ -613,8 +613,11 @@ const TreeSelect = React.forwardRef<BaseSelectRef, TreeSelectProps>((props, ref)
   });
 
   // ========================== Context ===========================
-  const treeSelectContext = React.useMemo<TreeSelectContextProps>(
-    () => ({
+  const treeSelectContext = React.useMemo<TreeSelectContextProps>(() => {
+    const isOverMaxCount =
+      mergedMultiple && maxCount !== undefined && cachedDisplayValues?.length >= maxCount;
+
+    return {
       virtual,
       dropdownMatchSelectWidth,
       listHeight,
@@ -626,25 +629,25 @@ const TreeSelect = React.forwardRef<BaseSelectRef, TreeSelectProps>((props, ref)
       treeExpandAction,
       treeTitleRender,
       onPopupScroll,
-      maxCount,
       displayValues: cachedDisplayValues,
-    }),
-    [
-      virtual,
-      dropdownMatchSelectWidth,
-      listHeight,
-      listItemHeight,
-      listItemScrollOffset,
-      filteredTreeData,
-      mergedFieldNames,
-      onOptionSelect,
-      treeExpandAction,
-      treeTitleRender,
-      onPopupScroll,
-      maxCount,
-      cachedDisplayValues,
-    ],
-  );
+      isOverMaxCount,
+    };
+  }, [
+    virtual,
+    dropdownMatchSelectWidth,
+    listHeight,
+    listItemHeight,
+    listItemScrollOffset,
+    filteredTreeData,
+    mergedFieldNames,
+    onOptionSelect,
+    treeExpandAction,
+    treeTitleRender,
+    onPopupScroll,
+    maxCount,
+    cachedDisplayValues,
+    mergedMultiple,
+  ]);
 
   // ======================= Legacy Context =======================
   const legacyContext = React.useMemo(

diff --git a/src/TreeSelectContext.ts b/src/TreeSelectContext.ts
@@ -14,8 +14,8 @@ export interface TreeSelectContextProps {
   treeExpandAction?: ExpandAction;
   treeTitleRender?: (node: any) => React.ReactNode;
   onPopupScroll?: React.UIEventHandler<HTMLDivElement>;
-  maxCount?: number;
   displayValues?: LabeledValueType[];
+  isOverMaxCount?: boolean;
 }
 
 const TreeSelectContext = React.createContext<TreeSelectContextProps>(null as any);