15155733929

Committed 21 May 2025 07:05AM UTC coverage: 49.155% (+1.3%) from 47.832%

Build # 15155733929

Build Type

push

github

Committed by

mradavi

Commit Message

Remove template-related functionality (merge commit)

Merge branch 'feature/remove-templates' into 'main'
* Remove template-related functionality

Closes #1034
See merge request https://gitlab.ci.csc.fi/sds-dev/sd-submit/metadata-submitter-frontend/-/merge_requests/1113

Approved-by: Hang Le <lhang@csc.fi>
Merged by Monika Radaviciute <mradavic@csc.fi>

Run Details

647 of 948 branches covered (68.25%)

Branch coverage included in aggregate %.

6 of 8 new or added lines in 4 files covered. (75.0%)

24 existing lines in 4 files now uncovered.

6160 of 12900 relevant lines covered (47.75%)

4.45 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

74.35

/src/components/SubmissionWizard/WizardSteps/WizardCreateSubmissionStep.tsx

import React, { RefObject, useEffect, useState } from "react"

import {
  Button,
  FormControl,
  FormControlLabel,
  FormLabel,
  FormHelperText,
  Grid,
  Radio,
  RadioGroup,
  TextField,
  Typography,
} from "@mui/material"
import { styled } from "@mui/system"
import { useForm, Controller } from "react-hook-form"
import { useTranslation } from "react-i18next"
import { useNavigate } from "react-router"

import { ResponseStatus } from "constants/responseStatus"
import { ObjectSubmissionTypes } from "constants/wizardObject"
import { updateStatus } from "features/statusMessageSlice"
import { createSubmission, updateSubmission } from "features/wizardSubmissionSlice"
import { setSubmissionType } from "features/wizardSubmissionTypeSlice"
import { setWorkflowType } from "features/workflowTypeSlice"
import { useAppSelector, useAppDispatch } from "hooks"
import workflowAPIService from "services/workflowAPI"
import type { SubmissionDataFromForm, FormRef } from "types"
import { pathWithLocale } from "utils"

const Form = styled("form")({
  "& .MuiTextField-root": {
    margin: "1rem 0",
  },
  padding: "4rem",
})

/**
 * Define React Hook Form for adding new submission. Ref is added to RHF so submission can be triggered outside this component.
 */
const CreateSubmissionForm = ({
  createSubmissionFormRef,
}: {
  createSubmissionFormRef: FormRef
}) => {
  const dispatch = useAppDispatch()
  const projectId = useAppSelector(state => state.projectId)
  const submission = useAppSelector(state => state.submission)

  const { t } = useTranslation()

  const [workflows, setWorkflows] = useState([""])

  useEffect(() => {
    let isMounted = true
    const getAllWorkflows = async () => {
      if (isMounted) {
        let cachedWorkflows = sessionStorage.getItem(`cached_workflows`)

        if (!cachedWorkflows) {
          try {
            const response = await workflowAPIService.getAllWorkflows()
            if (response.ok) {
              cachedWorkflows = JSON.stringify(response.data)
              sessionStorage.setItem(`cached_workflows`, cachedWorkflows)
            }
          } catch (error) {
            dispatch(
              updateStatus({
                status: ResponseStatus.error,
                response: error,
                helperText: "snackbarMessages.error.helperText.fetchWorkflowsError",
              })
            )
          }
        }

        const parsedWorkflows = JSON.parse(cachedWorkflows as string)

        setWorkflows(Object.keys(parsedWorkflows))
      }
    }

    getAllWorkflows()
    return () => {
      isMounted = false
    }
  }, [])

  const {
    handleSubmit,
    control,
    formState: { isSubmitting, isSubmitted },
  } = useForm()

  const navigate = useNavigate()

  const onSubmit = async (data: SubmissionDataFromForm) => {
    if (selectedWorkflowType === "") {
      return
    }

    if (submission && submission?.submissionId) {
      dispatch(updateSubmission(submission.submissionId, Object.assign({ ...data, submission })))
        .then(() => {
          dispatch(
            updateStatus({
              status: ResponseStatus.success,
              helperText: "snackbarMessages.success.submission.updated",
            })
          )
        })
        .catch((error: string) => {
          dispatch(updateStatus({ status: ResponseStatus.error, response: JSON.parse(error) }))
        })
    } else {
      // Create a new submission
      dispatch(setWorkflowType(data.workflowType))
      dispatch(createSubmission(projectId, data))
        .then(response => {
          const submissionId = response.data.submissionId
          navigate({ pathname: pathWithLocale(`submission/${submissionId}`), search: "step=2" })
          dispatch(setSubmissionType(ObjectSubmissionTypes.form))
        })
        .catch((error: string) => {
          dispatch(updateStatus({ status: ResponseStatus.error, response: JSON.parse(error) }))
        })
    }
  }

  const workflowType = useAppSelector(state => state.workflowType)
  const [selectedWorkflowType, setSelectedWorkflowType] = useState(workflowType)

  return (
    <Form
      onSubmit={handleSubmit(async data => onSubmit(data as SubmissionDataFromForm))}
      ref={createSubmissionFormRef as RefObject<HTMLFormElement>}
    >
      <Typography variant="h4" gutterBottom component="div" color="secondary" fontWeight="700">
        {t("newSubmission.nameSubmission")}
      </Typography>
      <Controller
        control={control}
        name="name"
        defaultValue={submission ? submission.name : ""}
        render={({ field, fieldState: { error } }) => (
          <TextField
            {...field}
            label={`${t("newSubmission.submissionName")} *`}
            variant="outlined"
            fullWidth
            error={!!error}
            helperText={error ? t("newSubmission.errors.missingName") : null}
            disabled={isSubmitting}
            inputProps={{ "data-testid": "submissionName" }}
          />
        )}
        rules={{ required: true, validate: { name: value => value.length > 0 } }}
      />
      <Controller
        control={control}
        name="description"
        defaultValue={submission ? submission.description : ""}
        render={({ field, fieldState: { error } }) => (
          <TextField
            {...field}
            label={`${t("newSubmission.submissionDescription")} *`}
            variant="outlined"
            fullWidth
            multiline
            rows={5}
            error={!!error}
            helperText={error ? t("newSubmission.errors.missingDescription") : null}
            disabled={isSubmitting}
            inputProps={{ "data-testid": "submissionDescription" }}
          />
        )}
        rules={{ required: true, validate: { description: value => value.length > 0 } }}
      />

      <Grid sx={{ mt: 2 }} container spacing={2}>
        <Grid>
          <FormLabel
            id="submission-type-selection-label"
            required
            error={selectedWorkflowType === "" && isSubmitted}
            sx={theme => ({
              background: theme.palette.background.default,
              borderRadius: theme.spacing(0.4),
              height: "100%",
              display: "flex",
              alignItems: "center",
              padding: theme.spacing(0, 3, 0, 1.5),
              fontWeight: 600,
              color: theme.palette.secondary.main,
            })}
          >
            {t("newSubmission.typeOfSubmission")}
          </FormLabel>
        </Grid>
        <Grid size={{ xs: 6 }}>
          <FormControl>
            <Controller
              control={control}
              name="workflowType"
              defaultValue={selectedWorkflowType}
              render={({ field }) => {
                const handleChangeWorkflow = (e: React.ChangeEvent<HTMLInputElement>) => {
                  field.onChange(e.target.value)
                  setSelectedWorkflowType(e.target.value)
                }

                return (
                  <RadioGroup
                    {...field}
                    name="submission-type-selection"
                    aria-labelledby="submission-type-selection-label"
                    onChange={handleChangeWorkflow}
                  >
                    {workflows.map(workflow => (
                      <FormControlLabel
                        key={workflow}
                        value={workflow}
                        control={<Radio />}
                        label={workflow}
                        data-testid={workflow}
                        disabled={submission.submissionId !== ""}
                      />
                    ))}
                  </RadioGroup>
                )
              }}
            />
            {selectedWorkflowType === "" && isSubmitted && (
              <FormHelperText error data-testid="missing-workflow-error">
                {t("newSubmission.errors.missingWorkflow")}
              </FormHelperText>
            )}
          </FormControl>
        </Grid>
      </Grid>

      <Button
        sx={{ mt: "2rem", p: "1rem 5rem" }}
        size="large"
        variant="contained"
        type="submit"
        aria-label="Save submission details"
        data-testid="create-submission"
      >
        {t("save")}
      </Button>
    </Form>
  )
}

/**
 * Show form to create submission as first step of new draft wizard
 */

const WizardCreateSubmissionStep = ({
  createSubmissionFormRef,
}: {
  createSubmissionFormRef: FormRef
}) => (
  <>
    <CreateSubmissionForm createSubmissionFormRef={createSubmissionFormRef} />
  </>
)

export default WizardCreateSubmissionStep

1	import React, { RefObject, useEffect, useState } from "react"	1✔
2
3	import {
4	Button,
5	FormControl,
6	FormControlLabel,
7	FormLabel,
8	FormHelperText,
9	Grid,
10	Radio,
11	RadioGroup,
12	TextField,
13	Typography,
14	} from "@mui/material"	1✔
15	import { styled } from "@mui/system"	1✔
16	import { useForm, Controller } from "react-hook-form"	1✔
17	import { useTranslation } from "react-i18next"	1✔
18	import { useNavigate } from "react-router"	1✔
19
20	import { ResponseStatus } from "constants/responseStatus"	1✔
21	import { ObjectSubmissionTypes } from "constants/wizardObject"	1✔
22	import { updateStatus } from "features/statusMessageSlice"	1✔
23	import { createSubmission, updateSubmission } from "features/wizardSubmissionSlice"	1✔
24	import { setSubmissionType } from "features/wizardSubmissionTypeSlice"	1✔
25	import { setWorkflowType } from "features/workflowTypeSlice"	1✔
26	import { useAppSelector, useAppDispatch } from "hooks"	1✔
27	import workflowAPIService from "services/workflowAPI"	1✔
28	import type { SubmissionDataFromForm, FormRef } from "types"
29	import { pathWithLocale } from "utils"	1✔
30
31	const Form = styled("form")({	1✔
32	"& .MuiTextField-root": {	1✔
33	margin: "1rem 0",	1✔
34	},	1✔
35	padding: "4rem",	1✔
36	})	1✔
37
38	/**
39	* Define React Hook Form for adding new submission. Ref is added to RHF so submission can be triggered outside this component.
40	*/
41	const CreateSubmissionForm = ({	1✔
42	createSubmissionFormRef,	2✔
43	}: {
44	createSubmissionFormRef: FormRef
45	}) => {	2✔
46	const dispatch = useAppDispatch()	2✔
47	const projectId = useAppSelector(state => state.projectId)	2✔
48	const submission = useAppSelector(state => state.submission)	2✔
49
50	const { t } = useTranslation()	2✔
51
52	const [workflows, setWorkflows] = useState([""])	2✔
53
54	useEffect(() => {	2✔
55	let isMounted = true	1✔
56	const getAllWorkflows = async () => {	1✔
57	if (isMounted) {	1✔
58	let cachedWorkflows = sessionStorage.getItem(`cached_workflows`)	1✔
59
60	if (!cachedWorkflows) {	1!
61	try {	×
62	const response = await workflowAPIService.getAllWorkflows()	×
63	if (response.ok) {	×
64	cachedWorkflows = JSON.stringify(response.data)	×
65	sessionStorage.setItem(`cached_workflows`, cachedWorkflows)	×
66	}	×
67	} catch (error) {	×
68	dispatch(	×
69	updateStatus({	×
70	status: ResponseStatus.error,	×
71	response: error,	×
72	helperText: "snackbarMessages.error.helperText.fetchWorkflowsError",	×
73	})	×
74	)	×
75	}	×
76	}	×
77
78	const parsedWorkflows = JSON.parse(cachedWorkflows as string)	1✔
79
80	setWorkflows(Object.keys(parsedWorkflows))	1✔
81	}	1✔
82	}	1✔
83
84	getAllWorkflows()	1✔
85	return () => {	1✔
86	isMounted = false	1✔
87	}	1✔
88	}, [])	2✔
89
90	const {	2✔
91	handleSubmit,	2✔
92	control,	2✔
93	formState: { isSubmitting, isSubmitted },	2✔
94	} = useForm()	2✔
95
96	const navigate = useNavigate()	2✔
97
98	const onSubmit = async (data: SubmissionDataFromForm) => {	2✔
99	if (selectedWorkflowType === "") {	×
100	return	×
101	}	×
102
103	if (submission && submission?.submissionId) {	×
104	dispatch(updateSubmission(submission.submissionId, Object.assign({ ...data, submission })))	×
105	.then(() => {	×
106	dispatch(	×
107	updateStatus({	×
108	status: ResponseStatus.success,	×
109	helperText: "snackbarMessages.success.submission.updated",	×
110	})	×
111	)	×
112	})	×
113	.catch((error: string) => {	×
114	dispatch(updateStatus({ status: ResponseStatus.error, response: JSON.parse(error) }))	×
115	})	×
116	} else {	×
117	// Create a new submission
118	dispatch(setWorkflowType(data.workflowType))	×
NEW 119	dispatch(createSubmission(projectId, data))	×
120	.then(response => {	×
121	const submissionId = response.data.submissionId	×
122	navigate({ pathname: pathWithLocale(`submission/${submissionId}`), search: "step=2" })	×
123	dispatch(setSubmissionType(ObjectSubmissionTypes.form))	×
124	})	×
125	.catch((error: string) => {	×
126	dispatch(updateStatus({ status: ResponseStatus.error, response: JSON.parse(error) }))	×
127	})	×
128	}	×
129	}	×
130
131	const workflowType = useAppSelector(state => state.workflowType)	2✔
132	const [selectedWorkflowType, setSelectedWorkflowType] = useState(workflowType)	2✔
133
134	return (	2✔
135	<Form	2✔
136	onSubmit={handleSubmit(async data => onSubmit(data as SubmissionDataFromForm))}	2✔
137	ref={createSubmissionFormRef as RefObject<HTMLFormElement>}	2✔
138	>
139	<Typography variant="h4" gutterBottom component="div" color="secondary" fontWeight="700">	2✔
140	{t("newSubmission.nameSubmission")}	2✔
141	</Typography>	2✔
142	<Controller	2✔
143	control={control}	2✔
144	name="name"	2✔
145	defaultValue={submission ? submission.name : ""}	2!
146	render={({ field, fieldState: { error } }) => (	2✔
147	<TextField	2✔
148	{...field}	2✔
149	label={`${t("newSubmission.submissionName")} *`}	2✔
150	variant="outlined"	2✔
151	fullWidth	2✔
152	error={!!error}	2✔
153	helperText={error ? t("newSubmission.errors.missingName") : null}	2!
154	disabled={isSubmitting}	2✔
155	inputProps={{ "data-testid": "submissionName" }}	2✔
156	/>
157	)}
158	rules={{ required: true, validate: { name: value => value.length > 0 } }}	2✔
159	/>
160	<Controller	2✔
161	control={control}	2✔
162	name="description"	2✔
163	defaultValue={submission ? submission.description : ""}	2!
164	render={({ field, fieldState: { error } }) => (	2✔
165	<TextField	2✔
166	{...field}	2✔
167	label={`${t("newSubmission.submissionDescription")} *`}	2✔
168	variant="outlined"	2✔
169	fullWidth	2✔
170	multiline	2✔
171	rows={5}	2✔
172	error={!!error}	2✔
173	helperText={error ? t("newSubmission.errors.missingDescription") : null}	2!
174	disabled={isSubmitting}	2✔
175	inputProps={{ "data-testid": "submissionDescription" }}	2✔
176	/>
177	)}
178	rules={{ required: true, validate: { description: value => value.length > 0 } }}	2✔
179	/>
180
181	<Grid sx={{ mt: 2 }} container spacing={2}>	2✔
182	<Grid>	2✔
183	<FormLabel	2✔
184	id="submission-type-selection-label"	2✔
185	required	2✔
186	error={selectedWorkflowType === "" && isSubmitted}	2!
187	sx={theme => ({	2✔
188	background: theme.palette.background.default,	2✔
189	borderRadius: theme.spacing(0.4),	2✔
190	height: "100%",	2✔
191	display: "flex",	2✔
192	alignItems: "center",	2✔
193	padding: theme.spacing(0, 3, 0, 1.5),	2✔
194	fontWeight: 600,	2✔
195	color: theme.palette.secondary.main,	2✔
196	})}	2✔
197	>
198	{t("newSubmission.typeOfSubmission")}	2✔
199	</FormLabel>	2✔
200	</Grid>	2✔
201	<Grid size={{ xs: 6 }}>	2✔
202	<FormControl>	2✔
203	<Controller	2✔
204	control={control}	2✔
205	name="workflowType"	2✔
206	defaultValue={selectedWorkflowType}	2✔
207	render={({ field }) => {	2✔
208	const handleChangeWorkflow = (e: React.ChangeEvent<HTMLInputElement>) => {	2✔
209	field.onChange(e.target.value)	×
210	setSelectedWorkflowType(e.target.value)	×
211	}	×
212
213	return (	2✔
214	<RadioGroup	2✔
215	{...field}	2✔
216	name="submission-type-selection"	2✔
217	aria-labelledby="submission-type-selection-label"	2✔
218	onChange={handleChangeWorkflow}	2✔
219	>
220	{workflows.map(workflow => (	2✔
221	<FormControlLabel	2✔
222	key={workflow}	2✔
223	value={workflow}	2✔
224	control={<Radio />}	2✔
225	label={workflow}	2✔
226	data-testid={workflow}	2✔
227	disabled={submission.submissionId !== ""}	2✔
228	/>
229	))}	2✔
230	</RadioGroup>	2✔
231	)
232	}}	2✔
233	/>
234	{selectedWorkflowType === "" && isSubmitted && (	2!
235	<FormHelperText error data-testid="missing-workflow-error">	×
236	{t("newSubmission.errors.missingWorkflow")}	×
237	</FormHelperText>	×
238	)}
239	</FormControl>	2✔
240	</Grid>	2✔
241	</Grid>	2✔
242
243	<Button	2✔
244	sx={{ mt: "2rem", p: "1rem 5rem" }}	2✔
245	size="large"	2✔
246	variant="contained"	2✔
247	type="submit"	2✔
248	aria-label="Save submission details"	2✔
249	data-testid="create-submission"	2✔
250	>
251	{t("save")}	2✔
252	</Button>	2✔
253	</Form>	2✔
254	)
255	}	2✔
256
257	/**
258	* Show form to create submission as first step of new draft wizard
259	*/
260
261	const WizardCreateSubmissionStep = ({	1✔
262	createSubmissionFormRef,	1✔
263	}: {
264	createSubmissionFormRef: FormRef
265	}) => (	1✔
266	<>	1✔
267	<CreateSubmissionForm createSubmissionFormRef={createSubmissionFormRef} />	1✔
268	</>	1✔
269	)
270
271	export default WizardCreateSubmissionStep	1✔

CSCfi / metadata-submitter-frontend / 15155733929

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous