diff --git a/frontend/public/locales/en/common.json b/frontend/public/locales/en/common.json index ac2696ce7f38a425b78093dd6995b0535391c949..5fd85852fe6b4c87e012763bc9cf47abc8606f73 100644 --- a/frontend/public/locales/en/common.json +++ b/frontend/public/locales/en/common.json @@ -39,6 +39,10 @@ "modifyEnd": "Change end date", "endNow": "End role" }, + "endRoleDialog": { + "title": "End role", + "text": "Ending the role will cause the guest to loose access if there no other active roles registered. Are you sure you want to end the role?" + }, "guestInfo": { "contactInfo": "Contact information", "contactInfoBody": "A guest is only considered active if at least one identification number has been verified.", diff --git a/frontend/public/locales/nb/common.json b/frontend/public/locales/nb/common.json index d52017d7623683cc7ab78538e047ed910757b7bf..204f50746421e8dc8c0b042d1017ab7f3e4224b4 100644 --- a/frontend/public/locales/nb/common.json +++ b/frontend/public/locales/nb/common.json @@ -39,6 +39,10 @@ "modifyEnd": "Endre sluttdato", "endNow": "Avslutt rolle" }, + "endRoleDialog": { + "title": "Avslutt rolle", + "text": "Dersom du avslutter rollen vil gjesten miste tilgang om det ikke eksisterer andre aktive roller. Vil du avslutte rollen?" + }, "guestInfo": { "contactInfo": "Kontaktinformasjon", "contactInfoBody": "For at en gjest skal regnes som aktiv må minst ett identifikasjonsnummer være godkjent.", diff --git a/frontend/public/locales/nn/common.json b/frontend/public/locales/nn/common.json index 21d8b5546127bb6f6df6c093e61450a9869b255d..42a7248ef2d6316f87687d951eb16ddc22c221e5 100644 --- a/frontend/public/locales/nn/common.json +++ b/frontend/public/locales/nn/common.json @@ -39,6 +39,10 @@ "modifyEnd": "Endre sluttdato", "endNow": "Avslutt rolle" }, + "endRoleDialog": { + "title": "Avslutt rolle", + "text": "Dersom du avsluttar rolla vil gjesten miste tilgang om det ikkje eksisterer andre aktive roller. Vil du avslutte rolla?" + }, "guestInfo": { "contactInfo": "Kontaktinformasjon", "contactInfoBody": "For at ein gjest skal reknast som aktiv må minst ett identifikasjonsnummer vere godkjend.", diff --git a/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx b/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx index 50506eccfe7ad8ab6880a0314e55084becc6ba5a..2f80a1af3546f9f1eab33df20b070d7ecc739b93 100644 --- a/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx +++ b/frontend/src/routes/sponsor/guest/guestRoleInfo/index.tsx @@ -11,12 +11,13 @@ import TableCellMui from '@mui/material/TableCell' import Page from 'components/page' import { Guest, Role } from 'interfaces' import { useTranslation } from 'react-i18next' -import { useParams } from 'react-router-dom' +import { useHistory, useParams } from 'react-router-dom' import SponsorInfoButtons from 'routes/components/sponsorInfoButtons' import { DatePicker } from '@mui/lab' import { Controller, SubmitHandler, useForm } from 'react-hook-form' import { getRoleName, getRoleOuName, submitJsonOpts } from 'utils' import { useFeatureContext } from 'contexts/featureContext' +import ConfirmDialog from '../../../../components/confirmDialog' interface GuestRoleInfoProps { guest: Guest @@ -97,6 +98,7 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) { const { pid, id } = useParams<GuestRoleInfoParams>() const [t] = useTranslation('common') const { displayContactAtUnit, displayComment } = useFeatureContext() + const history = useHistory() const [role, setRole] = useState<Role>({ id: '', name_nb: '', @@ -114,9 +116,15 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) { const todayPlusMaxDays = addDays(role.max_days)(today) // Make a function for use with onClick of the end role button - const endPeriod = () => () => { - role.end_date = today - endPeriodPost(id, { end_date: today }) + const endPeriod = () => { + // Set the role to have ended yesterday so that the change is immediate. + // If the role was set to end today, the change will not be active + // until the next date since the end date is inclusive + const newEndDate = addDays(-1)(today) + role.end_date = newEndDate + endPeriodPost(id, { end_date: newEndDate }) + // Go back to guest overview page + history.push(`/sponsor/guest/${guest.pid}`) } // Submit function for the save button @@ -151,6 +159,8 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) { formState: { isDirty, isValid }, } = useForm<RoleFormData>({ mode: 'onChange' }) const onSubmit = handleSubmit(submit) + const [showEndRoleConfirmationDialog, setShowEndRoleConfirmationDialog] = + useState(false) // Find the role info relevant for this page const getRoleInfo = () => { @@ -268,9 +278,23 @@ export default function GuestRoleInfo({ guest }: GuestRoleInfoProps) { > {t('button.save')} </Button>{' '} - <Button color="primary" onClick={endPeriod()}> + {/* If the role has already expired the role end button is disabled */} + <Button + aria-label={t('sponsor.endNow')} + color="primary" + disabled={role.end_date < today} + onClick={() => setShowEndRoleConfirmationDialog(true)} + > {t('sponsor.endNow')} </Button> + <ConfirmDialog + title={t('endRoleDialog.title')} + open={showEndRoleConfirmationDialog} + setOpen={setShowEndRoleConfirmationDialog} + onConfirm={endPeriod} + > + {t('endRoleDialog.text')} + </ConfirmDialog> </form> </Page> )