Line data    Source code

       1              : /*
       2              :  * Copyright (C) 2017 Red Hat, Inc.
       3              :  * SPDX-License-Identifier: LGPL-2.1-or-later
       4              :  */
       5              : 
       6          113 : import cockpit from "cockpit";
       7              : 
       8          113 : import React from "react";
       9              : 
      10              : import { Split, SplitItem } from "@patternfly/react-core/dist/esm/layouts/Split/index.js";
      11              : import { Grid, GridItem } from "@patternfly/react-core/dist/esm/layouts/Grid/index.js";
      12              : import { ZoomControls, SvgPlot, bytes_per_sec_config } from "cockpit-components-plot.jsx";
      13              : 
      14              : import { decode_filename, get_other_devices } from "./utils.js";
      15              : 
      16          113 : const _ = cockpit.gettext;
      17              : 
      18          113 : const single_read_metric = {
      19          113 :     direct: ["disk.all.read_bytes"],
      20          113 :     internal: ["disk.all.read"],
      21          113 :     units: "bytes",
      22          113 :     derive: "rate",
      23          113 :     threshold: 1000
      24          113 : };
      25              : 
      26          113 : const single_write_metric = {
      27          113 :     direct: ["disk.all.write_bytes"],
      28          113 :     internal: ["disk.all.written"],
      29          113 :     units: "bytes",
      30          113 :     derive: "rate",
      31          113 :     threshold: 1000
      32          113 : };
      33              : 
      34          113 : const instances_read_metric = {
      35          113 :     direct: "disk.dev.read_bytes",
      36          113 :     internal: "block.device.read",
      37          113 :     units: "bytes",
      38          113 :     derive: "rate",
      39          113 :     threshold: 1000
      40          113 : };
      41              : 
      42          113 : const instances_write_metric = {
      43          113 :     direct: "disk.dev.write_bytes",
      44          113 :     internal: "block.device.written",
      45          113 :     units: "bytes",
      46          113 :     derive: "rate",
      47          113 :     threshold: 1000
      48          113 : };
      49              : 
      50          112 : export function update_plot_state(ps, client) {
      51          112 :     const devs = [];
      52              : 
      53              :     // show all top-level block objects: Drives and Other devices
      54          112 :     const blocks = Object.keys(client.drives).map(p => client.drives_block[p])
      55           47 :             .concat(get_other_devices(client).map(p => client.blocks[p]));
      56              : 
      57          112 :     blocks.forEach(block => {
      58          112 :         const dev = block && decode_filename(block.Device).replace(/^\/dev\//, "");
      59          112 :         if (dev)
      60          112 :             devs.push(dev);
      61          112 :     });
      62              : 
      63           13 :     if (devs.length > 10) {
      64           13 :         ps.plot_single('read', single_read_metric);
      65           13 :         ps.plot_single('write', single_write_metric);
      66           13 :     } else {
      67          112 :         ps.plot_instances('read', instances_read_metric, devs);
      68          112 :         ps.plot_instances('write', instances_write_metric, devs);
      69          112 :     }
      70          112 : }
      71              : 
      72           93 : export const StoragePlots = ({ plot_state }) => {
      73           93 :     return (
      74           93 :         <>
      75           93 :             <Split>
      76           93 :                 <SplitItem isFilled />
      77           93 :                 <SplitItem><ZoomControls plot_state={plot_state} /></SplitItem>
      78           93 :             </Split>
      79           93 :             <Grid sm={12} md={6} lg={6} hasGutter>
      80           93 :                 <GridItem>
      81           93 :                     <SvgPlot className="storage-graph"
      82           93 :                              title={_("Reading")} config={bytes_per_sec_config}
      83           93 :                              plot_state={plot_state} plot_id='read' />
      84           93 :                 </GridItem>
      85           93 :                 <GridItem>
      86           93 :                     <SvgPlot className="storage-graph"
      87           93 :                              title={_("Writing")} config={bytes_per_sec_config}
      88           93 :                              plot_state={plot_state} plot_id='write' />
      89           93 :                 </GridItem>
      90           93 :             </Grid>
      91           93 :         </>);
      92           93 : };