Préavis - Diverses corrections

frontend/cypress/e2e/side_window/prior_notification_card/card.spec.ts

@@ -8,7 +8,7 @@ context('Side Window > Prior Notification Card > Card', () => {
     openSideWindowPriorNotification(`L'ANCRE`)
 
     // Title
-    cy.contains(`PNO < 12 M - SEGMENT(S) INCONNU(S)`).should('be.visible')
+    cy.contains(`Préavis navire < 12 M`).should('be.visible')
     cy.contains(`L'ANCRE SÈCHE (CFR106)`).should('be.visible')
 
     // Message Header
@@ -29,7 +29,7 @@ context('Side Window > Prior Notification Card > Card', () => {
     cy.wait('@getIsSuperUser')
 
     // Title
-    cy.contains(`PNO < 12 M - NWW09 (LIGNES)`).should('be.visible')
+    cy.contains(`Préavis navire < 12 M`).should('be.visible')
     cy.contains(`POISSON PAS NET (CFR112)`).should('be.visible')
 
     // Message Header
@@ -43,7 +43,7 @@ context('Side Window > Prior Notification Card > Card', () => {
     openSideWindowPriorNotification(`BARS`)
 
     // Title
-    cy.contains(`PNO ≥ 12 M - NWW03 (CHALUT DE FOND EN EAU PROFONDE ≥100 MM)`).should('be.visible')
+    cy.contains(`Préavis navire ≥ 12 M`).should('be.visible')
     cy.contains(`DES BARS (CFR104)`).should('be.visible')
 
     // Message Header
@@ -62,7 +62,7 @@ context('Side Window > Prior Notification Card > Card', () => {
     openSideWindowPriorNotification(`CALAMARO`)
 
     // Title
-    cy.contains(`PNO ≥ 12 M - SEGMENT(S) INCONNU(S)`).should('be.visible')
+    cy.contains(`Préavis navire ≥ 12 M`).should('be.visible')
     cy.contains(`CALAMARO (CFR105)`).should('be.visible')
 
     // Message Header

frontend/cypress/e2e/vessels/vessels_list.spec.ts

@@ -16,7 +16,7 @@ context('Vessels list', () => {
     cy.get('*[data-cy="vessel-list-country-filter"]').click({ force: true })
     cy.get('*[data-cy="select-picker-menu-item-France"]').scrollIntoView().click()
     // Close the tag picker
-    cy.get('.rs-modal-title').click()
+    cy.get('.rs-modal-title').click({ force: true })
     cy.wait(200)
     cy.get('*[data-cy^="vessels-list-box-filter"]').click({ timeout: 10000 })
     cy.wait(200)

frontend/src/features/Logbook/components/VesselLogbook/LogbookMessages/messages/LogbookMessage.tsx

@@ -19,13 +19,13 @@ import type { LogbookMessage as LogbookMessageType } from '../../../../Logbook.t
 
 type LogbookMessageComponentProps = Readonly<{
   isFirst: boolean
-  isLessThanTwelveMetersVessel?: boolean
+  isManuallyCreated?: boolean
   logbookMessage: LogbookMessageType | LogbookMessageNamespace.LogbookMessage
   withMapControls?: boolean
 }>
 export function LogbookMessage({
   isFirst,
-  isLessThanTwelveMetersVessel = false,
+  isManuallyCreated = false,
   logbookMessage,
   withMapControls = false
 }: LogbookMessageComponentProps) {
@@ -44,7 +44,7 @@ export function LogbookMessage({
         )
       }
       case LogbookMessageTypeEnum.PNO.code.toString(): {
-        if (isLessThanTwelveMetersVessel) {
+        if (isManuallyCreated) {
           return (
             <>
               Préavis (notification de retour au port) – <i>navire sans JPE</i>
@@ -58,7 +58,7 @@ export function LogbookMessage({
         return LogbookMessageTypeEnum[logbookMessage.messageType].fullName
       }
     }
-  }, [logbookMessage, isLessThanTwelveMetersVessel])
+  }, [logbookMessage, isManuallyCreated])
 
   const openXML = (xml: string) => {
     const blob = new Blob([xml], { type: 'text/xml' })
@@ -68,16 +68,14 @@ export function LogbookMessage({
   }
 
   const logbookMessageComponent = useMemo(
-    () => getComponentFromMessageType(logbookMessage, isLessThanTwelveMetersVessel),
-    [logbookMessage, isLessThanTwelveMetersVessel]
+    () => getComponentFromMessageType(logbookMessage, isManuallyCreated),
+    [logbookMessage, isManuallyCreated]
   )
 
   return (
     <Wrapper id={logbookMessage.operationNumber} isFirst={isFirst}>
       <Header>
-        {!isLessThanTwelveMetersVessel && (
-          <LogbookMessageTypeText>{getLogbookMessageType(logbookMessage)}</LogbookMessageTypeText>
-        )}
+        {!isManuallyCreated && <LogbookMessageTypeText>{getLogbookMessageType(logbookMessage)}</LogbookMessageTypeText>}
         <LogbookMessageHeaderText
           data-cy="vessel-fishing-message"
           isShortcut={
@@ -107,7 +105,7 @@ export function LogbookMessage({
           </OperationTag>
         )}
 
-        {!isLessThanTwelveMetersVessel && logbookMessage.rawMessage && (
+        {!isManuallyCreated && logbookMessage.rawMessage && (
           <Xml
             onClick={() => openXML(logbookMessage.rawMessage)}
             style={{ cursor: 'pointer' }}
@@ -140,14 +138,14 @@ export function LogbookMessage({
         )}
         <LogbookMessageMetadata>
           <EmissionDateTime>
-            <Key>{isLessThanTwelveMetersVessel ? 'Date de saisie dans MF par le CNSP' : 'Date d’émission'}</Key>
+            <Key>{isManuallyCreated ? 'Date de saisie dans MF par le CNSP' : 'Date d’émission'}</Key>
             {getDateTime(logbookMessage.reportDateTime, true)}
           </EmissionDateTime>
           <ReceptionDateTime>
-            <Key>{isLessThanTwelveMetersVessel ? 'Date de réception par le CNSP' : 'Date de réception'}</Key>
+            <Key>{isManuallyCreated ? 'Date de réception par le CNSP' : 'Date de réception'}</Key>
             {getDateTime(logbookMessage.integrationDateTime, true)}
           </ReceptionDateTime>
-          {!isLessThanTwelveMetersVessel && (
+          {!isManuallyCreated && (
             <VoyageNumber>
               <Key>N° de marée</Key>
               {logbookMessage.tripNumber ? (
@@ -157,7 +155,7 @@ export function LogbookMessage({
               )}
             </VoyageNumber>
           )}
-          {!isLessThanTwelveMetersVessel && (
+          {!isManuallyCreated && (
             <Acknowledge>
               <Key>Acq.</Key>
               {!logbookMessage.acknowledgment || (logbookMessage.acknowledgment.isSuccess === null && <Gray>-</Gray>)}

frontend/src/features/Logbook/components/VesselLogbook/LogbookMessages/messages/PNOMessage.tsx

@@ -15,11 +15,11 @@ import { NoValue, SpeciesList, Table, TableBody, TableKey, TableRow, TableValue,
 import type { Gear, PNOMessageValue } from '../../../../Logbook.types'
 
 type PNOMessageProps = Readonly<{
-  isLessThanTwelveMetersVessel: boolean
+  isManuallyCreated: boolean
   message: PNOMessageValue
   tripGears: Gear[] | undefined
 }>
-export function PNOMessage({ isLessThanTwelveMetersVessel, message, tripGears }: PNOMessageProps) {
+export function PNOMessage({ isManuallyCreated, message, tripGears }: PNOMessageProps) {
   const getGearsApiQuery = useGetGearsQuery()
 
   const gearsWithName: Array<Gear> = useMemo(() => {
@@ -65,7 +65,7 @@ export function PNOMessage({ isLessThanTwelveMetersVessel, message, tripGears }:
                   <TableKey>Date prévue de débarque</TableKey>
                   <TableValue>{getDatetimeOrDash(message.predictedLandingDatetimeUtc)}</TableValue>
                 </TableRow>
-                {!isLessThanTwelveMetersVessel && (
+                {!isManuallyCreated && (
                   <TableRow>
                     <TableKey>Date de début de la marée</TableKey>
                     <TableValue>{getDatetimeOrDash(message.tripStartDate)}</TableValue>
@@ -94,7 +94,7 @@ export function PNOMessage({ isLessThanTwelveMetersVessel, message, tripGears }:
               </TableBody>
             </Table>
           </Zone>
-          {isLessThanTwelveMetersVessel && (
+          {isManuallyCreated && (
             <StyledFlatKeyValue
               column={[
                 {
@@ -115,7 +115,7 @@ export function PNOMessage({ isLessThanTwelveMetersVessel, message, tripGears }:
               <SpecyCatch
                 // eslint-disable-next-line react/no-array-index-key
                 key={index}
-                isOpenable={!isLessThanTwelveMetersVessel}
+                isOpenable={!isManuallyCreated}
                 specyCatch={speciesCatch}
                 weightType={WeightType.LIVE}
               >

frontend/src/features/Logbook/components/VesselLogbook/LogbookMessages/messages/constants.tsx

@@ -17,7 +17,7 @@ import type { LogbookMessage as LogbookMessageNamespace } from '../../../../Logb
 
 export function getComponentFromMessageType(
   logbookMessage: LogbookMessage | LogbookMessageNamespace.LogbookMessage,
-  isLessThanTwelveMetersVessel: boolean
+  isManuallyCreated: boolean
 ) {
   switch (logbookMessage.messageType) {
     case LogbookMessageType.DEP.code:
@@ -27,7 +27,7 @@ export function getComponentFromMessageType(
     case LogbookMessageType.PNO.code:
       return (
         <PNOMessage
-          isLessThanTwelveMetersVessel={isLessThanTwelveMetersVessel}
+          isManuallyCreated={isManuallyCreated}
           message={logbookMessage.message}
           tripGears={logbookMessage.tripGears}
         />

frontend/src/features/MainWindow/components/MapButtons/index.tsx

@@ -7,13 +7,13 @@ import { AlertsMapButton } from './AlertsMapButton'
 import { BeaconMalfunctionsMapButton } from './BeaconMalfunctionsMapButton'
 import { FavoriteVessels } from './FavoriteVessels'
 import { MissionsMenu } from './Missions'
-import { PriorNotificationListButton } from './PriorNotificationListButton'
 import { VesselFiltersMapButton } from './VesselFilters'
 import { VesselLabelsMapButton } from './VesselLabels'
 import { VesselVisibilityMapButton } from './VesselVisibility'
 import { useIsSuperUser } from '../../../../auth/hooks/useIsSuperUser'
 import { InterestPointMapButton } from '../../../InterestPoint/components/InterestPointMapButton'
 import { MeasurementMapButton } from '../../../Measurement/components/MeasurementMapButton'
+import { PriorNotificationListButton } from '../../../PriorNotification/components/PriorNotificationListButton'
 
 export function MapButtons() {
   const isSuperUser = useIsSuperUser()

frontend/src/features/PriorNotification/components/PriorNotificationCard/Header.tsx

@@ -2,20 +2,13 @@ import { CountryFlag } from '@components/CountryFlag'
 import { Accent, Icon, IconButton } from '@mtes-mct/monitor-ui'
 import styled from 'styled-components'
 
-import { getFirstTitleRowText } from './utils'
-
 import type { PriorNotification } from '../../PriorNotification.types'
 
 type HeaderProps = Readonly<{
   onClose: () => void
   priorNotificationDetail: PriorNotification.PriorNotificationDetail
 }>
 export function Header({ onClose, priorNotificationDetail }: HeaderProps) {
-  const firstTitleRowText = getFirstTitleRowText(
-    priorNotificationDetail.isLessThanTwelveMetersVessel,
-    priorNotificationDetail.logbookMessage.tripSegments
-  )
-
   return (
     <Wrapper>
       <Title>
@@ -24,7 +17,7 @@ export function Header({ onClose, priorNotificationDetail }: HeaderProps) {
             <Icon.Fishery />
           </TitleRowIconBox>
 
-          <span>{firstTitleRowText}</span>
+          <span>{`Préavis navire ${priorNotificationDetail.isLessThanTwelveMetersVessel ? '< 12 M' : '≥ 12 M'}`}</span>
         </TitleRow>
 
         <TitleRow>

frontend/src/features/PriorNotification/components/PriorNotificationCard/index.tsx

@@ -37,13 +37,13 @@ export function PriorNotificationCard() {
   const openedPriorNotificationReportId = useMainAppSelector(
     state => state.priorNotification.openedPriorNotificationReportId
   )
-  const isOpenedPriorNotificationManual = useMainAppSelector(
-    store => store.priorNotification.isOpenedPriorNotificationManual
+  const isOpenedPriorNotificationManuallyCreated = useMainAppSelector(
+    state => state.priorNotification.isOpenedPriorNotificationManuallyCreated
   )
   const { data: priorNotificationDetail } = useGetPriorNotificationDetailQuery(
-    openedPriorNotificationReportId && typeof isOpenedPriorNotificationManual === 'boolean'
+    openedPriorNotificationReportId && typeof isOpenedPriorNotificationManuallyCreated === 'boolean'
       ? {
-          isManuallyCreated: isOpenedPriorNotificationManual,
+          isManuallyCreated: isOpenedPriorNotificationManuallyCreated,
           reportId: openedPriorNotificationReportId
         }
       : skipToken,
@@ -59,6 +59,10 @@ export function PriorNotificationCard() {
   const isSent = [PriorNotification.State.SENT, PriorNotification.State.VERIFIED_AND_SENT].includes(
     priorNotificationDetail?.state as any
   )
+  const isPendingVerification = priorNotificationDetail?.state === PriorNotification.State.PENDING_VERIFICATION
+  const hasDesignatedPorts = priorNotificationDetail?.logbookMessage?.message?.pnoTypes?.find(
+    type => type.hasDesignatedPorts
+  )
 
   const close = () => {
     dispatch(priorNotificationActions.closePriorNotificationCard())
@@ -152,17 +156,16 @@ export function PriorNotificationCard() {
               )}
             />
 
+            {isPendingVerification && <Intro>Le préavis doit être vérifié par le CNSP avant sa diffusion.</Intro>}
             <Intro>
-              Le préavis doit être vérifié par le CNSP avant sa diffusion.
-              <br />
-              Le navire doit respecter un délai d’envoi et débarquer dans un port désigné.
+              Le navire doit respecter un délai d’envoi{hasDesignatedPorts && ' et débarquer dans un port désigné'}.
             </Intro>
 
             <hr />
 
             <LogbookMessage
               isFirst
-              isLessThanTwelveMetersVessel={priorNotificationDetail.isLessThanTwelveMetersVessel}
+              isManuallyCreated={isOpenedPriorNotificationManuallyCreated ?? false}
               logbookMessage={priorNotificationDetail.logbookMessage}
             />
 

frontend/src/features/PriorNotification/components/PriorNotificationForm/Card.tsx

@@ -42,14 +42,14 @@ export function Card({ isValidatingOnChange, onClose, onSubmit, onVerifyAndSend,
   const openedPriorNotificationReportId = useMainAppSelector(
     store => store.priorNotification.openedPriorNotificationReportId
   )
-  const isOpenedPriorNotificationManual = useMainAppSelector(
-    store => store.priorNotification.isOpenedPriorNotificationManual
+  const isOpenedPriorNotificationManuallyCreated = useMainAppSelector(
+    store => store.priorNotification.isOpenedPriorNotificationManuallyCreated
   )
 
   const { data: editedPriorNotificationDetail } = useGetPriorNotificationDetailQuery(
-    openedPriorNotificationReportId && typeof isOpenedPriorNotificationManual === 'boolean'
+    openedPriorNotificationReportId && typeof isOpenedPriorNotificationManuallyCreated === 'boolean'
       ? {
-          isManuallyCreated: isOpenedPriorNotificationManual,
+          isManuallyCreated: isOpenedPriorNotificationManuallyCreated,
           reportId: openedPriorNotificationReportId
         }
       : skipToken,
@@ -65,9 +65,11 @@ export function Card({ isValidatingOnChange, onClose, onSubmit, onVerifyAndSend,
   const applicableState = getApplicableState(editedPriorNotificationComputedValues, editedPriorNotificationDetail)
   const isNewPriorNotification = !reportId
   const isPendingSend = editedPriorNotificationDetail?.state === PriorNotification.State.PENDING_SEND
+  const isPendingVerification = editedPriorNotificationDetail?.state === PriorNotification.State.PENDING_VERIFICATION
   const isSent = [PriorNotification.State.SENT, PriorNotification.State.VERIFIED_AND_SENT].includes(
     editedPriorNotificationDetail?.state as any
   )
+  const hasDesignatedPorts = editedPriorNotificationComputedValues?.types?.find(type => type.hasDesignatedPorts)
 
   const handleClose = () => {
     if (dirty) {
@@ -155,19 +157,18 @@ export function Card({ isValidatingOnChange, onClose, onSubmit, onVerifyAndSend,
               types={editedPriorNotificationComputedValues?.types}
             />
 
-            {isNewPriorNotification && (
+            {isNewPriorNotification && !editedPriorNotificationComputedValues && (
               <Intro>
                 Veuillez renseigner les champs du formulaire pour définir le type de préavis et son statut, ainsi que le
                 segment de flotte et la note de risque du navire.
               </Intro>
             )}
-            {!isNewPriorNotification && (
-              <Intro>
-                Le préavis doit être vérifié par le CNSP avant sa diffusion.
-                <br />
-                Le navire doit respecter un délai d’envoi et débarquer dans un port désigné.
-              </Intro>
+            {!isNewPriorNotification && isPendingVerification && (
+              <Intro>Le préavis doit être vérifié par le CNSP avant sa diffusion.</Intro>
             )}
+            <Intro>
+              Le navire doit respecter un délai d’envoi{hasDesignatedPorts && ' et débarquer dans un port désigné'}.
+            </Intro>
 
             <hr />
 

frontend/src/features/PriorNotification/components/PriorNotificationForm/fields/FormikFishingCatchesMultiSelect/index.tsx

@@ -68,7 +68,7 @@ export function FormikFishingCatchesMultiSelect() {
                 weight: 0.1
               }
             ],
-            { cacheKey: 'SPECIES_AS_OPTIONS', isStrict: true }
+            { cacheKey: 'PNO_SPECIES_AS_OPTIONS', isStrict: true }
           )
         : undefined,
     [filteredSpeciesAsOptions]
@@ -89,7 +89,6 @@ export function FormikFishingCatchesMultiSelect() {
         onChange={add}
         options={filteredSpeciesAsOptions ?? []}
         optionValueKey="code"
-        searchable
         virtualized
       />