feat: [UIE-8999] - IAM RBAC Adjust the parameters to useQueryWithPermissions and return errors (linode#12560)

* feat: [UIE-8999] - IAM RBAC add parameters to the userQueryWithPermission hook, return errors and loading indicators

* Changeset

* Better API

* Fix test

---------

Co-authored-by: Conal Ryan <[email protected]>

Author: corya-akamai

packages/manager/.changeset/pr-12560-upcoming-features-1753279716756.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Upcoming Features
+---
+
+Modified the query parameter to allow varying use cases. Return any errors from the API along with isLoading, isError values. ([#12560](https://github.com/linode/manager/pull/12560))

packages/manager/src/features/Firewalls/FirewallLanding/CustomFirewallFields.tsx

@@ -66,7 +66,7 @@ export const CustomFirewallFields = (props: CustomFirewallProps) => {
   const { data: profile } = useProfile();
 
   const { data: permissableLinodes, hasFiltered: hasFilteredLinodes } =
-    useQueryWithPermissions<Linode>(useAllLinodesQuery, 'linode', [
+    useQueryWithPermissions<Linode>(useAllLinodesQuery(), 'linode', [
       'apply_linode_firewalls',
     ]);
 

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

@@ -23,9 +23,7 @@ import type {
   AccountEntity,
   APIError,
   EntityType,
-  Filter,
   GrantType,
-  Params,
   Profile,
 } from '@linode/api-v4';
 import type { UseQueryResult } from '@linode/queries';
@@ -92,31 +90,41 @@ export const useEntitiesPermissions = <T extends EntityBase>(
     })),
   });
 
-  const isLoading = queries.some((query) => query.isLoading);
-  const isError = queries.some((query) => query.isError);
   const data = queries.map((query) => query.data);
+  const error = queries.map((query) => query.error);
+  const isError = queries.some((query) => query.isError);
+  const isLoading = queries.some((query) => query.isLoading);
 
-  return { data, isLoading, isError };
+  return { data, error, isError, isLoading };
 };
 
+export type QueryWithPermissionsResult<T> = {
+  data: T[];
+  error: APIError[] | null;
+  hasFiltered: boolean;
+  isError: boolean;
+  isLoading: boolean;
+} & Omit<
+  UseQueryResult<T[], APIError[]>,
+  'data' | 'error' | 'isError' | 'isLoading'
+>;
+
 export const useQueryWithPermissions = <T extends EntityBase>(
-  query: (
-    params?: Params,
-    filter?: Filter,
-    enabled?: boolean
-  ) => UseQueryResult<T[], APIError[]>,
+  useQueryResult: UseQueryResult<T[], APIError[]>,
   entityType: EntityType,
   permissionsToCheck: PermissionType[]
-): { data: T[]; hasFiltered: boolean } => {
-  const { data: allEntities } = query();
+): QueryWithPermissionsResult<T> => {
+  const {
+    data: allEntities,
+    error: allEntitiesError,
+    isLoading: areEntitiesLoading,
+    isError: isEntitiesError,
+    ...restQueryResult
+  } = useQueryResult;
   const { data: profile } = useProfile();
   const { isIAMEnabled } = useIsIAMEnabled();
-  const { data: entityPermissions } = useEntitiesPermissions<T>(
-    allEntities,
-    entityType,
-    profile,
-    isIAMEnabled
-  );
+  const { data: entityPermissions, isLoading: areEntityPermissionsLoading } =
+    useEntitiesPermissions<T>(allEntities, entityType, profile, isIAMEnabled);
   const { data: grants } = useGrants(!isIAMEnabled);
 
   const entityPermissionsMap = isIAMEnabled
@@ -138,6 +146,10 @@ export const useQueryWithPermissions = <T extends EntityBase>(
 
   return {
     data: entities || [],
+    error: allEntitiesError,
     hasFiltered: allEntities?.length !== entities?.length,
+    isError: isEntitiesError,
+    isLoading: areEntitiesLoading || areEntityPermissionsLoading,
+    ...restQueryResult,
   } as const;
 };

packages/manager/src/features/Linodes/LinodesDetail/LinodeBackup/LinodeBackups.test.tsx

@@ -19,6 +19,11 @@ const queryMocks = vi.hoisted(() => ({
       restore_linode_backup: true,
     },
   })),
+  useQueryWithPermissions: vi.fn().mockReturnValue({
+    data: [],
+    isLoading: false,
+    isError: false,
+  }),
 }));
 
 vi.mock('@tanstack/react-router', async () => {
@@ -31,6 +36,7 @@ vi.mock('@tanstack/react-router', async () => {
 
 vi.mock('src/features/IAM/hooks/usePermissions', () => ({
   usePermissions: queryMocks.userPermissions,
+  useQueryWithPermissions: queryMocks.useQueryWithPermissions,
 }));
 
 describe('LinodeBackups', () => {

packages/manager/src/features/Linodes/LinodesDetail/LinodeBackup/RestoreToLinodeDrawer.tsx

@@ -17,10 +17,12 @@ import { useFormik } from 'formik';
 import { useSnackbar } from 'notistack';
 import * as React from 'react';
 
+import { useQueryWithPermissions } from 'src/features/IAM/hooks/usePermissions';
 import { useEventsPollingActions } from 'src/queries/events/events';
 import { getErrorMap } from 'src/utilities/errorUtils';
 
-import type { LinodeBackup } from '@linode/api-v4/lib/linodes';
+import type { Linode, LinodeBackup } from '@linode/api-v4/lib/linodes';
+
 interface Props {
   backup: LinodeBackup | undefined;
   linodeId: number;
@@ -35,19 +37,20 @@ export const RestoreToLinodeDrawer = (props: Props) => {
 
   const { checkForNewEvents } = useEventsPollingActions();
 
-  // TODO - UIE-8999 - this query must be included with the useQueryWithPermissions hook
-  const {
-    data: linodes,
-    error: linodeError,
-    isLoading: linodesLoading,
-  } = useAllLinodesQuery(
+  const query = useAllLinodesQuery(
     {},
     {
       region: linode?.region,
     },
     open && linode !== undefined
   );
 
+  const {
+    data: linodes,
+    error: linodeError,
+    isLoading: linodesLoading,
+  } = useQueryWithPermissions<Linode>(query, 'linode', ['update_linode']);
+
   const {
     error,
     isPending,