svelte-ag 1.2.6 → 1.2.8

package/dist/api/query/query.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"query.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/api/query/query.svelte.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEnH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAIxD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEnE,qBAAa,KAAK,CAChB,GAAG,SAAS,YAAY,EACxB,IAAI,SAAS,GAAG,CAAC,MAAM,CAAC,EACxB,MAAM,SAAS,OAAO,CAAC,GAAG,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,QAAQ,CAAC;;gBAyBzC,EACV,IAAI,EACJ,MAAM,EACN,KAAK,EACL,SAAS,EACT,KAAK,EACL,IAAI,EACL,EAAE;QACD,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QACnC,SAAS,EAAE,SAAS,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QACxC,KAAK,EAAE,KAAK,CAAC;QACb,IAAI,CAAC,EAAE;YACL,KAAK,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SAC1C,CAAC;KACH;IAgBK,OAAO,IAAI,OAAO,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;IAyCxD,IAAI,QAAQ,WAEX;IACD,IAAI,QAAQ,YAEX;IACD,UAAU;IAMV,IAAI,MAAM,gBAET;IACD,IAAI,IAAI,IAAI,cAAc,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,IAAI,CAEnD;IACD,IAAI,SAAS,IAAI,YAAY,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,IAAI,CAEtD;CACF;AAED,qBAAa,SAAS,CACpB,GAAG,SAAS,YAAY,EACxB,IAAI,SAAS,GAAG,CAAC,MAAM,CAAC,EACxB,MAAM,SAAS,OAAO,CAAC,GAAG,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,QAAQ,CAAC;;gBA6BnD,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,kBAAkB,CAAC,GAAG,CAAC,EAChC,MAAM,EAAE,KAAK,EACb,YAAY,CAAC,EAAE,YAAY,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC;YAelC,KAAK;IAOnB;;;OAGG;YACW,eAAe;IA6BvB,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;CAmB3F"}
+{"version":3,"file":"query.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/api/query/query.svelte.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEnH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAIxD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEnE,qBAAa,KAAK,CAChB,GAAG,SAAS,YAAY,EACxB,IAAI,SAAS,GAAG,CAAC,MAAM,CAAC,EACxB,MAAM,SAAS,OAAO,CAAC,GAAG,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,QAAQ,CAAC;;gBAyBzC,EACV,IAAI,EACJ,MAAM,EACN,KAAK,EACL,SAAS,EACT,KAAK,EACL,IAAI,EACL,EAAE;QACD,IAAI,EAAE,IAAI,CAAC;QACX,MAAM,EAAE,MAAM,CAAC;QACf,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QACnC,SAAS,EAAE,SAAS,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QACxC,KAAK,EAAE,KAAK,CAAC;QACb,IAAI,CAAC,EAAE;YACL,KAAK,CAAC,EAAE,UAAU,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SAC1C,CAAC;KACH;IAgBK,OAAO,IAAI,OAAO,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;IAyCxD,IAAI,QAAQ,WAEX;IACD,IAAI,QAAQ,YAEX;IACD,UAAU;IAMV,IAAI,MAAM,gBAET;IACD,IAAI,IAAI,IAAI,cAAc,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,IAAI,CAEnD;IACD,IAAI,SAAS,IAAI,YAAY,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,IAAI,CAEtD;CACF;AAED,qBAAa,SAAS,CACpB,GAAG,SAAS,YAAY,EACxB,IAAI,SAAS,GAAG,CAAC,MAAM,CAAC,EACxB,MAAM,SAAS,OAAO,CAAC,GAAG,EAAE;IAAE,IAAI,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,QAAQ,CAAC;;gBA6BnD,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,kBAAkB,CAAC,GAAG,CAAC,EAChC,MAAM,EAAE,KAAK,EACb,YAAY,CAAC,EAAE,YAAY,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC;YAelC,KAAK;IAOnB;;;OAGG;YACW,eAAe;IA6BvB,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;CAuB3F"}

package/dist/api/query/query.svelte.js

@@ -127,7 +127,9 @@ export class Requestor {
      * Then it separates the outputs and resolves each of the promises
      */
     async flushBatchQueue(batchId) {
-        const queue = this.#batchQueue[batchId].splice(0);
+        const queue = this.#batchQueue[batchId]?.splice(0) ?? [];
+        if (queue.length === 0)
+            return;
         // TODO maybe remove the unBatchOutput function and just always return the
         // same response and then its on each consumer of each query to find the relevant records
         try {
@@ -157,8 +159,11 @@ export class Requestor {
                 this.#batchQueue[batchId].push({ input, resolve, reject });
                 if (!this.#batchTimers[batchId]) {
                     this.#batchTimers[batchId] = setTimeout(() => {
+                        delete this.#batchTimers[batchId];
                         void this.flushBatchQueue(batchId).finally(() => {
-                            delete this.#batchTimers[batchId];
+                            if (this.#batchQueue[batchId]?.length === 0) {
+                                delete this.#batchQueue[batchId];
+                            }
                         });
                     }, this.#batchDelay);
                 }

package/dist/api/query/query.unit.test.js

@@ -180,6 +180,48 @@ describe('Requestor', () => {
         await vi.advanceTimersByTimeAsync(100);
         await Promise.all([p1Expectation, p2Expectation]);
     });
+    it('schedules a new batch for requests added while a previous batch is in flight', async () => {
+        const firstFetch = deferred();
+        const secondFetch = deferred();
+        const fetchMock = vi.fn((_url, init) => {
+            if (init?.body === JSON.stringify({ ids: [1] })) {
+                return firstFetch.promise;
+            }
+            if (init?.body === JSON.stringify({ ids: [2] })) {
+                return secondFetch.promise;
+            }
+            throw new Error(`Unexpected request body: ${String(init?.body)}`);
+        });
+        vi.stubGlobal('fetch', fetchMock);
+        const requestor = createBatchedRequestor({
+            canBatch: (input) => ('group' in input && input.group) || false,
+            batchInput: (inputs) => ({ ids: inputs.map(getSingleId) }),
+            unBatchOutput: (inputs) => inputs.map((input) => jsonResponse({ id: getSingleId(input) }))
+        });
+        const p1 = requestor.request({ id: 1, group: 'team' });
+        await vi.advanceTimersByTimeAsync(100);
+        expect(fetchMock).toHaveBeenCalledTimes(1);
+        expect(fetchMock).toHaveBeenLastCalledWith(`${API_URL}//users`, expect.objectContaining({
+            method: 'POST',
+            body: JSON.stringify({ ids: [1] }),
+            credentials: 'include'
+        }));
+        const p2 = requestor.request({ id: 2, group: 'team' });
+        await vi.advanceTimersByTimeAsync(99);
+        expect(fetchMock).toHaveBeenCalledTimes(1);
+        await vi.advanceTimersByTimeAsync(1);
+        expect(fetchMock).toHaveBeenCalledTimes(2);
+        expect(fetchMock).toHaveBeenLastCalledWith(`${API_URL}//users`, expect.objectContaining({
+            method: 'POST',
+            body: JSON.stringify({ ids: [2] }),
+            credentials: 'include'
+        }));
+        firstFetch.resolve(jsonFetchResponse({ ok: true }));
+        secondFetch.resolve(jsonFetchResponse({ ok: true }));
+        const [response1, response2] = await Promise.all([p1, p2]);
+        await expect(response1.json()).resolves.toEqual({ id: 1 });
+        await expect(response2.json()).resolves.toEqual({ id: 2 });
+    });
 });
 describe('Query', () => {
     beforeEach(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte-ag",
-  "version": "1.2.6",
+  "version": "1.2.8",
   "description": "Useful svelte components",
   "bugs": "https://github.com/ageorgeh/svelte-ag/issues",
   "author": "Alexander Hornung",
@@ -63,7 +63,6 @@
     "sveltekit-superforms": "2.30.1",
     "tailwind-merge": "^3.6.0",
     "tailwind-variants": "^3.2.2",
-    "ts-ag": "^1.2.7",
     "tsc-alias": "^1.8.17",
     "valibot": "^1.4.1"
   },
@@ -102,6 +101,7 @@
     "svelte-preprocess": "^6.0.5",
     "svelte2tsx": "^0.7.56",
     "tailwindcss": "4.3.0",
+    "ts-ag": "^1.2.7",
     "tsdown": "^0.22.2",
     "tsx": "^4.22.4",
     "tw-animate-css": "^1.4.0",
@@ -117,6 +117,7 @@
     "svelte": "^5.0.0",
     "tailwind-variants": "^3.2.2",
     "tailwindcss": "^4.2.1",
+    "ts-ag": "^1.2.7",
     "tw-animate-css": "^1.4.0"
   },
   "tailwindSources": "./dist/tailwind-sources.manifest.jsonc"

package/src/lib/api/query/query.svelte.ts

@@ -195,19 +195,19 @@ export class Requestor<
    * Then it separates the outputs and resolves each of the promises
    */
   private async flushBatchQueue(batchId: string): Promise<void> {
-    const queue = this.#batchQueue[batchId].splice(0);
+    const queue = this.#batchQueue[batchId]?.splice(0) ?? [];
+    if (queue.length === 0) return;
 
     // TODO maybe remove the unBatchOutput function and just always return the
     // same response and then its on each consumer of each query to find the relevant records
     try {
       const batchedInput = this.#batchInput(queue.map((q) => q.input));
-
       const res = await this.fetch(batchedInput);
+
       const output = await this.#unBatchOutput(
         queue.map((q) => q.input),
         res
       );
-
       if (output.length !== queue.length) {
         throw new Error(`Batch output length mismatch for ${batchId}`);
       }
@@ -232,8 +232,12 @@ export class Requestor<
 
         if (!this.#batchTimers[batchId]) {
           this.#batchTimers[batchId] = setTimeout(() => {
+            delete this.#batchTimers[batchId];
+
             void this.flushBatchQueue(batchId).finally(() => {
-              delete this.#batchTimers[batchId];
+              if (this.#batchQueue[batchId]?.length === 0) {
+                delete this.#batchQueue[batchId];
+              }
             });
           }, this.#batchDelay);
         }

package/src/lib/api/query/query.unit.test.ts

@@ -272,6 +272,70 @@ describe('Requestor', () => {
 
     await Promise.all([p1Expectation, p2Expectation]);
   });
+
+  it('schedules a new batch for requests added while a previous batch is in flight', async () => {
+    const firstFetch = deferred<Response>();
+    const secondFetch = deferred<Response>();
+
+    const fetchMock = vi.fn((_url: string, init?: RequestInit) => {
+      if (init?.body === JSON.stringify({ ids: [1] })) {
+        return firstFetch.promise;
+      }
+
+      if (init?.body === JSON.stringify({ ids: [2] })) {
+        return secondFetch.promise;
+      }
+
+      throw new Error(`Unexpected request body: ${String(init?.body)}`);
+    });
+
+    vi.stubGlobal('fetch', fetchMock);
+
+    const requestor = createBatchedRequestor({
+      canBatch: (input) => ('group' in input && input.group) || false,
+      batchInput: (inputs) => ({ ids: inputs.map(getSingleId) }),
+      unBatchOutput: (inputs) => inputs.map((input) => jsonResponse({ id: getSingleId(input) }))
+    });
+
+    const p1 = requestor.request({ id: 1, group: 'team' });
+
+    await vi.advanceTimersByTimeAsync(100);
+
+    expect(fetchMock).toHaveBeenCalledTimes(1);
+    expect(fetchMock).toHaveBeenLastCalledWith(
+      `${API_URL}//users`,
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ ids: [1] }),
+        credentials: 'include'
+      })
+    );
+
+    const p2 = requestor.request({ id: 2, group: 'team' });
+
+    await vi.advanceTimersByTimeAsync(99);
+    expect(fetchMock).toHaveBeenCalledTimes(1);
+
+    await vi.advanceTimersByTimeAsync(1);
+
+    expect(fetchMock).toHaveBeenCalledTimes(2);
+    expect(fetchMock).toHaveBeenLastCalledWith(
+      `${API_URL}//users`,
+      expect.objectContaining({
+        method: 'POST',
+        body: JSON.stringify({ ids: [2] }),
+        credentials: 'include'
+      })
+    );
+
+    firstFetch.resolve(jsonFetchResponse({ ok: true }));
+    secondFetch.resolve(jsonFetchResponse({ ok: true }));
+
+    const [response1, response2] = await Promise.all([p1, p2]);
+
+    await expect(response1.json()).resolves.toEqual({ id: 1 });
+    await expect(response2.json()).resolves.toEqual({ id: 2 });
+  });
 });
 
 describe('Query', () => {