diff --git a/react/src/dashboard/components/modals/ModalFundRequestClarify.tsx b/react/src/dashboard/components/modals/ModalFundRequestClarify.tsx
index 9b8c81af5..18b068593 100644
--- a/react/src/dashboard/components/modals/ModalFundRequestClarify.tsx
+++ b/react/src/dashboard/components/modals/ModalFundRequestClarify.tsx
@@ -1,7 +1,6 @@
import React from 'react';
import { ModalState } from '../../modules/modals/context/ModalContext';
import useFormBuilder from '../../hooks/useFormBuilder';
-import FormError from '../elements/forms/errors/FormError';
import { ResponseError } from '../../props/ApiResponses';
import useSetProgress from '../../hooks/useSetProgress';
import FundRequest from '../../props/models/FundRequest';
@@ -9,6 +8,12 @@ import { useFundRequestValidatorService } from '../../services/FundRequestValida
import Organization from '../../props/models/Organization';
import FundRequestRecord from '../../props/models/FundRequestRecord';
import classNames from 'classnames';
+import FormGroup from '../elements/forms/elements/FormGroup';
+import FormPane from '../elements/forms/elements/FormPane';
+import InfoBox from '../elements/info-box/InfoBox';
+import SelectControl from '../elements/select-control/SelectControl';
+
+type Requirement = 'no' | 'optional' | 'required';
export default function ModalFundRequestClarify({
modal,
@@ -28,32 +33,43 @@ export default function ModalFundRequestClarify({
const setProgress = useSetProgress();
const fundRequestService = useFundRequestValidatorService();
- const form = useFormBuilder({ question: '' }, async () => {
- setProgress(0);
+ const form = useFormBuilder<{
+ text_requirement: Requirement;
+ files_requirement: Requirement;
+ question: string;
+ }>(
+ {
+ text_requirement: 'required',
+ files_requirement: 'required',
+ question: '',
+ },
+ async () => {
+ setProgress(0);
- return fundRequestService
- .requestRecordClarification(
- organization.id,
- fundRequestRecord.fund_request_id,
- fundRequestRecord.id,
- form.values.question,
- )
- .then(() => {
- modal.close();
- onSubmitted();
- })
- .catch((err: ResponseError) => {
- form.setIsLocked(false);
+ return fundRequestService
+ .requestRecordClarification(organization.id, fundRequestRecord.fund_request_id, {
+ fund_request_record_id: fundRequestRecord.id,
+ text_requirement: form.values.text_requirement,
+ files_requirement: form.values.files_requirement,
+ question: form.values.question,
+ })
+ .then(() => {
+ modal.close();
+ onSubmitted();
+ })
+ .catch((err: ResponseError) => {
+ form.setIsLocked(false);
- if (err.status === 422) {
- return form.setErrors(err.data.errors);
- }
+ if (err.status === 422) {
+ return form.setErrors(err.data.errors);
+ }
- modal.close();
- onSubmitted(err);
- })
- .finally(() => setProgress(100));
- });
+ modal.close();
+ onSubmitted(err);
+ })
+ .finally(() => setProgress(100));
+ },
+ );
return (
@@ -66,7 +82,7 @@ export default function ModalFundRequestClarify({
-
+
Aanvullingsverzoek
@@ -74,16 +90,74 @@ export default function ModalFundRequestClarify({
Voeg een bericht toe aan dit verzoek.
-