fix: [UIE-8350] - IAM RBAC: Fix Invalid routes are accessible

packages/manager/.changeset/pr-11436-upcoming-features-1734526137538.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Upcoming Features
+---
+
+fix invalid routes in the iam ([#11436](https://github.com/linode/manager/pull/11436))

packages/manager/src/featureFlags.ts

@@ -231,7 +231,7 @@ export type ProductInformationBannerLocation =
   | 'Databases'
   | 'Domains'
   | 'Firewalls'
-  | 'Identity and Access Management'
+  | 'Identity and Access'
   | 'Images'
   | 'Kubernetes'
   | 'LinodeCreate' // Use for Marketplace banners

packages/manager/src/features/IAM/IAMLanding.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { matchPath } from 'react-router-dom';
+import { matchPath, useHistory } from 'react-router-dom';
 
 import { DocumentTitleSegment } from 'src/components/DocumentTitle';
 import { LandingHeader } from 'src/components/LandingHeader';
@@ -24,7 +24,9 @@ const Roles = React.lazy(() =>
   }))
 );
 
-export const IdentityAccessManagementLanding = React.memo((props: Props) => {
+export const IdentityAccessLanding = React.memo((props: Props) => {
+  const history = useHistory();
+
   const tabs = [
     {
       routeName: `${props.match.url}/users`,
@@ -37,15 +39,21 @@ export const IdentityAccessManagementLanding = React.memo((props: Props) => {
   ];
 
   const navToURL = (index: number) => {
-    props.history.push(tabs[index].routeName);
+    history.push(tabs[index].routeName);
   };
 
   const getDefaultTabIndex = () => {
     const tabChoice = tabs.findIndex((tab) =>
       Boolean(matchPath(tab.routeName, { path: location.pathname }))
     );
 
-    return tabChoice;
+    if (tabChoice < 0) {
+      history.push('/iam/users');
+
+      return 0;
+    } else {
+      return tabChoice;
+    }
   };
 
   const landingHeaderProps = {

packages/manager/src/features/IAM/Shared/NoAssignedRoles/NoAssignedRoles.test.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import { renderWithTheme } from 'src/utilities/testHelpers';
 
 import {
-  NO_ASSIGNED_RESOURCES_TEXT,
+  NO_ASSIGNED_ENTITIES_TEXT,
   NO_ASSIGNED_ROLES_TEXT,
 } from '../constants';
 import { NoAssignedRoles } from './NoAssignedRoles';
@@ -16,10 +16,10 @@ describe('NoAssignedRoles', () => {
     expect(getByText(NO_ASSIGNED_ROLES_TEXT)).toBeInTheDocument();
   });
 
-  it('renders with correct text for the Assigned Resources tab', () => {
+  it('renders with correct text for the Assigned Entities tab', () => {
     const { getByText } = renderWithTheme(
-      <NoAssignedRoles text={NO_ASSIGNED_RESOURCES_TEXT} />
+      <NoAssignedRoles text={NO_ASSIGNED_ENTITIES_TEXT} />
     );
-    expect(getByText(NO_ASSIGNED_RESOURCES_TEXT)).toBeInTheDocument();
+    expect(getByText(NO_ASSIGNED_ENTITIES_TEXT)).toBeInTheDocument();
   });
 });

packages/manager/src/features/IAM/Shared/constants.ts

@@ -5,4 +5,4 @@ export const IAM_LABEL = 'Identity and Access';
 
 export const NO_ASSIGNED_ROLES_TEXT = `The user doesn't have any roles assigned yet. Once you assign the role, it will show up here.`;
 
-export const NO_ASSIGNED_RESOURCES_TEXT = `The user doesn't have any resource assigned yet. Once you assigned the user a role on specific resources, these resources will show up here.`;
+export const NO_ASSIGNED_ENTITIES_TEXT = `The user doesn't have any entities assigned yet. Once you assigned the user a role on specific entities, these entities will show up here.`;

packages/manager/src/features/IAM/Users/UserDetailsLanding.tsx

@@ -14,7 +14,7 @@ import { Tabs } from 'src/components/Tabs/Tabs';
 import { useAccountUserPermissions } from 'src/queries/iam/iam';
 
 import { IAM_LABEL } from '../Shared/constants';
-import { UserResources } from './UserResources/UserResources';
+import { UserEntities } from './UserEntities/UserEntities';
 import { UserRoles } from './UserRoles/UserRoles';
 
 export const UserDetailsLanding = () => {
@@ -34,8 +34,8 @@ export const UserDetailsLanding = () => {
       title: 'Assigned Roles',
     },
     {
-      routeName: `/iam/users/${username}/resources`,
-      title: 'Assigned Resources',
+      routeName: `/iam/users/${username}/entities`,
+      title: 'Assigned Entities',
     },
   ];
 
@@ -44,9 +44,17 @@ export const UserDetailsLanding = () => {
   };
 
   const getDefaultTabIndex = () => {
-    return tabs.findIndex((tab) =>
+    const tabChoice = tabs.findIndex((tab) =>
       Boolean(matchPath(tab.routeName, { path: location.pathname }))
     );
+
+    if (tabChoice < 0) {
+      history.push(`/iam/users/${username}/details`);
+
+      return 0;
+    } else {
+      return tabChoice;
+    }
   };
 
   let idx = 0;
@@ -79,7 +87,7 @@ export const UserDetailsLanding = () => {
             <UserRoles assignedRoles={assignedRoles} />
           </SafeTabPanel>
           <SafeTabPanel index={++idx}>
-            <UserResources assignedRoles={assignedRoles} />
+            <UserEntities assignedRoles={assignedRoles} />
           </SafeTabPanel>
         </TabPanels>
       </Tabs>

packages/manager/src/features/IAM/Users/UserResources/UserResources.tsx → packages/manager/src/features/IAM/Users/UserEntities/UserEntities.tsx

@@ -5,7 +5,7 @@ import { useParams } from 'react-router-dom';
 
 import { DocumentTitleSegment } from 'src/components/DocumentTitle';
 
-import { NO_ASSIGNED_RESOURCES_TEXT } from '../../Shared/constants';
+import { NO_ASSIGNED_ENTITIES_TEXT } from '../../Shared/constants';
 import { NoAssignedRoles } from '../../Shared/NoAssignedRoles/NoAssignedRoles';
 
 import type { IamUserPermissions } from '@linode/api-v4';
@@ -14,21 +14,21 @@ interface Props {
   assignedRoles?: IamUserPermissions;
 }
 
-export const UserResources = ({ assignedRoles }: Props) => {
+export const UserEntities = ({ assignedRoles }: Props) => {
   const { username } = useParams<{ username: string }>();
 
   const hasAssignedRoles = assignedRoles ? !isEmpty(assignedRoles) : false;
 
   return (
     <>
-      <DocumentTitleSegment segment={`${username} - User Resources`} />
+      <DocumentTitleSegment segment={`${username} - User Entities`} />
       <Paper>
         <Stack spacing={3}>
-          <Typography variant="h2">Assigned Resources</Typography>
+          <Typography variant="h2">Assigned Entities</Typography>
           {hasAssignedRoles ? (
-            <p>UIE-8139 - RBAC-5: User Roles - Resources Table</p>
+            <p>UIE-8139 - RBAC-5: User Roles - Entities Table</p>
           ) : (
-            <NoAssignedRoles text={NO_ASSIGNED_RESOURCES_TEXT} />
+            <NoAssignedRoles text={NO_ASSIGNED_ENTITIES_TEXT} />
           )}
         </Stack>
       </Paper>

packages/manager/src/features/IAM/index.tsx

@@ -8,7 +8,7 @@ import type { RouteComponentProps } from 'react-router-dom';
 
 const IAMLanding = React.lazy(() =>
   import('./IAMLanding').then((module) => ({
-    default: module.IdentityAccessManagementLanding,
+    default: module.IdentityAccessLanding,
   }))
 );
 
@@ -23,8 +23,13 @@ export const IdentityAccessManagement = (props: RouteComponentProps) => {
 
   return (
     <React.Suspense fallback={<SuspenseLoader />}>
-      <ProductInformationBanner bannerLocation="Identity and Access Management" />
+      <ProductInformationBanner bannerLocation="Identity and Access" />
       <Switch>
+        <Redirect
+          exact
+          from={`${path}/users/:username/`}
+          to={`${path}/users/:username/details`}
+        />
         <Route component={UserDetails} path={`${path}/users/:username/`} />
         <Redirect exact from={path} to={`${path}/users`} />
         <Route component={IAMLanding} path={path} />