5425 - Introducing support for all Composite Fields Import (#5470)

Adding support for all Composite Fields while using the "import"
functionality. This includes:
- Currency
- Address

Edit : 
- Refactored a lot of types in the spreadsheet import module
- Renamed a lot of functions, hooks and types that were not
self-explanatory enough

---------

Co-authored-by: Charles Bochet <charles@twenty.com>
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>

packages/twenty-front/src/modules/spreadsheet-import/hooks/__tests__/useSpreadsheetImport.test.tsx

@@ -1,50 +1,57 @@
 import { act, renderHook } from '@testing-library/react';
 import { RecoilRoot, useRecoilState } from 'recoil';
 
-import { useSpreadsheetImport } from '@/spreadsheet-import/hooks/useSpreadsheetImport';
-import { spreadsheetImportState } from '@/spreadsheet-import/states/spreadsheetImportState';
+import { useOpenSpreadsheetImportDialog } from '@/spreadsheet-import/hooks/useOpenSpreadsheetImportDialog';
+import { spreadsheetImportDialogState } from '@/spreadsheet-import/states/spreadsheetImportDialogState';
 import { StepType } from '@/spreadsheet-import/steps/components/UploadFlow';
-import { RawData, SpreadsheetOptions } from '@/spreadsheet-import/types';
+import {
+  ImportedRow,
+  SpreadsheetImportDialogOptions,
+} from '@/spreadsheet-import/types';
 
 const Wrapper = ({ children }: { children: React.ReactNode }) => (
   <RecoilRoot>{children}</RecoilRoot>
 );
 type SpreadsheetKey = 'spreadsheet_key';
 
-export const mockedSpreadsheetOptions: SpreadsheetOptions<SpreadsheetKey> = {
-  isOpen: true,
-  onClose: () => {},
-  fields: [],
-  uploadStepHook: async () => [],
-  selectHeaderStepHook: async (headerValues: RawData, data: RawData[]) => ({
-    headerValues,
-    data,
-  }),
-  matchColumnsStepHook: async () => [],
-  rowHook: () => ({ spreadsheet_key: 'rowHook' }),
-  tableHook: () => [{ spreadsheet_key: 'tableHook' }],
-  onSubmit: async () => {},
-  allowInvalidSubmit: false,
-  customTheme: {},
-  maxRecords: 10,
-  maxFileSize: 50,
-  autoMapHeaders: true,
-  autoMapDistance: 1,
-  initialStepState: {
-    type: StepType.upload,
-  },
-  dateFormat: 'MM/DD/YY',
-  parseRaw: true,
-  rtl: false,
-  selectHeader: true,
-};
+export const mockedSpreadsheetOptions: SpreadsheetImportDialogOptions<SpreadsheetKey> =
+  {
+    isOpen: true,
+    onClose: () => {},
+    fields: [],
+    uploadStepHook: async () => [],
+    selectHeaderStepHook: async (
+      headerValues: ImportedRow,
+      data: ImportedRow[],
+    ) => ({
+      headerRow: headerValues,
+      importedRows: data,
+    }),
+    matchColumnsStepHook: async () => [],
+    rowHook: () => ({ spreadsheet_key: 'rowHook' }),
+    tableHook: () => [{ spreadsheet_key: 'tableHook' }],
+    onSubmit: async () => {},
+    allowInvalidSubmit: false,
+    customTheme: {},
+    maxRecords: 10,
+    maxFileSize: 50,
+    autoMapHeaders: true,
+    autoMapDistance: 1,
+    initialStepState: {
+      type: StepType.upload,
+    },
+    dateFormat: 'MM/DD/YY',
+    parseRaw: true,
+    rtl: false,
+    selectHeader: true,
+  };
 
 describe('useSpreadsheetImport', () => {
   it('should set isOpen to true, and update the options in the Recoil state', async () => {
     const { result } = renderHook(
       () => ({
-        useSpreadsheetImport: useSpreadsheetImport<SpreadsheetKey>(),
-        spreadsheetImportState: useRecoilState(spreadsheetImportState)[0],
+        useSpreadsheetImport: useOpenSpreadsheetImportDialog<SpreadsheetKey>(),
+        spreadsheetImportState: useRecoilState(spreadsheetImportDialogState)[0],
       }),
       {
         wrapper: Wrapper,
@@ -55,7 +62,7 @@ describe('useSpreadsheetImport', () => {
       options: null,
     });
     act(() => {
-      result.current.useSpreadsheetImport.openSpreadsheetImport(
+      result.current.useSpreadsheetImport.openSpreadsheetImportDialog(
         mockedSpreadsheetOptions,
       );
     });

packages/twenty-front/src/modules/spreadsheet-import/hooks/useOpenSpreadsheetImportDialog.ts

@@ -0,0 +1,19 @@
+import { useSetRecoilState } from 'recoil';
+
+import { spreadsheetImportDialogState } from '@/spreadsheet-import/states/spreadsheetImportDialogState';
+import { SpreadsheetImportDialogOptions } from '@/spreadsheet-import/types';
+
+export const useOpenSpreadsheetImportDialog = <T extends string>() => {
+  const setSpreadSheetImport = useSetRecoilState(spreadsheetImportDialogState);
+
+  const openSpreadsheetImportDialog = (
+    options: Omit<SpreadsheetImportDialogOptions<T>, 'isOpen' | 'onClose'>,
+  ) => {
+    setSpreadSheetImport({
+      isOpen: true,
+      options,
+    });
+  };
+
+  return { openSpreadsheetImportDialog };
+};

packages/twenty-front/src/modules/spreadsheet-import/hooks/useSpreadsheetImport.ts

@@ -1,19 +0,0 @@
-import { useSetRecoilState } from 'recoil';
-
-import { spreadsheetImportState } from '@/spreadsheet-import/states/spreadsheetImportState';
-import { SpreadsheetOptions } from '@/spreadsheet-import/types';
-
-export const useSpreadsheetImport = <T extends string>() => {
-  const setSpreadSheetImport = useSetRecoilState(spreadsheetImportState);
-
-  const openSpreadsheetImport = (
-    options: Omit<SpreadsheetOptions<T>, 'isOpen' | 'onClose'>,
-  ) => {
-    setSpreadSheetImport({
-      isOpen: true,
-      options,
-    });
-  };
-
-  return { openSpreadsheetImport };
-};

packages/twenty-front/src/modules/spreadsheet-import/hooks/useSpreadsheetImportInternal.ts

@@ -3,12 +3,12 @@ import { SetRequired } from 'type-fest';
 
 import { RsiContext } from '@/spreadsheet-import/components/Providers';
 import { defaultSpreadsheetImportProps } from '@/spreadsheet-import/provider/components/SpreadsheetImport';
-import { SpreadsheetOptions } from '@/spreadsheet-import/types';
+import { SpreadsheetImportDialogOptions } from '@/spreadsheet-import/types';
 
 export const useSpreadsheetImportInternal = <T extends string>() =>
   useContext<
     SetRequired<
-      SpreadsheetOptions<T>,
+      SpreadsheetImportDialogOptions<T>,
       keyof typeof defaultSpreadsheetImportProps
     >
   >(RsiContext);