[PUI] Remember state of table sorting (#7702)

- Remember table ordering information

src/frontend/src/states/LocalState.tsx

@@ -1,3 +1,4 @@
+import { DataTableSortStatus } from 'mantine-datatable';
 import { create } from 'zustand';
 import { persist } from 'zustand/middleware';
 
@@ -28,6 +29,9 @@ interface LocalStateProps {
   setTableColumnNames: (
     tableKey: string
   ) => (names: Record<string, string>) => void;
+  tableSorting: Record<string, any>;
+  getTableSorting: (tableKey: string) => DataTableSortStatus;
+  setTableSorting: (tableKey: string) => (sorting: DataTableSortStatus) => void;
   clearTableColumnNames: () => void;
   detailDrawerStack: number;
   addDetailDrawer: (value: number | false) => void;
@@ -87,6 +91,19 @@ export const useLocalState = create<LocalStateProps>()(
       clearTableColumnNames: () => {
         set({ tableColumnNames: {} });
       },
+      tableSorting: {},
+      getTableSorting: (tableKey) => {
+        return get().tableSorting[tableKey] || {};
+      },
+      setTableSorting: (tableKey) => (sorting) => {
+        // Update the table sorting for the given table
+        set({
+          tableSorting: {
+            ...get().tableSorting,
+            [tableKey]: sorting
+          }
+        });
+      },
       // detail drawers
       detailDrawerStack: 0,
       addDetailDrawer: (value) => {

src/frontend/src/tables/InvenTreeTable.tsx

@@ -10,8 +10,6 @@ import {
   Stack,
   Tooltip
 } from '@mantine/core';
-import { modals } from '@mantine/modals';
-import { showNotification } from '@mantine/notifications';
 import {
   IconBarcode,
   IconFilter,
@@ -157,7 +155,12 @@ export function InvenTreeTable<T = any>({
   columns: TableColumn<T>[];
   props: InvenTreeTableProps<T>;
 }) {
-  const { getTableColumnNames, setTableColumnNames } = useLocalState();
+  const {
+    getTableColumnNames,
+    setTableColumnNames,
+    getTableSorting,
+    setTableSorting
+  } = useLocalState();
   const [fieldNames, setFieldNames] = useState<Record<string, string>>({});
 
   const navigate = useNavigate();
@@ -390,6 +393,15 @@ export function InvenTreeTable<T = any>({
     direction: 'asc'
   });
 
+  useEffect(() => {
+    const tableKey: string = tableState.tableKey.split('-')[0];
+    const sorting: DataTableSortStatus = getTableSorting(tableKey);
+
+    if (sorting) {
+      setSortStatus(sorting);
+    }
+  }, []);
+
   // Return the ordering parameter
   function getOrderingTerm() {
     let key = sortStatus.columnAccessor;
@@ -413,6 +425,9 @@ export function InvenTreeTable<T = any>({
   const handleSortStatusChange = (status: DataTableSortStatus) => {
     tableState.setPage(1);
     setSortStatus(status);
+
+    const tableKey = tableState.tableKey.split('-')[0];
+    setTableSorting(tableKey)(status);
   };
 
   // Function to perform API query to fetch required data