Skip to content

Commit

Permalink
fix(query): query refresh on defineQuery output composable call
Browse files Browse the repository at this point in the history
  • Loading branch information
ElisePatrikainen authored and posva committed May 14, 2024
1 parent 9da9d2c commit 28a3ec1
Show file tree
Hide file tree
Showing 4 changed files with 37 additions and 9 deletions.
4 changes: 4 additions & 0 deletions playground/src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,10 @@
<RouterLink to="/contacts">
Contacts
</RouterLink>
|
<RouterLink to="/ecom">
T-shirts
</RouterLink>
</nav>
</div>
</header>
Expand Down
13 changes: 13 additions & 0 deletions playground/src/composables/contacts.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
import { defineQuery, useQuery } from '@pinia/colada'
import { useRouteQuery } from '@vueuse/router'
import { searchContacts } from '@/api/contacts'

export const useContacts = defineQuery(() => {
const searchText = useRouteQuery('search', '', { mode: 'push' })
const { ...query } = useQuery({
key: () => ['contacts-search', { searchText: searchText.value }],
query: ({ signal }) => searchContacts(searchText.value, {}, { signal }),
gcTime: 0,
})
return { ...query, searchText }
})
8 changes: 2 additions & 6 deletions playground/src/pages/contacts.vue
Original file line number Diff line number Diff line change
@@ -1,14 +1,10 @@
<script lang="ts" setup>
import { useRouteQuery } from '@vueuse/router'
import { useQuery } from '@pinia/colada'
import { searchContacts } from '@/api/contacts'
import { useContacts } from '@/composables/contacts'
const searchText = useRouteQuery('search', '', { mode: 'push' })
const { data: searchResult, status } = useQuery({
key: () => ['contacts-search', { searchText: searchText.value }],
query: ({ signal }) => searchContacts(searchText.value, {}, { signal }),
})
const { data: searchResult, status } = useContacts()
// TODO: tip in tests if they are reading data, error or other as they are computed properties, on the server they won't
// update so they will keep their initial undefined value
Expand Down
21 changes: 18 additions & 3 deletions src/query-store.ts
Original file line number Diff line number Diff line change
Expand Up @@ -163,12 +163,23 @@ export const useQueryCache = defineStore(QUERY_STORE_ID, () => {
// this allows use to attach reactive effects to the scope later on
const scope = getCurrentScope()!

const defineQueryMap = new WeakMap<() => unknown, any>()
const defineQueryMap = new WeakMap<() => unknown, { queries: string[][], result: any }>()
let currentDefineQuerySetupFunction: (() => unknown) | null
function ensureDefinedQuery<T>(fn: () => T): T {
if (!defineQueryMap.has(fn)) {
defineQueryMap.set(fn, scope.run(fn)!)
currentDefineQuerySetupFunction = fn
defineQueryMap.set(fn, { queries: [], result: null })
defineQueryMap.get(fn)!.result = scope.run(fn)!
currentDefineQuerySetupFunction = null
} else {
defineQueryMap.get(fn)!.queries.forEach(
(key) => {
const query = cachesRaw.get(key) as UseQueryEntry | undefined
if (query) refresh(query)
},
)
}
return defineQueryMap.get(fn)!
return defineQueryMap.get(fn)!.result
}

function ensureEntry<TResult = unknown, TError = ErrorDefault>(
Expand All @@ -181,6 +192,10 @@ export const useQueryCache = defineStore(QUERY_STORE_ID, () => {
)
}
const key = keyRaw.map(stringifyFlatObject)
if (currentDefineQuerySetupFunction) {
const currentDefineQueryEntry = defineQueryMap.get(currentDefineQuerySetupFunction)
currentDefineQueryEntry!.queries.push(key)
}
// ensure the state
// console.log('⚙️ Ensuring entry', key)
let entry = cachesRaw.get(key) as UseQueryEntry<TResult, TError> | undefined
Expand Down

0 comments on commit 28a3ec1

Please sign in to comment.