Show email or group name in place of ID in AttachModal

treeverse · Feb 12, 2024 · 1ad4c36 · 1ad4c36
1 parent 4760f11
commit 1ad4c36
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 11 deletions.
diff --git a/webui/src/lib/components/auth/forms.jsx b/webui/src/lib/components/auth/forms.jsx
@@ -9,8 +9,13 @@ import {SearchIcon} from "@primer/octicons-react";
 import {useAPI} from "../../hooks/api";
 import {Checkbox, DataTable, DebouncedFormControl, AlertError, Loading} from "../controls";
 
-const isEmptyString = (str) => (!str?.length);
-
+const resolveEntityDisplayName = (ent) => {
+    // for users
+    if (ent?.email?.length) return ent.email;
+    // for groups
+    if (ent?.name?.length) return ent.name;
+    return ent.id;
+}
 
 export const AttachModal = ({ show, searchFn, onAttach, onHide, addText = "Add",
                           emptyState = 'No matches', modalTitle = 'Add', headers = ['Select', 'ID'],
@@ -41,19 +46,19 @@ export const AttachModal = ({ show, searchFn, onAttach, onHide, addText = "Add",
                     rowFn={ent => [
                         <Checkbox
                             defaultChecked={selected.indexOf(ent.id) >= 0}
-                            onAdd={() => setSelected([...selected, ent.id])}
-                            onRemove={() => setSelected(selected.filter(id => id !== ent.id))}
+                            onAdd={() => setSelected([...selected, ent])}
+                            onRemove={() => setSelected(selected.filter(selectedEnt => selectedEnt.id !== ent.id))}
                             name={'selected'}/>,
-                        <strong>{!isEmptyString(ent.email) ? ent.email : ent.id}</strong>
+                        <strong>{resolveEntityDisplayName(ent)}</strong>
                     ]}/>
 
                 <div className="mt-3">
                     {(selected.length > 0) &&
                     <p>
                         <strong>Selected: </strong>
                         {(selected.map(item => (
-                            <Badge key={item} pill variant="primary" className="me-1">
-                                {item}
+                            <Badge key={item.id} pill variant="primary" className="me-1">
+                                {resolveEntityDisplayName(item)}
                             </Badge>
                         )))}
                     </p>

diff --git a/webui/src/pages/auth/groups/group/members.jsx b/webui/src/pages/auth/groups/group/members.jsx
@@ -77,7 +77,7 @@ const GroupMemberList = ({ groupId, after, onPaginate }) => {
                     searchFn={prefix => auth.listUsers(prefix, "", 5).then(res => res.results)}
                     onHide={() => setShowAddModal(false)}
                     onAttach={(selected) => {
-                        Promise.all(selected.map(userId => auth.addUserToGroup(userId, groupId)))
+                        Promise.all(selected.map(user => auth.addUserToGroup(user.id, groupId)))
                             .then(() => { setRefresh(!refresh); setAttachError(null) })
                             .catch(error => { setAttachError(error) })
                             .finally(() => { setShowAddModal(false) });

diff --git a/webui/src/pages/auth/groups/group/policies.jsx b/webui/src/pages/auth/groups/group/policies.jsx
@@ -77,7 +77,7 @@ const GroupPoliciesList = ({ groupId, after, onPaginate }) => {
                     searchFn={prefix => auth.listPolicies(prefix, "", 5).then(res => res.results)}
                     onHide={() => setShowAddModal(false)}
                     onAttach={(selected) => {
-                        Promise.all(selected.map(policyId => auth.attachPolicyToGroup(groupId, policyId)))
+                        Promise.all(selected.map(policy => auth.attachPolicyToGroup(groupId, policy.id)))
                             .then(() => { setRefresh(!refresh); setAttachError(null) })
                             .catch(error => { setAttachError(error) })
                             .finally(() => { setShowAddModal(false) })

diff --git a/webui/src/pages/auth/users/user/groups.jsx b/webui/src/pages/auth/users/user/groups.jsx
@@ -100,7 +100,7 @@ const UserGroupsList = ({ userId, after, onPaginate }) => {
             onHide={() => setShowAddModal(false)}
             onAttach={(selected) => {
               Promise.all(
-                selected.map((groupId) => auth.addUserToGroup(userId, groupId))
+                selected.map((group) => auth.addUserToGroup(userId, group.id))
               )
                 .then(() => {
                   setRefresh(!refresh);

diff --git a/webui/src/pages/auth/users/user/policies.jsx b/webui/src/pages/auth/users/user/policies.jsx
@@ -74,7 +74,7 @@ const UserPoliciesList = ({ userId, after, onPaginate }) => {
                     searchFn={prefix => auth.listPolicies(prefix, "", 5).then(res => res.results)}
                     onHide={() => setShowAddModal(false)}
                     onAttach={(selected) => {
-                        Promise.all(selected.map(policyId => auth.attachPolicyToUser(userId, policyId)))
+                        Promise.all(selected.map(policy => auth.attachPolicyToUser(userId, policy.id)))
                             .then(() => { setRefresh(!refresh); setAttachError(null) })
                             .catch(error => { setAttachError(error) })
                             .finally(() => { setShowAddModal(false) });