From 56dda7c1356cc3ecb7b02f3a89cb84614ec97ac2 Mon Sep 17 00:00:00 2001
From: nitin <142569587+ehconitin@users.noreply.github.com>
Date: Thu, 14 Aug 2025 17:42:13 +0530
Subject: [PATCH] [fast follows] - improve rest api documentation, fix add new
 button being considered in drag, fix grip color (#13709)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

as per title

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
---
 .../components/RecordTableAddNew.tsx          | 11 ++------
 .../RecordTableNoRecordGroupRows.tsx          |  2 +-
 .../components/RecordTableRecordGroupRows.tsx |  2 +-
 .../components/RecordTableCellGrip.tsx        |  3 +++
 .../components/RecordTableActionRow.tsx       | 27 +++++++++----------
 .../RecordTableRecordGroupSectionAddNew.tsx   |  8 ------
 .../RecordTableRecordGroupSectionLoadMore.tsx |  8 ------
 .../open-api/utils/components.utils.ts        | 14 ++++++++--
 8 files changed, 32 insertions(+), 43 deletions(-)

diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableAddNew.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableAddNew.tsx
index 5f7fb69eac..ba4f500f54 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableAddNew.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableAddNew.tsx
@@ -1,5 +1,4 @@
 import { useObjectPermissionsForObject } from '@/object-record/hooks/useObjectPermissionsForObject';
-import { recordIndexAllRecordIdsComponentSelector } from '@/object-record/record-index/states/selectors/recordIndexAllRecordIdsComponentSelector';
 import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
 import { useCreateNewIndexRecord } from '@/object-record/record-table/hooks/useCreateNewIndexRecord';
 import { RecordTableActionRow } from '@/object-record/record-table/record-table-row/components/RecordTableActionRow';
@@ -11,10 +10,6 @@ import { IconPlus } from 'twenty-ui/display';
 export const RecordTableAddNew = () => {
   const { objectMetadataItem } = useRecordTableContextOrThrow();
 
-  const recordIds = useRecoilComponentValue(
-    recordIndexAllRecordIdsComponentSelector,
-  );
-
   const hasRecordTableFetchedAllRecords = useRecoilComponentValue(
     hasRecordTableFetchedAllRecordsComponentState,
   );
@@ -35,15 +30,13 @@ export const RecordTableAddNew = () => {
 
   return (
     <RecordTableActionRow
-      draggableId="add-new-record"
-      draggableIndex={recordIds.length + 1}
-      LeftIcon={IconPlus}
-      text={t`Add new`}
       onClick={() => {
         createNewIndexRecord({
           position: 'last',
         });
       }}
+      LeftIcon={IconPlus}
+      text={t`Add New`}
     />
   );
 };
diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableNoRecordGroupRows.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableNoRecordGroupRows.tsx
index 47d06e6293..aede264210 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableNoRecordGroupRows.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableNoRecordGroupRows.tsx
@@ -28,9 +28,9 @@ export const RecordTableNoRecordGroupRows = () => {
           />
         );
       })}
-      <RecordTableAddNew />
       <RecordTableBodyFetchMoreLoader />
       <RecordTableBodyDroppablePlaceholder />
+      <RecordTableAddNew />
       {!isRecordTableInitialLoading && allRecordIds.length > 0 && (
         <RecordTableAggregateFooter />
       )}
diff --git a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx
index db5eb79cfe..f943c1843c 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/components/RecordTableRecordGroupRows.tsx
@@ -56,9 +56,9 @@ export const RecordTableRecordGroupRows = () => {
           />
         );
       })}
+      <RecordTableBodyDroppablePlaceholder />
       <RecordTableRecordGroupSectionLoadMore />
       <RecordTableRecordGroupSectionAddNew />
-      <RecordTableBodyDroppablePlaceholder />
       <RecordTableAggregateFooter
         key={currentRecordGroupId}
         currentRecordGroupId={currentRecordGroupId}
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellGrip.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellGrip.tsx
index 4a9e76503a..a7da7822b6 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellGrip.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellGrip.tsx
@@ -24,6 +24,9 @@ const StyledContainer = styled.div`
 const StyledIconWrapper = styled.div<{ isDragging: boolean }>`
   opacity: ${({ isDragging }) => (isDragging ? 1 : 0)};
   transition: opacity 0.1s;
+  svg path {
+    fill: ${({ theme }) => theme.border.color.strong};
+  }
 `;
 
 export const RecordTableCellGrip = () => {
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableActionRow.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableActionRow.tsx
index 1f2f9fdb93..63e3d04f2b 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableActionRow.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-row/components/RecordTableActionRow.tsx
@@ -1,22 +1,31 @@
 import styled from '@emotion/styled';
 
+import { TABLE_Z_INDEX } from '@/object-record/record-table/constants/TableZIndex';
 import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
 import { RecordTableTd } from '@/object-record/record-table/record-table-cell/components/RecordTableTd';
-import { RecordTableDraggableTr } from '@/object-record/record-table/record-table-row/components/RecordTableDraggableTr';
 import { useTheme } from '@emotion/react';
 import { type IconComponent } from 'twenty-ui/display';
 
-const StyledRecordTableDraggableTr = styled(RecordTableDraggableTr)`
+const StyledRecordTableDraggableTr = styled.tr`
   cursor: pointer;
   transition: background-color ${({ theme }) => theme.animation.duration.fast}
     ease-in-out;
+  border: none;
+  background: ${({ theme }) => theme.background.primary};
+  position: relative;
+  z-index: ${TABLE_Z_INDEX.base};
 
   &:hover {
-    background-color: ${({ theme }) => theme.background.transparent.light};
+    td:not(:first-of-type) {
+      background-color: ${({ theme }) => theme.background.transparent.light};
+    }
   }
 
   td {
     border-bottom: 1px solid ${({ theme }) => theme.border.color.light};
+    background-color: ${({ theme }) => theme.background.primary};
+    transition: background-color ${({ theme }) => theme.animation.duration.fast}
+      ease-in-out;
 
     &:first-of-type {
       border-bottom: 1px solid ${({ theme }) => theme.background.primary};
@@ -49,16 +58,12 @@ const StyledText = styled.span`
 `;
 
 type RecordTableActionRowProps = {
-  draggableId: string;
-  draggableIndex: number;
   LeftIcon: IconComponent;
   text: string;
   onClick?: (event?: React.MouseEvent<HTMLTableRowElement>) => void;
 };
 
 export const RecordTableActionRow = ({
-  draggableId,
-  draggableIndex,
   LeftIcon,
   text,
   onClick,
@@ -68,13 +73,7 @@ export const RecordTableActionRow = ({
   const { visibleTableColumns } = useRecordTableContextOrThrow();
 
   return (
-    <StyledRecordTableDraggableTr
-      recordId={draggableId}
-      draggableIndex={draggableIndex}
-      focusIndex={draggableIndex}
-      onClick={onClick}
-      isDragDisabled
-    >
+    <StyledRecordTableDraggableTr onClick={onClick}>
       <td aria-hidden />
       <StyledIconContainer>
         <LeftIcon
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionAddNew.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionAddNew.tsx
index acb4c5a9e2..a5170be84d 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionAddNew.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionAddNew.tsx
@@ -1,11 +1,9 @@
 import { useObjectPermissionsForObject } from '@/object-record/hooks/useObjectPermissionsForObject';
 import { useCurrentRecordGroupId } from '@/object-record/record-group/hooks/useCurrentRecordGroupId';
 import { recordGroupDefinitionFamilyState } from '@/object-record/record-group/states/recordGroupDefinitionFamilyState';
-import { recordIndexAllRecordIdsComponentSelector } from '@/object-record/record-index/states/selectors/recordIndexAllRecordIdsComponentSelector';
 import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
 import { useCreateNewIndexRecord } from '@/object-record/record-table/hooks/useCreateNewIndexRecord';
 import { RecordTableActionRow } from '@/object-record/record-table/record-table-row/components/RecordTableActionRow';
-import { useRecoilComponentValue } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValue';
 import { t } from '@lingui/core/macro';
 import { useRecoilValue } from 'recoil';
 import { IconPlus } from 'twenty-ui/display';
@@ -15,10 +13,6 @@ export const RecordTableRecordGroupSectionAddNew = () => {
 
   const currentRecordGroupId = useCurrentRecordGroupId();
 
-  const recordIds = useRecoilComponentValue(
-    recordIndexAllRecordIdsComponentSelector,
-  );
-
   const recordGroup = useRecoilValue(
     recordGroupDefinitionFamilyState(currentRecordGroupId),
   );
@@ -43,8 +37,6 @@ export const RecordTableRecordGroupSectionAddNew = () => {
 
   return (
     <RecordTableActionRow
-      draggableId={`add-new-record-${currentRecordGroupId}`}
-      draggableIndex={recordIds.length + 2}
       LeftIcon={IconPlus}
       text={t`Add new`}
       onClick={() => {
diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionLoadMore.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionLoadMore.tsx
index 76672c6cd3..fbf344b3e1 100644
--- a/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionLoadMore.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-section/components/RecordTableRecordGroupSectionLoadMore.tsx
@@ -1,11 +1,9 @@
 import { useCurrentRecordGroupId } from '@/object-record/record-group/hooks/useCurrentRecordGroupId';
 import { useRecordIndexTableFetchMore } from '@/object-record/record-index/hooks/useRecordIndexTableFetchMore';
 import { recordIndexHasFetchedAllRecordsByGroupComponentState } from '@/object-record/record-index/states/recordIndexHasFetchedAllRecordsByGroupComponentState';
-import { recordIndexAllRecordIdsComponentSelector } from '@/object-record/record-index/states/selectors/recordIndexAllRecordIdsComponentSelector';
 import { useRecordTableContextOrThrow } from '@/object-record/record-table/contexts/RecordTableContext';
 import { RecordTableActionRow } from '@/object-record/record-table/record-table-row/components/RecordTableActionRow';
 import { useRecoilComponentFamilyValue } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentFamilyValue';
-import { useRecoilComponentValue } from '@/ui/utilities/state/component-state/hooks/useRecoilComponentValue';
 import { IconArrowDown } from 'twenty-ui/display';
 
 export const RecordTableRecordGroupSectionLoadMore = () => {
@@ -21,10 +19,6 @@ export const RecordTableRecordGroupSectionLoadMore = () => {
     currentRecordGroupId,
   );
 
-  const recordIds = useRecoilComponentValue(
-    recordIndexAllRecordIdsComponentSelector,
-  );
-
   const handleLoadMore = () => {
     fetchMoreRecordsLazy();
   };
@@ -35,8 +29,6 @@ export const RecordTableRecordGroupSectionLoadMore = () => {
 
   return (
     <RecordTableActionRow
-      draggableId={`load-more-records-${currentRecordGroupId}`}
-      draggableIndex={recordIds.length + 1}
       LeftIcon={IconArrowDown}
       text="Load more"
       onClick={handleLoadMore}
diff --git a/packages/twenty-server/src/engine/core-modules/open-api/utils/components.utils.ts b/packages/twenty-server/src/engine/core-modules/open-api/utils/components.utils.ts
index 13558e2fa5..8cf127d4bf 100644
--- a/packages/twenty-server/src/engine/core-modules/open-api/utils/components.utils.ts
+++ b/packages/twenty-server/src/engine/core-modules/open-api/utils/components.utils.ts
@@ -415,8 +415,10 @@ export const computeMetadataSchemaComponents = (
               operations: {
                 type: 'array',
                 items: { type: 'string' },
+                default: [],
               },
               description: { type: 'string' },
+              secret: { type: 'string' },
             },
           };
           schemas[`${capitalize(item.nameSingular)}ForResponse`] = {
@@ -430,6 +432,7 @@ export const computeMetadataSchemaComponents = (
                 items: { type: 'string' },
               },
               description: { type: 'string' },
+              secret: { type: 'string' },
               workspaceId: { type: 'string', format: 'uuid' },
               createdAt: { type: 'string', format: 'date-time' },
               updatedAt: { type: 'string', format: 'date-time' },
@@ -453,8 +456,9 @@ export const computeMetadataSchemaComponents = (
             properties: {
               name: { type: 'string' },
               expiresAt: { type: 'string', format: 'date-time' },
+              roleId: { type: 'string', format: 'uuid' },
             },
-            required: ['name', 'expiresAt'],
+            required: ['name', 'expiresAt', 'roleId'],
           };
           schemas[`${capitalize(item.namePlural)}`] = {
             type: 'array',
@@ -469,7 +473,12 @@ export const computeMetadataSchemaComponents = (
             properties: {
               name: { type: 'string' },
               expiresAt: { type: 'string', format: 'date-time' },
-              revokedAt: { type: 'string', format: 'date-time' },
+              revokedAt: {
+                type: 'string',
+                format: 'date-time',
+                description:
+                  'Set to null to clear revocation. Defaults to null if not provided.',
+              },
             },
           };
           schemas[`${capitalize(item.nameSingular)}ForResponse`] = {
@@ -480,6 +489,7 @@ export const computeMetadataSchemaComponents = (
               name: { type: 'string' },
               expiresAt: { type: 'string', format: 'date-time' },
               revokedAt: { type: 'string', format: 'date-time' },
+              roleId: { type: 'string', format: 'uuid' },
               workspaceId: { type: 'string', format: 'uuid' },
               createdAt: { type: 'string', format: 'date-time' },
               updatedAt: { type: 'string', format: 'date-time' },