diff --git a/packages/backend/src/graphql/queries/test-connection.js b/packages/backend/src/graphql/queries/test-connection.js deleted file mode 100644 index 6d8e3489..00000000 --- a/packages/backend/src/graphql/queries/test-connection.js +++ /dev/null @@ -1,38 +0,0 @@ -import App from '../../models/app.js'; -import Connection from '../../models/connection.js'; -import globalVariable from '../../helpers/global-variable.js'; - -const testConnection = async (_parent, params, context) => { - const conditions = context.currentUser.can('update', 'Connection'); - const userConnections = context.currentUser.$relatedQuery('connections'); - const allConnections = Connection.query(); - const connectionBaseQuery = conditions.isCreator - ? userConnections - : allConnections; - - let connection = await connectionBaseQuery - .clone() - .findOne({ - id: params.id, - }) - .throwIfNotFound(); - - const app = await App.findOneByKey(connection.key, false); - const $ = await globalVariable({ connection, app }); - - let isStillVerified; - try { - isStillVerified = !!(await app.auth.isStillVerified($)); - } catch { - isStillVerified = false; - } - - connection = await connection.$query().patchAndFetch({ - formattedData: connection.formattedData, - verified: isStillVerified, - }); - - return connection; -}; - -export default testConnection; diff --git a/packages/backend/src/graphql/query-resolvers.js b/packages/backend/src/graphql/query-resolvers.js index 23888476..1c4d82ad 100644 --- a/packages/backend/src/graphql/query-resolvers.js +++ b/packages/backend/src/graphql/query-resolvers.js @@ -1,13 +1,11 @@ import getAppAuthClient from './queries/get-app-auth-client.ee.js'; import getConnectedApps from './queries/get-connected-apps.js'; import getDynamicData from './queries/get-dynamic-data.js'; -import testConnection from './queries/test-connection.js'; const queryResolvers = { getAppAuthClient, getConnectedApps, getDynamicData, - testConnection, }; export default queryResolvers; diff --git a/packages/backend/src/graphql/schema.graphql b/packages/backend/src/graphql/schema.graphql index 250fe32b..36ab9a9b 100644 --- a/packages/backend/src/graphql/schema.graphql +++ b/packages/backend/src/graphql/schema.graphql @@ -1,7 +1,6 @@ type Query { getAppAuthClient(id: String!): AppAuthClient getConnectedApps(name: String): [App] - testConnection(id: String!): Connection getDynamicData( stepId: String! key: String! diff --git a/packages/web/src/components/AppConnectionRow/index.jsx b/packages/web/src/components/AppConnectionRow/index.jsx index dba24a08..5e6dc0ac 100644 --- a/packages/web/src/components/AppConnectionRow/index.jsx +++ b/packages/web/src/components/AppConnectionRow/index.jsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { useLazyQuery, useMutation } from '@apollo/client'; +import { useMutation } from '@apollo/client'; import CheckCircleIcon from '@mui/icons-material/CheckCircle'; import ErrorIcon from '@mui/icons-material/Error'; import Skeleton from '@mui/material/Skeleton'; @@ -14,11 +14,11 @@ import { DateTime } from 'luxon'; import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar'; import ConnectionContextMenu from 'components/AppConnectionContextMenu'; import { DELETE_CONNECTION } from 'graphql/mutations/delete-connection'; -import { TEST_CONNECTION } from 'graphql/queries/test-connection'; import useFormatMessage from 'hooks/useFormatMessage'; import { ConnectionPropType } from 'propTypes/propTypes'; import { CardContent, Typography } from './style'; import useConnectionFlows from 'hooks/useConnectionFlows'; +import useTestConnection from 'hooks/useTestConnection'; const countTranslation = (value) => ( <> @@ -36,19 +36,18 @@ function AppConnectionRow(props) { const contextButtonRef = React.useRef(null); const [anchorEl, setAnchorEl] = React.useState(null); - const [testConnection, { called: testCalled, loading: testLoading }] = - useLazyQuery(TEST_CONNECTION, { - fetchPolicy: 'network-only', - onCompleted: () => { - setTimeout(() => setVerificationVisible(false), 3000); - }, - onError: () => { - setTimeout(() => setVerificationVisible(false), 3000); - }, - }); - const [deleteConnection] = useMutation(DELETE_CONNECTION); + const { mutate: testConnection, isPending: isTestConnectionPending } = + useTestConnection( + { connectionId: id }, + { + onSettled: () => { + setTimeout(() => setVerificationVisible(false), 3000); + }, + }, + ); + const handleClose = () => { setAnchorEl(null); }; @@ -113,7 +112,7 @@ function AppConnectionRow(props) { - {verificationVisible && testCalled && testLoading && ( + {verificationVisible && isTestConnectionPending && ( <> @@ -122,8 +121,7 @@ function AppConnectionRow(props) { )} {verificationVisible && - testCalled && - !testLoading && + !isTestConnectionPending && verified && ( <> @@ -133,8 +131,7 @@ function AppConnectionRow(props) { )} {verificationVisible && - testCalled && - !testLoading && + !isTestConnectionPending && !verified && ( <> diff --git a/packages/web/src/components/ChooseConnectionSubstep/index.jsx b/packages/web/src/components/ChooseConnectionSubstep/index.jsx index c99025cc..5627906d 100644 --- a/packages/web/src/components/ChooseConnectionSubstep/index.jsx +++ b/packages/web/src/components/ChooseConnectionSubstep/index.jsx @@ -1,5 +1,4 @@ import PropTypes from 'prop-types'; -import { useLazyQuery } from '@apollo/client'; import Autocomplete from '@mui/material/Autocomplete'; import Button from '@mui/material/Button'; import Collapse from '@mui/material/Collapse'; @@ -12,7 +11,6 @@ import AppAuthClientsDialog from 'components/AppAuthClientsDialog/index.ee'; import FlowSubstepTitle from 'components/FlowSubstepTitle'; import useAppConfig from 'hooks/useAppConfig.ee'; import { EditorContext } from 'contexts/Editor'; -import { TEST_CONNECTION } from 'graphql/queries/test-connection'; import useAuthenticateApp from 'hooks/useAuthenticateApp.ee'; import useFormatMessage from 'hooks/useFormatMessage'; import { @@ -23,6 +21,7 @@ import { import useStepConnection from 'hooks/useStepConnection'; import { useQueryClient } from '@tanstack/react-query'; import useAppConnections from 'hooks/useAppConnections'; +import useTestConnection from 'hooks/useTestConnection'; const ADD_CONNECTION_VALUE = 'ADD_CONNECTION'; const ADD_SHARED_CONNECTION_VALUE = 'ADD_SHARED_CONNECTION'; @@ -72,14 +71,10 @@ function ChooseConnectionSubstep(props) { const stepConnection = stepConnectionData?.data; // TODO: show detailed error when connection test/verification fails - const [ - testConnection, - { loading: testResultLoading, refetch: retestConnection }, - ] = useLazyQuery(TEST_CONNECTION, { - variables: { - id: stepConnection?.id, - }, - }); + const { mutate: testConnection, isPending: isTestConnectionPending } = + useTestConnection({ + connectionId: stepConnection?.id, + }); React.useEffect(() => { if (stepConnection?.id) { @@ -201,11 +196,11 @@ function ChooseConnectionSubstep(props) { React.useEffect(() => { if (stepConnection?.id) { - retestConnection({ + testConnection({ id: stepConnection?.id, }); } - }, [stepConnection?.id, retestConnection]); + }, [stepConnection?.id, testConnection]); const onToggle = expanded ? onCollapse : onExpand; @@ -215,7 +210,7 @@ function ChooseConnectionSubstep(props) { expanded={expanded} onClick={onToggle} title={name} - valid={testResultLoading ? null : stepConnection?.verified} + valid={isTestConnectionPending ? null : stepConnection?.verified} /> { + const { data } = await api.post(`/v1/connections/${connectionId}/test`); + + return data; + }, + onSettled, + }); + + return query; +}