diff --git a/src/renderer/components/+cluster/cluster-issues.tsx b/src/renderer/components/+cluster/cluster-issues.tsx index 0aabebaa27..913c78167c 100644 --- a/src/renderer/components/+cluster/cluster-issues.tsx +++ b/src/renderer/components/+cluster/cluster-issues.tsx @@ -134,6 +134,7 @@ export class ClusterIssues extends React.Component { <>Warnings: {warnings.length} {
{
{showTitle && }
{ export function PodTolerations({ tolerations }: Props) { return (
{ renderList() { const { store, hasDetailsView, addRemoveButtons = {}, virtual, sortingCallbacks, detailsItem, - tableProps = {}, + tableProps = {}, tableId } = this.props; const { isReady, removeItemsDialog, items } = this; const { selectedItems } = store; @@ -426,6 +426,7 @@ export class ItemListLayout extends React.Component { )} {isReady && (
; + } +} + +export const tableStorage = createStorage("table_settings", { + sortParams: {} +}); + +export function getSortParams(tableId: string): Partial { + return tableStorage.get().sortParams[tableId]; +} + +export function setSortParams(tableId: string, sortParams: Partial) { + tableStorage.merge(draft => { + draft.sortParams[tableId] = sortParams; + }); +} diff --git a/src/renderer/components/table/table.tsx b/src/renderer/components/table/table.tsx index 19bd5b03e5..e15bfabad2 100644 --- a/src/renderer/components/table/table.tsx +++ b/src/renderer/components/table/table.tsx @@ -3,7 +3,6 @@ import "./table.scss"; import React from "react"; import { orderBy } from "lodash"; import { observer } from "mobx-react"; -import { observable } from "mobx"; import { autobind, cssNames, noop } from "../../utils"; import { TableRow, TableRowElem, TableRowProps } from "./table-row"; import { TableHead, TableHeadElem, TableHeadProps } from "./table-head"; @@ -11,6 +10,8 @@ import { TableCellElem } from "./table-cell"; import { VirtualList } from "../virtual-list"; import { createPageParam } from "../../navigation"; import { ItemObject } from "../../item.store"; +import { getSortParams, setSortParams } from "./table.storage"; +import { computed } from "mobx"; export type TableSortBy = string; export type TableOrderBy = "asc" | "desc" | string; @@ -19,6 +20,7 @@ export type TableSortCallback = (data: D) => string | number | (string export type TableSortCallbacks = { [columnId: string]: TableSortCallback }; export interface TableProps extends React.DOMAttributes { + tableId?: string; items?: ItemObject[]; // Raw items data className?: string; autoSize?: boolean; // Setup auto-sizing for all columns (flex: 1 0) @@ -62,13 +64,17 @@ export class Table extends React.Component { sortSyncWithUrl: true, }; - @observable sortParams: Partial = Object.assign( - this.props.sortSyncWithUrl ? { - sortBy: sortByUrlParam.get(), - orderBy: orderByUrlParam.get(), - } : {}, - this.props.sortByDefault, - ); + componentDidMount() { + const { sortable, tableId } = this.props; + + if (sortable && !tableId) { + console.error("[Table]: sorted table requires props.tableId to be specified"); + } + } + + @computed get sortParams() { + return Object.assign({}, this.props.sortByDefault, getSortParams(this.props.tableId)); + } renderHead() { const { sortable, children } = this.props; @@ -113,7 +119,7 @@ export class Table extends React.Component { @autobind() protected onSort({ sortBy, orderBy }: TableSortParams) { - this.sortParams = { sortBy, orderBy }; + setSortParams(this.props.tableId, { sortBy, orderBy }); const { sortSyncWithUrl, onSort } = this.props; if (sortSyncWithUrl) {