refactor: rewrite useAdminSamlAuthProviderRoleMappings with RQ

packages/web/src/hooks/useAdminSamlAuthProviderRoleMappings.js

@@ -0,0 +1,24 @@
+import { useQuery } from '@tanstack/react-query';
+
+import api from 'helpers/api';
+
+export default function useAdminSamlAuthProviderRoleMappings({
+  adminSamlAuthProviderId,
+}) {
+  const query = useQuery({
+    queryKey: ['adminSamlAuthProviderRoleMappings', adminSamlAuthProviderId],
+    queryFn: async ({ signal }) => {
+      const { data } = await api.get(
+        `/v1/admin/saml-auth-providers/${adminSamlAuthProviderId}/role-mappings`,
+        {
+          signal,
+        },
+      );
+
+      return data;
+    },
+    enabled: !!adminSamlAuthProviderId,
+  });
+
+  return query;
+}

packages/web/src/hooks/useSamlAuthProviderRoleMappings.js

@@ -1,21 +0,0 @@
-import * as React from 'react';
-import { useLazyQuery } from '@apollo/client';
-import { GET_SAML_AUTH_PROVIDER_ROLE_MAPPINGS } from 'graphql/queries/get-saml-auth-provider-role-mappings';
-export default function useSamlAuthProviderRoleMappings(providerId) {
-  const [getSamlAuthProviderRoleMappings, { data, loading }] = useLazyQuery(
-    GET_SAML_AUTH_PROVIDER_ROLE_MAPPINGS,
-  );
-  React.useEffect(() => {
-    if (providerId) {
-      getSamlAuthProviderRoleMappings({
-        variables: {
-          id: providerId,
-        },
-      });
-    }
-  }, [providerId]);
-  return {
-    roleMappings: data?.getSamlAuthProviderRoleMappings || [],
-    loading,
-  };
-}