fixes navigation when searching for groups (#26053)

fixes: #25927

Signed-off-by: Erik Jan de Wit <erikjan.dewit@gmail.com>
This commit is contained in:
Erik Jan de Wit 2024-01-16 10:59:52 +01:00 committed by GitHub
parent bd62c73b18
commit 12ae800217
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 53 additions and 52 deletions

View file

@ -138,8 +138,7 @@ export const GroupTree = ({
const { hasAccess } = useAccess();
const [data, setData] = useState<TreeViewDataItem[]>();
const [groups, setGroups] = useState<GroupRepresentation[]>([]);
const { subGroups, setSubGroups } = useSubGroups();
const { subGroups, clear } = useSubGroups();
const [search, setSearch] = useState("");
const [max, setMax] = useState(20);
@ -207,9 +206,8 @@ export const GroupTree = ({
return { groups, subGroups };
},
({ groups, subGroups }) => {
const found: TreeViewDataItem[] = [];
if (activeItem) findGroup(data || [], activeItem.id!, [], found);
if (activeItem) {
const found = findGroup(data || [], activeItem.id!, []);
if (found.length && subGroups.length) {
const foundTreeItem = found.pop()!;
foundTreeItem.children = [
@ -232,7 +230,7 @@ export const GroupTree = ({
: []),
];
}
setGroups(groups);
}
if (search || prefFirst.current !== first || prefMax.current !== max) {
setData(groups.map((g) => mapGroup(g, refresh)));
} else {
@ -252,26 +250,26 @@ export const GroupTree = ({
);
const findGroup = (
groups: GroupRepresentation[] | TreeViewDataItem[],
groups: TreeViewDataItem[],
id: string,
path: (GroupRepresentation | TreeViewDataItem)[],
found: (GroupRepresentation | TreeViewDataItem)[],
path: TreeViewDataItem[],
) => {
return groups.map((group) => {
if (found.length > 0) return;
if ("subGroups" in group && group.subGroups?.length) {
findGroup(group.subGroups, id, [...path, group], found);
}
if ("children" in group && group.children) {
findGroup(group.children, id, [...path, group], found);
}
for (let index = 0; index < groups.length; index++) {
const group = groups[index];
if (group.id === id) {
found.push(...path, group);
path.push(group);
return path;
}
});
if (group.children) {
path.push(group);
findGroup(group.children, id, path);
if (path[path.length - 1].id !== id) {
path.pop();
}
}
}
return path;
};
return data ? (
@ -314,14 +312,18 @@ export const GroupTree = ({
onSelect={(_, item) => {
if (item.id === "next") return;
setActiveItem(item);
const id = item.id?.substring(item.id.lastIndexOf("/") + 1);
const subGroups: GroupRepresentation[] = [];
findGroup(groups, id!, [], subGroups);
setSubGroups(subGroups);
const path = findGroup(data, item.id!, []);
if (!subGroups.every(({ id }) => path.find((t) => t.id === id)))
clear();
if (canViewDetails || subGroups.at(-1)?.access?.view) {
navigate(toGroups({ realm, id: item.id }));
refresh();
navigate(
toGroups({
realm,
id: path.map((g) => g.id).join("/"),
}),
);
} else {
addAlert(t("noViewRights"), AlertVariant.warning);
navigate(toGroups({ realm }));

View file

@ -1,6 +1,5 @@
import { lazy } from "react";
import type { Path } from "react-router-dom";
import { generateEncodedPath } from "../../utils/generateEncodedPath";
import { generatePath, type Path } from "react-router-dom";
import type { AppRouteObject } from "../../routes";
export type GroupsParams = { realm: string; id?: string; lazy?: string };
@ -24,6 +23,6 @@ export const toGroups = (params: GroupsParams): Partial<Path> => {
const path = params.id ? GroupsWithIdRoute.path : GroupsRoute.path;
return {
pathname: generateEncodedPath(path, params),
pathname: generatePath(path, params),
};
};