Improve UI performance by optimizing reactivity

- Replace `ref`s with `shallowRef` when deep reactivity is not needed.
- Replace `readonly`s with `shallowReadonly` where the goal is to only
  prevent `.value` mutation.
- Remove redundant `ref` in `SizeObserver.vue`.
- Remove redundant nested `ref` in `TooltipWrapper.vue`.
- Remove redundant `events` export from `UseCollectionState.ts`.
- Remove redundant `computed` from `UseCollectionState.ts`.
- Remove `timestamp` from `TreeViewFilterEvent` that becomes unnecessary
  after using `shallowRef`.
- Add missing unit tests for `UseTreeViewFilterEvent`.
- Add missing stub for `FilterChangeDetails`.

tests/unit/shared/Stubs/FilterChangeDetailsStub.ts

@@ -0,0 +1,26 @@
+import { FilterActionType } from '@/application/Context/State/Filter/Event/FilterActionType';
+import { IFilterChangeDetails, IFilterChangeDetailsVisitor } from '@/application/Context/State/Filter/Event/IFilterChangeDetails';
+import { IFilterResult } from '@/application/Context/State/Filter/IFilterResult';
+
+export class FilterChangeDetailsStub implements IFilterChangeDetails {
+  public static forApply(filter: IFilterResult) {
+    return new FilterChangeDetailsStub(FilterActionType.Apply, filter);
+  }
+
+  public static forClear() {
+    return new FilterChangeDetailsStub(FilterActionType.Clear);
+  }
+
+  private constructor(
+    public actionType: FilterActionType,
+    public filter?: IFilterResult,
+  ) { /* Private constructor to enforce factory methods */ }
+
+  visit(visitor: IFilterChangeDetailsVisitor): void {
+    if (this.filter) {
+      visitor.onApply(this.filter);
+    } else {
+      visitor.onClear();
+    }
+  }
+}

tests/unit/shared/Stubs/UseCollectionStateStub.ts

@@ -1,4 +1,4 @@
-import { ref } from 'vue';
+import { shallowRef } from 'vue';
 import {
   ContextModifier, IStateCallbackSettings, NewStateEventHandler,
   StateModifier, useCollectionState,
@@ -8,7 +8,6 @@ import { IUserFilter } from '@/application/Context/State/Filter/IUserFilter';
 import { IApplicationContext } from '@/application/Context/IApplicationContext';
 import { IFilterResult } from '@/application/Context/State/Filter/IFilterResult';
 import { CategoryCollectionStateStub } from './CategoryCollectionStateStub';
-import { EventSubscriptionCollectionStub } from './EventSubscriptionCollectionStub';
 import { ApplicationContextStub } from './ApplicationContextStub';
 import { UserFilterStub } from './UserFilterStub';
 import { StubWithObservableMethodCalls } from './StubWithObservableMethodCalls';
@@ -17,7 +16,9 @@ export class UseCollectionStateStub
   extends StubWithObservableMethodCalls<ReturnType<typeof useCollectionState>> {
   private currentContext: IApplicationContext = new ApplicationContextStub();
 
-  private readonly currentState = ref<ICategoryCollectionState>(new CategoryCollectionStateStub());
+  private readonly currentState = shallowRef<ICategoryCollectionState>(
+    new CategoryCollectionStateStub(),
+  );
 
   public withFilter(filter: IUserFilter) {
     const state = new CategoryCollectionStateStub()
@@ -100,7 +101,6 @@ export class UseCollectionStateStub
       onStateChange: this.onStateChange.bind(this),
       currentContext: this.currentContext,
       currentState: this.currentState,
-      events: new EventSubscriptionCollectionStub(),
     };
   }
 }

tests/unit/shared/Stubs/UseCurrentTreeNodesStub.ts

@@ -1,5 +1,5 @@
 import {
-  WatchSource, readonly, shallowRef, triggerRef,
+  WatchSource, shallowReadonly, shallowRef, triggerRef,
 } from 'vue';
 import { TreeRoot } from '@/presentation/components/Scripts/View/Tree/TreeView/TreeRoot/TreeRoot';
 import { useCurrentTreeNodes } from '@/presentation/components/Scripts/View/Tree/TreeView/UseCurrentTreeNodes';
@@ -25,7 +25,7 @@ export class UseCurrentTreeNodesStub {
     return (treeWatcher: WatchSource<TreeRoot>) => {
       this.treeWatcher = treeWatcher;
       return {
-        nodes: readonly(this.nodes),
+        nodes: shallowReadonly(this.nodes),
       };
     };
   }