Hello MDBootstrap Team,

You already have created an issue like this one. Link: https://mdbootstrap.com/support/react/mdbdatatable-search-not-returning-results-if-rendered-by-another-component/

But I wasn't successful to use those recommendations to make it work.

I use mdbreact v4.25.0.

Expected behavior Search in Datable should work through the component

Actual behavior No results when I'm trying to search through the component but it works for fields with 'string' columns.

Resources (screenshots, code snippets etc.)

Data initialization

const data = {
  columns: [
    {
      label: "Date",
      field: "date",
      width: 150
    },
    {
      label: "Player",
      field: "player",
      width: 100
    },
    {
      label: "Previous Status",
      field: "prev_status",
      width: 150
    },
    {
      label: "New Status",
      field: "new_status",
      width: 100
    }
  ],
  rows: transfers.map(transfer => ({
    date: transfer.date,
    player: <PlayerTable searchValue={transfer.player.nickname} img={transfer.player.photo} country={transfer.player.country}/>,
    prev_status: <TeamTable teamLogo={transfer.current_status.teamLogo} team={transfer.current_status.teamName}/>,
    new_status: <TeamTable teamLogo={transfer.new_status.teamLogo} team={transfer.new_status.teamName}/>,
    clickEvent: () => this.rowClick(transfer.id)
  }))
};

PlayerTable Component:

return (
  <React.Fragment>
      <div className="table-player">
        <div className="table-player__image">
          <img src={this.props.img} alt="" />
        </div>
        <h2><a href="">{this.props.searchValue}</a></h2>
        {isCountry ? <i className="flag" style={{ backgroundImage: `url(${this.props.country})` }} ></i> : ''}
      </div>
  </React.Fragment>
);

Datatable initialization:

<MDBDataTable 
        paginationLabel={[
          <MDBIcon className="prev" />,
          <MDBIcon className="next" />
        ]}
        sortable={false} 
        responsive 
        data={data} 
        displayEntries={false}
        entries={3} 
        noBottomColumns
        searchLabel="Type nickname or team name"
        sortRows={["player"]}
        noRecordsFoundLabel="No results"
        infoLabel={["Showing", "to", "of", "entries"]}
        className="main-table transfers"
        sortRows={['player']} 
        />

Init view: https://share.getcloudapp.com/mXuyOqZL

Trying to search using info from the first row of Player column: https://share.getcloudapp.com/v1u28r6Z