refactor: improve dropdown-breadcrumb and file-uploading-list-row templates for clarity

- Updated dropdown-breadcrumb.component.html to track node IDs instead of nodes for better performance.
- Refactored file-uploading-list-row.component.html to enhance readability by restructuring conditional rendering and simplifying the template logic.
This commit is contained in:
Denys Vuika
2026-02-26 10:51:11 +00:00
parent d170a41894
commit 620580a851
2 changed files with 10 additions and 12 deletions
@@ -24,7 +24,7 @@
role="button"
data-automation-id="dropdown-breadcrumb-path"
aria-labelledby="dropdown-breadcrumb-button">
@for (node of previousNodes; track node) {
@for (node of previousNodes; track node.id) {
<mat-option
(click)="onRoutePathClick(node, $event)"
(onSelectionChange)="onRouteClick(node)"
@@ -1,9 +1,7 @@
<div class="adf-file-uploading-row" [attr.aria-label]="file.name + ' ' + file.status">
@if (mimeType === 'default') {
<mat-icon matListItemIcon class="adf-file-uploading-row__type" adf-icon="insert_drive_file" />
}
@if (mimeType !== 'default') {
} @else {
<mat-icon svgIcon="adf:{{ mimeType }}" aria-hidden="true" />
}
@@ -36,13 +34,13 @@
[attr.aria-label]="'ADF_FILE_UPLOAD.ARIA-LABEL.STOP_FILE_UPLOAD' | translate: { file: file.name }"
class="adf-file-uploading-row__group adf-file-uploading-row__group--toggle"
title="{{ 'ADF_FILE_UPLOAD.BUTTON.STOP_FILE' | translate }}">
@if (!toggleIconState.isToggled) {
<span class="adf-file-uploading-row__status">
{{ file.progress.loaded | adfFileSize }} / {{ file.progress.total | adfFileSize }}
</span>
}
@if (toggleIconState.isToggled) {
<mat-icon class="adf-file-uploading-row__action adf-file-uploading-row__action--cancel" adf-icon="clear" />
} @else {
<span class="adf-file-uploading-row__status">
{{ file.progress.loaded | adfFileSize }} / {{ file.progress.total | adfFileSize }}
</span>
}
</div>
}
@@ -81,11 +79,11 @@
class="adf-file-uploading-row__group"
title="{{ 'ADF_FILE_UPLOAD.BUTTON.STOP_FILE' | translate }}"
[attr.aria-label]="'ADF_FILE_UPLOAD.ARIA-LABEL.STOP_FILE' | translate: { file: file.name }">
@if (!toggleIconCancelState.isToggled) {
<mat-icon class="adf-file-uploading-row__status adf-file-uploading-row__status--pending" adf-icon="schedule" />
}
@if (toggleIconCancelState.isToggled) {
<mat-icon class="adf-file-uploading-row__action adf-file-uploading-row__action--remove" adf-icon="remove_circle" />
} @else {
<mat-icon class="adf-file-uploading-row__status adf-file-uploading-row__status--pending" adf-icon="schedule" />
}
</button>
}