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 63x 63x 63x 63x 63x 63x 63x 63x 63x 63x 63x 63x 2x 2x 2x 63x 3x 3x 3x 63x 63x 13x 13x 13x 63x 63x 63x 63x 63x 63x 63x 63x 63x 63x 63x 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;
|