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/provider/components/SpreadsheetImport.tsx

@@ -1,7 +1,7 @@
 import { ModalWrapper } from '@/spreadsheet-import/components/ModalWrapper';
 import { Providers } from '@/spreadsheet-import/components/Providers';
 import { Steps } from '@/spreadsheet-import/steps/components/Steps';
-import { SpreadsheetOptions as SpreadsheetImportProps } from '@/spreadsheet-import/types';
+import { SpreadsheetImportDialogOptions as SpreadsheetImportProps } from '@/spreadsheet-import/types';
 
 export const defaultSpreadsheetImportProps: Partial<
   SpreadsheetImportProps<any>
@@ -10,7 +10,10 @@ export const defaultSpreadsheetImportProps: Partial<
   allowInvalidSubmit: true,
   autoMapDistance: 2,
   uploadStepHook: async (value) => value,
-  selectHeaderStepHook: async (headerValues, data) => ({ headerValues, data }),
+  selectHeaderStepHook: async (headerValues, data) => ({
+    headerRow: headerValues,
+    importedRows: data,
+  }),
   matchColumnsStepHook: async (table) => table,
   dateFormat: 'yyyy-mm-dd', // ISO 8601,
   parseRaw: true,

packages/twenty-front/src/modules/spreadsheet-import/provider/components/SpreadsheetImportProvider.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { useRecoilState } from 'recoil';
 
-import { spreadsheetImportState } from '@/spreadsheet-import/states/spreadsheetImportState';
+import { spreadsheetImportDialogState } from '@/spreadsheet-import/states/spreadsheetImportDialogState';
 
 import { SpreadsheetImport } from './SpreadsheetImport';
 
@@ -10,12 +10,12 @@ type SpreadsheetImportProviderProps = React.PropsWithChildren;
 export const SpreadsheetImportProvider = (
   props: SpreadsheetImportProviderProps,
 ) => {
-  const [spreadsheetImport, setSpreadsheetImport] = useRecoilState(
-    spreadsheetImportState,
+  const [spreadsheetImportDialog, setSpreadsheetImportDialog] = useRecoilState(
+    spreadsheetImportDialogState,
   );
 
   const handleClose = () => {
-    setSpreadsheetImport({
+    setSpreadsheetImportDialog({
       isOpen: false,
       options: null,
     });
@@ -24,12 +24,12 @@ export const SpreadsheetImportProvider = (
   return (
     <>
       {props.children}
-      {spreadsheetImport.isOpen && spreadsheetImport.options && (
+      {spreadsheetImportDialog.isOpen && spreadsheetImportDialog.options && (
         <SpreadsheetImport
           isOpen={true}
           onClose={handleClose}
           // eslint-disable-next-line react/jsx-props-no-spreading
-          {...spreadsheetImport.options}
+          {...spreadsheetImportDialog.options}
         />
       )}
     </>