From 3ff24658e1b7458b65bc3b244199698524831f85 Mon Sep 17 00:00:00 2001
From: "gitstart-app[bot]"
 <57568882+gitstart-app[bot]@users.noreply.github.com>
Date: Sat, 27 Jul 2024 11:58:51 +0200
Subject: [PATCH] "Name" column is visible on table view but not on kanban view
 (#6427)

This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-4238](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-4238).
This ticket was imported from:
[TWNTY-4238](https://github.com/twentyhq/twenty/issues/4238)

 ---

## Description

- We moved the filter from RecordIndexContainer to RecordBoardCard, this
change will fix the fix issue that the name column was not visible in
Kanban view and will keep the behavior in the Kanban card. The options
dropdown uses the same state that the card uses, but the name is
rendered on the card because, for the name field, the card uses another
data because the render of the name is different from the render of the
other fields, so we removed the filter in the state, but we need to
filter only in the card to avoid duplicated data, we could not find any
other case that this filter is useful for another component
- We updated the type in RecordBoardFieldDefinition to fix TS error in
RecordBoardCard file

### Demo

<https://jam.dev/c/7c9db8e1-9b53-49cf-a44c-0b0fec5b1988>

### Refs

- #4238

Fixes #4238

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
---
 .../record-board-card/components/RecordBoardCard.tsx      | 6 +++++-
 .../record-board/types/RecordBoardFieldDefinition.ts      | 1 +
 .../record-index/components/RecordIndexContainer.tsx      | 8 ++------
 3 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx
index 9b096cac1f..50142c9dab 100644
--- a/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx
@@ -210,6 +210,10 @@ export const RecordBoardCard = () => {
     return null;
   }
 
+  const visibleFieldDefinitionsFiltered = visibleFieldDefinitions.filter(
+    (boardField) => !boardField.isLabelIdentifier,
+  );
+
   return (
     <StyledBoardCardWrapper onContextMenu={handleContextMenu}>
       <RecordValueSetterEffect recordId={recordId} />
@@ -252,7 +256,7 @@ export const RecordBoardCard = () => {
             isOpen={!isCardInCompactMode || !isCompactModeActive}
             initial={false}
           >
-            {visibleFieldDefinitions.map((fieldDefinition) => (
+            {visibleFieldDefinitionsFiltered.map((fieldDefinition) => (
               <PreventSelectOnClickContainer
                 key={fieldDefinition.fieldMetadataId}
               >
diff --git a/packages/twenty-front/src/modules/object-record/record-board/types/RecordBoardFieldDefinition.ts b/packages/twenty-front/src/modules/object-record/record-board/types/RecordBoardFieldDefinition.ts
index 779c732436..b8d80d8c0e 100644
--- a/packages/twenty-front/src/modules/object-record/record-board/types/RecordBoardFieldDefinition.ts
+++ b/packages/twenty-front/src/modules/object-record/record-board/types/RecordBoardFieldDefinition.ts
@@ -6,4 +6,5 @@ export type RecordBoardFieldDefinition<T extends FieldMetadata> =
     viewFieldId?: string;
     position: number;
     isVisible?: boolean;
+    isLabelIdentifier?: boolean;
   };
diff --git a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx
index 3e9f22e040..03c1e33294 100644
--- a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexContainer.tsx
@@ -93,10 +93,6 @@ export const RecordIndexContainer = ({
 
         setTableColumns(newFieldDefinitions);
 
-        const newRecordIndexFieldDefinitions = newFieldDefinitions.filter(
-          (boardField) => !boardField.isLabelIdentifier,
-        );
-
         const existingRecordIndexFieldDefinitions = snapshot
           .getLoadable(recordIndexFieldDefinitionsState)
           .getValue();
@@ -104,10 +100,10 @@ export const RecordIndexContainer = ({
         if (
           !isDeeplyEqual(
             existingRecordIndexFieldDefinitions,
-            newRecordIndexFieldDefinitions,
+            newFieldDefinitions,
           )
         ) {
-          set(recordIndexFieldDefinitionsState, newRecordIndexFieldDefinitions);
+          set(recordIndexFieldDefinitionsState, newFieldDefinitions);
         }
       },
     [columnDefinitions, setTableColumns],