diff --git a/frontend/src/routes/register/index.tsx b/frontend/src/routes/register/index.tsx
index e7d1053e70baf38ffd8012e33f3c07fcac1a3c40..d681c720cb6cae99c2ed5dfe054a3861f4e27f2c 100644
--- a/frontend/src/routes/register/index.tsx
+++ b/frontend/src/routes/register/index.tsx
@@ -5,15 +5,22 @@ import { Box, Button } from '@mui/material'
import Page from 'components/page'
import { useHistory } from 'react-router-dom'
+import format from 'date-fns/format'
import { RegisterFormData } from './formData'
import StepSummary from './stepSummary'
import StepPersonForm from './stepPersonForm'
import { PersonFormMethods } from './personFormMethods'
-import { SummaryFormMethods } from './summaryFormMethods'
import SubmitState from './submitState'
import SponsorGuestButtons from '../components/sponsorGuestButtons'
+import { postJsonOpts } from '../../utils'
+/**
+ *
+ * This component controls the invite process where the sponsor
+ * enters the initial information about a guest.
+ *
+ */
export default function StepRegistration() {
const { t } = useTranslation(['common'])
const [formData, setFormData] = useState<RegisterFormData>({
@@ -32,9 +39,9 @@ export default function StepRegistration() {
const SUMMARY_STEP = 1
const [activeStep, setActiveStep] = useState(0)
const personFormRef = useRef<PersonFormMethods>(null)
- const summaryStepRef = useRef<SummaryFormMethods>(null)
const [submitState, setSubmitState] = useState(SubmitState.NotSubmitted)
+
const handleNext = () => {
if (activeStep === 0) {
if (personFormRef.current) {
@@ -46,9 +53,38 @@ export default function StepRegistration() {
}
const registerGuest = () => {
- if (summaryStepRef.current) {
- summaryStepRef.current.doSubmit()
+ const payload = {
+ first_name: formData.first_name,
+ last_name: formData.last_name,
+ email: formData.email,
+ role: {
+ type: formData.role_type,
+ start_date: formData.role_start === null ? null : format(formData.role_start as Date, 'yyyy-MM-dd'),
+ end_date: formData.role_end === null ? null : format(formData.role_end as Date, 'yyyy-MM-dd'),
+ comments: formData.comment,
+ orgunit_id: formData.ou_id,
+ },
}
+
+ console.log('submitting', JSON.stringify(payload))
+ fetch('/api/ui/v1/invite/', postJsonOpts(payload))
+ .then((res) => {
+ if (!res.ok) {
+ setSubmitState(SubmitState.SubmitFailure)
+ return null
+ }
+ return res.text()
+ })
+ .then((result) => {
+ if (result !== null) {
+ console.log('result', result)
+ setSubmitState(SubmitState.SubmitSuccess)
+ }
+ })
+ .catch((error) => {
+ console.log('error', error)
+ setSubmitState(SubmitState.SubmitFailure)
+ })
}
const handleBack = () => {
@@ -66,14 +102,6 @@ export default function StepRegistration() {
history.push('/')
}
- const handleSubmitSuccess = () => {
- setSubmitState(SubmitState.SubmitSuccess)
- }
-
- const handleSubmitFailure = () => {
- setSubmitState(SubmitState.SubmitFailure)
- }
-
return (
<Page>
<SponsorGuestButtons registerNewGuestActive />
@@ -89,9 +117,6 @@ export default function StepRegistration() {
{activeStep === SUMMARY_STEP && (
<StepSummary
formData={formData}
- onSubmitSuccess={handleSubmitSuccess}
- onSubmitFailure={handleSubmitFailure}
- ref={summaryStepRef}
/>
)}
</Box>
@@ -132,6 +157,20 @@ export default function StepRegistration() {
{t('button.cancel')}
</Button>
</Box>
+
+ {/* TODO For now just showing a heading to give the user some feedback. Should probably go to a different page on success */}
+ {submitState === SubmitState.SubmitSuccess && (
+ <Box>
+ <h2>Submit success</h2>
+ </Box>
+ )}
+
+ {submitState === SubmitState.SubmitFailure && (
+ <Box>
+ <h2>Submit failure</h2>
+ </Box>
+ )}
+
</Page>
)
}
diff --git a/frontend/src/routes/register/stepSummary.tsx b/frontend/src/routes/register/stepSummary.tsx
index 2f2f432afbeb51908c09376b3cd4205f11572d79..9d38d28524c4340cdd9f719d1b22aa1a5622201e 100644
--- a/frontend/src/routes/register/stepSummary.tsx
+++ b/frontend/src/routes/register/stepSummary.tsx
@@ -1,4 +1,4 @@
-import React, { forwardRef, Ref, useImperativeHandle, useState } from 'react'
+import React, { forwardRef } from 'react'
import { useTranslation } from 'react-i18next'
import {
@@ -14,69 +14,19 @@ import {
import format from 'date-fns/format'
import i18n from 'i18next'
import { RegisterFormData } from './formData'
-import { postJsonOpts } from '../../utils'
-import { PersonFormMethods } from './personFormMethods'
import useOus from '../../hooks/useOus'
import useRoleTypes from '../../hooks/useRoleTypes'
-import SubmitState from './submitState'
interface StepSummaryProperties {
formData: RegisterFormData
- onSubmitSuccess: () => void
- onSubmitFailure: () => void
}
-const StepSummary = forwardRef((props: StepSummaryProperties, ref: Ref<PersonFormMethods>) => {
+const StepSummary = forwardRef((props: StepSummaryProperties) => {
const { t } = useTranslation(['common'])
- const { formData, onSubmitSuccess, onSubmitFailure } = props
+ const { formData } = props
const ous = useOus()
const roleTypes = useRoleTypes()
- const [submitState, setSubmitState] = useState(SubmitState.NotSubmitted)
-
- const submit = () => {
- const payload = {
- first_name: formData.first_name,
- last_name: formData.last_name,
- email: formData.email,
- role: {
- type: formData.role_type,
- start_date: formData.role_start === null ? null : format(formData.role_start as Date, 'yyyy-MM-dd'),
- end_date: formData.role_end === null ? null : format(formData.role_end as Date, 'yyyy-MM-dd'),
- comments: formData.comment,
- orgunit_id: formData.ou_id,
- },
- }
-
- console.log('submitting', JSON.stringify(payload))
- fetch('/api/ui/v1/invite/', postJsonOpts(payload))
- .then((res) => {
- if (!res.ok) {
- onSubmitFailure()
- setSubmitState(SubmitState.SubmitFailure)
- return null
- }
- return res.text()
- })
- .then((result) => {
- if (result !== null) {
- console.log('result', result)
- onSubmitSuccess()
- setSubmitState(SubmitState.SubmitSuccess)
- }
- })
- .catch((error) => {
- console.log('error', error)
- onSubmitFailure()
- setSubmitState(SubmitState.SubmitFailure)
- })
- }
-
- function doSubmit() {
- return submit()
- }
-
- useImperativeHandle(ref, () => ({ doSubmit }))
const selectedOus = ous.find((value) => value.id === formData.ou_id)
const ousName = selectedOus === undefined ? '' : (`${i18n.language === 'en' ? selectedOus.en : selectedOus.nb} (${selectedOus.id})`)
@@ -149,19 +99,6 @@ const StepSummary = forwardRef((props: StepSummaryProperties, ref: Ref<PersonFor
</TableRow>
</TableBody>
</Table>
-
- {/* TODO For now just showing a heading to give the user some feedback */}
- {submitState === SubmitState.SubmitSuccess && (
- <Box>
- <h2>Submit success</h2>
- </Box>
- )}
-
- {submitState === SubmitState.SubmitFailure && (
- <Box>
- <h2>Submit failure</h2>
- </Box>
- )}
</Box>
</>
)
diff --git a/frontend/src/routes/register/summaryFormMethods.ts b/frontend/src/routes/register/summaryFormMethods.ts
deleted file mode 100644
index cae925ff66f791fe9157b5a811bdc7fa7b24ae0f..0000000000000000000000000000000000000000
--- a/frontend/src/routes/register/summaryFormMethods.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export interface SummaryFormMethods {
- doSubmit: () => Promise<void>
-}