github.com/cockroachdb/cockroach@v20.2.0-alpha.1+incompatible/pkg/ui/src/views/cluster/containers/nodeGraphs/dashboards/overview.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  import _ from "lodash";
    13  
    14  import { LineGraph } from "src/views/cluster/components/linegraph";
    15  import { Metric, Axis, AxisUnits } from "src/views/shared/components/metricQuery";
    16  
    17  import { GraphDashboardProps, nodeDisplayName, storeIDsForNode } from "./dashboardUtils";
    18  import { CapacityGraphTooltip } from "src/views/cluster/containers/nodeGraphs/dashboards/graphTooltips";
    19  
    20  export default function (props: GraphDashboardProps) {
    21    const { nodeIDs, nodesSummary, nodeSources, storeSources, tooltipSelection } = props;
    22  
    23    return [
    24      <LineGraph
    25        title="SQL Queries"
    26        sources={nodeSources}
    27        tooltip={
    28          `A ten-second moving average of the # of SELECT, INSERT, UPDATE, and DELETE statements
    29          successfully executed per second ${tooltipSelection}.`
    30        }
    31      >
    32        <Axis label="queries">
    33          <Metric name="cr.node.sql.select.count" title="Selects" nonNegativeRate />
    34          <Metric name="cr.node.sql.update.count" title="Updates" nonNegativeRate />
    35          <Metric name="cr.node.sql.insert.count" title="Inserts" nonNegativeRate />
    36          <Metric name="cr.node.sql.delete.count" title="Deletes" nonNegativeRate />
    37        </Axis>
    38      </LineGraph>,
    39  
    40      <LineGraph
    41        title="Service Latency: SQL, 99th percentile"
    42        tooltip={(
    43          <div>
    44            Over the last minute, this node executed 99% of queries within this time.&nbsp;
    45              <em>This time does not include network latency between the node and client.</em>
    46          </div>
    47        )}
    48      >
    49        <Axis units={AxisUnits.Duration} label="latency">
    50          {
    51            _.map(nodeIDs, (node) => (
    52              <Metric
    53                key={node}
    54                name="cr.node.sql.service.latency-p99"
    55                title={nodeDisplayName(nodesSummary, node)}
    56                sources={[node]}
    57                downsampleMax
    58              />
    59            ))
    60          }
    61        </Axis>
    62      </LineGraph>,
    63  
    64      <LineGraph
    65        title="Replicas per Node"
    66        tooltip={(
    67          <div>
    68            The number of range replicas stored on this node.
    69            {" "}
    70            <em>Ranges are subsets of your data, which are replicated to ensure survivability.</em>
    71          </div>
    72        )}
    73      >
    74        <Axis label="replicas">
    75          {
    76            _.map(nodeIDs, (nid) => (
    77              <Metric
    78                key={nid}
    79                name="cr.store.replicas"
    80                title={nodeDisplayName(nodesSummary, nid)}
    81                sources={storeIDsForNode(nodesSummary, nid)}
    82              />
    83            ))
    84          }
    85        </Axis>
    86      </LineGraph>,
    87  
    88      <LineGraph
    89        title="Capacity"
    90        sources={storeSources}
    91        tooltip={<CapacityGraphTooltip tooltipSelection={tooltipSelection}/>}
    92      >
    93        <Axis units={AxisUnits.Bytes} label="capacity">
    94          <Metric name="cr.store.capacity" title="Capacity" />
    95          <Metric name="cr.store.capacity.available" title="Available" />
    96          <Metric name="cr.store.capacity.used" title="Used" />
    97        </Axis>
    98      </LineGraph>,
    99  
   100    ];
   101  }