diff --git a/components/apply/AppForm.tsx b/components/apply/AppForm.tsx
index 46c870ad..c3375c0d 100644
--- a/components/apply/AppForm.tsx
+++ b/components/apply/AppForm.tsx
@@ -32,11 +32,20 @@ interface RoleQuestion {
interface ShortAnswerRoleQuestion extends RoleQuestion {
type?: "short-answer";
+ description?: string;
maxLength: number;
}
interface MultiSelectRoleQuestion extends RoleQuestion {
type: "multi-select";
+ description?: string;
+ options: string[];
+ other: boolean;
+}
+
+interface SelectRoleQuestion extends RoleQuestion {
+ type: "select";
+ description?: string;
options: string[];
other: boolean;
}
@@ -45,7 +54,11 @@ export type RoleSpecificQuestion = {
id: number;
role: string;
open?: boolean;
- questions: (ShortAnswerRoleQuestion | MultiSelectRoleQuestion)[];
+ questions: (
+ | ShortAnswerRoleQuestion
+ | MultiSelectRoleQuestion
+ | SelectRoleQuestion
+ )[];
};
export type AppFormValues = {
diff --git a/components/apply/RoleSpecificQuestions.tsx b/components/apply/RoleSpecificQuestions.tsx
index e784bfd8..0d643456 100644
--- a/components/apply/RoleSpecificQuestions.tsx
+++ b/components/apply/RoleSpecificQuestions.tsx
@@ -1,5 +1,6 @@
import { FC, useMemo } from "react";
import MultiSelectInput from "@components/common/MultiSelectInput";
+import SelectInput from "@components/common/SelectInput";
import TextAreaInput from "@components/common/TextAreaInput";
import { AppFormValues, RoleSpecificQuestion } from "./AppForm";
@@ -18,6 +19,7 @@ type AggregatedQuestion = RoleSpecificQuestion["questions"][0] & {
type QuestionInputProps = {
id: string;
labelText: string;
+ description?: string;
value?: string | string[];
question: RoleSpecificQuestion["questions"][0];
readOnly: boolean;
@@ -30,6 +32,8 @@ const QuestionInput = ({
question,
readOnly,
}: QuestionInputProps) => {
+ const { description } = question;
+
switch (question.type) {
case "multi-select": {
return (
@@ -43,6 +47,19 @@ const QuestionInput = ({
/>
);
}
+ case "select": {
+ return (
+
+ );
+ }
case "short-answer":
default:
return (
diff --git a/components/common/SelectInput.tsx b/components/common/SelectInput.tsx
index 94d71475..09501de4 100644
--- a/components/common/SelectInput.tsx
+++ b/components/common/SelectInput.tsx
@@ -4,6 +4,7 @@ import { FC } from "react";
type Props = {
readonly id: string;
readonly labelText?: string;
+ readonly description?: string;
readonly value?: string;
readonly options: string[];
readonly required: boolean;
@@ -13,6 +14,7 @@ type Props = {
const SelectInput: FC = ({
id,
labelText,
+ description,
value,
options,
required,
@@ -24,6 +26,9 @@ const SelectInput: FC = ({
)}
{readOnly ? (
@@ -32,6 +37,7 @@ const SelectInput: FC = ({
{
{APPLICATION_IS_LIVE && (