117 lines
2.3 KiB
TypeScript
117 lines
2.3 KiB
TypeScript
import * as React from 'react';
|
|
import { Types } from '../../common';
|
|
import { Node } from '../../state';
|
|
import { PersistentSet } from '../../persist';
|
|
import {
|
|
Column,
|
|
NameColumn,
|
|
LocationColumn,
|
|
NetworkIdColumn,
|
|
PeersColumn,
|
|
TxsColumn,
|
|
UploadColumn,
|
|
DownloadColumn,
|
|
StateCacheColumn,
|
|
BlockNumberColumn,
|
|
BlockHashColumn,
|
|
FinalizedBlockColumn,
|
|
FinalizedHashColumn,
|
|
BlockTimeColumn,
|
|
BlockPropagationColumn,
|
|
LastBlockColumn,
|
|
UptimeColumn,
|
|
CpuArchitectureColumn,
|
|
CpuColumn,
|
|
CpuCoresColumn,
|
|
MemoryColumn,
|
|
OperatingSystemColumn,
|
|
VersionColumn,
|
|
IsVirtualMachineColumn,
|
|
LinuxDistroColumn,
|
|
LinuxKernelColumn,
|
|
} from './';
|
|
|
|
import './Row.css';
|
|
|
|
interface RowProps {
|
|
node: Node;
|
|
pins: PersistentSet<Types.NodeName>;
|
|
columns: Column[];
|
|
}
|
|
|
|
interface RowState {
|
|
update: number;
|
|
}
|
|
|
|
export class Row extends React.Component<RowProps, RowState> {
|
|
public static readonly columns: Column[] = [
|
|
NameColumn,
|
|
LocationColumn,
|
|
NetworkIdColumn,
|
|
PeersColumn,
|
|
TxsColumn,
|
|
UploadColumn,
|
|
DownloadColumn,
|
|
StateCacheColumn,
|
|
BlockNumberColumn,
|
|
BlockHashColumn,
|
|
FinalizedBlockColumn,
|
|
FinalizedHashColumn,
|
|
BlockTimeColumn,
|
|
BlockPropagationColumn,
|
|
LastBlockColumn,
|
|
UptimeColumn,
|
|
VersionColumn,
|
|
OperatingSystemColumn,
|
|
CpuArchitectureColumn,
|
|
CpuColumn,
|
|
CpuCoresColumn,
|
|
MemoryColumn,
|
|
LinuxDistroColumn,
|
|
LinuxKernelColumn,
|
|
IsVirtualMachineColumn,
|
|
];
|
|
private renderedChangeRef = 0;
|
|
|
|
public shouldComponentUpdate(nextProps: RowProps): boolean {
|
|
return (
|
|
this.props.node.id !== nextProps.node.id ||
|
|
this.renderedChangeRef !== nextProps.node.changeRef
|
|
);
|
|
}
|
|
|
|
public render() {
|
|
const { node, columns } = this.props;
|
|
|
|
this.renderedChangeRef = node.changeRef;
|
|
|
|
let className = 'Row';
|
|
|
|
if (node.pinned) {
|
|
className += ' Row-pinned';
|
|
}
|
|
|
|
if (node.stale) {
|
|
className += ' Row-stale';
|
|
}
|
|
|
|
return (
|
|
<tr className={className} onClick={this.toggle}>
|
|
{columns.map((col, index) =>
|
|
React.createElement(col, { node, key: index })
|
|
)}
|
|
</tr>
|
|
);
|
|
}
|
|
|
|
public toggle = () => {
|
|
const { pins, node } = this.props;
|
|
|
|
if (node.pinned) {
|
|
pins.delete(node.name);
|
|
} else {
|
|
pins.add(node.name);
|
|
}
|
|
};
|
|
}
|