examples/vue-ts-example-2025
Archived
1
0
Fork 0
Code Issues 1 Pull Requests 12 Actions Packages Projects Releases Wiki Activity

chore(deps): update dependency @pinia/colada to ^0.20.0 #190

Merged
renovatebot merged 1 commits from renovate/v0.x into main 2026-01-07 04:11:40 +08:00
Conversation 0 Commits 1 Files Changed 2
+6 -6
renovatebot commented 2026-01-07 01:49:28 +08:00
Collaborator
Copy Link
Copy Source

This PR contains the following updates:

Package Change Age Adoption Passing Confidence
@pinia/colada (source) ^0.19.0 → ^0.20.0 age adoption passing confidence

Release Notes

posva/pinia-colada (@​pinia/colada)

v0.20.0

Compare Source

This release completely changed how useInfiniteQuery() works, the parameters and returned values:

  • The merge option has been removed and data contains an object with pages and pageParams arrays that can be flattened.
  • initialPage has now been replaced with initialPageParam
  • loadMore has been renamed loadNextPage
  • getNextPageParam is now a required option
  • Invalidating now works just as with regular queries, which means that you probably want to set stale value higher (or disable it) to avoid refetching multiple pages when an infinite query is invalidated. Also, you might want to set refetchOn* options to false.
  • It's now possible to have bi-directional navigation
  • There is now hasNextPage and hasPreviousPage

Any feedback on the feature and improvements is welcome!

Here is a complete example of what it looks in action:

<script setup lang="ts">
import { useInfiniteQuery } from '@&#8203;pinia/colada'
import { onWatcherCleanup, useTemplateRef, watch } from 'vue'

const {
  state: factsPages,
  loadNextPage,
  asyncStatus,
  isDelaying,
  hasNextPage,
} = useInfiniteQuery({
  key: ['feed'],
  query: async ({ pageParam }) => factsApi.get<CatFacts>({ query: { page: pageParam, limit: 10 } }),
  initialPageParam: 1,
  getNextPageParam(lastPage) {
    return lastPage.next_page_url
  }
  // plugins
  retry: 0,
  delay: 0,
})

// we only need an array
const facts = computed(() => factPages.value.data?.pages.flat())
const loadMoreEl = useTemplateRef('load-more')

watch(loadMoreEl, (el) => {
  if (el) {
    const observer = new IntersectionObserver(
      (entries) => {
        if (entries[0]?.isIntersecting) {
          loadNextPage()
        }
      },
      {
        rootMargin: '300px',
        threshold: [0],
      },
    )
    observer.observe(el)
    onWatcherCleanup(() => {
      observer.disconnect()
    })
  }
})
</script>

<template>
  <div>
    <button :disabled="asyncStatus === 'loading' || isDelaying" @&#8203;click="loadMore()">
      Load more (or scroll down)
    </button>
    <template v-if="facts?.length">
      <p>We have loaded {{ facts.length }} facts</p>
      <details>
        <summary>Show raw</summary>
        <pre>{{ facts }}</pre>
      </details>

      <blockquote v-for="fact in facts">
        {{ fact }}
      </blockquote>

      <p v-if="hasNextPage" ref="load-more">Loading more...</p>
    </template>
  </div>
</template>
Bug Fixes
Features

0.19.1 (2025-12-17)

Features

Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Enabled.

♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about this update again.

  • If you want to rebase/retry this PR, check this box

This PR has been generated by Renovate Bot.

This PR contains the following updates: | Package | Change | [Age](https://docs.renovatebot.com/merge-confidence/) | [Adoption](https://docs.renovatebot.com/merge-confidence/) | [Passing](https://docs.renovatebot.com/merge-confidence/) | [Confidence](https://docs.renovatebot.com/merge-confidence/) | |---|---|---|---|---|---| | [@pinia/colada](https://pinia-colada.esm.dev) ([source](https://github.com/posva/pinia-colada)) | [`^0.19.0` → `^0.20.0`](https://renovatebot.com/diffs/npm/@pinia%2fcolada/0.19.1/0.20.0) | ![age](https://developer.mend.io/api/mc/badges/age/npm/@pinia%2fcolada/0.20.0?slim=true) | ![adoption](https://developer.mend.io/api/mc/badges/adoption/npm/@pinia%2fcolada/0.20.0?slim=true) | ![passing](https://developer.mend.io/api/mc/badges/compatibility/npm/@pinia%2fcolada/0.19.1/0.20.0?slim=true) | ![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/@pinia%2fcolada/0.19.1/0.20.0?slim=true) | --- ### Release Notes <details> <summary>posva/pinia-colada (@&#8203;pinia/colada)</summary> ### [`v0.20.0`](https://github.com/posva/pinia-colada/blob/HEAD/CHANGELOG.md#0200-2025-12-23) [Compare Source](https://github.com/posva/pinia-colada/compare/v0.19.1...v0.20.0) This release completely changed how `useInfiniteQuery()` works, the parameters and returned values: - The `merge` option has been removed and `data` contains an object with `pages` and `pageParams` arrays that can be flattened. - `initialPage` has now been replaced with `initialPageParam` - `loadMore` has been renamed `loadNextPage` - `getNextPageParam` is now a required option - Invalidating now works just as with regular queries, which means that you probably want to set `stale` value higher (or disable it) to avoid refetching multiple pages when an infinite query is invalidated. Also, you might want to set `refetchOn*` options to `false`. - It's now possible to have bi-directional navigation - There is now `hasNextPage` and `hasPreviousPage` Any feedback on the feature and improvements is welcome! Here is a complete example of what it looks in action: ```ts <script setup lang="ts"> import { useInfiniteQuery } from '@&#8203;pinia/colada' import { onWatcherCleanup, useTemplateRef, watch } from 'vue' const { state: factsPages, loadNextPage, asyncStatus, isDelaying, hasNextPage, } = useInfiniteQuery({ key: ['feed'], query: async ({ pageParam }) => factsApi.get<CatFacts>({ query: { page: pageParam, limit: 10 } }), initialPageParam: 1, getNextPageParam(lastPage) { return lastPage.next_page_url } // plugins retry: 0, delay: 0, }) // we only need an array const facts = computed(() => factPages.value.data?.pages.flat()) const loadMoreEl = useTemplateRef('load-more') watch(loadMoreEl, (el) => { if (el) { const observer = new IntersectionObserver( (entries) => { if (entries[0]?.isIntersecting) { loadNextPage() } }, { rootMargin: '300px', threshold: [0], }, ) observer.observe(el) onWatcherCleanup(() => { observer.disconnect() }) } }) </script> <template> <div> <button :disabled="asyncStatus === 'loading' || isDelaying" @&#8203;click="loadMore()"> Load more (or scroll down) </button> <template v-if="facts?.length"> <p>We have loaded {{ facts.length }} facts</p> <details> <summary>Show raw</summary> <pre>{{ facts }}</pre> </details> <blockquote v-for="fact in facts"> {{ fact }} </blockquote> <p v-if="hasNextPage" ref="load-more">Loading more...</p> </template> </div> </template> ``` ##### Bug Fixes - **infinite:** invalidation should refetch ([bc9c261](https://github.com/posva/pinia-colada/commit/bc9c261a8b294049fa87ee9c2e52049c3e0a78fe)), closes [#&#8203;372](https://github.com/posva/pinia-colada/issues/372) ##### Features - **infinite:** add cancelRefetch ([16de801](https://github.com/posva/pinia-colada/commit/16de801849c54273d6842583ecd3c2b21d67f185)) - **infinite:** maxPages ([7639145](https://github.com/posva/pinia-colada/commit/763914564a91584ebd4fc931289e1e242c489806)) - nextPage works ([d011030](https://github.com/posva/pinia-colada/commit/d011030a1eacc95501715980243d6a4a582e2832)) - throwOnError in infiniteQuery ([5010b11](https://github.com/posva/pinia-colada/commit/5010b11ef2a34690b8aa59659bb9c1b9e8cce409)) #### [0.19.1](https://github.com/posva/pinia-colada/compare/v0.19.0...v0.19.1) (2025-12-17) ##### Features - initialDataUpdatedAt ([e16ff61](https://github.com/posva/pinia-colada/commit/e16ff6108c143d0d4d89766baf953240a1b67b7f)), closes [#&#8203;298](https://github.com/posva/pinia-colada/issues/298) - warns if the user extends in create instead of ext ([d71a890](https://github.com/posva/pinia-colada/commit/d71a8904a4c8ee8ffc1e076da3748b80b22ab0a8)), closes [#&#8203;442](https://github.com/posva/pinia-colada/issues/442) </details> --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Enabled. ♻ **Rebasing**: Whenever PR is behind base branch, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box --- This PR has been generated by [Renovate Bot](https://github.com/renovatebot/renovate). <!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiI0Mi43MS4wIiwidXBkYXRlZEluVmVyIjoiNDIuNzEuMCIsInRhcmdldEJyYW5jaCI6Im1haW4iLCJsYWJlbHMiOlsiZGVwZW5kZW5jaWVzIl19-->
renovatebot added 1 commit 2026-01-07 01:49:28 +08:00
chore(deps): update dependency @pinia/colada to ^0.20.0
renovate/stability-days Updates have met minimum release age requirement
Details
CI/CD Pipeline / playwright (push) Successful in 2m7s
Details
CI/CD Pipeline / build-and-deploy (push) Successful in 2m5s
Details
测试最新依赖 / build-and-test (push) Successful in 1m32s
Details
测试最新依赖 / playwright (push) Successful in 1m57s
Details
1a9257249f
renovatebot merged commit 1a9257249f into main 2026-01-07 04:11:40 +08:00
renovatebot deleted branch renovate/v0.x 2026-01-07 04:11:40 +08:00
This repo is archived. You cannot comment on pull requests.
Reviewers
No Reviewers
Labels
No items
No labels
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
gitea_1-h.cc renovatebot (Renovate Bot)
No Assignees
1 Participants
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: examples/vue-ts-example-2025#190