Fix regulation slice type

frontend/src/features/Backoffice/edit_regulation/ConfirmRegulationModal.jsx

@@ -1,9 +1,9 @@
 import React from 'react'
-import { batch, useDispatch, useSelector } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
 import styled from 'styled-components'
 
 import { COLORS } from '../../../constants/constants'
-import { setIsConfirmModalOpen, setRegulationModified, setSaveOrUpdateRegulation } from '../slice'
+import { setIsConfirmModalOpen, setSaveOrUpdateRegulation } from '../slice'
 import { CancelButton, ValidateButton } from '../../commonStyles/Buttons.style'
 import { FooterButton } from '../../commonStyles/Backoffice.style'
 import CloseIconSVG from '../../icons/Croix_grise_clair.svg?react'

frontend/src/features/Backoffice/edit_regulation/fishing_period/DayTimeCheckbox.tsx

@@ -8,7 +8,7 @@ import { TimeRow } from '../../../commonStyles/FishingPeriod.style'
 import { FISHING_PERIOD_KEYS } from '../../../Regulation/utils'
 
 export function DayTimeCheckbox({ disabled, timeIsDisabled }) {
-  const { daytime } = useBackofficeAppSelector(state => state.regulation.processingRegulation.fishingPeriod)
+  const daytime = useBackofficeAppSelector(state => state.regulation.processingRegulation.fishingPeriod?.daytime)
   const setDaytime = useSetFishingPeriod(FISHING_PERIOD_KEYS.DAYTIME)
 
   useEffect(() => {

frontend/src/features/Backoffice/edit_regulation/gear_regulation/RegulatedGears.jsx

@@ -48,7 +48,6 @@ const RegulatedGears = props => {
   } = useSelector(state => state.gear)
 
   const onCheckboxChange = (groupName, checked) => {
-    console.log(groupName, checked)
     let nextSelectedCategoriesAndGears = selectedCategoriesAndGears ? [...selectedCategoriesAndGears] : []
     const gearsListToConcatOrFilter = getGroupCategories(groupName, groupsToCategories)
 

frontend/src/features/Backoffice/edit_regulation/identification/RegulationGeometryLine.tsx

@@ -10,7 +10,7 @@ import { updateProcessingRegulationByKey } from '../../slice'
 
 export function RegulationGeometryLine({ geometryIdList, setShowRegulatoryPreview, showRegulatoryPreview }) {
   const dispatch = useBackofficeAppDispatch()
-  const { id } = useBackofficeAppSelector(state => state.regulation.processingRegulation)
+  const id = useBackofficeAppSelector(state => state.regulation.processingRegulation?.id)
 
   const onCloseIconClicked = async () => {
     await dispatch(updateProcessingRegulationByKey({ key: REGULATORY_REFERENCE_KEYS.ID, value: undefined }))

frontend/src/features/Backoffice/edit_regulation/identification/RegulationLawTypeLine.tsx

@@ -11,7 +11,7 @@ import { updateProcessingRegulationByKey } from '../../slice'
 export function RegulationLawTypeLine({ selectData }) {
   const dispatch = useBackofficeAppDispatch()
 
-  const { lawType } = useBackofficeAppSelector(state => state.regulation.processingRegulation)
+  const lawType = useBackofficeAppSelector(state => state.regulation.processingRegulation?.lawType)
 
   const onLawTypeChange = async (value?) => {
     if (LAWTYPES_TO_TERRITORY[value] !== UE) {

frontend/src/features/Backoffice/edit_regulation/identification/RegulationLayerZoneLine.tsx

@@ -13,7 +13,7 @@ import InfoBox from '../InfoBox'
 export function RegulationLayerZoneLine() {
   const dispatch = useBackofficeAppDispatch()
 
-  const { zone } = useBackofficeAppSelector(state => state.regulation.processingRegulation)
+  const zone = useBackofficeAppSelector(state => state.regulation.processingRegulation?.zone)
 
   const setZoneName = value => {
     dispatch(updateProcessingRegulationByKey({ key: REGULATORY_REFERENCE_KEYS.ZONE, value }))

frontend/src/features/Backoffice/edit_regulation/identification/RegulationRegionLine.tsx

@@ -13,9 +13,7 @@ import { updateProcessingRegulationByKey } from '../../slice'
 
 export function RegulationRegionLine({ isDisabled }) {
   const dispatch = useBackofficeAppDispatch()
-  const { region: regionList }: { region?: string[] } = useBackofficeAppSelector(
-    state => state.regulation.processingRegulation
-  )
+  const regionList = useBackofficeAppSelector(state => state.regulation.processingRegulation?.region)
 
   const removeRegionToSelectedRegionList = async regionToRemove => {
     if (!regionList) {
@@ -53,7 +51,9 @@ export function RegulationRegionLine({ isDisabled }) {
         value={regionList}
       />
       {regionList?.map(selectedRegion => (
-        <StyledTag onDelete={() => removeRegionToSelectedRegionList(selectedRegion)}>{selectedRegion}</StyledTag>
+        <StyledTag key={selectedRegion} onDelete={() => removeRegionToSelectedRegionList(selectedRegion)}>
+          {selectedRegion}
+        </StyledTag>
       ))}
     </ContentLine>
   )

frontend/src/features/Backoffice/edit_regulation/identification/RegulationTopicLine.tsx

@@ -19,15 +19,15 @@ import type { Option } from '@mtes-mct/monitor-ui'
 export function RegulationTopicLine({ isDisabled }) {
   const dispatch = useBackofficeAppDispatch()
   const regulatoryTopics = useBackofficeAppSelector(state => state.regulatory.regulatoryTopics)
-  const { topic } = useBackofficeAppSelector(state => state.regulation.processingRegulation)
+  const topic = useBackofficeAppSelector(state => state.regulation.processingRegulation?.topic)
 
   const [layerTypeList, setLayerTypeList] = useState<Option[]>([])
   const [isAddTopicClicked, setIsAddTopicClicked] = useState(false)
   const [isInfoTextShown, setIsInfoTextShown] = useState(false)
 
   useEffect(() => {
     if (regulatoryTopics) {
-      setLayerTypeList(formatDataForSelectPicker([...regulatoryTopics].sort()))
+      setLayerTypeList(formatDataForSelectPicker([...regulatoryTopics].sort((a, b) => a.localeCompare(b))))
     }
   }, [regulatoryTopics])
 

frontend/src/features/Backoffice/edit_regulation/regulatory_text/utils.ts

@@ -4,16 +4,7 @@ import { checkURL } from '@features/Regulation/utils'
  * @returns true if a regulatory text form value is missing or incorrect, else false
  */
 export function checkOtherRequiredValues(startDate, endDate, textType) {
-  let oneValueIsMissing = false
-
-  let valueIsMissing = !startDate || startDate === ''
-  oneValueIsMissing = oneValueIsMissing || valueIsMissing
-  valueIsMissing = !endDate || endDate === ''
-  oneValueIsMissing = oneValueIsMissing || valueIsMissing
-  valueIsMissing = !textType || textType.length === 0
-  oneValueIsMissing = oneValueIsMissing || valueIsMissing
-
-  return oneValueIsMissing
+  return !startDate || startDate === '' || !endDate || endDate === '' || !textType || textType.length === 0
 }
 
 /**

frontend/src/features/Backoffice/list_regulation/SearchRegulations.tsx

@@ -13,14 +13,13 @@ import SearchIconSVG from '../../icons/Loupe.svg?react'
 import { closeRegulatoryZoneMetadataPanel } from '../../Regulation/slice'
 import { searchByLawType, searchResultIncludeZone } from '../../Regulation/utils'
 
-export function SearchRegulations(props) {
+export function SearchRegulations({ regulatoryZoneListByRegTerritory, setFoundRegulatoryZonesByRegTerritory }) {
   const dispatch = useBackofficeAppDispatch()
-  const { regulatoryZoneListByRegTerritory, setFoundRegulatoryZonesByRegTerritory } = props
 
   const searchInput = useRef<HTMLInputElement | null>(null)
   const [searchText, setSearchText] = useState('')
 
-  const { regulatoryZoneMetadata } = useBackofficeAppSelector(state => state.regulatory)
+  const regulatoryZoneMetadata = useBackofficeAppSelector(state => state.regulatory.regulatoryZoneMetadata)
 
   useEffect(() => {
     searchRegulatoryZone()

frontend/src/features/Backoffice/slice.ts

@@ -3,6 +3,7 @@
 import { createSlice } from '@reduxjs/toolkit'
 
 import { STATUS } from './constants'
+import type { EditedRegulatoryZone } from '../Regulation/types'
 import { DEFAULT_REGULATION, REGULATORY_REFERENCE_KEYS } from '../Regulation/utils'
 
 import type { RegulatoryText } from '../Regulation/types'
@@ -13,8 +14,7 @@ export type RegulationState = {
   hasOneOrMoreValuesMissing: boolean | undefined
   isConfirmModalOpen: boolean
   isRemoveModalOpen: boolean
-  // TODO Convert that to a real type.
-  processingRegulation: typeof DEFAULT_REGULATION
+  processingRegulation: Partial<EditedRegulatoryZone>
   regulationDeleted: boolean
   regulationModified: boolean
   regulationSaved: boolean

frontend/src/features/Logbook/components/VesselLogbook/LogbookSummary/utils.ts

@@ -28,10 +28,9 @@ export function getTripSegments(
 }
 
 export function getSegmentInfo(segment: Partial<FleetSegment>): string {
-  if (segment.gears || segment.faoAreas || segment.targetSpecies || segment.dirm || segment.bycatchSpecies) {
+  if (segment.gears || segment.faoAreas || segment.targetSpecies || segment.bycatchSpecies) {
     const gears = segment.gears?.length ? segment.gears.join(', ') : 'aucun'
     const faoAreas = segment.faoAreas?.length ? segment.faoAreas.join(', ') : 'aucune'
-    const dirm = segment.dirm?.length ? segment.dirm.join(', ') : 'aucune'
 
     let targetSpeciesArray: string[] = []
     if (segment.targetSpecies?.length) {
@@ -44,8 +43,7 @@ export function getSegmentInfo(segment: Partial<FleetSegment>): string {
 
     return `Engins: ${gears}
 Zones FAO: ${faoAreas}
-Espèces: ${targetSpecies}
-Façade: ${dirm}`
+Espèces: ${targetSpecies}`
   }
 
   return 'Segment de flotte inconnu'

frontend/src/features/Regulation/types.ts

@@ -7,7 +7,7 @@ export type BaseRegulatoryZone = {
 }
 
 export type RegulatoryZone = BaseRegulatoryZone & {
-  color: string
+  color?: string
   fishingPeriod: FishingPeriod
   gearRegulation: GearRegulation
   geometry: GeoJSON.Geometry
@@ -17,10 +17,14 @@ export type RegulatoryZone = BaseRegulatoryZone & {
   otherInfo: string
   region: string
   regulatoryReferences: RegulatoryText[] | undefined
-  showed: boolean
+  showed?: boolean
   speciesRegulation: SpeciesRegulation
 }
 
+export type EditedRegulatoryZone = RegulatoryZone & {
+  region: string[] | undefined
+}
+
 export type RegulatoryText = {
   // TODO Use `Infinity`
   endDate: Date | 'infinite'

frontend/src/features/Regulation/utils.ts

@@ -3,6 +3,7 @@ import { getTextForSearch } from '../../utils'
 import { formatDataForSelectPicker } from '../Backoffice/utils'
 
 import type {
+  EditedRegulatoryZone,
   FishingPeriod,
   Gear,
   GearRegulation,
@@ -15,7 +16,7 @@ import type {
 } from './types'
 import type { Specy } from '../../domain/types/specy'
 
-export const mapToRegulatoryZone = ({ geometry, id, properties }, speciesByCode): Partial<RegulatoryZone> => ({
+export const mapToRegulatoryZone = ({ geometry, id, properties }, speciesByCode): RegulatoryZone => ({
   fishingPeriod: parseFishingPeriod(properties.fishing_period),
   gearRegulation: parseGearRegulation(properties.gears),
   geometry,
@@ -374,8 +375,9 @@ export const REGULATORY_REFERENCE_KEYS = {
   ZONE: 'zone'
 }
 
-export const DEFAULT_REGULATION = {
-  [REGULATORY_REFERENCE_KEYS.REGULATORY_REFERENCES]: [DEFAULT_REGULATORY_TEXT],
+export const DEFAULT_REGULATION: Partial<EditedRegulatoryZone> = {
+  [REGULATORY_REFERENCE_KEYS.TOPIC]: undefined,
+  [REGULATORY_REFERENCE_KEYS.ZONE]: undefined,
   [REGULATORY_REFERENCE_KEYS.FISHING_PERIOD]: DEFAULT_FISHING_PERIOD_VALUES,
   [REGULATORY_REFERENCE_KEYS.SPECIES_REGULATION]: DEFAULT_SPECIES_REGULATION,
   [REGULATORY_REFERENCE_KEYS.GEAR_REGULATION]: DEFAULT_GEAR_REGULATION,
@@ -390,8 +392,6 @@ export const GEARS_CATEGORIES_WITH_MESH = [
   'Filets maillants et filets emmêlants'
 ]
 
-export const INITIAL_UPCOMING_REG_REFERENCE = { regulatoryTextList: [DEFAULT_REGULATORY_TEXT] }
-
 export const FISHING_PERIOD_KEYS = {
   ALWAYS: 'always',
   ANNUAL_RECURRENCE: 'annualRecurrence',