Add required props to form field types

5 files changed, 13 insertions, 9 deletions

diff --git a/src/components/InputTypes/Range.tsx b/src/components/InputTypes/Range.tsx
index e2f89f4..b41a960 100644
--- a/src/components/InputTypes/Range.tsx
+++ b/src/components/InputTypes/Range.tsx
@@ -7,7 +7,8 @@ import { hiddenInput, multiSelectInput } from "../../commonStyles";
 interface RangeProps {
     question_id: string,
     options: Array<string>,
-    handler: (event: ChangeEvent<HTMLInputElement>) => void
+    handler: (event: ChangeEvent<HTMLInputElement>) => void,
+    required: boolean
 }
 
 const containerStyles = css`
diff --git a/src/components/InputTypes/Select.tsx b/src/components/InputTypes/Select.tsx
index e753357..4e66002 100644
--- a/src/components/InputTypes/Select.tsx
+++ b/src/components/InputTypes/Select.tsx
@@ -5,7 +5,8 @@ import { hiddenInput } from "../../commonStyles";
 
 interface SelectProps {
     options: Array<string>,
-    state_dict: Map<string, string | boolean | null>
+    state_dict: Map<string, string | boolean | null>,
+    required: boolean
 }
 
 const containerStyles = css`
diff --git a/src/components/InputTypes/ShortText.tsx b/src/components/InputTypes/ShortText.tsx
index 1e38bcd..d34bd01 100644
--- a/src/components/InputTypes/ShortText.tsx
+++ b/src/components/InputTypes/ShortText.tsx
@@ -4,7 +4,8 @@ import React, { ChangeEvent } from "react";
 import { textInputs } from "../../commonStyles";
 
 interface ShortTextProps {
-    handler: (event: ChangeEvent<HTMLInputElement>) => void
+    handler: (event: ChangeEvent<HTMLInputElement>) => void,
+    required: boolean
 }
 
 export default function ShortText(props: ShortTextProps): JSX.Element {
diff --git a/src/components/InputTypes/TextArea.tsx b/src/components/InputTypes/TextArea.tsx
index 6e46c27..40547bb 100644
--- a/src/components/InputTypes/TextArea.tsx
+++ b/src/components/InputTypes/TextArea.tsx
@@ -4,7 +4,8 @@ import React, { ChangeEvent } from "react";
 import { textInputs } from "../../commonStyles";
 
 interface TextAreaProps {
-    handler: (event: ChangeEvent<HTMLTextAreaElement>) => void
+    handler: (event: ChangeEvent<HTMLTextAreaElement>) => void,
+    required: boolean
 }
 
 const styles = css`
diff --git a/src/components/InputTypes/index.tsx b/src/components/InputTypes/index.tsx
index f1e0b30..a597c94 100644
--- a/src/components/InputTypes/index.tsx
+++ b/src/components/InputTypes/index.tsx
@@ -34,7 +34,7 @@ export default function create_input({ question, public_state }: QuestionProp, h
     /* eslint-disable react/react-in-jsx-scope */
     switch (question.type) {
         case QuestionType.TextArea:
-            result = <TextArea handler={handler}/>;
+            result = <TextArea handler={handler} required={question.required} />;
             break;
 
         case QuestionType.Checkbox:
@@ -46,15 +46,15 @@ export default function create_input({ question, public_state }: QuestionProp, h
             break;
 
         case QuestionType.Select:
-            result = <Select options={options} state_dict={public_state}/>;
+            result = <Select options={options} state_dict={public_state} required={question.required}/>;
             break;
 
         case QuestionType.ShortText:
-            result = <ShortText handler={handler}/>;
+            result = <ShortText handler={handler} required={question.required}/>;
             break;
 
         case QuestionType.Range:
-            result = <Range question_id={question.id} options={options} handler={handler}/>;
+            result = <Range question_id={question.id} options={options} handler={handler} required={question.required}/>;
             break;
 
         case QuestionType.Code:
@@ -63,7 +63,7 @@ export default function create_input({ question, public_state }: QuestionProp, h
             break;
 
         default:
-            result = <TextArea handler={handler}/>;
+            result = <TextArea handler={handler} required={question.required}/>;
     }
     /* eslint-enable react/react-in-jsx-scope */