Progress on translations (#9703)

Start adding a few translations on setting pages, introduce
pseudo-locale, switch to dynamic import, add eslint rule

packages/twenty-front/src/pages/settings/data-model/SettingsObjects.tsx

@@ -21,6 +21,7 @@ import { TableSection } from '@/ui/layout/table/components/TableSection';
 import { useSortedArray } from '@/ui/layout/table/hooks/useSortedArray';
 import { useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
+import { useLingui } from '@lingui/react/macro';
 import { isNonEmptyArray } from '@sniptt/guards';
 import { useMemo, useState } from 'react';
 import {
@@ -38,12 +39,15 @@ import { SettingsObjectTableItem } from '~/pages/settings/data-model/types/Setti
 const StyledIconChevronRight = styled(IconChevronRight)`
   color: ${({ theme }) => theme.font.color.tertiary};
 `;
+
 const StyledSearchInput = styled(TextInput)`
   padding-bottom: ${({ theme }) => theme.spacing(2)};
   width: 100%;
 `;
+
 export const SettingsObjects = () => {
   const theme = useTheme();
+  const { t } = useLingui();
   const [searchTerm, setSearchTerm] = useState('');
   const { deleteOneObjectMetadataItem } = useDeleteOneObjectMetadataItem();
   const { updateOneObjectMetadataItem } = useUpdateOneObjectMetadataItem();
@@ -109,6 +113,7 @@ export const SettingsObjects = () => {
     inactiveObjectSettingsArray,
     SETTINGS_OBJECT_TABLE_METADATA,
   );
+
   const filteredActiveObjectSettingsItems = useMemo(
     () =>
       sortedActiveObjectSettingsItems.filter(
@@ -128,14 +133,15 @@ export const SettingsObjects = () => {
       ),
     [sortedInactiveObjectSettingsItems, searchTerm],
   );
+
   return (
     <SubMenuTopBarContainer
-      title="Data model"
+      title={t`Data model`}
       actionButton={
         <UndecoratedLink to={getSettingsPagePath(SettingsPath.NewObject)}>
           <Button
             Icon={IconPlus}
-            title="Add object"
+            title={t`Add object`}
             accent="blue"
             size="small"
           />
@@ -143,11 +149,11 @@ export const SettingsObjects = () => {
       }
       links={[
         {
-          children: 'Workspace',
+          children: t`Workspace`,
           href: getSettingsPagePath(SettingsPath.Workspace),
         },
         {
-          children: 'Objects',
+          children: t`Objects`,
         },
       ]}
     >
@@ -155,11 +161,11 @@ export const SettingsObjects = () => {
         <>
           <SettingsObjectCoverImage />
           <Section>
-            <H2Title title="Existing objects" />
+            <H2Title title={t`Existing objects`} />
 
             <StyledSearchInput
               LeftIcon={IconSearch}
-              placeholder="Search an object..."
+              placeholder={t`Search an object...`}
               value={searchTerm}
               onChange={setSearchTerm}
             />
@@ -181,7 +187,7 @@ export const SettingsObjects = () => {
                 <TableHeader></TableHeader>
               </StyledObjectTableRow>
               {isNonEmptyArray(sortedActiveObjectSettingsItems) && (
-                <TableSection title="Active">
+                <TableSection title={t`Active`}>
                   {filteredActiveObjectSettingsItems.map(
                     (objectSettingsItem) => (
                       <SettingsObjectMetadataItemTableRow
@@ -205,7 +211,7 @@ export const SettingsObjects = () => {
                 </TableSection>
               )}
               {isNonEmptyArray(inactiveObjectMetadataItems) && (
-                <TableSection title="Inactive">
+                <TableSection title={t`Inactive`}>
                   {filteredInactiveObjectSettingsItems.map(
                     (objectSettingsItem) => (
                       <SettingsObjectMetadataItemTableRow