github.com/cockroachdb/cockroach@v20.2.0-alpha.1+incompatible/pkg/ui/src/views/cluster/containers/nodeGraphs/dashboards/hardware.tsx (about) 1 // Copyright 2018 The Cockroach Authors. 2 // 3 // Use of this software is governed by the Business Source License 4 // included in the file licenses/BSL.txt. 5 // 6 // As of the Change Date specified in that file, in accordance with 7 // the Business Source License, use of this software will be governed 8 // by the Apache License, Version 2.0, included in the file 9 // licenses/APL.txt. 10 11 import React from "react"; 12 13 import { LineGraph } from "src/views/cluster/components/linegraph"; 14 import { Metric, Axis, AxisUnits } from "src/views/shared/components/metricQuery"; 15 16 import { GraphDashboardProps, nodeDisplayName, storeIDsForNode } from "./dashboardUtils"; 17 18 // TODO(vilterp): tooltips 19 20 export default function (props: GraphDashboardProps) { 21 const { nodeIDs, nodesSummary, nodeSources, storeSources, tooltipSelection } = props; 22 23 return [ 24 <LineGraph 25 title="CPU Percent" 26 sources={nodeSources} 27 > 28 <Axis units={AxisUnits.Percentage} label="CPU"> 29 {nodeIDs.map((nid) => ( 30 <Metric 31 name="cr.node.sys.cpu.combined.percent-normalized" 32 title={nodeDisplayName(nodesSummary, nid)} 33 sources={[nid]} 34 /> 35 ))} 36 </Axis> 37 </LineGraph>, 38 39 <LineGraph 40 title="Memory Usage" 41 sources={nodeSources} 42 tooltip={( 43 <div> 44 Memory in use {tooltipSelection} 45 </div> 46 )} 47 > 48 <Axis units={AxisUnits.Bytes} label="memory usage"> 49 {nodeIDs.map((nid) => ( 50 <Metric 51 name="cr.node.sys.rss" 52 title={nodeDisplayName(nodesSummary, nid)} 53 sources={[nid]} 54 /> 55 ))} 56 </Axis> 57 </LineGraph>, 58 59 <LineGraph 60 title="Disk Read Bytes" 61 sources={nodeSources} 62 > 63 <Axis units={AxisUnits.Bytes} label="bytes"> 64 {nodeIDs.map((nid) => ( 65 <Metric 66 name="cr.node.sys.host.disk.read.bytes" 67 title={nodeDisplayName(nodesSummary, nid)} 68 sources={[nid]} 69 nonNegativeRate 70 /> 71 ))} 72 </Axis> 73 </LineGraph>, 74 75 <LineGraph 76 title="Disk Write Bytes" 77 sources={nodeSources} 78 > 79 <Axis units={AxisUnits.Bytes} label="bytes"> 80 {nodeIDs.map((nid) => ( 81 <Metric 82 name="cr.node.sys.host.disk.write.bytes" 83 title={nodeDisplayName(nodesSummary, nid)} 84 sources={[nid]} 85 nonNegativeRate 86 /> 87 ))} 88 </Axis> 89 </LineGraph>, 90 91 <LineGraph 92 title="Disk Read Ops" 93 sources={nodeSources} 94 > 95 <Axis units={AxisUnits.Count} label="Read Ops"> 96 {nodeIDs.map((nid) => ( 97 <Metric 98 name="cr.node.sys.host.disk.read.count" 99 title={nodeDisplayName(nodesSummary, nid)} 100 sources={[nid]} 101 nonNegativeRate 102 /> 103 ))} 104 </Axis> 105 </LineGraph>, 106 107 <LineGraph 108 title="Disk Write Ops" 109 sources={nodeSources} 110 > 111 <Axis units={AxisUnits.Count} label="Write Ops"> 112 {nodeIDs.map((nid) => ( 113 <Metric 114 name="cr.node.sys.host.disk.write.count" 115 title={nodeDisplayName(nodesSummary, nid)} 116 sources={[nid]} 117 nonNegativeRate 118 /> 119 ))} 120 </Axis> 121 </LineGraph>, 122 123 <LineGraph 124 title="Disk IOPS In Progress" 125 sources={nodeSources} 126 > 127 <Axis units={AxisUnits.Count} label="IOPS"> 128 {nodeIDs.map((nid) => ( 129 <Metric 130 name="cr.node.sys.host.disk.iopsinprogress" 131 title={nodeDisplayName(nodesSummary, nid)} 132 sources={[nid]} 133 /> 134 ))} 135 </Axis> 136 </LineGraph>, 137 138 <LineGraph 139 title="Available Disk Capacity" 140 sources={storeSources} 141 > 142 <Axis units={AxisUnits.Bytes} label="capacity"> 143 {nodeIDs.map((nid) => ( 144 <Metric 145 name="cr.store.capacity.available" 146 sources={storeIDsForNode(nodesSummary, nid)} 147 title={nodeDisplayName(nodesSummary, nid)} 148 /> 149 ))} 150 </Axis> 151 </LineGraph>, 152 153 <LineGraph 154 title="Network Bytes Received" 155 sources={nodeSources} 156 > 157 <Axis units={AxisUnits.Bytes} label="bytes"> 158 {nodeIDs.map((nid) => ( 159 <Metric 160 name="cr.node.sys.host.net.recv.bytes" 161 title={nodeDisplayName(nodesSummary, nid)} 162 sources={[nid]} 163 nonNegativeRate 164 /> 165 ))} 166 </Axis> 167 </LineGraph>, 168 169 <LineGraph 170 title="Network Bytes Sent" 171 sources={nodeSources} 172 > 173 <Axis units={AxisUnits.Bytes} label="bytes"> 174 {nodeIDs.map((nid) => ( 175 <Metric 176 name="cr.node.sys.host.net.send.bytes" 177 title={nodeDisplayName(nodesSummary, nid)} 178 sources={[nid]} 179 nonNegativeRate 180 /> 181 ))} 182 </Axis> 183 </LineGraph>, 184 ]; 185 }