From 61ccf27d5cc6c5d8d9e0735570879fae0784f685 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?=
 <smith3816@gmail.com>
Date: Fri, 29 Jul 2022 21:46:31 +0800
Subject: [PATCH] fix: Overflow counting process

---
 src/Overflow.tsx | 28 +++++++++++++++++++---------
 1 file changed, 19 insertions(+), 9 deletions(-)

diff --git a/src/Overflow.tsx b/src/Overflow.tsx
index bc6e122..d4c6b83 100644
--- a/src/Overflow.tsx
+++ b/src/Overflow.tsx
@@ -176,11 +176,19 @@ function Overflow<ItemType = any>(
     [renderItem],
   );
 
-  function updateDisplayCount(count: number, notReady?: boolean) {
+  function updateDisplayCount(
+    count: number,
+    suffixFixedStartVal: number,
+    notReady?: boolean,
+  ) {
     // React 18 will sync render even when the value is same in some case.
     // We take `mergedData` as deps which may cause dead loop if it's dynamic generate.
     // ref: https://github.com/ant-design/ant-design/issues/36559
-    if (displayCount === count) {
+    if (
+      displayCount === count &&
+      (suffixFixedStartVal === undefined ||
+        suffixFixedStartVal === suffixFixedStart)
+    ) {
       return;
     }
 
@@ -190,6 +198,10 @@ function Overflow<ItemType = any>(
 
       onVisibleChange?.(count);
     }
+
+    if (suffixFixedStartVal !== undefined) {
+      setSuffixFixedStart(suffixFixedStartVal);
+    }
   }
 
   // ================================= Size =================================
@@ -233,8 +245,7 @@ function Overflow<ItemType = any>(
 
       // When data count change to 0, reset this since not loop will reach
       if (!len) {
-        updateDisplayCount(0);
-        setSuffixFixedStart(null);
+        updateDisplayCount(0, null);
         return;
       }
 
@@ -248,7 +259,7 @@ function Overflow<ItemType = any>(
 
         // Break since data not ready
         if (currentItemWidth === undefined) {
-          updateDisplayCount(i - 1, true);
+          updateDisplayCount(i - 1, undefined, true);
           break;
         }
 
@@ -263,13 +274,12 @@ function Overflow<ItemType = any>(
             totalWidth + getItemWidth(lastIndex)! <= mergedContainerWidth)
         ) {
           // Additional check if match the end
-          updateDisplayCount(lastIndex);
-          setSuffixFixedStart(null);
+          updateDisplayCount(lastIndex, null);
           break;
         } else if (totalWidth + mergedRestWidth > mergedContainerWidth) {
           // Can not hold all the content to show rest
-          updateDisplayCount(i - 1);
-          setSuffixFixedStart(
+          updateDisplayCount(
+            i - 1,
             totalWidth - currentItemWidth - suffixWidth + restWidth,
           );
           break;