refactor(SamlConfiguration): rewrite mutations with REST API endpoints

packages/web/src/graphql/mutations/upsert-saml-auth-provider.js

@@ -1,8 +0,0 @@
-import { gql } from '@apollo/client';
-export const UPSERT_SAML_AUTH_PROVIDER = gql`
-  mutation UpsertSamlAuthProvider($input: UpsertSamlAuthProviderInput) {
-    upsertSamlAuthProvider(input: $input) {
-      id
-    }
-  }
-`;

packages/web/src/hooks/useAdminCreateSamlAuthProvider.js

@@ -0,0 +1,21 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import api from 'helpers/api';
+
+export default function useAdminCreateSamlAuthProvider() {
+  const queryClient = useQueryClient();
+
+  const query = useMutation({
+    mutationFn: async (payload) => {
+      const { data } = await api.post(`/v1/admin/saml-auth-providers`, payload);
+
+      return data;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({
+        queryKey: ['admin', 'samlAuthProviders'],
+      });
+    },
+  });
+
+  return query;
+}

packages/web/src/hooks/useAdminUpdateSamlAuthProvider.js

@@ -0,0 +1,24 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import api from 'helpers/api';
+
+export default function useAdminUpdateSamlAuthProvider(samlAuthProviderId) {
+  const queryClient = useQueryClient();
+
+  const query = useMutation({
+    mutationFn: async (payload) => {
+      const { data } = await api.patch(
+        `/v1/admin/saml-auth-providers/${samlAuthProviderId}`,
+        payload,
+      );
+
+      return data;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({
+        queryKey: ['admin', 'samlAuthProviders'],
+      });
+    },
+  });
+
+  return query;
+}

packages/web/src/pages/Authentication/SamlConfiguration.jsx

@@ -1,5 +1,4 @@
 import PropTypes from 'prop-types';
-import { useMutation } from '@apollo/client';
 import LoadingButton from '@mui/lab/LoadingButton';
 import Stack from '@mui/material/Stack';
 import MuiTextField from '@mui/material/TextField';
@@ -10,8 +9,9 @@ import ControlledAutocomplete from 'components/ControlledAutocomplete';
 import Form from 'components/Form';
 import Switch from 'components/Switch';
 import TextField from 'components/TextField';
-import { UPSERT_SAML_AUTH_PROVIDER } from 'graphql/mutations/upsert-saml-auth-provider';
 import useFormatMessage from 'hooks/useFormatMessage';
+import useAdminCreateSamlAuthProvider from 'hooks/useAdminCreateSamlAuthProvider';
+import useAdminUpdateSamlAuthProvider from 'hooks/useAdminUpdateSamlAuthProvider';
 import useRoles from 'hooks/useRoles.ee';
 
 const defaultValues = {
@@ -38,42 +38,26 @@ function SamlConfiguration({ provider, providerLoading }) {
   const roles = data?.data;
   const enqueueSnackbar = useEnqueueSnackbar();
 
-  const [upsertSamlAuthProvider, { loading }] = useMutation(
-    UPSERT_SAML_AUTH_PROVIDER,
-  );
-
-  const handleProviderUpdate = async (providerDataToUpdate) => {
-    try {
   const {
-        name,
+    mutateAsync: createSamlAuthProvider,
-        certificate,
+    isPending: isCreateSamlAuthProviderPending,
-        signatureAlgorithm,
+  } = useAdminCreateSamlAuthProvider();
-        issuer,
+
-        entryPoint,
+  const {
-        firstnameAttributeName,
+    mutateAsync: updateSamlAuthProvider,
-        surnameAttributeName,
+    isPending: isUpdateSamlAuthProviderPending,
-        emailAttributeName,
+  } = useAdminUpdateSamlAuthProvider(provider?.id);
-        roleAttributeName,
+
-        active,
+  const isPending =
-        defaultRoleId,
+    isCreateSamlAuthProviderPending || isUpdateSamlAuthProviderPending;
-      } = providerDataToUpdate;
+
-      await upsertSamlAuthProvider({
+  const handleSubmit = async (providerData) => {
-        variables: {
+    try {
-          input: {
+      if (provider?.id) {
-            name,
+        await updateSamlAuthProvider(providerData);
-            certificate,
+      } else {
-            signatureAlgorithm,
+        await createSamlAuthProvider(providerData);
-            issuer,
+      }
-            entryPoint,
-            firstnameAttributeName,
-            surnameAttributeName,
-            emailAttributeName,
-            roleAttributeName,
-            active,
-            defaultRoleId,
-          },
-        },
-      });
 
       enqueueSnackbar(formatMessage('authenticationForm.successfullySaved'), {
         variant: 'success',
@@ -91,10 +75,7 @@ function SamlConfiguration({ provider, providerLoading }) {
   }
 
   return (
-    <Form
+    <Form defaultValues={provider || defaultValues} onSubmit={handleSubmit}>
-      defaultValues={provider || defaultValues}
-      onSubmit={handleProviderUpdate}
-    >
       <Stack direction="column" gap={2}>
         <Switch
           name="active"
@@ -185,7 +166,7 @@ function SamlConfiguration({ provider, providerLoading }) {
           variant="contained"
           color="primary"
           sx={{ boxShadow: 2 }}
-          loading={loading}
+          loading={isPending}
         >
           {formatMessage('authenticationForm.save')}
         </LoadingButton>
@@ -196,6 +177,7 @@ function SamlConfiguration({ provider, providerLoading }) {
 
 SamlConfiguration.propTypes = {
   provider: PropTypes.shape({
+    id: PropTypes.string,
     active: PropTypes.bool,
     name: PropTypes.string,
     certificate: PropTypes.string,