95 lines
2.2 KiB
TypeScript
95 lines
2.2 KiB
TypeScript
import React, {useState} from "react";
|
|
import {createSmartable} from "../src/Smartable/Smartable";
|
|
import {createColumn, createColumns} from "../src/Smartable/Column";
|
|
import {StringFilter} from "../src/Smartable/Filters/StringFilter";
|
|
import { Cell } from "../src/Smartable/Cell";
|
|
|
|
|
|
// Create main table.
|
|
const Smartable = createSmartable({
|
|
columns: createColumns(
|
|
createColumn("name", {
|
|
title: "Name",
|
|
filter: StringFilter,
|
|
}),
|
|
createColumn("actions", {
|
|
title: "Actions",
|
|
}),
|
|
),
|
|
});
|
|
|
|
export function RemoveDemoTable()
|
|
{
|
|
const [rows, setRows] = useState<string[]>([
|
|
"Formica rufa",
|
|
"Lasius niger",
|
|
"Camponotus pennsylvanicus",
|
|
"Solenopsis invicta",
|
|
"Atta cephalotes",
|
|
"Pogonomyrmex barbatus",
|
|
"Myrmica rubra",
|
|
"Dorymyrmex insanus",
|
|
"Pheidole megacephala",
|
|
"Crematogaster scutellaris",
|
|
"Tetramorium caespitum",
|
|
"Tapinoma sessile",
|
|
"Linepithema humile",
|
|
"Monomorium pharaonis",
|
|
"Odontomachus bauri",
|
|
"Paraponera clavata",
|
|
"Oecophylla smaragdina",
|
|
"Pseudomyrmex gracilis",
|
|
"Eciton burchellii",
|
|
"Anoplolepis gracilipes",
|
|
"Acromyrmex octospinosus",
|
|
"Acanthomyops claviger",
|
|
"Dorylus nigricans",
|
|
"Neivamyrmex nigrescens",
|
|
"Hypoponera punctatissima",
|
|
"Solenopsis geminata",
|
|
"Camponotus chromaiodes",
|
|
"Brachymyrmex depilis",
|
|
"Ectatomma ruidum",
|
|
"Proceratium silaceum",
|
|
"Cephalotes atratus",
|
|
"Neoponera villosa",
|
|
"Dinoponera gigantea",
|
|
"Prenolepis imparis",
|
|
"Lasius flavus",
|
|
"Formica fusca",
|
|
"Myrmecia gulosa",
|
|
"Solenopsis molesta",
|
|
"Camponotus herculeanus",
|
|
"Cataulacus granulatus",
|
|
"Daceton armigerum",
|
|
"Polyrhachis dives",
|
|
"Pheidole dentata",
|
|
"Tetramorium immigrans",
|
|
"Messor barbarus",
|
|
"Cardiocondyla obscurior",
|
|
"Nylanderia flavipes",
|
|
"Forelius pruinosus",
|
|
"Amblyopone pallipes",
|
|
]);
|
|
|
|
return (
|
|
<Smartable.Table data={rows.map((row, rowIndex) => ({
|
|
cells: {
|
|
name: {
|
|
data: row,
|
|
},
|
|
actions: {
|
|
data: null,
|
|
element: (
|
|
<Cell>
|
|
<button className={"remove"}
|
|
onClick={() => setRows(rows.toSpliced(rowIndex, 1))}>
|
|
Remove
|
|
</button>
|
|
</Cell>
|
|
)
|
|
},
|
|
},
|
|
}))} disableFilter={true} disableSort={true} />
|
|
);
|
|
}
|