fix(frontend): correctly display the current user role in the edit dialog (#6758)

# Description of Changes

This PR fixes the role field in the People settings "Edit User" dialog
so the currently assigned role is displayed correctly.

- What was changed
- The edit dialog now uses the actual role identifier from the user data
when preselecting the role.
- The role selection is made more robust by falling back to a valid
default when the backend response does not provide a usable role value.
- The role label shown in the UI is derived consistently from the role
identifier.

- Why the change was made
- The dialog could open with an empty role field even though the user
already had a role assigned.
- This made role editing confusing and could lead to accidental changes.
- The fix keeps the People UI aligned with the backend role data model.

before:

<img width="438" height="465" alt="image"
src="https://github.com/user-attachments/assets/929d8c63-8ae9-436a-b895-e6a746f22458"
/>

after:

<img width="437" height="461" alt="image"
src="https://github.com/user-attachments/assets/942f6787-d678-4555-90a9-bf5c7c5c363d"
/>


---

## Checklist

### General

- [ ] I have read the [Contribution
Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md)
- [ ] I have read the [Stirling-PDF Developer
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/DeveloperGuide.md)
(if applicable)
- [ ] I have read the [How to add new languages to
Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md)
(if applicable)
- [ ] I have performed a self-review of my own code
- [ ] My changes generate no new warnings

### Documentation

- [ ] I have updated relevant docs on [Stirling-PDF's doc
repo](https://github.com/Stirling-Tools/Stirling-Tools.github.io/blob/main/docs/)
(if functionality has heavily changed)
- [ ] I have read the section [Add New Translation
Tags](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md#add-new-translation-tags)
(for new translation tags only)

### Translations (if applicable)

- [ ] I ran
[`scripts/counter_translation.py`](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/docs/counter_translation.md)

### UI Changes (if applicable)

- [ ] Screenshots or videos demonstrating the UI changes are attached
(e.g., as comments or direct attachments in the PR)

### Testing (if applicable)

- [ ] I have run `task check` to verify linters, typechecks, and tests
pass
- [ ] I have tested my changes locally. Refer to the [Testing
Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/DeveloperGuide.md#7-testing)
for more details.

frontend/editor/public/locales/en-US/translation.toml

@@ -8604,6 +8604,7 @@ disableByAdmin = "Disable MFA"
 
 [workspace.people.roleDescriptions]
 admin = "Can manage settings and invite users, with full administrative access."
+currentRole = "Current assigned role."
 user = "Can view and edit shared files, but cannot manage workspace settings or users."
 
 [workspace.people.toggleEnabled]

frontend/editor/src/proprietary/components/shared/config/configSections/PeopleSection.tsx

@@ -94,6 +94,21 @@ export default function PeopleSection() {
 
   const isCurrentUser = (user: User) => currentUser?.username === user.username;
   const isLockedUser = (user: User) => lockedUsers.includes(user.username);
+  const getUserRoleId = (user: User) =>
+    user.rolesAsString ||
+    (user.roleName?.startsWith("ROLE_") ? user.roleName : undefined) ||
+    "ROLE_USER";
+
+  const getRoleLabel = (roleId: string) => {
+    switch (roleId) {
+      case "ROLE_ADMIN":
+        return t("workspace.people.admin", "Admin");
+      case "ROLE_USER":
+        return t("workspace.people.user", "User");
+      default:
+        return roleId;
+    }
+  };
 
   // Form state for edit user modal
   const [editForm, setEditForm] = useState({
@@ -353,7 +368,7 @@ export default function PeopleSection() {
   const openEditModal = (user: User) => {
     setSelectedUser(user);
     setEditForm({
-      role: user.roleName,
+      role: getUserRoleId(user),
       teamId: user.team?.id,
     });
     setEditUserModalOpened(true);
@@ -385,7 +400,7 @@ export default function PeopleSection() {
   const roleOptions = [
     {
       value: "ROLE_ADMIN",
-      label: t("workspace.people.admin"),
+      label: getRoleLabel("ROLE_ADMIN"),
       description: t(
         "workspace.people.roleDescriptions.admin",
         "Can manage settings and invite members, with full administrative access.",
@@ -394,7 +409,7 @@ export default function PeopleSection() {
     },
     {
       value: "ROLE_USER",
-      label: t("workspace.people.user"),
+      label: getRoleLabel("ROLE_USER"),
       description: t(
         "workspace.people.roleDescriptions.user",
         "Can view and edit shared files, but cannot manage workspace settings or members.",
@@ -474,7 +489,9 @@ export default function PeopleSection() {
             </Text>
             <Text component="span" c="dimmed">
               {" "}
-              {t("workspace.people.license.users", "users")}
+              {t("workspace.people.license.users", "users", {
+                count: licenseInfo.totalUsers,
+              })}
             </Text>
           </Text>
 
@@ -704,18 +721,18 @@ export default function PeopleSection() {
                     size="sm"
                     variant="light"
                     color={
-                      (user.rolesAsString || "").includes("ROLE_ADMIN")
+                      getUserRoleId(user) === "ROLE_ADMIN"
                         ? "blue"
-                        : "cyan"
+                        : getUserRoleId(user) === "ROLE_PRO_USER"
+                          ? "grape"
+                          : "cyan"
                     }
                     styles={{
                       root: { maxWidth: "none" },
                       label: { overflow: "visible" },
                     }}
                   >
-                    {(user.rolesAsString || "").includes("ROLE_ADMIN")
-                      ? t("workspace.people.admin", "Admin")
-                      : t("workspace.people.user", "User")}
+                    {getRoleLabel(getUserRoleId(user))}
                   </Badge>
                 </Table.Td>
                 <Table.Td>
@@ -1009,7 +1026,25 @@ export default function PeopleSection() {
             </Stack>
             <Select
               label={t("workspace.people.editMember.role")}
-              data={roleOptions}
+              data={
+                selectedUser &&
+                !roleOptions.some(
+                  (option) => option.value === getUserRoleId(selectedUser),
+                )
+                  ? [
+                      ...roleOptions,
+                      {
+                        value: getUserRoleId(selectedUser),
+                        label: getRoleLabel(getUserRoleId(selectedUser)),
+                        description: t(
+                          "workspace.people.roleDescriptions.currentRole",
+                          "Current assigned role.",
+                        ),
+                        icon: "person",
+                      },
+                    ]
+                  : roleOptions
+              }
               value={editForm.role}
               onChange={(value) =>
                 setEditForm({ ...editForm, role: value || "ROLE_USER" })