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 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 | 1x 1x 1x 1x 1x 1x 1x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 31x 1x | import { Button, Form } from "react-bootstrap";
import { useForm } from "react-hook-form";
import { useNavigate } from "react-router";
// A course-scoped form for adding/editing a single roster student. courseId
// is not a field on this form: the caller (a course's own admin page)
// already knows which course it's operating on, and merges courseId into
// the submitted data itself (see StudentsTabComponent). See issue #251.
function StudentsForm({
initialContents,
submitAction,
buttonLabel = "Create",
cancelDisabled = false,
}) {
// Stryker disable all
const {
register,
formState: { errors },
handleSubmit,
} = useForm({ defaultValues: initialContents || {} });
// Stryker restore all
const navigate = useNavigate();
const testIdPrefix = "StudentsForm";
return (
<Form onSubmit={handleSubmit(submitAction)}>
{initialContents?.id != null && (
<Form.Group className="mb-3">
<Form.Label htmlFor="id">Id</Form.Label>
<Form.Control
// Stryker disable next-line all
data-testid={testIdPrefix + "-id"}
id="id"
type="text"
{...register("id")}
value={initialContents.id}
disabled
/>
</Form.Group>
)}
<Form.Group className="mb-3">
<Form.Label htmlFor="lastName">Last Name</Form.Label>
<Form.Control
// Stryker disable next-line all
data-testid={testIdPrefix + "-lastName"}
id="lastName"
type="text"
isInvalid={Boolean(errors.lastName)}
{...register("lastName", {
required: "Last name is required.",
})}
/>
<Form.Control.Feedback type="invalid">
{errors.lastName && "Last name is required."}
</Form.Control.Feedback>
</Form.Group>
<Form.Group className="mb-3">
<Form.Label htmlFor="firstMiddleName">First/Middle Name</Form.Label>
<Form.Control
// Stryker disable next-line all
data-testid={testIdPrefix + "-firstMiddleName"}
id="firstMiddleName"
type="text"
isInvalid={Boolean(errors.firstMiddleName)}
{...register("firstMiddleName", {
required: "First/Middle name is required.",
})}
/>
<Form.Control.Feedback type="invalid">
{errors.firstMiddleName && "First/Middle name is required."}
</Form.Control.Feedback>
</Form.Group>
<Form.Group className="mb-3">
<Form.Label htmlFor="email">Email</Form.Label>
<Form.Control
// Stryker disable next-line all
data-testid={testIdPrefix + "-email"}
id="email"
type="text"
isInvalid={Boolean(errors.email)}
{...register("email", {
required: "Email is required.",
})}
/>
<Form.Control.Feedback type="invalid">
{errors.email && "Email is required."}
</Form.Control.Feedback>
</Form.Group>
<Form.Group className="mb-3">
<Form.Label htmlFor="perm">Perm Number</Form.Label>
<Form.Control
// Stryker disable next-line all
data-testid={testIdPrefix + "-perm"}
id="perm"
type="text"
isInvalid={Boolean(errors.perm)}
{...register("perm", {
required: "Perm number is required.",
})}
/>
<Form.Control.Feedback type="invalid">
{errors.perm && "Perm number is required."}
</Form.Control.Feedback>
</Form.Group>
<Button
type="submit"
// Stryker disable next-line all
data-testid={testIdPrefix + "-submit"}
>
{buttonLabel}
</Button>
{!cancelDisabled && (
<Button
variant="Secondary"
onClick={() => navigate(-1)}
// Stryker disable next-line all
data-testid={testIdPrefix + "-cancel"}
>
Cancel
</Button>
)}
</Form>
);
}
export default StudentsForm;
|