add an constant

appsmithorg · Feb 18, 2025 · 9d486cb · 9d486cb
1 parent b9a4589
commit 9d486cb
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/...client/packages/design-system/widgets/src/components/MultiSelect/src/MultiSelectValue.tsx b/...client/packages/design-system/widgets/src/components/MultiSelect/src/MultiSelectValue.tsx
@@ -11,6 +11,7 @@ import { textInputStyles } from "../../Input";
 
 import styles from "./styles.module.css";
 import type { MultiSelectProps } from "./types";
+
 interface MultiSelectValueProps {
   excludeFromTabOrder?: boolean;
   isDisabled?: boolean;
@@ -23,6 +24,8 @@ interface MultiSelectValueProps {
   isInvalid?: boolean;
 }
 
+const MAX_ELLIPSIS_COUNT = 999;
+
 const MultiSelectValue: React.FC<MultiSelectValueProps> = ({
   excludeFromTabOrder,
   isDisabled,
@@ -145,7 +148,9 @@ const MultiSelectValue: React.FC<MultiSelectValueProps> = ({
           </Text>
         ))}
         <Text className={styles.ellipsisText}>
-          {visibleItems < totalItems && <>...+{totalItems - visibleItems}</>}
+          {visibleItems < totalItems && (
+            <>...+{Math.min(totalItems - visibleItems, MAX_ELLIPSIS_COUNT)}</>
+          )}
         </Text>
       </span>
       <span data-input-suffix>

diff --git a/app/client/packages/design-system/widgets/src/components/MultiSelect/src/styles.module.css b/app/client/packages/design-system/widgets/src/components/MultiSelect/src/styles.module.css
@@ -47,6 +47,7 @@
   min-width: 0;
 }
 
+/* we are resevering max for 7 characters which describes "...+999" text */
 .ellipsisText {
   max-width: 7ch;
 }