add SU address data in createContact dialog

src/pages/CreateContactPage.tsx

@@ -1,34 +1,20 @@
 import Stack from "@mui/material/Stack";
-import { useForm } from "../hooks/useForm";
-import { schema } from "../ui/Contact/ContactFormDialog";
-import { useRef, useState } from "react";
+import { useState } from "react";
 import { Row } from "../ui/Row";
-import Button from "@mui/material/Button";
 import PersonAddAltOutlinedIcon from "@mui/icons-material/PersonAddAltOutlined";
 import Typography from "@mui/material/Typography";
 import { Step, StepLabel, Stepper, Divider, Card } from "@mui/material";
 import { InformationsForm } from "../ui/Contact/CreateContact/InformationsForm";
 import { RightsManagementForm } from "../ui/Contact/CreateContact/RightsManagementForm";
 import { Breadcrumbs } from "../ui/Breadcrumbs";
 
-// const steps = ["Informations du contact", "Adresse du contact", "Gestion des droits"];
-
 const steps = ["Informations du contact", "Gestion des droits"];
 
 export const CreateContactPage = () => {
-  const { register, control, errors } = useForm(schema);
   const [activeStep, setActiveStep] = useState(0);
+  const [contactData, setContactData] = useState();
 
-  const data = useRef(new FormData());
-
-  const onSubmitStep = async (event: React.FormEvent<HTMLFormElement>) => {
-    event.preventDefault();
-    const newData = new FormData(event.currentTarget);
-    console.log("new data", { newData });
-    for (let [name, value] of newData) {
-      data.current.append(name, value);
-    }
-  };
+  const [rights, setRights] = useState();
 
   const handleNext = () => {
     setActiveStep(prevActiveStep => prevActiveStep + 1);
@@ -38,8 +24,15 @@ export const CreateContactPage = () => {
     setActiveStep(prevActiveStep => prevActiveStep - 1);
   };
 
-  const handleSubmitStep = async (event: React.FormEvent<HTMLFormElement>) => {
-    onSubmitStep(event);
+  const handleSubmitStep = async (data: any) => {
+    if (activeStep === 0) {
+      setContactData(data);
+    }
+
+    if (activeStep === 1) {
+      setRights(data);
+    }
+
     handleNext();
   };
 
@@ -50,7 +43,7 @@ export const CreateContactPage = () => {
   ];
 
   return (
-    <Stack>
+    <Stack pb={5}>
       <Divider variant="fullWidth" />
       <Stack>
         <Row spacing={1} px={6} py={4} bgcolor={"white"} justifyContent={"space-between"}>
@@ -72,27 +65,17 @@ export const CreateContactPage = () => {
         </Row>
         <Breadcrumbs items={breadcrumbs} />
         <Card sx={{ mt: 5, px: 6, py: 3, maxWidth: "1160px", alignSelf: "center" }} elevation={2}>
-          <form action="#" onSubmit={handleSubmitStep}>
-            {activeStep === 0 && (
-              <InformationsForm errors={errors} register={register} control={control} />
-            )}
-            {/* {activeStep === 1 && <AddressForm errors={errors} register={register} />} */}
-            {activeStep === 1 && <RightsManagementForm />}
-            <Row p={4} justifyContent={"flex-end"}>
-              <Button
-                disabled={activeStep === 0}
-                variant={"outlined"}
-                onClick={handleBack}
-                sx={{ mr: 1 }}
-              >
-                Annuler
-              </Button>
+          {activeStep === 0 && (
+            <InformationsForm
+              handleSubmitStep={handleSubmitStep}
+              handleBack={handleBack}
+              contact={contactData}
+            />
+          )}
 
-              <Button type="submit" variant="contained">
-                Suivant
-              </Button>
-            </Row>
-          </form>
+          {activeStep === 1 && (
+            <RightsManagementForm handleSubmitStep={handleSubmitStep} handleBack={handleBack} />
+          )}
         </Card>
       </Stack>
     </Stack>

src/pages/Search/SearchContacts.tsx

@@ -1,4 +1,4 @@
-import { CardActionArea, CircularProgress, Stack } from "@mui/material";
+import { Button, CardActionArea, CircularProgress, Stack } from "@mui/material";
 import { Row } from "../../ui/Row";
 import { useInfiniteFetchQuery } from "../../hooks/useFetchQuery.ts";
 import ToggleButtonGroup from "@mui/material/ToggleButtonGroup";
@@ -10,6 +10,7 @@ import { type APIResponse } from "../../types/api.ts";
 import { type ItemOf } from "../../types/utils.ts";
 import Card from "@mui/material/Card";
 import { Link } from "react-router-dom";
+import { Link as CustomLink } from "../../ui/Link";
 import Box from "@mui/material/Box";
 import Typography from "@mui/material/Typography";
 import { TextWithLeftIcon } from "../../ui/TextWithLeftIcon.tsx";
@@ -19,6 +20,7 @@ import EmailIcon from "@mui/icons-material/Email";
 import DesktopWindowsOutlinedIcon from "@mui/icons-material/DesktopWindowsOutlined";
 import { useSearchFilterParams } from "../../hooks/useSearchFilter.ts";
 import { ContactCardTitle } from "../../ui/SurveyUnit/SurveyUnitContacts.tsx";
+import EditIcon from "@mui/icons-material/Edit";
 
 const endpoint = "/api/contacts/search" as const;
 type Item = ItemOf<Required<APIResponse<typeof endpoint, "get">>["content"]>;
@@ -67,6 +69,24 @@ export const SearchContacts = () => {
         ))}
         {hasNextPage && <VisibilitySpy onVisible={fetchNextPage} />}
       </CardGrid>
+      <Button
+        sx={{
+          position: "fixed",
+          bottom: "48px",
+          right: "32px",
+          borderRadius: 24,
+          typography: "titleSmall",
+          fontWeight: "500",
+        }}
+        size="large"
+        fullWidth={false}
+        variant="contained"
+        endIcon={<EditIcon />}
+      >
+        <CustomLink to={"/contacts/createContact"} color="inherit" underline="none">
+          Créer un nouveau contact
+        </CustomLink>
+      </Button>
     </Stack>
   );
 };