Refactor default value for select (#5343)

In this PR, we are refactoring two things:
- leverage field.defaultValue for Select and MultiSelect settings form
(instead of option.isDefault)
- use quoted string (ex: "'USD'") for string default values to embrace
backend format

---------

Co-authored-by: Thaïs Guigon <guigon.thais@gmail.com>

packages/twenty-ui/__mocks__/imageMock.js

@@ -0,0 +1 @@
+export default 'test-file-stub';

packages/twenty-ui/jest.config.ts

@@ -1,4 +1,9 @@
-export default {
+import { JestConfigWithTsJest, pathsToModuleNameMapper } from 'ts-jest';
+
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const tsConfig = require('./tsconfig.json');
+
+const jestConfig: JestConfigWithTsJest = {
   displayName: 'twenty-ui',
   preset: '../../jest.preset.js',
   setupFilesAfterEnv: ['./setupTests.ts'],
@@ -15,7 +20,14 @@ export default {
       },
     ],
   },
+  moduleNameMapper: {
+    '\\.(jpg|jpeg|png|gif|webp|svg|svg\\?react)$':
+      '<rootDir>/__mocks__/imageMock.js',
+    ...pathsToModuleNameMapper(tsConfig.compilerOptions.paths),
+  },
   moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx'],
   extensionsToTreatAsEsm: ['.ts', '.tsx'],
   coverageDirectory: './coverage',
 };
+
+export default jestConfig;

packages/twenty-ui/src/theme/index.ts

@@ -32,3 +32,4 @@ export * from './constants/ThemeDark';
 export * from './constants/ThemeLight';
 export * from './provider/ThemeProvider';
 export * from './types/ThemeType';
+export * from './utils/getNextThemeColor';

packages/twenty-ui/src/theme/utils/__tests__/getNextThemeColor.test.ts

@@ -0,0 +1,23 @@
+import {
+  MAIN_COLOR_NAMES,
+  ThemeColor,
+} from '@ui/theme/constants/MainColorNames';
+
+import { getNextThemeColor } from '../getNextThemeColor';
+
+describe('getNextThemeColor', () => {
+  it('returns the next theme color', () => {
+    const currentColor: ThemeColor = MAIN_COLOR_NAMES[0];
+    const nextColor: ThemeColor = MAIN_COLOR_NAMES[1];
+
+    expect(getNextThemeColor(currentColor)).toBe(nextColor);
+  });
+
+  it('returns the first color when reaching the end', () => {
+    const currentColor: ThemeColor =
+      MAIN_COLOR_NAMES[MAIN_COLOR_NAMES.length - 1];
+    const nextColor: ThemeColor = MAIN_COLOR_NAMES[0];
+
+    expect(getNextThemeColor(currentColor)).toBe(nextColor);
+  });
+});

packages/twenty-ui/src/theme/utils/getNextThemeColor.ts

@@ -0,0 +1,9 @@
+import { MAIN_COLOR_NAMES, ThemeColor } from '@ui/theme';
+
+export const getNextThemeColor = (currentColor: ThemeColor): ThemeColor => {
+  const currentColorIndex = MAIN_COLOR_NAMES.findIndex(
+    (color) => color === currentColor,
+  );
+  const nextColorIndex = (currentColorIndex + 1) % MAIN_COLOR_NAMES.length;
+  return MAIN_COLOR_NAMES[nextColorIndex];
+};