Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | 1x 1x 1x 1x 1x 1x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 89x 1x | import { Form } from "react-bootstrap";
import { useBackend } from "main/utils/useBackend";
// A dropdown for selecting a Course, backed by /api/course/all.
// When includeNoCourseOption is true, a "No Course" option is added at the
// top, and the field is optional; its value is submitted as null (see
// issue #251).
function CourseSelectDropdown({
formName = "courseId",
displayName = "Course",
initialValue,
register,
includeNoCourseOption = false,
testIdPrefix = "CourseSelectDropdown",
}) {
// Stryker disable all
const { data: courses } = useBackend(["/api/course/all"], {
method: "GET",
url: "/api/course/all",
});
// Stryker restore all
return (
<Form.Group className="mb-3">
<Form.Label htmlFor={formName}>{displayName}</Form.Label>
{Array.isArray(courses) && (
<Form.Select
data-testid={`${testIdPrefix}-${formName}`}
id={formName}
{...register(formName, {
required: includeNoCourseOption ? false : "Course is required.",
setValueAs: (value) => (value === "" ? null : Number(value)),
})}
defaultValue={initialValue ?? ""}
>
{includeNoCourseOption && (
<option value="" data-testid={`${testIdPrefix}-${formName}-none`}>
No Course
</option>
)}
{courses.map((course) => (
<option
key={course.id}
value={course.id}
data-testid={`${testIdPrefix}-${formName}-${course.id}`}
>
{course.code} - {course.name} ({course.term})
</option>
))}
</Form.Select>
)}
</Form.Group>
);
}
export default CourseSelectDropdown;
|