Refactored and improved seeds (#8695)

- Added a new Seeder service to help with custom object seeds
- Added RichTextFieldInput to edit a rich text field directly on the
table, but deactivated it for now.

packages/twenty-ui/src/display/tag/components/Tag.tsx

@@ -9,6 +9,7 @@ import {
   ThemeContext,
   ThemeType,
 } from '@ui/theme';
+import { isDefined } from '@ui/utilities';
 
 const spacing5 = THEME_COMMON.spacing(5);
 const spacing2 = THEME_COMMON.spacing(2);
@@ -22,8 +23,20 @@ const StyledTag = styled.h3<{
   preventShrink?: boolean;
 }>`
   align-items: center;
-  background: ${({ color, theme }) =>
-    color === 'transparent' ? color : theme.tag.background[color]};
+  background: ${({ color, theme }) => {
+    if (color === 'transparent') {
+      return 'transparent';
+    } else {
+      const themeColor = theme.tag.background[color];
+
+      if (!isDefined(themeColor)) {
+        console.warn(`Tag color ${color} is not defined in the theme`);
+        return theme.tag.background.gray;
+      } else {
+        return themeColor;
+      }
+    }
+  }};
   border-radius: ${BORDER_COMMON.radius.sm};
   color: ${({ color, theme }) =>
     color === 'transparent'
@@ -103,10 +116,12 @@ export const Tag = ({
       variant={variant}
       preventShrink={preventShrink}
     >
-      {!!Icon && (
+      {isDefined(Icon) ? (
         <StyledIconContainer>
           <Icon size={theme.icon.size.sm} stroke={theme.icon.stroke.sm} />
         </StyledIconContainer>
+      ) : (
+        <></>
       )}
       {preventShrink ? (
         <StyledNonShrinkableText>{text}</StyledNonShrinkableText>

packages/twenty-ui/src/theme/constants/IllustrationIconDark.ts

@@ -4,10 +4,10 @@ import { COLOR } from './Colors';
 export const ILLUSTRATION_ICON_DARK = {
   color: {
     blue: COLOR.blue50,
-    grey: GRAY_SCALE.gray50,
+    gray: GRAY_SCALE.gray50,
   },
   fill: {
     blue: COLOR.blue70,
-    grey: GRAY_SCALE.gray70,
+    gray: GRAY_SCALE.gray70,
   },
 };

packages/twenty-ui/src/theme/constants/IllustrationIconLight.ts

@@ -4,10 +4,10 @@ import { COLOR } from './Colors';
 export const ILLUSTRATION_ICON_LIGHT = {
   color: {
     blue: COLOR.blue40,
-    grey: GRAY_SCALE.gray40,
+    gray: GRAY_SCALE.gray40,
   },
   fill: {
     blue: COLOR.blue20,
-    grey: GRAY_SCALE.gray20,
+    gray: GRAY_SCALE.gray20,
   },
 };