validation on Select field (#8316)

fix #8204
I changed "API keys" to "API values".
Stopped inputting special characters in Select field option keys.

@lucasbordeau please check the changes and tell me if I need to do any
other changes. :)

---------

Co-authored-by: Félix Malfait <felix@twenty.com>

packages/twenty-front/src/pages/settings/data-model/utils/compute-metadata-name-from-label.utils.ts

@@ -1,9 +1,22 @@
-import { METADATA_NAME_VALID_PATTERN } from '~/pages/settings/data-model/constants/MetadataNameValidPattern';
-import { transliterateAndFormatOrThrow } from '~/pages/settings/data-model/utils/transliterate-and-format.utils';
+import camelCase from 'lodash.camelcase';
+import { slugify } from 'transliteration';
 
-export const computeMetadataNameFromLabelOrThrow = (label: string): string => {
-  if (label === '') {
+export const computeMetadataNameFromLabel = (label: string): string => {
+  const prefixedLabel = /^\d/.test(label) ? `n${label}` : label;
+
+  if (prefixedLabel === '') {
     return '';
   }
-  return transliterateAndFormatOrThrow(label, METADATA_NAME_VALID_PATTERN);
+
+  const formattedString = slugify(prefixedLabel, {
+    trim: true,
+    separator: '_',
+    allowedChars: 'a-zA-Z0-9',
+  });
+
+  if (formattedString === '') {
+    throw new Error('Invalid label');
+  }
+
+  return camelCase(formattedString);
 };