Why getting Cannot read properties of undefined (reading 'object') error?

Question

I have a react application having a community chat feature. The code for the comment section is : I am a newbie to this error and have no clue about it, can someone suggest the issue in order to resolve it?The error is in react-layout it seems? Comment.js :

import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import moment from 'moment';
import Markdown from 'react-markdown';

const Comment =(props)=> {
  function upvote() {
    if (props.user._id) {
      fetch(`/api/comment/${props.comment._id}/upvote`, {
        method: 'PUT',
        headers: {
          Authorization: 'Bearer ' + props.token,
          'Content-Type': 'application/json'
        },
        body: JSON.stringify(props.user)
      })
        .then((res) => res.json())
        .then((res) => {
          if (res.success) {
            // Upvoted successfully!
            props.updateComment(res.comment);
          } else {
            console.log(res.message);
          }
        })
        .catch((err) => {
          // props.history.push('/?message=failed');
          console.log(err);
        });
    } else {
      console.log('You are not logged in!');
    }
  };
  
 
    let {
      comment,
      author,
      username,
      created,
      _id,
      upvotedby,
      downvotedby,
      score
    } = props.comment;
    let { user } = props;

    return (
      <div className="single-comment" id={`comment-id-${_id}`}>
        <div className="votes">
          <div
            className={`arrow up ${
              user && upvotedby.includes(user._id) ? 'upvoted' : ''
            }`}
            onClick={upvote}
          />
          <div
            className={`arrow down ${
              user && downvotedby.includes(user._id) ? 'downvoted' : ''
            }`}
            onClick={downvote}
          />
        </div>
        <div className="comment">
          <div className="comment-author">
            <small>
              <Link to={`/user/${username}`}>{username}</Link> {score} points,
              posted {moment(created).fromNow()}{' '}
              {author === props.user._id || props.user.isAdmin ? (
                <span className="fake-link" onClick={this.deleteComment}>
                  Delete
                </span>
              ) : (
                ''
              )}
            </small>
          </div>
          <div className="comment-body">
            <Markdown linkTarget="_blank" source={comment} />
          </div>
          <div className="comment-meta" />
        </div>
      </div>
    );
  
}
export default Comment

Im getting the following error when running my application:

Uncaught TypeError: Cannot read properties of undefined (reading 'object')
    at Object../node_modules/react-layout/lib/mixin.js (mixin.js:12:1)
    at Object.options.factory (react refresh:6:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at Object../node_modules/react-layout/lib/layout.js (layout.js:8:1)
    at Object.options.factory (react refresh:6:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at Module../src/Pages/Community.js (Comment.js:143:1)
    at Module.options.factory (react refresh:6:1)

does anyone have any clue about it?