Provide route for Sudo rules

As the Active users > Is a member of' > 'Sudo rules'
section is now implemented, it needs its own route
to navigate to it.

Signed-off-by: Carla Martinez <[email protected]>

src/components/MemberOf/MemberOfSudoRules.tsx

@@ -21,14 +21,29 @@ import {
 import { API_VERSION_BACKUP, paginate } from "src/utils/utils";
 import { apiToSudoRule } from "src/utils/sudoRulesUtils";
 import { ErrorResult } from "src/services/rpc";
+// Navigation
+import { useNavigate, useParams } from "react-router-dom";
+import { URL_PREFIX } from "src/navigation/NavRoutes";
 
 interface MemberOfSudoRulesProps {
   user: Partial<User>;
+  from: string;
   isUserDataLoading: boolean;
   onRefreshUserData: () => void;
 }
 
 const MemberOfSudoRules = (props: MemberOfSudoRulesProps) => {
+  const navigate = useNavigate();
+  const { uid } = useParams();
+
+  React.useEffect(() => {
+    if (props.user && props.user.uid) {
+      navigate(
+        URL_PREFIX + "/" + props.from + "/" + uid + "/memberof_sudorule"
+      );
+    }
+  }, [props.user]);
+
   // Alerts to show in the UI
   const alerts = useAlerts();
 

src/navigation/AppRoutes.tsx

@@ -59,7 +59,7 @@ export const AppRoutes = (): React.ReactElement => (
             element={<ActiveUsersTabs memberof="hbacrule" />}
           />
           <Route
-            path="memberof_rule"
+            path="memberof_sudorule"
             element={<ActiveUsersTabs memberof="sudorule" />}
           />
         </Route>

src/pages/ActiveUsers/UserMemberOf.tsx

@@ -205,6 +205,7 @@ const UserMemberOf = (props: PropsToUserMemberOf) => {
           >
             <MemberOfSudoRules
               user={user}
+              from={props.from}
               isUserDataLoading={userQuery.isFetching}
               onRefreshUserData={onRefreshUserData}
             />