import { useState, useEffect } from 'react'
import { Table } from 'antd'
import LoaderPortal from '../../components/LoaderPortal'
import { invokeWebApiWrapperAsync } from '../../components/factory'
import { MeasureService } from '../../services/api'

export const MeasureTable = ({idWell, idCategory, title, columns}) => {
  const [showLoader, setShowLoader] = useState(false)
  const [lastData, setLastData] = useState([])

  useEffect(()=>invokeWebApiWrapperAsync(async()=>{
    const data = await MeasureService.getLast(idWell, idCategory)
    setLastData(data)
  }
  , setShowLoader
  , "не удалось загрузить")
  , [idWell, idCategory])

  return <LoaderPortal show={showLoader}>
    <h3>{title}</h3>
    <span>дата: {lastData?.timestamp}</span>
    <Table
      dataSource = {[lastData?.data]}
      columns = {columns}
    />
  </LoaderPortal>
}