diff --git a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexRecordChip.tsx b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexRecordChip.tsx index e0ffd86d9..10694c65e 100644 --- a/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexRecordChip.tsx +++ b/packages/twenty-front/src/modules/object-record/record-index/components/RecordIndexRecordChip.tsx @@ -1,6 +1,7 @@ import { useGetStandardObjectIcon } from '@/object-metadata/hooks/useGetStandardObjectIcon'; import { useRecordChipData } from '@/object-record/hooks/useRecordChipData'; import { ObjectRecord } from '@/object-record/types/ObjectRecord'; +import { isNonEmptyString } from '@sniptt/guards'; import { AvatarChip, AvatarChipVariant, ChipSize } from 'twenty-ui'; export type RecordIdentifierChipProps = { @@ -27,6 +28,11 @@ export const RecordIdentifierChip = ({ const { Icon: LeftIcon, IconColor: LeftIconColor } = useGetStandardObjectIcon(objectNameSingular); + + if (!isNonEmptyString(recordChipData.name.trim())) { + return null; + } + return ( ` + color: ${({ theme }) => theme.font.color.light}; + padding-left: 4px; +`); + export type EditableCellDisplayContainerProps = { softFocus?: boolean; onClick?: () => void; scrollRef?: Ref; isHovered?: boolean; onContextMenu?: (event: React.MouseEvent) => void; + placeholderForEmptyCell?: string; }; export const RecordTableCellDisplayContainer = ({ @@ -35,6 +42,7 @@ export const RecordTableCellDisplayContainer = ({ onClick, scrollRef, onContextMenu, + placeholderForEmptyCell, }: React.PropsWithChildren) => ( - {children} + {placeholderForEmptyCell ? ( + + {'Set ' + placeholderForEmptyCell} + + ) : ( + {children} + )} ); diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellSoftFocusMode.tsx b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellSoftFocusMode.tsx index 0a327d097..20c8630e6 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellSoftFocusMode.tsx +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/components/RecordTableCellSoftFocusMode.tsx @@ -33,7 +33,7 @@ export const RecordTableCellSoftFocusMode = ({ editModeContent, nonEditModeContent, }: RecordTableCellSoftFocusModeProps) => { - const { columnIndex } = useContext(RecordTableCellContext); + const { columnIndex, columnDefinition } = useContext(RecordTableCellContext); const { recordId } = useContext(FieldContext); const { onActionMenuDropdownOpened } = useRecordTableBodyContextOrThrow(); @@ -128,7 +128,11 @@ export const RecordTableCellSoftFocusMode = ({ }; const handleButtonClick = () => { - handleClick(); + if (!isFieldInputOnly && isFirstColumn) { + openTableCell(undefined, false, true); + } else { + openTableCell(); + } /* Disabling sidepanel access for now, TODO: launch if (!isFieldInputOnly) { @@ -148,13 +152,13 @@ export const RecordTableCellSoftFocusMode = ({ : customButtonIcon; const showButton = - isDefined(buttonIcon) && - !editModeContentOnly && - (!isFirstColumn || !isEmpty) && - !isFieldReadOnly; + isDefined(buttonIcon) && !editModeContentOnly && !isFieldReadOnly; const dontShowContent = isEmpty && isFieldReadOnly; + const showPlaceholder = + !editModeContentOnly && !isFieldReadOnly && isFirstColumn && isEmpty; + return ( <> {dontShowContent ? ( <> diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellFromCell.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellFromCell.ts index 1c193dd64..4cdd47fb9 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellFromCell.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellFromCell.ts @@ -43,6 +43,7 @@ export const useOpenRecordTableCellFromCell = () => { const openTableCell = ( initialValue?: string, isActionButtonClick = false, + isNavigating = false, ) => { onOpenTableCell({ cellPosition, @@ -54,6 +55,7 @@ export const useOpenRecordTableCellFromCell = () => { objectNameSingular, initialValue, isActionButtonClick, + isNavigating, }); }; diff --git a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2.ts b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2.ts index 514bbda1e..fae00fd95 100644 --- a/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2.ts +++ b/packages/twenty-front/src/modules/object-record/record-table/record-table-cell/hooks/useOpenRecordTableCellV2.ts @@ -42,6 +42,7 @@ export type OpenTableCellArgs = { fieldDefinition: FieldDefinition; recordId: string; isActionButtonClick: boolean; + isNavigating: boolean; }; export const useOpenRecordTableCellV2 = (tableScopeId: string) => { @@ -84,6 +85,7 @@ export const useOpenRecordTableCellV2 = (tableScopeId: string) => { fieldDefinition, recordId, isActionButtonClick, + isNavigating, }: OpenTableCellArgs) => { if (isReadOnly) { return; @@ -106,7 +108,10 @@ export const useOpenRecordTableCellV2 = (tableScopeId: string) => { fieldValue, }); - if (isFirstColumnCell && !isEmpty && !isActionButtonClick) { + if ( + (isFirstColumnCell && !isEmpty && !isActionButtonClick) || + isNavigating + ) { leaveTableFocus(); navigate(indexIdentifierUrl(recordId));