fixed group navigation (#452)

src/components/bread-crumb/GroupBreadCrumbs.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { Link, useHistory } from "react-router-dom";
+import { Link, useHistory, useLocation } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import { Breadcrumb, BreadcrumbItem } from "@patternfly/react-core";
 
@@ -12,6 +12,7 @@ export const GroupBreadCrumbs = () => {
   const { realm } = useRealm();
 
   const history = useHistory();
+  const location = useLocation();
 
   useEffect(() => {
     return history.listen(({ pathname }) => {

src/groups/GroupAttributes.tsx

@@ -14,6 +14,7 @@ import { useAdminClient } from "../context/auth/AdminClient";
 
 import { getLastId } from "./groupIdUtils";
 import { useSubGroups } from "./SubGroupsContext";
+import { useLocation } from "react-router-dom";
 
 export const GroupAttributes = () => {
   const { t } = useTranslation("groups");
@@ -25,6 +26,7 @@ export const GroupAttributes = () => {
     name: "attributes",
   });
 
+  const location = useLocation();
   const id = getLastId(location.pathname);
   const { currentGroup, subGroups, setSubGroups } = useSubGroups();
 

src/groups/GroupsSection.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import { useHistory } from "react-router-dom";
+import { useHistory, useLocation } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import { useErrorHandler } from "react-error-boundary";
 import {
@@ -37,6 +37,7 @@ export const GroupsSection = () => {
   const errorHandler = useErrorHandler();
 
   const history = useHistory();
+  const location = useLocation();
   const id = getLastId(location.pathname);
 
   const deleteGroup = async (group: GroupRepresentation) => {

src/groups/Members.tsx

@@ -1,4 +1,5 @@
 import React, { useEffect, useState } from "react";
+import { useLocation } from "react-router-dom";
 import { useTranslation } from "react-i18next";
 import _ from "lodash";
 import { Button, Checkbox, ToolbarItem } from "@patternfly/react-core";
@@ -19,6 +20,7 @@ type MembersOf = UserRepresentation & {
 export const Members = () => {
   const { t } = useTranslation("groups");
   const adminClient = useAdminClient();
+  const location = useLocation();
   const id = getLastId(location.pathname);
   const [includeSubGroup, setIncludeSubGroup] = useState(false);
   const { currentGroup, subGroups } = useSubGroups();