Skip to content

Commit

Permalink
feat: download summary after sending reporting (#5)
Browse files Browse the repository at this point in the history
* feat: download summary after sending reporting

* fix: sonarcloud
  • Loading branch information
MaGOs92 authored Aug 8, 2024
1 parent 46b47f2 commit 897841b
Show file tree
Hide file tree
Showing 17 changed files with 158 additions and 97 deletions.
1 change: 0 additions & 1 deletion src/api/signalement/models/Position.ts
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ export namespace Position {
D_LIVRANCE_POSTALE = 'délivrance postale',
PARCELLE = 'parcelle',
SEGMENT = 'segment',
INCONNU = 'inconnu',
}
}

1 change: 0 additions & 1 deletion src/api/signalement/models/PositionDTO.ts
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ export namespace PositionDTO {
D_LIVRANCE_POSTALE = 'délivrance postale',
PARCELLE = 'parcelle',
SEGMENT = 'segment',
INCONNU = 'inconnu',
}
}

4 changes: 3 additions & 1 deletion src/composants/adresse/ListNumeros.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,9 @@ export function ListNumeros({ adresse }: Readonly<ListNumerosProps>) {
{filteredNumeros.map(({ id, numero, suffixe, certifie }) => (
<tr onClick={() => navigate(`/${id}`)} className='numero-row' key={id}>
<td>{suffixe ? `${numero} ${suffixe}` : numero}</td>
<td>{certifie ? '✅' : '❌'}</td>
<td>
{certifie ? <span className='fr-icon-checkbox-circle-line' /> : ''}
</td>
</tr>
))}
</tbody>
Expand Down
7 changes: 5 additions & 2 deletions src/composants/adresse/NumeroCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -46,9 +46,12 @@ export function NumeroCard({ adresse, createSignalement }: NumeroCardProps) {
<h3>Certification</h3>
<p>
{adresse.certifie ? (
<>✅ Cette adresse a été certifiée par la commune</>
<>
<span className='fr-icon-checkbox-circle-line' /> Cette adresse a été certifiée par la
commune
</>
) : (
<>Cette adresse n&apos;a pas été certifiée par la commune</>
<>Cette adresse n&apos;a pas été certifiée par la commune</>
)}
</p>
</div>
Expand Down
12 changes: 12 additions & 0 deletions src/composants/common/Header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,18 @@ const StyledHeader = styled.header`
font-size: 0.6em;
}
}
@media print {
display: flex;
align-items: center;
height: 100px;
div {
filter: none;
}
.fr-container {
margin: 0;
}
}
`

interface HeaderProps {
Expand Down
8 changes: 7 additions & 1 deletion src/composants/common/Modal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,10 @@ const StyledBackDrop = styled.div`
display: flex;
justify-content: center;
align-items: center;
@media print {
background: transparent;
}
`

const StyledModal = styled.div`
Expand Down Expand Up @@ -54,8 +58,10 @@ const StyledModal = styled.div`
}
@media print {
position: absolute;
bottom: 0;
padding: 1em;
height: 100%;
height: calc(100% - 100px);
width: 100%;
max-width: unset;
max-height: unset;
Expand Down
67 changes: 37 additions & 30 deletions src/composants/signalement/RecapModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -22,17 +22,17 @@ import {
interface SignalementRecapModalProps {
signalement: Signalement
onEditSignalement: (property: keyof Signalement, key: string) => (event: string) => void
onClose: () => void
onCloseModal: () => void
address: IBANPlateformeNumero | IBANPlateformeVoie | IBANPlateformeLieuDit
onSubmit: () => void
onClose: () => void
}

export default function SignalementRecapModal({
signalement,
onEditSignalement,
onClose,
onCloseModal,
address,
onSubmit,
onClose,
}: SignalementRecapModalProps) {
const [submitStatus, setSubmitStatus] = useState<string | null>(null)
const { source } = useContext(SourceContext)
Expand Down Expand Up @@ -62,9 +62,6 @@ export default function SignalementRecapModal({
const sourceId = source?.id || process.env.REACT_APP_API_SIGNALEMENT_SOURCE_ID
await SignalementsService.createSignalement(signalement as CreateSignalementDTO, sourceId)
setSubmitStatus('success')
setTimeout(() => {
onSubmit()
}, 2000)
} catch (error) {
console.error(error)
setSubmitStatus('error')
Expand Down Expand Up @@ -97,7 +94,7 @@ export default function SignalementRecapModal({
}

return (
<Modal title={getModalTitle()} onClose={onClose}>
<Modal title={getModalTitle()} onClose={submitStatus === 'success' ? onClose : onCloseModal}>
<StyledForm onSubmit={handleSubmit}>
{signalement.type === Signalement.type.LOCATION_TO_UPDATE && (
<section>
Expand Down Expand Up @@ -247,14 +244,6 @@ export default function SignalementRecapModal({
</div>
</section>
)}
<button
className='fr-btn fr-btn--tertiary'
type='button'
onClick={() => window.print()}
style={{ marginTop: '0.5rem' }}
>
Imprimer le récapitulatif
</button>
{source?.type !== Source.type.PRIVATE && (
<section>
<h4>Contact</h4>
Expand Down Expand Up @@ -285,9 +274,14 @@ export default function SignalementRecapModal({
</section>
)}
{submitStatus === 'success' && (
<div className='fr-alert fr-alert--success'>
<p>Votre signalement a bien été envoyée.</p>
</div>
<>
<p className='send-date'>
Date d&apos;envoi : <b>{new Date().toLocaleDateString()}</b>
</p>
<div className='fr-alert fr-alert--success'>
<p>Votre signalement a bien été envoyée.</p>
</div>
</>
)}
{submitStatus === 'error' && (
<div className='fr-alert fr-alert--error'>
Expand All @@ -297,18 +291,31 @@ export default function SignalementRecapModal({
</p>
</div>
)}
<div className='form-controls'>
<button
className='fr-btn'
disabled={submitStatus === 'loading' || submitStatus === 'success'}
type='submit'
>
Envoyer le signalement
</button>
<div className='form-controls' style={{ justifyContent: 'flex-start' }}>
{submitStatus !== 'success' ? (
<>
<button
className='fr-btn'
disabled={submitStatus === 'loading' || submitStatus === 'success'}
type='submit'
>
Envoyer le signalement
</button>

<button className='fr-btn fr-btn--tertiary' type='button' onClick={onClose}>
Annuler
</button>
<button className='fr-btn fr-btn--tertiary' type='button' onClick={onCloseModal}>
Annuler
</button>
</>
) : (
<>
<button className='fr-btn ' type='button' onClick={() => window.print()}>
Imprimer le récapitulatif
</button>
<button className='fr-btn fr-btn--tertiary' type='button' onClick={onClose}>
Quitter
</button>
</>
)}
</div>
</StyledForm>
</Modal>
Expand Down
22 changes: 17 additions & 5 deletions src/composants/signalement/SignalementForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,12 @@ import SignalementNumeroForm from './signalement-numero/SignalementNumeroForm'
import RecapModal from './RecapModal'
import SignalementNumeroDeleteForm from './signalement-numero/SignalementNumeroDeleteForm'
import { Signalement } from '../../api/signalement'
import { BANPlateformeResultTypeEnum } from '../../api/ban-plateforme/types'
import {
BANPlateformeResultTypeEnum,
IBANPlateformeLieuDit,
IBANPlateformeNumero,
IBANPlateformeVoie,
} from '../../api/ban-plateforme/types'
import { MapRef } from 'react-map-gl/maplibre'
import SignalementVoieForm from './signalement-voie/SignalementVoieForm'

Expand All @@ -13,7 +18,8 @@ interface SignalementFormProps {
map: MapRef | null
onEditSignalement: (property: keyof Signalement, key: string) => (value: any) => void
onClose: () => void
address: any
address: IBANPlateformeVoie | IBANPlateformeLieuDit | IBANPlateformeNumero
hasSignalementChanged: boolean
}

export default function SignalementForm({
Expand All @@ -22,6 +28,7 @@ export default function SignalementForm({
onEditSignalement,
onClose,
address,
hasSignalementChanged,
}: SignalementFormProps) {
const [showRecapModal, setShowRecapModal] = useState(false)

Expand All @@ -41,6 +48,7 @@ export default function SignalementForm({
signalement={signalement}
address={address}
initialPositionCoords={[map?.getCenter()?.lng || 0, map?.getCenter()?.lat || 0]}
hasSignalementChanged={hasSignalementChanged}
/>
)}

Expand All @@ -52,6 +60,7 @@ export default function SignalementForm({
onEditSignalement={onEditSignalement}
signalement={signalement}
address={address}
hasSignalementChanged={hasSignalementChanged}
/>
)}

Expand All @@ -64,6 +73,7 @@ export default function SignalementForm({
signalement={signalement}
address={address}
initialPositionCoords={[map?.getCenter()?.lng || 0, map?.getCenter()?.lat || 0]}
hasSignalementChanged={hasSignalementChanged}
/>
)}

Expand All @@ -76,23 +86,25 @@ export default function SignalementForm({
signalement={signalement}
address={address}
initialPositionCoords={[address.lon, address.lat]}
hasSignalementChanged={hasSignalementChanged}
/>
)}

{signalement?.type === Signalement.type.LOCATION_TO_DELETE && (
<SignalementNumeroDeleteForm
signalement={signalement}
address={address}
address={address as IBANPlateformeNumero}
onClose={onClose}
onSubmit={handleSubmit}
onEditSignalement={onEditSignalement}
hasSignalementChanged={hasSignalementChanged}
/>
)}

{showRecapModal && (
<RecapModal
onSubmit={onClose}
onClose={() => setShowRecapModal(false)}
onClose={onClose}
onCloseModal={() => setShowRecapModal(false)}
signalement={signalement}
address={address}
onEditSignalement={onEditSignalement}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
import React, { useMemo } from 'react'
import { getInitialSignalement } from '../../../utils/signalement.utils'
import React from 'react'
import { StyledForm } from '../signalement.styles'
import { Signalement } from '../../../api/signalement'
import { getAdresseLabel } from '../../../utils/adresse.utils'
Expand All @@ -11,6 +10,7 @@ interface SignalementNumeroDeleteFormProps {
onClose: () => void
address: IBANPlateformeNumero
onSubmit: (event: React.FormEvent<HTMLFormElement>) => void
hasSignalementChanged: boolean
}

export default function SignalementNumeroDeleteForm({
Expand All @@ -19,15 +19,10 @@ export default function SignalementNumeroDeleteForm({
onClose,
address,
onSubmit,
hasSignalementChanged,
}: SignalementNumeroDeleteFormProps) {
const { comment } = signalement.changesRequested

const isSubmitDisabled = useMemo(() => {
return (
JSON.stringify(getInitialSignalement(address, signalement.type)) ===
JSON.stringify(signalement)
)
}, [address, signalement])
return (
<StyledForm onSubmit={onSubmit}>
<h4>Demande de suppression d&apos;un numéro</h4>
Expand Down Expand Up @@ -56,7 +51,7 @@ export default function SignalementNumeroDeleteForm({
<div className='form-controls'>
<button
className='fr-btn'
disabled={isSubmitDisabled}
disabled={!hasSignalementChanged}
style={{ color: 'white' }}
type='submit'
>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import React, { useMemo } from 'react'
import { StyledForm } from '../signalement.styles'
import PositionInput from '../../common/Position/PositionInput'
import { NumeroChangesRequestedDTO, Signalement } from '../../../api/signalement'
import { getInitialSignalement } from '../../../utils/signalement.utils'
import { IBANPlateformeNumero, IBANPlateformeVoie } from '../../../api/ban-plateforme/types'
import ComplementInputProps from '../../common/ComplementInput'
import ParcelleInput from '../../common/ParcelleInput'
Expand All @@ -15,6 +14,7 @@ interface SignalementNumeroFormProps {
address: IBANPlateformeNumero | IBANPlateformeVoie
onSubmit: (event: React.FormEvent<HTMLFormElement>) => void
initialPositionCoords: number[]
hasSignalementChanged: boolean
}

export default function SignalementNumeroForm({
Expand All @@ -24,6 +24,7 @@ export default function SignalementNumeroForm({
address,
onSubmit,
initialPositionCoords,
hasSignalementChanged,
}: SignalementNumeroFormProps) {
const isCreation = !address

Expand All @@ -34,12 +35,8 @@ export default function SignalementNumeroForm({
return isDisabled
}

return (
isDisabled ||
JSON.stringify(getInitialSignalement(address, signalement.type)) ===
JSON.stringify(signalement)
)
}, [address, signalement, isCreation])
return isDisabled || !hasSignalementChanged
}, [hasSignalementChanged, signalement, isCreation])

const { numero, suffixe, nomVoie, nomComplement, positions, parcelles, comment } =
signalement.changesRequested as NumeroChangesRequestedDTO
Expand Down
Loading

0 comments on commit 897841b

Please sign in to comment.