github.com/cockroachdb/cockroach@v20.2.0-alpha.1+incompatible/pkg/ui/ccl/src/views/clusterviz/containers/map/cpuSparkline.tsx (about)

     1  // Copyright 2018 The Cockroach Authors.
     2  //
     3  // Licensed as a CockroachDB Enterprise file under the Cockroach Community
     4  // License (the "License"); you may not use this file except in compliance with
     5  // the License. You may obtain a copy of the License at
     6  //
     7  //     https://github.com/cockroachdb/cockroach/blob/master/licenses/CCL.txt
     8  
     9  import d3 from "d3";
    10  import React from "react";
    11  
    12  import { SparklineMetricsDataComponent } from "src/views/clusterviz/containers/map/sparkline";
    13  import { Metric } from "src/views/shared/components/metricQuery";
    14  import { MetricsDataProvider } from "src/views/shared/containers/metricDataProvider";
    15  
    16  interface CpuSparklineProps {
    17    nodes: string[];
    18  }
    19  
    20  export function CpuSparkline(props: CpuSparklineProps) {
    21    const key = "sparkline.cpu.nodes." + props.nodes.join("-");
    22  
    23    return (
    24      <MetricsDataProvider id={key}>
    25        <SparklineMetricsDataComponent formatCurrentValue={d3.format(".1%")}>
    26          <Metric name="cr.node.sys.cpu.sys.percent" sources={props.nodes} />
    27          <Metric name="cr.node.sys.cpu.user.percent" sources={props.nodes} />
    28        </SparklineMetricsDataComponent>
    29      </MetricsDataProvider>
    30    );
    31  }