Skip to content

Commit b9ddadf

Browse files
prakashsvmxprakashsvmx
authored
UX Bucket summary (#1355)
1 parent eae9f46 commit b9ddadf

21 files changed

+1445
-643
lines changed

‎portal-ui/src/icons/DisabledIcon.tsx

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
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+
17+
import React, { SVGProps } from "react";
18+
19+
const DisabledIcon = (props: SVGProps<SVGSVGElement>) => {
20+
return (
21+
<svg
22+
xmlns="http://www.w3.org/2000/svg"
23+
className={`min-icon`}
24+
fill={"currentcolor"}
25+
viewBox="0 0 16 16"
26+
{...props}
27+
>
28+
<defs>
29+
<clipPath id="disabled-clip-path">
30+
<rect
31+
id="Rectángulo_1068"
32+
data-name="Rectángulo 1068"
33+
width="16"
34+
height="16"
35+
fill="none"
36+
/>
37+
</clipPath>
38+
</defs>
39+
<rect
40+
id="Rectángulo_1065"
41+
data-name="Rectángulo 1065"
42+
width="16"
43+
height="16"
44+
fill="none"
45+
/>
46+
<g id="Grupo_2455" data-name="Grupo 2455">
47+
<g
48+
id="Grupo_2454"
49+
data-name="Grupo 2454"
50+
clipPath="url(#disabled-clip-path)"
51+
>
52+
<path
53+
id="Trazado_7232"
54+
data-name="Trazado 7232"
55+
d="M8,0a8,8,0,1,0,8,8A8,8,0,0,0,8,0m3.235,5.4L8.965,8.174,10.949,10.6a.857.857,0,0,1-1.327,1.086h0L7.857,9.528,6.092,11.686A.857.857,0,0,1,4.765,10.6L6.749,8.174,4.479,5.4A.857.857,0,0,1,5.806,4.314L7.857,6.821l2.05-2.506A.857.857,0,1,1,11.235,5.4"
56+
fill="#969fa8"
57+
/>
58+
</g>
59+
</g>
60+
</svg>
61+
);
62+
};
63+
64+
export default DisabledIcon;

‎portal-ui/src/icons/EnabledIcon.tsx

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
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+
17+
import React, { SVGProps } from "react";
18+
19+
const EnabledIcon = (props: SVGProps<SVGSVGElement>) => {
20+
return (
21+
<svg
22+
xmlns="http://www.w3.org/2000/svg"
23+
className={`min-icon`}
24+
fill={"currentcolor"}
25+
viewBox="0 0 16 16"
26+
{...props}
27+
>
28+
<defs>
29+
<clipPath id="enabled-clip-path">
30+
<rect
31+
id="Rectángulo_1067"
32+
data-name="Rectángulo 1067"
33+
width="16"
34+
height="16"
35+
fill="none"
36+
/>
37+
</clipPath>
38+
</defs>
39+
<rect
40+
id="Rectángulo_1066"
41+
data-name="Rectángulo 1066"
42+
width="16"
43+
height="16"
44+
fill="none"
45+
/>
46+
<g id="Grupo_2453" data-name="Grupo 2453">
47+
<g
48+
id="Grupo_2452"
49+
data-name="Grupo 2452"
50+
clipPath="url(#enabled-clip-path)"
51+
>
52+
<path
53+
id="Trazado_7231"
54+
data-name="Trazado 7231"
55+
d="M8,0a8,8,0,1,0,8,8A8,8,0,0,0,8,0m4.575,5.769-.005.005L7.837,11.69a.89.89,0,0,1-.635.284H7.185a.889.889,0,0,1-.628-.26h0L3.421,8.577a.889.889,0,1,1,1.2-1.31q.028.025.053.053L7.16,9.8l4.117-5.246.024-.026h0a.889.889,0,0,1,1.275,1.24"
56+
fill="#969fa8"
57+
/>
58+
</g>
59+
</g>
60+
</svg>
61+
);
62+
};
63+
64+
export default EnabledIcon;

‎portal-ui/src/icons/HardBucketQuotaIcon.tsx

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
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+
17+
import React, { SVGProps } from "react";
18+
19+
const HardBucketQuotaIcon = (props: SVGProps<SVGSVGElement>) => {
20+
return (
21+
<svg
22+
xmlns="http://www.w3.org/2000/svg"
23+
className={`min-icon`}
24+
fill={"currentcolor"}
25+
viewBox="0 0 36.369 36.346"
26+
{...props}
27+
>
28+
<g id="hardquota-icn" transform="translate(-98.002 -28.027)">
29+
<path
30+
id="Trazado_7233"
31+
data-name="Trazado 7233"
32+
d="M344.76,203.93l2.664-2.664,8.15,8.15-2.664,2.664Z"
33+
transform="translate(-228.962 -160.744)"
34+
fill="#07193e"
35+
/>
36+
<path
37+
id="Trazado_7234"
38+
data-name="Trazado 7234"
39+
d="M464.768,316.895a1.11,1.11,0,0,0-1.575,0l-2.827,2.827h0a1.111,1.111,0,0,0,0,1.575l5.182,5.182a1.114,1.114,0,0,0,.787.327,1.1,1.1,0,0,0,.808-.327l2.827-2.827a1.11,1.11,0,0,0,0-1.575Z"
40+
transform="translate(-335.926 -267.73)"
41+
fill="#07193e"
42+
/>
43+
<path
44+
id="Trazado_7235"
45+
data-name="Trazado 7235"
46+
d="M235.486,84.317l-5.408-5.408a2.141,2.141,0,0,1-.157-.174L222.2,86.45c.061.052.121.105.178.161l5.4,5.4c.057.057.109.117.161.178l7.718-7.718a2.2,2.2,0,0,1-.178-.157Z"
47+
transform="translate(-115.243 -47.051)"
48+
fill="#07193e"
49+
/>
50+
<path
51+
id="Trazado_7236"
52+
data-name="Trazado 7236"
53+
d="M337.566,36.693a1.912,1.912,0,0,0,2.706-2.7l-5.408-5.4a1.91,1.91,0,1,0-2.7,2.7Z"
54+
transform="translate(-216.754)"
55+
fill="#07193e"
56+
/>
57+
<path
58+
id="Trazado_7237"
59+
data-name="Trazado 7237"
60+
d="M174.741,188.807a1.912,1.912,0,1,0-2.7,2.706l5.408,5.392a1.911,1.911,0,1,0,2.7-2.7Z"
61+
transform="translate(-68.177 -148.665)"
62+
fill="#07193e"
63+
/>
64+
<path
65+
id="Trazado_7238"
66+
data-name="Trazado 7238"
67+
d="M143.562,432.083a3.239,3.239,0,0,1,.525.048v-.565a2.383,2.383,0,0,0-2.379-2.383h-15.63a2.383,2.383,0,0,0-2.379,2.383v.565a3.245,3.245,0,0,1,.525-.048Z"
68+
transform="translate(-23.844 -372.224)"
69+
fill="#07193e"
70+
/>
71+
<path
72+
id="Trazado_7239"
73+
data-name="Trazado 7239"
74+
d="M122.1,482.968a2.379,2.379,0,0,0-2.379-2.379H100.381A2.379,2.379,0,0,0,98,482.968V484.3h24.1Z"
75+
transform="translate(0 -419.924)"
76+
fill="#07193e"
77+
/>
78+
</g>
79+
</svg>
80+
);
81+
};
82+
83+
export default HardBucketQuotaIcon;

‎portal-ui/src/icons/ReportedUsageFullIcon.tsx

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
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+
17+
import React, { SVGProps } from "react";
18+
19+
const ReportedUsageFullIcon = (props: SVGProps<SVGSVGElement>) => {
20+
return (
21+
<svg
22+
xmlns="http://www.w3.org/2000/svg"
23+
className={`min-icon`}
24+
fill={"currentcolor"}
25+
viewBox="0 0 37.001 37"
26+
{...props}
27+
>
28+
<defs>
29+
<clipPath id="rep-quota-clip-path">
30+
<rect
31+
id="Rectángulo_959"
32+
data-name="Rectángulo 959"
33+
width="37"
34+
height="37"
35+
transform="translate(0 0)"
36+
fill="#07193e"
37+
/>
38+
</clipPath>
39+
</defs>
40+
<g id="reported-usage-icn-full" transform="translate(-0.213 -0.213)">
41+
<rect
42+
id="Rectángulo_869"
43+
data-name="Rectángulo 869"
44+
width="37"
45+
height="37"
46+
transform="translate(0.213 0.213)"
47+
fill="none"
48+
/>
49+
<g
50+
id="Grupo_2317"
51+
data-name="Grupo 2317"
52+
transform="translate(0.213 0.213)"
53+
>
54+
<g
55+
id="Grupo_2316"
56+
data-name="Grupo 2316"
57+
transform="translate(0 0)"
58+
clipPath="url(#rep-quota-clip-path)"
59+
>
60+
<path
61+
id="Trazado_7046"
62+
data-name="Trazado 7046"
63+
d="M18.5,0A18.5,18.5,0,1,0,37,18.5,18.5,18.5,0,0,0,18.5,0m0,18.5V4.756A13.757,13.757,0,0,1,32.238,18.5H18.5Z"
64+
transform="translate(0.074 0.074)"
65+
fill="#07193e"
66+
/>
67+
</g>
68+
</g>
69+
</g>
70+
</svg>
71+
);
72+
};
73+
74+
export default ReportedUsageFullIcon;

‎portal-ui/src/icons/index.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -142,3 +142,7 @@ export { default as BucketReplicationIcon } from "./BucketReplicationIcon";
142142
export { default as EventSubscriptionIcon } from "./EventSubscriptionIcon";
143143
export { default as ConfirmModalIcon } from "./ConfirmModalIcon";
144144
export { default as ConfirmDeleteIcon } from "./ConfirmDeleteIcon";
145+
export { default as EnabledIcon } from "./EnabledIcon";
146+
export { default as DisabledIcon } from "./DisabledIcon";
147+
export { default as HardBucketQuotaIcon } from "./HardBucketQuotaIcon";
148+
export { default as ReportedUsageFullIcon } from "./ReportedUsageFullIcon";

‎portal-ui/src/screens/Console/Buckets/BucketDetails/AccessDetailsPanel.tsx

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,10 @@ import PanelTitle from "../../Common/PanelTitle/PanelTitle";
3838
import SecureComponent, {
3939
hasPermission,
4040
} from "../../../../common/SecureComponent/SecureComponent";
41+
import { Theme } from "@mui/material/styles";
42+
import createStyles from "@mui/styles/createStyles";
43+
import { tableStyles } from "../../Common/FormComponents/common/styleLibrary";
44+
import withStyles from "@mui/styles/withStyles";
4145

4246
const mapState = (state: AppState) => ({
4347
session: state.console.session,
@@ -63,10 +67,15 @@ interface IAccessDetailsProps {
6367
bucketInfo: BucketInfo | null;
6468
}
6569

70+
const styles = (theme: Theme) =>
71+
createStyles({
72+
...tableStyles,
73+
});
6674
const AccessDetails = ({
6775
match,
6876
setErrorSnackMessage,
6977
loadingBucket,
78+
classes,
7079
}: IAccessDetailsProps) => {
7180
const [curTab, setCurTab] = useState<number>(0);
7281
const [loadingPolicies, setLoadingPolicies] = useState<boolean>(true);
@@ -181,7 +190,7 @@ const AccessDetails = ({
181190
{displayPoliciesList && <Tab label="Policies" {...a11yProps(0)} />}
182191
{displayUsersList && <Tab label="Users" {...a11yProps(1)} />}
183192
</Tabs>
184-
<Paper>
193+
<Paper className={classes.tableBlock}>
185194
<TabPanel index={0} value={curTab}>
186195
<SecureComponent
187196
scopes={[IAM_SCOPES.ADMIN_LIST_USER_POLICIES]}
@@ -227,4 +236,4 @@ const AccessDetails = ({
227236
);
228237
};
229238

230-
export default connector(AccessDetails);
239+
export default withStyles(styles)(connector(AccessDetails));

‎portal-ui/src/screens/Console/Buckets/BucketDetails/AccessRulePanel.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ import {
3434
containerForHeader,
3535
objectBrowserCommon,
3636
searchField,
37+
tableStyles,
3738
} from "../../Common/FormComponents/common/styleLibrary";
3839
import { BucketInfo } from "../types";
3940
import { IAM_SCOPES } from "../../../../common/SecureComponent/permissions";
@@ -68,6 +69,7 @@ const styles = (theme: Theme) =>
6869
marginLeft: "10px",
6970
align: "right",
7071
},
72+
...tableStyles,
7173
...actionsTray,
7274
...searchField,
7375
...objectBrowserCommon,
@@ -238,7 +240,7 @@ const AccessRule = ({
238240
</Button>
239241
</SecureComponent>
240242
</Grid>
241-
<Paper>
243+
<Paper className={classes.tableBlock}>
242244
<SecureComponent
243245
scopes={[IAM_SCOPES.S3_GET_BUCKET_POLICY]}
244246
resource={bucketName}

0 commit comments

Comments
 (0)