@dxos/react-client 0.8.3-main.7f5a14c → 0.8.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-client",
-  "version": "0.8.3-main.7f5a14c",
+  "version": "0.8.3",
   "description": "React client API",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -78,20 +78,21 @@
   },
   "dependencies": {
     "react-error-boundary": "^4.0.13",
-    "@dxos/async": "0.8.3-main.7f5a14c",
-    "@dxos/client": "0.8.3-main.7f5a14c",
-    "@dxos/codec-protobuf": "0.8.3-main.7f5a14c",
-    "@dxos/config": "0.8.3-main.7f5a14c",
-    "@dxos/context": "0.8.3-main.7f5a14c",
-    "@dxos/echo-schema": "0.8.3-main.7f5a14c",
-    "@dxos/echo-signals": "0.8.3-main.7f5a14c",
-    "@dxos/log": "0.8.3-main.7f5a14c",
-    "@dxos/invariant": "0.8.3-main.7f5a14c",
-    "@dxos/protocols": "0.8.3-main.7f5a14c",
-    "@dxos/node-std": "0.8.3-main.7f5a14c",
-    "@dxos/debug": "0.8.3-main.7f5a14c",
-    "@dxos/util": "0.8.3-main.7f5a14c",
-    "@dxos/react-hooks": "0.8.3-main.7f5a14c"
+    "@dxos/async": "0.8.3",
+    "@dxos/client": "0.8.3",
+    "@dxos/codec-protobuf": "0.8.3",
+    "@dxos/config": "0.8.3",
+    "@dxos/context": "0.8.3",
+    "@dxos/debug": "0.8.3",
+    "@dxos/echo": "0.8.3",
+    "@dxos/echo-schema": "0.8.3",
+    "@dxos/echo-signals": "0.8.3",
+    "@dxos/invariant": "0.8.3",
+    "@dxos/log": "0.8.3",
+    "@dxos/node-std": "0.8.3",
+    "@dxos/protocols": "0.8.3",
+    "@dxos/react-hooks": "0.8.3",
+    "@dxos/util": "0.8.3"
   },
   "devDependencies": {
     "@types/react": "~18.2.0",
@@ -99,21 +100,21 @@
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "typedoc": "0.28.1",
-    "@dxos/random": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui-syntax-highlighter": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui-theme": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui": "0.8.3-main.7f5a14c",
-    "@dxos/test-utils": "0.8.3-main.7f5a14c",
-    "@dxos/storybook-utils": "0.8.3-main.7f5a14c"
+    "@dxos/random": "0.8.3",
+    "@dxos/react-ui": "0.8.3",
+    "@dxos/react-ui-syntax-highlighter": "0.8.3",
+    "@dxos/react-ui-theme": "0.8.3",
+    "@dxos/storybook-utils": "0.8.3",
+    "@dxos/test-utils": "0.8.3"
   },
   "peerDependencies": {
     "react": "~18.2.0",
     "react-dom": "~18.2.0"
   },
   "optionalDependencies": {
-    "@dxos/react-ui": "0.8.3-main.7f5a14c",
-    "@dxos/random": "0.8.3-main.7f5a14c",
-    "@dxos/react-ui-theme": "0.8.3-main.7f5a14c"
+    "@dxos/random": "0.8.3",
+    "@dxos/react-ui": "0.8.3",
+    "@dxos/react-ui-theme": "0.8.3"
   },
   "publishConfig": {
     "access": "public"

package/src/echo/useQuery.test.tsx

@@ -0,0 +1,128 @@
+//
+// Copyright 2022 DXOS.org
+//
+
+import { renderHook } from '@testing-library/react';
+import { describe, expect, test } from 'vitest';
+
+import { Expando, Filter, live } from '@dxos/client/echo';
+
+import { useQuery } from './useQuery';
+import { createClient, createClientContextProvider } from '../testing/util';
+
+describe('useQuery', () => {
+  // TODO(dmaretskyi): Fix this test.
+  test.skip('deleting an element should result in correct render sequence', async () => {
+    // Setup: Create client and space.
+    const { client, space } = await createClient({ createIdentity: true, createSpace: true });
+    const wrapper = await createClientContextProvider(client);
+
+    // Create 3 test objects: Alice, Bob, Charlie.
+    const alice = live(Expando, { name: 'Alice' });
+    const bob = live(Expando, { name: 'Bob' });
+    const charlie = live(Expando, { name: 'Charlie' });
+
+    space!.db.add(alice);
+    space!.db.add(bob);
+    space!.db.add(charlie);
+    await space!.db.flush();
+
+    // Track all renders to observe the bug.
+    const allRenders: string[][] = [];
+
+    // Setup useQuery hook that captures every render.
+    renderHook(
+      () => {
+        const objects = useQuery(space, Filter.type(Expando));
+
+        // Capture the names in this render.
+        const namesInThisRender = objects.map((obj) => obj.name);
+        allRenders.push([...namesInThisRender]);
+
+        return objects;
+      },
+      { wrapper },
+    );
+
+    // Wait for initial renders to complete.
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    // THE BUG REPRODUCTION: Delete Bob.
+    space!.db.remove(bob);
+
+    // Wait for all reactive updates to complete.
+    await new Promise((resolve) => setTimeout(resolve, 500));
+
+    // TODO(ZaymonFC): Remove this comment once the flash bug is resolved.
+    /*
+     * NOTE(ZaymonFC):
+     *   Expected: 3 renders
+     *   1. [] (empty)
+     *   2. ['Alice', 'Bob', 'Charlie'] (all loaded)
+     *   3. ['Alice', 'Charlie'] (Bob removed, no flash)
+     *
+     *   Actual: 4 renders
+     *   1. [] (empty)
+     *   2. ['Alice', 'Bob', 'Charlie'] (all loaded)
+     *   3. ['Alice', 'Charlie', 'Bob'] (FLASH BUG - Bob moves to end!)
+     *   4. ['Alice', 'Charlie'] (Bob finally removed)
+     */
+
+    expect(allRenders).toEqual([
+      [], // Initial loading state.
+      ['Alice', 'Bob', 'Charlie'], // All objects loaded.
+      ['Alice', 'Charlie'], // Bob removed (no flash).
+    ]);
+  });
+
+  test('bulk deleting multiple items should remove them from query results', async () => {
+    // Setup: Create client and space.
+    const { client, space } = await createClient({ createIdentity: true, createSpace: true });
+    const wrapper = await createClientContextProvider(client);
+
+    // Create 10 test objects: 1, 2, 3, ..., 10.
+    const objects = Array.from({ length: 10 }, (_, i) => live(Expando, { value: i + 1 }));
+
+    objects.forEach((obj) => space!.db.add(obj));
+    await space!.db.flush();
+
+    // Track all renders to observe the bug.
+    const allRenders: number[][] = [];
+
+    // Setup useQuery hook that captures every render.
+    renderHook(
+      () => {
+        const queryObjects = useQuery(space, Filter.type(Expando));
+
+        // Capture the values in this render.
+        const valuesInThisRender = queryObjects.map((obj) => obj.value);
+        allRenders.push([...valuesInThisRender]);
+
+        return queryObjects;
+      },
+      { wrapper },
+    );
+
+    // Wait for initial renders to complete.
+    await new Promise((resolve) => setTimeout(resolve, 100));
+
+    // THE BUG REPRODUCTION: Delete all items in a loop.
+    for (const item of objects) {
+      space!.db.remove(item);
+    }
+
+    // Wait for all reactive updates to complete.
+    await new Promise((resolve) => setTimeout(resolve, 500));
+
+    // Convert to sets for order-independent comparison.
+    const renderSets = allRenders.map((render) => new Set(render));
+
+    expect(renderSets).toEqual([
+      new Set([]), // Initial loading state.
+      new Set([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]), // All objects loaded.
+      // TODO(dmaretskyi): Fix this with query ordering.
+      new Set([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]), // Getting another render for some reason.
+      new Set([]), // All items deleted.
+    ]);
+  });
+});

package/src/echo/useQueue.ts

@@ -6,7 +6,7 @@ import { useEffect, useMemo, useRef } from 'react';
 
 import { type Queue } from '@dxos/client/echo';
 import { raise } from '@dxos/debug';
-import { type BaseEchoObject } from '@dxos/echo-schema';
+import { type Obj, type Relation } from '@dxos/echo';
 import { type DXN } from '@dxos/keys';
 
 import { useClient } from '../client';
@@ -24,7 +24,7 @@ export type UseQueueOptions = {
 // TODO(dmaretskyi): Move into client package.
 // TODO(dmaretskyi): Consider passing the space into the hook to support queue DXNs without space id.
 // TODO(ZaymonFC): If queue is unchanged returned object should be refferentially stable on poll.
-export const useQueue = <T extends BaseEchoObject>(
+export const useQueue = <T extends Obj.Any | Relation.Any>(
   queueDxn?: DXN,
   options: UseQueueOptions = {},
 ): Queue<T> | undefined => {

package/tsconfig.json

@@ -41,6 +41,9 @@
     {
       "path": "../../common/util"
     },
+    {
+      "path": "../../core/echo/echo"
+    },
     {
       "path": "../../core/echo/echo-schema"
     },

package/typedoc/assets/hierarchy.js

@@ -1 +1 @@
-window.hierarchyData = "eJylV8tS2zAU/RetBbVsyY/sOilM0ynQgT4WDAthi6CJImUkJSVl+PeOSUJk7MTX7SqTWOeecx/RPX5G1hjv0OiWkDTHNI8wzYsIJxHFjFLMIprgLCN3GFnxoETppdEOjZ5REtH6Q/O5QCM0VlJofyPsSpbCfbNmJSthEUYzqSs0ilmK0dIqNEJSe2EfeCncB6kr8XTaDT199HOFMCoVdw6NkHfVSR3r5A1fP3yUqrJCo9FtQSNMIsJwUTBMCE3uXjCirAg0flRW8Gr9xUgtqjNrzV4fifOdvlfCN3FtzEFhmx9q1jwKWRcSyrU92cPQSJvlKU4LgjMS1wmzKA6bwnUplAIn2zzfnyiLk4DtE/d8bKxdLuoZAVJ2gAC8lL7jvedODGB8Oz6k1JQVmKUpTqMMp7TAaRbhrHidM5amgaAz7aVfXxp/bpYaWvsOEKAQecg70SuuZDU2+kFOgbRtTD9rGmVt1oleSc8HdL4bB2CP86PsT15oJ42+Ngo6EoAgAF00vGsmldg1dKKll1zJP+D/4REwQEcWtetz443lU/FTWDe4Qx1YgIqCBCquxdx4sb3ix0brzR4B6jiG7leSkbhfyXc5F2bp/1nLFg9Qk4RX5vWiHCvjwIPRPA9gY3GT7dL4q4UAF74JAPBlYddv1s6LOZArODxo/0UxZnGC0zjHWZLgjL3uwawIy/xDz7T5rS9MJRRQTgvSn3xBG2t/KrRvWJuWKTpsBA5iASoKFqj4akqumgarn74D1M9be69jfvBpDfAfbRCAmNCw17+MnQk7NOUuFIQ6zd+3/LNxXurprmGbkCAffBg+1AsTkseYxBsPXH95L/KCaz5tiTs+jw0MoDZxoy3nfCa6EuwnP4QE+PCsmfnSP9Z7teR1mP2yv7p3wq74vRLHxezOu9P+SJCXhCJqW/Ua+z/KesIMsrtZvn2laDRyH9b1TvVeV4AaOswsYlsdjWUWRATcLp1KQBfMy8tfIcQelQ=="
+window.hierarchyData = "eJyll0tT2zAUhf+L1oJKtiTb2XVSmKZToAN9LBgWwhZBE0XKyEpKyvDfO84DbOzE1+2KCejofPdeRTo8I+9cKNHollKRYpYSzDJKcEwY5oxhTkSMk4TeYeTVg1F50M6WaPSMYsKqH1bOFRqhsdHKhhvlVzpX5TfvVrpQHmE007ZAo4gLjJbeoBHSNij/IHNVftC2UE+n3dLTxzA3CKPcyLJEIxTK4qTa6+RVX/3xUZvCK4tGtxkjmBLKcZZxTCmL714wYjyrMX40Xsli/cVpq4oz790bH43SPd/G8BWurTkItv1F5ZqSuutCQ712K3scGmXzVGCRUZzQqCqYk6g+FGlzZQy42Ob6/kJ5FNfcPskgx8775aI6I0DLDhHAl7F3vveyVAMcX5cPaTXjGeZCYEESLFiGRUJwkm3OGReiBnRmgw7rSxfO3dJCe98hAjQirftO7EoaXYydfdBToG1b0+8qSNJ2ndiVDnLA5Lt1APcoPer+FJQttbPXzkCPBGATABer3zWTQu0HOrE6aGn0H/D38IgYwJGQdn9ugvNyqn4qXw6eUIcWQJHRGsW1mrugdlf82Fm7fUeAHMfU/SQJjfpJvuu5csvwzyw7PYAmrl+Z14t8bFwJPhjN9QA3HjXdLl24Wihw45sCgF9Sn/rNugxqDvSqLR70/pEI8yjGIkpxEsc44Zt3MMnqbf5hZ9b9theuUAaI05L0F5+xxrM/VTY0ok0rFB0OAge1AIqM1yi+ulyaZsDqt+8Q9ftW2etYHnxaA/JHWwQwpqw+61/Oz5QfWnKXCmIt0vcj/+zKoO10P7DtlqAcfFg+NAtTmkaYRtsMXH14D3khrZy24I6fx4YG0JuoMZZzOVNdBfabH1KCcnij8mV4rN7VXFbbvD32V/el8it5b9RxmP368rR/JwBcRkk7qlfa/yHr2WZQ3E3J7l8KETcDxd6t91S/cdVUQw8zJ8mOI4m6OQC3SycJ6IJ5efkLt5cegQ=="