diff --git a/front/src/components/Article.graphql b/front/src/components/Article.graphql
index f9aa99005..946dc5c92 100644
--- a/front/src/components/Article.graphql
+++ b/front/src/components/Article.graphql
@@ -1,11 +1,11 @@
-query renameArticle($article: ID!, $title: String!) {
-  article(article: $article) {
+query renameArticle($articleId: ID!, $title: String!) {
+  article(article: $articleId) {
     rename(title: $title)
   }
 }
 
-query linkToZotero($article: ID!, $zotero: String!) {
-  article(article: $article) {
+query linkToZotero($articleId: ID!, $zotero: String!) {
+  article(article: $articleId) {
     setZoteroLink(zotero: $zotero)
   }
 }
@@ -46,14 +46,14 @@ query getArticleContributors($articleId: ID!) {
   }
 }
 
-query deleteArticle($article: ID!) {
-  article(article: $article) {
+query deleteArticle($articleId: ID!) {
+  article(article: $articleId) {
     delete(dryRun: false)
   }
 }
 
-mutation duplicateArticle($user: ID, $article: ID!, $to: ID!) {
-  duplicateArticle(article: $article, to: $to, user: $user) {
+mutation duplicateArticle($user: ID, $articleId: ID!, $to: ID!) {
+  duplicateArticle(article: $articleId, to: $to, user: $user) {
     _id
     title
     createdAt
@@ -61,8 +61,8 @@ mutation duplicateArticle($user: ID, $article: ID!, $to: ID!) {
   }
 }
 
-query addTags($article: ID!, $tags: [ID]!) {
-  article(article: $article) {
+query addTags($articleId: ID!, $tags: [ID]!) {
+  article(article: $articleId) {
     addTags(tags: $tags) {
       _id
       name
@@ -71,8 +71,8 @@ query addTags($article: ID!, $tags: [ID]!) {
   }
 }
 
-query removeTags($article: ID!, $tags: [ID]!) {
-  article(article: $article) {
+query removeTags($articleId: ID!, $tags: [ID]!) {
+  article(article: $articleId) {
     removeTags(tags: $tags) {
       _id
       name
diff --git a/front/src/components/Article.jsx b/front/src/components/Article.jsx
index 58393914d..1280a5e03 100644
--- a/front/src/components/Article.jsx
+++ b/front/src/components/Article.jsx
@@ -38,23 +38,18 @@ import {
   UserPlus,
 } from 'react-feather'
 
-import {
-  duplicateArticle,
-  renameArticle,
-  deleteArticle,
-  getArticleTags,
-  getArticleContributors,
-} from './Article.graphql'
+import { getArticleTags, getArticleContributors } from './Article.graphql'
 import SoloSessionAction from './solo/SoloSessionAction.jsx'
 
 import { getTags } from './Tag.graphql'
 
-import useGraphQL, { useMutation } from '../hooks/graphql'
+import useFetchData from '../hooks/graphql'
 import TimeAgo from './TimeAgo.jsx'
 import WorkspaceSelectionItems from './workspace/WorkspaceSelectionItems.jsx'
 import { useSelector } from 'react-redux'
 import ArticleContributors from './ArticleContributors.jsx'
 import ArticleSendCopy from './ArticleSendCopy.jsx'
+import { useArticleActions } from '../hooks/article.js'
 
 export default function Article({
   article,
@@ -69,22 +64,24 @@ export default function Article({
     () => activeWorkspace?._id,
     [activeWorkspace]
   )
-
-  const { data: contributorsQueryData, error: contributorsError } = useGraphQL(
-    { query: getArticleContributors, variables: { articleId } },
-    {
-      fallbackData: {
-        article,
-      },
-      revalidateIfStale: false,
-      revalidateOnFocus: false,
-      revalidateOnReconnect: false,
-    }
-  )
+  const articleActions = useArticleActions({ articleId })
+
+  const { data: contributorsQueryData, error: contributorsError } =
+    useFetchData(
+      { query: getArticleContributors, variables: { articleId } },
+      {
+        fallbackData: {
+          article,
+        },
+        revalidateIfStale: false,
+        revalidateOnFocus: false,
+        revalidateOnReconnect: false,
+      }
+    )
   const contributors = (
     contributorsQueryData?.article?.contributors || []
   ).filter((c) => c.user._id !== article.owner._id)
-  const { data: userTagsQueryData } = useGraphQL(
+  const { data: userTagsQueryData } = useFetchData(
     { query: getTags, variables: {} },
     {
       revalidateIfStale: false,
@@ -93,7 +90,7 @@ export default function Article({
     }
   )
   const userTags = userTagsQueryData?.user?.tags || []
-  const { data: articleTagsQueryData } = useGraphQL(
+  const { data: articleTagsQueryData } = useFetchData(
     { query: getArticleTags, variables: { articleId } },
     {
       fallbackData: {
@@ -113,7 +110,6 @@ export default function Article({
     bindings: deleteArticleModalBinding,
   } = useModal()
 
-  const mutation = useMutation()
   const [expanded, setExpanded] = useState(false)
   const [exporting, setExporting] = useState(false)
   const [renaming, setRenaming] = useState(false)
@@ -144,14 +140,7 @@ export default function Article({
   )
 
   const duplicate = async () => {
-    const duplicatedArticleQuery = await mutation({
-      query: duplicateArticle,
-      variables: {
-        user: activeUser._id,
-        to: activeUser._id,
-        article: articleId,
-      },
-    })
+    const duplicatedArticleQuery = await articleActions.duplicate()
     onArticleCreated({
       ...article,
       ...duplicatedArticleQuery.duplicateArticle,
@@ -162,10 +151,7 @@ export default function Article({
 
   const rename = async (e) => {
     e.preventDefault()
-    await mutation({
-      query: renameArticle,
-      variables: { user: activeUser._id, article: articleId, title: newTitle },
-    })
+    await articleActions.rename(newTitle)
     onArticleUpdated({
       ...article,
       title: newTitle,
@@ -175,10 +161,7 @@ export default function Article({
 
   const handleDeleteArticle = async () => {
     try {
-      await mutation({
-        query: deleteArticle,
-        variables: { article: articleId },
-      })
+      await articleActions.remove()
       onArticleDeleted(article)
       setToast({
         type: 'default',
diff --git a/front/src/components/ArticleSendCopy.jsx b/front/src/components/ArticleSendCopy.jsx
index de1e7520f..771aa9864 100644
--- a/front/src/components/ArticleSendCopy.jsx
+++ b/front/src/components/ArticleSendCopy.jsx
@@ -4,25 +4,20 @@ import { useToasts } from '@geist-ui/core'
 import { Send } from 'react-feather'
 import { useTranslation } from 'react-i18next'
 
-import { duplicateArticle } from './Article.graphql'
-
 import styles from './articleSendCopy.module.scss'
 import ContactSearch from './ContactSearch.jsx'
-import { useMutation } from '../hooks/graphql.js'
+import { useArticleActions } from '../hooks/article.js'
 
 export default function ArticleSendCopy({ article }) {
   const { setToast } = useToasts()
-  const mutation = useMutation()
+  const { copy } = useArticleActions({ articleId: article._id })
   const { t } = useTranslation()
 
   const handleUserUpdated = useCallback(
     async ({ user, action }) => {
       if (action === 'select' || action === 'unselect') {
         try {
-          await mutation({
-            query: duplicateArticle,
-            variables: { user: null, to: user._id, article: article._id },
-          })
+          await copy(user._id)
           setToast({
             text: t('article.sendCopy.successNotification', {
               username: user.displayName || user.username,
diff --git a/front/src/components/ArticleTags.jsx b/front/src/components/ArticleTags.jsx
index 6ab4a7261..a8bfe3969 100644
--- a/front/src/components/ArticleTags.jsx
+++ b/front/src/components/ArticleTags.jsx
@@ -1,47 +1,23 @@
 import { Loading } from '@geist-ui/core'
 import React, { useCallback } from 'react'
-import useGraphQL, { useMutation } from '../hooks/graphql'
 
 import ArticleTag from './Tag'
 
-import { addTags, removeTags, getArticleTags } from './Article.graphql'
+import { useArticleTagActions } from '../hooks/article.js'
 
 export default function ArticleTags({
   articleId,
   userTags,
   onArticleTagsUpdated,
 }) {
-  const { data, isLoading, mutate } = useGraphQL(
-    { query: getArticleTags, variables: { articleId } },
-    {
-      revalidateOnFocus: false,
-      revalidateOnReconnect: false,
-    }
-  )
-  const mutation = useMutation()
-
-  const articleTags = data?.article?.tags || []
-  const articleTagIds = articleTags.map(({ _id }) => _id)
+  const { tags, isLoading, error, remove, add } = useArticleTagActions({
+    articleId,
+  })
 
   const handleClick = useCallback(
     async (event) => {
       const [id, checked] = [event.target.value, event.target.checked]
-      const query = checked ? addTags : removeTags
-      const result = await mutation({
-        query,
-        variables: { article: articleId, tags: [id] },
-      })
-      const updatedTags = checked
-        ? result.article.addTags
-        : result.article.removeTags
-      mutate(
-        {
-          article: {
-            tags: updatedTags,
-          },
-        },
-        { revalidate: false }
-      )
+      const updatedTags = checked ? await add(id) : await remove(id)
       onArticleTagsUpdated({ articleId, updatedTags })
     },
     [articleId]
@@ -51,6 +27,11 @@ export default function ArticleTags({
     return <Loading />
   }
 
+  if (error) {
+    return <div>Error: {error.message}</div>
+  }
+
+  const articleTagIds = tags.map(({ _id }) => _id)
   return (
     <ul>
       {userTags.map((tag) => (
diff --git a/front/src/components/ArticleVersionLinks.jsx b/front/src/components/ArticleVersionLinks.jsx
index ab87c9918..85c4831ff 100644
--- a/front/src/components/ArticleVersionLinks.jsx
+++ b/front/src/components/ArticleVersionLinks.jsx
@@ -3,7 +3,7 @@ import clsx from 'clsx'
 import React, { useMemo } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Link } from 'react-router-dom'
-import useGraphQL from '../hooks/graphql.js'
+import useFetchData from '../hooks/graphql.js'
 import styles from './articleVersionLinks.module.scss'
 
 import { getArticleVersions } from './Article.graphql'
@@ -11,7 +11,7 @@ import TimeAgo from './TimeAgo.jsx'
 
 export default function ArticleVersionLinks({ articleId, article }) {
   const { t } = useTranslation()
-  const { data, isLoading } = useGraphQL(
+  const { data, isLoading } = useFetchData(
     {
       query: getArticleVersions,
       variables: { articleId },
diff --git a/front/src/components/Articles.jsx b/front/src/components/Articles.jsx
index 11cdc949f..1be3ee0fc 100644
--- a/front/src/components/Articles.jsx
+++ b/front/src/components/Articles.jsx
@@ -5,7 +5,7 @@ import { useSelector } from 'react-redux'
 import { Search } from 'react-feather'
 import { Helmet } from 'react-helmet'
 
-import useGraphQL from '../hooks/graphql'
+import useFetchData from '../hooks/graphql'
 import { applicationConfig } from '../config.js'
 import { getUserArticles, getWorkspaceArticles } from './Articles.graphql'
 import etv from '../helpers/eventTargetValue'
@@ -51,7 +51,7 @@ export default function Articles() {
         : { user: activeUserId },
     [activeWorkspaceId]
   )
-  const { data, isLoading, mutate } = useGraphQL(
+  const { data, isLoading, mutate } = useFetchData(
     { query, variables },
     {
       revalidateOnFocus: false,
diff --git a/front/src/components/ContactSearch.jsx b/front/src/components/ContactSearch.jsx
index d397ffdc2..d82f0d3f7 100644
--- a/front/src/components/ContactSearch.jsx
+++ b/front/src/components/ContactSearch.jsx
@@ -3,19 +3,14 @@ import { CheckSquare, Search, Square } from 'react-feather'
 import React, { useCallback, useEffect, useMemo, useState } from 'react'
 import { useSelector } from 'react-redux'
 import debounce from 'lodash.debounce'
-import useGraphQL, { useMutation } from '../hooks/graphql.js'
 import { useTranslation } from 'react-i18next'
 
 import styles from './ContactSearch.module.scss'
 import Field from './Field.jsx'
 
-import {
-  addContact,
-  removeContact,
-  getUserByEmail,
-  getContacts,
-} from './Contacts.graphql'
+import { getUserByEmail } from './Contacts.graphql'
 import ContactItem from './ContactItem.jsx'
+import { useContactActions } from '../hooks/contact.js'
 
 /**
  * @param members
@@ -36,20 +31,7 @@ export default function ContactSearch({
   const { t } = useTranslation()
   const activeUser = useSelector((state) => state.activeUser)
   const activeUserId = activeUser._id
-  const { data: userContactsQueryData, mutate: mutateUserContacts } =
-    useGraphQL(
-      { query: getContacts, variables: { userId: activeUserId } },
-      {
-        revalidateIfStale: false,
-        revalidateOnFocus: false,
-        revalidateOnReconnect: false,
-      }
-    )
-  const mutation = useMutation()
-  const userContacts = useMemo(
-    () => userContactsQueryData?.user?.acquintances || [],
-    [userContactsQueryData]
-  )
+  const { contacts: userContacts, add, remove } = useContactActions()
   const [filter, setFilter] = useState('')
   const [contacts, setContacts] = useState([])
   const [userFound, setUserFound] = useState(null)
@@ -86,27 +68,9 @@ export default function ContactSearch({
         }
       }
       if (event.action === 'active') {
-        const response = await mutation({
-          query: addContact,
-          variables: { userId: activeUserId, contactId: userId },
-        })
-        const updatedContacts = {
-          user: {
-            acquintances: response.user.addContact.acquintances,
-          },
-        }
-        await mutateUserContacts(updatedContacts, { revalidate: false })
+        await add(userId)
       } else if (event.action === 'inactive') {
-        const response = await mutation({
-          query: removeContact,
-          variables: { userId: activeUserId, contactId: userId },
-        })
-        const updatedContacts = {
-          user: {
-            acquintances: response.user.removeContact.acquintances,
-          },
-        }
-        await mutateUserContacts(updatedContacts, { revalidate: false })
+        await remove(userId)
       }
       onUserUpdated && onUserUpdated(event)
     },
diff --git a/front/src/components/Preview.jsx b/front/src/components/Preview.jsx
index 6d46952d4..7516bf4e0 100644
--- a/front/src/components/Preview.jsx
+++ b/front/src/components/Preview.jsx
@@ -5,7 +5,7 @@ import { Helmet } from 'react-helmet'
 
 import { useStyloExportPreview } from '../hooks/stylo-export.js'
 import { toYaml } from './Write/metadata/yaml.js'
-import useGraphQL from '../hooks/graphql.js'
+import useFetchData from '../hooks/graphql.js'
 import { applicationConfig } from '../config.js'
 
 import * as queries from './Preview.graphql'
@@ -131,7 +131,7 @@ export default function Preview({ strategy: strategyId }) {
     return () => document.body.removeChild(script)
   }, [])
 
-  const { data, isLoading: isDataLoading } = useGraphQL(
+  const { data, isLoading: isDataLoading } = useFetchData(
     strategy.query({ id, version, workspaceId }),
     {
       revalidateOnFocus: false,
diff --git a/front/src/components/TagCreate.jsx b/front/src/components/TagCreate.jsx
index 8aa08a5ee..e33034070 100644
--- a/front/src/components/TagCreate.jsx
+++ b/front/src/components/TagCreate.jsx
@@ -3,24 +3,20 @@ import React, { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
 
 import { randomColor } from '../helpers/colors.js'
-import { useGraphQLClient } from '../helpers/graphQL'
-import { useMutate } from '../hooks/graphql'
-import { createTag, getTags } from './Tag.graphql'
 
 import styles from './TagCreate.module.scss'
 import Field from './Field'
+import { useUserTagActions } from '../hooks/user.js'
 
 export default function TagCreate() {
   const { setToast } = useToasts()
-  const { data, mutate } = useMutate({ query: getTags, variables: {} })
+  const { create: createTag } = useUserTagActions()
   const { t } = useTranslation()
   const { state: name, bindings: nameBindings } = useInput('')
   const { state: description, bindings: descriptionBindings } = useInput('')
   const { state: color, bindings: colorBindings } = useInput(randomColor())
 
-  const { query } = useGraphQLClient()
-
-  const variables = {
+  const tag = {
     name,
     description,
     color,
@@ -31,18 +27,7 @@ export default function TagCreate() {
       event.preventDefault()
       ;(async () => {
         try {
-          const result = await query({
-            query: createTag,
-            variables,
-          })
-          await mutate(
-            {
-              user: {
-                tags: [...data.user.tags, result.createTag],
-              },
-            },
-            { revalidate: false }
-          )
+          await createTag(tag)
         } catch (err) {
           setToast({
             type: 'error',
@@ -51,7 +36,7 @@ export default function TagCreate() {
         }
       })()
     },
-    [variables]
+    [tag]
   )
 
   return (
diff --git a/front/src/components/Write/CreateVersion.jsx b/front/src/components/Write/CreateVersion.jsx
index db3616aa3..36a30a1f1 100644
--- a/front/src/components/Write/CreateVersion.jsx
+++ b/front/src/components/Write/CreateVersion.jsx
@@ -7,17 +7,16 @@ import { ArrowLeft } from 'react-feather'
 import { createVersion } from '../../services/ArticleService.graphql'
 import { useTranslation } from 'react-i18next'
 
-import { useMutation } from '../../hooks/graphql.js'
-
 import styles from './createVersion.module.scss'
 import buttonStyles from '../button.module.scss'
 import Button from '../Button'
 import Field from '../Field'
+import { useGraphQLClient } from '../../helpers/graphQL.js'
 
 const CreateVersion = ({ articleId, readOnly, onClose }) => {
   const { t } = useTranslation()
   const { setToast } = useToasts()
-  const mutation = useMutation()
+  const { query } = useGraphQLClient()
   const activeUser = useSelector((state) => state.activeUser)
   const dispatch = useDispatch()
   const [message, setMessage] = useState('')
@@ -25,7 +24,7 @@ const CreateVersion = ({ articleId, readOnly, onClose }) => {
     async (e, major = false) => {
       e.preventDefault()
       try {
-        const response = await mutation({
+        const response = await query({
           query: createVersion,
           variables: {
             userId: activeUser._id,
diff --git a/front/src/components/Write/Write.jsx b/front/src/components/Write/Write.jsx
index 2ebf0a70b..55beba2e7 100644
--- a/front/src/components/Write/Write.jsx
+++ b/front/src/components/Write/Write.jsx
@@ -13,7 +13,6 @@ import { useParams } from 'react-router-dom'
 import PropTypes from 'prop-types'
 import throttle from 'lodash.throttle'
 import debounce from 'lodash.debounce'
-import { useMutation } from '../../hooks/graphql.js'
 import { applicationConfig } from '../../config.js'
 import ArticleStats from '../ArticleStats.jsx'
 import ErrorMessageCard from '../ErrorMessageCard.jsx'
@@ -90,8 +89,6 @@ export default function Write() {
     preview: {},
   })
 
-  const mutation = useMutation()
-
   const {
     visible: collaborativeSessionActiveVisible,
     setVisible: setCollaborativeSessionActiveVisible,
@@ -304,7 +301,7 @@ export default function Write() {
 
     return async () => {
       try {
-        await mutation({ query: stopSoloSession, variables: { articleId } })
+        await query({ query: stopSoloSession, variables: { articleId } })
       } catch (err) {
         if (
           err &&
diff --git a/front/src/components/Write/bibliographe/ZoteroPanel.jsx b/front/src/components/Write/bibliographe/ZoteroPanel.jsx
index 40cbc0979..a70e03924 100644
--- a/front/src/components/Write/bibliographe/ZoteroPanel.jsx
+++ b/front/src/components/Write/bibliographe/ZoteroPanel.jsx
@@ -75,7 +75,7 @@ export default function ZoteroPanel({
         const variables = {
           zotero: zoteroLink,
           user: userId,
-          article: articleId,
+          articleId,
         }
         await query({ query: linkToZoteroQuery, variables })
       } catch (err) {
diff --git a/front/src/components/collaborative/CollaborativeEditor.jsx b/front/src/components/collaborative/CollaborativeEditor.jsx
index 10ca3cb5d..1399bfb60 100644
--- a/front/src/components/collaborative/CollaborativeEditor.jsx
+++ b/front/src/components/collaborative/CollaborativeEditor.jsx
@@ -1,7 +1,7 @@
 import { Loading } from '@geist-ui/core'
 import React, { useCallback } from 'react'
 import { useParams } from 'react-router-dom'
-import useGraphQL from '../../hooks/graphql.js'
+import useFetchData from '../../hooks/graphql.js'
 import ArticleStats from '../ArticleStats.jsx'
 
 import { getCollaborativeSession } from './CollaborativeSession.graphql'
@@ -19,7 +19,7 @@ export default function CollaborativeEditor() {
     data: collaborativeSessionData,
     isLoading: collaborativeSessionLoading,
     mutate: mutateCollaborativeSession,
-  } = useGraphQL({ query: getCollaborativeSession, variables: { articleId } })
+  } = useFetchData({ query: getCollaborativeSession, variables: { articleId } })
 
   const handleCollaborativeSessionStateUpdated = useCallback(({ state }) => {
     if (state === 'ended') {
diff --git a/front/src/components/collaborative/CollaborativeEditorArticleHeader.jsx b/front/src/components/collaborative/CollaborativeEditorArticleHeader.jsx
index fb8fb2682..019c8e990 100644
--- a/front/src/components/collaborative/CollaborativeEditorArticleHeader.jsx
+++ b/front/src/components/collaborative/CollaborativeEditorArticleHeader.jsx
@@ -12,7 +12,7 @@ import React, { useCallback } from 'react'
 import { AlignLeft, Eye, Printer } from 'react-feather'
 import { useDispatch, useSelector } from 'react-redux'
 
-import useGraphQL from '../../hooks/graphql.js'
+import useFetchData from '../../hooks/graphql.js'
 import { getArticleInfo } from '../Article.graphql'
 import Button from '../Button.jsx'
 import buttonStyles from '../button.module.scss'
@@ -23,7 +23,7 @@ import styles from './CollaborativeEditorArticleHeader.module.scss'
 export default function CollaborativeEditorArticleHeader({ articleId }) {
   const dispatch = useDispatch()
   const articleStructure = useSelector((state) => state.articleStructure)
-  const { data, isLoading } = useGraphQL(
+  const { data, isLoading } = useFetchData(
     { query: getArticleInfo, variables: { articleId } },
     {
       revalidateIfStale: false,
diff --git a/front/src/components/collaborative/CollaborativeEditorStatus.jsx b/front/src/components/collaborative/CollaborativeEditorStatus.jsx
index 206778074..a8137b525 100644
--- a/front/src/components/collaborative/CollaborativeEditorStatus.jsx
+++ b/front/src/components/collaborative/CollaborativeEditorStatus.jsx
@@ -10,13 +10,13 @@ import React, { useCallback } from 'react'
 import { StopCircle } from 'react-feather'
 import { useTranslation } from 'react-i18next'
 import { useHistory } from 'react-router-dom'
-import { useMutation } from '../../hooks/graphql.js'
 import CollaborativeEditorWebSocketStatus from './CollaborativeEditorWebSocketStatus.jsx'
 import CollaborativeEditorWriters from './CollaborativeEditorWriters.jsx'
 
 import { stopCollaborativeSession } from './CollaborativeSession.graphql'
 
 import styles from './CollaborativeEditorStatus.module.scss'
+import { useGraphQLClient } from '../../helpers/graphQL.js'
 
 export default function CollaborativeEditorStatus({
   articleId,
@@ -24,7 +24,7 @@ export default function CollaborativeEditorStatus({
   collaborativeSessionState,
 }) {
   const { t } = useTranslation()
-  const mutation = useMutation()
+  const { query } = useGraphQLClient()
   const { setToast } = useToasts()
   const history = useHistory()
 
@@ -36,7 +36,7 @@ export default function CollaborativeEditorStatus({
 
   const handleEndCollaborativeSession = useCallback(async () => {
     try {
-      await mutation({
+      await query({
         query: stopCollaborativeSession,
         variables: { articleId },
       })
@@ -51,7 +51,7 @@ export default function CollaborativeEditorStatus({
         text: 'Unable to stop the collaborative session: ' + err.toString(),
       })
     }
-  }, [mutation])
+  }, [])
 
   const handleConfirmCollaborativeSessionEnd = useCallback(async () => {
     setCollaborativeSessionEndVisible(true)
diff --git a/front/src/components/collaborative/CollaborativeSessionAction.jsx b/front/src/components/collaborative/CollaborativeSessionAction.jsx
index 6a364dc0f..9022b5838 100644
--- a/front/src/components/collaborative/CollaborativeSessionAction.jsx
+++ b/front/src/components/collaborative/CollaborativeSessionAction.jsx
@@ -5,10 +5,9 @@ import { Users } from 'react-feather'
 import { useTranslation } from 'react-i18next'
 import { useHistory } from 'react-router-dom'
 
-import { useMutation } from '../../hooks/graphql.js'
-
 import { startCollaborativeSession } from '../Article.graphql'
 import Button from '../Button.jsx'
+import { useGraphQLClient } from '../../helpers/graphQL.js'
 
 export default function CollaborativeSessionAction({
   collaborativeSession,
@@ -16,7 +15,7 @@ export default function CollaborativeSessionAction({
 }) {
   const { t } = useTranslation()
   const history = useHistory()
-  const mutation = useMutation()
+  const { query } = useGraphQLClient()
   const {
     visible: collaborativeEditingVisible,
     setVisible: setCollaborativeEditingVisible,
@@ -30,7 +29,7 @@ export default function CollaborativeSessionAction({
       history.push(`/article/${articleId}/session/${collaborativeSession.id}`)
     } else {
       // start a new collaborative session
-      const data = await mutation({
+      const data = await query({
         query: startCollaborativeSession,
         variables: { articleId },
       })
diff --git a/front/src/components/corpus/CorpusArticleItems.jsx b/front/src/components/corpus/CorpusArticleItems.jsx
index fe4e7c234..1a8369bef 100644
--- a/front/src/components/corpus/CorpusArticleItems.jsx
+++ b/front/src/components/corpus/CorpusArticleItems.jsx
@@ -3,12 +3,12 @@ import debounce from 'lodash.debounce'
 import PropTypes from 'prop-types'
 import React, { useCallback, useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
-import { useMutation } from '../../hooks/graphql.js'
 import CorpusArticleCard from './CorpusArticleCard.jsx'
 
 import { updateArticlesOrder } from './Corpus.graphql'
 
 import styles from './corpusArticleItems.module.scss'
+import { useGraphQLClient } from '../../helpers/graphQL.js'
 
 export default function CorpusArticleItems({ corpusId, articles, onUpdate }) {
   const [isLoading, setLoading] = useState(true)
@@ -20,7 +20,7 @@ export default function CorpusArticleItems({ corpusId, articles, onUpdate }) {
       setLoading(false)
     }
   }, [articles])
-  const mutation = useMutation()
+  const { query } = useGraphQLClient()
   const { setToast } = useToasts()
   const { t } = useTranslation()
   const updateArticleOrder = useCallback(
@@ -31,7 +31,7 @@ export default function CorpusArticleItems({ corpusId, articles, onUpdate }) {
           order: index,
         }))
         try {
-          await mutation({
+          await query({
             query: updateArticlesOrder,
             variables: { corpusId, articlesOrderInput },
           })
diff --git a/front/src/components/corpus/CorpusArticles.jsx b/front/src/components/corpus/CorpusArticles.jsx
index 818f01f09..9d42b3379 100644
--- a/front/src/components/corpus/CorpusArticles.jsx
+++ b/front/src/components/corpus/CorpusArticles.jsx
@@ -5,7 +5,7 @@ import { HTML5Backend } from 'react-dnd-html5-backend'
 import { Info } from 'react-feather'
 import { Trans, useTranslation } from 'react-i18next'
 import { Link } from 'react-router-dom'
-import useGraphQL from '../../hooks/graphql.js'
+import useFetchData from '../../hooks/graphql.js'
 import { useActiveWorkspace } from '../../hooks/workspace.js'
 import CorpusArticleItems from './CorpusArticleItems.jsx'
 
@@ -20,7 +20,7 @@ export default function CorpusArticles({ corpusId }) {
     () => activeWorkspace?._id,
     [activeWorkspace]
   )
-  const { data, isLoading, mutate } = useGraphQL(
+  const { data, isLoading, mutate } = useFetchData(
     {
       query: getCorpus,
       variables: { filter: { corpusId: corpusId }, includeArticles: true },
diff --git a/front/src/components/corpus/CorpusSelectItems.jsx b/front/src/components/corpus/CorpusSelectItems.jsx
index e4d7d3f52..b8058fec9 100644
--- a/front/src/components/corpus/CorpusSelectItems.jsx
+++ b/front/src/components/corpus/CorpusSelectItems.jsx
@@ -1,7 +1,7 @@
 import PropTypes from 'prop-types'
 import { Loading } from '@geist-ui/core'
 import React, { useCallback, useMemo } from 'react'
-import useGraphQL from '../../hooks/graphql.js'
+import useFetchData from '../../hooks/graphql.js'
 import { useActiveWorkspace } from '../../hooks/workspace.js'
 import { getCorpus } from './Corpus.graphql'
 import CorpusSelectItem from './CorpusSelectItem.jsx'
@@ -20,7 +20,7 @@ export default function CorpusSelectItems({ articleId }) {
     [activeWorkspaceId]
   )
 
-  const { data, isLoading, mutate } = useGraphQL(
+  const { data, isLoading, mutate } = useFetchData(
     { query: getCorpus, variables },
     {
       revalidateOnFocus: false,
diff --git a/front/src/components/solo/SoloSessionAction.jsx b/front/src/components/solo/SoloSessionAction.jsx
index 2b18a0767..76b974027 100644
--- a/front/src/components/solo/SoloSessionAction.jsx
+++ b/front/src/components/solo/SoloSessionAction.jsx
@@ -5,10 +5,10 @@ import { Edit3 } from 'react-feather'
 import { useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
 import { useHistory } from 'react-router-dom'
-import { useMutation } from '../../hooks/graphql.js'
 import Button from '../Button.jsx'
 
 import { startSoloSession, takeOverSoloSession } from './SoloSession.graphql'
+import { useGraphQLClient } from '../../helpers/graphQL.js'
 
 export default function SoloSessionAction({
   collaborativeSession,
@@ -20,7 +20,7 @@ export default function SoloSessionAction({
   const { setToast } = useToasts()
   const history = useHistory()
   const [activeSoloSessionCreator, setActiveSoloSessionCreator] = useState('')
-  const mutation = useMutation()
+  const { query } = useGraphQLClient()
   const {
     visible: takeOverModalVisible,
     setVisible: setTakeOverModalVisible,
@@ -37,7 +37,7 @@ export default function SoloSessionAction({
     } else {
       // start a new solo session
       try {
-        await mutation({ query: startSoloSession, variables: { articleId } })
+        await query({ query: startSoloSession, variables: { articleId } })
         history.push(`/article/${articleId}`)
       } catch (err) {
         if (
@@ -60,7 +60,7 @@ export default function SoloSessionAction({
   }, [soloSession, setTakeOverModalVisible])
   const handleTakeOver = useCallback(async () => {
     try {
-      await mutation({ query: takeOverSoloSession, variables: { articleId } })
+      await query({ query: takeOverSoloSession, variables: { articleId } })
       setTakeOverModalVisible(false)
       history.push(`/article/${articleId}`)
     } catch (err) {
diff --git a/front/src/components/tag/TagsList.jsx b/front/src/components/tag/TagsList.jsx
index 0846019c3..897417bb3 100644
--- a/front/src/components/tag/TagsList.jsx
+++ b/front/src/components/tag/TagsList.jsx
@@ -8,7 +8,7 @@ import ArticleTag from '../Tag.jsx'
 import Button from '../Button.jsx'
 import TagCreate from '../TagCreate.jsx'
 import { getTags } from '../Tag.graphql'
-import useGraphQL from '../../hooks/graphql'
+import useFetchData from '../../hooks/graphql'
 
 export default function TagsList() {
   const { t } = useTranslation()
@@ -21,7 +21,7 @@ export default function TagsList() {
     setVisible: setCreateTagVisible,
     bindings: createTagModalBinding,
   } = useModal()
-  const { data, isLoading } = useGraphQL(
+  const { data, isLoading } = useFetchData(
     { query: getTags, variables: {} },
     {
       revalidateOnFocus: false,
diff --git a/front/src/components/workspace/WorkspaceSelectionItems.jsx b/front/src/components/workspace/WorkspaceSelectionItems.jsx
index c673dcf0e..e3d0e5e55 100644
--- a/front/src/components/workspace/WorkspaceSelectionItems.jsx
+++ b/front/src/components/workspace/WorkspaceSelectionItems.jsx
@@ -4,12 +4,12 @@ import PropTypes from 'prop-types'
 import { useSelector } from 'react-redux'
 
 import { getArticleWorkspaces } from './Workspaces.graphql'
-import useGraphQL from '../../hooks/graphql.js'
+import useFetchData from '../../hooks/graphql.js'
 import WorkspaceSelectItem from './WorkspaceSelectItem.jsx'
 
 export default function WorkspaceSelectionItems({ articleId }) {
   const userWorkspaces = useSelector((state) => state.activeUser.workspaces)
-  const { data, isLoading, mutate } = useGraphQL(
+  const { data, isLoading, mutate } = useFetchData(
     { query: getArticleWorkspaces, variables: { articleId } },
     {
       revalidateOnFocus: false,
diff --git a/front/src/helpers/graphQL.js b/front/src/helpers/graphQL.js
index f063d0635..c5c49219e 100644
--- a/front/src/helpers/graphQL.js
+++ b/front/src/helpers/graphQL.js
@@ -83,8 +83,8 @@ async function executeRequest({
 export function useGraphQLClient() {
   const sessionToken = useSelector((state) => state.sessionToken)
   return {
-    query: ({ query, variables }) =>
-      executeQuery({ query, variables, sessionToken }),
+    query: ({ query, variables, type = 'fetch' }) =>
+      executeQuery({ query, variables, sessionToken, type }),
   }
 }
 
diff --git a/front/src/hooks/article.js b/front/src/hooks/article.js
new file mode 100644
index 000000000..9e2af9bc5
--- /dev/null
+++ b/front/src/hooks/article.js
@@ -0,0 +1,125 @@
+import { useSelector } from 'react-redux'
+import { executeQuery } from '../helpers/graphQL.js'
+import {
+  duplicateArticle,
+  renameArticle,
+  deleteArticle,
+} from '../components/Article.graphql'
+
+import {
+  addTags,
+  removeTags,
+  getArticleTags,
+} from '../components/Article.graphql'
+import useFetchData from './graphql.js'
+
+export function useArticleTagActions({ articleId }) {
+  const sessionToken = useSelector((state) => state.sessionToken)
+  const { data, mutate, error, isLoading } = useFetchData(
+    { query: getArticleTags, variables: { articleId } },
+    {
+      revalidateOnFocus: false,
+      revalidateOnReconnect: false,
+    }
+  )
+  const add = async (tagId) => {
+    const result = await executeQuery({
+      query: addTags,
+      variables: {
+        articleId,
+        tags: [tagId],
+      },
+      sessionToken,
+      type: 'mutation',
+    })
+    const tags = result.article.addTags
+    mutate(
+      {
+        article: {
+          tags,
+        },
+      },
+      { revalidate: false }
+    )
+    return tags
+  }
+  const remove = async (tagId) => {
+    const result = await executeQuery({
+      query: removeTags,
+      variables: {
+        articleId,
+        tags: [tagId],
+      },
+      sessionToken,
+      type: 'mutation',
+    })
+    const tags = result.article.removeTags
+    mutate(
+      {
+        article: {
+          tags,
+        },
+      },
+      { revalidate: false }
+    )
+    return tags
+  }
+
+  return {
+    tags: data?.article?.tags || [],
+    isLoading,
+    error,
+    add,
+    remove,
+  }
+}
+
+export function useArticleActions({ articleId }) {
+  const sessionToken = useSelector((state) => state.sessionToken)
+  const activeUser = useSelector((state) => state.activeUser)
+  const copy = async (toUserId) => {
+    return await executeQuery({
+      query: duplicateArticle,
+      variables: {
+        user: null,
+        to: toUserId,
+        articleId,
+      },
+      sessionToken,
+      type: 'mutation',
+    })
+  }
+  const duplicate = async () => {
+    return await executeQuery({
+      query: duplicateArticle,
+      variables: {
+        user: activeUser._id,
+        to: activeUser._id,
+        articleId,
+      },
+      sessionToken,
+      type: 'mutation',
+    })
+  }
+  const rename = async (title) => {
+    return await executeQuery({
+      query: renameArticle,
+      variables: { user: activeUser._id, articleId, title },
+      sessionToken,
+      type: 'mutation',
+    })
+  }
+  const remove = async () => {
+    return await executeQuery({
+      query: deleteArticle,
+      variables: { articleId },
+    })
+  }
+
+  return {
+    copy,
+    duplicate,
+    rename,
+    remove,
+  }
+}
diff --git a/front/src/hooks/article.test.jsx b/front/src/hooks/article.test.jsx
new file mode 100644
index 000000000..b385faae9
--- /dev/null
+++ b/front/src/hooks/article.test.jsx
@@ -0,0 +1,200 @@
+import { fireEvent, screen } from '@testing-library/react'
+import React from 'react'
+import { describe, expect, test } from 'vitest'
+import { renderWithProviders } from '../../tests/setup.js'
+import { useArticleActions, useArticleTagActions } from './article.js'
+
+describe('Article', () => {
+  test('add tag', async () => {
+    fetch.mockResolvedValue({
+      ok: true,
+      json: () =>
+        new Promise((resolve) =>
+          resolve({
+            data: {
+              article: {
+                tags: [
+                  { _id: '111', name: 'pending' },
+                  { _id: '222', name: 'done' },
+                ],
+              },
+            },
+          })
+        ),
+    })
+    const Component = () => {
+      const { isLoading, error, tags, add } = useArticleTagActions({
+        articleId: '444',
+      })
+
+      if (isLoading || error) {
+        return <></>
+      }
+
+      return (
+        <div>
+          <ul>
+            {tags?.map((t) => (
+              <li key={t._id}>
+                {t.name}
+                <button
+                  data-testid={'add-tag-' + t._id}
+                  onClick={() => add(t._id)}
+                ></button>
+              </li>
+            ))}
+          </ul>
+        </div>
+      )
+    }
+    renderWithProviders(<Component />, {})
+    const addTagButton = await screen.findByTestId('add-tag-111')
+    fireEvent.click(addTagButton)
+    expect(fetch).toHaveBeenLastCalledWith(
+      undefined,
+      expect.objectContaining({
+        body: expect.stringMatching(/"query":"query addTags\(/),
+      })
+    )
+  })
+  test('remove tag', async () => {
+    fetch.mockResolvedValue({
+      ok: true,
+      json: () =>
+        new Promise((resolve) =>
+          resolve({
+            data: {
+              article: {
+                tags: [{ _id: '222', name: 'done' }],
+              },
+            },
+          })
+        ),
+    })
+    const Component = () => {
+      const { isLoading, error, tags, remove } = useArticleTagActions({
+        articleId: '555',
+      })
+
+      if (isLoading || error) {
+        return <></>
+      }
+
+      return (
+        <div>
+          <ul>
+            {tags?.map((t) => (
+              <li key={t._id}>
+                {t.name}
+                <button
+                  data-testid={'remove-tag-' + t._id}
+                  onClick={() => remove(t._id)}
+                ></button>
+              </li>
+            ))}
+          </ul>
+        </div>
+      )
+    }
+    renderWithProviders(<Component />, {})
+    const addTagButton = await screen.findByTestId('remove-tag-222')
+    fireEvent.click(addTagButton)
+    expect(fetch).toHaveBeenLastCalledWith(
+      undefined,
+      expect.objectContaining({
+        body: expect.stringMatching(/"query":"query removeTags\(/),
+      })
+    )
+  })
+  test('copy article', async () => {
+    const Component = () => {
+      const { copy } = useArticleActions({
+        articleId: '666',
+      })
+
+      return (
+        <div>
+          <button data-testid="copy" onClick={() => copy('007')}></button>
+        </div>
+      )
+    }
+    renderWithProviders(<Component />, {})
+    const addTagButton = await screen.findByTestId('copy')
+    fireEvent.click(addTagButton)
+    expect(fetch).toHaveBeenLastCalledWith(
+      undefined,
+      expect.objectContaining({
+        body: expect.stringMatching(/"query":"mutation duplicateArticle\(/),
+      })
+    )
+  })
+  test('duplicate article', async () => {
+    const Component = () => {
+      const { duplicate } = useArticleActions({
+        articleId: '777',
+      })
+
+      return (
+        <div>
+          <button data-testid="duplicate" onClick={() => duplicate()}></button>
+        </div>
+      )
+    }
+    renderWithProviders(<Component />, {})
+    const addTagButton = await screen.findByTestId('duplicate')
+    fireEvent.click(addTagButton)
+    expect(fetch).toHaveBeenLastCalledWith(
+      undefined,
+      expect.objectContaining({
+        body: expect.stringMatching(/"query":"mutation duplicateArticle\(/),
+      })
+    )
+  })
+  test('rename article', async () => {
+    const Component = () => {
+      const { rename } = useArticleActions({
+        articleId: '777',
+      })
+
+      return (
+        <div>
+          <button
+            data-testid="rename"
+            onClick={() => rename('New title')}
+          ></button>
+        </div>
+      )
+    }
+    renderWithProviders(<Component />, {})
+    const addTagButton = await screen.findByTestId('rename')
+    fireEvent.click(addTagButton)
+    expect(fetch).toHaveBeenLastCalledWith(
+      undefined,
+      expect.objectContaining({
+        body: expect.stringMatching(/"query":"query renameArticle\(/),
+      })
+    )
+  })
+  test('remove article', async () => {
+    const Component = () => {
+      const { remove } = useArticleActions({
+        articleId: '888',
+      })
+
+      return (
+        <div>
+          <button data-testid="remove" onClick={() => remove()}></button>
+        </div>
+      )
+    }
+    renderWithProviders(<Component />, {})
+    const addTagButton = await screen.findByTestId('remove')
+    fireEvent.click(addTagButton)
+    expect(fetch).toHaveBeenLastCalledWith(
+      undefined,
+      expect.objectContaining({
+        body: expect.stringMatching(/"query":"query deleteArticle\(/),
+      })
+    )
+  })
+})
diff --git a/front/src/hooks/contact.js b/front/src/hooks/contact.js
new file mode 100644
index 000000000..23f1ccef4
--- /dev/null
+++ b/front/src/hooks/contact.js
@@ -0,0 +1,66 @@
+import useFetchData from './graphql.js'
+import { useSelector } from 'react-redux'
+
+import {
+  addContact,
+  removeContact,
+  getContacts,
+} from '../components/Contacts.graphql'
+import { executeQuery } from '../helpers/graphQL.js'
+
+export function useContactActions() {
+  const activeUser = useSelector((state) => state.activeUser)
+  const sessionToken = useSelector((state) => state.sessionToken)
+  const activeUserId = activeUser.id
+  const { data, mutate, isLoading, error } = useFetchData(
+    { query: getContacts, variables: { userId: activeUserId } },
+    {
+      revalidateIfStale: false,
+      revalidateOnFocus: false,
+      revalidateOnReconnect: false,
+    }
+  )
+  const add = async (contactId) => {
+    const result = await executeQuery({
+      query: addContact,
+      variables: {
+        userId: activeUserId,
+        contactId,
+      },
+      sessionToken,
+      type: 'mutation',
+    })
+    await mutate(
+      {
+        user: {
+          acquintances: result.user.addContact.acquintances,
+        },
+      },
+      { revalidate: false }
+    )
+  }
+  const remove = async (contactId) => {
+    const result = await executeQuery({
+      query: removeContact,
+      variables: { userId: activeUserId, contactId },
+      sessionToken,
+      type: 'mutation',
+    })
+    await mutate(
+      {
+        user: {
+          acquintances: result.user.removeContact.acquintances,
+        },
+      },
+      { revalidate: false }
+    )
+  }
+
+  return {
+    contacts: data?.user?.acquintances || [],
+    isLoading,
+    error,
+    add,
+    remove,
+  }
+}
diff --git a/front/src/hooks/contributor.js b/front/src/hooks/contributor.js
index 4c0712ab4..034a30958 100644
--- a/front/src/hooks/contributor.js
+++ b/front/src/hooks/contributor.js
@@ -1,16 +1,14 @@
 import { useSelector } from 'react-redux'
-import { useSWRConfig } from 'swr'
 import { executeQuery } from '../helpers/graphQL.js'
 import {
   addContributor as addContributorQuery,
   removeContributor as removeContributorQuery,
 } from '../components/ArticleContributors.graphql'
 import { getArticleContributors } from '../components/Article.graphql'
-import { useSWRKey } from './graphql.js'
+import { useMutateData } from './graphql.js'
 
 export function useArticleContributorActions({ articleId }) {
-  const { mutate } = useSWRConfig()
-  const key = useSWRKey()({
+  const { mutate } = useMutateData({
     query: getArticleContributors,
     variables: { articleId },
   })
@@ -21,7 +19,7 @@ export function useArticleContributorActions({ articleId }) {
       query: addContributorQuery,
       variables: { userId: contributorId, articleId },
     })
-    await mutate(key, async () => ({
+    await mutate(async () => ({
       article: {
         contributors: response.article.addContributor.contributors,
       },
@@ -34,7 +32,7 @@ export function useArticleContributorActions({ articleId }) {
       query: removeContributorQuery,
       variables: { userId: contributorId, articleId },
     })
-    await mutate(key, async () => ({
+    await mutate(async () => ({
       article: {
         contributors: response.article.removeContributor.contributors,
       },
diff --git a/front/src/hooks/graphql.js b/front/src/hooks/graphql.js
index 3be78bee9..ebc67cb57 100644
--- a/front/src/hooks/graphql.js
+++ b/front/src/hooks/graphql.js
@@ -1,73 +1,65 @@
 import { print } from 'graphql/language/printer'
 import { useSelector } from 'react-redux'
-import useSWR from 'swr'
+import useSWR, { useSWRConfig } from 'swr'
 import { executeQuery } from '../helpers/graphQL.js'
 
-async function fetch({ query, variables, sessionToken }) {
-  return executeQuery({
-    query,
-    variables,
-    sessionToken,
-    type: 'fetch',
-  })
-}
+/**
+ * @typedef {import('graphql/language/ast').ASTNode} ASTNode
+ * @typedef {import('swr/_internal').SWRConfiguration} SWRConfiguration
+ * @typedef {import('swr/_internal').SWRResponse} SWRResponse
+ */
 
 /**
- * @param queryOrAST GraphQL query
- * @param queryOrAST.query
- * @param variables query arguments
- * @param queryOrAST.variables
- * @param {SWRConfiguration} [options] - optional SWR options
+ * Fetch data using SWR.
+ * @param {object} config config
+ * @param {string|ASTNode} config.query GraphQL query
+ * @param {{[key : string]: any}} config.variables query arguments
+ * @param {SWRConfiguration} [options] - SWR options (optional)
  * @returns {SWRResponse}
  */
-export default function useGraphQL({ query: queryOrAST, variables }, options) {
+export default function useFetchData(
+  { query: queryOrAST, variables },
+  options
+) {
   const sessionToken = useSelector((state) => state.sessionToken)
   const query = typeof queryOrAST === 'string' ? queryOrAST : print(queryOrAST)
-
   return useSWR({ query, variables, sessionToken }, fetch, options)
 }
 
 /**
- * @deprecated
+ * Return a mutate function that mutates data associated to a given query + variables.
+ * This function relies on https://swr.vercel.app/docs/mutation#mutate.
+ * @param {object} config config
+ * @param {string|ASTNode} config.query GraphQL query
+ * @param {{[key : string]: any}|undefined} config.variables query arguments
+ * @returns {{mutate: (function(function(any): Promise, any?): Promise<any>)}}
  */
-export function useMutation() {
-  const sessionToken = useSelector((state) => state.sessionToken)
-
-  return runMutation.bind(null, { sessionToken })
+export function useMutateData({ query, variables }) {
+  const { mutate } = useSWRConfig()
+  const key = useSWRKey({ query, variables })
+  return {
+    mutate: async (mutationCallback, options) =>
+      await mutate(key, mutationCallback, options),
+  }
 }
 
 /**
- * @deprecated
+ * @param {object} config config
+ * @param {string|ASTNode} config.query GraphQL query
+ * @param {{[key : string]: any}} config.variables query arguments
+ * @returns {{query: string, variables: {[key : string]: any}, sessionToken: string}} an SWR key
  */
-export function runMutation(
-  { sessionToken },
-  { query: queryOrAST, variables }
-) {
+function useSWRKey({ query: queryOrAST, variables }) {
+  const sessionToken = useSelector((state) => state.sessionToken)
   const query = typeof queryOrAST === 'string' ? queryOrAST : print(queryOrAST)
+  return { query, variables, sessionToken }
+}
 
+async function fetch({ query, variables, sessionToken }) {
   return executeQuery({
     query,
     variables,
     sessionToken,
-    type: 'mutation',
+    type: 'fetch',
   })
 }
-
-/**
- * @deprecated
- */
-export function useMutate({ query: queryOrAST, variables }) {
-  const sessionToken = useSelector((state) => state.sessionToken)
-  const query = typeof queryOrAST === 'string' ? queryOrAST : print(queryOrAST)
-
-  return useSWR({ query, variables, sessionToken })
-}
-
-export function useSWRKey() {
-  const sessionToken = useSelector((state) => state.sessionToken)
-  return ({ query: queryOrAST, variables }) => {
-    const query =
-      typeof queryOrAST === 'string' ? queryOrAST : print(queryOrAST)
-    return { query, variables, sessionToken }
-  }
-}
diff --git a/front/src/hooks/user.js b/front/src/hooks/user.js
index 6d5e86534..cce2d50e2 100644
--- a/front/src/hooks/user.js
+++ b/front/src/hooks/user.js
@@ -1,10 +1,13 @@
 import { useCallback } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
-import { useGraphQLClient } from '../helpers/graphQL.js'
-import { applicationConfig } from '../config.js'
 import { generatePath } from 'react-router-dom'
 
 import { setAuthToken as setAuthTokenMutation } from '../components/Credentials.graphql'
+import { getTags, createTag } from '../components/Tag.graphql'
+
+import { useMutateData } from './graphql.js'
+import { useGraphQLClient, executeQuery } from '../helpers/graphQL.js'
+import { applicationConfig } from '../config.js'
 
 export function useActiveUserId() {
   return useSelector((state) => state.activeUser._id)
@@ -46,9 +49,33 @@ export function useSetAuthToken(service) {
 
   const unlink = useCallback(async () => {
     const variables = { service: 'zotero', token: null }
-    await dispatch({ type: 'SET_AUTH_TOKEN', ...variables })
+    dispatch({ type: 'SET_AUTH_TOKEN', ...variables })
     await query({ query: setAuthTokenMutation, variables })
   }, [])
 
   return { link, unlink }
 }
+
+export function useUserTagActions() {
+  const { query } = useGraphQLClient()
+  const { mutate } = useMutateData({
+    query: getTags,
+    variables: {},
+  })
+  const create = async (tag) => {
+    const result = await query({
+      query: createTag,
+      variables: tag,
+      type: 'mutation',
+    })
+    await mutate(async (data) => ({
+      user: {
+        tags: [...data.user.tags, result.createTag],
+      },
+    }))
+  }
+
+  return {
+    create,
+  }
+}
diff --git a/front/src/hooks/workspace.js b/front/src/hooks/workspace.js
index 5dc62c67f..709e314ad 100644
--- a/front/src/hooks/workspace.js
+++ b/front/src/hooks/workspace.js
@@ -1,5 +1,4 @@
 import { useSelector } from 'react-redux'
-import { useSWRConfig } from 'swr'
 import {
   create as createMutation,
   getWorkspaceMembers,
@@ -9,7 +8,7 @@ import {
   removeMember as removeMemberMutation,
 } from '../components/workspace/Workspaces.graphql'
 import { executeQuery } from '../helpers/graphQL.js'
-import useGraphQL, { useMutation, useSWRKey } from './graphql.js'
+import useFetchData, { useMutateData } from './graphql.js'
 
 export function useActiveWorkspace() {
   return useSelector((state) => {
@@ -25,10 +24,11 @@ export function useActiveWorkspace() {
 }
 
 export function useWorkspaceMembersActions(workspaceId) {
-  const { mutate: workspacesMutate } = useSWRConfig()
-  const key = useSWRKey()({ query: getWorkspaces })
-  const mutation = useMutation()
-  const { data, mutate, error, isLoading } = useGraphQL(
+  const { mutate: workspacesMutate } = useMutateData({
+    query: getWorkspaces,
+  })
+  const sessionToken = useSelector((state) => state.sessionToken)
+  const { data, mutate, error, isLoading } = useFetchData(
     { query: getWorkspaceMembers, variables: { workspaceId } },
     {
       revalidateOnFocus: false,
@@ -37,7 +37,7 @@ export function useWorkspaceMembersActions(workspaceId) {
   )
 
   const updateMembersCount = async (result) => {
-    await workspacesMutate(key, async (data) => ({
+    await workspacesMutate(async (data) => ({
       workspaces: data?.workspaces?.map((w) => {
         if (w._id === workspaceId) {
           return {
@@ -56,9 +56,11 @@ export function useWorkspaceMembersActions(workspaceId) {
 
   const removeMember = async (user) => {
     const { _id: userId } = user
-    await mutation({
+    await executeQuery({
       query: removeMemberMutation,
       variables: { workspaceId, userId },
+      sessionToken,
+      type: 'mutation',
     })
     const result = await mutate(
       async (data) => {
@@ -75,9 +77,11 @@ export function useWorkspaceMembersActions(workspaceId) {
 
   const inviteMember = async (user) => {
     const { _id: userId } = user
-    await mutation({
+    await executeQuery({
       query: inviteMemberMutation,
       variables: { workspaceId, userId, role: '' },
+      sessionToken,
+      type: 'mutation',
     })
     const result = await mutate(
       async (data) => {
@@ -106,8 +110,7 @@ export function useWorkspaceMembersActions(workspaceId) {
 }
 
 export function useWorkspaceActions() {
-  const { mutate } = useSWRConfig()
-  const key = useSWRKey()({ query: getWorkspaces })
+  const { mutate } = useMutateData({ query: getWorkspaces })
   const sessionToken = useSelector((state) => state.sessionToken)
   const addWorkspace = async (workspace) => {
     await executeQuery({
@@ -121,7 +124,7 @@ export function useWorkspaceActions() {
         },
       },
     })
-    await mutate(key, async (data) => ({
+    await mutate(async (data) => ({
       workspaces: [workspace, ...data.workspaces],
     }))
   }
@@ -135,7 +138,6 @@ export function useWorkspaceActions() {
       },
     })
     await mutate(
-      key,
       async (data) => ({
         workspaces: data.workspaces.filter((w) => w._id !== workspaceId),
       }),
@@ -150,7 +152,7 @@ export function useWorkspaceActions() {
 }
 
 export function useWorkspaces() {
-  const { data, error, isLoading } = useGraphQL({
+  const { data, error, isLoading } = useFetchData({
     query: getWorkspaces,
   })