@netdata/charts/dist/components/drawer/correlate/columns.js

Netdata frontend SDK and chart utilities

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.sparklineColumn = exports.nameColumn = exports.formatWeight = exports.formatChange = exports.correlationColumn = exports.changeColumn = void 0;
var _react = _interopRequireDefault(require("react"));
var _netdataUi = require("@netdata/netdata-ui");
var _sparkline = _interopRequireDefault(require("./sparkline"));
var _valueWithUnit = require("../valueWithUnit");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
var valueColumnSize = 144;
var valueColumnMinSize = 120;
var getWeightColor = function getWeightColor(weight) {
  var absWeight = Math.abs(weight);
  if (absWeight >= 0.8) return "primary";
  if (absWeight >= 0.5) return "warning";
  if (absWeight >= 0.2) return "textLite";
  return "textDescription";
};
var formatWeight = exports.formatWeight = function formatWeight(weight) {
  return ((1 - weight) * 100).toFixed(1);
};
var formatChange = exports.formatChange = function formatChange(change) {
  return "".concat(change > 0 ? "+" : "").concat(change.toFixed(1));
};
var nameColumn = exports.nameColumn = function nameColumn() {
  return {
    id: "name",
    header: /*#__PURE__*/(0, _jsxRuntime.jsx)(_netdataUi.TextSmall, {
      strong: true,
      children: "Metric"
    }),
    headerString: function headerString() {
      return "Metric";
    },
    accessorFn: function accessorFn(row) {
      return row.kind === "context" ? row.contextName : [row.dimensionName, row.nodeName, row.context].filter(Boolean).join(" ");
    },
    enableGlobalFilter: true,
    size: 480,
    minSize: 180,
    maxSize: 900,
    cell: function cell(_ref) {
      var _item$searchDepth;
      var row = _ref.row;
      var item = row.original;
      if (item.kind === "context") {
        return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.Flex, {
          alignItems: "center",
          gap: 1,
          width: "100%",
          children: [row.getCanExpand() && /*#__PURE__*/(0, _jsxRuntime.jsx)(_netdataUi.Icon, {
            name: row.getIsExpanded() ? "chevron_down" : "chevron_right",
            color: "textDescription",
            size: "small"
          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.Flex, {
            column: true,
            gap: 1,
            width: {
              min: "0px"
            },
            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_netdataUi.TextSmall, {
              strong: true,
              whiteSpace: "normal",
              wordBreak: "break-word",
              children: item.contextName
            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.TextMicro, {
              color: "textDescription",
              children: [item.count, " correlated dimensions"]
            })]
          })]
        });
      }
      return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.Flex, {
        column: true,
        gap: 1,
        padding: [0, 0, 0, ((_item$searchDepth = item.searchDepth) !== null && _item$searchDepth !== void 0 ? _item$searchDepth : row.depth) * 3],
        width: {
          min: "0px",
          base: "100%"
        },
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_netdataUi.TextSmall, {
          title: "Metric: ".concat(item.dimensionName, "\nContext: ").concat(item.context, "\nNode: ").concat(item.nodeName),
          whiteSpace: "normal",
          wordBreak: "break-word",
          children: item.dimensionName
        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.TextMicro, {
          color: "textDescription",
          whiteSpace: "normal",
          wordBreak: "break-word",
          children: [item.nodeName, " \u2022 ", item.context]
        })]
      });
    }
  };
};
var correlationColumn = exports.correlationColumn = function correlationColumn() {
  return {
    id: "correlation",
    header: /*#__PURE__*/(0, _jsxRuntime.jsx)(_valueWithUnit.ValueUnitHeader, {
      label: "Correlation"
    }),
    headerString: function headerString() {
      return "Correlation";
    },
    accessorFn: function accessorFn(row) {
      return row.kind === "context" ? row.minWeight : row.correlationWeight;
    },
    enableGlobalFilter: false,
    size: valueColumnSize,
    minSize: valueColumnMinSize,
    maxSize: 160,
    fullWidth: true,
    cell: function cell(_ref2) {
      var row = _ref2.row,
        getValue = _ref2.getValue;
      var item = row.original;
      var weight = getValue();
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_valueWithUnit.ValueUnitGrid, {
        value: formatWeight(weight),
        unit: "%",
        detail: item.kind === "dimension" ? item.correlationStrength : undefined,
        color: getWeightColor(weight)
      });
    },
    sortingFn: "basic"
  };
};
var changeColumn = exports.changeColumn = function changeColumn() {
  return {
    id: "change",
    header: /*#__PURE__*/(0, _jsxRuntime.jsx)(_valueWithUnit.ValueUnitHeader, {
      label: "Change"
    }),
    headerString: function headerString() {
      return "Change";
    },
    accessorFn: function accessorFn(row) {
      return row.kind === "dimension" ? row.percentChange : null;
    },
    enableGlobalFilter: false,
    size: valueColumnSize,
    minSize: valueColumnMinSize,
    maxSize: 140,
    fullWidth: true,
    cell: function cell(_ref3) {
      var row = _ref3.row,
        getValue = _ref3.getValue;
      if (row.original.kind !== "dimension") return null;
      var change = getValue();
      var color = change > 0 ? "warning" : change < 0 ? "primary" : "textLite";
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_valueWithUnit.ValueUnitGrid, {
        value: formatChange(change),
        unit: "%",
        color: color
      });
    },
    sortingFn: "basic"
  };
};
var sparklineColumn = exports.sparklineColumn = function sparklineColumn() {
  return {
    id: "sparkline",
    header: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_netdataUi.Flex, {
      alignItems: "center",
      gap: 1,
      width: "100%",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_netdataUi.Flex, {
        flex: false,
        basis: "".concat(valueColumnSize, "px"),
        width: "".concat(valueColumnSize, "px"),
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_valueWithUnit.ValueUnitHeader, {
          label: "Value"
        })
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_netdataUi.TextMicro, {
        strong: true,
        children: "Trend"
      })]
    }),
    headerString: function headerString() {
      return "Trend";
    },
    size: 300,
    minSize: 260,
    maxSize: 420,
    cell: function cell(_ref4) {
      var _row$getParentRow;
      var row = _ref4.row;
      if (row.original.kind !== "dimension") return null;
      var dimensions = row.original.searchSiblings || ((_row$getParentRow = row.getParentRow()) === null || _row$getParentRow === void 0 ? void 0 : _row$getParentRow.original.children) || [row.original];
      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_netdataUi.Flex, {
        width: "100%",
        height: "32px",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_sparkline["default"], {
          dimension: row.original,
          dimensions: dimensions
        })
      });
    }
  };
};