DatatableReact

import { useEffect, useState } from "react";
import DataTable from "datatables.net-react";
import DT from "datatables.net-bs5";

DataTable.use(DT);

export default function Table() {
    const [users, setUsers] = useState(null);

    const columns = [
        { data: "name" },
        { data: "email" },
        { data: "created_at" },
        {
            data: null,
            render: function (data, type, row) {
                return `<button class="btn btn-sm btn-primary rounded-pill py-0")">View</button>`;
            },
        },
    ];

    const getAllUser = async () => {
        const res = await axios.get("/api/all-user");
        const users = res.data.users;

        console.log(users);

        setUsers(users);
    };

    useEffect(() => {
        getAllUser();
    }, []);

    return (
        users && (
            <DataTable
                data={users}
                columns={columns}
                className="display table"
                options={{ pageLength: 25 }}
            >
                <thead className="table-primary">
                    <tr>
                        <th>Name</th>
                        <th>Email</th>
                        <th>Created</th>
                        <th>Action</th>
                    </tr>
                </thead>
            </DataTable>
        )
    );
}