fix: [UIE-9300] - isIAMEnabled LA access check (linode#12946)

* fix + loading state

* Added changeset: IAM - isIAMEnabled LA access check

Author: abailly-akamai

packages/manager/.changeset/pr-12946-fixed-1759415335272.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Fixed
+---
+
+IAM - isIAMEnabled LA access check ([#12946](https://github.com/linode/manager/pull/12946))

packages/manager/src/features/IAM/hooks/useIsIAMEnabled.ts

@@ -19,17 +19,17 @@ import type { FlagSet } from 'src/featureFlags';
 export const useIsIAMEnabled = () => {
   const flags = useFlags();
   const { data: profile } = useProfile();
-  const { data: roles } = useAccountRoles(
+  const { data: roles, isLoading: isLoadingRoles } = useAccountRoles(
     flags?.iam?.enabled === true && !profile?.restricted
   );
 
-  const { data: permissions } = useUserAccountPermissions(
-    flags?.iam?.enabled === true
-  );
+  const { data: permissions, isLoading: isLoadingPermissions } =
+    useUserAccountPermissions(flags?.iam?.enabled === true);
 
   return {
     isIAMBeta: flags.iam?.beta,
-    isIAMEnabled: flags?.iam?.enabled && Boolean(roles || permissions?.length),
+    isIAMEnabled: flags?.iam?.enabled && Boolean(roles || permissions),
+    isLoading: isLoadingRoles || isLoadingPermissions,
   };
 };
 
@@ -60,7 +60,7 @@ export const checkIAMEnabled = async (
       const permissions = await queryClient.ensureQueryData(
         queryOptions(iamQueries.user(profile.username)._ctx.accountPermissions)
       );
-      return Boolean(permissions.length);
+      return Boolean(permissions);
     }
 
     // For non-restricted users ONLY, get roles

packages/manager/src/routes/IAM/IAMRoute.tsx

@@ -8,12 +8,18 @@ import { SuspenseLoader } from 'src/components/SuspenseLoader';
 import { useIsIAMEnabled } from 'src/features/IAM/hooks/useIsIAMEnabled';
 
 export const IAMRoute = () => {
-  const { isIAMEnabled } = useIsIAMEnabled();
+  const { isIAMEnabled, isLoading } = useIsIAMEnabled();
   return (
     <React.Suspense fallback={<SuspenseLoader />}>
       <DocumentTitleSegment segment="Identity and Access" />
       <ProductInformationBanner bannerLocation="Identity and Access" />
-      {isIAMEnabled ? <Outlet /> : <NotFound />}
+      {isLoading ? (
+        <SuspenseLoader />
+      ) : isIAMEnabled ? (
+        <Outlet />
+      ) : (
+        <NotFound />
+      )}
     </React.Suspense>
   );
 };