4

I have a component with a data list. Also, I have another with mutation for item element. After the update, cached is updated, but list stays not update until rerender component.

List component query:

 export const categoriesQuery = gql`
    query Categories {
      podcastCategories {
        id
        regions
        title
        subcategories {
          title
        }
      }
    }
  `

I use useQuery for fetch data:

const categoriesResults = useQuery<Categories>(categoriesQuery)
console.log('categoriesReults', categoriesResults)

Also, I have other component CategoriesItem.tsx with mutation:

export const podcastCategoryUpdate = gql`
   mutation PodcastCategoryUpdate($categoryId: String!, $category: CategoryInput!) {
     podcastCategoryUpdate(categoryId: $categoryId, category: $category) {
       coverImageUrl
       coverImageId
       color
       id
       svg
       subcategories {
         categoryId
         id
         title
         translations {
           region
           title
         }
       }
       regions
       title
       translations {
         region
         title
       }
     }
   }
 `

I use useMutation hook to update it:

const updateFn = useMutation<PodcastCategoryUpdate, PodcastCategoryUpdateVariables>(podcastCategoryUpdate)

Problem is that cache is updated, but list component did not use recent cache version.

Edgaras Karka
  • 7,400
  • 15
  • 61
  • 115

0 Answers0