Как избежать ошибки Unknown Props при передаче реквизита дочернему компоненту?

Question

export default class Navigation extends React.Component {
  render() {
    const { appName, logoProps } = this.props;

    return (
      <nav>
        <h1>
          <Link to={defaultUrl}>
            <Mainlogo {...logoProps} />
            Mainsite
          </Link>
        </h1>
      </nav>
    );
  }
}

В моем тесте я получаю сообщение об ошибке logoProps,

"React does not recognize the `toString` prop on a DOM element."

Я думаю, потому что я прохожу logoprops внутри link, думаю, это может быть связано с этим

Основной логотип выглядит так

export default class MainLogo extends PureComponent {
  render() {
    return (
      <svg width="500px" height="500px" viewBox="0 0 500 500" version="1.1">
        <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
          <path d="M389.95983 ...9" fill={this.props.Color} />

          <path d="M303.504016,.9639279..." fill={this.props.otherColor} />
        </g>
      </svg>
    );
  }
}

MainLogo.defaultProps = {
  backgroundColor: "#fff"
};