import {
  FormControl,
  FormLabel,
  RadioGroup,
  FormControlLabel,
  Radio,
} from "@mui/material";
import { Sex } from "../api/MemberApi";

export function SexSelection(p: {
  current?: Sex;
  onChange: (s: Sex) => void;
}): React.ReactElement {
  return (
    <FormControl style={{ marginBottom: "15px" }}>
      <FormLabel id="sex-label">Sexe</FormLabel>
      <RadioGroup
        row
        aria-labelledby="sex-label"
        value={p.current}
        onChange={(e) => p.onChange(e.target.value as Sex)}
      >
        <FormControlLabel value="M" control={<Radio />} label="Homme" />
        <FormControlLabel value="F" control={<Radio />} label="Femme" />
      </RadioGroup>
    </FormControl>
  );
}
