@triplit/svelte 0.1.8 → 0.1.10

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @triplit/svelte
 
+## 0.1.10
+
+### Patch Changes
+
+- 368a0fb: have fetching depend on fetchingLocal
+
+## 0.1.9
+
+### Patch Changes
+
+- 3d08941: add fetchingLocal state
+- Updated dependencies [826acd1]
+- Updated dependencies [3d08941]
+  - @triplit/client@0.3.37
+
 ## 0.1.8
 
 ### Patch Changes

package/dist/index.svelte.d.ts

@@ -1,6 +1,7 @@
 import type { ClientFetchResult, ClientQuery, ClientQueryBuilder, CollectionNameFromModels, Models, SubscriptionOptions, TriplitClient } from '@triplit/client';
 export declare function useQuery<M extends Models<any, any> | undefined, CN extends CollectionNameFromModels<M>>(client: TriplitClient<any>, query: ClientQueryBuilder<M, CN>, options?: Partial<SubscriptionOptions>): {
     fetching: boolean;
+    fetchingLocal: boolean;
     fetchingRemote: boolean;
     results: ClientFetchResult<ClientQuery<M, CN>> | undefined;
     error: any;

package/dist/index.svelte.js

@@ -1,18 +1,25 @@
 /// <reference types="svelte" />
 export function useQuery(client, query, options) {
     let results = $state(undefined);
-    let fetching = $state(false);
+    let isInitialFetch = $state(true);
+    let fetchingLocal = $state(false);
     let fetchingRemote = $state(client.syncEngine.connectionStatus !== 'CLOSED');
+    let fetching = $derived(fetchingLocal || (isInitialFetch && fetchingRemote));
     let error = $state(undefined);
     let hasResponseFromServer = false;
     let builtQuery = $state(query && query.build());
     function updateQuery(query) {
         builtQuery = query.build();
         results = undefined;
-        fetching = true;
+        fetchingLocal = true;
         hasResponseFromServer = false;
     }
     $effect(() => {
+        client.syncEngine
+            .isFirstTimeFetchingQuery(builtQuery)
+            .then((isFirstFetch) => {
+            isInitialFetch = isFirstFetch;
+        });
         const unsub = client.syncEngine.onConnectionStatusChange((status) => {
             if (status === 'CLOSING' || status === 'CLOSED') {
                 fetchingRemote = false;
@@ -29,11 +36,11 @@ export function useQuery(client, query, options) {
     });
     $effect(() => {
         const unsubscribe = client.subscribe(builtQuery, (localResults) => {
-            fetching = false;
+            fetchingLocal = false;
             error = undefined;
             results = new Map(localResults);
         }, (error) => {
-            fetching = false;
+            fetchingLocal = false;
             error = error;
         }, {
             ...(options ?? {}),
@@ -50,6 +57,9 @@ export function useQuery(client, query, options) {
         get fetching() {
             return fetching;
         },
+        get fetchingLocal() {
+            return fetchingLocal;
+        },
         get fetchingRemote() {
             return fetchingRemote;
         },

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@triplit/svelte",
   "packageManager": "yarn@3.4.1",
-  "version": "0.1.8",
+  "version": "0.1.10",
   "source": "./src/index.svelte.ts",
   "main": "./dist/index.svelte.js",
   "module": "./dist/index.svelte.js",
@@ -27,7 +27,7 @@
     "/dist"
   ],
   "dependencies": {
-    "@triplit/client": "^0.3.36"
+    "@triplit/client": "^0.3.37"
   },
   "devDependencies": {
     "@sveltejs/package": "^2.3.0",