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 | 1x 1x 1x 1x 1x 64x 64x 64x 64x 64x 64x 64x 64x 64x 64x 64x 64x 2x 2x 2x 64x 3x 3x 3x 64x 64x 13x 13x 13x 64x 64x 64x 64x 64x 64x 64x 64x 64x 64x 64x 1x | import { Button, Form } from "react-bootstrap";
import { useState } from "react";
import { useForm } from "react-hook-form";
import { useBackend } from "main/utils/useBackend";
import CommonsSelect from "main/components/Commons/CommonsSelect";
function MilkTheCowsForm({ submitAction, testid = "MilkTheCowsForm" }) {
// Stryker restore all
const { data: commonsAll } = useBackend(
["/api/commons/all"],
{ url: "/api/commons/all" },
[],
);
const allCommonsProp = { id: 0, name: "All Commons" };
const commons = [allCommonsProp, ...commonsAll];
const [selectedCommons, setSelectedCommons] = useState(null);
const [selectedCommonsName, setSelectedCommonsName] = useState(null);
const { handleSubmit } = useForm();
const handleCommonsSelection = (id, name) => {
setSelectedCommons(id);
setSelectedCommonsName(name);
};
const onSubmit = () => {
const params = { selectedCommons, selectedCommonsName };
submitAction(params);
};
// TODO: calculate the selected commons with regular variable instead of setting state in render
if (selectedCommons === null) {
setSelectedCommons(commons[0].id);
setSelectedCommonsName(commons[0].name);
}
return (
<Form onSubmit={handleSubmit(onSubmit)}>
<Form.Group className="mb-3">
<Form.Text htmlFor="description">
Milk the cows in a single or all commons.
</Form.Text>
</Form.Group>
<CommonsSelect
commons={commons}
selectedCommons={selectedCommons}
handleCommonsSelection={handleCommonsSelection}
testid={testid}
/>
<Button type="submit" data-testid="MilkTheCowsForm-Submit-Button">
Milk the cows!
</Button>
</Form>
);
}
export default MilkTheCowsForm;
|