Import company and person from csv file (#1236)

* feat: wip implement back-end call csv import

* fix: rebase IconBrandTwitter missing

* feat: person and company csv import

* fix: test & clean

* fix: clean & test

front/src/modules/spreadsheet-import/provider/components/SpreadsheetImport.tsx

@@ -0,0 +1,29 @@
+import { ModalWrapper } from '@/spreadsheet-import/components/ModalWrapper';
+import { Providers } from '@/spreadsheet-import/components/Providers';
+import { Steps } from '@/spreadsheet-import/steps/components/Steps';
+import type { SpreadsheetOptions } from '@/spreadsheet-import/types';
+
+export const defaultSpreadsheetImportProps: Partial<SpreadsheetOptions<any>> = {
+  autoMapHeaders: true,
+  allowInvalidSubmit: true,
+  autoMapDistance: 2,
+  uploadStepHook: async (value) => value,
+  selectHeaderStepHook: async (headerValues, data) => ({ headerValues, data }),
+  matchColumnsStepHook: async (table) => table,
+  dateFormat: 'yyyy-mm-dd', // ISO 8601,
+  parseRaw: true,
+} as const;
+
+export const SpreadsheetImport = <T extends string>(
+  props: SpreadsheetOptions<T>,
+) => {
+  return (
+    <Providers values={props}>
+      <ModalWrapper isOpen={props.isOpen} onClose={props.onClose}>
+        <Steps />
+      </ModalWrapper>
+    </Providers>
+  );
+};
+
+SpreadsheetImport.defaultProps = defaultSpreadsheetImportProps;

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

@@ -0,0 +1,36 @@
+import React from 'react';
+import { useRecoilState } from 'recoil';
+
+import { spreadsheetImportState } from '@/spreadsheet-import/states/spreadsheetImportState';
+
+import { SpreadsheetImport } from './SpreadsheetImport';
+
+type SpreadsheetImportProviderProps = React.PropsWithChildren;
+
+export const SpreadsheetImportProvider = (
+  props: SpreadsheetImportProviderProps,
+) => {
+  const [spreadsheetImportInternalState, setSpreadsheetImportInternalState] =
+    useRecoilState(spreadsheetImportState);
+
+  function handleClose() {
+    setSpreadsheetImportInternalState({
+      isOpen: false,
+      options: null,
+    });
+  }
+
+  return (
+    <>
+      {props.children}
+      {spreadsheetImportInternalState.isOpen &&
+        spreadsheetImportInternalState.options && (
+          <SpreadsheetImport
+            isOpen={true}
+            onClose={handleClose}
+            {...spreadsheetImportInternalState.options}
+          />
+        )}
+    </>
+  );
+};