Add no value column on Kanban (#6252)

<img width="1512" alt="image"
src="https://github.com/user-attachments/assets/9fcdd5ca-4329-467c-ada8-4dd5d45be259">

Open questions:
- the Tag component does not match Figma in term of style and API for
"transparent" | "outline". We need to discuss with @Bonapara what is the
desired behavior here
- right now opportunity.stage is not nullable. We need to discuss with
@FelixMalfait and @Bonapara what we want here. I would advocate to make
a it nullable for now until we introduce settings on select fields.
custom select are nullable and it could be confusing for the user

Follow up:
- enhance tests on Tags
- add story to cover the No Value column on record board

packages/twenty-front/src/modules/object-record/utils/computeRecordBoardColumnDefinitionsFromObjectMetadata.ts

@@ -1,7 +1,12 @@
 import { IconPencil } from 'twenty-ui';
 
 import { ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
-import { RecordBoardColumnDefinition } from '@/object-record/record-board/types/RecordBoardColumnDefinition';
+import {
+  RecordBoardColumnDefinition,
+  RecordBoardColumnDefinitionNoValue,
+  RecordBoardColumnDefinitionType,
+  RecordBoardColumnDefinitionValue,
+} from '@/object-record/record-board/types/RecordBoardColumnDefinition';
 import { FieldMetadataType } from '~/generated-metadata/graphql';
 
 export const computeRecordBoardColumnDefinitionsFromObjectMetadata = (
@@ -25,20 +30,42 @@ export const computeRecordBoardColumnDefinitionsFromObjectMetadata = (
     );
   }
 
-  return selectFieldMetadataItem.options.map((selectOption) => ({
-    id: selectOption.id,
-    title: selectOption.label,
-    value: selectOption.value,
-    color: selectOption.color,
-    position: selectOption.position,
-    actions: [
-      {
-        id: 'edit',
-        label: 'Edit from settings',
-        icon: IconPencil,
-        position: 0,
-        callback: navigateToSelectSettings,
-      },
-    ],
-  }));
+  const valueColumns = selectFieldMetadataItem.options.map(
+    (selectOption) =>
+      ({
+        id: selectOption.id,
+        type: RecordBoardColumnDefinitionType.Value,
+        title: selectOption.label,
+        value: selectOption.value,
+        color: selectOption.color,
+        position: selectOption.position,
+        actions: [
+          {
+            id: 'edit',
+            label: 'Edit from settings',
+            icon: IconPencil,
+            position: 0,
+            callback: navigateToSelectSettings,
+          },
+        ],
+      }) satisfies RecordBoardColumnDefinitionValue,
+  );
+
+  const noValueColumn = {
+    id: 'no-value',
+    title: 'No Value',
+    type: RecordBoardColumnDefinitionType.NoValue,
+    value: null,
+    actions: [],
+    position:
+      selectFieldMetadataItem.options
+        .map((option) => option.position)
+        .reduce((a, b) => Math.max(a, b), 0) + 1,
+  } satisfies RecordBoardColumnDefinitionNoValue;
+
+  if (selectFieldMetadataItem.isNullable === true) {
+    return [...valueColumns, noValueColumn];
+  }
+
+  return valueColumns;
 };