fix(Vue): nullish params in useLiveQueryImpl (#466)

* fix(Vue): nullish params

* fix(Vue): simplify live `params` manipulations

* Changeset

* Formatting

* Add test

---------

Co-authored-by: Sam Willis <[email protected]>

Author: sandros94

.changeset/weak-pigs-begin.md

@@ -0,0 +1,5 @@
+---
+'@electric-sql/pglite-vue': patch
+---
+
+Fix Vue useLiveQuery to allow no parameters to be provided

packages/pglite-vue/src/hooks.ts

@@ -44,10 +44,10 @@ function useLiveQueryImpl<T = { [key: string]: unknown }>(
 
   const querySource = typeof query === 'string' ? ref(query) : query
   const paramsSources = !params
-    ? [ref(params)]
+    ? []
     : Array.isArray(params)
       ? params.map(ref)
-      : [params]
+      : [ref(params)]
 
   const keySource = typeof key === 'string' ? ref(key) : key
 
@@ -68,13 +68,11 @@ function useLiveQueryImpl<T = { [key: string]: unknown }>(
 
       const query = isRef(querySource) ? unref(querySource) : querySource()
 
-      const paramVals = isRef(params)
-        ? unref(params)
+      const paramVals = Array.isArray(params)
+        ? params.map((p) => (typeof p === 'function' ? p() : unref(p)))
         : typeof params === 'function'
           ? params()
-          : Array.isArray(params)
-            ? params.map(unref)
-            : [params]
+          : unref(params)
 
       const key = isRef(keySource) ? keySource.value : keySource?.()
 

packages/pglite-vue/test/hooks.test.ts

@@ -43,6 +43,35 @@ describe('hooks', () => {
       `)
     })
 
+    it('updates when query without parameters is provided', async () => {
+      const { useLiveQuery } = await import('../src')
+      await db.exec(`INSERT INTO test (name) VALUES ('test1');`)
+
+      const result = useLiveQuery('SELECT * FROM test;')
+
+      await flushPromises()
+      expect(result?.rows?.value).toEqual([
+        {
+          id: 1,
+          name: 'test1',
+        },
+      ])
+
+      await db.exec(`INSERT INTO test (name) VALUES ('test2');`)
+
+      await flushPromises()
+      expect(result?.rows?.value).toEqual([
+        {
+          id: 1,
+          name: 'test1',
+        },
+        {
+          id: 2,
+          name: 'test2',
+        },
+      ])
+    })
+
     it('updates when query parameter ref changes', async () => {
       const { useLiveQuery } = await import('../src')
       await db.exec(`INSERT INTO test (name) VALUES ('test1'),('test2');`)

packages/pglite-vue/vitest.config.ts

@@ -5,7 +5,7 @@ export default defineConfig({
   // @ts-ignore type mismsatch but works?
   plugins: [vue()],
   test: {
-    name: 'pglite-react',
+    name: 'pglite-vue',
     dir: './test',
     watch: false,
     environment: 'jsdom',