Remove label identifier add button

twentyhq · Oct 9, 2024 · 98133c4 · 98133c4
1 parent 402228d
commit 98133c4
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 13 deletions.
diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTable.tsx
@@ -70,7 +70,9 @@ export const RecordTable = ({
           <RecordTableEmptyState />
         ) : (
           <StyledTable className="entity-table-cell">
-            <RecordTableHeader />
+            <RecordTableHeader
+              objectMetadataNameSingular={objectNameSingular}
+            />
             <RecordTableBody />
           </StyledTable>
         )}

diff --git a/...c/modules/object-record/record-table/record-table-header/components/RecordTableHeader.tsx b/...c/modules/object-record/record-table/record-table-header/components/RecordTableHeader.tsx
@@ -73,7 +73,11 @@ const StyledTableHead = styled.thead<{
   }
 `;
 
-export const RecordTableHeader = () => {
+export const RecordTableHeader = ({
+  objectMetadataNameSingular,
+}: {
+  objectMetadataNameSingular: string;
+}) => {
   const { visibleTableColumnsSelector } = useRecordTableStates();
 
   const visibleTableColumns = useRecoilValue(visibleTableColumnsSelector());
@@ -84,7 +88,11 @@ export const RecordTableHeader = () => {
         <RecordTableHeaderDragDropColumn />
         <RecordTableHeaderCheckboxColumn />
         {visibleTableColumns.map((column) => (
-          <RecordTableHeaderCell key={column.fieldMetadataId} column={column} />
+          <RecordTableHeaderCell
+            key={column.fieldMetadataId}
+            column={column}
+            objectMetadataNameSingular={objectMetadataNameSingular}
+          />
         ))}
         <RecordTableHeaderLastColumn />
       </tr>

diff --git a/...dules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx b/...dules/object-record/record-table/record-table-header/components/RecordTableHeaderCell.tsx
@@ -3,6 +3,8 @@ import { useCallback, useMemo, useState } from 'react';
 import { useRecoilCallback, useRecoilState, useRecoilValue } from 'recoil';
 import { IconPlus } from 'twenty-ui';
 
+import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
+import { isReadOnlyObject } from '@/object-metadata/utils/isReadOnlyObject';
 import { FieldMetadata } from '@/object-record/record-field/types/FieldMetadata';
 import { useRecordTableStates } from '@/object-record/record-table/hooks/internal/useRecordTableStates';
 import { useCreateNewTableRecord } from '@/object-record/record-table/hooks/useCreateNewTableRecords';
@@ -91,11 +93,17 @@ const StyledHeaderIcon = styled.div`
 
 export const RecordTableHeaderCell = ({
   column,
+  objectMetadataNameSingular,
 }: {
   column: ColumnDefinition<FieldMetadata>;
+  objectMetadataNameSingular: string;
 }) => {
   const { resizeFieldOffsetState, tableColumnsState } = useRecordTableStates();
 
+  const { objectMetadataItem } = useObjectMetadataItem({
+    objectNameSingular: objectMetadataNameSingular,
+  });
+
   const [resizeFieldOffset, setResizeFieldOffset] = useRecoilState(
     resizeFieldOffsetState,
   );
@@ -190,6 +198,8 @@ export const RecordTableHeaderCell = ({
     createNewTableRecord();
   };
 
+  const isReadOnly = isReadOnlyObject(objectMetadataItem);
+
   return (
     <StyledColumnHeaderCell
       key={column.fieldMetadataId}
@@ -205,16 +215,18 @@ export const RecordTableHeaderCell = ({
     >
       <StyledColumnHeadContainer>
         <RecordTableColumnHeadWithDropdown column={column} />
-        {(useIsMobile() || iconVisibility) && !!column.isLabelIdentifier && (
-          <StyledHeaderIcon>
-            <LightIconButton
-              Icon={IconPlus}
-              size="small"
-              accent="tertiary"
-              onClick={handlePlusButtonClick}
-            />
-          </StyledHeaderIcon>
-        )}
+        {(useIsMobile() || iconVisibility) &&
+          !!column.isLabelIdentifier &&
+          !isReadOnly && (
+            <StyledHeaderIcon>
+              <LightIconButton
+                Icon={IconPlus}
+                size="small"
+                accent="tertiary"
+                onClick={handlePlusButtonClick}
+              />
+            </StyledHeaderIcon>
+          )}
       </StyledColumnHeadContainer>
       {!disableColumnResize && (
         <StyledResizeHandler