diff --git a/.changeset/README.md b/.changeset/README.md new file mode 100644 index 00000000..e5b6d8d6 --- /dev/null +++ b/.changeset/README.md @@ -0,0 +1,8 @@ +# Changesets + +Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works +with multi-package repos, or single-package repos to help you version and publish your code. You can +find the full documentation for it [in our repository](https://github.com/changesets/changesets) + +We have a quick list of common questions to get you started engaging with this project in +[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md) diff --git a/.changeset/config.json b/.changeset/config.json new file mode 100644 index 00000000..35b85023 --- /dev/null +++ b/.changeset/config.json @@ -0,0 +1,11 @@ +{ + "$schema": "https://unpkg.com/@changesets/config@2.3.1/schema.json", + "changelog": "@changesets/cli/changelog", + "commit": false, + "fixed": [["villus", "@villus/batch", "@villus/multipart"]], + "linked": [], + "access": "public", + "baseBranch": "main", + "updateInternalDependencies": "patch", + "ignore": [] +} diff --git a/.circleci/config.yml b/.circleci/config.yml index 58cd13ba..ffcd6e45 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -2,33 +2,37 @@ # See: https://circleci.com/docs/2.0/configuration-reference version: 2.1 -orbs: - # The Node.js orb contains a set of prepackaged CircleCI configuration you can utilize - # Orbs reduce the amount of configuration required for common tasks. - # See the orb documentation here: https://circleci.com/developer/orbs/orb/circleci/node - node: circleci/node@4.1 - jobs: # Below is the definition of your job to build and test your app, you can rename and customize it as you want. test: docker: - - image: cimg/node:16.13 + - image: cimg/node:19.7 steps: # Checkout the code as the first step. - checkout - # Next, the node orb's install-packages step will install the dependencies from a package.json. - # The orb install-packages step will also automatically cache them for faster future runs. - - node/install-packages: - pkg-manager: yarn + - restore_cache: + name: Restore pnpm Package Cache + keys: + - pnpm-packages-{{ checksum "pnpm-lock.yaml" }} + - run: + name: Install pnpm package manager + command: | + corepack enable + corepack prepare pnpm@latest-8 --activate - run: - name: Bootstrap Monorepo - command: yarn lerna bootstrap + name: Install dependencies + command: pnpm install + - save_cache: + name: Save pnpm Package Cache + key: pnpm-packages-{{ checksum "pnpm-lock.yaml" }} + paths: + - node_modules - run: name: Build - command: yarn build + command: pnpm build - run: name: Generate Coverage - command: npm run cover:ci + command: pnpm cover:ci - run: name: Upload Coverage command: bash <(curl -s https://codecov.io/bash) diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index 66344570..00000000 --- a/.eslintignore +++ /dev/null @@ -1,6 +0,0 @@ -locale -dist -coverage -.nuxt -dist -docs/static \ No newline at end of file diff --git a/.eslintrc.json b/.eslintrc.json deleted file mode 100644 index 28b76f36..00000000 --- a/.eslintrc.json +++ /dev/null @@ -1,24 +0,0 @@ -{ - "parser": "@typescript-eslint/parser", - "env": { - "browser": true, - "commonjs": true, - "es6": true, - "jest/globals": true - }, - "extends": [ - "standard", - "plugin:jest/recommended", - "plugin:@typescript-eslint/recommended", - "plugin:prettier/recommended" - ], - "plugins": ["jest", "prettier"], - "rules": { - "@typescript-eslint/camelcase": "off", - "@typescript-eslint/no-explicit-any": "off", - "@typescript-eslint/explicit-function-return-type": "off", - "@typescript-eslint/no-use-before-define": "off", - "no-console": "error", - "@typescript-eslint/explicit-module-boundary-types": "off" - } -} diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml index 4e4b5cd3..66bc3c6b 100644 --- a/.github/FUNDING.yml +++ b/.github/FUNDING.yml @@ -1,6 +1,6 @@ # These are supported funding model platforms -github: # Replace with up to 4 GitHub Sponsors-enabled usernames e.g., [user1, user2] +github: logaretm # patreon: logaretm open_collective: # Replace with a single Open Collective username ko_fi: # Replace with a single Ko-fi username @@ -9,4 +9,4 @@ community_bridge: # Replace with a single Community Bridge project-name e.g., cl liberapay: # Replace with a single Liberapay username issuehunt: # Replace with a single IssueHunt username otechie: # Replace with a single Otechie username -custom: 'https://www.buymeacoffee.com/logaretm' +custom: #'https://www.buymeacoffee.com/logaretm' diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml new file mode 100644 index 00000000..080fd791 --- /dev/null +++ b/.github/workflows/ci.yml @@ -0,0 +1,55 @@ +name: CI + +on: [push, workflow_call] + +jobs: + lint: + runs-on: ubuntu-latest + steps: + - name: Checkout code + uses: actions/checkout@v2 + - run: corepack enable + - uses: actions/setup-node@v4 + with: + node-version: 22 + cache: 'pnpm' + - name: Install dependencies + run: pnpm install + - name: Build + run: pnpm build + - name: Lint + run: pnpm lint + + typecheck: + runs-on: ubuntu-latest + steps: + - name: Checkout code + uses: actions/checkout@v2 + - run: corepack enable + - uses: actions/setup-node@v4 + with: + node-version: 22 + cache: 'pnpm' + - name: Install dependencies + run: pnpm install + - name: Build + run: pnpm build + - name: Type Check + run: pnpm typecheck + + tests: + runs-on: ubuntu-latest + steps: + - name: Checkout code + uses: actions/checkout@v2 + - run: corepack enable + - uses: actions/setup-node@v4 + with: + node-version: 22 + cache: 'pnpm' + - name: Install dependencies + run: pnpm install + - name: Build + run: pnpm build + - name: Test + run: pnpm test diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml new file mode 100644 index 00000000..4196433e --- /dev/null +++ b/.github/workflows/release.yml @@ -0,0 +1,42 @@ +name: Release + +on: workflow_dispatch + +jobs: + checks: + uses: ./.github/workflows/ci.yml + + release: + needs: checks + runs-on: ubuntu-latest + permissions: + id-token: write + contents: write + steps: + - name: Checkout code + uses: actions/checkout@v2 + - run: corepack enable + - uses: actions/setup-node@v4 + with: + node-version: 22 + cache: 'pnpm' + - name: Install dependencies + run: pnpm install + - name: Set publishing config + run: pnpm config set '//registry.npmjs.org/:_authToken' "${NODE_AUTH_TOKEN}" + env: + NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} + - name: Tag and Release + run: | + git config --global user.email "github-action@users.noreply.github.com" + git config --global user.name "GitHub Action" + pnpm ci:version + git add . + git commit -m "chore(release): publish" + pnpm ci:tag + pnpm ci:publish + git push && git push --tags + env: + GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}} + NPM_TOKEN: ${{secrets.NPM_TOKEN}} + NPM_CONFIG_PROVENANCE: true diff --git a/.husky/commit-msg b/.husky/commit-msg index 292dc407..cfe75101 100755 --- a/.husky/commit-msg +++ b/.husky/commit-msg @@ -1,4 +1 @@ -#!/bin/sh -. "$(dirname "$0")/_/husky.sh" - -yarn commitlint --edit $1 \ No newline at end of file +pnpm commitlint --edit $1 diff --git a/.husky/pre-commit b/.husky/pre-commit index dc0378c3..cb2c84d5 100755 --- a/.husky/pre-commit +++ b/.husky/pre-commit @@ -1,4 +1 @@ -#!/bin/sh -. "$(dirname "$0")/_/husky.sh" - -yarn lint-staged \ No newline at end of file +pnpm lint-staged diff --git a/.npmrc b/.npmrc new file mode 100644 index 00000000..f301fedf --- /dev/null +++ b/.npmrc @@ -0,0 +1 @@ +auto-install-peers=false diff --git a/CHANGELOG.md b/CHANGELOG.md index 38f78eaf..7a702bc7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,182 +1,432 @@ # Change Log +## 3.5.2 + +### Patch Changes + +- 0851c7d: fix: useSubscription return types + +## 3.5.1 + +### Patch Changes + +- 056ffbd: fix: added unsubscribeOnUnmount option + +## 3.5.0 + +### Minor Changes + +- e5c9e85: feat: added on demand subscription model + +### Patch Changes + +- 8b02c12: fix(types): subscription forwarded should receive a string always +- 5c9a789: feat: accept several options as RefOrGetter +- b81eec6: fix: watch the query if it is a getter + +## 3.4.0 + +### Minor Changes + +- 56d1e18: feat: add support for gql.tada + +## 3.3.0 + +### Minor Changes + +- 877cb15: feat: add query data mapper + +## 3.2.0 + +### Minor Changes + +- 559556d: feat: expose normalize query and add batching exclusion filter + All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. -## [1.0.1](https://github.com/logaretm/villus/compare/v1.0.0...v1.0.1) (2021-11-06) +# [3.1.0](https://github.com/logaretm/villus/compare/v3.0.0...v3.1.0) (2023-04-04) -**Note:** Version bump only for package villus-monorepo +### Features +- support typed document strings ([62e5c56](https://github.com/logaretm/villus/commit/62e5c56db55ae6659b75470a3173285fed601ce7)) +# [3.0.0](https://github.com/logaretm/villus/compare/v2.2.1...v3.0.0) (2023-03-20) +### Features +- added data and error hooks ([8ba12ae](https://github.com/logaretm/villus/commit/8ba12aeadc1aa45169cd0f77c03ec0660740d32a)) +- added subscription initial data and isFetching ([7edd698](https://github.com/logaretm/villus/commit/7edd69864bed7c9923ca28f36a1b8404e4c86424)) +- **breaking:** change the reducer signature in subscriptions ([f7b3893](https://github.com/logaretm/villus/commit/f7b3893c898c538cc1f156d9638a51f5c3ba0ef8)) +- expose hook handler types ([3e16cdc](https://github.com/logaretm/villus/commit/3e16cdc4cc5bb845a8476ce90239627cd7fb41e8)) -# [1.0.0](https://github.com/logaretm/villus/compare/v1.0.0-rc.21...v1.0.0) (2021-10-18) +## [2.2.1](https://github.com/logaretm/villus/compare/v2.2.0...v2.2.1) (2023-03-09) +### Bug Fixes + +- subscriptions enhancements ([b88190b](https://github.com/logaretm/villus/commit/b88190b8528d6d9dfd7aad7514647cce6f2b4bff)) + +# [2.2.0](https://github.com/logaretm/villus/compare/v2.1.1...v2.2.0) (2023-03-03) ### Features -* add `paused` for subscriptions init object ([#143](https://github.com/logaretm/villus/issues/143)) ([9cfa418](https://github.com/logaretm/villus/commit/9cfa4188e0679aa72d1c00a7ea40fd39c58f8a06)) -* added slot typing ([1aec7e7](https://github.com/logaretm/villus/commit/1aec7e727a2b2dee2a3f58708307c91198609f78)) +- add onSuccess and onError hooks in useQuery function ([151b928](https://github.com/logaretm/villus/commit/151b928f14147051a530845f362655db67d7bb4d)) +- **useQuery:** add tests ([2e3152a](https://github.com/logaretm/villus/commit/2e3152a7a5e2056100968f7b2ea893a0a11329e3)) +## [2.1.1](https://github.com/logaretm/villus/compare/v2.1.0...v2.1.1) (2023-02-08) +### Bug Fixes +- ensure subscription queries are normalized closes [#188](https://github.com/logaretm/villus/issues/188) ([7a50249](https://github.com/logaretm/villus/commit/7a502495c17b8b34dc6edd6ecc5fc5620bb279c0)) +- require observerlike props closes [#186](https://github.com/logaretm/villus/issues/186) closes [#154](https://github.com/logaretm/villus/issues/154) ([0c91f11](https://github.com/logaretm/villus/commit/0c91f11d44da84195636327f908a265769d72cb6)) +# [2.1.0](https://github.com/logaretm/villus/compare/v2.0.2...v2.1.0) (2022-12-30) -# [1.0.0-rc.21](https://github.com/logaretm/villus/compare/v1.0.0-rc.20...v1.0.0-rc.21) (2021-08-26) +### Features + +- added a mechanism to clear all cache closes [#84](https://github.com/logaretm/villus/issues/84) ([c78dfd2](https://github.com/logaretm/villus/commit/c78dfd21fbeea97ee36666f252b15b0fde235006)) +- added refetching tagged queries ([18e04b9](https://github.com/logaretm/villus/commit/18e04b95e6a1efd4cedf1e77f1178033bf56508b)) +- implement tag based eviction closes [#147](https://github.com/logaretm/villus/issues/147) ([9139f7e](https://github.com/logaretm/villus/commit/9139f7e5c945f053cfe5eb3d3ceb3fb717492976)) +- write docs on clearing cache ([4e8e156](https://github.com/logaretm/villus/commit/4e8e1567eaa68a553c927eb15ba0fa6c350d961b)) +## [2.0.2](https://github.com/logaretm/villus/compare/v2.0.1...v2.0.2) (2022-12-28) ### Bug Fixes -* handle possible empty responses ([bc96bf8](https://github.com/logaretm/villus/commit/bc96bf849fe2a1797170ff5a693899be6fd9f260)) +- **types:** ensure mutation data and error are nullable closes [#182](https://github.com/logaretm/villus/issues/182) ([#183](https://github.com/logaretm/villus/issues/183)) ([25b6e5c](https://github.com/logaretm/villus/commit/25b6e5c8b8831b697748e2dba5c8ca7b41dfd004)) +## [2.0.1](https://github.com/logaretm/villus/compare/v1.2.5...v2.0.1) (2022-10-23) +**Note:** Version bump only for package villus +# [2.0.0](https://github.com/logaretm/villus/compare/v1.2.5...v2.0.0) (2022-08-07) +### Bug Fixes -# [1.0.0-rc.20](https://github.com/logaretm/villus/compare/v1.0.0-rc.19...v1.0.0-rc.20) (2021-08-07) +- handle internal injections for vue 2.7 ([163242e](https://github.com/logaretm/villus/commit/163242e8e6395c3ddfb9e0d14f799101cb86db64)) -**Note:** Version bump only for package villus-monorepo +### Features +- add waitFor ([e1a5aee](https://github.com/logaretm/villus/commit/e1a5aee9cd0f52e1feadb957153326189efa30fb)) +- deprecate variable watching API in useQuery ([cbeef72](https://github.com/logaretm/villus/commit/cbeef721137ab75a1b09975abed23481644a3578)) +- normalize the skip and pause behaviors ([3ba3576](https://github.com/logaretm/villus/commit/3ba357657ebaac868a24bdbb6f93493545afb0da)) +## [1.2.5](https://github.com/logaretm/villus/compare/v1.2.4...v1.2.5) (2022-07-31) +**Note:** Version bump only for package villus +## [1.2.4](https://github.com/logaretm/villus/compare/v1.2.3...v1.2.4) (2022-07-11) -# [1.0.0-rc.19](https://github.com/logaretm/villus/compare/v1.0.0-rc.18...v1.0.0-rc.19) (2021-07-25) +### Features + +- export GQL response types ([e1d75f5](https://github.com/logaretm/villus/commit/e1d75f5a75b34c16665e6513553a8c502c20dc80)) + +## [1.2.3](https://github.com/logaretm/villus/compare/v1.2.2...v1.2.3) (2022-07-03) +**Note:** Version bump only for package villus + +## [1.2.2](https://github.com/logaretm/villus/compare/v1.2.1...v1.2.2) (2022-06-13) + +**Note:** Version bump only for package villus + +## [1.2.1](https://github.com/logaretm/villus/compare/v1.2.0...v1.2.1) (2022-06-03) + +### Bug Fixes + +- ensure isFetching is false after a query was skipped ([659820a](https://github.com/logaretm/villus/commit/659820acb2a5fcaf98b8ec90282a7f8179601fe8)) + +# [1.2.0](https://github.com/logaretm/villus/compare/v1.1.0...v1.2.0) (2022-05-30) + +### Bug Fixes + +- query variables import path ([6a05aee](https://github.com/logaretm/villus/commit/6a05aeeb8dbee1a1aa84fb46f6d13a7346a2e222)) + +### Features + +- added query skip argument ([9b0ba85](https://github.com/logaretm/villus/commit/9b0ba8591546ef8d17f66cd0dbbad1229902dfb4)) +- allow lazy variables to be passed in to queries ([980673b](https://github.com/logaretm/villus/commit/980673b347f49f56312f60bb0367fe1aca13c2e4)) + +# [1.1.0](https://github.com/logaretm/villus/compare/v1.0.1...v1.1.0) (2022-04-23) + +### Bug Fixes + +- add export types for villus.d.ts ([#155](https://github.com/logaretm/villus/issues/155)) ([ca2a6b2](https://github.com/logaretm/villus/commit/ca2a6b290b5fec2262cc65c4baf71716c4282501)) + +### Features + +- enable useQuery etc function outside of setup and outside component ([#156](https://github.com/logaretm/villus/issues/156)) ([14335b3](https://github.com/logaretm/villus/commit/14335b31a8713c03b6573561d1c1fbdc1e84c731)) + +## [1.0.1](https://github.com/logaretm/villus/compare/v1.0.0...v1.0.1) (2021-11-06) + +**Note:** Version bump only for package villus + +# [1.0.0](https://github.com/logaretm/villus/compare/v1.0.0-rc.21...v1.0.0) (2021-10-18) ### Features -* update the reactive result for cache-and-network policy closes [#76](https://github.com/logaretm/villus/issues/76) ([23cd60b](https://github.com/logaretm/villus/commit/23cd60ba3646b95514af37cd3f174e21f2151867)) +- add `paused` for subscriptions init object ([#143](https://github.com/logaretm/villus/issues/143)) ([9cfa418](https://github.com/logaretm/villus/commit/9cfa4188e0679aa72d1c00a7ea40fd39c58f8a06)) +- added slot typing ([1aec7e7](https://github.com/logaretm/villus/commit/1aec7e727a2b2dee2a3f58708307c91198609f78)) +# [1.0.0-rc.21](https://github.com/logaretm/villus/compare/v1.0.0-rc.20...v1.0.0-rc.21) (2021-08-26) +**Note:** Version bump only for package villus +# [1.0.0-rc.20](https://github.com/logaretm/villus/compare/v1.0.0-rc.19...v1.0.0-rc.20) (2021-08-07) +**Note:** Version bump only for package villus + +# [1.0.0-rc.19](https://github.com/logaretm/villus/compare/v1.0.0-rc.18...v1.0.0-rc.19) (2021-07-25) + +### Features + +- update the reactive result for cache-and-network policy closes [#76](https://github.com/logaretm/villus/issues/76) ([23cd60b](https://github.com/logaretm/villus/commit/23cd60ba3646b95514af37cd3f174e21f2151867)) # [1.0.0-rc.18](https://github.com/logaretm/villus/compare/v1.0.0-rc.17...v1.0.0-rc.18) (2021-06-29) +### Bug Fixes + +- added TData to client execute variants closes [#128](https://github.com/logaretm/villus/issues/128) ([80426e2](https://github.com/logaretm/villus/commit/80426e21c98301d9896f814e94c106a1374cd385)) + +# [1.0.0-rc.17](https://github.com/logaretm/villus/compare/v1.0.0-rc.16...v1.0.0-rc.17) (2021-05-12) + +**Note:** Version bump only for package villus + +# [1.0.0-rc.16](https://github.com/logaretm/villus/compare/v1.0.0-rc.15...v1.0.0-rc.16) (2021-04-15) + +**Note:** Version bump only for package villus + +# [1.0.0-rc.15](https://github.com/logaretm/villus/compare/v1.0.0-rc.14...v1.0.0-rc.15) (2021-03-06) ### Bug Fixes -* added TData to client execute variants closes [#128](https://github.com/logaretm/villus/issues/128) ([80426e2](https://github.com/logaretm/villus/commit/80426e21c98301d9896f814e94c106a1374cd385)) +- explose villus public types closes [#105](https://github.com/logaretm/villus/issues/105) ([a9b62de](https://github.com/logaretm/villus/commit/a9b62de2e24fba25c26cbf3527606d6f258a8b4c)) +- used correct import of type ([608018a](https://github.com/logaretm/villus/commit/608018a6fad13cd2626cf3cc9609e28d5dc472b4)) +# [1.0.0-rc.14](https://github.com/logaretm/villus/compare/v1.0.0-rc.13...v1.0.0-rc.14) (2021-03-04) +### Bug Fixes +- handle multiple executions state integrity ([43d936b](https://github.com/logaretm/villus/commit/43d936b91a407af0e3e83a1f1a1c81dbb00d0806)) +# [1.0.0-rc.13](https://github.com/logaretm/villus/compare/v1.0.0-rc.12...v1.0.0-rc.13) (2021-02-27) -# [1.0.0-rc.17](https://github.com/logaretm/villus/compare/v1.0.0-rc.16...v1.0.0-rc.17) (2021-05-12) +### Bug Fixes -### ☠️ Breaking +- ensure fetch recongizes partial error responses ([6c0a6fa](https://github.com/logaretm/villus/commit/6c0a6fa81a57131c9c23758435a1143f3fafd33d)) -Dropped support for Vue 2.x and removed usage of `vue-demi`, this was decided because half of the codebase didn't work with Vue 2 (HOC) and reactivity caveats of Vue 2 no longer applies to Vue 3 which is limiting. +# [1.0.0-rc.12](https://github.com/logaretm/villus/compare/v1.0.0-beta.0...v1.0.0-rc.12) (2021-02-16) +### Bug Fixes -# [1.0.0-rc.16](https://github.com/logaretm/villus/compare/v1.0.0-rc.15...v1.0.0-rc.16) (2021-04-15) +- effect conditions for Query and Subscription components ([20f6803](https://github.com/logaretm/villus/commit/20f68035861916dffadbe11ea5a55739cc1e9ac8)) +- ensure executeopts arg is optional ([f3f4bca](https://github.com/logaretm/villus/commit/f3f4bca64121938d22329ed70f5d6dceb1693121)) +- expose villus client symbol for testing ([141bf97](https://github.com/logaretm/villus/commit/141bf9717250894d58a71ce3dd8a28160677b229)) +- fetchonMounted typo ([09c3de4](https://github.com/logaretm/villus/commit/09c3de457e4a4b30742e5f315b1241b0961681fb)) +- handle non 200 error responses closes [#49](https://github.com/logaretm/villus/issues/49) ([0950fa8](https://github.com/logaretm/villus/commit/0950fa8a82060a02871d4eb027841eb0ecb31f96)) +- only resubscribe if the query/vars change closes [#94](https://github.com/logaretm/villus/issues/94) ([739b75e](https://github.com/logaretm/villus/commit/739b75e8e140fa418011672ba081bf10a4611237)) +- prevent running the query onMounted when suspended closes [#56](https://github.com/logaretm/villus/issues/56) ([27385b6](https://github.com/logaretm/villus/commit/27385b66e196a43e6ab64800183a693939f5320a)) +- remove invalid import ([3bfdaf7](https://github.com/logaretm/villus/commit/3bfdaf77028549c22705f0a702bb84a4dcd1d66f)) +- safe access to the provides property ([73efd25](https://github.com/logaretm/villus/commit/73efd25399988ea3615e208fff16ef8fbcd5d7e1)) +- type import path ([9c7c12c](https://github.com/logaretm/villus/commit/9c7c12ce0bbf8f1cf2d88b6b1b2d56a1b21299ba)) +- type the patched useResult ([31fe56b](https://github.com/logaretm/villus/commit/31fe56b89f9f8d02c48c02beec4227618cc6f2d8)) +- typing of operation in fetch plugin ([2dc8173](https://github.com/logaretm/villus/commit/2dc81738c784f00373a95d70bd75a38a3e35d62d)) +- use QueryVariables as default type for subscription forwarder [#93](https://github.com/logaretm/villus/issues/93) ([3791251](https://github.com/logaretm/villus/commit/37912514ce7f5fe1123d0f2c46c95963c67203ef)) +- use standard execution result for subscription forwarder closes [#93](https://github.com/logaretm/villus/issues/93) ([9ced480](https://github.com/logaretm/villus/commit/9ced480d387edb8d1d8893cc88d3ae0e856a897c)) +### Features + +- add install method to client ([#83](https://github.com/logaretm/villus/issues/83)) ([397bbdb](https://github.com/logaretm/villus/commit/397bbdb612a4bacfd5f3b9242d48b2ec94ccde14)) +- added context per query basis closes [#96](https://github.com/logaretm/villus/issues/96) ([8248b06](https://github.com/logaretm/villus/commit/8248b06674a4bf2757f0025740d7b775945acc09)) +- added dedup test ([8b12141](https://github.com/logaretm/villus/commit/8b1214155b0bd8c4ff1c89734af8ba1d6e2838f1)) +- allow adding other hash items to the query key helper ([5d18e8a](https://github.com/logaretm/villus/commit/5d18e8a7c3016cc9adef0bacfe43076878654a73)) +- avoid deduping mutations and subscriptions ([3bb9642](https://github.com/logaretm/villus/commit/3bb9642990b8fac1352964c965b6483ad0626655)) +- changed the signature of provider and useClient ([b4fa6d9](https://github.com/logaretm/villus/commit/b4fa6d953a4997554497253bf520d401c571d4b2)) +- enhance suspense query suspense API and allow override query vars ([c38e574](https://github.com/logaretm/villus/commit/c38e574a12801cf8e15b05c37637bc62b1cae9b4)) +- export plugins types ([598a65f](https://github.com/logaretm/villus/commit/598a65fec909ae273aa2bb588e0d9e3d306dee88)) +- expose getQueryKey helper ([26548d5](https://github.com/logaretm/villus/commit/26548d575d579bd1cff44c7cbacc93c07e06fee8)) +- expose new definePlugin type helper ([6f79a97](https://github.com/logaretm/villus/commit/6f79a97b040f132cdbea97a7e6050043f21b2195)) +- implement dedup plugin ([eb0f0a3](https://github.com/logaretm/villus/commit/eb0f0a36947aec6a5cf02a0b395acfe32f63f1d8)) +- implement response context closes [#62](https://github.com/logaretm/villus/issues/62) ([04cae29](https://github.com/logaretm/villus/commit/04cae29a8ba6163127a6da4985e37585084763ce)) +- initial isFetching ([#74](https://github.com/logaretm/villus/issues/74)) ([ea043da](https://github.com/logaretm/villus/commit/ea043da2a4d25c81e772c2a8b9a8c9ddf33e6680)) +- re-execute subscriptions closes [#79](https://github.com/logaretm/villus/issues/79) ([0ec4680](https://github.com/logaretm/villus/commit/0ec46802c80788531a7b84c516eac9d879b076e8)) +- re-implement subscriptions as a plugin ([e5e790a](https://github.com/logaretm/villus/commit/e5e790a404eb0cc27a9320999c03484e8bf575d5)) +- remove initialIsFetching and sync it with fetchOnMount ([a1e75c4](https://github.com/logaretm/villus/commit/a1e75c4aeb800a2e22e123bb1c75271258ff09dc)) +- rename lazy to fetchOnMount ([68b937e](https://github.com/logaretm/villus/commit/68b937ebfc91037494be33a67f643c22e11b5064)) +- rename pause and resume for queries to be more explicit ([ca9cf1e](https://github.com/logaretm/villus/commit/ca9cf1eb93aeff8a40cc9d85465e45089990d412)) +- rename pause prop to paused and watch its effect ([fca32d4](https://github.com/logaretm/villus/commit/fca32d4e03f57312340ca0cea6d6697eef21280a)) +- rename suspend prop to suspended for consistency ([06eaecd](https://github.com/logaretm/villus/commit/06eaecd8a5ac02f82d015511c8fb80db79150deb)) +- support typed document node ([9c166f6](https://github.com/logaretm/villus/commit/9c166f6bffa589ec580d8e8d6f2729ab17a662c0)) +- updated graphql dep closes [#65](https://github.com/logaretm/villus/issues/65) ([ef4be0a](https://github.com/logaretm/villus/commit/ef4be0afb8cba12a57c5cc128b999f570898fa69)) +- upgrade Vue and provide a workaround for [#72](https://github.com/logaretm/villus/issues/72) ([6127f37](https://github.com/logaretm/villus/commit/6127f379adf743b691f48f9bc6d044553f9771b5)) +- **breaking:** signature updates ([#70](https://github.com/logaretm/villus/issues/70)) ([47937e8](https://github.com/logaretm/villus/commit/47937e8437cae6e78769dc7b0abfa2f4c41f5996)) +- updated query component prop names ([d0fc40d](https://github.com/logaretm/villus/commit/d0fc40d7376c6e8cd3d7cfb02b03198e7e7d11f9)) +- use defineComponent helper with subscription ([ef7c16a](https://github.com/logaretm/villus/commit/ef7c16a4948b407f36523b037d58db41d9f50302)) +- use the defineComponent helper with Mutation component ([eb72067](https://github.com/logaretm/villus/commit/eb7206783e898b710463c87f0cb2a2e880c659e9)) +- use the defineComponent helper with Query component and omit redudencies ([d00e25b](https://github.com/logaretm/villus/commit/d00e25b8d924434ab44602d65788a2d4a9da5bda)) + +# [1.0.0-rc.11](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.10...villus@1.0.0-rc.11) (2021-01-20) ### Bug Fixes -* normalize the multipart queries closes [#112](https://github.com/logaretm/villus/issues/112) ([#113](https://github.com/logaretm/villus/issues/113)) ([c54fd0e](https://github.com/logaretm/villus/commit/c54fd0e80f8d05a4a115630e8b7c83bd2c58a5f3)) +- only resubscribe if the query/vars change closes [#94](https://github.com/logaretm/villus/issues/94) ([739b75e](https://github.com/logaretm/villus/commit/739b75e8e140fa418011672ba081bf10a4611237)) +- use QueryVariables as default type for subscription forwarder [#93](https://github.com/logaretm/villus/issues/93) ([3791251](https://github.com/logaretm/villus/commit/37912514ce7f5fe1123d0f2c46c95963c67203ef)) +- use standard execution result for subscription forwarder closes [#93](https://github.com/logaretm/villus/issues/93) ([9ced480](https://github.com/logaretm/villus/commit/9ced480d387edb8d1d8893cc88d3ae0e856a897c)) +# [1.0.0-rc.10](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.9...villus@1.0.0-rc.10) (2021-01-17) +### Bug Fixes +- ensure executeopts arg is optional ([f3f4bca](https://github.com/logaretm/villus/commit/f3f4bca64121938d22329ed70f5d6dceb1693121)) +# [1.0.0-rc.9](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.8...villus@1.0.0-rc.9) (2021-01-15) -# [1.0.0-rc.15](https://github.com/logaretm/villus/compare/v1.0.0-rc.14...v1.0.0-rc.15) (2021-03-06) +### Features +- enhance suspense query suspense API and allow override query vars ([c38e574](https://github.com/logaretm/villus/commit/c38e574a12801cf8e15b05c37637bc62b1cae9b4)) + +# [1.0.0-rc.8](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.7...villus@1.0.0-rc.8) (2021-01-05) ### Bug Fixes -* explose villus public types closes [#105](https://github.com/logaretm/villus/issues/105) ([a9b62de](https://github.com/logaretm/villus/commit/a9b62de2e24fba25c26cbf3527606d6f258a8b4c)) -* used correct import of type ([608018a](https://github.com/logaretm/villus/commit/608018a6fad13cd2626cf3cc9609e28d5dc472b4)) +- expose villus client symbol for testing ([141bf97](https://github.com/logaretm/villus/commit/141bf9717250894d58a71ce3dd8a28160677b229)) + +# [1.0.0-rc.7](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.6...villus@1.0.0-rc.7) (2021-01-02) +### Features +- remove initialIsFetching and sync it with fetchOnMount ([a1e75c4](https://github.com/logaretm/villus/commit/a1e75c4aeb800a2e22e123bb1c75271258ff09dc)) +# [1.0.0-rc.6](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.5...villus@1.0.0-rc.6) (2020-11-26) +### Features -# [1.0.0-rc.14](https://github.com/logaretm/villus/compare/v1.0.0-rc.13...v1.0.0-rc.14) (2021-03-04) +- add install method to client ([#83](https://github.com/logaretm/villus/issues/83)) ([397bbdb](https://github.com/logaretm/villus/commit/397bbdb612a4bacfd5f3b9242d48b2ec94ccde14)) +# [1.0.0-rc.5](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.4...villus@1.0.0-rc.5) (2020-11-25) ### Bug Fixes -* handle multiple executions state integrity ([43d936b](https://github.com/logaretm/villus/commit/43d936b91a407af0e3e83a1f1a1c81dbb00d0806)) +- remove invalid import ([3bfdaf7](https://github.com/logaretm/villus/commit/3bfdaf77028549c22705f0a702bb84a4dcd1d66f)) + +### Features + +- allow adding other hash items to the query key helper ([5d18e8a](https://github.com/logaretm/villus/commit/5d18e8a7c3016cc9adef0bacfe43076878654a73)) +- expose getQueryKey helper ([26548d5](https://github.com/logaretm/villus/commit/26548d575d579bd1cff44c7cbacc93c07e06fee8)) +- re-execute subscriptions closes [#79](https://github.com/logaretm/villus/issues/79) ([0ec4680](https://github.com/logaretm/villus/commit/0ec46802c80788531a7b84c516eac9d879b076e8)) +# [1.0.0-rc.4](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.3...villus@1.0.0-rc.4) (2020-11-01) +### Features +- expose new definePlugin type helper ([6f79a97](https://github.com/logaretm/villus/commit/6f79a97b040f132cdbea97a7e6050043f21b2195)) +# [1.0.0-rc.3](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.2...villus@1.0.0-rc.3) (2020-10-28) -# [1.0.0-rc.13](https://github.com/logaretm/villus/compare/v1.0.0-rc.12...v1.0.0-rc.13) (2021-02-27) +### Features + +- initial isFetching ([#74](https://github.com/logaretm/villus/issues/74)) ([ea043da](https://github.com/logaretm/villus/commit/ea043da2a4d25c81e772c2a8b9a8c9ddf33e6680)) +# [1.0.0-rc.2](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.1...villus@1.0.0-rc.2) (2020-10-27) ### Bug Fixes -* ensure fetch recongizes partial error responses ([6c0a6fa](https://github.com/logaretm/villus/commit/6c0a6fa81a57131c9c23758435a1143f3fafd33d)) -* handle batched respones with non 200 codes closes [#104](https://github.com/logaretm/villus/issues/104) ([5cb088d](https://github.com/logaretm/villus/commit/5cb088df59d0b0d64b71a27b21181a1e50e9e57e)) +- safe access to the provides property ([73efd25](https://github.com/logaretm/villus/commit/73efd25399988ea3615e208fff16ef8fbcd5d7e1)) +# [1.0.0-rc.1](https://github.com/logaretm/villus/compare/villus@1.0.0-rc.0...villus@1.0.0-rc.1) (2020-10-26) +### Features +- upgrade Vue and provide a workaround for [#72](https://github.com/logaretm/villus/issues/72) ([6127f37](https://github.com/logaretm/villus/commit/6127f379adf743b691f48f9bc6d044553f9771b5)) +# [1.0.0-rc.0](https://github.com/logaretm/villus/compare/villus@1.0.0-beta.8...villus@1.0.0-rc.0) (2020-10-22) -# [1.0.0-rc.12](https://github.com/logaretm/villus/compare/v1.0.0-beta.0...v1.0.0-rc.12) (2021-02-16) +### Features +- **breaking:** signature updates ([#70](https://github.com/logaretm/villus/issues/70)) ([47937e8](https://github.com/logaretm/villus/commit/47937e8437cae6e78769dc7b0abfa2f4c41f5996)) + +# [1.0.0-beta.8](https://github.com/logaretm/villus/compare/villus@1.0.0-beta.7...villus@1.0.0-beta.8) (2020-10-21) ### Bug Fixes -* effect conditions for Query and Subscription components ([20f6803](https://github.com/logaretm/villus/commit/20f68035861916dffadbe11ea5a55739cc1e9ac8)) -* ensure executeopts arg is optional ([f3f4bca](https://github.com/logaretm/villus/commit/f3f4bca64121938d22329ed70f5d6dceb1693121)) -* expose villus client symbol for testing ([141bf97](https://github.com/logaretm/villus/commit/141bf9717250894d58a71ce3dd8a28160677b229)) -* fetchonMounted typo ([09c3de4](https://github.com/logaretm/villus/commit/09c3de457e4a4b30742e5f315b1241b0961681fb)) -* handle network errors for the batch plugin closes [#86](https://github.com/logaretm/villus/issues/86) ([39a92aa](https://github.com/logaretm/villus/commit/39a92aa35a0ae54c772b317d35cd73d84548ec62)) -* handle non 200 error responses closes [#49](https://github.com/logaretm/villus/issues/49) ([0950fa8](https://github.com/logaretm/villus/commit/0950fa8a82060a02871d4eb027841eb0ecb31f96)) -* only resubscribe if the query/vars change closes [#94](https://github.com/logaretm/villus/issues/94) ([739b75e](https://github.com/logaretm/villus/commit/739b75e8e140fa418011672ba081bf10a4611237)) -* prevent running the query onMounted when suspended closes [#56](https://github.com/logaretm/villus/issues/56) ([27385b6](https://github.com/logaretm/villus/commit/27385b66e196a43e6ab64800183a693939f5320a)) -* remove invalid import ([3bfdaf7](https://github.com/logaretm/villus/commit/3bfdaf77028549c22705f0a702bb84a4dcd1d66f)) -* safe access to the provides property ([73efd25](https://github.com/logaretm/villus/commit/73efd25399988ea3615e208fff16ef8fbcd5d7e1)) -* type import path ([9c7c12c](https://github.com/logaretm/villus/commit/9c7c12ce0bbf8f1cf2d88b6b1b2d56a1b21299ba)) -* type the patched useResult ([31fe56b](https://github.com/logaretm/villus/commit/31fe56b89f9f8d02c48c02beec4227618cc6f2d8)) -* typing issue ([18de818](https://github.com/logaretm/villus/commit/18de8186566d36a43999c8fb0cab51ccd3102e0a)) -* typing of operation in fetch plugin ([2dc8173](https://github.com/logaretm/villus/commit/2dc81738c784f00373a95d70bd75a38a3e35d62d)) -* use QueryVariables as default type for subscription forwarder [#93](https://github.com/logaretm/villus/issues/93) ([3791251](https://github.com/logaretm/villus/commit/37912514ce7f5fe1123d0f2c46c95963c67203ef)) -* use standard execution result for subscription forwarder closes [#93](https://github.com/logaretm/villus/issues/93) ([9ced480](https://github.com/logaretm/villus/commit/9ced480d387edb8d1d8893cc88d3ae0e856a897c)) -* weird linting issue ([e0141d5](https://github.com/logaretm/villus/commit/e0141d512b65ab4b5ec2e714caa57c716fd53491)) - - -### Features - -* add install method to client ([#83](https://github.com/logaretm/villus/issues/83)) ([397bbdb](https://github.com/logaretm/villus/commit/397bbdb612a4bacfd5f3b9242d48b2ec94ccde14)) -* added basic implementation of multipart fetcher ([bca5ee8](https://github.com/logaretm/villus/commit/bca5ee857a0c9583850d4f23e673c3467321044f)) -* added cache-only policy closes [#30](https://github.com/logaretm/villus/issues/30) ([ef194b7](https://github.com/logaretm/villus/commit/ef194b7395f1ea24130647cea50e318b10b71aff)) -* added context per query basis closes [#96](https://github.com/logaretm/villus/issues/96) ([8248b06](https://github.com/logaretm/villus/commit/8248b06674a4bf2757f0025740d7b775945acc09)) -* added dedup test ([8b12141](https://github.com/logaretm/villus/commit/8b1214155b0bd8c4ff1c89734af8ba1d6e2838f1)) -* added edit page helper and new dark mode settings ([27f05eb](https://github.com/logaretm/villus/commit/27f05eb99ca65cc0eb64e7a0d9822dd513de3690)) -* allow adding other hash items to the query key helper ([5d18e8a](https://github.com/logaretm/villus/commit/5d18e8a7c3016cc9adef0bacfe43076878654a73)) -* avoid deduping mutations and subscriptions ([3bb9642](https://github.com/logaretm/villus/commit/3bb9642990b8fac1352964c965b6483ad0626655)) -* changed the signature of provider and useClient ([b4fa6d9](https://github.com/logaretm/villus/commit/b4fa6d953a4997554497253bf520d401c571d4b2)) -* draft the plugin api and implement fetch and cache plugins ([15d6adc](https://github.com/logaretm/villus/commit/15d6adc0a165cd9f420d3440d449026c7869bcde)) -* enhance suspense query suspense API and allow override query vars ([c38e574](https://github.com/logaretm/villus/commit/c38e574a12801cf8e15b05c37637bc62b1cae9b4)) -* export plugins types ([598a65f](https://github.com/logaretm/villus/commit/598a65fec909ae273aa2bb588e0d9e3d306dee88)) -* expose getQueryKey helper ([26548d5](https://github.com/logaretm/villus/commit/26548d575d579bd1cff44c7cbacc93c07e06fee8)) -* expose new definePlugin type helper ([6f79a97](https://github.com/logaretm/villus/commit/6f79a97b040f132cdbea97a7e6050043f21b2195)) -* generate query key on client level ([84ebccb](https://github.com/logaretm/villus/commit/84ebccbad54d1a015717ed58e587a86da49e83e1)) -* implement dedup plugin ([eb0f0a3](https://github.com/logaretm/villus/commit/eb0f0a36947aec6a5cf02a0b395acfe32f63f1d8)) -* implement response context closes [#62](https://github.com/logaretm/villus/issues/62) ([04cae29](https://github.com/logaretm/villus/commit/04cae29a8ba6163127a6da4985e37585084763ce)) -* initial isFetching ([#74](https://github.com/logaretm/villus/issues/74)) ([ea043da](https://github.com/logaretm/villus/commit/ea043da2a4d25c81e772c2a8b9a8c9ddf33e6680)) -* re-execute subscriptions closes [#79](https://github.com/logaretm/villus/issues/79) ([0ec4680](https://github.com/logaretm/villus/commit/0ec46802c80788531a7b84c516eac9d879b076e8)) -* re-implement batch using the new plugins API ([861da91](https://github.com/logaretm/villus/commit/861da912029ba4caafb26a19cc92b20bb4e55d6a)) -* re-implement subscriptions as a plugin ([e5e790a](https://github.com/logaretm/villus/commit/e5e790a404eb0cc27a9320999c03484e8bf575d5)) -* remove initialIsFetching and sync it with fetchOnMount ([a1e75c4](https://github.com/logaretm/villus/commit/a1e75c4aeb800a2e22e123bb1c75271258ff09dc)) -* remove uneeded stop signal ([8f436a3](https://github.com/logaretm/villus/commit/8f436a3ce6e71f36d0f9f05de8c9fe01588c07f5)) -* rename lazy to fetchOnMount ([68b937e](https://github.com/logaretm/villus/commit/68b937ebfc91037494be33a67f643c22e11b5064)) -* rename pause and resume for queries to be more explicit ([ca9cf1e](https://github.com/logaretm/villus/commit/ca9cf1eb93aeff8a40cc9d85465e45089990d412)) -* rename pause prop to paused and watch its effect ([fca32d4](https://github.com/logaretm/villus/commit/fca32d4e03f57312340ca0cea6d6697eef21280a)) -* rename suspend prop to suspended for consistency ([06eaecd](https://github.com/logaretm/villus/commit/06eaecd8a5ac02f82d015511c8fb80db79150deb)) -* support typed document node ([9c166f6](https://github.com/logaretm/villus/commit/9c166f6bffa589ec580d8e8d6f2729ab17a662c0)) -* updated graphql dep closes [#65](https://github.com/logaretm/villus/issues/65) ([ef4be0a](https://github.com/logaretm/villus/commit/ef4be0afb8cba12a57c5cc128b999f570898fa69)) -* updated query component prop names ([d0fc40d](https://github.com/logaretm/villus/commit/d0fc40d7376c6e8cd3d7cfb02b03198e7e7d11f9)) -* upgrade Vue and provide a workaround for [#72](https://github.com/logaretm/villus/issues/72) ([6127f37](https://github.com/logaretm/villus/commit/6127f379adf743b691f48f9bc6d044553f9771b5)) -* use defineComponent helper with subscription ([ef7c16a](https://github.com/logaretm/villus/commit/ef7c16a4948b407f36523b037d58db41d9f50302)) -* use public API and add villus to deps ([4b98e79](https://github.com/logaretm/villus/commit/4b98e79d3e146da608a45d72ac81e00b6ba735ec)) -* use the defineComponent helper with Query component and omit redudencies ([d00e25b](https://github.com/logaretm/villus/commit/d00e25b8d924434ab44602d65788a2d4a9da5bda)) -* use the public plugin API and add villus to multipart deps ([77fb90f](https://github.com/logaretm/villus/commit/77fb90f71e400b3000dd18ffbfa7f355365c5c01)) -* **breaking:** signature updates ([#70](https://github.com/logaretm/villus/issues/70)) ([47937e8](https://github.com/logaretm/villus/commit/47937e8437cae6e78769dc7b0abfa2f4c41f5996)) -* use the defineComponent helper with Mutation component ([eb72067](https://github.com/logaretm/villus/commit/eb7206783e898b710463c87f0cb2a2e880c659e9)) +- type import path ([9c7c12c](https://github.com/logaretm/villus/commit/9c7c12ce0bbf8f1cf2d88b6b1b2d56a1b21299ba)) +- type the patched useResult ([31fe56b](https://github.com/logaretm/villus/commit/31fe56b89f9f8d02c48c02beec4227618cc6f2d8)) + +### Features + +- added dedup test ([8b12141](https://github.com/logaretm/villus/commit/8b1214155b0bd8c4ff1c89734af8ba1d6e2838f1)) +- avoid deduping mutations and subscriptions ([3bb9642](https://github.com/logaretm/villus/commit/3bb9642990b8fac1352964c965b6483ad0626655)) +- implement dedup plugin ([eb0f0a3](https://github.com/logaretm/villus/commit/eb0f0a36947aec6a5cf02a0b395acfe32f63f1d8)) +- implement response context closes [#62](https://github.com/logaretm/villus/issues/62) ([04cae29](https://github.com/logaretm/villus/commit/04cae29a8ba6163127a6da4985e37585084763ce)) +- updated graphql dep closes [#65](https://github.com/logaretm/villus/issues/65) ([ef4be0a](https://github.com/logaretm/villus/commit/ef4be0afb8cba12a57c5cc128b999f570898fa69)) + +# [1.0.0-beta.7](https://github.com/logaretm/villus/compare/villus@1.0.0-beta.6...villus@1.0.0-beta.7) (2020-10-19) + +### Bug Fixes + +- typing of operation in fetch plugin ([2dc8173](https://github.com/logaretm/villus/commit/2dc81738c784f00373a95d70bd75a38a3e35d62d)) + +### Features + +- support typed document node ([9c166f6](https://github.com/logaretm/villus/commit/9c166f6bffa589ec580d8e8d6f2729ab17a662c0)) + +# [1.0.0-beta.6](https://github.com/logaretm/villus/compare/villus@1.0.0-beta.5...villus@1.0.0-beta.6) (2020-10-09) + +### Bug Fixes + +- prevent running the query onMounted when suspended closes [#56](https://github.com/logaretm/villus/issues/56) ([27385b6](https://github.com/logaretm/villus/commit/27385b66e196a43e6ab64800183a693939f5320a)) + +# [1.0.0-beta.5](https://github.com/logaretm/villus/compare/villus@1.0.0-beta.4...villus@1.0.0-beta.5) (2020-10-09) + +### Bug Fixes + +- fetchonMounted typo ([09c3de4](https://github.com/logaretm/villus/commit/09c3de457e4a4b30742e5f315b1241b0961681fb)) + +# [1.0.0-beta.4](https://github.com/logaretm/villus/compare/villus@1.0.0-beta.3...villus@1.0.0-beta.4) (2020-10-07) + +### Bug Fixes + +- effect conditions for Query and Subscription components ([20f6803](https://github.com/logaretm/villus/commit/20f68035861916dffadbe11ea5a55739cc1e9ac8)) + +### Features + +- re-implement subscriptions as a plugin ([e5e790a](https://github.com/logaretm/villus/commit/e5e790a404eb0cc27a9320999c03484e8bf575d5)) +- rename lazy to fetchOnMount ([68b937e](https://github.com/logaretm/villus/commit/68b937ebfc91037494be33a67f643c22e11b5064)) +- rename pause and resume for queries to be more explicit ([ca9cf1e](https://github.com/logaretm/villus/commit/ca9cf1eb93aeff8a40cc9d85465e45089990d412)) +- rename pause prop to paused and watch its effect ([fca32d4](https://github.com/logaretm/villus/commit/fca32d4e03f57312340ca0cea6d6697eef21280a)) +- rename suspend prop to suspended for consistency ([06eaecd](https://github.com/logaretm/villus/commit/06eaecd8a5ac02f82d015511c8fb80db79150deb)) +- updated query component prop names ([d0fc40d](https://github.com/logaretm/villus/commit/d0fc40d7376c6e8cd3d7cfb02b03198e7e7d11f9)) +- use defineComponent helper with subscription ([ef7c16a](https://github.com/logaretm/villus/commit/ef7c16a4948b407f36523b037d58db41d9f50302)) +- use the defineComponent helper with Mutation component ([eb72067](https://github.com/logaretm/villus/commit/eb7206783e898b710463c87f0cb2a2e880c659e9)) +- use the defineComponent helper with Query component and omit redudencies ([d00e25b](https://github.com/logaretm/villus/commit/d00e25b8d924434ab44602d65788a2d4a9da5bda)) + +# [1.0.0-beta.3](https://github.com/logaretm/villus/compare/villus@1.0.0-beta.2...villus@1.0.0-beta.3) (2020-10-05) + +**Note:** Version bump only for package villus + +# [1.0.0-beta.2](https://github.com/logaretm/villus/compare/villus@1.0.0-beta.1...villus@1.0.0-beta.2) (2020-10-02) + +**Note:** Version bump only for package villus + +# 1.0.0-beta.1 (2020-09-30) + +### Breaking Changes + +- deprecate the `context` and `fetch` options in favor of [custom plugins API](https://villus.dev/villus/guide/plugins) +- deprecate the exported `batch` fetcher in favor of [`@villus/batch` plugin](https://villus.dev/villus/plugins/batch) +- changed the signature of provider and useClient ([b4fa6d9](https://github.com/logaretm/villus/commit/b4fa6d953a4997554497253bf520d401c571d4b2)) due to conflicts with TypeScript typings + +### Bug Fixes + +- handle non 200 error responses closes [#49](https://github.com/logaretm/villus/issues/49) ([0950fa8](https://github.com/logaretm/villus/commit/0950fa8a82060a02871d4eb027841eb0ecb31f96)) + +### Features + +#### Plugins API + +A large chunk of villus code has been re-written from scratch to use a pipeline-like operation transformers (plugins) similair to what apollo client and urql are doing with much less jargon and complexity, they are just a simple middleware performing operations on GraphQL queries as they go out or after execution. + +[Check the documentation here](https://villus.dev/villus/guide/plugins) + +#### `multipart` plugin + +The `multipart` plugin will enable support for graphql file upload, [check the documentation and examples here](https://villus.dev/villus/plugins/multipart) diff --git a/README.md b/README.md index d71fec57..e8045003 100644 --- a/README.md +++ b/README.md @@ -1,24 +1,39 @@ # villus

- +

+ + + + + + + + + + + + +

-[![codecov](https://codecov.io/gh/logaretm/villus/branch/main/graph/badge.svg)](https://codecov.io/gh/logaretm/villus) -[![circleci](https://circleci.com/gh/logaretm/villus.svg?style=svg)](https://circleci.com/gh/logaretm/vee-validate) -[![Bundle Size](https://badgen.net/bundlephobia/minzip/villus)](https://bundlephobia.com/result?p=villus) -[![npm](https://img.shields.io/npm/dm/villus.svg)](https://npm-stat.com/charts.html?package=villus) -[![npm](https://img.shields.io/npm/v/villus.svg)](https://www.npmjs.com/package/villus) +
Villus is a finger-like structures in the small intestine. They help to absorb digested food.
+

+A small and fast GraphQL client for **Vue.js**

-
Villus is a finger-like structures in the small intestine. They help to absorb digested food.
+

+ + + +

-A small and fast GraphQL client for **Vue.js 3.x** +
-This is forked from my previous work at [vue-gql](https://github.com/baianat/vue-gql) before they decide to go for a different direction with this library. +You can also help this this project and my other projects by donating one time or by sponsoring. ## Features @@ -27,9 +42,8 @@ This is forked from my previous work at [vue-gql](https://github.com/baianat/vue - 🗄 **Caching:** Simple and convenient query caching by default - 👕 **TypeScript:** Written in Typescript and Supports GraphQL TS tooling - 🖇 **Composable:** Built for the Composition API -- ⚡️ **Suspense:** Supports the `` API in Vue 3 +- ⚡️ **Suspense:** Supports the `` API - 🔌 **Plugins:** Use existing plugins and create custom ones -- Higher-order components available ## Why use this @@ -43,7 +57,7 @@ You can read more about it in the [announcement post](https://logaretm.com/blog/ ## Documentation -You can find the [documentation here](https://villus.logaretm.com/) +You can find the [documentation here](https://villus.dev/) ## Quick Start @@ -66,23 +80,18 @@ Or because villus is so simple, you can use it via CDN: ``` -You can now use it with either the new Vue composition API or higher order components. - ### Usage Configure the GraphQL client for your root component: -```js +```vue + ``` Then you can use `useQuery` in any child component: @@ -96,46 +105,34 @@ Then you can use `useQuery` in any child component: - ``` -There is also the higher-order component flavor if you prefer to use them instead. Read the [docs for more examples and details](https://villus.logaretm.com/). - -`villus` makes frequent tasks such as re-fetching, caching, deduplication, mutations, and subscriptions a breeze. It has even built-in `Suspense` support with Vue 3! Consult the [documentation](https://villus.logaretm.com) for more use-cases and examples. +`villus` makes frequent tasks such as re-fetching, caching, deduplication, mutations, and subscriptions a breeze. It has even built-in `Suspense` support with Vue 3! Consult the [documentation](https://villus.dev) for more use-cases and examples. ## Compatibility This library relies on the `fetch` web API to run queries, you can use [`unfetch`](https://github.com/developit/unfetch) (client-side) or [`node-fetch`](https://www.npmjs.com/package/node-fetch) (server-side) to use as a polyfill. -## Examples +This library is compatible with Vue 3.0+ or 2.7+ -Live examples can be found [here](https://villus.logaretm.com/examples/basic-query) - -## Sponsorship - -You can help this this project by donating one time or by sponsoring via the following link +## Examples -Buy Me A Coffee +Live examples can be found [here](https://villus.dev/examples/basic-query) ## License diff --git a/commitlint.config.js b/commitlint.config.js index 8eea6b9b..99a6f40c 100644 --- a/commitlint.config.js +++ b/commitlint.config.js @@ -1,4 +1,4 @@ -module.exports = { +export default { rules: { 'body-leading-blank': [1, 'always'], 'footer-leading-blank': [1, 'always'], diff --git a/docs/.astro/settings.json b/docs/.astro/settings.json new file mode 100644 index 00000000..4233bf35 --- /dev/null +++ b/docs/.astro/settings.json @@ -0,0 +1,5 @@ +{ + "_variables": { + "lastUpdateCheck": 1737385742447 + } +} \ No newline at end of file diff --git a/docs/.astro/types.d.ts b/docs/.astro/types.d.ts new file mode 100644 index 00000000..f964fe0c --- /dev/null +++ b/docs/.astro/types.d.ts @@ -0,0 +1 @@ +/// diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md new file mode 100644 index 00000000..5474b556 --- /dev/null +++ b/docs/CHANGELOG.md @@ -0,0 +1,12 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +# [3.1.0](https://github.com/logaretm/villus/compare/v3.0.0...v3.1.0) (2023-04-04) + +**Note:** Version bump only for package villus-docs + +# [3.0.0](https://github.com/logaretm/villus/compare/v2.2.1...v3.0.0) (2023-03-20) + +**Note:** Version bump only for package villus-docs diff --git a/docs/assets/css/app.css b/docs/assets/css/app.css deleted file mode 100644 index b6703f22..00000000 --- a/docs/assets/css/app.css +++ /dev/null @@ -1,10 +0,0 @@ -@import url('https://fonts.googleapis.com/css?family=Montserrat:700|Noto+Sans&display=swap'); -@import url('https://fonts.googleapis.com/css?family=Montserrat:700|Noto+Sans:400,700&display=swap'); - -html, -body { - width: 100%; - height: 100%; - @apply font-body; - scroll-padding-top: 130px; -} diff --git a/docs/assets/css/tailwind.css b/docs/assets/css/tailwind.css deleted file mode 100644 index d051f76c..00000000 --- a/docs/assets/css/tailwind.css +++ /dev/null @@ -1,6 +0,0 @@ -@import 'tailwindcss/base'; -@import 'tailwindcss/components'; - -@import './app.css'; - -@import 'tailwindcss/utilities'; diff --git a/docs/assets/img/logo.png b/docs/assets/img/logo.png deleted file mode 100644 index 518dbee0..00000000 Binary files a/docs/assets/img/logo.png and /dev/null differ diff --git a/docs/astro.config.ts b/docs/astro.config.ts new file mode 100644 index 00000000..389a1851 --- /dev/null +++ b/docs/astro.config.ts @@ -0,0 +1,25 @@ +import { defineConfig } from 'astro/config'; +import remarkGfm from 'remark-gfm'; +import mdx from '@astrojs/mdx'; +import sitemap from '@astrojs/sitemap'; +import vue from '@astrojs/vue'; +import highlight from './src/highlight'; + +import partytown from '@astrojs/partytown'; + +// https://astro.build/config +export default defineConfig({ + site: process.env.NODE_ENV === 'production' ? 'https://villus.dev' : 'http://localhost:3000', + integrations: [ + vue(), + sitemap(), + mdx({ + remarkPlugins: [remarkGfm, highlight], + }), + partytown({ + config: { + forward: ['dataLayer.push'], + }, + }), + ], +}); diff --git a/docs/components/AlgoliaSearchBox.vue b/docs/components/AlgoliaSearchBox.vue deleted file mode 100644 index 7f541a5c..00000000 --- a/docs/components/AlgoliaSearchBox.vue +++ /dev/null @@ -1,163 +0,0 @@ - - - - - diff --git a/docs/components/ContentWrapper.vue b/docs/components/ContentWrapper.vue deleted file mode 100644 index e987bc87..00000000 --- a/docs/components/ContentWrapper.vue +++ /dev/null @@ -1,431 +0,0 @@ - - - - - diff --git a/docs/components/Sponsorship.vue b/docs/components/Sponsorship.vue deleted file mode 100644 index a365b976..00000000 --- a/docs/components/Sponsorship.vue +++ /dev/null @@ -1,49 +0,0 @@ - - - diff --git a/docs/content/api/mutation.md b/docs/content/api/mutation.md deleted file mode 100644 index f489278b..00000000 --- a/docs/content/api/mutation.md +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: -description: API reference for the Mutation component -order: 5 ---- - -## Mutation - -The `Mutation` component uses [scoped slots](https://v3.vuejs.org/guide/component-slots.html#scoped-slots) to provide the mutation state to the slot template. - - - -The **Mutation** component is **renderless** by default, meaning it will not render any extra HTML other than its slot. - - - -## Props - -The `Mutation` component accepts the following props: - -| Prop | Type | Required | Description | -| ----- | -------------------------- | -------- | ------------------------ | -| query | `string` or `DocumentNode` | **Yes** | The query to be executed | - -## Slot Props - -The `Mutation` component exposes a single `default` slot with the following properties: - -| Property | Type | Description | -| ---------- | -------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------- | -| data | `any/null` | The GraphQL query result's `data` | -| error | `CombinedError` | Any errors encountered during query execution | -| execute | `(variables: object) => Promise>` | Executes the query and returns the operation result containing `data` and `error` values | -| isDone | `boolean` | Set to true when the query is executed at least once, never resets to `false` | -| isFetching | `boolean` | Set to true when the query is executing either by calling `execute` explicitly or by watch effect due to reactive variables or queries | - -## Events - -The `Mutation` component does not emit any events at the moment diff --git a/docs/content/api/query.md b/docs/content/api/query.md deleted file mode 100644 index 9a25efad..00000000 --- a/docs/content/api/query.md +++ /dev/null @@ -1,44 +0,0 @@ ---- -title: -description: API reference for the Query component -order: 4 ---- - -## Query - -The `Query` component uses [scoped slots](https://v3.vuejs.org/guide/component-slots.html#scoped-slots) to provide the query state to the slot template. - - - -The **Query** component is **renderless** by default, meaning it will not render any extra HTML other than its slot. - - - -## Props - -The `Query` component accepts the following props: - -| Prop | Type | Required | Description | -| -------------- | -------------------------------------------------------------------------------------------- | -------- | ----------------------------------------------------------------------------------------------------- | -| query | `string` or `DocumentNode` | **Yes** | The query to be executed | -| variables | `object` | **No** | The query variables | -| cachePolicy | A `string` with those possible values `cache-and-network` or `network-only` or `cache-first` | **No** | The cache policy to execute the query with, defaults to the value configured with the provided client | -| fetchOnMount | `boolean` | **No** | If the query **should be** be executed on `onMounted` lifecycle hook, default is `true` | -| suspended | `boolean` | **No** | If the component is suspended with `Suspend` or not, defaults to `false` | -| watchVariables | `boolean` | **No** | If the query variable watching is disabled or not, defaults to `true` | - -## Slot Props - -The `Query` component exposes a single `default` slot with the following properties: - -| Property | Type | Description | -| ---------- | ----------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------- | -| data | `any/null` | The GraphQL query result's `data` | -| error | `CombinedError` | Any errors encountered during query execution | -| execute | `({cachePolicy: CachePolicy}) => Promise>` | Executes the query and returns the operation result containing `data` and `error` values | -| isDone | `boolean` | Set to true when the query is executed at least once, never resets to `false` | -| isFetching | `boolean` | Set to true when the query is executing either by calling `execute` explicitly or by watch effect due to reactive variables or queries | - -## Events - -The `Query` component does not emit any events at the moment diff --git a/docs/content/api/subscription.md b/docs/content/api/subscription.md deleted file mode 100644 index 0710629f..00000000 --- a/docs/content/api/subscription.md +++ /dev/null @@ -1,42 +0,0 @@ ---- -title: -description: API reference for the useQuery composable function -order: 6 ---- - -## Subscription - -The `Subscription` component uses [scoped slots](https://v3.vuejs.org/guide/component-slots.html#scoped-slots) to provide the subscription state to the slot template. - - - -The **Subscription** component is **renderless** by default, meaning it will not render any extra HTML other than its slot. - - - -## Props - -The `Subscription` component accepts the following props: - -| Prop | Type | Required | Description | -| --------- | ------------------------------------------------- | -------- | ---------------------------------------------------------------------------------------------------------------------------------------------- | -| query | `string` or `DocumentNode` | **Yes** | The subscription to be executed/started | -| variables | `object` | **No** | The subscription variables | -| paused | `boolean` | **No** | Activates/Deactivates the subscription, defaults to `false` | -| reduce | `(prev: any, current: ) => any` or `DocumentNode` | **No** | A reducer used to aggregate the values returned by the subscription, check the [subscription guide for more information](/guide/subscriptions) | - -## Slot Props - -The `Mutation` component exposes a single `default` slot with the following properties: - -| Property | Type | Description | -| ---------- | --------------- | -------------------------------------------------------------------------------------------------------------------------------------- | -| data | `any/null` | The GraphQL query result's `data` | -| error | `CombinedError` | Any errors encountered during query execution | -| isDone | `boolean` | Set to true when the query is executed at least once, never resets to `false` | -| isFetching | `boolean` | Set to true when the query is executing either by calling `execute` explicitly or by watch effect due to reactive variables or queries | -| isPaused | `boolean` | If the subscription is currently paused or inactive | - -## Events - -The `Mutation` component does not emit any events at the moment diff --git a/docs/content/api/use-subscription.md b/docs/content/api/use-subscription.md deleted file mode 100644 index 779f2013..00000000 --- a/docs/content/api/use-subscription.md +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: useSubscription() -description: API reference for the useSubscription composable function -order: 3 ---- - -## useSubscription() - -The `useSubscription` function allows you to execute GraphQL subscriptions, it requires a `Provider` or `useClient` to be configured in the component tree with a subscription forwarder configured, so make sure to [set that up](/guide/subscriptions) before using `useSubscription`. - -The `useSubscription` function returns the following properties and functions: - -| Property | Type | Description | -| -------- | -------------------- | ----------------------------------------------------------------- | -| data | `Ref` | The GraphQL subscription result's `data` | -| error | `Ref` | Any errors encountered during subscription execution | -| isPaused | `Ref` | True if the subscription is paused or inactive | -| pause | `() => void` | Deactivates the subscription temporarily until `resume` is called | -| resume | `() => void` | Activates the subscription | - -## Usage - -The `useSubscription` function is slightly more complex and accepts two arguments, the first being the operation object which contains the following properties: - -| Property | Type | Required | Description | -| --------- | ------------------------------------------- | -------- | ------------------------------- | -| query | `string` or `DocumentNode` or `Ref` | **Yes** | The subscription to be executed | -| variables | `object` or `Ref` | **No** | The subscription variables | - -The second argument is what is called a `Reducer` which allows you aggregate subscription results. For more information about that, [check the subscription guide](/guide/subscriptions). - -Here is a full example of the usage: - -```js -function messagesReducer(oldValue, response) { - oldValue = oldValue || []; - if (!response.data || response.errors) { - return oldValue; - } - - return [...oldValue, response.data.newMessages]; -} - -const NewMessages = ` - subscription NewMessages { - newMessages { - id - from - message - } - } -`; - -const { data } = useSubscription( - { - query: NewMessages, - }, - messagesReducer -); -``` - -## Reactivity - -Subscriptions are fired once and continuously keep emitting results. Because of that, `useSubscription` doesn't accept any reactive queries or variables you may pass. - -For more information about subscriptions, you can check [the subscription guide](/guide/subscriptions). diff --git a/docs/content/guide/mutations.md b/docs/content/guide/mutations.md deleted file mode 100644 index 0075ffbf..00000000 --- a/docs/content/guide/mutations.md +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: Mutations -description: Learn how to run GraphQL mutations -order: 4 ---- - -# Mutations - -## Mutations Basics - -**villus** offers both a `useMutation` function and a `Mutation` component that are very similar their **[querying](/queries.md)** counterparts but with few distinct differences: - -- They **do not** accept a `variables` prop or argument. -- They **do not** run automatically, you have to explicitly call `execute`. -- Cache policies do not apply to mutations as mutations represent user actions and will always use `network-only` policy. - -Here is an example for the `useMutation` function: - -```vue - - - -``` - -## Passing Variables - -Since the `useMutation` function does not accept a `variables` property you can pass them to the `execute` function: - -```js -const LikePost = ` - mutation LikePost ($id: ID!) { - likePost (id: $id) { - message - } - } -`; - -// in setup -const { data, execute } = useMutation(LikePost); -const variables = { - id: 123, -}; - -function onSubmit() { - execute(variables); -} -``` - -## Handling Errors - -You can handle errors by either grabbing the `error` ref returned from the `useMutation` function or by checking the result of the `execute` promise, the latter is preferable as it makes more sense in most situations. The `execute` function doesn't throw and collects all encountered errors into a `CombinedError` instance that contains any GraphQL or network errors encountered. - -```js -const LikePost = ` - mutation LikePost ($id: ID!) { - likePost (id: $id) { - message - } - } -`; - -// in setup -const { data, execute } = useMutation(LikePost); -const variables = { - id: 123, -}; - -function onSubmit() { - execute(variables).then(result => { - if (result.error) { - // Do something - } - }); -} -``` - -There are more stuff you can do with mutations, like displaying progress for users. Check the API documentation for [useMutation](/api/use-mutation) and [Mutation component](/api/mutation). diff --git a/docs/content/guide/queries.md b/docs/content/guide/queries.md deleted file mode 100644 index 5981cc23..00000000 --- a/docs/content/guide/queries.md +++ /dev/null @@ -1,495 +0,0 @@ ---- -title: Queries -description: Learn how to run GraphQL queries -order: 3 ---- - -# Queries - -You can query GraphQL APIs with the `useQuery` function or `Query` component after you've setup the [GraphQL Client](/setup.md). This guide will focus on using the composable API because it is more flexible and concise, everything covered in this guide can be done with the `Query` component. - -## Queries Basics - -The `useQuery` function is a composable function that provides query state and various helper methods around managing the query. - -To execute a query the `useQuery` accepts a GraphQL query as the first argument. The `query` property is a `string` containing the query body or a `DocumentNode` (AST) created by `graphql-tag`. - -```vue - - - -``` - -## With [graphql-tag](https://github.com/apollographql/graphql-tag) - -You can use `graphql-tag` to compile your queries or load them with the `graphql-tag/loader`. - -This a sample with the `useQuery` function: - -```js -import { gql } from 'graphql-tag'; - -// In setup -const GetTodos = gql` - GetTodos { - todos { - id - title - } - } -`; - -const { data } = useQuery({ - query: GetTodos, -}); - -return { data }; -``` - -If you are using **webpack** you can configure the loader `graphql-tag/loader` and use `import/require`: - -```js -import { Todos } from '@/graphql/todos.gql'; - -// In setup -const { data } = useQuery({ - query: Todos, -}); - -return { data }; -``` - -## Query Variables - -You can pass variables to your queries as the second argument of `useQuery`: - -```js -// in setup - -const FetchTodo = ` - query FetchTodo ($id: ID!) { - todo (id: $id) { - text - } - } -`; - -const { data } = useQuery({ - query: GetTodos, - variables: { id: 123 }, -}); -``` - -However if you want to re-fetch the query whenever the variables change, then this is where the composition API shines. You can pass a [reactive object](https://v3.vuejs.org/api/basic-reactivity.html#reactive) containing your variables and the query will automatically execute with the new variables value: - -```js -import { reactive } from 'vue'; -import { useQuery } from 'villus'; - -const variables = reactive({ - id: 123, -}); - -const { data } = useQuery({ - query: `query FetchTodo ($id: ID!) { - todo (id: $id) { - text - } - } - `, - variables, -}); -``` - -This also works with [reactive Refs](https://v3.vuejs.org/api/refs-api.html#ref) - -```js -import { ref } from 'vue'; -import { useQuery } from 'villus'; - -const variables = ref({ - id: 123, -}); - -const FetchTodo = ` - query FetchTodo ($id: ID!) { - todo (id: $id) { - text - } - } -`; - -const { data } = useQuery({ - query: FetchTodo, - variables, -}); -``` - -This is only one way to re-fetch queries, because `villus` is built with composable API first you will find many ways to re-fetch your queries no matter how complex your requirements are. - -## Re-fetching Queries - -Sometimes you want to re-fetch the query or run it after some action, the `execute` function that is returned from the `useQuery` function and available on the `Query` component slot props. When called it re-executes the query. This example executes the query after the button has been clicked, note that the query is still fetched initially. - -Here is a snippet for calling `execute` with `useQuery`: - -```js -// in setup -const { data, execute } = useQuery({ - // ... -}); - -return { - data, - // call execute whenever you want the query to re-fetch - execute, -}; -``` - -This can be very useful in situations where you have a complex logic that triggers a refetch, that means `watch` and `watchEffect` play really well with the `execute` function: - -```js -import { watch } from 'vue'; -import { useQuery } from 'villus'; - -const GetTodos = ` - GetTodos { - todos { - id - title - } - } -`; - -// in your setup -const { data, execute } = useQuery({ - query: GetTodos, -}); - -watch(someComputedProp, () => execute()); -``` - -## Reactive Queries - -Vue is all about reactivity to achieve better DX, and villus follows this philosophy as well. You are not only limited to reactive variables, you can also have reactive queries. In other words, queries created with `ref` or `computed` are recognized as reactive queries and will be watched automatically and re-fetched whenever the query changes. - -```js -import { computed, ref } from 'vue'; -import { useQuery } from 'villus'; - -// computed id that will be used to compute the query -const id = ref(1); - -// Create a computed query -const FetchTodo = computed(() => { - return `query FetchTodo { - todo (id: ${id.value}) { - text - } - } - `; -}); - -const { data } = useQuery({ - query: FetchTodo, -}); - -// later on, changing the `id` ref will automatically refetch the query because it is computed -id.value = 2; -``` - -Reactive queries are very flexible and one of the many advantages of using the composition API. - -### Disabling Re-fetching - -You can disable the automatic refetch behavior by calling the `pause` function returned by the `useQuery` function: - -```js -import { ref } from 'vue'; - -const GetPostById = ` - query getPost ($id: ID!) { - post (id: $id) { - id - title - } - } -`; - -// Create a reactive variables object -const variables = ref({ id: 123 }); -const { data, watchVariables, unwatchVariables, isWatchingVariables } = useQuery({ - query: GetPostById, - variables, -}); - -// variables/query watching is stopped. -unwatchVariables(); - -// variables/query watching is resumed. -watchVariables(); - -// Reports the current watching status true/false -isWatchingVariables.value; -``` - -## Caching - -Queries are **cached in memory**, the uniqueness criteria is the query name, body, and its variables. Meaning if the same query is run with the same variables it will be fetched from the cache by default and will not hit the network. **Cache is deleted after the user closes/refreshes the page.** - -By default the client uses `cache-first` policy to handle queries, the full list of available policies are: - -- `cache-first`: If found in cache return it, otherwise fetch it from the network -- `network-only`: Always fetch from the network and do not cache it -- `cache-and-network`: If found in cache return it, then fetch a fresh result from the network and update current data (reactive). if not found in cache it will fetch it from network and cache it -- `cache-only`: If found in cache return it, otherwise returns `null` for both `data` and `errors` - -You can specify a different strategy on different levels: - -### On the client level - -You can set the default policy on the client level when you are [building the GraphQL client](/client.md) by passing `cachePolicy` option to either: - -The `createClient` function: - -```js{3,10} -const client = createClient({ - url: '/graphql', // Your endpoint - cachePolicy: 'network-only', -}); -``` - -This will make all the `Query` components under the `Provider` tree use the `network-only` policy by default. - -You can also pass it to the `useClient` composition function: - -```js{4} -// in setup -useClient({ - url: '/graphql', // Your endpoint - cachePolicy: 'network-only', -}); -``` - -This will make all the child-components using `useQuery` or `Query` component use the `network-only` policy by default. - -### On the query level - -You can pass the `cachePolicy` property to the `useQuery` function to set the default caching policy for that query: - - - -Note the usage of a different signature here for the `useQuery` function, what you have seen so far is the "short-hand" but when you need to modify the query behavior you will need to use the full or extended options. The main difference is that this signature only accepts exactly 1 argument containing the query options, you can find more information about the available options in the [API reference page](/api/use-query). - - - -```js -// in setup -const GetPosts = ` - query GetPosts { - posts { - id - title - } - } -`; - -const { data } = useQuery({ - query: GetPosts, - cachePolicy: 'network-only', -}); -``` - -### On each `execute` call level - -You can also set the caching policy for a single `execute` call by passing it to the `execute` function provided by the slot props or the `useQuery` function. - -Here is a snippet for doing so with the `useQuery` function: - -```js -// in setup -const GetPosts = ` - query GetPosts { - posts { - id - title - } - } -`; - -const { execute, data } = useQuery({ - query: GetPosts, -}); - -// use this in template or whatever. -function runWithPolicy() { - execute({ cachePolicy: 'network-only' }); -} -``` - -You can build your own cache layer and plugins for villus, check the [Plugins Guide](/plugins) - -## Fetching on Mounted - -By default the `useQuery` and `Query` component automatically execute their queries when the component is mounted. You can configure this behavior by setting the `fetchOnMount` option: - -```js -const GetPosts = ` - query GetPosts { - posts { - id - title - } - } -`; - -const { data } = useQuery({ - query: GetPosts, - fetchOnMount: false, // disables query fetching on mounted -}); -``` - -## Suspense - - - -This feature is only available with Vue 3 at the moment - - - -Both the `useQuery` and `Query` component can take advantage of the `Suspense` component shipped by Vue 3.x. - -To utilize the suspense feature, you need to `await` the `useQuery` function and it returns the exact same API after executing the query: - -```vue - - - -``` - -Then you can suspend the `Listing.vue` component like this: - -```vue - - - -``` - -Whenever a re-fetch is triggered, or the query was executed again the `isFetching` will be updated accordingly so you don't have to keep it in sync with anything nor you have to create your own boolean refs for indications. - - - -Is fetching default value is `true` if `fetchOnMount` is enabled, otherwise it will start off with `false`. - - diff --git a/docs/content/guide/setup.md b/docs/content/guide/setup.md deleted file mode 100644 index 4b348288..00000000 --- a/docs/content/guide/setup.md +++ /dev/null @@ -1,153 +0,0 @@ ---- -title: Application Setup -order: 2 ---- - -# Application Setup - -To start querying GraphQL endpoints, you need to setup a client for that endpoint. **villus** exposes multiple functions and components that allow you to create GraphQL clients for your endpoints. - -You don't need to create a client for each component, any of these methods makes the villus client available for all the child components. So you only need to do this once for your application. - -## Composition API - -The `useClient` composition API function allows your components to define a GraphQL endpoint that all children of that component will query against. - -To create a GraphQL client with the composition API: - -```js -import { useClient } from 'villus'; - -// Your App component -export default { - setup() { - useClient({ - url: '/graphql', // your endpoint. - }); - }, -}; -``` - -Internally it uses `provide/inject` API to inject the client into your components or composable functions. You can find the full options the `useClient` accepts in the [API reference](/api/client) - -## Vue Plugin - -You can use `createClient` function result as a Vue plugin that conveniently adds a `villus` client to your app root. - -```js -import { createClient } from 'villus'; -import { createApp } from 'vue'; - -const app = createApp({...}); - -// Creates a villus client instance -const client = createClient({ - url: '/graphql', // your endpoint. -}); - -// Makes the villus client available to your app -app.use(client); -``` - -## Provider Component - -If you prefer to use higher-order components you can use the `` component, similar to `useClient` it accepts the same client options as props. It might be handy to use `v-bind` here to group the various client config options in a single object: - -```vue - - - -``` - - - -The **Provider** component is **renderless** by default. It will not render any extra HTML other than its slot. - - - -### withProvider function - -**villus** exposes a `withProvider` function that takes a Vue component and returns the same component wrapped by the `Provider` component, it is very handy to use in JSX and render functions. - -```js -import Vue from 'vue'; -import { withProvider } from 'villus'; -import App from './App.vue'; - -const clientOptions = { - url: '/graphql', // Your endpoint -}; - -// use this instead of your App -const AppWithClient = withProvider(App, clientOptions); - -new Vue({ - // Render the wrapped version instead. - render: h => h(AppWithClient), -}).mount('#app'); -``` - -## Multiple Providers - -While uncommon, there is no limitations on how many endpoints you can use within your app, you can use as many clients as you like and that allows you to query different GraphQL APIs within the same app without hassle. - -```vue - - - - - - - -``` - -For the composition API you will need to create a parent component for each client: - -```js -// Component A -export default { - name: 'GitHubProvider', - setup() { - useClient({ - url: '{GITHUB_API_ENDPOINT}', - }); - }, -}; - -// Component B -export default { - name: 'AppAPI', - setup() { - useClient({ - url: '{MY_API}', - }); - }, -}; -``` - - - -You can mix between higher-order components and composable API as higher-order components actually use the composable functions under the hood. - - - -## Next Steps - -Now that you have successfully setup the GraphQL client, you can start to [query](/guide/queries) and [execute mutations](/guide/mutations) on your GraphQL APIs. diff --git a/docs/content/guide/subscriptions.md b/docs/content/guide/subscriptions.md deleted file mode 100644 index 014b02a3..00000000 --- a/docs/content/guide/subscriptions.md +++ /dev/null @@ -1,159 +0,0 @@ ---- -title: Subscriptions -description: Learn how to run GraphQL subscriptions -order: 5 ---- - -# Subscriptions - -`villus` handles subscriptions with the `useSubscription` or the `Subscription` component in the same way as the `useQuery` or the `Query` component. - -To add support for subscriptions you need to add the `handleSubscriptions` plugin to the `useClient` plugin list, which in turn will call your subscription client. The plugin expects an a function that returns an object that follows the [observable spec](https://github.com/tc39/proposal-observable) to be returned, this function is called a **subscription forwarder** - -The following example uses `apollo-server` with the `subscriptions-transport-ws` package: - -```js -import { useClient, handleSubscriptions, defaultPlugins } from 'villus'; -import { SubscriptionClient } from 'subscriptions-transport-ws'; - -const subscriptionClient = new SubscriptionClient('ws://localhost:4001/graphql', {}); -const subscriptionForwarder = operation => subscriptionClient.request(op); - -// in your setup -const client = useClient({ - url: 'http://localhost:4000/graphql', - use: [handleSubscriptions(subscriptionForwarder), ...defaultPlugins()], -}); -``` - -Once you've setup the `handleSubscriptions` plugin, you can now use the `useSubscription` function or the `Subscription`. - - - -You can also use [`graphql-ws`](https://github.com/enisdenjo/graphql-ws) package for your subscriptions, but you will need to modify your `subscriptionForwarder` to look like this: - -```js -import { createClient } from 'graphql-ws'; - -const wsClient = createClient({ - url: 'ws://localhost:9005/graphql', -}); -const subscriptionForwarder = operation => { - return { - subscribe: obs => { - wsClient.subscribe( - { - query: operation.query, - }, - obs - ); - }, - }; -}; - -// in your setup -const client = useClient({ - url: 'http://localhost:4000/graphql', - use: [handleSubscriptions(subscriptionForwarder), ...defaultPlugins()], -}); -``` - - - -## Executing Subscriptions - -The `useSubscription` function has a similar API as it exposes a `data` property that you can watch - -```vue - - - -``` - -## Passing Variables - -You can pass variables to subscriptions by passing an object containing both `query` and `variables` as the first argument: - -```js -const NewMessages = ` - subscription ConversationMessages ($id: ID!) { - conversation(id: $id) { - id - from - message - } - } -`; - -const { data } = useSubscription({ - query: NewMessages, - variables: { id: 1 }, -}); -``` - -## Handling Subscription Data - -The previous examples are not very useful as usually you would like to be able to use the `data` as a continuos value rather than a reference to the last received value, that is why you can pass a custom reducer as the second argument to the `useSubscription` function, think of it as a subscription handler that aggregates the results into a single value. The aggregated value will become the `data` returned from `useSubscription`. - -Here is the last example with a custom reducer, we will be covering the `setup` function only since the rest of the component is mostly the same: - -```js -function reduceMessages(oldValue, response) { - oldValue = oldValue || []; - if (!response.data || response.errors) { - return oldValue; - } - - return [...oldValue, response.data.newMessages]; -} - -const NewMessages = ` - subscription NewMessages { - newMessages { - id - from - message - } - } -`; - -const { data } = useSubscription({ query: NewMessages }, reduceMessages); -``` - -The `reduceMessages` function acts as a reducer for the incoming data, whenever a new response is received it will be passed to `reduceMessages` function as the second argument, the first argument will be the previous value. - - - -Keep in mind that initially we have `null` for the initial value so we needed to provide a fallback for that. - - diff --git a/docs/content/plugins/batch.md b/docs/content/plugins/batch.md deleted file mode 100644 index c8536136..00000000 --- a/docs/content/plugins/batch.md +++ /dev/null @@ -1,106 +0,0 @@ ---- -title: Query Batching Plugin -description: Learn how to run batch multiple GraphQL queries -order: 4 ---- - -# Query Batching - -Villus has support for query batching but it is not configured out of the box, this is because not all GraphQL implementations support query-batching. So you would need to manually import it and configure it with `villus` client. - -The batch plugin is available as its own package under the name `@villus/batch` - -## Basic Batching - -First add the plugin to your dependencies using `yarn` or `npm`: - -```bash -yarn add @villus/batch -# Or -npm install @villus/batch -``` - -Then import the `batch` plugin from `villus` and pass it at the very end of the `plugins` array in client configuration: - -```js -import { useClient } from 'villus'; -import { batch } from '@villus/batch'; - -export default { - setup() { - useClient({ - url: 'https://test.com/graphql', - use: [batch()], - }); - }, -}; -``` - - - Careful not to use `batch` with the default `fetch` plugin, both of them act as a fetcher and there can only be 1 fetcher plugin for `villus` at any given time. - - -And that's it, all your nested components that use `useQuery` or `useMutation` will automatically be batched together in a single request: - -```vue - - - -``` - -## Batching timeout - -Batching is done by waiting for a specific time which is `10ms` by default since the last executed query, and all queries executed within this time window will be batched together. - -You can configure that time window by passing a `timeout` option to the `batch` function configuration: - -```js{8} -import { useClient, batch } from 'villus'; - -export default { - setup() { - useClient({ - url: 'https://test.com/graphql', - use: [batch({ timeout: 50 })], - }); - }, -}; -``` - -This will add a `50ms` time window between queries to be batched together. - -## Options - -You can customize a few aspects of the `batch` plugin: - -The available options are: - -| Option | Type | Description | -| ------- | --------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| fetch | `typeof window.fetch` | Pass this option if you plan to be specific about the `fetch` polyfill that will be used, by default it tries to find `window.fetch` on the browser or `global.fetch` on Node.js depending on the execution environment | -| timeout | `number` | The number of milliseconds to wait for before executing the batched queries | - -## Code - -You can check the [source code for the `batch` plugin](https://github.com/logaretm/villus/blob/main/packages/batch/src/index.ts) and use it as a reference to build your own diff --git a/docs/content/plugins/handle-subscriptions.md b/docs/content/plugins/handle-subscriptions.md deleted file mode 100644 index 27db6f22..00000000 --- a/docs/content/plugins/handle-subscriptions.md +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: Handle Subscriptions Plugin -description: The plugin that executes your subscriptions -order: 6 ---- - -# Handle Subscriptions Plugin - -Subscriptions are very different from queries or mutations, as it is considered a constant stream of events or data. Because of this it requires special handling, `villus` implements the subscriptions support as a plugin for added flexibility and streamlining the query execution process regardless of its type. - -## Options - -The `handleSubscriptions` plugin requires only one option, a **subscription forwarder**, which is just a function that returns an observable. - -```js -import { useClient, handleSubscriptions, defaultPlugins } from 'villus'; -import { SubscriptionClient } from 'subscriptions-transport-ws'; - -const subscriptionClient = new SubscriptionClient('ws://localhost:4001/graphql', {}); -const subscriptionForwarder = operation => subscriptionClient.request(op), - -// in your setup -useClient({ - url: 'http://localhost:4000/graphql', - use: [handleSubscriptions(subscriptionForwarder), ...defaultPlugins()] -}); -``` - -## Code - -You can check the [source code for the `handleSubscriptions` plugin](https://github.com/logaretm/villus/blob/main/packages/villus/src/handleSubscriptions.ts) and use it as a reference to build your own diff --git a/docs/layouts/default.vue b/docs/layouts/default.vue deleted file mode 100644 index d59e589b..00000000 --- a/docs/layouts/default.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - - - diff --git a/docs/layouts/home.vue b/docs/layouts/home.vue deleted file mode 100644 index 211ee08b..00000000 --- a/docs/layouts/home.vue +++ /dev/null @@ -1,59 +0,0 @@ - - - - - diff --git a/docs/nuxt.config.js b/docs/nuxt.config.js deleted file mode 100644 index c3e3ccd7..00000000 --- a/docs/nuxt.config.js +++ /dev/null @@ -1,84 +0,0 @@ -export default { - /* - ** Headers of the page - ** See https://nuxtjs.org/api/configuration-head - */ - head: { - title: process.env.npm_package_name || '', - meta: [ - { charset: 'utf-8' }, - { name: 'viewport', content: 'width=device-width, initial-scale=1' }, - { - hid: 'description', - name: 'description', - content: process.env.npm_package_description || '', - }, - ], - link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }], - }, - - publicRuntimeConfig: { - appURL: 'https://villus.logaretm.com', - - algolia: { - apiKey: '434db5d5d2794ec2818d4665d631a15b', - appId: '1SMG3JU76L', - indexName: 'villus', - }, - }, - - /* - ** Global CSS - */ - css: [], - /* - ** Plugins to load before mounting the App - ** https://nuxtjs.org/guide/plugins - */ - plugins: ['@/plugins/store.client.js'], - /* - ** Auto import components - ** See https://nuxtjs.org/api/configuration-components - */ - components: true, - /* - ** Nuxt.js dev-modules - */ - buildModules: [ - // Doc: https://github.com/nuxt-community/nuxt-tailwindcss - '@nuxtjs/tailwindcss', - ], - /* - ** Nuxt.js modules - */ - modules: [ - '@nuxtjs/pwa', - // Doc: https://github.com/nuxt/content - '@nuxt/content', - ], - /* - ** Content module configuration - ** See https://content.nuxtjs.org/configuration - */ - content: { - liveEdit: false, - markdown: { - prism: { - theme: false, - }, - }, - }, - /* - ** Build configuration - ** See https://nuxtjs.org/api/configuration-build/ - */ - build: { - postcss: { - plugins: { - tailwindcss: {}, - 'postcss-nested': {}, - autoprefixer: {}, - }, - }, - }, -}; diff --git a/docs/package.json b/docs/package.json index ff9d2696..f3e202fd 100644 --- a/docs/package.json +++ b/docs/package.json @@ -1,13 +1,12 @@ { "name": "villus-docs", - "version": "1.0.0", + "version": "3.1.0", "private": true, "scripts": { - "dev": "nuxt", - "build": "nuxt build --modern", - "start": "nuxt start --modern", - "generate": "nuxt generate", - "export": "nuxt export", + "dev": "astro dev", + "start": "astro dev", + "build": "astro build", + "preview": "astro preview", "lint:js": "eslint --ext .js,.vue --ignore-path .gitignore .", "lint": "yarn lint:js" }, @@ -20,16 +19,21 @@ } }, "dependencies": { - "@docsearch/css": "^3.0.0-alpha.41", - "@docsearch/js": "^3.0.0-alpha.41", - "@nuxt/content": "^1.13.1", - "@nuxtjs/pwa": "^3.3.5", - "lodash.groupby": "^4.6.0", - "nuxt": "^2.15.0" - }, - "devDependencies": { - "@nuxtjs/eslint-config": "^4.0.0", - "@nuxtjs/tailwindcss": "^3.4.2", - "postcss-nested": "^4.2.3" + "@astrojs/mdx": "^3.0.0", + "@astrojs/partytown": "^2.1.0", + "@astrojs/sitemap": "^3.1.4", + "@astrojs/vue": "^4.2.0", + "@docsearch/css": "^3.6.0", + "@docsearch/js": "^3.6.0", + "@shikijs/twoslash": "^1.5.2", + "astro": "^4.8.6", + "autoprefixer": "^10.4.19", + "jsdom": "^26.0.0", + "remark-gfm": "^4.0.0", + "shiki": "^1.5.2", + "tailwindcss": "^3.4.3", + "twoslash-vue": "^0.2.6", + "unist-util-visit": "^5.0.0", + "vue": "^3.4.27" } } diff --git a/docs/pages/_.vue b/docs/pages/_.vue deleted file mode 100644 index e3a1823e..00000000 --- a/docs/pages/_.vue +++ /dev/null @@ -1,44 +0,0 @@ - - - - - diff --git a/docs/pages/index.vue b/docs/pages/index.vue deleted file mode 100644 index e0955971..00000000 --- a/docs/pages/index.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - diff --git a/docs/plugins/store.client.js b/docs/plugins/store.client.js deleted file mode 100644 index e2b5cc2f..00000000 --- a/docs/plugins/store.client.js +++ /dev/null @@ -1,16 +0,0 @@ -export default function StorePlugin({ store }) { - window.onNuxtReady(() => { - const themeSetting = localStorage.getItem('theme'); - let theme; - // no dark setting, get it from browser - if (!themeSetting) { - const wantsDark = window.matchMedia('(prefers-color-scheme: dark)').matches; - theme = wantsDark ? 'dark' : 'light'; - } else { - theme = themeSetting; - } - - document.body.classList.toggle('is-dark', theme === 'dark'); - store.commit('SET_THEME', theme); - }); -} diff --git a/docs/postcss.config.js b/docs/postcss.config.js new file mode 100644 index 00000000..cdbe50f3 --- /dev/null +++ b/docs/postcss.config.js @@ -0,0 +1,7 @@ +module.exports = { + plugins: { + 'tailwindcss/nesting': {}, + tailwindcss: {}, + autoprefixer: {}, + }, +}; diff --git a/docs/public/favicon.ico b/docs/public/favicon.ico new file mode 100644 index 00000000..cdb282d5 Binary files /dev/null and b/docs/public/favicon.ico differ diff --git a/docs/public/loadTheme.js b/docs/public/loadTheme.js new file mode 100644 index 00000000..e78e4cf2 --- /dev/null +++ b/docs/public/loadTheme.js @@ -0,0 +1,14 @@ +(function setUserPreferredTheme() { + const themeSetting = localStorage.getItem('theme'); + let theme; + // no dark setting, get it from browser + if (!themeSetting) { + const wantsDark = window.matchMedia('(prefers-color-scheme: dark)').matches; + theme = wantsDark ? 'dark' : 'light'; + } else { + theme = themeSetting; + } + + document.documentElement.classList.toggle('dark', theme === 'dark'); + localStorage.setItem('theme', theme); +})(); diff --git a/docs/public/logo.png b/docs/public/logo.png new file mode 100644 index 00000000..43e7bda2 Binary files /dev/null and b/docs/public/logo.png differ diff --git a/docs/components/global/Codesandbox.vue b/docs/src/components/Codesandbox.vue similarity index 50% rename from docs/components/global/Codesandbox.vue rename to docs/src/components/Codesandbox.vue index bc22d782..bd00b4d5 100644 --- a/docs/components/global/Codesandbox.vue +++ b/docs/src/components/Codesandbox.vue @@ -8,29 +8,27 @@ > - diff --git a/docs/src/components/ContentWrapper.vue b/docs/src/components/ContentWrapper.vue new file mode 100644 index 00000000..32624ea8 --- /dev/null +++ b/docs/src/components/ContentWrapper.vue @@ -0,0 +1,275 @@ + + + diff --git a/docs/src/components/DocBadge.vue b/docs/src/components/DocBadge.vue new file mode 100644 index 00000000..8b31136d --- /dev/null +++ b/docs/src/components/DocBadge.vue @@ -0,0 +1,12 @@ + + + diff --git a/docs/components/DocMenu.vue b/docs/src/components/DocMenu.vue similarity index 58% rename from docs/components/DocMenu.vue rename to docs/src/components/DocMenu.vue index 4ec65fc0..b1bbb17c 100644 --- a/docs/components/DocMenu.vue +++ b/docs/src/components/DocMenu.vue @@ -1,70 +1,39 @@ - diff --git a/docs/components/global/DocTip.vue b/docs/src/components/DocTip.vue similarity index 77% rename from docs/components/global/DocTip.vue rename to docs/src/components/DocTip.vue index 1d8db3e5..c4c62527 100644 --- a/docs/components/global/DocTip.vue +++ b/docs/src/components/DocTip.vue @@ -1,9 +1,9 @@ - - - diff --git a/docs/components/DocToc.vue b/docs/src/components/DocToc.vue similarity index 62% rename from docs/components/DocToc.vue rename to docs/src/components/DocToc.vue index 93db45df..d98abc55 100644 --- a/docs/components/DocToc.vue +++ b/docs/src/components/DocToc.vue @@ -1,29 +1,20 @@ -