import React, { Component } from "react";
import fire from '../../fire.js';

class pencocokanKornea extends Component {
  constructor(){
   super();
   this.state = {
    patient : [],
      address : [],
      operation : [],
      phone : [],
      table : ''
   };
  }
componentDidMount(){
   const rootRef = fire.database().ref();
   const pasienRef = rootRef.child('pasien');
    pasienRef.once('value', snap => {
    snap.forEach( row => {
          this.setState({
            patient: this.state.patient.concat([row.val().name]),
            address: this.state.address.concat([row.val().address]),
            operation: this.state.operation.concat([row.val().operationType]),
            phone: this.state.phone.concat([row.val().phone])
          });
    });
      const tableList = this.state.patient.map((name, index) =>
        <tr>
          <td>{name}</td>
          <td>{this.state.address[index]}</td>
          <td>{this.state.operation[index]}</td>
          <td>{this.state.phone [index]}</td>
        </tr>
      );
      this.setState({
        table : tableList
      })
    });
  };
render() {
    return (
      <table>
        <thead>
          <tr>
            <th>patient name</th>
            <th>address</th>
            <th>operation type</th>
            <th>phone</th>
          </tr>
        </thead>
        <tbody>{this.state.table}</tbody>
      </table>
    );
  }
}

export default pencocokanKornea;