diff --git a/src/api/Procuration/Hooks/useProcurationProxySlotState.tsx b/src/api/Procuration/Hooks/useProcurationProxySlotState.tsx new file mode 100644 index 000000000..55d892667 --- /dev/null +++ b/src/api/Procuration/Hooks/useProcurationProxySlotState.tsx @@ -0,0 +1,21 @@ +import { useErrorHandler } from '~/components/shared/error/hooks' +import { ProcurationService, ProcurationServiceKey } from '../procuration.service' +import { useMutation, useQueryClient } from '@tanstack/react-query' +import { addBreadcrumb } from '@sentry/react' + +export default function useProcurationProxySlotState() { + const { handleError } = useErrorHandler() + const client = useQueryClient() + + return useMutation({ + mutationFn: ProcurationService.updateProxySlot, + onSettled: () => + client.invalidateQueries({ + queryKey: [ProcurationServiceKey.availableProxies], + }), + onError: (error: Error) => { + addBreadcrumb({ message: 'Error while matching procuration' }) + handleError(error) + }, + }) +} diff --git a/src/api/Procuration/Hooks/useProcurationRequestSlotState.tsx b/src/api/Procuration/Hooks/useProcurationRequestSlotState.tsx new file mode 100644 index 000000000..2a1a59f4f --- /dev/null +++ b/src/api/Procuration/Hooks/useProcurationRequestSlotState.tsx @@ -0,0 +1,21 @@ +import { useErrorHandler } from '~/components/shared/error/hooks' +import { ProcurationService, ProcurationServiceKey } from '../procuration.service' +import { useMutation, useQueryClient } from '@tanstack/react-query' +import { addBreadcrumb } from '@sentry/react' + +export default function useProcurationRequestSlotState() { + const { handleError } = useErrorHandler() + const client = useQueryClient() + + return useMutation({ + mutationFn: ProcurationService.updateRequestSlot, + onSettled: () => + client.invalidateQueries({ + queryKey: [ProcurationServiceKey.request], + }), + onError: (error: Error) => { + addBreadcrumb({ message: 'Error while matching procuration' }) + handleError(error) + }, + }) +} diff --git a/src/api/Procuration/procuration.model.ts b/src/api/Procuration/procuration.model.ts index 5deb42f5a..8f5c4a2d8 100644 --- a/src/api/Procuration/procuration.model.ts +++ b/src/api/Procuration/procuration.model.ts @@ -81,6 +81,7 @@ export interface SlotModel { uuid: string created_at: string round: RoundModel + manual: boolean request: null | ProcurationProxyDetailModel proxy: null | ProcurationProxyDetailModel } diff --git a/src/api/Procuration/procuration.service.ts b/src/api/Procuration/procuration.service.ts index f79df5f5f..d2d070e06 100644 --- a/src/api/Procuration/procuration.service.ts +++ b/src/api/Procuration/procuration.service.ts @@ -15,6 +15,8 @@ export const ProcurationServiceKey = { const base = 'v3/procuration/requests' const proxyBase = 'v3/procuration/proxies' +const slotBase = 'v3/procuration/request_slots' +const proxySlotBase = 'v3/procuration/proxy_slots' export const ProcurationService = { listRequests: ({ params, signal }: PaginatedApiQueryBaseModel): Promise> => @@ -51,6 +53,11 @@ export const ProcurationService = { }), update: ({ uuid, status }: { uuid: string; status: ProcurationStatusEnum }) => apiClient.patch(`${base}/${uuid}`, { status }), + updateProxySlot: ({ uuid, payload }: { uuid: string; payload: { manual: boolean } }) => + apiClient.put(`${proxySlotBase}/${uuid}`, payload), + + updateRequestSlot: ({ uuid, payload }: { uuid: string; payload: { manual: boolean } }) => + apiClient.put(`${slotBase}/${uuid}`, payload), updateProxy: ({ uuid, status }: { uuid: string; status: ProcurationStatusEnum }) => apiClient.patch(`${proxyBase}/${uuid}`, { status }), } diff --git a/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardButtonGroup.tsx b/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardButtonGroup.tsx index 682aadfa7..442104135 100644 --- a/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardButtonGroup.tsx +++ b/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardButtonGroup.tsx @@ -5,14 +5,14 @@ import { } from '~/components/Procurations/Components/MandantTab/Components/MandatePersonCard/MandatePersonCard' export default function MandatePersonCardButtonGroup( - props: { fullWidth?: boolean; extraText?: string } & Omit & { + props: { fullWidth?: boolean; extraText?: string; disabled?: boolean } & Omit & { onSelect: () => void } ) { switch (props.type) { case MandatePersonCardType.FIND: return ( - ) diff --git a/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardStateActions.tsx b/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardStateActions.tsx index 751234bcf..ebc554c67 100644 --- a/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardStateActions.tsx +++ b/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardStateActions.tsx @@ -1,40 +1,80 @@ import { useCallback, useState } from 'react' import useProcurationProxyState from '~/api/Procuration/Hooks/useProcurationProxyState' import useProcurationState from '~/api/Procuration/Hooks/useProcurationState' -import { ProcurationStatusEnum } from '~/api/Procuration/procuration.model' +import { ProcurationStatusEnum, SlotModel } from '~/api/Procuration/procuration.model' import { Button, Grid } from '@mui/material' -import { MuiSpacing } from '~/theme/spacing' import ConfirmationModal from '~/ui/Confirmation' import { MandatePersonCardProps, MandatePersonCardType, } from '~/components/Procurations/Components/MandantTab/Components/MandatePersonCard/MandatePersonCard' +import useProcurationRequestSlotState from '~/api/Procuration/Hooks/useProcurationRequestSlotState' +import useProcurationProxySlotState from '~/api/Procuration/Hooks/useProcurationProxySlotState' -export default function MandatePersonCardStateActions(props: MandatePersonCardProps) { - const [shouldConfirmExclude, setShouldConfirmExclude] = useState(false) +export function MandatePersonCardStateManual({ + currentSlot, + ...props +}: MandatePersonCardProps & { currentSlot: Omit }) { const [shouldConfirmManual, setShouldConfirmManual] = useState(false) - const isProxy = [MandatePersonCardType.MATCH_PROXY, MandatePersonCardType.MATCHED_PROXY].includes(props.type) - const { mutateAsync, isLoading } = isProxy ? useProcurationProxyState() : useProcurationState() + const { mutateAsync, isLoading } = isProxy ? useProcurationProxySlotState() : useProcurationRequestSlotState() const onManual = useCallback(() => { - if (!props.uuid) { + if (!currentSlot.uuid) { return } if (shouldConfirmManual) { mutateAsync({ - status: ProcurationStatusEnum.MANUAL, - uuid: props.uuid, + payload: { + manual: !currentSlot.manual, + }, + uuid: currentSlot.uuid, }).then(() => { setShouldConfirmManual(false) }) } else { setShouldConfirmManual(true) } - }, [mutateAsync, props.uuid, shouldConfirmManual]) + }, [mutateAsync, currentSlot.uuid, shouldConfirmManual, currentSlot.manual]) const onCancelManual = useCallback(() => setShouldConfirmManual(false), []) + const modalDescription = currentSlot.manual + ? `Êtes-vous sûr de vouloir retirer le traitement manuel du ${currentSlot.round.name} de ${props.firstName} ?` + : `Êtes-vous sûr de vouloir passer en traitement manuel le ${currentSlot.round.name} de ${props.firstName} ?` + + return ( + <> + {!isProxy && ( + + )} + + {shouldConfirmManual && ( + + )} + + ) +} + +export function MandatePersonCardStateExclude(props: MandatePersonCardProps) { + const [shouldConfirmExclude, setShouldConfirmExclude] = useState(false) + const isProxy = [MandatePersonCardType.MATCH_PROXY, MandatePersonCardType.MATCHED_PROXY].includes(props.type) + const { mutateAsync, isLoading } = isProxy ? useProcurationProxyState() : useProcurationState() + const onExclude = useCallback(() => { if (!props.uuid) { return @@ -55,19 +95,10 @@ export default function MandatePersonCardStateActions(props: MandatePersonCardPr return ( <> - - {!isProxy && ( - - - - )} - - - + + {shouldConfirmExclude && ( @@ -80,16 +111,6 @@ export default function MandatePersonCardStateActions(props: MandatePersonCardPr isLoading={isLoading} /> )} - - {shouldConfirmManual && ( - - )} ) } diff --git a/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/MandatePersonCard.tsx b/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/MandatePersonCard.tsx index da58a25e7..fe061e609 100644 --- a/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/MandatePersonCard.tsx +++ b/src/components/Procurations/Components/MandantTab/Components/MandatePersonCard/MandatePersonCard.tsx @@ -13,7 +13,10 @@ import { grey, success, tagsColor } from '~/theme/palette' import { MuiSpacing, withBottomSpacing } from '~/theme/spacing' import { fontWeight } from '~/theme/typography' import { UIChip } from '~/ui/Card' -import MandatePersonCardStateActions from '~/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardStateActions' +import { + MandatePersonCardStateManual, + MandatePersonCardStateExclude, +} from '~/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardStateActions' import MandatePersonCardButtonGroup from '~/components/Procurations/Components/MandantTab/Components/MandatePersonCard/Components/MandatePersonCardButtonGroup' import { SlotModel } from '~/api/Procuration/procuration.model' import { getFormattedDate } from '~/utils/date' @@ -67,6 +70,9 @@ export default function MandatePersonCard(props: MandatePersonCardProps) { + + {!props.hideStateActions && } + {[ @@ -103,20 +109,31 @@ export default function MandatePersonCard(props: MandatePersonCardProps) { - {props.type === MandatePersonCardType.FIND || props.roundId === x.round.uuid ? ( - - {x.proxy.length < 1 && ( - <> - props.onSelect?.(x.round.uuid)} - extraText={x.round.name} - /> - - )} + + {props.type === MandatePersonCardType.FIND || props.roundId === x.round.uuid ? ( + <> + + {x.proxy.length < 1 && ( + props.onSelect?.(x.round.uuid)} + extraText={x.round.name} + /> + )} + + + + + + ) : null} + + {[MandatePersonCardType.MATCHED_MANDANT].includes(props.type) && x.manual && ( + + - ) : null} + )} {x.proxy !== undefined && [MandatePersonCardType.MATCH_PROXY, MandatePersonCardType.MATCHED_PROXY].includes(props.type) && ( @@ -191,7 +208,6 @@ export default function MandatePersonCard(props: MandatePersonCardProps) { {props.extraInfos && } - {!props.hideStateActions && } {!props.expended && props.onExpend && props.onExpend?.(props.id)} />} {props.expended && (