Fix code highlighting and optimize category select

This commit introduces a batched debounce mechanism for managing user
selection state changes. It effectively reduces unnecessary processing
during rapid script checking, preventing multiple triggers for code
compilation and UI rendering.

Key improvements include:

- Enhanced performance, especially noticeable when selecting large
  categories. This update resolves minor UI freezes experienced when
  selecting categories with numerous scripts.
- Correction of a bug where the code area only highlighted the last
  selected script when multiple scripts were chosen.

Other changes include:

- Timing functions:
  - Create a `Timing` folder for `throttle` and the new
    `batchedDebounce` functions.
  - Move these functions to the application layer from the presentation
    layer, reflecting their application-wide use.
  - Refactor existing code for improved clarity, naming consistency, and
    adherence to new naming conventions.
  - Add missing unit tests.
- `UserSelection`:
  - State modifications in `UserSelection` now utilize a singular object
    inspired by the CQRS pattern, enabling batch updates and flexible
    change configurations, thereby simplifying change management.
- Remove the `I` prefix from related interfaces to align with new coding
  standards.
- Refactor related code for better testability in isolation with
  dependency injection.
- Repository:
  - Move repository abstractions to the application layer.
  - Improve repository abstraction to combine `ReadonlyRepository` and
    `MutableRepository` interfaces.
- E2E testing:
  - Introduce E2E tests to validate the correct batch selection
    behavior.
  - Add a specialized data attribute in `TheCodeArea.vue` for improved
    testability.
  - Reorganize shared Cypress functions for a more idiomatic Cypress
    approach.
  - Improve test documentation with related information.
- `SelectedScript`:
  - Create an abstraction for simplified testability.
  - Introduce `SelectedScriptStub` in tests as a substitute for the
    actual object.

tests/unit/application/Context/State/Code/Generation/UserScriptGenerator.spec.ts

@@ -1,12 +1,12 @@
 import { describe, it, expect } from 'vitest';
 import { UserScriptGenerator } from '@/application/Context/State/Code/Generation/UserScriptGenerator';
-import { SelectedScript } from '@/application/Context/State/Selection/SelectedScript';
 import { ICodeBuilderFactory } from '@/application/Context/State/Code/Generation/ICodeBuilderFactory';
 import { ICodeBuilder } from '@/application/Context/State/Code/Generation/ICodeBuilder';
 import { ScriptStub } from '@tests/unit/shared/Stubs/ScriptStub';
 import { ScriptingDefinitionStub } from '@tests/unit/shared/Stubs/ScriptingDefinitionStub';
 import { itEachAbsentStringValue } from '@tests/unit/shared/TestCases/AbsentTests';
 import { expectExists } from '@tests/shared/Assertions/ExpectExists';
+import { SelectedScriptStub } from '@tests/unit/shared/Stubs/SelectedScriptStub';
 
 describe('UserScriptGenerator', () => {
   describe('scriptingDefinition', () => {
@@ -94,7 +94,7 @@ describe('UserScriptGenerator', () => {
       const scriptName = 'test non-revert script';
       const scriptCode = 'REM nop';
       const script = new ScriptStub('id').withName(scriptName).withCode(scriptCode);
-      const selectedScripts = [new SelectedScript(script, false)];
+      const selectedScripts = [new SelectedScriptStub(script).withRevert(false)];
       const definition = new ScriptingDefinitionStub();
       // act
       const actual = sut.buildCode(selectedScripts, definition);
@@ -113,7 +113,8 @@ describe('UserScriptGenerator', () => {
       const script = new ScriptStub('id')
         .withName(scriptName)
         .withRevertCode(scriptCode)
-        .toSelectedScript(true);
+        .toSelectedScript()
+        .withRevert(true);
       const definition = new ScriptingDefinitionStub();
       // act
       const actual = sut.buildCode([script], definition);
@@ -127,10 +128,9 @@ describe('UserScriptGenerator', () => {
         const expectedError = 'Reverted script lacks revert code.';
         const sut = new UserScriptGenerator();
         const script = new ScriptStub('id')
-          .toSelectedScript(true);
-        // Hack until SelectedScript is interface:
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        (script.script.code as any).revert = emptyRevertCode;
+          .withRevertCode(emptyRevertCode)
+          .toSelectedScript()
+          .withRevert(true);
         const definition = new ScriptingDefinitionStub();
         // act
         const act = () => sut.buildCode([script], definition);
@@ -181,7 +181,8 @@ describe('UserScriptGenerator', () => {
             const selectedScript = new ScriptStub('script-id')
               .withName('script')
               .withCode(testCase.scriptCode)
-              .toSelectedScript(false);
+              .toSelectedScript()
+              .withRevert(false);
             // act
             const actual = sut.buildCode([selectedScript], definition);
             // expect