search filtering not working w/ complex data on different columns

[ShaikhahMaasher]

I have an issue with filtering complex data,

The data I got as the following:

"customers": [
        {
          "name": "customer name",
          "email": "cname@email.com",
          "address": [
            {
              "country": "cCountry1",
              "city": "cCity1"
            }
          ]
        }
]

<BootstrapTable data={data.businessAccount.customers} selectRow={ selectRowProp } options= { options } hover  pagination search >
   <TableHeaderColumn isKey dataField='id' hidden>ID</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='name'>Name</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='email'>Email</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='phone' dataAlign="center">Phone</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='address' dataFormat={this.showCountry} filterValue={this.filterCountry} dataAlign="center">Country</TableHeaderColumn>                                               
   <TableHeaderColumn width={this.state.cellSize} dataField='address' dataFormat={this.showCity} filterValue={this.filterCity} dataAlign="center">City</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='status' dataFormat={this.formatStatus} dataAlign="center">Status</TableHeaderColumn>
</BootstrapTable>

showCountry(cell) {
   if (cell.length > 0) {
       return cell[0].country
   }
   return null
}

filterCountry(cell) {
   if ( cell.length > 0 ) {
       return cell[0].country
   }
   return null
}

I tried also filterFormatted, the issue that both are only working with the last call, which is in this case address.city. I don't know why they are filtering only once, is there any explanation on how to fix this or another way to filter complex data?