Spaces:
Runtime error
Runtime error
File size: 1,738 Bytes
56b6519 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 |
import { useState } from 'react';
import { Column } from '../components/table/UITable';
/**
* Hook creado para manejar de manera simple el sorting de la tabla.
*
* Se deben ingresar los datos de la tabla y las columnas, definidas previamente.
*
* Se debe utilizar el tipo T definido en el componente que llama al hook, que defina
* las columnas de los datos. **EJEMPLO**:
*
* ```
* type TableData = {
id: number;
name: string;
age: number;
country: string;
profile: string;
};
*
* ```
*
* Luego, se llama al hook:
*
* `const [sortedData,setTableData] = useSortableTable<TableData>(data, columns);`
*
* @param data Datos de la tabla.
* @param columns Columnas de la tabla. Utiliza el type `Column`.
* @returns Hook para mostrar los datos de la tabla y func. `setTableData` para UITable.
*/
export const useSortableTable = <T,>(data: T[], columns: Column[]) => {
const [tableData, setTableData] = useState(data);
const accesors = columns.map(col => col.accessor);
const handleSorting = (column: string, direction: 'asc' | 'desc') => {
if (column && accesors.includes(column)) {
const sorted = [...tableData].sort((a, b) => {
const aValue = a[column as keyof T];
const bValue = b[column as keyof T];
const aString =
aValue !== null && aValue !== undefined ? String(aValue) : '';
const bString =
bValue !== null && bValue !== undefined ? String(bValue) : '';
return (
aString.localeCompare(bString, 'en', {
numeric: true,
}) * (direction === 'asc' ? 1 : -1)
);
});
setTableData(sorted);
}
};
return [tableData, handleSorting, setTableData] as const;
};
|