react-light-table-bootstrap

This is a tiny package for data table with server pagination

📦 Installation

npm i react-light-table-bootstrap

Author

Debasis Bhakat

Declaration

Require react-light-table-bootstrap in the top of your file :

import Table from 'react-light-table-bootstrap';

Usage

const TableCol=[
{   
    name:"Video Title",
    id:'title',
    
}, 
{   
    name:"Image",
    id:'thumbnail',
    renderCell: (params) => {
    return (
        <img src={params} height={100} width={100} alt="Card"/>
    );
    }
},
{   
    name:"Date",
    id:'created_at'
},
{   
    name:"Action",
    buttons:[
        {
            name:"Edit",
            mapTo:'id'
        }
    ],
    type:'action',
    renderCell: (params,item) => { 
        return params.map(p=>{
                return (
                    <Link to={`video/edit/${item[p.mapTo]}`}><button>{p.name}</button></Link>
                )
           }) 
    }
}
]; 
const data=[
    {
        title:"demo",
        thumbnail:"image_url"
    }
]
 const pageHandler = async(page) =>{ 
    const controller = new AbortController();
    const { signal } = controller;
    const res = await apicall('your-url','Get', { signal });
    if(res.status===200){
      setData(res.data);
      setCurrentPage(page)
    }
}
<Table column={TableCol} data={data} pageHandler={pageHandler} currentPage={currentPage} pageSize={pageSize} totalResults={totalResults} />