fix: record object chip background color when idle (not hovered) (#4662)

Fixes #4651 https://github.com/twentyhq/twenty/assets/50639499/c4b604a1-4e73-422a-bc13-a2764f564a75 --------- Co-authored-by: Marie Stoppa <[email protected]>
twentyhq · Apr 15, 2024 · 42e50cb · 42e50cb
1 parent 9d99214
commit 42e50cb
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/packages/twenty-front/src/modules/object-record/components/RecordChip.tsx b/packages/twenty-front/src/modules/object-record/components/RecordChip.tsx
@@ -1,5 +1,5 @@
 import { useContext } from 'react';
-import { EntityChip } from 'twenty-ui';
+import { EntityChip, EntityChipVariant } from 'twenty-ui';
 
 import { useMapToObjectRecordIdentifier } from '@/object-metadata/hooks/useMapToObjectRecordIdentifier';
 import { RecordTableRowContext } from '@/object-record/record-table/contexts/RecordTableRowContext';
@@ -11,13 +11,15 @@ export type RecordChipProps = {
   record: ObjectRecord;
   maxWidth?: number;
   className?: string;
+  variant?: EntityChipVariant;
 };
 
 export const RecordChip = ({
   objectNameSingular,
   record,
   maxWidth,
   className,
+  variant,
 }: RecordChipProps) => {
   const { mapToObjectRecordIdentifier } = useMapToObjectRecordIdentifier({
     objectNameSingular,
@@ -44,6 +46,7 @@ export const RecordChip = ({
       linkToEntity={linkToEntity}
       maxWidth={maxWidth}
       className={className}
+      variant={variant}
     />
   );
 };
diff --git a/...t/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx b/...t/src/modules/object-record/record-board/record-board-card/components/RecordBoardCard.tsx
@@ -2,7 +2,7 @@ import { ReactNode, useContext, useState } from 'react';
 import { useInView } from 'react-intersection-observer';
 import styled from '@emotion/styled';
 import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil';
-import { IconEye } from 'twenty-ui';
+import { EntityChipVariant, IconEye } from 'twenty-ui';
 
 import { RecordChip } from '@/object-record/components/RecordChip';
 import { RecordBoardContext } from '@/object-record/record-board/contexts/RecordBoardContext';
@@ -221,6 +221,7 @@ export const RecordBoardCard = () => {
           <RecordChip
             objectNameSingular={objectMetadataItem.nameSingular}
             record={record}
+            variant={EntityChipVariant.Transparent}
           />
           {isCompactModeActive && (
             <StyledCompactIconContainer className="compact-icon-container">