Invalidate query after mutation

const List = ({ uid }: { uid: string }) => {
  const getPoliciesAllowed = async (uid: string) => {
    const res = await fetch(
      `http://localhost:3000/v1/users/${uid}/polices?systems=allowed`,
      {
        headers: {
          'Cache-Control': 'no-cache',
          Pragma: 'no-cache',
          Expires: '0',
        },
      }
    )
    return res.json() as unknown as IPolicy[]
  }

  const { data: allowed, isFetching: isFetchingAllowed } = useQuery({
    queryKey: ['policies', 'allowed', uid],
    queryFn: () => getPoliciesAllowed(uid as string),
  })

  const { mutate } = useDeletePolicy(uid)

  const handleSubmit = (name: string) => {
    mutate(name)
  }

  if (isFetchingAllowed) {
    return <h1>Carregando...</h1>
  }

  return (
    <>
      {allowed?.map((policy) => {
        return (
          <Flex key={policy.name}>
            <Text>{policy.name}</Text>
            <Spacer />
            <ActionButton
              icon={() => (
                <X size={20} onClick={() => handleSubmit(policy.name)} />
              )}
            />
          </Flex>
        )
      })}
    </>
  )
}

export const useDeletePolicy = (uid: string) => {
  const queryClient = useQueryClient()

  const mutation = useMutation({
    mutationFn: (name: string) => ExcludePolicy(uid as string, name as string),
    onSuccess: () => {
      queryClient.invalidateQueries(['policies', 'allowed', uid])
    },
  })

  return mutation
}