Remove useless selectedVesselIdentity state from ManualPriorNotificat…

…ionForm
MTES-MCT · Nov 8, 2024 · 69915d5 · 69915d5
1 parent 1807670
commit 69915d5
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 30 deletions.
diff --git a/frontend/src/features/PriorNotification/components/ManualPriorNotificationForm/Content.tsx b/frontend/src/features/PriorNotification/components/ManualPriorNotificationForm/Content.tsx
@@ -27,7 +27,6 @@ import { EditHistory } from '../shared/EditHistory'
 import { UploadFiles } from '../shared/UploadFiles'
 
 import type { ManualPriorNotificationFormValues } from './types'
-import type { Vessel } from '@features/Vessel/Vessel.types'
 import type { Promisable } from 'type-fest'
 
 type ContentProps = Readonly<{
@@ -47,9 +46,6 @@ export function Content({ detail, isValidatingOnChange, onClose, onSubmit, onVer
 
   const [isCancellationConfirmationModalOpen, setIsCancellationConfirmationModalOpen] = useState(false)
   const [isInvalidationConfirmationModalOpen, setIsInvalidationConfirmationModalOpen] = useState(false)
-  const [selectedVesselIdentity, setSelectedVesselIdentity] = useState<Vessel.VesselIdentity | undefined>(
-    detail?.vesselIdentity
-  )
 
   const previousPartialComputationRequestData = usePrevious(getPartialComputationRequestData(values))
 
@@ -166,7 +162,7 @@ export function Content({ detail, isValidatingOnChange, onClose, onSubmit, onVer
         <CardHeader
           isNewPriorNotification={isNewPriorNotification}
           onClose={handleClose}
-          selectedVesselIdentity={selectedVesselIdentity}
+          selectedVesselIdentity={values.vesselIdentity}
           withCloseButton
           withFirstTitleRow
         />
@@ -187,12 +183,7 @@ export function Content({ detail, isValidatingOnChange, onClose, onSubmit, onVer
 
           <hr />
 
-          <Form
-            isNewPriorNotification={isNewPriorNotification}
-            isReadOnly={isReadOnly}
-            onVesselChange={setSelectedVesselIdentity}
-            selectedVesselIdentity={selectedVesselIdentity}
-          />
+          <Form isNewPriorNotification={isNewPriorNotification} isReadOnly={isReadOnly} />
 
           {!!detail && (
             <>

diff --git a/frontend/src/features/PriorNotification/components/ManualPriorNotificationForm/Form.tsx b/frontend/src/features/PriorNotification/components/ManualPriorNotificationForm/Form.tsx
@@ -17,7 +17,7 @@ import {
   LinkButton
 } from '@mtes-mct/monitor-ui'
 import { useFormikContext } from 'formik'
-import { useCallback, useRef } from 'react'
+import { useCallback, useState } from 'react'
 import styled from 'styled-components'
 
 import { FormikFaoAreaSelect } from './fields/FormikFaoAreaSelect'
@@ -30,36 +30,31 @@ import type { Vessel } from '@features/Vessel/Vessel.types'
 type FormProps = Readonly<{
   isNewPriorNotification: boolean
   isReadOnly: boolean
-  onVesselChange: (nextVessel: Vessel.VesselIdentity | undefined) => void
-  selectedVesselIdentity: Vessel.VesselIdentity | undefined
 }>
-export function Form({ isNewPriorNotification, isReadOnly, onVesselChange, selectedVesselIdentity }: FormProps) {
+export function Form({ isNewPriorNotification, isReadOnly }: FormProps) {
   const { values } = useFormikContext<ManualPriorNotificationFormValues>()
 
   const dispatch = useMainAppDispatch()
   const { gearsAsOptions } = useGetGearsAsOptions()
   const { portsAsOptions } = useGetPortsAsOptions()
 
-  const isThirdPartyVessel = useRef<boolean>(false)
+  const [isThirdPartyVessel, setIsThirdPartyVessel] = useState(false)
 
-  const handleVesselChange = useCallback(
-    (nextVessel: Vessel.VesselIdentity | undefined) => {
-      isThirdPartyVessel.current = getHasAuthorizedLandingDownload(
-        nextVessel?.flagState,
-        nextVessel?.externalReferenceNumber
-      )
+  const updateIsThirdPartyVessel = useCallback((nextVessel: Vessel.VesselIdentity | undefined) => {
+    const nextIsThirdPartyVessel = getHasAuthorizedLandingDownload(
+      nextVessel?.flagState,
+      nextVessel?.externalReferenceNumber
+    )
 
-      onVesselChange(nextVessel)
-    },
-    [onVesselChange]
-  )
+    setIsThirdPartyVessel(nextIsThirdPartyVessel)
+  }, [])
 
   const openVesselReportingList = () => {
-    if (!selectedVesselIdentity) {
+    if (!values.vesselIdentity) {
       return
     }
 
-    dispatch(priorNotificationActions.setOpenedReportingListVesselIdentity(selectedVesselIdentity))
+    dispatch(priorNotificationActions.setOpenedReportingListVesselIdentity(values.vesselIdentity))
   }
 
   const updateIsDirty = (isDirty: boolean) => {
@@ -70,7 +65,7 @@ export function Form({ isNewPriorNotification, isReadOnly, onVesselChange, selec
 
   return (
     <>
-      <FormikVesselSelect onChange={handleVesselChange} readOnly={isReadOnly} />
+      <FormikVesselSelect onChange={updateIsThirdPartyVessel} readOnly={isReadOnly} />
 
       <FormikSelect
         isCleanable={false}
@@ -138,7 +133,7 @@ export function Form({ isNewPriorNotification, isReadOnly, onVesselChange, selec
 
       <hr />
 
-      {isThirdPartyVessel.current && (
+      {isThirdPartyVessel && (
         <>
           <StyledFormikMultiRadio
             isInline