diff --git a/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/ReportingSummary.kt b/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/ReportingTwelveMonthsSummary.kt similarity index 84% rename from backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/ReportingSummary.kt rename to backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/ReportingTwelveMonthsSummary.kt index 9cd02619a2..e50b61489f 100644 --- a/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/ReportingSummary.kt +++ b/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/ReportingTwelveMonthsSummary.kt @@ -1,6 +1,6 @@ package fr.gouv.cnsp.monitorfish.domain.entities.reporting -data class ReportingSummary( +data class ReportingTwelveMonthsSummary( val infractionSuspicionsSummary: List, val numberOfInfractionSuspicions: Int, val numberOfObservations: Int, diff --git a/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/VesselReportings.kt b/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/VesselReportings.kt index 7ff37d4770..88af612b84 100644 --- a/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/VesselReportings.kt +++ b/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/entities/reporting/VesselReportings.kt @@ -3,7 +3,7 @@ package fr.gouv.cnsp.monitorfish.domain.entities.reporting typealias Year = Int class VesselReportings( - val summary: ReportingSummary, + val summary: ReportingTwelveMonthsSummary, val current: List, val archived: Map>, ) diff --git a/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/use_cases/reporting/GetVesselReportings.kt b/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/use_cases/reporting/GetVesselReportings.kt index 0027ae3b5b..53b1ae6458 100644 --- a/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/use_cases/reporting/GetVesselReportings.kt +++ b/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/domain/use_cases/reporting/GetVesselReportings.kt @@ -77,19 +77,26 @@ class GetVesselReportings( } logger.info("TIME_RECORD - 'archivedYearsToReportings' took $archivedYearsToReportingsTimeTaken") + val twelveMonthsAgo = ZonedDateTime.now().minusMonths(12) + val lastTwelveMonthsReportings = reportings.filter { reporting -> + reporting.validationDate?.isAfter(twelveMonthsAgo) + ?: reporting.creationDate.isAfter(twelveMonthsAgo) + } + val (infractionSuspicionsSummary, infractionSuspicionsSummaryTimeTaken) = measureTimedValue { - getInfractionSuspicionsSummary(reportings.filter { it.isArchived }) + getInfractionSuspicionsSummary(lastTwelveMonthsReportings.filter { it.isArchived }) } logger.info("TIME_RECORD - 'infractionSuspicionsSummary' took $infractionSuspicionsSummaryTimeTaken") + val numberOfInfractionSuspicions = infractionSuspicionsSummary.sumOf { it.numberOfOccurrences } val numberOfObservation = - reportings + lastTwelveMonthsReportings .filter { it.isArchived && it.type == ReportingType.OBSERVATION } .size - val reportingSummary = - ReportingSummary( + val reportingTwelveMonthsSummary = + ReportingTwelveMonthsSummary( infractionSuspicionsSummary = infractionSuspicionsSummary, numberOfInfractionSuspicions = numberOfInfractionSuspicions, numberOfObservations = numberOfObservation, @@ -98,7 +105,7 @@ class GetVesselReportings( return VesselReportings( current = current, archived = archivedYearsToReportings, - summary = reportingSummary, + summary = reportingTwelveMonthsSummary, ) } diff --git a/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/infrastructure/api/outputs/ReportingSummaryDataOutput.kt b/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/infrastructure/api/outputs/ReportingSummaryDataOutput.kt index ebf7a32da7..e5dd2a1d5e 100644 --- a/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/infrastructure/api/outputs/ReportingSummaryDataOutput.kt +++ b/backend/src/main/kotlin/fr/gouv/cnsp/monitorfish/infrastructure/api/outputs/ReportingSummaryDataOutput.kt @@ -1,6 +1,6 @@ package fr.gouv.cnsp.monitorfish.infrastructure.api.outputs -import fr.gouv.cnsp.monitorfish.domain.entities.reporting.ReportingSummary +import fr.gouv.cnsp.monitorfish.domain.entities.reporting.ReportingTwelveMonthsSummary data class ReportingSummaryDataOutput( val infractionSuspicionsSummary: List, @@ -8,14 +8,14 @@ data class ReportingSummaryDataOutput( val numberOfObservations: Int, ) { companion object { - fun fromReportingSummary(reportingSummary: ReportingSummary) = + fun fromReportingSummary(reportingTwelveMonthsSummary: ReportingTwelveMonthsSummary) = ReportingSummaryDataOutput( infractionSuspicionsSummary = - reportingSummary.infractionSuspicionsSummary.map { + reportingTwelveMonthsSummary.infractionSuspicionsSummary.map { ReportingTitleAndNumberOfOccurrencesDataOutput.fromReportingTitleAndNumberOfOccurrences(it) }, - numberOfInfractionSuspicions = reportingSummary.numberOfInfractionSuspicions, - numberOfObservations = reportingSummary.numberOfObservations, + numberOfInfractionSuspicions = reportingTwelveMonthsSummary.numberOfInfractionSuspicions, + numberOfObservations = reportingTwelveMonthsSummary.numberOfObservations, ) } } diff --git a/backend/src/test/kotlin/fr/gouv/cnsp/monitorfish/domain/use_cases/reporting/GetVesselReportingsUTests.kt b/backend/src/test/kotlin/fr/gouv/cnsp/monitorfish/domain/use_cases/reporting/GetVesselReportingsUTests.kt index 4b63f4f8ca..65b6437d28 100644 --- a/backend/src/test/kotlin/fr/gouv/cnsp/monitorfish/domain/use_cases/reporting/GetVesselReportingsUTests.kt +++ b/backend/src/test/kotlin/fr/gouv/cnsp/monitorfish/domain/use_cases/reporting/GetVesselReportingsUTests.kt @@ -314,7 +314,7 @@ class GetVesselReportingsUTests { val alertReporting1 = createCurrentReporting( id = 11223, - validationDate = ZonedDateTime.parse("2024-01-01T12:00:00Z"), + validationDate = ZonedDateTime.now().minusMonths(11), internalReferenceNumber = "FR55667788", type = ReportingType.ALERT, alertType = AlertTypeMapping.TWELVE_MILES_FISHING_ALERT, @@ -324,7 +324,7 @@ class GetVesselReportingsUTests { val alertReporting2 = createCurrentReporting( id = 22334, - validationDate = ZonedDateTime.parse("2024-02-01T12:00:00Z"), + validationDate = ZonedDateTime.now().minusMonths(11), internalReferenceNumber = "FR55667788", type = ReportingType.ALERT, alertType = AlertTypeMapping.TWELVE_MILES_FISHING_ALERT, @@ -334,7 +334,7 @@ class GetVesselReportingsUTests { val infractionReporting = createCurrentReporting( id = 33445, - validationDate = ZonedDateTime.parse("2024-03-01T12:00:00Z"), + validationDate = ZonedDateTime.now().minusMonths(10), internalReferenceNumber = "FR55667788", type = ReportingType.INFRACTION_SUSPICION, alertType = null, @@ -345,7 +345,7 @@ class GetVesselReportingsUTests { val infractionReporting2 = createCurrentReporting( id = 33456, - validationDate = ZonedDateTime.parse("2024-03-01T12:00:00Z"), + validationDate = ZonedDateTime.now().minusMonths(8), internalReferenceNumber = "FR55667788", type = ReportingType.INFRACTION_SUSPICION, alertType = null, @@ -355,7 +355,7 @@ class GetVesselReportingsUTests { val alertReporting3 = createCurrentReporting( id = 44556, - validationDate = ZonedDateTime.parse("2024-04-01T12:00:00Z"), + validationDate = ZonedDateTime.now().minusMonths(7), internalReferenceNumber = "FR55667788", type = ReportingType.ALERT, alertType = AlertTypeMapping.MISSING_FAR_48_HOURS_ALERT, @@ -365,7 +365,7 @@ class GetVesselReportingsUTests { val observation = createCurrentReporting( id = 44558, - validationDate = ZonedDateTime.parse("2024-04-01T12:00:00Z"), + validationDate = ZonedDateTime.now().minusMonths(4), internalReferenceNumber = "FR55667788", type = ReportingType.OBSERVATION, alertType = null, diff --git a/backend/src/test/kotlin/fr/gouv/cnsp/monitorfish/infrastructure/api/bff/VesselControllerITests.kt b/backend/src/test/kotlin/fr/gouv/cnsp/monitorfish/infrastructure/api/bff/VesselControllerITests.kt index 5e1ebb2235..aa64a8952c 100644 --- a/backend/src/test/kotlin/fr/gouv/cnsp/monitorfish/infrastructure/api/bff/VesselControllerITests.kt +++ b/backend/src/test/kotlin/fr/gouv/cnsp/monitorfish/infrastructure/api/bff/VesselControllerITests.kt @@ -777,7 +777,7 @@ class VesselControllerITests { ).willReturn( VesselReportings( summary = - ReportingSummary( + ReportingTwelveMonthsSummary( infractionSuspicionsSummary = listOf( ReportingTitleAndNumberOfOccurrences( @@ -868,7 +868,7 @@ class VesselControllerITests { ).willReturn( VesselReportings( summary = - ReportingSummary( + ReportingTwelveMonthsSummary( infractionSuspicionsSummary = listOf(), numberOfInfractionSuspicions = 0, numberOfObservations = 0, diff --git a/frontend/cypress/e2e/main_window/vessel_sidebar/reporting.spec.ts b/frontend/cypress/e2e/main_window/vessel_sidebar/reporting.spec.ts index 1f28967bc1..396520040d 100644 --- a/frontend/cypress/e2e/main_window/vessel_sidebar/reporting.spec.ts +++ b/frontend/cypress/e2e/main_window/vessel_sidebar/reporting.spec.ts @@ -44,11 +44,12 @@ context('Vessel sidebar reporting tab', () => { cy.get('*[data-cy="side-window-reporting-tab"]').click() cy.get('[data-cy="side-window-sub-menu-NAMO"]').click() cy.wait(200) - cy.get('*[data-cy="ReportingList-reporting"]').first().contains('FRAIS AVIS MODE') + cy.get('*[data-cy="ReportingTable-reporting"]').first().contains('FRAIS AVIS MODE') // Archive the newly created reporting cy.get('table .rs-checkbox-wrapper').eq(1).click({ force: true }) cy.clickButton('Archiver 1 signalement') + cy.clickButton('Archiver') }) it('An observation reporting should be modified to an Infraction suspicion', () => { @@ -91,7 +92,7 @@ context('Vessel sidebar reporting tab', () => { cy.intercept('PUT', `/bff/v1/reportings/${createdPriorNotification.id}`).as('updateReporting') cy.get('*[data-cy="reporting-card"]').first().contains('Fin de validité le 08/06/2166') - cy.get('*[data-cy^="edit-reporting-card"]').first().click({ timeout: 10000 }) + cy.get('*[data-cy^="edit-reporting-card"]').first().scrollIntoView().click({ timeout: 10000 }) cy.fill('Type de signalement', 'Infraction (suspicion)') cy.fill('Natinf', '7059') const nextDate = getUtcDateInMultipleFormats('2200-06-08T13:54') @@ -102,7 +103,7 @@ context('Vessel sidebar reporting tab', () => { cy.get('*[data-cy="reporting-card"]').first().contains('NATINF 7059') cy.get('*[data-cy="reporting-card"]').first().contains('Fin de validité le 08/06/2200') - cy.get('*[data-cy="delete-reporting-card"]').eq(0).click() + cy.get('*[data-cy="delete-reporting-card"]').eq(0).scrollIntoView().click() // Then, we confirm the reporting deletion cy.clickButton('Supprimer') }) @@ -130,9 +131,8 @@ context('Vessel sidebar reporting tab', () => { // Then cy.get('*[data-cy="reporting-card"]').should('not.exist') - cy.get('*[data-cy="vessel-sidebar-reporting-tab-history-button"]').click() - cy.get('*[data-cy="vessel-sidebar-reporting-tab-history"]').should('exist') - cy.get('*[data-cy="vessel-sidebar-reporting-tab-archive-year"]').eq(0).click() + cy.get('*[data-cy="vessel-sidebar-archived-reporting"]').should('exist') + cy.get('*[data-cy="vessel-sidebar-reporting-archive-year"]').eq(0).click() cy.get('*[data-cy="reporting-card"]').eq(0).contains('OFB SD 56 / Sortie non autorisée') cy.get('*[data-cy^="vessel-search-selected-vessel-close-title"]', { timeout: 10000 }).click() }) @@ -154,12 +154,11 @@ context('Vessel sidebar reporting tab', () => { addAndCreateReportingWithinVesselSidebar() cy.get('[data-cy="archive-reporting-card"]').eq(0).click() - cy.get('*[data-cy="vessel-sidebar-reporting-tab-history-button"]').click() - cy.get('*[data-cy="vessel-sidebar-reporting-tab-history"]').should('exist') + cy.get('*[data-cy="vessel-sidebar-archived-reporting"]').should('exist') // Then // Summary - cy.get('[data-cy="vessel-reporting-summary"]').contains('Résumé des derniers signalements (6 dernières années)') + cy.get('[data-cy="vessel-reporting-summary"]').contains('Résumé des derniers signalements (12 derniers mois)') cy.get('[data-cy="vessel-reporting-summary"]').contains('Signalement "3 milles - Chaluts (NATINF 7059)"') cy.get('[data-cy="vessel-reporting-summary"]').contains( "Peche maritime non autorisee dans les eaux maritimes ou salees francaises par un navire de pays tiers a l'union europeenne (NATINF 2608)" @@ -181,14 +180,13 @@ context('Vessel sidebar reporting tab', () => { cy.wait(100) // When - cy.get('*[data-cy="vessel-sidebar-reporting-tab-history-button"]').click() - cy.get('*[data-cy="vessel-sidebar-reporting-tab-history"]').should('exist') - cy.get('*[data-cy="vessel-sidebar-reporting-tab-archive-year"]').should('have.length', 6) + cy.get('*[data-cy="vessel-sidebar-archived-reporting"]').should('exist') + cy.get('*[data-cy="vessel-sidebar-reporting-archive-year"]').should('have.length', 4) cy.clickButton('Afficher plus de signalements') // Then cy.wait('@getVesselReportings') - cy.get('*[data-cy="vessel-sidebar-reporting-tab-archive-year"]').should('have.length', 7) + cy.get('*[data-cy="vessel-sidebar-reporting-archive-year"]').should('have.length', 5) }) it('Reporting Should be deleted', () => { @@ -209,10 +207,10 @@ context('Vessel sidebar reporting tab', () => { // When cy.get('*[data-cy="vessel-menu-reporting"]').contains(1) cy.get('*[data-cy="reporting-card"]').eq(0).contains('OFB SD 56 / Sortie non autorisée') - cy.get('*[data-cy="delete-reporting-card"]').eq(0).click() + cy.get('*[data-cy="delete-reporting-card"]').eq(0).scrollIntoView().click() // First, we do not confirm the reporting deletion cy.clickButton('Annuler', { withinSelector: '.Component-Dialog' }) - cy.get('*[data-cy="delete-reporting-card"]').eq(0).click() + cy.get('*[data-cy="delete-reporting-card"]').eq(0).scrollIntoView().click() // Then, we confirm the reporting deletion cy.clickButton('Supprimer') diff --git a/frontend/cypress/e2e/side_window/reporting_list/actions.spec.ts b/frontend/cypress/e2e/side_window/reporting_list/actions.spec.ts index 9437cbedd1..12218ad54e 100644 --- a/frontend/cypress/e2e/side_window/reporting_list/actions.spec.ts +++ b/frontend/cypress/e2e/side_window/reporting_list/actions.spec.ts @@ -15,7 +15,7 @@ context('Side Window > Reporting List > Actions', () => { cy.getDataCy('side-window-sub-menu-NAMO').click() cy.fill('Observations', false) - cy.getDataCy('ReportingList-reporting').then($reportingRows => { + cy.getDataCy('ReportingTable-reporting').then($reportingRows => { const numberOfReportings = $reportingRows.length // When @@ -31,7 +31,7 @@ context('Side Window > Reporting List > Actions', () => { // Then assert.deepEqual(archiveInterception.request.body, [createdReportingId]) - cy.getDataCy('ReportingList-reporting').should('have.length', numberOfReportings - 1) + cy.getDataCy('ReportingTable-reporting').should('have.length', numberOfReportings - 1) }) }) }) @@ -47,7 +47,7 @@ context('Side Window > Reporting List > Actions', () => { cy.getDataCy('side-window-sub-menu-NAMO').click() cy.fill('Observations', false) - cy.getDataCy('ReportingList-reporting').then($reportingRows => { + cy.getDataCy('ReportingTable-reporting').then($reportingRows => { const numberOfReportings = $reportingRows.length // When @@ -63,13 +63,13 @@ context('Side Window > Reporting List > Actions', () => { // Then assert.deepEqual(archiveInterception.request.body, [createdReportingId]) - cy.getDataCy('ReportingList-reporting').should('have.length', numberOfReportings - 1) + cy.getDataCy('ReportingTable-reporting').should('have.length', numberOfReportings - 1) }) }) }) }) - it('A Reporting Should be edited', () => { + it.only('A Reporting Should be edited', () => { cy.intercept('PUT', 'bff/v1/reportings/7').as('updateReporting') // Given @@ -95,7 +95,7 @@ context('Side Window > Reporting List > Actions', () => { }) cy.wait(200) - cy.getDataCy('ReportingList-reporting').should('have.length.greaterThan', 1) + cy.getDataCy('ReportingTable-reporting').should('have.length.greaterThan', 1) cy.get('tr:contains("COURANT MAIN PROFESSEUR")').contains('DML 56') cy.get('tr:contains("COURANT MAIN PROFESSEUR")').contains(23581) @@ -103,7 +103,7 @@ context('Side Window > Reporting List > Actions', () => { * The reporting type must be modified to OBSERVATION */ - cy.getDataCy('ReportingList-reporting').then($reportingRows => { + cy.getDataCy('ReportingTable-reporting').then($reportingRows => { const numberOfReportings = $reportingRows.length cy.clickButton('Editer le signalement', { @@ -121,7 +121,7 @@ context('Side Window > Reporting List > Actions', () => { expect(request.body.authorTrigram).contains('LTH') expect(response && response.statusCode).equal(200) - cy.getDataCy('ReportingList-reporting').should('have.length', numberOfReportings) + cy.getDataCy('ReportingTable-reporting').should('have.length', numberOfReportings) }) }) }) diff --git a/frontend/src/features/Logbook/components/VesselLogbook/index.tsx b/frontend/src/features/Logbook/components/VesselLogbook/index.tsx index dfec3a3faf..de54c36052 100644 --- a/frontend/src/features/Logbook/components/VesselLogbook/index.tsx +++ b/frontend/src/features/Logbook/components/VesselLogbook/index.tsx @@ -105,7 +105,7 @@ export function VesselLogbook() { } const NoFishingActivities = styled.div` - padding: 50px 5px 0px 5px; + padding: 50px 5px 0 5px; margin: 10px 10px; height: 70px; background: ${p => p.theme.color.white}; @@ -113,10 +113,7 @@ const NoFishingActivities = styled.div` text-align: center; ` -const Wrapper = styled.div` - overflow-x: hidden; - max-height: 700px; -` +const Wrapper = styled.div`` const UpdateFishingActivities = styled.div` background: ${p => p.theme.color.white}; @@ -126,7 +123,7 @@ const UpdateFishingActivities = styled.div` width: -moz-available; width: -webkit-fill-available; height: 55px; - box-shadow: -10px 5px 7px 0px rgba(81, 81, 81, 0.2); + box-shadow: -10px 5px 7px 0 rgba(81, 81, 81, 0.2); z-index: 9; ` diff --git a/frontend/src/features/PriorNotification/components/ReportingList.tsx b/frontend/src/features/PriorNotification/components/ReportingList.tsx index 61598c4c2d..0fb5140808 100644 --- a/frontend/src/features/PriorNotification/components/ReportingList.tsx +++ b/frontend/src/features/PriorNotification/components/ReportingList.tsx @@ -1,9 +1,14 @@ +import { RTK_FIVE_MINUTES_POLLING_QUERY_OPTIONS } from '@api/constants' import { ConfirmationModal } from '@components/ConfirmationModal' +import { FingerprintSpinner } from '@components/FingerprintSpinner' import { SideWindowCard } from '@components/SideWindowCard' import { CurrentReportingList } from '@features/Reporting/components/CurrentReportingList' +import { getDefaultReportingsStartDate } from '@features/Reporting/utils' +import { useGetVesselReportingsByVesselIdentityQuery } from '@features/Vessel/vesselApi' import { useMainAppDispatch } from '@hooks/useMainAppDispatch' import { useMainAppSelector } from '@hooks/useMainAppSelector' -import { Icon, LinkButton } from '@mtes-mct/monitor-ui' +import { Icon, LinkButton, THEME } from '@mtes-mct/monitor-ui' +import { skipToken } from '@reduxjs/toolkit/query' import { assertNotNullish } from '@utils/assertNotNullish' import { useIsSuperUser } from 'auth/hooks/useIsSuperUser' import { useCallback, useState } from 'react' @@ -22,6 +27,16 @@ export function ReportingList() { assertNotNullish(vesselIdentity) const isSuperUser = useIsSuperUser() + const { data: vesselReportings, isFetching } = useGetVesselReportingsByVesselIdentityQuery( + vesselIdentity + ? { + fromDate: getDefaultReportingsStartDate().toISOString(), + vesselIdentity + } + : skipToken, + RTK_FIVE_MINUTES_POLLING_QUERY_OPTIONS + ) + const [isCancellationConfirmationModalOpen, setIsCancellationConfirmationModalOpen] = useState(false) const close = () => { @@ -65,12 +80,18 @@ export function ReportingList() { )} - + {(!vesselReportings || isFetching) && ( + + )} + {!!vesselReportings && ( + + )} {isCancellationConfirmationModalOpen && ( diff --git a/frontend/src/features/Reporting/components/ArchivedReportingList/YearReportings.tsx b/frontend/src/features/Reporting/components/ArchivedReportingList/YearReportings.tsx index 2e86074544..1f2d5b1c12 100644 --- a/frontend/src/features/Reporting/components/ArchivedReportingList/YearReportings.tsx +++ b/frontend/src/features/Reporting/components/ArchivedReportingList/YearReportings.tsx @@ -50,7 +50,7 @@ export function YearReportings({ reportingAndOccurences, year }: YearReportingsP +
Historique des signalements
{reportingsByYearAsPairs.length === 0 && ( {`Aucun signalement depuis ${customDayjs(fromDate).get('year')}`} @@ -57,7 +57,7 @@ const NoReporting = styled.div` const SeeMoreBackground = styled.div` background: ${THEME.color.white}; - margin: 0px 5px 5px 5px; + margin: 0 5px 5px 5px; padding: 10px 0 5px 0; text-align: center; width: 100%; diff --git a/frontend/src/features/Reporting/components/CurrentReportingList/Content.tsx b/frontend/src/features/Reporting/components/CurrentReportingList/Content.tsx index 9378c4b3ee..8ef7a5571e 100644 --- a/frontend/src/features/Reporting/components/CurrentReportingList/Content.tsx +++ b/frontend/src/features/Reporting/components/CurrentReportingList/Content.tsx @@ -1,4 +1,3 @@ -import { VesselReportingListTab } from '@features/Vessel/components/VesselSidebar/ReportingList/constants' import { vesselActions } from '@features/Vessel/slice' import { useMainAppDispatch } from '@hooks/useMainAppDispatch' import { Accent, Button, LinkButton } from '@mtes-mct/monitor-ui' @@ -11,12 +10,12 @@ import { EditReporting } from './EditReporting' import { ReportingCard } from '../ReportingCard' import type { Reporting, ReportingAndOccurrences, VesselReportings } from '@features/Reporting/types' -import type { VesselIdentity } from 'domain/entities/vessel/types' +import type { Vessel } from '@features/Vessel/Vessel.types' type ContentProps = Readonly<{ className: string | undefined onIsDirty: ((isDirty: boolean) => void) | undefined - vesselIdentity: VesselIdentity + vesselIdentity: Vessel.VesselIdentity vesselReportings: VesselReportings withOpenedNewReportingForm: boolean withVesselSidebarHistoryLink: boolean @@ -54,7 +53,6 @@ export function Content({ dispatch(showVessel(vesselIdentity, false, true)) dispatch(vesselActions.setSelectedVesselSidebarTab(VesselSidebarTab.REPORTING)) - dispatch(vesselActions.setSelectedVesselSidebarReportingListTab(VesselReportingListTab.REPORTING_HISTORY)) } return ( @@ -102,14 +100,14 @@ const Wrapper = styled.div` color: ${p => p.theme.color.slateGray}; display: flex; flex-direction: column; - margin: 10px 5px 5px 5px; - padding: 16px; + margin: 5px 5px 0 5px; + padding: 16px 16px 0 16px; text-align: left; ` const NewReportingButton = styled(Button)` align-self: flex-start; - margin: 0px 10px 10px 0px; + margin: 0 10px 10px 0; ` const NoReporting = styled.div` diff --git a/frontend/src/features/Reporting/components/CurrentReportingList/EditReporting.tsx b/frontend/src/features/Reporting/components/CurrentReportingList/EditReporting.tsx index e84f22a078..0c79054fcd 100644 --- a/frontend/src/features/Reporting/components/CurrentReportingList/EditReporting.tsx +++ b/frontend/src/features/Reporting/components/CurrentReportingList/EditReporting.tsx @@ -6,13 +6,13 @@ import { ReportingForm } from '../ReportingForm' import { Loader as ReportingFormLoader } from '../ReportingForm/Loader' import type { Reporting } from '@features/Reporting/types' -import type { VesselIdentity } from 'domain/entities/vessel/types' +import type { Vessel } from '@features/Vessel/Vessel.types' type EditReportingProps = Readonly<{ editedReporting: Reporting.EditableReporting | undefined onClose: () => void onIsDirty: ((isDirty: boolean) => void) | undefined - vesselIdentity: VesselIdentity + vesselIdentity: Vessel.VesselIdentity }> export function EditReporting({ editedReporting, onClose, onIsDirty, vesselIdentity }: EditReportingProps) { return ( diff --git a/frontend/src/features/Reporting/components/CurrentReportingList/index.tsx b/frontend/src/features/Reporting/components/CurrentReportingList/index.tsx index bf0a797739..ea8f81d013 100644 --- a/frontend/src/features/Reporting/components/CurrentReportingList/index.tsx +++ b/frontend/src/features/Reporting/components/CurrentReportingList/index.tsx @@ -1,44 +1,24 @@ -import { RTK_FIVE_MINUTES_POLLING_QUERY_OPTIONS } from '@api/constants' -import { FingerprintSpinner } from '@components/FingerprintSpinner' -import { getDefaultReportingsStartDate } from '@features/Reporting/utils' -import { useGetVesselReportingsByVesselIdentityQuery } from '@features/Vessel/vesselApi' -import { THEME } from '@mtes-mct/monitor-ui' -import { skipToken } from '@reduxjs/toolkit/query' - import { Content } from './Content' +import type { VesselReportings } from '@features/Reporting/types' import type { Vessel } from '@features/Vessel/Vessel.types' type CurrentReportingListProps = Readonly<{ className?: string onIsDirty?: (isDirty: boolean) => void - startDate?: Date - vesselIdentity: Vessel.VesselIdentity | undefined + vesselIdentity: Vessel.VesselIdentity + vesselReportings: VesselReportings withOpenedNewReportingForm?: boolean withVesselSidebarHistoryLink?: boolean }> export function CurrentReportingList({ className, onIsDirty, - startDate = getDefaultReportingsStartDate(), vesselIdentity, + vesselReportings, withOpenedNewReportingForm = false, withVesselSidebarHistoryLink = false }: CurrentReportingListProps) { - const { data: vesselReportings, isFetching } = useGetVesselReportingsByVesselIdentityQuery( - vesselIdentity - ? { - fromDate: startDate.toISOString(), - vesselIdentity - } - : skipToken, - RTK_FIVE_MINUTES_POLLING_QUERY_OPTIONS - ) - - if (!vesselIdentity || !vesselReportings || isFetching) { - return - } - return ( -export function ReportingListSummary({ fromDate, vesselReportings }: ReportingListSummaryProps) { - const yearsDepth = customDayjs().utc().get('year') - customDayjs(fromDate).get('year') + 1 - +export function TwelveMonthsSummary({ reportingSummary }: ReportingListSummaryProps) { return ( -
Résumé des derniers signalements ({yearsDepth} dernières années)
+
Résumé des derniers signalements (12 derniers mois)
- + diff --git a/frontend/src/features/Reporting/components/ReportingTable/index.tsx b/frontend/src/features/Reporting/components/ReportingTable/index.tsx index c204ff07e9..1405538632 100644 --- a/frontend/src/features/Reporting/components/ReportingTable/index.tsx +++ b/frontend/src/features/Reporting/components/ReportingTable/index.tsx @@ -175,7 +175,7 @@ export function ReportingTable({ isFromUrl, selectedSeafrontGroup }: ReportingTa rowVirtualizer?.measureElement(node)} - data-cy="ReportingList-reporting" + data-cy="ReportingTable-reporting" data-index={virtualRow?.index} > {row?.getVisibleCells().map(cell => ( diff --git a/frontend/src/features/Reporting/components/VesselReportings/index.tsx b/frontend/src/features/Reporting/components/VesselReportings/index.tsx new file mode 100644 index 0000000000..1208971426 --- /dev/null +++ b/frontend/src/features/Reporting/components/VesselReportings/index.tsx @@ -0,0 +1,60 @@ +import { RTK_FIVE_MINUTES_POLLING_QUERY_OPTIONS } from '@api/constants' +import { FingerprintSpinner } from '@components/FingerprintSpinner' +import { ArchivedReportingList } from '@features/Reporting/components/ArchivedReportingList' +import { CurrentReportingList } from '@features/Reporting/components/CurrentReportingList' +import { TwelveMonthsSummary } from '@features/Reporting/components/ReportingListSummary' +import { getDefaultReportingsStartDate } from '@features/Reporting/utils' +import { getVesselIdentityFromLegacyVesselIdentity } from '@features/Vessel/utils' +import { useGetVesselReportingsByVesselIdentityQuery } from '@features/Vessel/vesselApi' +import { useMainAppSelector } from '@hooks/useMainAppSelector' +import { customDayjs, THEME } from '@mtes-mct/monitor-ui' +import { skipToken } from '@reduxjs/toolkit/query' +import { useMemo, useState } from 'react' +import styled from 'styled-components' + +export function VesselReportings() { + const selectedLegacyVesselIdentity = useMainAppSelector(state => state.vessel.selectedVesselIdentity) + + const [startDate, setStartDate] = useState(getDefaultReportingsStartDate()) + + const selectedVesselIdentity = useMemo( + () => + selectedLegacyVesselIdentity + ? getVesselIdentityFromLegacyVesselIdentity(selectedLegacyVesselIdentity) + : undefined, + [selectedLegacyVesselIdentity] + ) + + const { data: vesselReportings } = useGetVesselReportingsByVesselIdentityQuery( + selectedVesselIdentity + ? { + fromDate: startDate.toISOString(), + vesselIdentity: selectedVesselIdentity + } + : skipToken, + RTK_FIVE_MINUTES_POLLING_QUERY_OPTIONS + ) + + const decreaseStartDate = () => { + setStartDate(customDayjs(startDate).subtract(1, 'year').toDate()) + } + + if (!selectedVesselIdentity || !vesselReportings) { + return + } + + return ( + + + + + + ) +} + +const Body = styled.div` + display: flex; + flex-direction: column; + flex-grow: 1; + padding: 5px 5px 10px 5px; +` diff --git a/frontend/src/features/Reporting/utils.ts b/frontend/src/features/Reporting/utils.ts index c5dd1243ff..932c7a8c14 100644 --- a/frontend/src/features/Reporting/utils.ts +++ b/frontend/src/features/Reporting/utils.ts @@ -3,7 +3,7 @@ import { customDayjs } from '@mtes-mct/monitor-ui' import { ReportingType, ReportingTypeCharacteristics } from './types' export function getDefaultReportingsStartDate(): Date { - return customDayjs().utc().subtract(5, 'year').startOf('year').toDate() + return customDayjs().utc().subtract(3, 'year').startOf('year').toDate() } // TODO This should be named differently to avoid confusion with `ReportingType.INFRACTION_SUSPICION` type. diff --git a/frontend/src/features/Vessel/components/VesselSidebar/Body.tsx b/frontend/src/features/Vessel/components/VesselSidebar/Body.tsx index fb0e1c6ce5..e5a19bb343 100644 --- a/frontend/src/features/Vessel/components/VesselSidebar/Body.tsx +++ b/frontend/src/features/Vessel/components/VesselSidebar/Body.tsx @@ -5,16 +5,16 @@ import { DisplayedErrorKey } from '@libs/DisplayedError/constants' import { Accent, Button } from '@mtes-mct/monitor-ui' import styled from 'styled-components' -import { Controls } from './Controls' +import { VesselControls } from './Controls' import { VesselEquipment } from './Equipment/VesselEquipment' -import { Identity } from './Identity' -import { ReportingList } from './ReportingList' import { VesselSummary } from './Summary' +import { VesselIdentity } from './VesselIdentity' import { AlertWarning } from './warnings/AlertWarning' import { BeaconMalfunctionWarning } from './warnings/BeaconMalfunctionWarning' import { useIsSuperUser } from '../../../../auth/hooks/useIsSuperUser' import { VesselSidebarTab } from '../../../../domain/entities/vessel/vessel' import { VesselLogbook } from '../../../Logbook/components/VesselLogbook' +import { VesselReportings } from '../../../Reporting/components/VesselReportings' export function Body() { const isSuperUser = useIsSuperUser() @@ -43,16 +43,18 @@ export function Body() { } return ( - + <> {isSuperUser && selectedVessel && } - {isSuperUser && } - {selectedVesselSidebarTab === VesselSidebarTab.SUMMARY && } - {selectedVesselSidebarTab === VesselSidebarTab.IDENTITY && } - {selectedVesselSidebarTab === VesselSidebarTab.VOYAGES && } - {selectedVesselSidebarTab === VesselSidebarTab.CONTROLS && } - {isSuperUser && selectedVesselSidebarTab === VesselSidebarTab.REPORTING && } - {selectedVesselSidebarTab === VesselSidebarTab.ERSVMS && } - + {isSuperUser && selectedVessel && } + + {selectedVesselSidebarTab === VesselSidebarTab.SUMMARY && } + {selectedVesselSidebarTab === VesselSidebarTab.IDENTITY && } + {selectedVesselSidebarTab === VesselSidebarTab.VOYAGES && } + {selectedVesselSidebarTab === VesselSidebarTab.CONTROLS && } + {isSuperUser && selectedVesselSidebarTab === VesselSidebarTab.REPORTING && } + {selectedVesselSidebarTab === VesselSidebarTab.ERSVMS && } + + ) } @@ -61,7 +63,8 @@ const Wrapper = styled.div<{ }>` padding: 0; background: ${p => p.theme.color.gainsboro}; - max-height: ${p => (p.$hasHealthcheckTextWarning ? 80 : 82)}vh; + max-height: ${p => (p.$hasHealthcheckTextWarning ? 74 : 76)}vh; + overflow-x: hidden; ` const ErrorFallback = styled.div` diff --git a/frontend/src/features/Vessel/components/VesselSidebar/Controls/index.tsx b/frontend/src/features/Vessel/components/VesselSidebar/Controls/index.tsx index 4d5225ae6a..0944e09364 100644 --- a/frontend/src/features/Vessel/components/VesselSidebar/Controls/index.tsx +++ b/frontend/src/features/Vessel/components/VesselSidebar/Controls/index.tsx @@ -16,7 +16,7 @@ import { getVesselControls } from '../../../../../domain/use_cases/mission/getVe import { useMainAppDispatch } from '../../../../../hooks/useMainAppDispatch' import { useMainAppSelector } from '../../../../../hooks/useMainAppSelector' -export function Controls() { +export function VesselControls() { const dispatch = useMainAppDispatch() const selectedVessel = useMainAppSelector(state => state.vessel.selectedVessel) @@ -183,10 +183,4 @@ const UpdateControlsButton = styled.div` const Body = styled.div` padding: 0 5px 1px 5px; - overflow-x: hidden; - max-height: 700px; - - ::-webkit-scrollbar { - width: 20px; - } ` diff --git a/frontend/src/features/Vessel/components/VesselSidebar/Equipment/VesselEquipment.tsx b/frontend/src/features/Vessel/components/VesselSidebar/Equipment/VesselEquipment.tsx index 8f838d2c2b..45f8f4d1de 100644 --- a/frontend/src/features/Vessel/components/VesselSidebar/Equipment/VesselEquipment.tsx +++ b/frontend/src/features/Vessel/components/VesselSidebar/Equipment/VesselEquipment.tsx @@ -71,7 +71,6 @@ const NoBeacon = styled.div` const Wrapper = styled.div` overflow: hidden; - max-height: 700px; .rs-btn rs-btn-default rs-picker-toggle { background: #1675e0 !important; diff --git a/frontend/src/features/Vessel/components/VesselSidebar/Equipment/resume/EquipmentResume.tsx b/frontend/src/features/Vessel/components/VesselSidebar/Equipment/resume/EquipmentResume.tsx index 2601d9aa27..a7945ee185 100644 --- a/frontend/src/features/Vessel/components/VesselSidebar/Equipment/resume/EquipmentResume.tsx +++ b/frontend/src/features/Vessel/components/VesselSidebar/Equipment/resume/EquipmentResume.tsx @@ -166,6 +166,4 @@ const SeeMore = styled.div` const Body = styled.div` padding: 0 5px 1px 5px; - overflow-x: hidden; - max-height: 700px; ` diff --git a/frontend/src/features/Vessel/components/VesselSidebar/ReportingList/constants.ts b/frontend/src/features/Vessel/components/VesselSidebar/ReportingList/constants.ts deleted file mode 100644 index 7648a9a794..0000000000 --- a/frontend/src/features/Vessel/components/VesselSidebar/ReportingList/constants.ts +++ /dev/null @@ -1,4 +0,0 @@ -export enum VesselReportingListTab { - CURRENT_REPORTING = 'CURRENT_REPORTING', - REPORTING_HISTORY = 'REPORTING_HISTORY' -} diff --git a/frontend/src/features/Vessel/components/VesselSidebar/ReportingList/index.tsx b/frontend/src/features/Vessel/components/VesselSidebar/ReportingList/index.tsx deleted file mode 100644 index 1168f6c574..0000000000 --- a/frontend/src/features/Vessel/components/VesselSidebar/ReportingList/index.tsx +++ /dev/null @@ -1,115 +0,0 @@ -import { RTK_FIVE_MINUTES_POLLING_QUERY_OPTIONS } from '@api/constants' -import { FingerprintSpinner } from '@components/FingerprintSpinner' -import { CurrentReportingList } from '@features/Reporting/components/CurrentReportingList' -import { ReportingListSummary } from '@features/Reporting/components/ReportingListSummary' -import { getDefaultReportingsStartDate } from '@features/Reporting/utils' -import { vesselActions } from '@features/Vessel/slice' -import { getVesselIdentityFromLegacyVesselIdentity } from '@features/Vessel/utils' -import { useGetVesselReportingsByVesselIdentityQuery } from '@features/Vessel/vesselApi' -import { useMainAppDispatch } from '@hooks/useMainAppDispatch' -import { useMainAppSelector } from '@hooks/useMainAppSelector' -import { customDayjs, THEME } from '@mtes-mct/monitor-ui' -import { skipToken } from '@reduxjs/toolkit/query' -import { useMemo, useState } from 'react' -import styled from 'styled-components' - -import { VesselReportingListTab } from './constants' -import { ArchivedReportingList } from '../../../../Reporting/components/ArchivedReportingList' - -export function ReportingList() { - const dispatch = useMainAppDispatch() - const selectedLegacyVesselIdentity = useMainAppSelector(state => state.vessel.selectedVesselIdentity) - const selectedVesselSidebarReportingListTab = useMainAppSelector( - state => state.vessel.selectedVesselSidebarReportingListTab - ) - - const [startDate, setStartDate] = useState(getDefaultReportingsStartDate()) - - const selectedVesselIdentity = useMemo( - () => - selectedLegacyVesselIdentity - ? getVesselIdentityFromLegacyVesselIdentity(selectedLegacyVesselIdentity) - : undefined, - [selectedLegacyVesselIdentity] - ) - - const { data: vesselReportings } = useGetVesselReportingsByVesselIdentityQuery( - selectedVesselIdentity - ? { - fromDate: startDate.toISOString(), - vesselIdentity: selectedVesselIdentity - } - : skipToken, - RTK_FIVE_MINUTES_POLLING_QUERY_OPTIONS - ) - - const decreaseStartDate = () => { - setStartDate(customDayjs(startDate).subtract(1, 'year').toDate()) - } - - const setSelectedTab = (nextTab: VesselReportingListTab) => { - dispatch(vesselActions.setSelectedVesselSidebarReportingListTab(nextTab)) - } - - if (!selectedVesselIdentity || !vesselReportings) { - return - } - - return ( - - - setSelectedTab(VesselReportingListTab.CURRENT_REPORTING)} - > - Signalements en cours ({vesselReportings.current.length}) - - setSelectedTab(VesselReportingListTab.REPORTING_HISTORY)} - > - Historique des signalements - - - - {selectedVesselSidebarReportingListTab === VesselReportingListTab.CURRENT_REPORTING && ( - - )} - {selectedVesselSidebarReportingListTab === VesselReportingListTab.REPORTING_HISTORY && ( - <> - - - - )} - - ) -} - -const CurrentOrHistoryButton = styled.div<{ - $isActive: boolean -}>` - background: ${p => (p.$isActive ? p.theme.color.charcoal : 'unset')}; - color: ${p => (p.$isActive ? p.theme.color.gainsboro : p.theme.color.gunMetal)}; - cursor: pointer; - flex-grow: 1; - padding: 6px 0 8px 0; - text-align: center; - user-select: none; -` - -const Menu = styled.div` - border: 1px solid ${p => p.theme.color.charcoal}; - display: flex; - margin: 5px; - width: 480px; -` - -const Body = styled.div` - display: flex; - flex-direction: column; - flex-grow: 1; - max-height: 700px; - overflow-x: hidden; - padding: 5px; -` diff --git a/frontend/src/features/Vessel/components/VesselSidebar/Summary.tsx b/frontend/src/features/Vessel/components/VesselSidebar/Summary.tsx index b534946e80..88780fed00 100644 --- a/frontend/src/features/Vessel/components/VesselSidebar/Summary.tsx +++ b/frontend/src/features/Vessel/components/VesselSidebar/Summary.tsx @@ -193,8 +193,6 @@ const PhotoZone = styled.div` const Body = styled.div` padding: 5px 5px 1px 5px; - overflow-x: hidden; - max-height: 662px; ` const Photo = styled.img<{ diff --git a/frontend/src/features/Vessel/components/VesselSidebar/Identity.tsx b/frontend/src/features/Vessel/components/VesselSidebar/VesselIdentity.tsx similarity index 99% rename from frontend/src/features/Vessel/components/VesselSidebar/Identity.tsx rename to frontend/src/features/Vessel/components/VesselSidebar/VesselIdentity.tsx index 7034bd8c02..ac776b18c2 100644 --- a/frontend/src/features/Vessel/components/VesselSidebar/Identity.tsx +++ b/frontend/src/features/Vessel/components/VesselSidebar/VesselIdentity.tsx @@ -11,7 +11,7 @@ import styled from 'styled-components' import { showVessel } from '../../../../domain/use_cases/vessel/showVessel' import { getDate } from '../../../../utils' -export function Identity() { +export function VesselIdentity() { const dispatch = useMainAppDispatch() const loadingVessel = useMainAppSelector(state => state.vessel.loadingVessel) const selectedVessel = useMainAppSelector(state => state.vessel.selectedVessel) @@ -292,8 +292,6 @@ const ValueWithLineBreak = styled.div` const Body = styled.div` padding: 5px 5px 10px 5px; - overflow-x: hidden; - max-height: 662px; ` const LicenceActive = styled.span` diff --git a/frontend/src/features/Vessel/components/VesselSidebar/warnings/BeaconMalfunctionWarning.tsx b/frontend/src/features/Vessel/components/VesselSidebar/warnings/BeaconMalfunctionWarning.tsx index 8e045d8240..c2d8e352cc 100644 --- a/frontend/src/features/Vessel/components/VesselSidebar/warnings/BeaconMalfunctionWarning.tsx +++ b/frontend/src/features/Vessel/components/VesselSidebar/warnings/BeaconMalfunctionWarning.tsx @@ -12,7 +12,7 @@ export function BeaconMalfunctionWarning({ selectedVessel }) { return ( <> - {selectedVessel?.beaconMalfunctionId ? ( + {selectedVessel.beaconMalfunctionId ? ( showBeaconMalfunctionInSideWindow(dispatch, selectedVessel)} diff --git a/frontend/src/features/Vessel/slice.ts b/frontend/src/features/Vessel/slice.ts index 5ed46dc56c..59a900569b 100644 --- a/frontend/src/features/Vessel/slice.ts +++ b/frontend/src/features/Vessel/slice.ts @@ -1,5 +1,4 @@ import { reportingIsAnInfractionSuspicion } from '@features/Reporting/utils' -import { VesselReportingListTab } from '@features/Vessel/components/VesselSidebar/ReportingList/constants' import { createEntityAdapter, createSlice, type EntityState, type PayloadAction } from '@reduxjs/toolkit' import { @@ -39,8 +38,6 @@ export type VesselState = { selectedVessel: VesselTypes.AugmentedSelectedVessel | undefined selectedVesselIdentity: VesselIdentity | undefined selectedVesselPositions: VesselPosition[] | null - /** Used to open vessel sidebar reporting history from prior notification form reporting list. */ - selectedVesselSidebarReportingListTab: VesselReportingListTab selectedVesselSidebarTab: VesselSidebarTab selectedVesselTrackRequest: TrackRequest | null tripMessagesLastToFormerDEPDateTimes: any[] @@ -62,7 +59,6 @@ const INITIAL_STATE: VesselState = { selectedVessel: undefined, selectedVesselIdentity: undefined, selectedVesselPositions: null, - selectedVesselSidebarReportingListTab: VesselReportingListTab.CURRENT_REPORTING, selectedVesselSidebarTab: VesselSidebarTab.SUMMARY, selectedVesselTrackRequest: null, tripMessagesLastToFormerDEPDateTimes: [], @@ -463,15 +459,8 @@ const vesselSlice = createSlice({ state.selectedVesselTrackRequest = action.payload }, - setSelectedVesselSidebarReportingListTab(state, action: PayloadAction) { - state.selectedVesselSidebarReportingListTab = action.payload - }, - setSelectedVesselSidebarTab(state, action: PayloadAction) { state.selectedVesselSidebarTab = action.payload - if (state.selectedVesselSidebarTab !== VesselSidebarTab.REPORTING) { - state.selectedVesselSidebarReportingListTab = VesselReportingListTab.CURRENT_REPORTING - } }, setVessels(state, action: PayloadAction) {