Improve docs for hooks

Author: stevensJourney

packages/common/src/client/Query.ts

@@ -32,7 +32,7 @@ export interface ArrayQueryDefinition<RowType = unknown> {
 }
 
 /**
- * Options for {@link Query.watch}.
+ * Options for {@link Query#watch}.
  */
 export interface StandardWatchedQueryOptions<RowType> extends WatchedQueryOptions {
   /**

packages/react/src/hooks/watched/watch-types.ts

@@ -16,7 +16,9 @@ export interface DifferentialHookOptions<RowType> extends HookWatchOptions {
    * emit a new hook result even if the result set has not changed.
    *
    * Specifying a {@link WatchedQueryDifferentiator} will remove emissions for
-   * unchanged result sets and preserve Array object references between result set emissions.
+   * unchanged result sets.
+   * Furthermore, emitted `data` arrays will preserve object references between result set emissions
+   * for unchanged rows.
    * @example
    * ```javascript
    * {

packages/vue/src/composables/useSingleQuery.ts

@@ -17,7 +17,9 @@ export interface AdditionalOptions<RowType = unknown> extends Omit<SQLOnChangeOp
    * emit a new hook result even if the result set has not changed.
    *
    * Specifying a {@link WatchedQueryDifferentiator} will remove emissions for
-   * unchanged result sets and preserve Array object references between result set emissions.
+   * unchanged result sets.
+   * Furthermore, emitted `data` arrays will preserve object references between result set emissions
+   * for unchanged rows.
    * @example
    * ```javascript
    * {

packages/vue/src/composables/useWatchedQuerySubscription.ts

@@ -29,7 +29,7 @@ export const useWatchedQuerySubscription = <
   query: Query
 ): UnwrapNestedRefs<Query['state']> => {
   // Creates a reactive variable which will proxy the state
-  const state = reactive(query.state) as UnwrapNestedRefs<Query['state']>;
+  const state = reactive({ ...query.state }) as UnwrapNestedRefs<Query['state']>;
 
   watchEffect((onCleanup) => {
     const dispose = query.registerListener({