v3.5.0

🆕 New Features

Added on demand subscription model (e5c9e85)

You can now manually subscribe and unsubscribe from a subscription using the subscribe and unsubscribe functions, and coupled with subscribeOnMount set to false you can now initiate the subscription only when needed rather than juggle paused and skip to achieve this.

const { subscribe, unsubscribe } = useSubscription({
   // ....
  subscribeOnMount: false
});

if (something) {
  subscribe();
}

Accept several options as RefOrGetter (5c9a789)

In multiple areas we were still accepting a Ref or a plain value, like with queries, contexts, etc...

Now you can pass getters as well, this makes villus utilize the MaybeGetterOrRef type from vue package and gives you more flexibility as you won't need to wrap those options with computed anymore.

🐛 Bug Fixes

• fix(types): subscription forwarded should receive a string always #210 (8b02c12)
• fix: watch the query if it is a getter in useQuery and useSubscription (b81eec6)

v3.4.0

🪄 gql.tada support

This release brings full type support for gql.tada #206

import { graphql } from 'gql.tada';
import { useQuery } from 'villus';

const getBooksQuery = graphql(`
  query GetBooks {
    books {
      id
      title
    }
  }
`);

const { data, error } = useQuery({
  query: getBooksQuery
});

v3.3.0

🆕 New Features

Added useQuery data mappers. Similar to subscriptions, you can now pass a second argument to useQuery to map the data and it will be fully typed.

const { data, error } = useQuery(
  {
    query: new TypedDocumentString<{ posts: Post[] }, never>(`
    query Posts {
      posts {
        id
        title
      }
    }
  `),
  },
  ({ data }) => {
    return data?.posts.map(p => p.id) || [];
  },
);

data.value;
//^ number[]

👕 TypeScript

• Exported mutation execution options type #203 thanks to @jbaubree

v3.2.0

🆕 @villus/batch

You can now add an exclusion filter as config for the batch plugin to force specific queries to be executed in a non-batched request.

<script setup>
import { useClient } from 'villus';
import { batch } from '@villus/batch';

useClient({
  url: 'https://test.com/graphql',
  // Exclude all queries named "Posts"
  use: [batch({ exclude: ({ query }) => /query Posts/.test(query) })],
});
</script>

🆕 New features

• Exported normalizeQuery helper that converts a query (string, or a document object) to a string.
• New onData and onError for the useMutation composable if you prefer to use callback style for handling, thanks to @jbaubree (#197)

v3.1.0

🆕 New features

• Added support for TypedDocumentString introduced with GraphQL codegenrator ecosystem

v3.0.0

💣 Breaking Changes

This release contains minor breaking changes, mainly subscriptions reducer arguments order being flipped and onSuccess hook being renamed.

You can read how to migrate by checking this guide.

🆕 New features

• Added isFetching to useSubscription until the first data event is received.
• Added initialData to useSubscription options to provide an initial data.
• Subscription forwarder can now be asynchronous.
• Added onData and onError hooks on the return type of useQuery, so you can register multiple hooks anytime. Read more here.

v2.2.1

🐛 Bug Fixes

• Fixed a few issues with re-subscribing due to variable changes (b88190b)

🆕 Enhancements

• Added skip to useSubscription to unsubscribe or wait until some conditions are met before subscribing (b88190b)
• Allow the subscription forwarder to be async

v2.2.0

🆕 New features

Thanks to @jbaubree for suggesting implementing event hooks, which is a little nicer than using a watcher for detecting when a query concludes or fails.

onSuccess

This is called whenever a new result is available.

<script setup>
import { useQuery } from 'villus';

const { data } = useQuery({
  query: GetPostById,
  variables,
  onSuccess: (data) => {
    console.log(data)
  },
});
</script>

onError

It is triggered when an error occurs.

<script setup>
import { useQuery } from 'villus';

const { data } = useQuery({
  query: GetPostById,
  variables,
  onError: (err) => {
    console.log(err)
  },
});
</script>

v2.1.1

🐛 Bugs Fixed

• Subscription forwarder not receiving a nomralized query string (7a50249) #188

👕 TypeScript

• Changed the internal ObserverLike interface to require next and error and complete functions. This makes it more compatible with graphql-ws sink type which is the recommended WebSocket implementation (0c91f11) #154 #186

v2.1

A couple of nice features to help with the caching and fetching logic of mutations and queries. As always, feedback is welcome and make sure to report any bugs you encounter.

🆕 New Features

Added the ability to tag queries using the tags option when calling useQuery. This marks a query with the specified tags for a couple of features.

Clearing tagged queries cache after mutation

const { data } = useQuery(GetPosts, {
  tags: ['all_posts'],
});

// This will clear the previous query cache whenever `execute` concludes successfully.
const { execute } = useMutation(CreatePost, {
  clearCacheTags: ['all_posts'],
});

Refetching tagged queries cache after mutation

const { data } = useQuery(GetPosts, {
  tags: ['all_posts'],
});

// This will auto-fetch the previous query whenever `execute` concludes successfully.
const { execute } = useMutation(CreatePost, {
  refetchTags: ['all_posts'],
});

This refetching bypasses the cache so it will also clear the affected queries cache as well, so there is some overlap between clearing and autofetching.