github.com/minio/console@v1.4.1/web-app/src/screens/Console/Dashboard/Prometheus/Widgets/tooltips/BarChartTooltip.tsx (about)

     1  // This file is part of MinIO Console Server
     2  // Copyright (c) 2021 MinIO, Inc.
     3  //
     4  // This program is free software: you can redistribute it and/or modify
     5  // it under the terms of the GNU Affero General Public License as published by
     6  // the Free Software Foundation, either version 3 of the License, or
     7  // (at your option) any later version.
     8  //
     9  // This program is distributed in the hope that it will be useful,
    10  // but WITHOUT ANY WARRANTY; without even the implied warranty of
    11  // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    12  // GNU Affero General Public License for more details.
    13  //
    14  // You should have received a copy of the GNU Affero General Public License
    15  // along with this program.  If not, see <http://www.gnu.org/licenses/>.
    16  
    17  import React from "react";
    18  import { Box } from "mds";
    19  import { tooltipCommon } from "../../../../Common/FormComponents/common/styleLibrary";
    20  
    21  const BarChartTooltip = ({
    22    active,
    23    payload,
    24    label,
    25    barChartConfiguration,
    26  }: any) => {
    27    if (active) {
    28      return (
    29        <Box sx={tooltipCommon.customTooltip}>
    30          <Box sx={tooltipCommon.timeStampTitle}>{label}</Box>
    31          {payload &&
    32            payload.map((pl: any, index: number) => {
    33              return (
    34                <Box
    35                  sx={tooltipCommon.labelContainer}
    36                  key={`pltiem-${index}-${label}`}
    37                >
    38                  <Box
    39                    sx={tooltipCommon.labelColor}
    40                    style={{
    41                      backgroundColor: barChartConfiguration[index].color,
    42                    }}
    43                  />
    44                  <Box
    45                    sx={{
    46                      ...tooltipCommon.itemValue,
    47                      "& span.valueContainer": {
    48                        ...tooltipCommon.valueContainer,
    49                      },
    50                    }}
    51                  >
    52                    <span className={"valueContainer"}>{pl.value}</span>
    53                  </Box>
    54                </Box>
    55              );
    56            })}
    57        </Box>
    58      );
    59    }
    60  
    61    return null;
    62  };
    63  
    64  export default BarChartTooltip;