diff --git a/apps/admin-ui/src/groups/components/GroupTree.tsx b/apps/admin-ui/src/groups/components/GroupTree.tsx index 772c2b484c..5209074ddf 100644 --- a/apps/admin-ui/src/groups/components/GroupTree.tsx +++ b/apps/admin-ui/src/groups/components/GroupTree.tsx @@ -9,6 +9,7 @@ import { DropdownSeparator, InputGroup, KebabToggle, + Tooltip, TreeView, TreeViewDataItem, } from "@patternfly/react-core"; @@ -26,6 +27,8 @@ import { fetchAdminUI } from "../../context/auth/admin-ui-endpoint"; import { useRealm } from "../../context/realm-context/RealmContext"; import { joinPath } from "../../utils/joinPath"; +import "./group-tree.css"; + type GroupTreeContextMenuProps = { group: GroupRepresentation; refresh: () => void; @@ -128,13 +131,14 @@ export const GroupTree = ({ refresh: viewRefresh }: GroupTreeProps) => { return { id: group.id, name: ( - g.id!))}`} - onClick={() => setSubGroups(groups)} - > - {group.name} - + + g.id!))}`} + onClick={() => setSubGroups(groups)} + > + {group.name} + + ), children: group.subGroups && group.subGroups.length > 0 @@ -191,7 +195,12 @@ export const GroupTree = ({ refresh: viewRefresh }: GroupTreeProps) => { } > {data.length > 0 && ( - 0} hasGuides /> + 0} + hasGuides + className="keycloak_groups_treeview" + /> )} ) : ( diff --git a/apps/admin-ui/src/groups/components/group-tree.css b/apps/admin-ui/src/groups/components/group-tree.css new file mode 100644 index 0000000000..ed22a53e02 --- /dev/null +++ b/apps/admin-ui/src/groups/components/group-tree.css @@ -0,0 +1,6 @@ +.keycloak_groups_treeview .pf-c-tree-view__node { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + display: block; +} \ No newline at end of file