fix: [UIE-10253] - IAM Delegate: hide company name for users with no permission

Author: mpolotsk-akamai

packages/manager/src/OAuth/oauth.ts

@@ -5,7 +5,7 @@ import {
 } from '@linode/utilities';
 import * as Sentry from '@sentry/react';
 
-import { clearStorage, clearUserInput, storage } from 'src/utilities/storage';
+import { clearUserInput, storage } from 'src/utilities/storage';
 
 import { getAppRoot, getClientId, getLoginURL } from './constants';
 import { generateCodeChallenge, generateCodeVerifier } from './pkce';
@@ -45,7 +45,6 @@ function clearNonceAndCodeVerifierFromLocalStorage() {
 function clearAllAuthDataFromLocalStorage() {
   clearNonceAndCodeVerifierFromLocalStorage();
   clearAuthDataFromLocalStorage();
-  clearStorage('switch_account/company_name');
 }
 
 export function clearStorageAndRedirectToLogout() {
@@ -106,7 +105,6 @@ export async function logout() {
 
   clearUserInput();
   clearAuthDataFromLocalStorage();
-  clearStorage('switch_account/company_name');
 
   if (token) {
     const tokenWithoutPrefix = token.split(' ')[1];

packages/manager/src/features/Account/SwitchAccountDrawer.tsx

@@ -20,24 +20,21 @@ import { useSwitchToParentAccount } from 'src/features/Account/SwitchAccounts/us
 import { setTokenInLocalStorage } from 'src/features/Account/SwitchAccounts/utils';
 import { useIsIAMDelegationEnabled } from 'src/features/IAM/hooks/useIsIAMEnabled';
 import { sendSwitchToParentAccountEvent } from 'src/utilities/analytics/customEventAnalytics';
-import { getStorage, setStorage, storage } from 'src/utilities/storage';
+import { getStorage, storage } from 'src/utilities/storage';
 
 import { ChildAccountList } from './SwitchAccounts/ChildAccountList';
 import { ChildAccountsTable } from './SwitchAccounts/ChildAccountsTable';
 import { updateParentTokenInLocalStorage } from './SwitchAccounts/utils';
 
 import type { APIError, Filter, UserType } from '@linode/api-v4';
 
-const SWITCH_ACCOUNT_COMPANY_KEY = 'switch_account/company_name';
-
 interface Props {
   onClose: () => void;
   open: boolean;
   userType: undefined | UserType;
 }
 
 interface HandleSwitchToChildAccountProps {
-  company?: string;
   currentTokenWithBearer?: string;
   euuid: string;
   event: React.MouseEvent<HTMLElement>;
@@ -131,12 +128,11 @@ export const SwitchAccountDrawer = (props: Props) => {
       event,
       onClose,
       userType,
-      company,
     }: HandleSwitchToChildAccountProps) => {
       const isProxyOrDelegateUserType =
         userType === 'proxy' || userType === 'delegate';
+
       try {
-        setStorage(SWITCH_ACCOUNT_COMPANY_KEY, company ?? '');
         if (isProxyOrDelegateUserType) {
           // Revoke proxy token before switching accounts.
           await revokeToken().catch(() => {
@@ -166,7 +162,6 @@ export const SwitchAccountDrawer = (props: Props) => {
         location.replace('/linodes');
       } catch {
         // Error is handled by createTokenError.
-        setStorage(SWITCH_ACCOUNT_COMPANY_KEY, '');
       }
     },
     [createToken, isProxyUserType, updateCurrentToken, revokeToken]

packages/manager/src/features/Account/SwitchAccounts/ChildAccountsTable.tsx

@@ -26,10 +26,8 @@ export interface ChildAccountsTableProps {
     euuid,
     event,
     onClose,
-    company,
     userType,
   }: {
-    company?: string;
     currentTokenWithBearer?: string;
     euuid: string;
     event: React.MouseEvent<HTMLElement>;
@@ -109,7 +107,6 @@ export const ChildAccountsTable = (props: ChildAccountsTableProps) => {
                     onSwitchAccount({
                       currentTokenWithBearer,
                       euuid: childAccount.euuid,
-                      company: childAccount.company,
                       event,
                       onClose,
                       userType,

packages/manager/src/features/Account/SwitchAccounts/useSwitchToParentAccount.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 
 import { PARENT_USER_SESSION_EXPIRED } from 'src/features/Account/constants';
-import { clearStorage, setStorage } from 'src/utilities/storage';
+import { setStorage } from 'src/utilities/storage';
 
 import { useParentChildAuthentication } from './useParentChildAuthentication';
 
@@ -38,8 +38,7 @@ export const useSwitchToParentAccount = ({
 
     // Flag to prevent multiple clicks on the switch account button.
     setSubmitting(true);
-    // Clean up the company name in storage to prevent it from being used in the parent account after switching back from a child account.
-    clearStorage('switch_account/company_name');
+
     try {
       // Revoke proxy or delegate token before switching to parent account.
       await revokeToken().catch(() => {

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

@@ -43,10 +43,8 @@ export const UserMenu = React.memo(() => {
   const open = Boolean(anchorEl);
   const id = open ? 'user-menu-popover' : undefined;
 
-  const switchAccountCompanyName = getStorage('switch_account/company_name');
-
   const companyNameOrEmail = getCompanyNameOrEmail({
-    company: account?.company ? account?.company : switchAccountCompanyName,
+    company: account?.company,
     profile,
   });
 
@@ -84,9 +82,11 @@ export const UserMenu = React.memo(() => {
         setStorage('is_delegate_user_type', 'true');
       }
 
-      enqueueSnackbar(`Account switched to ${companyNameOrEmail}.`, {
-        variant: 'success',
-      });
+      const message = companyNameOrEmail
+        ? `Account switched to ${companyNameOrEmail}.`
+        : 'Account switched.';
+
+      enqueueSnackbar(message, { variant: 'success' });
     }
   }, [
     isProxyOrDelegateUserType,

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

@@ -121,9 +121,8 @@ export const UserMenuPopover = (props: UserMenuPopoverProps) => {
       }
     : undefined;
 
-  const switchAccountCompanyName = getStorage('switch_account/company_name');
   const companyNameOrEmail = getCompanyNameOrEmail({
-    company: account?.company ? account?.company : switchAccountCompanyName,
+    company: account?.company,
     profile,
   });
   const { data: parentProfile } = useProfile({ headers: proxyHeaders });
@@ -236,8 +235,11 @@ export const UserMenuPopover = (props: UserMenuPopoverProps) => {
         gap={(theme) => theme.tokens.spacing.S16}
         minWidth={250}
       >
-        <Stack display="flex" gap={(theme) => theme.tokens.spacing.S8}>
-          {canSwitchBetweenParentOrProxyAccount && (
+        <Stack
+          display="flex"
+          gap={(theme) => (companyNameOrEmail ? theme.tokens.spacing.S8 : 0)}
+        >
+          {canSwitchBetweenParentOrProxyAccount && companyNameOrEmail && (
             <Typography
               sx={(theme) => ({
                 color: theme.tokens.alias.Content.Text.Primary.Default,
@@ -253,8 +255,8 @@ export const UserMenuPopover = (props: UserMenuPopoverProps) => {
               font: theme.tokens.alias.Typography.Label.Bold.L,
             })}
           >
-            {canSwitchBetweenParentOrProxyAccount && companyNameOrEmail
-              ? companyNameOrEmail
+            {canSwitchBetweenParentOrProxyAccount
+              ? companyNameOrEmail || null
               : userName}
           </Typography>
           {canSwitchBetweenParentOrProxyAccount && (