refactor(web): rewrite mutation with PATCH /v1/admin/apps/:appKey/auth-clients/:appAuthClientId

packages/backend/src/config/cors-options.js

@@ -2,7 +2,7 @@ import appConfig from './app.js';
 
 const corsOptions = {
   origin: appConfig.webAppUrl,
-  methods: 'GET,HEAD,POST,DELETE',
+  methods: 'GET,HEAD,POST,PATCH,DELETE',
   credentials: true,
   optionsSuccessStatus: 200,
 };

packages/backend/src/graphql/mutation-resolvers.js

@@ -12,7 +12,6 @@ import executeFlow from './mutations/execute-flow.js';
 import generateAuthUrl from './mutations/generate-auth-url.js';
 import registerUser from './mutations/register-user.ee.js';
 import resetConnection from './mutations/reset-connection.js';
-import updateAppAuthClient from './mutations/update-app-auth-client.ee.js';
 import updateAppConfig from './mutations/update-app-config.ee.js';
 import updateConfig from './mutations/update-config.ee.js';
 import updateConnection from './mutations/update-connection.js';
@@ -45,7 +44,6 @@ const mutationResolvers = {
   generateAuthUrl,
   registerUser,
   resetConnection,
-  updateAppAuthClient,
   updateAppConfig,
   updateConfig,
   updateConnection,

packages/backend/src/graphql/mutations/update-app-auth-client.ee.js

@@ -1,17 +0,0 @@
-import AppAuthClient from '../../models/app-auth-client.js';
-
-const updateAppAuthClient = async (_parent, params, context) => {
-  context.currentUser.can('update', 'App');
-
-  const { id, ...appAuthClientData } = params.input;
-
-  const appAuthClient = await AppAuthClient.query()
-    .findById(id)
-    .throwIfNotFound();
-
-  await appAuthClient.$query().patch(appAuthClientData);
-
-  return appAuthClient;
-};
-
-export default updateAppAuthClient;

packages/backend/src/graphql/schema.graphql

@@ -17,7 +17,6 @@ type Mutation {
   generateAuthUrl(input: GenerateAuthUrlInput): AuthLink
   registerUser(input: RegisterUserInput): User
   resetConnection(input: ResetConnectionInput): Connection
-  updateAppAuthClient(input: UpdateAppAuthClientInput): AppAuthClient
   updateAppConfig(input: UpdateAppConfigInput): AppConfig
   updateConfig(input: JSONObject): JSONObject
   updateConnection(input: UpdateConnectionInput): Connection
@@ -555,20 +554,6 @@ input UpdateAppConfigInput {
   disabled: Boolean
 }
 
-type AppAuthClient {
-  id: String
-  appConfigId: String
-  name: String
-  active: Boolean
-}
-
-input UpdateAppAuthClientInput {
-  id: String
-  name: String
-  formattedAuthDefaults: JSONObject
-  active: Boolean
-}
-
 schema {
   query: Query
   mutation: Mutation

packages/web/src/components/AdminApplicationUpdateAuthClient/index.jsx

@@ -1,13 +1,12 @@
 import PropTypes from 'prop-types';
 import React, { useCallback, useMemo } from 'react';
 import { useParams } from 'react-router-dom';
-import { useMutation } from '@apollo/client';
 
 import { AppPropType } from 'propTypes/propTypes';
-import { UPDATE_APP_AUTH_CLIENT } from 'graphql/mutations/update-app-auth-client';
 import useFormatMessage from 'hooks/useFormatMessage';
 import AdminApplicationAuthClientDialog from 'components/AdminApplicationAuthClientDialog';
 import useAdminAppAuthClient from 'hooks/useAdminAppAuthClient.ee';
+import useAdminUpdateAppAuthClient from 'hooks/useAdminUpdateAppAuthClient.ee';
 import useAppAuth from 'hooks/useAppAuth';
 
 function AdminApplicationUpdateAuthClient(props) {
@@ -20,11 +19,11 @@ function AdminApplicationUpdateAuthClient(props) {
 
   const { data: auth } = useAppAuth(application.key);
 
-  const [updateAppAuthClient, { loading: loadingUpdateAppAuthClient, error }] =
+  const {
-    useMutation(UPDATE_APP_AUTH_CLIENT, {
+    mutateAsync: updateAppAuthClient,
-      refetchQueries: ['GetAppAuthClients'],
+    isPending: isUpdateAppAuthClientPending,
-      context: { autoSnackbar: false },
+    error: updateAppAuthClientError,
-    });
+  } = useAdminUpdateAppAuthClient(application.key, clientId);
 
   const authFields = auth?.data?.fields?.map((field) => ({
     ...field,
@@ -39,14 +38,9 @@ function AdminApplicationUpdateAuthClient(props) {
     const { name, active, ...formattedAuthDefaults } = values;
 
     await updateAppAuthClient({
-      variables: {
+      name,
-        input: {
+      active,
-          id: adminAppAuthClient.data.id,
+      formattedAuthDefaults,
-          name,
-          active,
-          formattedAuthDefaults,
-        },
-      },
     });
 
     onClose();
@@ -80,12 +74,12 @@ function AdminApplicationUpdateAuthClient(props) {
   return (
     <AdminApplicationAuthClientDialog
       onClose={onClose}
-      error={error}
+      error={updateAppAuthClientError}
       title={formatMessage('updateAuthClient.title')}
       loading={isAdminAuthClientLoading}
       submitHandler={submitHandler}
       authFields={authFields}
-      submitting={loadingUpdateAppAuthClient}
+      submitting={isUpdateAppAuthClientPending}
       defaultValues={defaultValues}
       disabled={!adminAppAuthClient}
     />

packages/web/src/graphql/mutations/update-app-auth-client.js

@@ -1,11 +0,0 @@
-import { gql } from '@apollo/client';
-export const UPDATE_APP_AUTH_CLIENT = gql`
-  mutation UpdateAppAuthClient($input: UpdateAppAuthClientInput) {
-    updateAppAuthClient(input: $input) {
-      id
-      appConfigId
-      name
-      active
-    }
-  }
-`;

packages/web/src/hooks/useAdminUpdateAppAuthClient.ee.js

@@ -0,0 +1,28 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import api from 'helpers/api';
+
+export default function useAdminUpdateAppAuthClient(appKey, id) {
+  const queryClient = useQueryClient();
+
+  const query = useMutation({
+    mutationFn: async (payload) => {
+      const { data } = await api.patch(
+        `/v1/admin/apps/${appKey}/auth-clients/${id}`,
+        payload,
+      );
+
+      return data;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({
+        queryKey: ['admin', 'apps', appKey, 'authClients', id],
+      });
+
+      queryClient.invalidateQueries({
+        queryKey: ['admin', 'apps', appKey, 'authClients'],
+      });
+    },
+  });
+
+  return query;
+}