github.com/minio/console@v1.4.1/web-app/src/screens/Console/Policies/AddPolicyHelpBox.tsx (about)

     1  // This file is part of MinIO Console Server
     2  // Copyright (c) 2022 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  import React from "react";
    17  
    18  import { Box, HelpIconFilled, IAMPoliciesIcon } from "mds";
    19  
    20  const FeatureItem = ({
    21    icon,
    22    description,
    23  }: {
    24    icon: any;
    25    description: string;
    26  }) => {
    27    return (
    28      <Box
    29        sx={{
    30          display: "flex",
    31          "& .min-icon": {
    32            marginRight: "10px",
    33            height: "23px",
    34            width: "23px",
    35            marginBottom: "10px",
    36          },
    37        }}
    38      >
    39        {icon}{" "}
    40        <div style={{ fontSize: "14px", fontStyle: "italic", color: "#5E5E5E" }}>
    41          {description}
    42        </div>
    43      </Box>
    44    );
    45  };
    46  
    47  const AddPolicyHelpBox = () => {
    48    return (
    49      <Box
    50        sx={{
    51          flex: 1,
    52          border: "1px solid #eaeaea",
    53          borderRadius: "2px",
    54          display: "flex",
    55          flexFlow: "column",
    56          padding: "20px",
    57        }}
    58      >
    59        <Box
    60          sx={{
    61            fontSize: "16px",
    62            fontWeight: 600,
    63            display: "flex",
    64            alignItems: "center",
    65            marginBottom: "16px",
    66            paddingBottom: "20px",
    67  
    68            "& .min-icon": {
    69              height: "21px",
    70              width: "21px",
    71              marginRight: "15px",
    72            },
    73          }}
    74        >
    75          <HelpIconFilled />
    76          <div>Learn more about Policies</div>
    77        </Box>
    78        <Box sx={{ fontSize: "14px", marginBottom: "15px" }}>
    79          <Box sx={{ paddingBottom: "20px" }}>
    80            <FeatureItem
    81              icon={<IAMPoliciesIcon />}
    82              description={`Create Policies`}
    83            />
    84            <Box sx={{ paddingTop: "20px" }}>
    85              MinIO uses Policy-Based Access Control (PBAC) to define the
    86              authorized actions and resources to which an authenticated user has
    87              access. Each policy describes one or more actions and conditions
    88              that outline the permissions of a user or group of users.{" "}
    89            </Box>
    90          </Box>
    91          <Box sx={{ paddingBottom: "20px" }}>
    92            MinIO PBAC is built for compatibility with AWS IAM policy syntax,
    93            structure, and behavior.
    94          </Box>
    95          <Box sx={{ paddingBottom: "20px" }}>
    96            Each user can access only those resources and operations which are
    97            explicitly granted by the built-in role. MinIO denies access to any
    98            other resource or action by default.
    99          </Box>
   100        </Box>
   101      </Box>
   102    );
   103  };
   104  
   105  export default AddPolicyHelpBox;