Skip to content

Commit 67a0e5a

Browse files
sheensantoscapadngansheensantoscapadngan
committed
misc: addressed comments
1 parent 6ebc766 commit 67a0e5a

File tree

4 files changed

+101
-90
lines changed

4 files changed

+101
-90
lines changed

‎frontend/src/pages/organization/AccessManagementPage/components/UpgradePrivilegeSystemModal/UpgradePrivilegeSystemModal.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ export const UpgradePrivilegeSystemModal = ({ isOpen, onOpenChange }: Props) =>
6464

6565
return (
6666
<Modal isOpen={isOpen} onOpenChange={onOpenChange}>
67-
<ModalContent title="Privilege Management System Upgrade">
67+
<ModalContent title="Privilege Management System Upgrade" className="max-w-2xl">
6868
<div className="mb-4">
6969
<h4 className="mb-2 text-lg font-semibold">
7070
Introducing Permission-Based Privilege Management

‎frontend/src/pages/project/AccessControlPage/AccessControlPage.tsx

+56-63
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@ import { useTranslation } from "react-i18next";
33
import { useNavigate, useSearch } from "@tanstack/react-router";
44

55
import { PageHeader, Tab, TabList, TabPanel, Tabs } from "@app/components/v2";
6-
import { ProjectPermissionActions, ProjectPermissionSub, useWorkspace } from "@app/context";
7-
import { withProjectPermission } from "@app/hoc";
6+
import { useWorkspace } from "@app/context";
87
import { ProjectType } from "@app/hooks/api/workspace/types";
98
import { ProjectAccessControlTabs } from "@app/types/project";
109

@@ -16,73 +15,67 @@ import {
1615
ServiceTokenTab
1716
} from "./components";
1817

19-
const Page = withProjectPermission(
20-
() => {
21-
const navigate = useNavigate();
22-
const { currentWorkspace } = useWorkspace();
23-
const selectedTab = useSearch({
24-
strict: false,
25-
select: (el) => el.selectedTab
26-
});
18+
const Page = () => {
19+
const navigate = useNavigate();
20+
const { currentWorkspace } = useWorkspace();
21+
const selectedTab = useSearch({
22+
strict: false,
23+
select: (el) => el.selectedTab
24+
});
2725

28-
const updateSelectedTab = (tab: string) => {
29-
navigate({
30-
to: `/${currentWorkspace.type}/$projectId/access-management` as const,
31-
search: (prev) => ({ ...prev, selectedTab: tab }),
32-
params: {
33-
projectId: currentWorkspace.id
34-
}
35-
});
36-
};
26+
const updateSelectedTab = (tab: string) => {
27+
navigate({
28+
to: `/${currentWorkspace.type}/$projectId/access-management` as const,
29+
search: (prev) => ({ ...prev, selectedTab: tab }),
30+
params: {
31+
projectId: currentWorkspace.id
32+
}
33+
});
34+
};
3735

38-
return (
39-
<div className="container mx-auto flex flex-col justify-between bg-bunker-800 text-white">
40-
<div className="mx-auto mb-6 w-full max-w-7xl">
41-
<PageHeader
42-
title="Access Control"
43-
description="Manage fine-grained access for users, groups, roles, and identities within your project resources."
44-
/>
45-
<Tabs value={selectedTab} onValueChange={updateSelectedTab}>
46-
<TabList>
47-
<Tab value={ProjectAccessControlTabs.Member}>Users</Tab>
48-
<Tab value={ProjectAccessControlTabs.Groups}>Groups</Tab>
49-
<Tab value={ProjectAccessControlTabs.Identities}>
50-
<div className="flex items-center">
51-
<p>Machine Identities</p>
52-
</div>
53-
</Tab>
54-
{currentWorkspace?.type === ProjectType.SecretManager && (
55-
<Tab value={ProjectAccessControlTabs.ServiceTokens}>Service Tokens</Tab>
56-
)}
57-
<Tab value={ProjectAccessControlTabs.Roles}>Project Roles</Tab>
58-
</TabList>
59-
<TabPanel value={ProjectAccessControlTabs.Member}>
60-
<MembersTab />
61-
</TabPanel>
62-
<TabPanel value={ProjectAccessControlTabs.Groups}>
63-
<GroupsTab />
64-
</TabPanel>
65-
<TabPanel value={ProjectAccessControlTabs.Identities}>
66-
<IdentityTab />
67-
</TabPanel>
36+
return (
37+
<div className="container mx-auto flex flex-col justify-between bg-bunker-800 text-white">
38+
<div className="mx-auto mb-6 w-full max-w-7xl">
39+
<PageHeader
40+
title="Access Control"
41+
description="Manage fine-grained access for users, groups, roles, and identities within your project resources."
42+
/>
43+
<Tabs value={selectedTab} onValueChange={updateSelectedTab}>
44+
<TabList>
45+
<Tab value={ProjectAccessControlTabs.Member}>Users</Tab>
46+
<Tab value={ProjectAccessControlTabs.Groups}>Groups</Tab>
47+
<Tab value={ProjectAccessControlTabs.Identities}>
48+
<div className="flex items-center">
49+
<p>Machine Identities</p>
50+
</div>
51+
</Tab>
6852
{currentWorkspace?.type === ProjectType.SecretManager && (
69-
<TabPanel value={ProjectAccessControlTabs.ServiceTokens}>
70-
<ServiceTokenTab />
71-
</TabPanel>
53+
<Tab value={ProjectAccessControlTabs.ServiceTokens}>Service Tokens</Tab>
7254
)}
73-
<TabPanel value={ProjectAccessControlTabs.Roles}>
74-
<ProjectRoleListTab />
55+
<Tab value={ProjectAccessControlTabs.Roles}>Project Roles</Tab>
56+
</TabList>
57+
<TabPanel value={ProjectAccessControlTabs.Member}>
58+
<MembersTab />
59+
</TabPanel>
60+
<TabPanel value={ProjectAccessControlTabs.Groups}>
61+
<GroupsTab />
62+
</TabPanel>
63+
<TabPanel value={ProjectAccessControlTabs.Identities}>
64+
<IdentityTab />
65+
</TabPanel>
66+
{currentWorkspace?.type === ProjectType.SecretManager && (
67+
<TabPanel value={ProjectAccessControlTabs.ServiceTokens}>
68+
<ServiceTokenTab />
7569
</TabPanel>
76-
</Tabs>
77-
</div>
70+
)}
71+
<TabPanel value={ProjectAccessControlTabs.Roles}>
72+
<ProjectRoleListTab />
73+
</TabPanel>
74+
</Tabs>
7875
</div>
79-
);
80-
},
81-
{
82-
action: ProjectPermissionActions.Read,
83-
subject: ProjectPermissionSub.Member
84-
}
85-
);
76+
</div>
77+
);
78+
};
8679

8780
export const AccessControlPage = () => {
8881
const { t } = useTranslation();

‎frontend/src/pages/project/AccessControlPage/components/GroupsTab/GroupsTab.tsx

+22-13
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,26 @@
11
import { motion } from "framer-motion";
22

3+
import { ProjectPermissionActions, ProjectPermissionSub } from "@app/context";
4+
import { withProjectPermission } from "@app/hoc";
5+
36
import { GroupsSection } from "./components";
47

5-
export const GroupsTab = () => {
6-
return (
7-
<motion.div
8-
key="panel-groups"
9-
transition={{ duration: 0.15 }}
10-
initial={{ opacity: 0, translateX: 30 }}
11-
animate={{ opacity: 1, translateX: 0 }}
12-
exit={{ opacity: 0, translateX: 30 }}
13-
>
14-
<GroupsSection />
15-
</motion.div>
16-
);
17-
};
8+
export const GroupsTab = withProjectPermission(
9+
() => {
10+
return (
11+
<motion.div
12+
key="panel-groups"
13+
transition={{ duration: 0.15 }}
14+
initial={{ opacity: 0, translateX: 30 }}
15+
animate={{ opacity: 1, translateX: 0 }}
16+
exit={{ opacity: 0, translateX: 30 }}
17+
>
18+
<GroupsSection />
19+
</motion.div>
20+
);
21+
},
22+
{
23+
action: ProjectPermissionActions.Read,
24+
subject: ProjectPermissionSub.Groups
25+
}
26+
);

‎frontend/src/pages/project/AccessControlPage/components/MembersTab/MembersTab.tsx

+22-13
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,26 @@
11
import { motion } from "framer-motion";
22

3+
import { ProjectPermissionActions, ProjectPermissionSub } from "@app/context";
4+
import { withProjectPermission } from "@app/hoc";
5+
36
import { MembersSection } from "./components";
47

5-
export const MembersTab = () => {
6-
return (
7-
<motion.div
8-
key="panel-project-members"
9-
transition={{ duration: 0.15 }}
10-
initial={{ opacity: 0, translateX: 30 }}
11-
animate={{ opacity: 1, translateX: 0 }}
12-
exit={{ opacity: 0, translateX: 30 }}
13-
>
14-
<MembersSection />
15-
</motion.div>
16-
);
17-
};
8+
export const MembersTab = withProjectPermission(
9+
() => {
10+
return (
11+
<motion.div
12+
key="panel-project-members"
13+
transition={{ duration: 0.15 }}
14+
initial={{ opacity: 0, translateX: 30 }}
15+
animate={{ opacity: 1, translateX: 0 }}
16+
exit={{ opacity: 0, translateX: 30 }}
17+
>
18+
<MembersSection />
19+
</motion.div>
20+
);
21+
},
22+
{
23+
action: ProjectPermissionActions.Read,
24+
subject: ProjectPermissionSub.Member
25+
}
26+
);

0 commit comments

Comments
 (0)