Chip right height according to view (#7976)

packages/twenty-ui/src/display/chip/components/AvatarChip.tsx

@@ -1,7 +1,7 @@
 import { styled } from '@linaria/react';
 import { Avatar } from '@ui/display/avatar/components/Avatar';
 import { AvatarType } from '@ui/display/avatar/types/AvatarType';
-import { Chip, ChipVariant } from '@ui/display/chip/components/Chip';
+import { Chip, ChipSize, ChipVariant } from '@ui/display/chip/components/Chip';
 import { IconComponent } from '@ui/display/icon/types/IconComponent';
 import { ThemeContext } from '@ui/theme';
 import { isDefined } from '@ui/utilities/isDefined';
@@ -13,6 +13,7 @@ export type AvatarChipProps = {
   avatarUrl?: string;
   avatarType?: Nullable<AvatarType>;
   variant?: AvatarChipVariant;
+  size?: ChipSize;
   LeftIcon?: IconComponent;
   LeftIconColor?: string;
   isIconInverted?: boolean;
@@ -47,6 +48,7 @@ export const AvatarChip = ({
   className,
   placeholderColorSeed,
   onClick,
+  size = ChipSize.Small,
 }: AvatarChipProps) => {
   const { theme } = useContext(ThemeContext);
 
@@ -60,6 +62,7 @@ export const AvatarChip = ({
             : ChipVariant.Regular
           : ChipVariant.Transparent
       }
+      size={size}
       leftComponent={
         isDefined(LeftIcon) ? (
           isIconInverted === true ? (

packages/twenty-ui/src/display/chip/components/Chip.tsx

@@ -66,7 +66,8 @@ const StyledContainer = withTheme(styled.div<
   display: inline-flex;
   justify-content: center;
   gap: ${({ theme }) => theme.spacing(1)};
-  height: ${({ theme }) => theme.spacing(4)};
+  height: ${({ theme, size }) =>
+    size === ChipSize.Large ? theme.spacing(4) : theme.spacing(3)};
   max-width: ${({ maxWidth }) =>
     maxWidth
       ? `calc(${maxWidth}px - 2 * var(--chip-horizontal-padding))`
@@ -141,10 +142,7 @@ export const Chip = ({
       className={className}
     >
       {leftComponent}
-      <OverflowingTextWithTooltip
-        size={size === ChipSize.Large ? 'large' : 'small'}
-        text={label}
-      />
+      <OverflowingTextWithTooltip size={size} text={label} />
       {rightComponent}
     </StyledContainer>
   );