From 030d886cf7c2e8373e7c713308f9e57915ab70d9 Mon Sep 17 00:00:00 2001 From: Ali BARIN Date: Tue, 8 Mar 2022 12:20:34 +0100 Subject: [PATCH] refactor: introduce input in gql mutations --- packages/backend/src/graphql/schema.graphql | 18 ++++++++++++++++-- .../components/AddNewAppConnection/index.tsx | 2 +- .../src/components/AppConnectionRow/index.tsx | 4 ++-- .../components/ChooseAccountSubstep/index.tsx | 17 ++++++++++++++--- .../web/src/components/EditorLayout/index.tsx | 6 ++++-- packages/web/src/components/FlowStep/index.tsx | 6 +++--- .../components/FlowStepContextMenu/index.tsx | 2 +- .../web/src/components/TestSubstep/index.tsx | 6 ++++-- .../src/graphql/mutations/create-auth-data.ts | 4 ++-- .../src/graphql/mutations/create-connection.ts | 5 ++--- .../web/src/graphql/mutations/create-flow.ts | 2 +- .../web/src/graphql/mutations/create-step.ts | 2 +- .../src/graphql/mutations/delete-connection.ts | 4 ++-- .../web/src/graphql/mutations/delete-step.ts | 4 ++-- .../web/src/graphql/mutations/execute-flow.ts | 4 ++-- .../src/graphql/mutations/reset-connection.ts | 4 ++-- .../src/graphql/mutations/update-connection.ts | 4 ++-- .../web/src/graphql/mutations/update-flow.ts | 4 ++-- .../web/src/graphql/mutations/update-step.ts | 2 +- .../src/graphql/mutations/verify-connection.ts | 4 ++-- .../web/src/helpers/authenticationSteps.ts | 2 +- 21 files changed, 67 insertions(+), 39 deletions(-) diff --git a/packages/backend/src/graphql/schema.graphql b/packages/backend/src/graphql/schema.graphql index e9aae99a..af127724 100644 --- a/packages/backend/src/graphql/schema.graphql +++ b/packages/backend/src/graphql/schema.graphql @@ -217,11 +217,25 @@ input DeleteFlowInput { } input CreateStepInput { - input: StepInput! + id: String + previousStepId: String + key: String + appKey: String + connection: StepConnectionInput + flow: StepFlowInput + parameters: JSONObject + previousStep: PreviousStepInput } input UpdateStepInput { - input: StepInput! + id: String + previousStepId: String + key: String + appKey: String + connection: StepConnectionInput + flow: StepFlowInput + parameters: JSONObject + previousStep: PreviousStepInput } input DeleteStepInput { diff --git a/packages/web/src/components/AddNewAppConnection/index.tsx b/packages/web/src/components/AddNewAppConnection/index.tsx index 8304dc66..d3bbabc8 100644 --- a/packages/web/src/components/AddNewAppConnection/index.tsx +++ b/packages/web/src/components/AddNewAppConnection/index.tsx @@ -33,7 +33,7 @@ export default function AddNewAppConnection(props: AddNewAppConnectionProps): Re const matchSmallScreens = useMediaQuery(theme.breakpoints.down('sm')); const formatMessage = useFormatMessage(); const [appName, setAppName] = React.useState(null); - const { data } = useQuery(GET_APPS, { variables: {name: appName } }); + const { data } = useQuery(GET_APPS, { variables: { name: appName } }); return ( diff --git a/packages/web/src/components/AppConnectionRow/index.tsx b/packages/web/src/components/AppConnectionRow/index.tsx index 913d7148..e6ed9bbc 100644 --- a/packages/web/src/components/AppConnectionRow/index.tsx +++ b/packages/web/src/components/AppConnectionRow/index.tsx @@ -55,7 +55,7 @@ function AppConnectionRow(props: AppConnectionRowProps): React.ReactElement { const onContextMenuAction = React.useCallback(async (event, action: { [key: string]: string }) => { if (action.type === 'delete') { await deleteConnection({ - variables: { id }, + variables: { input: { id } }, update: (cache) => { const connectionCacheId = cache.identify({ __typename: 'Connection', @@ -71,7 +71,7 @@ function AppConnectionRow(props: AppConnectionRowProps): React.ReactElement { enqueueSnackbar(formatMessage('connection.deletedMessage'), { variant: 'success' }); } else if (action.type === 'test') { setVerificationVisible(true); - testConnection({ variables: { id } }); + testConnection({ variables: { input: { id } } }); } }, [deleteConnection, id, testConnection, formatMessage, enqueueSnackbar]); diff --git a/packages/web/src/components/ChooseAccountSubstep/index.tsx b/packages/web/src/components/ChooseAccountSubstep/index.tsx index e7ff46e8..bfb60a44 100644 --- a/packages/web/src/components/ChooseAccountSubstep/index.tsx +++ b/packages/web/src/components/ChooseAccountSubstep/index.tsx @@ -50,12 +50,21 @@ function ChooseAccountSubstep(props: ChooseAccountSubstepProps): React.ReactElem loading: testResultLoading, refetch: retestConnection } - ] = useLazyQuery (TEST_CONNECTION, { variables: { id: connection?.id, }}); + ] = useLazyQuery( + TEST_CONNECTION, + { + variables: { + input: { id: connection?.id, } + } + } + ); React.useEffect(() => { if (connection?.id) { testConnection({ - variables: { id: connection?.id }, + variables: { + input: { id: connection.id, } + } }); } // intentionally no dependencies for initial test @@ -88,7 +97,9 @@ function ChooseAccountSubstep(props: ChooseAccountSubstepProps): React.ReactElem React.useEffect(() => { if (step.connection?.id) { retestConnection({ - id: step.connection.id, + input: { + id: step.connection.id, + }, }); } }, [step.connection?.id, retestConnection]) diff --git a/packages/web/src/components/EditorLayout/index.tsx b/packages/web/src/components/EditorLayout/index.tsx index 42e08a8d..2ac43a78 100644 --- a/packages/web/src/components/EditorLayout/index.tsx +++ b/packages/web/src/components/EditorLayout/index.tsx @@ -27,8 +27,10 @@ export default function EditorLayout(): React.ReactElement { const onFlowNameUpdate = React.useCallback(async (name: string) => { await updateFlow({ variables: { - id: flowId, - name, + input: { + id: flowId, + name, + }, }, optimisticResponse: { __typename: 'Mutation', diff --git a/packages/web/src/components/FlowStep/index.tsx b/packages/web/src/components/FlowStep/index.tsx index c8f99295..6bb0c1de 100644 --- a/packages/web/src/components/FlowStep/index.tsx +++ b/packages/web/src/components/FlowStep/index.tsx @@ -51,8 +51,6 @@ export default function FlowStep(props: FlowStepProps): React.ReactElement | nul { data: stepWithTestExecutionsData, called: stepWithTestExecutionsCalled, - loading: stepWithTestExecutionsLoading, - error: stepWithTestExecutionsError }, ] = useLazyQuery(GET_STEP_WITH_TEST_EXECUTIONS, { fetchPolicy: 'network-only', @@ -62,7 +60,9 @@ export default function FlowStep(props: FlowStepProps): React.ReactElement | nul if (!stepWithTestExecutionsCalled && !collapsed && !isTrigger) { getStepWithTestExecutions({ variables: { - stepId: step.id, + input: { + stepId: step.id, + }, }, }); } diff --git a/packages/web/src/components/FlowStepContextMenu/index.tsx b/packages/web/src/components/FlowStepContextMenu/index.tsx index 8857f0c5..8b8a05e1 100644 --- a/packages/web/src/components/FlowStepContextMenu/index.tsx +++ b/packages/web/src/components/FlowStepContextMenu/index.tsx @@ -21,7 +21,7 @@ function FlowStepContextMenu(props: FlowStepContextMenuProps): React.ReactElemen const deleteActionHandler = React.useCallback(async (event: React.SyntheticEvent) => { event.stopPropagation(); - await deleteStep({ variables: { id: stepId }}); + await deleteStep({ variables: { input: { id: stepId } } }); }, [stepId]); return ( diff --git a/packages/web/src/components/TestSubstep/index.tsx b/packages/web/src/components/TestSubstep/index.tsx index d9cec8cd..66da2cb7 100644 --- a/packages/web/src/components/TestSubstep/index.tsx +++ b/packages/web/src/components/TestSubstep/index.tsx @@ -39,8 +39,10 @@ function TestSubstep(props: TestSubstepProps): React.ReactElement { const handleSubmit = React.useCallback(() => { executeFlow({ variables: { - stepId: step.id, - } + input: { + stepId: step.id, + }, + }, }) }, [onSubmit, step.id]); const onToggle = expanded ? onCollapse : onExpand; diff --git a/packages/web/src/graphql/mutations/create-auth-data.ts b/packages/web/src/graphql/mutations/create-auth-data.ts index d7f03d59..e8b416b2 100644 --- a/packages/web/src/graphql/mutations/create-auth-data.ts +++ b/packages/web/src/graphql/mutations/create-auth-data.ts @@ -1,8 +1,8 @@ import { gql } from '@apollo/client'; export const CREATE_AUTH_DATA = gql` - mutation createAuthData($id: String!) { - createAuthData(id: $id) { + mutation CreateAuthData($input: CreateAuthDataInput) { + createAuthData(input: $input) { url } } diff --git a/packages/web/src/graphql/mutations/create-connection.ts b/packages/web/src/graphql/mutations/create-connection.ts index ade3f3e6..9e89b3f6 100644 --- a/packages/web/src/graphql/mutations/create-connection.ts +++ b/packages/web/src/graphql/mutations/create-connection.ts @@ -2,10 +2,9 @@ import { gql } from '@apollo/client'; export const CREATE_CONNECTION = gql` mutation CreateConnection( - $key: AvailableAppsEnumType! - $formattedData: JSONObject! + $input: CreateConnectionInput ) { - createConnection(key: $key, formattedData: $formattedData) { + createConnection(input: $input) { id key verified diff --git a/packages/web/src/graphql/mutations/create-flow.ts b/packages/web/src/graphql/mutations/create-flow.ts index 317fc591..befefa3d 100644 --- a/packages/web/src/graphql/mutations/create-flow.ts +++ b/packages/web/src/graphql/mutations/create-flow.ts @@ -1,7 +1,7 @@ import { gql } from '@apollo/client'; export const CREATE_FLOW = gql` - mutation createFlow($input: FlowInput) { + mutation CreateFlow($input: CreateFlowInput) { createFlow(input: $input) { id name diff --git a/packages/web/src/graphql/mutations/create-step.ts b/packages/web/src/graphql/mutations/create-step.ts index 88e0969b..59bf3b91 100644 --- a/packages/web/src/graphql/mutations/create-step.ts +++ b/packages/web/src/graphql/mutations/create-step.ts @@ -1,7 +1,7 @@ import { gql } from '@apollo/client'; export const CREATE_STEP = gql` - mutation CreateStep($input: StepInput!) { + mutation CreateStep($input: CreateStepInput) { createStep(input: $input) { id type diff --git a/packages/web/src/graphql/mutations/delete-connection.ts b/packages/web/src/graphql/mutations/delete-connection.ts index 8020a5a6..56e387e2 100644 --- a/packages/web/src/graphql/mutations/delete-connection.ts +++ b/packages/web/src/graphql/mutations/delete-connection.ts @@ -1,7 +1,7 @@ import { gql } from '@apollo/client'; export const DELETE_CONNECTION = gql` - mutation DeleteConnection($id: String!) { - deleteConnection(id: $id) + mutation DeleteConnection($input: DeleteConnectionInput) { + deleteConnection(input: $input) } `; diff --git a/packages/web/src/graphql/mutations/delete-step.ts b/packages/web/src/graphql/mutations/delete-step.ts index e2291b7c..5861327b 100644 --- a/packages/web/src/graphql/mutations/delete-step.ts +++ b/packages/web/src/graphql/mutations/delete-step.ts @@ -1,8 +1,8 @@ import { gql } from '@apollo/client'; export const DELETE_STEP = gql` - mutation DeleteStep($id: String!) { - deleteStep(id: $id) { + mutation DeleteStep($input: DeleteStepInput) { + deleteStep(input: $input) { id flow { id diff --git a/packages/web/src/graphql/mutations/execute-flow.ts b/packages/web/src/graphql/mutations/execute-flow.ts index 5c182c87..43b7aa46 100644 --- a/packages/web/src/graphql/mutations/execute-flow.ts +++ b/packages/web/src/graphql/mutations/execute-flow.ts @@ -1,8 +1,8 @@ import { gql } from '@apollo/client'; export const EXECUTE_FLOW = gql` - mutation ExecuteFlow($stepId: String!) { - executeFlow(stepId: $stepId) { + mutation ExecuteFlow($input: ExecuteFlowInput) { + executeFlow(input: $input) { step { id status diff --git a/packages/web/src/graphql/mutations/reset-connection.ts b/packages/web/src/graphql/mutations/reset-connection.ts index 7b4f6686..35782742 100644 --- a/packages/web/src/graphql/mutations/reset-connection.ts +++ b/packages/web/src/graphql/mutations/reset-connection.ts @@ -1,8 +1,8 @@ import { gql } from '@apollo/client'; export const RESET_CONNECTION = gql` - mutation ResetConnection($id: String!) { - resetConnection(id: $id) { + mutation ResetConnection($input: ResetConnectionInput) { + resetConnection(input: $input) { id } } diff --git a/packages/web/src/graphql/mutations/update-connection.ts b/packages/web/src/graphql/mutations/update-connection.ts index 46efb39b..72f2e181 100644 --- a/packages/web/src/graphql/mutations/update-connection.ts +++ b/packages/web/src/graphql/mutations/update-connection.ts @@ -1,8 +1,8 @@ import { gql } from '@apollo/client'; export const UPDATE_CONNECTION = gql` - mutation UpdateConnection($id: String!, $formattedData: JSONObject!) { - updateConnection(id: $id, formattedData: $formattedData) { + mutation UpdateConnection($input: UpdateConnectionInput) { + updateConnection(input: $input) { id key verified diff --git a/packages/web/src/graphql/mutations/update-flow.ts b/packages/web/src/graphql/mutations/update-flow.ts index 58eca4b5..9988cc91 100644 --- a/packages/web/src/graphql/mutations/update-flow.ts +++ b/packages/web/src/graphql/mutations/update-flow.ts @@ -1,8 +1,8 @@ import { gql } from '@apollo/client'; export const UPDATE_FLOW = gql` - mutation UpdateFlow($id: String!, $name: String!) { - updateFlow(id: $id, name: $name) { + mutation UpdateFlow($input: UpdateFlowInput) { + updateFlow(input: $input) { id name } diff --git a/packages/web/src/graphql/mutations/update-step.ts b/packages/web/src/graphql/mutations/update-step.ts index d6b53c1e..673eb345 100644 --- a/packages/web/src/graphql/mutations/update-step.ts +++ b/packages/web/src/graphql/mutations/update-step.ts @@ -1,7 +1,7 @@ import { gql } from '@apollo/client'; export const UPDATE_STEP = gql` - mutation UpdateStep($input: StepInput!) { + mutation UpdateStep($input: UpdateStepInput) { updateStep(input: $input) { id type diff --git a/packages/web/src/graphql/mutations/verify-connection.ts b/packages/web/src/graphql/mutations/verify-connection.ts index 6e8684ab..7e4a7dbc 100644 --- a/packages/web/src/graphql/mutations/verify-connection.ts +++ b/packages/web/src/graphql/mutations/verify-connection.ts @@ -1,8 +1,8 @@ import { gql } from '@apollo/client'; export const VERIFY_CONNECTION = gql` - mutation VerifyConnection($id: String!) { - verifyConnection(id: $id) { + mutation VerifyConnection($input: VerifyConnectionInput) { + verifyConnection(input: $input) { id verified formattedData { diff --git a/packages/web/src/helpers/authenticationSteps.ts b/packages/web/src/helpers/authenticationSteps.ts index 08fead94..1a051545 100644 --- a/packages/web/src/helpers/authenticationSteps.ts +++ b/packages/web/src/helpers/authenticationSteps.ts @@ -10,7 +10,7 @@ enum AuthenticationSteps { const processMutation = async (step: IAuthenticationStep, variables: IJSONObject) => { const mutation = MUTATIONS[step.name]; - const mutationResponse = await apolloClient.mutate({ mutation, variables }); + const mutationResponse = await apolloClient.mutate({ mutation, variables: { input: variables } }); const responseData = mutationResponse.data[step.name]; return responseData;