diff --git a/packages/web/src/graphql/mutations/update-config.ee.js b/packages/web/src/graphql/mutations/update-config.ee.js deleted file mode 100644 index b916c62f..00000000 --- a/packages/web/src/graphql/mutations/update-config.ee.js +++ /dev/null @@ -1,6 +0,0 @@ -import { gql } from '@apollo/client'; -export const UPDATE_CONFIG = gql` - mutation UpdateConfig($input: JSONObject) { - updateConfig(input: $input) - } -`; diff --git a/packages/web/src/hooks/useAdminUpdateConfig.js b/packages/web/src/hooks/useAdminUpdateConfig.js new file mode 100644 index 00000000..03325253 --- /dev/null +++ b/packages/web/src/hooks/useAdminUpdateConfig.js @@ -0,0 +1,21 @@ +import { useMutation, useQueryClient } from '@tanstack/react-query'; +import api from 'helpers/api'; + +export default function useAdminUpdateConfig(appKey) { + const queryClient = useQueryClient(); + + const query = useMutation({ + mutationFn: async (payload) => { + const { data } = await api.patch(`/v1/admin/config`, payload); + + return data; + }, + onSuccess: () => { + queryClient.invalidateQueries({ + queryKey: ['automatisch', 'config'], + }); + }, + }); + + return query; +} diff --git a/packages/web/src/pages/UserInterface/index.jsx b/packages/web/src/pages/UserInterface/index.jsx index cf5bdd19..5c528e10 100644 --- a/packages/web/src/pages/UserInterface/index.jsx +++ b/packages/web/src/pages/UserInterface/index.jsx @@ -1,19 +1,17 @@ -import { useMutation } from '@apollo/client'; import LoadingButton from '@mui/lab/LoadingButton'; import Grid from '@mui/material/Grid'; import Skeleton from '@mui/material/Skeleton'; import Stack from '@mui/material/Stack'; import merge from 'lodash/merge'; import * as React from 'react'; -import { useQueryClient } from '@tanstack/react-query'; import ColorInput from 'components/ColorInput'; import Container from 'components/Container'; import Form from 'components/Form'; import PageTitle from 'components/PageTitle'; import TextField from 'components/TextField'; -import { UPDATE_CONFIG } from 'graphql/mutations/update-config.ee'; import nestObject from 'helpers/nestObject'; +import useAdminUpdateConfig from 'hooks/useAdminUpdateConfig'; import useAutomatischConfig from 'hooks/useAutomatischConfig'; import useFormatMessage from 'hooks/useFormatMessage'; import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar'; @@ -36,10 +34,9 @@ const defaultValues = { export default function UserInterface() { const formatMessage = useFormatMessage(); - const [updateConfig, { loading }] = useMutation(UPDATE_CONFIG); + const { mutateAsync: updateConfig, isPending } = useAdminUpdateConfig(); const { data: configData, isLoading: configLoading } = useAutomatischConfig(); const config = configData?.data; - const queryClient = useQueryClient(); const enqueueSnackbar = useEnqueueSnackbar(); const configWithDefaults = merge({}, defaultValues, nestObject(config)); @@ -58,19 +55,7 @@ export default function UserInterface() { ), 'logo.svgData': uiData?.logo?.svgData, }; - await updateConfig({ - variables: { - input, - }, - optimisticResponse: { - updateConfig: input, - }, - update: async function () { - queryClient.invalidateQueries({ - queryKey: ['automatisch', 'config'], - }); - }, - }); + await updateConfig(input); enqueueSnackbar(formatMessage('userInterfacePage.successfullyUpdated'), { variant: 'success', SnackbarProps: { @@ -150,7 +135,7 @@ export default function UserInterface() { variant="contained" color="primary" sx={{ boxShadow: 2 }} - loading={loading} + loading={isPending} data-test="update-button" > {formatMessage('userInterfacePage.submit')}