Add 'Revert All Selection' feature #68

This commit introduces 'Revert: None - Selected' toggle, enabling users
to revert all reversible scripts with a single action, improving user
safety and control over script effects.

This feature addresses user-reported concerns about the ease of
reverting script changes. This feature should enhance the user experience
by streamlining the revert process along with providing essential
information about script reversibility.

Key changes:

- Add buttons to revert all selected scripts or setting all selected
  scripts to non-revert state.
- Add tooltips with detailed explanations about consequences of
  modifying revert states, includinginformation about irreversible
  script changes.

Supporting changes:

- Align items on top menu vertically for better visual consistency.
- Rename `SelectionType` to `RecommendationStatusType` for more clarity.
- Rename `IReverter` to `Reverter` to move away from `I` prefix
  convention.
- The `.script` CSS class was duplicated in `TheScriptsView.vue` and
  `TheScriptsArea.vue`, leading to style collisions in the development
  environment. The class has been renamed to component-specific classes
  to avoid such issues in the future.

src/presentation/components/Scripts/View/Tree/NodeContent/RevertToggle.vue

@@ -13,9 +13,9 @@ import {
 import { injectKey } from '@/presentation/injectionSymbols';
 import { NodeMetadata } from '@/presentation/components/Scripts/View/Tree/NodeContent/NodeMetadata';
 import { ICategoryCollection } from '@/domain/ICategoryCollection';
-import { IReverter } from './Reverter/IReverter';
 import { getReverter } from './Reverter/ReverterFactory';
 import ToggleSwitch from './ToggleSwitch.vue';
+import type { Reverter } from './Reverter/Reverter';
 
 export default defineComponent({
   components: {
@@ -35,7 +35,7 @@ export default defineComponent({
 
     const currentCollection = computed<ICategoryCollection>(() => currentState.value.collection);
 
-    const revertHandler = computed<IReverter>(
+    const revertHandler = computed<Reverter>(
       () => getReverter(props.node, currentCollection.value),
     );
 
@@ -64,3 +64,4 @@ export default defineComponent({
   },
 });
 </script>
+./Reverter/Reverter

src/presentation/components/Scripts/View/Tree/NodeContent/Reverter/CategoryReverter.ts

@@ -2,20 +2,24 @@ import { UserSelection } from '@/application/Context/State/Selection/UserSelecti
 import { ICategoryCollection } from '@/domain/ICategoryCollection';
 import { SelectedScript } from '@/application/Context/State/Selection/Script/SelectedScript';
 import { getCategoryId } from '../../TreeViewAdapter/CategoryNodeMetadataConverter';
-import { IReverter } from './IReverter';
+import { Reverter } from './Reverter';
 import { ScriptReverter } from './ScriptReverter';
 
-export class CategoryReverter implements IReverter {
+export class CategoryReverter implements Reverter {
   private readonly categoryId: number;
 
   private readonly scriptReverters: ReadonlyArray<ScriptReverter>;
 
   constructor(nodeId: string, collection: ICategoryCollection) {
     this.categoryId = getCategoryId(nodeId);
-    this.scriptReverters = getAllSubScriptReverters(this.categoryId, collection);
+    this.scriptReverters = createScriptReverters(this.categoryId, collection);
   }
 
   public getState(selectedScripts: ReadonlyArray<SelectedScript>): boolean {
+    if (!this.scriptReverters.length) {
+      // An empty array indicates there are no reversible scripts in this category
+      return false;
+    }
     return this.scriptReverters.every((script) => script.getState(selectedScripts));
   }
 
@@ -32,8 +36,13 @@ export class CategoryReverter implements IReverter {
   }
 }
 
-function getAllSubScriptReverters(categoryId: number, collection: ICategoryCollection) {
+function createScriptReverters(
+  categoryId: number,
+  collection: ICategoryCollection,
+): ScriptReverter[] {
   const category = collection.getCategory(categoryId);
-  const scripts = category.getAllScriptsRecursively();
+  const scripts = category
+    .getAllScriptsRecursively()
+    .filter((script) => script.canRevert());
   return scripts.map((script) => new ScriptReverter(script.id));
 }

src/presentation/components/Scripts/View/Tree/NodeContent/Reverter/Reverter.ts

@@ -1,7 +1,7 @@
 import { UserSelection } from '@/application/Context/State/Selection/UserSelection';
 import { SelectedScript } from '@/application/Context/State/Selection/Script/SelectedScript';
 
-export interface IReverter {
+export interface Reverter {
   getState(selectedScripts: ReadonlyArray<SelectedScript>): boolean;
   selectWithRevertState(newState: boolean, selection: UserSelection): void;
 }

src/presentation/components/Scripts/View/Tree/NodeContent/Reverter/ReverterFactory.ts

@@ -1,10 +1,10 @@
 import { ICategoryCollection } from '@/domain/ICategoryCollection';
 import { NodeMetadata, NodeType } from '../NodeMetadata';
-import { IReverter } from './IReverter';
+import { Reverter } from './Reverter';
 import { ScriptReverter } from './ScriptReverter';
 import { CategoryReverter } from './CategoryReverter';
 
-export function getReverter(node: NodeMetadata, collection: ICategoryCollection): IReverter {
+export function getReverter(node: NodeMetadata, collection: ICategoryCollection): Reverter {
   switch (node.type) {
     case NodeType.Category:
       return new CategoryReverter(node.id, collection);

src/presentation/components/Scripts/View/Tree/NodeContent/Reverter/ScriptReverter.ts

@@ -1,9 +1,9 @@
 import { UserSelection } from '@/application/Context/State/Selection/UserSelection';
 import { SelectedScript } from '@/application/Context/State/Selection/Script/SelectedScript';
 import { getScriptId } from '../../TreeViewAdapter/CategoryNodeMetadataConverter';
-import { IReverter } from './IReverter';
+import { Reverter } from './Reverter';
 
-export class ScriptReverter implements IReverter {
+export class ScriptReverter implements Reverter {
   private readonly scriptId: string;
 
   constructor(nodeId: string) {