From 06801292b672e6344d3f3b2cb37ea1f987ed7d7d Mon Sep 17 00:00:00 2001
From: Denys Vuika <denys.vuika@gmail.com>
Date: Wed, 25 Feb 2026 17:25:02 +0000
Subject: [PATCH] test: add toggle icon state tests for mouse events and focus
 handling

- Introduced unit tests for the toggle icon state in the file uploading list row component.
- Added tests for mouse enter, mouse leave, focus, and blur events to ensure correct state management.
- Verified independent state handling for toggleIconState and toggleIconCancelState. [ci:force]
---
 .../file-uploading-list-row.component.spec.ts | 82 +++++++++++++++++++
 .../file-uploading-list.component.ts          |  3 +-
 2 files changed, 84 insertions(+), 1 deletion(-)

diff --git a/lib/content-services/src/lib/upload/components/file-uploading-list-row.component.spec.ts b/lib/content-services/src/lib/upload/components/file-uploading-list-row.component.spec.ts
index aa313cd085..3ccb4774c6 100644
--- a/lib/content-services/src/lib/upload/components/file-uploading-list-row.component.spec.ts
+++ b/lib/content-services/src/lib/upload/components/file-uploading-list-row.component.spec.ts
@@ -106,4 +106,86 @@ describe('FileUploadingListRowComponent', () => {
         const cancelButton = getCancelButton();
         expect(cancelButton.title).toBe('ADF_FILE_UPLOAD.BUTTON.STOP_FILE');
     });
+
+    describe('Toggle Icon State', () => {
+        describe('onToggleMouseEnter', () => {
+            it('should set isToggled to true when not focused', () => {
+                component.toggleIconState = { isFocused: false, isToggled: false };
+
+                component.onToggleMouseEnter(component.toggleIconState);
+
+                expect(component.toggleIconState.isToggled).toBe(true);
+            });
+
+            it('should not change isToggled when already focused', () => {
+                component.toggleIconState = { isFocused: true, isToggled: false };
+
+                component.onToggleMouseEnter(component.toggleIconState);
+
+                expect(component.toggleIconState.isToggled).toBe(false);
+            });
+        });
+
+        describe('onToggleMouseLeave', () => {
+            it('should set isToggled to false when not focused', () => {
+                component.toggleIconState = { isFocused: false, isToggled: true };
+
+                component.onToggleMouseLeave(component.toggleIconState);
+
+                expect(component.toggleIconState.isToggled).toBe(false);
+            });
+
+            it('should not change state when focused but not toggled', () => {
+                component.toggleIconState = { isFocused: true, isToggled: false };
+
+                component.onToggleMouseLeave(component.toggleIconState);
+
+                expect(component.toggleIconState.isFocused).toBe(true);
+                expect(component.toggleIconState.isToggled).toBe(false);
+            });
+
+            it('should reset both isFocused and isToggled when both are true', () => {
+                component.toggleIconState = { isFocused: true, isToggled: true };
+
+                component.onToggleMouseLeave(component.toggleIconState);
+
+                expect(component.toggleIconState.isFocused).toBe(false);
+                expect(component.toggleIconState.isToggled).toBe(false);
+            });
+        });
+
+        describe('onToggleFocus', () => {
+            it('should set both isFocused and isToggled to true', () => {
+                component.toggleIconState = { isFocused: false, isToggled: false };
+
+                component.onToggleFocus(component.toggleIconState);
+
+                expect(component.toggleIconState.isFocused).toBe(true);
+                expect(component.toggleIconState.isToggled).toBe(true);
+            });
+        });
+
+        describe('onToggleBlur', () => {
+            it('should set both isFocused and isToggled to false', () => {
+                component.toggleIconState = { isFocused: true, isToggled: true };
+
+                component.onToggleBlur(component.toggleIconState);
+
+                expect(component.toggleIconState.isFocused).toBe(false);
+                expect(component.toggleIconState.isToggled).toBe(false);
+            });
+        });
+
+        describe('Multiple toggle states', () => {
+            it('should maintain independent state for toggleIconState and toggleIconCancelState', () => {
+                component.onToggleFocus(component.toggleIconState);
+                component.onToggleMouseEnter(component.toggleIconCancelState);
+
+                expect(component.toggleIconState.isFocused).toBe(true);
+                expect(component.toggleIconState.isToggled).toBe(true);
+                expect(component.toggleIconCancelState.isFocused).toBe(false);
+                expect(component.toggleIconCancelState.isToggled).toBe(true);
+            });
+        });
+    });
 });
diff --git a/lib/content-services/src/lib/upload/components/file-uploading-list.component.ts b/lib/content-services/src/lib/upload/components/file-uploading-list.component.ts
index d91ca510e1..6e5c46488e 100644
--- a/lib/content-services/src/lib/upload/components/file-uploading-list.component.ts
+++ b/lib/content-services/src/lib/upload/components/file-uploading-list.component.ts
@@ -20,10 +20,11 @@ import { UploadService } from '../../common/services/upload.service';
 import { FileModel, FileUploadStatus } from '../../common/models/file.model';
 
 import { Component, ContentChild, Input, Output, TemplateRef, EventEmitter, inject } from '@angular/core';
+import { NgTemplateOutlet } from '@angular/common';
 
 @Component({
     selector: 'adf-file-uploading-list',
-    imports: [],
+    imports: [NgTemplateOutlet],
     templateUrl: './file-uploading-list.component.html',
     styleUrls: ['./file-uploading-list.component.scss']
 })