diff --git a/AMW_angular/io/src/app/resources/resources-page.component.css b/AMW_angular/io/src/app/resources/resources-page.component.css
new file mode 100644
index 000000000..f75f8476d
--- /dev/null
+++ b/AMW_angular/io/src/app/resources/resources-page.component.css
@@ -0,0 +1,9 @@
+.nav-item,
+.nav-link {
+ cursor: pointer;
+}
+
+.nav-link:hover,
+.nav-link.active {
+ font-weight: bold;
+}
diff --git a/AMW_angular/io/src/app/resources/resources-page.component.html b/AMW_angular/io/src/app/resources/resources-page.component.html
index 3c4c8c9c3..b0617c286 100644
--- a/AMW_angular/io/src/app/resources/resources-page.component.html
+++ b/AMW_angular/io/src/app/resources/resources-page.component.html
@@ -11,10 +11,11 @@
Resource types
{{ resourceType.name }}
-
+ >{{ resourceType.name }}
}
@@ -31,27 +32,28 @@ Resource types
- {{ resourceType.name }}
- @if (resourceType.hasChildren) { @if (expandedResourceTypeId === resourceType.id) {
+ @if (resourceType.hasChildren) { @if (isExpanded(resourceType)) {
} @else {
} }
+ {{ resourceType.name }}
- @if (resourceType.hasChildren && expandedResourceTypeId === resourceType.id) {
+ @if (resourceType.hasChildren && isExpanded(resourceType) ) {
@for (child of resourceType.children; track child.name) {
-
{{ child.name }}
- {{ child.name }}
-
}
diff --git a/AMW_angular/io/src/app/resources/resources-page.component.ts b/AMW_angular/io/src/app/resources/resources-page.component.ts
index f4861d0ee..3f543ee10 100644
--- a/AMW_angular/io/src/app/resources/resources-page.component.ts
+++ b/AMW_angular/io/src/app/resources/resources-page.component.ts
@@ -8,6 +8,7 @@ import {
OnDestroy,
WritableSignal,
} from '@angular/core';
+import { NgClass } from '@angular/common';
import { AuthService } from '../auth/auth.service';
import { PageComponent } from '../layout/page/page.component';
import { LoadingIndicatorComponent } from '../shared/elements/loading-indicator.component';
@@ -31,8 +32,9 @@ import { takeUntil } from 'rxjs/operators';
selector: 'app-resources-page',
standalone: true,
changeDetection: ChangeDetectionStrategy.OnPush,
- imports: [PageComponent, LoadingIndicatorComponent, ButtonComponent, IconComponent, ResourcesListComponent],
+ imports: [PageComponent, LoadingIndicatorComponent, ButtonComponent, IconComponent, ResourcesListComponent, NgClass],
templateUrl: './resources-page.component.html',
+ styleUrl: 'resources-page.component.css',
})
export class ResourcesPageComponent implements OnDestroy {
private authService = inject(AuthService);
@@ -50,7 +52,9 @@ export class ResourcesPageComponent implements OnDestroy {
releases: Signal = this.releaseService.allReleases;
isLoading = signal(false);
expandedResourceTypeId: number | null = null;
+ expandedItems: ResourceType[] = [];
selectedResourceType: WritableSignal = signal(null);
+ selection: any;
permissions = computed(() => {
if (this.authService.restrictions().length > 0) {
@@ -75,12 +79,17 @@ export class ResourcesPageComponent implements OnDestroy {
});
toggleChildrenAndOrLoadResourcesList(resourceType: ResourceType): void {
+ this.selection = resourceType;
this.resourceService.setTypeForResourceGroupList(resourceType);
- if (resourceType && resourceType.hasChildren)
- this.expandedResourceTypeId = this.expandedResourceTypeId === resourceType.id ? null : resourceType.id;
+ if (resourceType && resourceType.hasChildren) this.getUpdateExpandedItems(resourceType);
+ this.expandedResourceTypeId = this.expandedResourceTypeId === resourceType.id ? null : resourceType.id;
this.selectedResourceType.set(resourceType);
}
+ isExpanded(resourceType: ResourceType) {
+ return this.expandedItems.find((element) => element.id === resourceType.id);
+ }
+
addResource(resource: any) {
this.resourceService
.createResourceForResourceType(resource)
@@ -131,4 +140,13 @@ export class ResourcesPageComponent implements OnDestroy {
},
});
}
+
+ private getUpdateExpandedItems(resourceType: ResourceType) {
+ const index = this.expandedItems?.findIndex((element: ResourceType) => element.id === resourceType.id);
+ if (index > -1) {
+ this.expandedItems.splice(index, 1);
+ } else {
+ this.expandedItems.push(resourceType);
+ }
+ }
}
diff --git a/AMW_angular/io/src/app/shared/icon/icon.component.css b/AMW_angular/io/src/app/shared/icon/icon.component.css
new file mode 100644
index 000000000..5e14dbedb
--- /dev/null
+++ b/AMW_angular/io/src/app/shared/icon/icon.component.css
@@ -0,0 +1,11 @@
+:host {
+ height: 17px;
+ width: 17px;
+ display: inline-block;
+ vertical-align: middle
+
+}
+
+.icon {
+ vertical-align: unset;
+}
diff --git a/AMW_angular/io/src/app/shared/icon/icon.component.ts b/AMW_angular/io/src/app/shared/icon/icon.component.ts
index 6fde749d9..e397ce658 100644
--- a/AMW_angular/io/src/app/shared/icon/icon.component.ts
+++ b/AMW_angular/io/src/app/shared/icon/icon.component.ts
@@ -2,10 +2,10 @@ import { Component, Input, OnChanges } from '@angular/core';
@Component({
selector: 'app-icon',
- template: `