github.com/minio/console@v1.4.1/web-app/src/screens/Console/Dashboard/Prometheus/Widgets/NetworkGetItem.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 styled from "styled-components";
    19  import get from "lodash/get";
    20  import { Loader, NetworkGetIcon, Box } from "mds";
    21  
    22  const NetworkGetBase = styled.div(({ theme }) => ({
    23    "& .putLabel": {
    24      display: "flex",
    25      gap: 10,
    26      alignItems: "center",
    27      marginTop: "10px",
    28  
    29      "& .min-icon": {
    30        height: 15,
    31        width: 15,
    32        fill: get(theme, "signalColors.good", "#4CCB92"),
    33      },
    34  
    35      "& .getText": {
    36        fontSize: "18px",
    37        color: get(theme, "mutedText", "#87888d"),
    38        fontWeight: "bold",
    39      },
    40      "& .valueText": {
    41        fontSize: 50,
    42        fontFamily: "Inter",
    43        fontWeight: 600,
    44      },
    45    },
    46  }));
    47  
    48  const NetworkGetItem = ({
    49    value,
    50    loading,
    51  }: {
    52    value: any;
    53    loading: boolean;
    54    title?: any;
    55    id?: number;
    56  }) => {
    57    return (
    58      <NetworkGetBase>
    59        <Box className={"putLabel"}>
    60          <Box className={"getText"}>GET</Box>
    61          {loading ? (
    62            <Loader style={{ width: "15px", height: "15px" }} />
    63          ) : (
    64            <NetworkGetIcon />
    65          )}
    66        </Box>
    67        <Box className={"valueText"}>{value}</Box>
    68      </NetworkGetBase>
    69    );
    70  };
    71  
    72  export default NetworkGetItem;