upcoming: [M3-10421] - IAM: Rename Account section to Administration in the top right menu (linode#12640)

* Added new feature flag to support PrimaryNav changes

* Add Administration section to the primary Nav

* Update PrimaryNav.tsx

* Added changeset: Added a new feature flag and Administration section in the Primary Nav

* Test coverage

* disable the flag in cypress tests

* Rename Account section to Administration in the top right menu

* Added changeset: IAM: Rename Account section to Administration in the top right menu

* Show new chip next to Identity and Access link

* Update packages/manager/.changeset/pr-12633-upcoming-features-1754346094060.md

Co-authored-by: Mariah Jacobs <[email protected]>

* Mock the iamRbacPrimaryNavChanges feature flag to be disabled in Cypress tests

* upadate primarynav

* Replace new feature chip with Beta chip - @aaleksee-akamai

* Update packages/manager/.changeset/pr-12640-upcoming-features-1754423037270.md

Co-authored-by: Connie Liu <[email protected]>

* Add login history link - @coliu-akamai

---------

Co-authored-by: Mariah Jacobs <[email protected]>
Co-authored-by: Connie Liu <[email protected]>

Author: 3 people

packages/manager/.changeset/pr-12640-upcoming-features-1754423037270.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Upcoming Features
+---
+
+IAM: Rename Account section to Administration and add navigation for IAM in the top right menu ([#12640](https://github.com/linode/manager/pull/12640))

packages/manager/src/features/TopMenu/UserMenu/UserMenuPopover.tsx

@@ -1,5 +1,5 @@
 import { useAccount, useGrants, useProfile } from '@linode/queries';
-import { Box, Divider, Stack, Typography } from '@linode/ui';
+import { BetaChip, Box, Divider, Stack, Typography } from '@linode/ui';
 import { styled } from '@mui/material';
 import Grid from '@mui/material/Grid';
 import Popover from '@mui/material/Popover';
@@ -10,6 +10,7 @@ import { Link } from 'src/components/Link';
 import { switchAccountSessionContext } from 'src/context/switchAccountSessionContext';
 import { SwitchAccountButton } from 'src/features/Account/SwitchAccountButton';
 import { useIsParentTokenExpired } from 'src/features/Account/SwitchAccounts/useIsParentTokenExpired';
+import { useIsIAMEnabled } from 'src/features/IAM/hooks/useIsIAMEnabled';
 import { useFlags } from 'src/hooks/useFlags';
 import { useRestrictedGlobalGrantCheck } from 'src/hooks/useRestrictedGlobalGrantCheck';
 import { sendSwitchAccountEvent } from 'src/utilities/analytics/customEventAnalytics';
@@ -28,6 +29,7 @@ interface MenuLink {
   display: string;
   hide?: boolean;
   href: string;
+  isBeta?: boolean;
 }
 
 const profileLinks: MenuLink[] = [
@@ -57,6 +59,7 @@ export const UserMenuPopover = (props: UserMenuPopoverProps) => {
   const { data: account } = useAccount();
   const { data: profile } = useProfile();
   const { data: grants } = useGrants();
+  const { isIAMEnabled } = useIsIAMEnabled();
 
   const isChildAccountAccessRestricted = useRestrictedGlobalGrantCheck({
     globalGrantType: 'child_account_access',
@@ -103,15 +106,26 @@ export const UserMenuPopover = (props: UserMenuPopoverProps) => {
       },
       // Restricted users can't view the Users tab regardless of their grants
       {
-        display: 'Users & Grants',
+        display:
+          flags?.iamRbacPrimaryNavChanges && isIAMEnabled
+            ? 'Identity & Access'
+            : 'Users & Grants',
         hide: isRestrictedUser,
-        href: '/account/users',
+        href:
+          flags?.iamRbacPrimaryNavChanges && isIAMEnabled
+            ? '/iam'
+            : '/account/users',
+        isBeta: flags?.iamRbacPrimaryNavChanges && isIAMEnabled,
       },
       {
         display: 'Quotas',
         hide: !flags.limitsEvolution?.enabled,
         href: '/account/quotas',
       },
+      {
+        display: 'Login History',
+        href: '/account/login-history',
+      },
       // Restricted users can't view the Transfers tab regardless of their grants
       {
         display: 'Service Transfers',
@@ -129,7 +143,7 @@ export const UserMenuPopover = (props: UserMenuPopoverProps) => {
         href: '/account/settings',
       },
     ],
-    [hasFullAccountAccess, isRestrictedUser]
+    [hasFullAccountAccess, isRestrictedUser, isIAMEnabled, flags]
   );
 
   const renderLink = (link: MenuLink) => {
@@ -239,7 +253,9 @@ export const UserMenuPopover = (props: UserMenuPopoverProps) => {
         </Box>
         {hasAccountAccess && (
           <Box>
-            <Heading>Account</Heading>
+            <Heading>
+              {flags?.iamRbacPrimaryNavChanges ? 'Administration' : 'Account'}
+            </Heading>
             <Divider />
             <Stack
               gap={(theme) => theme.tokens.spacing.S8}
@@ -258,6 +274,7 @@ export const UserMenuPopover = (props: UserMenuPopoverProps) => {
                     to={menuLink.href}
                   >
                     {menuLink.display}
+                    {menuLink?.isBeta ? <BetaChip component="span" /> : null}
                   </Link>
                 )
               )}