Dokploy/dokploy
1
0
Fork 0
mirror of https://github.com/Dokploy/dokploy.git synced 2026-06-20 22:55:22 +02:00
Code Issues Packages Projects Releases Wiki Activity

refactor(users): improve role assignment UI and logic

Browse Source 
- Enhanced the role assignment component by conditionally rendering roles and disabling the owner role in the selection.
- Updated the display of role permissions and descriptions for better clarity and user experience.
- Changed the button label from "Assign Role" to "Save Role" to better reflect the action being performed.
This commit is contained in:
Mauricio Siu
2025-07-12 23:26:50 -06:00
parent 3052979bdd
commit b928e94e51
1 changed files with 58 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
apps/dokploy/components/dashboard/settings/users/add-permissions-v2.tsx
View File

@@ -142,7 +142,7 @@ export const AddUserPermissionsV2 = ({ userId }: Props) => {
const isFullAccessRole =
selectedRole &&
(selectedRole.name === "owner" || selectedRole.name === "admin"); // Owner permission indicator
(selectedRole.name === "owner" || selectedRole.name === "admin");
const onAssignRole = async (data: AssignRoleForm) => {
try {
@@ -266,49 +266,63 @@ export const AddUserPermissionsV2 = ({ userId }: Props) => {
<h4 className="text-sm font-medium">
Default Roles
</h4>
{defaultRoles?.roles?.map((role) => (
<FormItem
key={role.roleId}
className="flex items-center space-x-3 space-y-0"
>
<FormControl>
<RadioGroupItem value={role.roleId || ""} />
</FormControl>
<FormLabel className="font-normal">
<div className="flex items-center gap-2">
<span className="font-medium capitalize">
{role.name}
</span>
{role.name === "owner" && (
<Badge
variant="default"
className="text-xs"
>
Full Access
</Badge>
{defaultRoles?.roles?.map((role) => {
const isOwner = role.name === "owner";
const isAdmin = role.name === "admin";
if (isOwner) {
return null;
}
return (
<FormItem
key={role.roleId}
className="flex items-center space-x-3 space-y-0"
>
<FormControl>
<RadioGroupItem
value={role.roleId || ""}
disabled={isOwner}
/>
</FormControl>
<FormLabel className="font-normal">
<div className="flex items-center gap-2">
<span className="font-medium capitalize">
{role.name}
</span>
{isAdmin && (
<Badge
variant="default"
className="text-xs"
>
Full Access
</Badge>
)}
</div>
<div className="text-xs text-muted-foreground">
{role.description}
</div>
{!isOwner && (
<div className="flex flex-wrap gap-1 mt-1">
{role.permissions?.map(
(permission) => (
<Badge
key={permission.name}
variant={
isOwner
? "default"
: "secondary"
}
className="text-xs"
>
{permission.description}
</Badge>
),
)}
</div>
)}
</div>
<div className="text-xs text-muted-foreground">
{role.description}
</div>
<div className="flex flex-wrap gap-1 mt-1">
{role.permissions?.map((permission) => (
<Badge
key={permission.name}
variant={
role.name === "owner"
? "default"
: "secondary"
}
className="text-xs"
>
{permission.description}
</Badge>
))}
</div>
</FormLabel>
</FormItem>
))}
</FormLabel>
</FormItem>
);
})}
</div>
<Separator />
@@ -608,7 +622,7 @@ export const AddUserPermissionsV2 = ({ userId }: Props) => {
<DialogFooter>
<Button type="submit" disabled={isAssigningRole}>
{isAssigningRole ? "Assigning..." : "Assign Role"}
{isAssigningRole ? "Assigning..." : "Save Role"}
</Button>
</DialogFooter>
</form>