mirrors/object-browser
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add HelpTips to Console (#3054)

Browse Source
This commit is contained in:
jinapurapu
2023-10-06 13:38:55 -07:00
committed by GitHub
parent 1d7bb0bb2b
commit 429dfb4314
21 changed files with 556 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
portal-ui/src/screens/Console/Account/AddServiceAccountScreen.tsx
View File

@@ -28,6 +28,7 @@ import {
InputBox,
Switch,
ServiceAccountIcon,
HelpTip,
} from "mds";
import { modalStyleUtils } from "../Common/FormComponents/common/styleLibrary";
import { NewServiceAccount } from "../Common/CredentialsPrompt/types";
@@ -190,10 +191,24 @@ const AddServiceAccount = () => {
{isRestrictedByPolicy && (
<Grid item xs={12}>
<Box>
<PanelTitle>
Current User Policy - edit the JSON to remove permissions
for this Access Key
</PanelTitle>
<HelpTip
content={
<Fragment>
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/identity-access-management/policy-based-access-control.html#policy-document-structure"
>
Guide to access policy structure
</a>
</Fragment>
}
placement="right"
>
<PanelTitle>
Current User Policy - edit the JSON to remove
permissions for this Access Key
</PanelTitle>
</HelpTip>
</Box>
<Grid item xs={12} sx={{ ...modalStyleUtils.formScrollable }}>
<CodeMirrorWrapper

12
portal-ui/src/screens/Console/Account/ServiceAccountPolicy.tsx
View File

@@ -14,7 +14,7 @@
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { useEffect, useState } from "react";
import React, { useEffect, useState, Fragment } from "react";
import { Button, ChangeAccessPolicyIcon, Grid } from "mds";
import { api } from "api";
import { errorToHandler } from "api/errors";
@@ -98,6 +98,16 @@ const ServiceAccountPolicy = ({
setPolicyDefinition(value);
}}
editorHeight={"350px"}
helptip={
<Fragment>
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/identity-access-management/policy-based-access-control.html#policy-document-structure"
>
Guide to access policy structure
</a>
</Fragment>
}
/>
</Grid>
<Grid item xs={12} sx={modalStyleUtils.modalButtonBar}>

29
portal-ui/src/screens/Console/Buckets/BucketDetails/AccessDetailsPanel.tsx
View File

@@ -17,7 +17,7 @@
import React, { Fragment, useEffect, useState } from "react";
import { useSelector } from "react-redux";
import { useNavigate, useParams } from "react-router-dom";
import { DataTable, SectionTitle, Tabs } from "mds";
import { DataTable, SectionTitle, Tabs, HelpTip } from "mds";
import { api } from "api";
import { errorToHandler } from "api/errors";
import {
@@ -145,7 +145,32 @@ const AccessDetails = () => {
return (
<Fragment>
<SectionTitle separator>Access Audit</SectionTitle>
<SectionTitle separator>
<HelpTip
content={
<Fragment>
Understand which{" "}
<a
target="blank"
href="https://min.io/docs/minio/linux/administration/identity-access-management/policy-based-access-control.html#"
>
Policies
</a>{" "}
and{" "}
<a
target="blank"
href="https://min.io/docs/minio/linux/administration/identity-access-management/minio-user-management.html"
>
Users
</a>{" "}
are authorized to access this Bucket.
</Fragment>
}
placement="right"
>
Access Audit
</HelpTip>
</SectionTitle>
<Tabs
currentTabOrPath={curTab}
onTabClick={(newValue: string) => {

22
portal-ui/src/screens/Console/Buckets/BucketDetails/AccessRulePanel.tsx
View File

@@ -15,7 +15,7 @@
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { Fragment, useEffect, useState } from "react";
import { AddIcon, Button, DataTable, SectionTitle } from "mds";
import { AddIcon, Button, DataTable, SectionTitle, HelpTip } from "mds";
import { useSelector } from "react-redux";
import { useParams } from "react-router-dom";
import { api } from "api";
@@ -194,7 +194,25 @@ const AccessRule = () => {
</SecureComponent>
}
>
Anonymous Access
<HelpTip
content={
<Fragment>
Setting an{" "}
<a
href="https://min.io/docs/minio/linux/reference/minio-mc/mc-anonymous-set.html"
target="blank"
>
Anonymous
</a>{" "}
policy allows clients to access the Bucket or prefix contents and
perform actions consistent with the specified policy without
authentication.
</Fragment>
}
placement="right"
>
Anonymous Access
</HelpTip>
</SectionTitle>
<SecureComponent
scopes={[IAM_SCOPES.S3_GET_BUCKET_POLICY, IAM_SCOPES.S3_GET_ACTIONS]}

9
portal-ui/src/screens/Console/Buckets/BucketDetails/AddAccessRule.tsx
View File

@@ -14,7 +14,7 @@
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { useEffect, useState } from "react";
import React, { useEffect, useState, Fragment } from "react";
import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
import {
AddAccessRuleIcon,
@@ -115,6 +115,13 @@ const AddAccessRule = ({
value={selectedAccess}
options={accessOptions}
disabled={false}
helpTip={
<Fragment>
Select the desired level of access available to unauthenticated
Users
</Fragment>
}
helpTipPlacement="right"
/>
<Grid item xs={12} sx={modalStyleUtils.modalButtonBar}>
<Button

12
portal-ui/src/screens/Console/Buckets/BucketDetails/AddEvent.tsx
View File

@@ -14,7 +14,7 @@
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { useCallback, useEffect, useState } from "react";
import React, { useCallback, useEffect, useState, Fragment } from "react";
import { Button, DataTable, EventSubscriptionIcon, Grid, InputBox } from "mds";
import { ErrorResponseHandler } from "../../../../common/types";
import { setModalErrorSnackMessage } from "../../../../systemSlice";
@@ -170,6 +170,16 @@ const AddEvent = ({
label={"ARN"}
value={arn}
options={arnValues || []}
helptip={
<Fragment>
<a
target="blank"
href="https://docs.aws.amazon.com/IAM/latest/UserGuide/reference-arns.html"
>
Amazon Resource Name
</a>
</Fragment>
}
/>
</Grid>
<Grid item xs={12} sx={formFieldStyles.formFieldRow}>

59
portal-ui/src/screens/Console/Buckets/BucketDetails/AddLifecycleModal.tsx
View File

@@ -15,6 +15,7 @@
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { Fragment, useEffect, useState } from "react";
import get from "lodash/get";
import {
Button,
@@ -44,6 +45,7 @@ import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
import QueryMultiSelector from "../../Common/FormComponents/QueryMultiSelector/QueryMultiSelector";
import InputUnitMenu from "../../Common/FormComponents/InputUnitMenu/InputUnitMenu";
import FormSwitchWrapper from "../../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
import { IAM_PAGES } from "common/SecureComponent/permissions";
interface IReplicationModal {
open: boolean;
@@ -218,7 +220,7 @@ const AddLifecycleModal = ({
currentValue={ilmType}
id="ilm_type"
name="ilm_type"
label="Type of lifecycle"
label="Type of Lifecycle"
onChange={(e) => {
setIlmType(e.target.value as "expiry" | "transition");
}}
@@ -226,6 +228,33 @@ const AddLifecycleModal = ({
{ value: "expiry", label: "Expiry" },
{ value: "transition", label: "Transition" },
]}
helpTip={
<Fragment>
Select{" "}
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/object-management/create-lifecycle-management-expiration-rule.html"
>
Expiry
</a>{" "}
to delete Objects per this rule. Select{" "}
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/object-management/transition-objects-to-minio.html"
>
Transition
</a>{" "}
to move Objects to a remote storage{" "}
<a
target="blank"
href="https://min.io/docs/minio/windows/administration/object-management/transition-objects-to-minio.html#configure-the-remote-storage-tier"
>
Tier
</a>{" "}
per this rule.
</Fragment>
}
helpTipPlacement="right"
/>
{versioningInfo?.status === "Enabled" && (
<Select
@@ -240,6 +269,20 @@ const AddLifecycleModal = ({
{ value: "current", label: "Current Version" },
{ value: "noncurrent", label: "Non-Current Version" },
]}
helpTip={
<Fragment>
Select whether to apply the rule to current or non-current
Object
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/object-management/create-lifecycle-management-expiration-rule.html#expire-versioned-objects"
>
{" "}
Versions
</a>
</Fragment>
}
helpTipPlacement="right"
/>
)}
@@ -276,6 +319,20 @@ const AddLifecycleModal = ({
setStorageClass(value as string);
}}
options={tiersList}
helpTip={
<Fragment>
Configure a{" "}
<a
href={IAM_PAGES.TIERS_ADD}
color="secondary"
style={{ textDecoration: "underline" }}
>
remote tier
</a>{" "}
to receive transitioned Objects
</Fragment>
}
helpTipPlacement="right"
/>
)}
<Grid item xs={12} sx={formFieldRowFilter}>

20
portal-ui/src/screens/Console/Buckets/BucketDetails/BucketEventsPanel.tsx
View File

@@ -26,6 +26,7 @@ import {
DataTable,
Grid,
SectionTitle,
HelpTip,
} from "mds";
import { api } from "api";
import { NotificationConfig } from "api/consoleApi";
@@ -176,7 +177,24 @@ const BucketEventsPanel = () => {
</SecureComponent>
}
>
Events
<HelpTip
content={
<Fragment>
MinIO{" "}
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/monitoring.html"
>
bucket notifications
</a>{" "}
allow administrators to send notifications to supported external
services on certain object or bucket events.
</Fragment>
}
placement="right"
>
Events
</HelpTip>
</SectionTitle>
<Grid container>

20
portal-ui/src/screens/Console/Buckets/BucketDetails/BucketLifecyclePanel.tsx
View File

@@ -24,6 +24,7 @@ import {
HelpBox,
SectionTitle,
TiersIcon,
HelpTip,
} from "mds";
import { useSelector } from "react-redux";
import { api } from "api";
@@ -292,7 +293,24 @@ const BucketLifecyclePanel = () => {
</SecureComponent>
}
>
Lifecycle Rules
<HelpTip
content={
<Fragment>
MinIO derives it’s behavior and syntax from{" "}
<a
target="blank"
href="https://docs.aws.amazon.com/AmazonS3/latest/userguide/object-lifecycle-mgmt.html"
>
S3 lifecycle
</a>{" "}
for compatibility in migrating workloads and lifecycle rules from
S3 to MinIO.
</Fragment>
}
placement="right"
>
Lifecycle Rules
</HelpTip>
</SectionTitle>
<Grid container>
<Grid item xs={12}>

20
portal-ui/src/screens/Console/Buckets/BucketDetails/BucketReplicationPanel.tsx
View File

@@ -27,6 +27,7 @@ import {
HelpBox,
SectionTitle,
TrashIcon,
HelpTip,
} from "mds";
import api from "../../../../common/api";
import {
@@ -303,7 +304,24 @@ const BucketReplicationPanel = () => {
</Box>
}
>
Replication
<HelpTip
content={
<Fragment>
MinIO{" "}
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/bucket-replication.html"
>
server-side bucket replication
</a>{" "}
is an automatic bucket-level configuration that synchronizes
objects between a source and destination bucket.
</Fragment>
}
placement="right"
>
Replication
</HelpTip>
</SectionTitle>
<Grid container>
<Grid item xs={12}>

68
portal-ui/src/screens/Console/Buckets/BucketDetails/BucketSummaryPanel.tsx
View File

@@ -15,6 +15,7 @@
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { Fragment, useEffect, useState } from "react";
import get from "lodash/get";
import { useSelector } from "react-redux";
import { useParams } from "react-router-dom";
@@ -116,7 +117,6 @@ const BucketSummary = () => {
useState<boolean>(false);
const [enableVersioningOpen, setEnableVersioningOpen] =
useState<boolean>(false);
useEffect(() => {
dispatch(setHelpName("bucket_detail_summary"));
// eslint-disable-next-line react-hooks/exhaustive-deps
@@ -441,6 +441,26 @@ const BucketSummary = () => {
setAccessPolicyScreenOpen(true);
}}
isLoading={bucketLoading}
helpTip={
<Fragment>
<strong>Private</strong> policy limits access to
credentialled accounts with appropriate permissions
<br />
<strong>Public</strong> policy anyone will be able to
upload, download and delete files from this Bucket once
logged in
<br />
<strong>Custom</strong> policy can be written to define
which accounts are authorized to access this Bucket
<br />
<br />
To allow Bucket access without credentials, use the{" "}
<a href={`/buckets/${bucketName}/admin/prefix`}>
Anonymous
</a>{" "}
setting
</Fragment>
}
/>
</SecureComponent>
@@ -463,6 +483,26 @@ const BucketSummary = () => {
setEnableEncryptionScreenOpen(true);
}}
isLoading={loadingEncryption}
helpTip={
<Fragment>
MinIO supports enabling automatic{" "}
<a
href="https://min.io/docs/minio/kubernetes/upstream/administration/server-side-encryption/server-side-encryption-sse-kms.html"
target="blank"
>
SSE-KMS
</a>{" "}
and{" "}
<a
href="https://min.io/docs/minio/kubernetes/upstream/administration/server-side-encryption/server-side-encryption-sse-s3.html"
target="blank"
>
SSE-S3
</a>{" "}
encryption of all objects written to a bucket using a
specific External Key (EK) stored on the external KMS.
</Fragment>
}
/>
</SecureComponent>
@@ -526,6 +566,19 @@ const BucketSummary = () => {
value={quotaEnabled ? "Enabled" : "Disabled"}
onEdit={setBucketQuota}
isLoading={loadingQuota}
helpTip={
<Fragment>
Setting a{" "}
<a
href="https://min.io/docs/minio/linux/reference/minio-mc/mc-quota-set.html"
target="blank"
>
quota
</a>{" "}
assigns a hard limit to a bucket beyond which MinIO does
not allow writes.
</Fragment>
}
/>
</Box>
<Box
@@ -618,6 +671,19 @@ const BucketSummary = () => {
setRetentionConfigOpen(true);
}}
isLoading={loadingRetention}
helpTip={
<Fragment>
MinIO{" "}
<a
target="blank"
href="https://min.io/docs/minio/macos/administration/object-management.html#object-retention"
>
Object Locking
</a>{" "}
enforces Write-Once Read-Many (WORM) immutability to
protect versioned objects from deletion.
</Fragment>
}
/>
<ValuePair

12
portal-ui/src/screens/Console/Buckets/BucketDetails/SetAccessPolicy.tsx
View File

@@ -14,7 +14,7 @@
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { useEffect, useState } from "react";
import React, { useEffect, useState, Fragment } from "react";
import { api } from "api";
import { BucketAccess } from "api/consoleApi";
import { errorToHandler } from "api/errors";
@@ -135,6 +135,16 @@ const SetAccessPolicy = ({
setPolicyDefinition(value);
}}
editorHeight={"300px"}
helptip={
<Fragment>
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/identity-access-management/policy-based-access-control.html#policy-document-structure"
>
Guide to access policy structure
</a>
</Fragment>
}
/>
</Grid>
)}

26
portal-ui/src/screens/Console/Buckets/BucketDetails/SetRetentionConfig.tsx
View File

@@ -14,7 +14,7 @@
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { useEffect, useState } from "react";
import React, { useEffect, useState, Fragment } from "react";
import {
Button,
Loader,
@@ -137,6 +137,30 @@ const SetRetentionConfig = ({
{ value: "compliance", label: "Compliance" },
{ value: "governance", label: "Governance" },
]}
helpTip={
<Fragment>
{" "}
<a
href="https://min.io/docs/minio/macos/administration/object-management/object-retention.html#minio-object-locking-compliance"
target="blank"
>
Compliance
</a>{" "}
lock protects Objects from write operations by all users,
including the MinIO root user.
<br />
<br />
<a
href="https://min.io/docs/minio/macos/administration/object-management/object-retention.html#minio-object-locking-governance"
target="blank"
>
Governance
</a>{" "}
lock protects Objects from write operations by non-privileged
users.
</Fragment>
}
helpTipPlacement="right"
/>
<RadioGroup
currentValue={retentionUnit as string}

48
portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/EditablePropertyItem.tsx
View File

@@ -15,7 +15,7 @@
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React from "react";
import { ActionLink, Box, ValuePair } from "mds";
import { ActionLink, Box, HelpTip, ValuePair } from "mds";
import { SecureComponent } from "../../../../../common/SecureComponent";
import EditActionButton from "./EditActionButton";
@@ -29,6 +29,7 @@ type EditablePropertyItemProps = {
onEdit: () => void;
secureCmpProps?: Record<any, any>;
disabled?: boolean;
helpTip?: any;
};
const SecureAction = ({
@@ -63,6 +64,7 @@ const EditablePropertyItem = ({
value = null,
onEdit,
disabled = false,
helpTip,
}: EditablePropertyItemProps) => {
return (
<Box
@@ -76,19 +78,37 @@ const EditablePropertyItem = ({
<ValuePair
label={property}
value={
<SecureAction
resourceName={resourceName}
iamScopes={iamScopes}
secureCmpProps={secureCmpProps}
>
<ActionLink
isLoading={isLoading}
onClick={onEdit}
label={value}
sx={{ fontWeight: "bold" }}
disabled={disabled}
/>
</SecureAction>
helpTip ? (
<SecureAction
resourceName={resourceName}
iamScopes={iamScopes}
secureCmpProps={secureCmpProps}
>
<HelpTip placement="left" content={helpTip}>
<ActionLink
isLoading={isLoading}
onClick={onEdit}
label={value}
sx={{ fontWeight: "bold" }}
disabled={disabled}
/>
</HelpTip>
</SecureAction>
) : (
<SecureAction
resourceName={resourceName}
iamScopes={iamScopes}
secureCmpProps={secureCmpProps}
>
<ActionLink
isLoading={isLoading}
onClick={onEdit}
label={value}
sx={{ fontWeight: "bold" }}
disabled={disabled}
/>
</SecureAction>
)
}
/>
<SecureAction

111
portal-ui/src/screens/Console/Buckets/ListBuckets/AddBucket/AddBucket.tsx
View File

@@ -350,6 +350,35 @@ const AddBucket = () => {
"Versioning",
)
}
helpTip={
<Fragment>
MinIO supports keeping multiple{" "}
<a
href="https://min.io/docs/minio/kubernetes/upstream/administration/object-management/object-versioning.html#minio-bucket-versioning"
target="blank"
>
“versions”
</a>{" "}
of an object in a single bucket.
<br />
Versioning is required to enable{" "}
<a
href="https://min.io/docs/minio/macos/administration/object-management.html#object-retention"
target="blank"
>
Object Locking
</a>{" "}
and{" "}
<a
href="https://min.io/docs/minio/macos/administration/object-management/object-retention.html#object-retention-modes"
target="blank"
>
Retention
</a>
.
</Fragment>
}
helpTipPlacement="right"
/>
{versioningEnabled && distributedSetup && !lockingEnabled && (
<Fragment>
@@ -361,6 +390,20 @@ const AddBucket = () => {
dispatch(setExcludeFolders(e.target.checked));
}}
indicatorLabels={["Enabled", "Disabled"]}
helpTip={
<Fragment>
You can choose to{" "}
<a href="https://min.io/docs/minio/windows/administration/object-management/object-versioning.html#exclude-folders-from-versioning">
exclude folders and prefixes
</a>{" "}
from versioning if Object Locking is not enabled.
<br />
MinIO requires versioning to support replication.
Objects in excluded prefixes do not replicate to any
peer site or remote site.
</Fragment>
}
helpTipPlacement="right"
/>
<CSVMultiSelector
elements={excludedPrefixes}
@@ -411,6 +454,19 @@ const AddBucket = () => {
"Locking",
)
}
helpTip={
<Fragment>
You can only enable{" "}
<a
href="https://min.io/docs/minio/macos/administration/object-management.html#object-retention"
target="blank"
>
Object Locking
</a>{" "}
when first creating a bucket.
</Fragment>
}
helpTipPlacement="right"
/>
<Switch
value="bucket_quota"
@@ -422,6 +478,20 @@ const AddBucket = () => {
}}
label={"Quota"}
disabled={!distributedSetup}
helpTip={
<Fragment>
Setting a{" "}
<a
href="https://min.io/docs/minio/linux/reference/minio-mc/mc-quota-set.html"
target="blank"
>
quota
</a>{" "}
assigns a hard limit to a bucket beyond which MinIO does
not allow writes.
</Fragment>
}
helpTipPlacement="right"
/>
{quotaEnabled && distributedSetup && (
<Fragment>
@@ -465,6 +535,23 @@ const AddBucket = () => {
dispatch(setRetention(event.target.checked));
}}
label={"Retention"}
helpTip={
<Fragment>
MinIO supports setting both{" "}
<a
href="https://min.io/docs/minio/macos/administration/object-management/object-retention.html#configure-bucket-default-object-retention"
target="blank"
>
bucket-default
</a>{" "}
and per-object retention rules.
<br />
<br /> For per-object retention settings, defer to the
documentation for the PUT operation used by your
preferred SDK.
</Fragment>
}
helpTipPlacement="right"
/>
)}
{retentionEnabled && distributedSetup && (
@@ -485,6 +572,30 @@ const AddBucket = () => {
{ value: "compliance", label: "Compliance" },
{ value: "governance", label: "Governance" },
]}
helpTip={
<Fragment>
{" "}
<a
href="https://min.io/docs/minio/macos/administration/object-management/object-retention.html#minio-object-locking-compliance"
target="blank"
>
Compliance
</a>{" "}
lock protects Objects from write operations by all
users, including the MinIO root user.
<br />
<br />
<a
href="https://min.io/docs/minio/macos/administration/object-management/object-retention.html#minio-object-locking-governance"
target="blank"
>
Governance
</a>{" "}
lock protects Objects from write operations by
non-privileged users.
</Fragment>
}
helpTipPlacement="right"
/>
<InputBox
type="number"

9
portal-ui/src/screens/Console/Common/FormComponents/AutocompleteWrapper/AutocompleteWrapper.tsx
View File

@@ -33,7 +33,7 @@ import {
inputFieldStyles,
tooltipHelper,
} from "../common/styleLibrary";
import { HelpIcon } from "mds";
import { HelpIcon, HelpTip } from "mds";
interface selectorTypes {
label: string;
@@ -50,6 +50,7 @@ interface SelectProps {
onChange: (returnedValue: string) => void;
disabled?: boolean;
classes: any;
helptip?: any;
}
const styles = (theme: Theme) =>
@@ -85,6 +86,7 @@ const AutocompleteWrapper = ({
tooltip = "",
value,
disabled = false,
helptip,
}: SelectProps) => {
const [internalValue, setInternalValue] = useState<selectorTypes>(options[0]);
@@ -100,7 +102,10 @@ const AutocompleteWrapper = ({
<Grid item xs={12} className={classes.fieldContainer}>
{label !== "" && (
<InputLabel htmlFor={id} className={classes.inputLabel}>
<span>{label}</span>
<HelpTip content={helptip} placement="right">
{" "}
<span>{label}</span>
</HelpTip>
{tooltip !== "" && (
<div className={classes.tooltipContainer}>
<Tooltip title={tooltip} placement="top-start">

4
portal-ui/src/screens/Console/Common/FormComponents/CodeMirrorWrapper/CodeMirrorWrapper.tsx
View File

@@ -26,6 +26,7 @@ interface ICodeWrapper {
tooltip?: string;
onChange: (value: string) => any;
editorHeight?: string | number;
helptip?: any;
}
const CodeMirrorWrapper = ({
@@ -35,6 +36,7 @@ const CodeMirrorWrapper = ({
mode = "json",
onChange,
editorHeight = 250,
helptip,
}: ICodeWrapper) => {
return (
<CodeEditor
@@ -59,6 +61,8 @@ const CodeMirrorWrapper = ({
</TooltipWrapper>
</Fragment>
}
helpTip={helptip}
helpTipPlacement="right"
/>
);
};

10
portal-ui/src/screens/Console/Policies/AddPolicyScreen.tsx
View File

@@ -140,6 +140,16 @@ const AddPolicyScreen = () => {
setPolicyDefinition(value);
}}
editorHeight={"350px"}
helptip={
<Fragment>
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/identity-access-management/policy-based-access-control.html#policy-document-structure"
>
Guide to access policy structure
</a>
</Fragment>
}
/>
</Grid>
<Grid item xs={12} sx={{ textAlign: "right" }}>

29
portal-ui/src/screens/Console/Policies/PolicyDetails.tsx
View File

@@ -31,6 +31,7 @@ import {
SectionTitle,
Tabs,
TrashIcon,
HelpTip,
} from "mds";
import { actionsTray } from "../Common/FormComponents/common/styleLibrary";
@@ -531,9 +532,21 @@ const PolicyDetails = () => {
dispatch(setHelpName("policy_details_policy"))
}
>
<SectionTitle separator sx={{ marginBottom: 15 }}>
Raw Policy
</SectionTitle>
<HelpTip
content={
<Fragment>
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/identity-access-management/policy-based-access-control.html#policy-document-structure"
>
Guide to access policy structure
</a>
</Fragment>
}
placement="right"
>
<SectionTitle>Raw Policy</SectionTitle>
</HelpTip>
<form
noValidate
autoComplete="off"
@@ -551,6 +564,16 @@ const PolicyDetails = () => {
}
}}
editorHeight={"350px"}
helptip={
<Fragment>
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/identity-access-management/policy-based-access-control.html#policy-document-structure"
>
Guide to access policy structure
</a>
</Fragment>
}
/>
</Grid>
<Grid

25
portal-ui/src/screens/Console/Policies/PolicyView.tsx
View File

@@ -15,7 +15,7 @@
// along with this program. If not, see <http://www.gnu.org/licenses/>.
import React, { Fragment, useState } from "react";
import { DisabledIcon, EnabledIcon, Box, Grid } from "mds";
import { DisabledIcon, EnabledIcon, Box, Grid, HelpTip } from "mds";
import SearchBox from "../Common/SearchBox";
import { STATUS_COLORS } from "../Dashboard/BasicDashboard/Utils";
import { IAMStatement } from "./types";
@@ -53,9 +53,26 @@ const PolicyView = ({
<Grid container>
<Grid item xs={12}>
<Grid container sx={{ display: "flex", alignItems: "center" }}>
<Grid item xs={12} sm={6} sx={{ fontWeight: "bold" }}>
Statements
</Grid>
<HelpTip
content={
<Fragment>
Define which actions are permitted on a specified resource.
Learn more about{" "}
<a
target="blank"
href="https://docs.aws.amazon.com/IAM/latest/UserGuide/reference_policies_elements_condition.html"
>
IAM conditional statements
</a>
.
</Fragment>
}
placement="right"
>
<Grid item xs={12} sm={6} sx={{ fontWeight: "bold" }}>
Statements
</Grid>
</HelpTip>
<Grid
item
xs={12}

33
portal-ui/src/screens/Console/Users/AddUserServiceAccountScreen.tsx
View File

@@ -28,6 +28,7 @@ import {
ServiceAccountCredentialsIcon,
ServiceAccountIcon,
Switch,
HelpTip,
} from "mds";
import { modalStyleUtils } from "../Common/FormComponents/common/styleLibrary";
import { NewServiceAccount } from "../Common/CredentialsPrompt/types";
@@ -213,10 +214,24 @@ const AddServiceAccount = () => {
{isRestrictedByPolicy && (
<Grid item xs={12}>
<Box>
<PanelTitle>
Current User Policy - edit the JSON to remove permissions
for this Access Key
</PanelTitle>
<HelpTip
content={
<Fragment>
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/identity-access-management/policy-based-access-control.html#policy-document-structure"
>
Guide to access policy structure
</a>
</Fragment>
}
placement="right"
>
<PanelTitle>
Current User Policy - edit the JSON to remove
permissions for this Access Key
</PanelTitle>
</HelpTip>
</Box>
<Grid item xs={12} sx={{ ...modalStyleUtils.formScrollable }}>
<CodeMirrorWrapper
@@ -225,6 +240,16 @@ const AddServiceAccount = () => {
setPolicyJSON(value);
}}
editorHeight={"350px"}
helptip={
<Fragment>
<a
target="blank"
href="https://min.io/docs/minio/kubernetes/upstream/administration/identity-access-management/policy-based-access-control.html#policy-document-structure"
>
Guide to access policy structure
</a>
</Fragment>
}
/>
</Grid>
</Grid>