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 | 71x 71x 8x 8x 3x 5x 5x 71x 66x | import { Form } from "react-bootstrap";
import { useBackend } from "main/utils/useBackend";
export default function ConceptSelector({
courseId,
onSelect,
testId = "ConceptSelector",
}) {
const { data: concepts = [] } = useBackend(
["/api/concepts/top-level", courseId],
{
method: "GET",
url: "/api/concepts/top-level",
params: { courseId },
},
[],
);
const handleChange = (e) => {
const selectedId = e.target.value;
if (selectedId === "") {
onSelect(null);
} else {
const concept = concepts.find((c) => String(c.id) === selectedId);
onSelect(concept || null);
}
};
return (
<Form.Select data-testid={testId} onChange={handleChange} defaultValue="">
<option value="">-- Select a Concept --</option>
{concepts.map((concept) => (
<option
key={concept.id}
value={concept.id}
data-testid={`${testId}-option-${concept.id}`}
>
{concept.label}
</option>
))}
</Form.Select>
);
}
|