fix(visualization): address sonar code-smell findings

- Use `globalThis` instead of `window` (S7764) in dispatchAfterPaint.
- Mark `scrollFunction` field as `readonly` (S2933) in explorerTreeLevel.
- Drop redundant `as` assertion in sidebarExplorer.selectors and annotate
  the `.map` callback's return type so the literals stay narrow (S4325).
- Remove `role="img"` on the explorer tree item icon span (S6819) — the
  existing `aria-hidden="true"` already hides it from assistive tech.
- Replace the explorer sort control's div-with-button-role with a real
  `<button>` element and drop the redundant `tabindex="0"` from the
  dropdown `<ul>` (S6819, S6845).
- Replace the rules popover's `<div role="list">` with a real `<ul>`
  containing `<li>` rule rows (S6819).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: 2 people

visualization/app/codeCharta/features/sidebarExplorer/components/explorerSortControl/explorerSortControl.component.html

@@ -1,7 +1,6 @@
 <div class="dropdown dropdown-start w-full px-2 mt-2">
-    <div
-        tabindex="0"
-        role="button"
+    <button
+        type="button"
         class="btn btn-ghost btn-sm w-full justify-between normal-case font-normal"
         [title]="'Sort: ' + currentOption()"
     >
@@ -11,8 +10,8 @@
             <i class="fa text-[10px]" [class.fa-arrow-up]="isAscending()" [class.fa-arrow-down]="!isAscending()"></i>
         </span>
         <i class="fa fa-chevron-down text-[10px] opacity-60"></i>
-    </div>
-    <ul tabindex="0" class="dropdown-content menu bg-base-100 rounded-box z-20 w-full mx-2 p-2 shadow">
+    </button>
+    <ul class="dropdown-content menu bg-base-100 rounded-box z-20 w-full mx-2 p-2 shadow">
         @for (option of sortOptions; track option) {
             <li>
                 <button

visualization/app/codeCharta/features/sidebarExplorer/components/explorerTreeItemIcon/explorerTreeItemIcon.component.html

@@ -1,5 +1,4 @@
 <span
-    role="img"
     [class]="iconClass()"
     [style.color]="iconColor()"
     aria-hidden="true"

visualization/app/codeCharta/features/sidebarExplorer/components/explorerTreeLevel/explorerTreeLevel.component.ts

@@ -129,7 +129,7 @@ export class ExplorerTreeLevelComponent implements OnInit {
         this.isScrollListenerRegistered = false
     }
 
-    private scrollFunction = () => {
+    private readonly scrollFunction = () => {
         this.appStatusStore.setRightClickedNodeData(null)
         this.removeScrollListener()
     }

visualization/app/codeCharta/features/sidebarExplorer/components/rulesPopover/rulesPopover.component.html

@@ -20,10 +20,12 @@
     @if (rules().length === 0) {
         <div class="text-xs opacity-60 px-2 py-3">No rules</div>
     } @else {
-        <div role="list" class="flex flex-col max-h-[60vh] overflow-y-auto">
+        <ul class="flex flex-col max-h-[60vh] overflow-y-auto m-0 p-0 list-none">
             @for (rule of rules(); track rule.item.path) {
-                <cc-rule-row [item]="rule.item" [affectedCount]="rule.affectedCount" [kind]="rule.kind"></cc-rule-row>
+                <li>
+                    <cc-rule-row [item]="rule.item" [affectedCount]="rule.affectedCount" [kind]="rule.kind"></cc-rule-row>
+                </li>
             }
-        </div>
+        </ul>
     }
 </div>

visualization/app/codeCharta/features/sidebarExplorer/selectors/sidebarExplorer.selectors.ts

@@ -91,11 +91,13 @@ const buildRulesWithCount = (blacklist: BlacklistItem[], allLeaves: CodeMapNode[
     }
 
     return rulesWithStats
-        .map(({ item, count }) => ({
-            item,
-            affectedCount: count,
-            kind: (isPatternRule(item.path) ? "RULE" : "MANUAL") as "RULE" | "MANUAL"
-        }))
+        .map(
+            ({ item, count }): RuleWithCount => ({
+                item,
+                affectedCount: count,
+                kind: isPatternRule(item.path) ? "RULE" : "MANUAL"
+            })
+        )
         .sort((a, b) => a.item.path.localeCompare(b.item.path))
 }
 

visualization/app/codeCharta/util/dispatchAfterPaint.ts

@@ -21,7 +21,7 @@ export function dispatchAfterPaint(store: Store<CcState>, action: Action | Actio
     // In jest tests rAF is async via setTimeout — skip the deferral so existing
     // dispatch-assertion tests stay synchronous. The spinner UX only matters at
     // runtime.
-    if (typeof window !== "undefined" && (window as unknown as { __TEST_ENVIRONMENT__?: boolean }).__TEST_ENVIRONMENT__) {
+    if ((globalThis as unknown as { __TEST_ENVIRONMENT__?: boolean }).__TEST_ENVIRONMENT__) {
         for (const a of actions) {
             store.dispatch(a)
         }