React proptypes when using shape cannot validate

Question

I got a react component that doesn't want to validate props, I can't understand why.

This is the component :

import { TextField } from "@mui/material";
import { useGridApiContext } from "@mui/x-data-grid-premium";
import Utils from "utils/utils";
import PropTypes from "prop-types";

export function TimeEditInputCell({ props }) {
  const { id, value, field } = props;

  const apiRef = useGridApiContext();

  const handleChange = (newValue) => {
    apiRef.current.setEditCellValue({
      id,
      field,
      value: newValue,
      debounceMs: 1000,
    });
  };

  const onKeyDown = (e) => {
    if (e.key.toLowerCase() === "enter") {
      const ignoreCellModeRow = {
        id: id,
        ignoreModifications: false,
      };
      apiRef.current.stopRowEditMode(ignoreCellModeRow);
    }
  };

  return (
    <TextField
      onKeyDown={(e) => onKeyDown(e)}
      defaultValue={Utils.minutesToString(value)}
      onChange={(e) => handleChange(e.target.value)}
    />
  );
}

TimeEditInputCell.propTypes = {
  props: PropTypes.shape({
    id: PropTypes.string.isRequired,
    value: PropTypes.number.isRequired,
    field: PropTypes.string.isRequired,
  }),
};

I've got no error in console, however when I run linter I got these errors :

  7:11  warning  'id' is missing in props validation     react/prop-types
  7:15  warning  'value' is missing in props validation  react/prop-types
  7:22  warning  'field' is missing in props validation  react/prop-types

I tried to define these variables outside from shape, which make pass the linter but then it throws error in console in browser because it's undefined (obviously since it's not defined)

EDIT :

I could make it work but I lose verifications by doing it this way :

import { TextField } from "@mui/material";
import { useGridApiContext } from "@mui/x-data-grid-premium";
import Utils from "utils/utils";
import PropTypes from "prop-types";

export function TimeEditInputCell({ rowInformations }) {
  const apiRef = useGridApiContext();

  const handleChange = (newValue) => {
    apiRef.current.setEditCellValue({
      id: rowInformations.id,
      field: rowInformations.field,
      value: newValue,
      debounceMs: 1000,
    });
  };

  const onKeyDown = (e) => {
    if (e.key.toLowerCase() === "enter") {
      const ignoreCellModeRow = {
        id: rowInformations.id,
        ignoreModifications: false,
      };
      apiRef.current.stopRowEditMode(ignoreCellModeRow);
    }
  };

  return (
    <TextField
      onKeyDown={(e) => onKeyDown(e)}
      defaultValue={Utils.minutesToString(rowInformations.value)}
      onChange={(e) => handleChange(e.target.value)}
    />
  );
}

TimeEditInputCell.propTypes = {
  rowInformations: PropTypes.object,
};

But I'm still not fine with that solution since it makes verifications less precise