From 7fcf5012f731f03eeb8d5a893072577088b94b18 Mon Sep 17 00:00:00 2001
From: aliraza556 <alirazaakhtar1122@gmail.com>
Date: Fri, 1 Nov 2024 16:07:41 +0500
Subject: [PATCH] fix(filtering): node Types Rendering with Default Limit of 4
 Rows

---
 .../App/SideBar/FilterSearch/NodeTypes/index.tsx          | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/App/SideBar/FilterSearch/NodeTypes/index.tsx b/src/components/App/SideBar/FilterSearch/NodeTypes/index.tsx
index 1e866df0f..a2e036aea 100644
--- a/src/components/App/SideBar/FilterSearch/NodeTypes/index.tsx
+++ b/src/components/App/SideBar/FilterSearch/NodeTypes/index.tsx
@@ -15,7 +15,11 @@ type Props = {
 export const NodeTypes = ({ handleSchemaTypeClick, selectedTypes, schemaAll }: Props) => {
   const [showAllSchemas, setShowAllSchemas] = useState(false)
 
-  const uniqueSchemas = (showAllSchemas ? schemaAll : schemaAll.slice(0, 4)).filter(
+  const schemasPerRow = 3
+  const MAX_ROWS = 4
+  const maxVisibleSchemas = schemasPerRow * MAX_ROWS
+
+  const uniqueSchemas = (showAllSchemas ? schemaAll : schemaAll.slice(0, maxVisibleSchemas)).filter(
     (schema, index, self) => index === self.findIndex((s) => s.type === schema.type),
   )
 
@@ -40,7 +44,7 @@ export const NodeTypes = ({ handleSchemaTypeClick, selectedTypes, schemaAll }: P
             </SchemaType>
           ))}
         </SchemaTypeWrapper>
-        {!showAllSchemas && schemaAll.length > 4 && (
+        {!showAllSchemas && schemaAll.length > maxVisibleSchemas && (
           <ViewMoreButton onClick={() => setShowAllSchemas(true)}>
             <PlusIconWrapper>
               <PlusIcon /> View More