Skip to content

Commit 5d19552

Browse files
author
Benjamin Perez
committed
Migrated Buckets Pages to mds
Migrated the Buckets page to the available mds compnents Signed-off-by: Benjamin Perez <benjamin@bexsoft.net>
1 parent 6e8f5e0 commit 5d19552

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

59 files changed

+2133
-3071
lines changed

‎portal-ui/e2e/lifecycle.spec.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ test.describe("Add Lifecycle Rule Modal in bucket settings tests for object vers
6464
await createBucketPage.createVersionedBucket(versionedBucketName);
6565
await bucketListPage.clickOnBucketRow(versionedBucketName);
6666
bucketSummaryPage = bucketSummaryPage(versionedBucketName);
67-
await bucketSummaryPage.clickOnTab("Lifecycle"); //Tab Text is used.
67+
await bucketSummaryPage.clickOnTab("lifecycle"); //Tab Text is used.
6868
});
6969

7070
await test.step("Check if object version option is available on a versioned bucket", async () => {
@@ -93,7 +93,7 @@ test.describe("Add Lifecycle Rule Modal in bucket settings tests for object vers
9393
await createBucketPage.createBucket(nonVersionedBucketName);
9494
await bucketListPage.clickOnBucketRow(nonVersionedBucketName);
9595
bucketSummaryPage = bucketSummaryPage(versionedBucketName);
96-
await bucketSummaryPage.clickOnTab("Lifecycle");
96+
await bucketSummaryPage.clickOnTab("lifecycle");
9797
});
9898

9999
await test.step("Check if object version option is NOT available on a non versioned bucket", async () => {

‎portal-ui/e2e/pom/BucketSummaryPage.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,8 @@ export class BucketSummaryPage {
2727
await this.clickOnTab(`Summary`);
2828
}
2929

30-
async clickOnTab(tabName: string) {
31-
const page = this.page;
32-
await page.getByRole("tab", { name: tabName }).click();
30+
async clickOnTab(tabID: string) {
31+
await this.getLocator(`#${tabID}`).click();
3332

3433
// await page.goto(`${BUCKET_LIST_PAGE}/${this.bucketName}/admin/${tabName}`);
3534
}
@@ -41,6 +40,6 @@ export class BucketSummaryPage {
4140

4241
async getObjectVersionOption() {
4342
await this.page.getByRole("button", { name: "Add Lifecycle Rule" }).click();
44-
return this.getLocator("#object_version");
43+
return this.getLocator("#object_version-select > div").nth(0);
4544
}
4645
}

‎portal-ui/e2e/pom/CreateBucketPage.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -32,9 +32,9 @@ export class CreateBucketPage {
3232
initLocators() {
3333
this.submitBtn = this.getLocator("#create-bucket");
3434
this.clearBtn = this.getLocator("#clear");
35-
this.versioningToggle = this.getLocator("#versioned");
36-
this.lockingToggle = this.getLocator("#locking");
37-
this.quotaToggle = this.getLocator("#bucket_quota");
35+
this.versioningToggle = this.getLocator("#versioned-switch");
36+
this.lockingToggle = this.getLocator("#locking-switch");
37+
this.quotaToggle = this.getLocator("#bucket_quota-switch");
3838
this.bucketNamingRules = this.getLocator("#toggle-naming-rules");
3939
this.bucketNameInput = this.getLocator("#bucket-name");
4040
}

‎portal-ui/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
"local-storage-fallback": "^4.1.1",
1919
"lodash": "^4.17.21",
2020
"luxon": "^3.3.0",
21-
"mds": "https://github.com/minio/mds.git#v0.7.0",
21+
"mds": "https://github.com/minio/mds.git#v0.8.2",
2222
"react": "^18.1.0",
2323
"react-component-export-image": "^1.0.6",
2424
"react-copy-to-clipboard": "^5.0.2",

‎portal-ui/src/common/types.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -97,3 +97,8 @@ export interface IEmbeddedCustomStyles {
9797
inputBox: IEmbeddedInputBox;
9898
switch: IEmbeddedSwitch;
9999
}
100+
101+
export interface SelectorTypes {
102+
label: any;
103+
value: string;
104+
}

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

Lines changed: 58 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -17,18 +17,14 @@
1717
import React, { Fragment, useEffect, useState } from "react";
1818
import { useSelector } from "react-redux";
1919
import { useNavigate, useParams } from "react-router-dom";
20-
import { Paper } from "@mui/material";
21-
import Tabs from "@mui/material/Tabs";
22-
import Tab from "@mui/material/Tab";
23-
24-
import { TabPanel } from "../../../shared/tabs";
25-
import TableWrapper from "../../Common/TableWrapper/TableWrapper";
20+
import { DataTable, SectionTitle, Tabs } from "mds";
21+
import { api } from "api";
22+
import { errorToHandler } from "api/errors";
2623
import {
2724
CONSOLE_UI_RESOURCE,
2825
IAM_PAGES,
2926
IAM_SCOPES,
3027
} from "../../../../common/SecureComponent/permissions";
31-
import PanelTitle from "../../Common/PanelTitle/PanelTitle";
3228
import {
3329
hasPermission,
3430
SecureComponent,
@@ -38,15 +34,6 @@ import { setErrorSnackMessage, setHelpName } from "../../../../systemSlice";
3834
import { selBucketDetailsLoading } from "./bucketDetailsSlice";
3935
import { useAppDispatch } from "../../../../store";
4036
import { Policy, ServiceAccounts } from "../../../../api/consoleApi";
41-
import { api } from "api";
42-
import { errorToHandler } from "api/errors";
43-
44-
function a11yProps(index: any) {
45-
return {
46-
id: `simple-tab-${index}`,
47-
"aria-controls": `simple-tabpanel-${index}`,
48-
};
49-
}
5037

5138
const AccessDetails = () => {
5239
const dispatch = useAppDispatch();
@@ -55,7 +42,7 @@ const AccessDetails = () => {
5542

5643
const loadingBucket = useSelector(selBucketDetailsLoading);
5744

58-
const [curTab, setCurTab] = useState<number>(0);
45+
const [curTab, setCurTab] = useState<string>("simple-tab-0");
5946
const [loadingPolicies, setLoadingPolicies] = useState<boolean>(true);
6047
const [bucketPolicy, setBucketPolicy] = useState<Policy[] | undefined>([]);
6148
const [loadingUsers, setLoadingUsers] = useState<boolean>(true);
@@ -158,65 +145,63 @@ const AccessDetails = () => {
158145

159146
return (
160147
<Fragment>
161-
<PanelTitle>Access Audit</PanelTitle>
148+
<SectionTitle separator>Access Audit</SectionTitle>
162149
<Tabs
163-
value={curTab}
164-
onChange={(e: React.ChangeEvent<{}>, newValue: number) => {
150+
currentTabOrPath={curTab}
151+
onTabClick={(newValue: string) => {
165152
setCurTab(newValue);
166153
}}
167-
indicatorColor="primary"
168-
textColor="primary"
169-
aria-label="cluster-tabs"
170-
variant="scrollable"
171-
scrollButtons="auto"
172-
>
173-
{displayPoliciesList && <Tab label="Policies" {...a11yProps(0)} />}
174-
{displayUsersList && <Tab label="Users" {...a11yProps(1)} />}
175-
</Tabs>
176-
<Paper>
177-
<TabPanel index={0} value={curTab}>
178-
<SecureComponent
179-
scopes={[IAM_SCOPES.ADMIN_LIST_USER_POLICIES]}
180-
resource={bucketName}
181-
errorProps={{ disabled: true }}
182-
>
183-
{bucketPolicy && (
184-
<TableWrapper
185-
noBackground={true}
186-
itemActions={PolicyActions}
187-
columns={[{ label: "Name", elementKey: "name" }]}
188-
isLoading={loadingPolicies}
189-
records={bucketPolicy}
190-
entityName="Policies"
191-
idField="name"
192-
/>
193-
)}
194-
</SecureComponent>
195-
</TabPanel>
196-
197-
<TabPanel index={1} value={curTab}>
198-
<SecureComponent
199-
scopes={[
200-
IAM_SCOPES.ADMIN_GET_POLICY,
201-
IAM_SCOPES.ADMIN_LIST_USERS,
202-
IAM_SCOPES.ADMIN_LIST_GROUPS,
203-
]}
204-
resource={bucketName}
205-
matchAll
206-
errorProps={{ disabled: true }}
207-
>
208-
<TableWrapper
209-
noBackground={true}
210-
itemActions={userTableActions}
211-
columns={[{ label: "User", elementKey: "accessKey" }]}
212-
isLoading={loadingUsers}
213-
records={bucketUsers}
214-
entityName="Users"
215-
idField="accessKey"
216-
/>
217-
</SecureComponent>
218-
</TabPanel>
219-
</Paper>
154+
horizontal
155+
options={[
156+
{
157+
tabConfig: { label: "Policies", id: "simple-tab-0" },
158+
content: (
159+
<SecureComponent
160+
scopes={[IAM_SCOPES.ADMIN_LIST_USER_POLICIES]}
161+
resource={bucketName}
162+
errorProps={{ disabled: true }}
163+
>
164+
{bucketPolicy && (
165+
<DataTable
166+
noBackground={true}
167+
itemActions={PolicyActions}
168+
columns={[{ label: "Name", elementKey: "name" }]}
169+
isLoading={loadingPolicies}
170+
records={bucketPolicy}
171+
entityName="Policies"
172+
idField="name"
173+
/>
174+
)}
175+
</SecureComponent>
176+
),
177+
},
178+
{
179+
tabConfig: { label: "Users", id: "simple-tab-1" },
180+
content: (
181+
<SecureComponent
182+
scopes={[
183+
IAM_SCOPES.ADMIN_GET_POLICY,
184+
IAM_SCOPES.ADMIN_LIST_USERS,
185+
IAM_SCOPES.ADMIN_LIST_GROUPS,
186+
]}
187+
resource={bucketName}
188+
matchAll
189+
errorProps={{ disabled: true }}
190+
>
191+
<DataTable
192+
noBackground={true}
193+
itemActions={userTableActions}
194+
columns={[{ label: "User", elementKey: "accessKey" }]}
195+
isLoading={loadingUsers}
196+
records={bucketUsers}
197+
entityName="Users"
198+
idField="accessKey"
199+
/>
200+
</SecureComponent>
201+
),
202+
},
203+
]}
204+
/>
220205
</Fragment>
221206
);
222207
};

0 commit comments

Comments
 (0)