```
const patientDetails = [
 {patientName: "A", dateReg: "2019-11-12", room: "room1", user: "k" },
 {patientName: "B", dateReg: "2019-11-12", room: "room8", user: "k" },
 {patientName: "C", dateReg: "2019-11-12", room: "room2", user: "k" },
 {patientName: "D", dateReg: "2019-11-12", room: "room5", user: "k" },
 {patientName: "E", dateReg: "2019-11-12", room: "room6", user: "k" },
 {patientName: "F", dateReg: "2019-11-11", room: "room10", user: "k" },
 {patientName: "G", dateReg: "2019-11-11", room: "room18", user: "k" }
]

```

I've got an array which has patient details. What I want to do is, if the dateReg of the patient in the is the same then I would like to basically group them. 
In the UI, I would like to render a row with the date first(2019-11-12) then the next rows would be filled with the paitent details that have the same date(2019-11-12) until there is another patient with a different date (2019-11-11). If there is a different date and I would want to add a new row with the new date (2019-11-11) then render the patient details that have those date (2019-11-11) until a different date and so on...

I can't get it work and not entirely sure if I'm in the right direction. 

i've tried 

```
const dateCheck = patientDetails[0].dateReg; 

date.map(patient => {
  if(patient.dateReg === dateCheck){
    return (

        <tr>
          <td>{patient.dateReg}</td>
        </tr>
        <tr>
          <td>{paitent.patientName} </td>
          <td>{patient.room}</td>
          <td>{patient.user}</td>
        <tr>

    )
  }else {
    return(
     <tr>
          <td>{patient.dateReg}</td>
        </tr>
        <tr>
          <td>{paitent.patientName} </td>
          <td>{patient.room}</td>
          <td>{patient.user}</td>
        <tr>
    )
  }
})

```