NIAEFEUP / nitsig

A browser extension to improve the Sigarra user experience
MIT License
14 stars 2 forks source link

Table component #179

Closed toni-santos closed 3 weeks ago

toni-santos commented 1 month ago

Closes #177 Implements a generic extensible table component.

toni-santos commented 1 month ago

It's still missing the CSS but (hopefully most of) the logic should be already done.

I'm using the following code as a test, in a test.tsx file. Don't forget to add the function to index.js.

import { Table } from "./modules/components/table";
import jsx from 'texsaur';

const tsxtest = () => {
    return (
        <div>
            <p>Hello World</p>
            <button onclick={() => console.log("testadsfasdf")}>test</button>
        </div>
    )
}

const tsxtest2 = (thing: string) => {
    return (
        <div>
            <p>{thing}</p>
        </div>
    )
}

const headers:[string, (string | Element)][] = [["Name", "Name"], ["test", tsxtest()], ["idade", "Age"]];

const data = [
    ["d", tsxtest2("wow"), "30"],
    ["b", tsxtest2("wow1"), "25"],
    ["a", tsxtest2("wow2"), "40"],
    ["c", tsxtest2("wow3"), "35"]
];

const content = <Table tableName="test" headers={headers} data={data} />

export const test = () => {
    console.log("test");
    document.body.appendChild(content);

    return null;
}