Refactor/fix/test homepage ULAM + PAM

MTES-MCT · Dec 12, 2024 · 8695ac6 · 8695ac6
1 parent 6844e79
commit 8695ac6
Show file tree

Hide file tree

Showing 34 changed files with 971 additions and 563 deletions.
diff --git a/...r/gouv/gmampa/rapportnav/domain/use_cases/mission/export/v2/ExportMissionAEMSingleTest.kt b/...r/gouv/gmampa/rapportnav/domain/use_cases/mission/export/v2/ExportMissionAEMSingleTest.kt
@@ -5,6 +5,7 @@ import fr.gouv.dgampa.rapportnav.domain.entities.mission.nav.export.MissionExpor
 import fr.gouv.dgampa.rapportnav.domain.use_cases.mission.GetMission
 import fr.gouv.dgampa.rapportnav.domain.use_cases.mission.export.v2.ExportMissionAEMSingle
 import fr.gouv.dgampa.rapportnav.domain.use_cases.utils.FillAEMExcelRow
+import fr.gouv.dgampa.rapportnav.domain.use_cases.utils.FormatDateTime
 import fr.gouv.gmampa.rapportnav.mocks.mission.MissionEntityMock
 import fr.gouv.gmampa.rapportnav.mocks.mission.action.NavActionControlMock
 import org.assertj.core.api.Assertions
@@ -14,7 +15,7 @@ import org.springframework.beans.factory.annotation.Autowired
 import org.springframework.boot.test.context.SpringBootTest
 import org.springframework.boot.test.mock.mockito.MockBean
 
-@SpringBootTest(classes = [ExportMissionAEMSingle::class])
+@SpringBootTest(classes = [ExportMissionAEMSingle::class, FormatDateTime::class])
 class ExportMissionAEMSingleTest {
 
     @Autowired

diff --git a/...pa/rapportnav/domain/use_cases/mission/export/v2/ExportMissionPatrolMultipleZippedTest.kt b/...pa/rapportnav/domain/use_cases/mission/export/v2/ExportMissionPatrolMultipleZippedTest.kt
@@ -1,5 +1,7 @@
 package fr.gouv.gmampa.rapportnav.domain.use_cases.mission.export.v2
 
+import fr.gouv.dgampa.rapportnav.domain.entities.mission.CompletenessForStatsEntity
+import fr.gouv.dgampa.rapportnav.domain.entities.mission.CompletenessForStatsStatusEnum
 import fr.gouv.dgampa.rapportnav.domain.entities.mission.nav.export.MissionExportEntity
 import fr.gouv.dgampa.rapportnav.domain.use_cases.mission.GetMission
 import fr.gouv.dgampa.rapportnav.domain.use_cases.mission.export.v2.ExportMissionPatrolMultipleZipped
@@ -35,7 +37,10 @@ class ExportMissionPatrolMultipleZippedTest {
     @Test
     fun `should export a file`() {
         val missionIds = listOf(1)
-        val mission = MissionEntityMock.create(id = missionIds.first())
+        val mission = MissionEntityMock.create(
+            id = missionIds.first(),
+            completenessForStats = CompletenessForStatsEntity(status = CompletenessForStatsStatusEnum.COMPLETE)
+        )
         Mockito.`when`(exportMissionPatrolSingle.createFile(Mockito.any())).thenReturn(
             MissionExportEntity(
                 fileName = "exportMissionPatrolSingle.odt",

diff --git a/frontend/package-lock.json b/frontend/package-lock.json
diff --git a/frontend/src/v2/features/common/components/elements/__tests__/export-file-button.test.tsx b/frontend/src/v2/features/common/components/elements/__tests__/export-file-button.test.tsx
@@ -17,7 +17,7 @@ describe('ExportAEMButton Component', () => {
   })
 
   test('displays correct label when provided', () => {
-    render(<ExportFileButton missions={missions} label="Export Custom Label" />)
+    render(<ExportFileButton missions={missions}>Export Custom Label</ExportFileButton>)
     expect(screen.getByText('Export Custom Label')).toBeInTheDocument()
   })
 

diff --git a/frontend/src/v2/features/common/components/elements/export-file-button.tsx b/frontend/src/v2/features/common/components/elements/export-file-button.tsx
@@ -1,37 +1,40 @@
 import React from 'react'
 import { Accent, Button, ButtonProps, Icon, THEME } from '@mtes-mct/monitor-ui'
 import GearIcon from '@rsuite/icons/Gear'
+import { toast } from 'react-toastify'
+import loading = toast.loading
 
 type ExportFileButtonProps = ButtonProps & {
   isLoading: boolean
 }
 
-const LoadingIcon = () => (
+const LoadingIcon = (accent: Accent) => (
   <GearIcon
     spin
     width={16}
     height={16}
-    color={THEME.color.white}
+    color={accent === Accent.PRIMARY ? THEME.color.white : THEME.color.charcoal}
     style={{ fontSize: '2em', marginRight: '0.5rem' }}
     data-testid={'loading-icon'}
   />
 )
 
-const ExportFileButton: React.FC<ExportFileButtonProps> = ({ onClick, isLoading, label, ...props }) => {
+const ExportFileButton: React.FC<ExportFileButtonProps> = ({ onClick, isLoading, children, ...props }) => {
   const triggerExport = () => {
     onClick()
   }
 
   return (
     <Button
-      {...props}
       role={'button'}
       accent={Accent.PRIMARY}
       Icon={isLoading ? LoadingIcon : Icon.Download}
       onClick={() => triggerExport()}
       data-testid={'export-btn'}
+      aria-busy={isLoading}
+      {...props}
     >
-      {label ? label : 'Exporter'}
+      {children ?? 'Exporter'}
     </Button>
   )
 }

diff --git a/frontend/src/v2/features/common/components/layout/mission-list-page-content-wrapper.tsx b/frontend/src/v2/features/common/components/layout/mission-list-page-content-wrapper.tsx
@@ -0,0 +1,88 @@
+import React, { FC, ReactNode } from 'react'
+import { Col, FlexboxGrid, Loader, Stack } from 'rsuite'
+import { Icon } from '@mtes-mct/monitor-ui'
+import Text from '@common/components/ui/text.tsx'
+
+interface MissionListContentWrapperProps {
+  hasMissions: boolean
+  title: string
+  subtitle?: string
+  filter?: JSX.Element
+  actions?: JSX.Element
+  list: ReactNode
+  loading: boolean
+}
+
+const MissionListPageContentWrapper: FC<MissionListContentWrapperProps> = ({
+  title,
+  subtitle,
+  filters,
+  actions,
+  list,
+  loading,
+  hasMissions
+}) => {
+  return (
+    <Stack direction={'column'} style={{ width: '100%' }}>
+      <Stack.Item style={{ width: '100%' }}>
+        <Stack
+          direction={'row'}
+          spacing={'0.5rem'}
+          alignItems={'center'}
+          style={{ padding: '0 15rem', marginTop: '5rem' }}
+        >
+          <Stack.Item alignSelf={'baseline'}>
+            <Icon.MissionAction size={32} style={{ marginTop: '8px' }} />
+          </Stack.Item>
+          <Stack.Item>
+            <Text as={'h1'} style={{ fontSize: '32px' }}>
+              {title}
+            </Text>
+          </Stack.Item>
+        </Stack>
+      </Stack.Item>
+      {subtitle && (
+        <Stack.Item style={{ width: '100%', padding: '0 15rem', marginTop: '5rem' }}>
+          <Text as={'h1'}>{subtitle}</Text>
+        </Stack.Item>
+      )}
+      <Stack.Item style={{ width: '100%' }}>
+        <Stack direction="column" alignItems="flex-start" spacing="0.2rem" style={{ width: '100%' }}>
+          <Stack.Item style={{ width: '100%', height: '100%' }}>
+            <FlexboxGrid justify="center" style={{ padding: '2rem 2rem 4rem 2rem', display: 'flex', flex: 1 }}>
+              <FlexboxGrid.Item as={Col} colspan={24} xxl={20}>
+                {filters}
+              </FlexboxGrid.Item>
+              <FlexboxGrid.Item as={Col} colspan={24} xxl={20}>
+                {loading ? (
+                  <div style={{ marginTop: '25rem' }}>
+                    <Loader
+                      center={true}
+                      size={'md'}
+                      vertical={true}
+                      content={<Text as={'h3'}>Missions en cours de chargement</Text>}
+                    />
+                  </div>
+                ) : !hasMissions ? (
+                  <div style={{ marginTop: '10rem' }}>
+                    <Text as={'h3'} style={{ textAlign: 'center' }}>
+                      Aucune mission pour cette période de temps.
+                    </Text>
+                  </div>
+                ) : (
+                  <>
+                    {actions}
+
+                    {list}
+                  </>
+                )}
+              </FlexboxGrid.Item>
+            </FlexboxGrid>
+          </Stack.Item>
+        </Stack>
+      </Stack.Item>
+    </Stack>
+  )
+}
+
+export default MissionListPageContentWrapper
diff --git a/frontend/src/v2/features/common/components/layout/mission-list-page-title.tsx b/frontend/src/v2/features/common/components/layout/mission-list-page-title.tsx
@@ -0,0 +1,7 @@
+import React from 'react'
+
+const MissionListPageTitle: React.FC = () => {
+  return <h4>Rapport Nav</h4>
+}
+
+export default MissionListPageTitle
diff --git a/frontend/src/v2/features/common/hooks/use-mission-completeness-for-stats.tsx b/frontend/src/v2/features/common/hooks/use-mission-completeness-for-stats.tsx
@@ -18,6 +18,9 @@ type MissionCompletenessTagHook = {
   statusMessage: string
 } & Component
 
+export const isCompleteForStats = (completenessForStats?: CompletenessForStats) =>
+  completenessForStats?.status === CompletenessForStatsStatusEnum.COMPLETE
+
 export function useMissionCompletenessForStats(
   completenessForStats?: CompletenessForStats,
   missionStatus?: MissionStatusEnum
@@ -49,7 +52,7 @@ export function useMissionCompletenessForStats(
   }
 
   const getMessageStatus = () => {
-    if (completenessForStats?.status === CompletenessForStatsStatusEnum.COMPLETE) {
+    if (isCompleteForStats(completenessForStats)) {
       return 'Les champs indispensables aux statistiques sont remplis.'
     }