diff --git a/Plan/react/dashboard/src/components/extensions/ExtensionTable.js b/Plan/react/dashboard/src/components/extensions/ExtensionTable.js index a0e01ec9c..a96a8a240 100644 --- a/Plan/react/dashboard/src/components/extensions/ExtensionTable.js +++ b/Plan/react/dashboard/src/components/extensions/ExtensionTable.js @@ -1,8 +1,10 @@ -import React, {useState} from 'react'; +import React, {useCallback, useState} from 'react'; import {useTheme} from "../../hooks/themeHook"; import {useTranslation} from "react-i18next"; import ExtensionIcon, {toExtensionIconHtmlString} from "./ExtensionIcon"; import DataTablesTable from "../table/DataTablesTable"; +import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"; +import {faSort, faSortDown, faSortUp} from "@fortawesome/free-solid-svg-icons"; const ExtensionDataTable = ({table}) => { const [id] = useState("extension-table-" + new Date().getTime() + "-" + (Math.floor(Math.random() * 100000))); @@ -39,22 +41,65 @@ const ExtensionDataTable = ({table}) => { ) } +const sortComparator = (columnIndex) => (rowA, rowB) => { + const a = rowA[columnIndex].valueUnformatted; + const b = rowB[columnIndex].valueUnformatted; + if (a === b) return 0; + if (isNaN(Number(a)) || isNaN(Number(b))) { + return String(a).toLowerCase().localeCompare(String(b).toLowerCase()); + } else { + const numA = Number(a); + const numB = Number(b); + if (numA < numB) return -1; + if (numA > numB) return 1; + return 0; + } +} + +const sortRows = (rows, sortIndex, sortReversed) => { + if (sortIndex === undefined) return rows; + + const comparator = sortComparator(sortIndex); + const sorted = rows.sort(comparator); + if (sortReversed) return rows.reverse(); + return sorted; +} + const ExtensionColoredTable = ({table}) => { const {nightModeEnabled} = useTheme(); const {t} = useTranslation(); - const rows = table.table.rows.length ? table.table.rows.map((row, i) =>
changeSort(i)}>
+ | )}
|
---|