hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Use mobx observable property instead of react-native component state

Browse Source 
Signed-off-by: Alex Culliere <alozhkin@mirantis.com>
This commit is contained in:
Alex Culliere 2021-02-15 13:48:07 +02:00
parent 2b3d2ed061
commit 9e33399949
1 changed files with 9 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/renderer/components/item-object-list/item-list-layout.tsx
View File

@ -2,7 +2,7 @@ import "./item-list-layout.scss";
import groupBy from "lodash/groupBy";
import React, { ReactNode } from "react";
import { computed } from "mobx";
import { computed, observable } from "mobx";
import { disposeOnUnmount, observer } from "mobx-react";
import { ConfirmDialog, ConfirmDialogParams } from "../confirm-dialog";
import { Table, TableCell, TableCellProps, TableHead, TableProps, TableRow, TableRowProps, TableSortCallback } from "../table";
@ -80,10 +80,6 @@ export interface ItemListLayoutProps<T extends ItemObject = ItemObject> {
renderFooter?: (parent: ItemListLayout) => React.ReactNode;
}
interface ItemListLayoutState {
cellSizes: number[];
}
const defaultProps: Partial<ItemListLayoutProps> = {
showHeader: true,
isSearchable: true,
@ -100,7 +96,7 @@ const defaultProps: Partial<ItemListLayoutProps> = {
};
@observer
export class ItemListLayout extends React.Component<ItemListLayoutProps, ItemListLayoutState> {
export class ItemListLayout extends React.Component<ItemListLayoutProps> {
static defaultProps = defaultProps as object;
private storage = createStorage("item_list_layout", {
@ -115,12 +111,13 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps, ItemLis
this.storage.merge({ showFilters });
}
@observable cellSizes: number[];
constructor(props: ItemListLayoutProps) {
super(props);
this.state = {
cellSizes: new Array<number>(props.renderTableHeader.length)
};
// create a registry to remember column sizes
this.cellSizes = new Array<number>(props.renderTableHeader.length);
}
async componentDidMount() {
@ -222,10 +219,7 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps, ItemLis
}
handleCellResize(index: number, width: number) {
const cellSizes = [...this.state.cellSizes];
cellSizes[index] = width;
this.setState({ cellSizes });
this.cellSizes[index] = width;
}
@autobind()
@ -262,7 +256,7 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps, ItemLis
renderTableContents(item).map((content, index) => {
const cellProps: TableCellProps = isReactNode(content) ? { children: content } : content;
const headCell = renderTableHeader?.[index];
const cellSize = this.state.cellSizes[index];
const cellSize = this.cellSizes[index];
if (copyClassNameFromHeadCells && headCell) {
cellProps.className = cssNames(cellProps.className, headCell.className);
@ -428,7 +422,7 @@ export class ItemListLayout extends React.Component<ItemListLayoutProps, ItemLis
/>
)}
{renderTableHeader.map((cellProps, index) => {
const cellSize = this.state.cellSizes[index];
const cellSize = this.cellSizes[index];
const _cellProps = resizable ?
{ ...cellProps, _onResize: (width: number) => this.handleCellResize(index, width), resizable } :
cellProps;