You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

76 lines
2.1 KiB

import Link from 'next/link';
import { useEffect, useState } from 'react';
import { useFetchWithAuth } from '../../hooks/useFetchWithAuth';
interface Props {
endpoint: string
columns:string []
}
const TableBody = ({ columns,endpoint }:Props) => {
let defaultData:[] = [];
const [entities, setEntities] = useState(defaultData);
const getInitData = async () => {
const { data, error } = await useFetchWithAuth(endpoint);
if (!error) {
setEntities(data);
} else {
console.log(error)
}
}
useEffect(() => {
getInitData();
}, [endpoint])
return (
<tbody>
{
entities.map((entity) => {
return (
<tr key={entity['id']}>
<td>
<Link
href={{
pathname: endpoint+'/form',
query: { id: entity['id'] },
}}
>
<svg className="w-4 h-4" xmlns="http://www.w3.org/2000/svg" id="Outline" viewBox="0 0 24 24">
<path
d="M18.656.93,6.464,13.122A4.966,4.966,0,0,0,5,16.657V18a1,1,0,0,0,1,1H7.343a4.966,4.966,0,0,0,3.535-1.464L23.07,5.344a3.125,3.125,0,0,0,0-4.414A3.194,3.194,0,0,0,18.656.93Zm3,3L9.464,16.122A3.02,3.02,0,0,1,7.343,17H7v-.343a3.02,3.02,0,0,1,.878-2.121L20.07,2.344a1.148,1.148,0,0,1,1.586,0A1.123,1.123,0,0,1,21.656,3.93Z" />
<path
d="M23,8.979a1,1,0,0,0-1,1V15H18a3,3,0,0,0-3,3v4H5a3,3,0,0,1-3-3V5A3,3,0,0,1,5,2h9.042a1,1,0,0,0,0-2H5A5.006,5.006,0,0,0,0,5V19a5.006,5.006,0,0,0,5,5H16.343a4.968,4.968,0,0,0,3.536-1.464l2.656-2.658A4.968,4.968,0,0,0,24,16.343V9.979A1,1,0,0,0,23,8.979ZM18.465,21.122a2.975,2.975,0,0,1-1.465.8V18a1,1,0,0,1,1-1h3.925a3.016,3.016,0,0,1-.8,1.464Z" />
</svg>
</Link>
</td>
{columns.map(
(col => (
<td key={col}>
<span>{entity[col]}</span>
</td>
))
)}
</tr>
)
})
}
</tbody>
);
};
export default TableBody;