Expected behavior When I go to search for a company, the table filters just fine for every element BUT the first element.

Actual behavior when I go to search for the first element, the table reorders in a funky way but does not filter.

Resources (screenshots, code snippets etc.)

const data = {
    columns: [{
        "label": "Name",
        "field": "name"
    },
    {
        "label": "Sector",
        "field": "sector"
    },
    {
        "label": "Role",
        "field": "role"
    },
    {
        "label": "Visit",
        "field": "action",
        "sort": false
    }],
  rows: [
    {
      name: "FastServe HVAC",
      sector: "Business Services",
      role: "Admin"
    },
    {
      name: "FastServe HVAC",
      sector: "Business Services",
      role: "Admin"
    },
    {
      name: "Hong Business Solutions",
      sector: "Business Services",
      role: "Collaborator"
    },
    {
      name: "Kearn Manufacturing",
      sector: "Industrials",
      role: "User"
    },
  ]
}


const StyledContainer = styled.div`
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  > * > .form-outline {
      align-self: flex-start;
      width: 50%;
  }
`

const TableDiv = styled.div`
  width: fit-content;
  padding: 20px;

`

const StyledButton = styled(MDBBtn)`
  padding: 3px!important;
  margin: 3px!important;
`

const StyledTable = styled(MDBDatatable)`
  align: center;
  width: fit-content;

  min-width: 800px;
  max-width: 1200px;

  & .datatable-inner {
    max-height: 460px;
  }

  & td {
    margin-bottom: 0!important;
    padding-bottom: 6px! important;
  }
`

export default function CompaniesTable({ ... }) {
  function addActionButtons(rows) {
    return rows.map((row) => {
      return {
        ...row,
        action: (
          <Link to={`/companies/${strToUrl(row.name)}`} >
            <StyledButton outline size='sm' floating className='arrow-btn' onClick={() => setLastCompany(row.name)}>
              <MDBIcon icon='arrow-right' />
            </StyledButton>
          </Link>
        ),
      }
    })
  }

  return (
    <StyledContainer>
      <TableDiv>
        <StyledTable
          hover
          search
          striped
          fixedHeader

          data={data}
          entriesOptions={[5, 10, 20]}
          entries={10}
        />
      </TableDiv>
    </StyledContainer>
  )
}