Unable to type text inside of material UI TextField

I have a button whose onclick opens up a material UI Dialog which contains a TextField. However, I can't click into the TextField to enter anything. Also, when I click on my button to open the Dialog, I get the error "findDOMNode is deprecated in StrictMode". Seems like that shouldn't affect the functionality based on other answers though.

Everything works normal if I change it to a div containing a normal input field, so it seems like a Material UI problem.

const [open, setOpen] = useState(false);
const [body, setBody] = useState("");
const [errors, setErrors] = useState({});


const handleOpen = () => {
    setOpen(true);
};

const handleClose = () => {
    props.clearErrors();
    setOpen(false);
    setErrors({});
};

const handleChange = (e) => {
    setBody(e.target.value);
};

const handleSubmit = (e) => {
    e.preventDefault();
    props.newPost({ body: body });
};

const { UI: { loading }} = props;

    return (
      <React.Fragment>
        <button onClick={handleOpen}>
          <AddIcon />
        </button>
        <Dialog
          open={open}
          onClose={handleClose}
          fullWidth
          maxWidth="sm">
          <button onClick={handleClose}>
            <CloseIcon />
          </button>
          <DialogTitle>Create a new post</DialogTitle>
          <DialogContent>
            <form onSubmit={handleSubmit}>
              <TextField
                name="body"
                type="text"
                multiline
                rows="3"
                onChange={handleChange}
                fullWidth
              />
              <button
                type="submit"
                variant="contained"
                color="primary"
              >
                Submit
                {loading && (
                  <CircularProgress/>
                )}
              </button>
            </form>
          </DialogContent>
        </Dialog>
      </React.Fragment>
    );
}