diff --git a/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx b/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx index 2f80a1af3546f9f1eab33df20b070d7ecc739b93..deea70407c726efbdd1266dfcb12678ba585c0f9 100644 --- a/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx +++ b/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx @@ -21,7 +21,9 @@ import ConfirmDialog from '../../../../components/confirmDialog' interface GuestRoleInfoProps { guest: Guest + reloadGuest: () => void } + const endPeriodPost = (id: string, data: { end_date: Date }) => { const payload = { end_date: format(data.end_date as Date, 'yyyy-MM-dd'), @@ -94,7 +96,10 @@ const TableContainer = styled(TableContainerMui)({ paddingBottom: '1.5625rem', }) -export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) { +export default function GuestRoleInfo({ + guest, + reloadGuest, +}: GuestRoleInfoProps) { const { pid, id } = useParams<GuestRoleInfoParams>() const [t] = useTranslation('common') const { displayContactAtUnit, displayComment } = useFeatureContext() @@ -127,6 +132,14 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) { history.push(`/sponsor/guest/${guest.pid}`) } + const { + control, + handleSubmit, + setValue, + reset, + formState: { isDirty, isValid }, + } = useForm<RoleFormData>({ mode: 'onChange' }) + // Submit function for the save button const submit: SubmitHandler<RoleFormData> = (data) => { const payload: { start_date?: string; end_date: string } = { @@ -146,18 +159,17 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) { if (result !== null) { console.log('result', result) } + // Reload the guest so that the information on the overview page is updated + reloadGuest() + // A submit does not clear the dirty state, so resetting values in the form + // to the values just submitted to clear the dirty-flag + reset(data) }) .catch((error) => { console.log('error', error) }) } - const { - control, - handleSubmit, - setValue, - formState: { isDirty, isValid }, - } = useForm<RoleFormData>({ mode: 'onChange' }) const onSubmit = handleSubmit(submit) const [showEndRoleConfirmationDialog, setShowEndRoleConfirmationDialog] = useState(false) diff --git a/frontend/src/routes/sponsor/guest/index.tsx b/frontend/src/routes/sponsor/guest/index.tsx index 49a092dd5ea76030576489ef922838f921279813..37e46d6fa7e40ff5bd4024a71b7d810a2873846d 100644 --- a/frontend/src/routes/sponsor/guest/index.tsx +++ b/frontend/src/routes/sponsor/guest/index.tsx @@ -56,7 +56,7 @@ function GuestRoutes({ reloadGuests }: GuestRoutesProps) { return ( <> <Route path="/sponsor/guest/:pid/roles/:id"> - <GuestRoleInfo guest={guestInfo} /> + <GuestRoleInfo guest={guestInfo} reloadGuest={reloadGuestInfo} /> </Route> <Route exact path="/sponsor/guest/:pid/newrole"> <NewGuestRole guest={guestInfo} reloadGuestInfo={reloadGuestInfo} />