diff --git a/src/app/core/components/nav-menu/nav-menu.component.html b/src/app/core/components/nav-menu/nav-menu.component.html index e50105ea9..5b8a45b74 100644 --- a/src/app/core/components/nav-menu/nav-menu.component.html +++ b/src/app/core/components/nav-menu/nav-menu.component.html @@ -1,10 +1,12 @@ diff --git a/src/app/core/components/nav-menu/nav-menu.component.ts b/src/app/core/components/nav-menu/nav-menu.component.ts index e6424ca8f..6474754ba 100644 --- a/src/app/core/components/nav-menu/nav-menu.component.ts +++ b/src/app/core/components/nav-menu/nav-menu.component.ts @@ -1,8 +1,20 @@ -import { Component } from '@angular/core'; -import { RouterLink, RouterLinkActive } from '@angular/router'; -import { NAV_ITEMS } from '@core/constants/nav-items.constant'; +import { Component, computed, inject } from '@angular/core'; +import { + RouterLink, + RouterLinkActive, + Router, + NavigationEnd, + ActivatedRoute, +} from '@angular/router'; +import { + NAV_ITEMS, + PROJECT_MENU_ITEMS, +} from '@core/constants/nav-items.constant'; import { PanelMenuModule } from 'primeng/panelmenu'; import { MenuItem } from 'primeng/api'; +import { toSignal } from '@angular/core/rxjs-interop'; +import { filter, map } from 'rxjs'; +import { NavItem } from '@shared/entities/nav-item.interface'; @Component({ selector: 'osf-nav-menu', @@ -11,19 +23,47 @@ import { MenuItem } from 'primeng/api'; styleUrl: './nav-menu.component.scss', }) export class NavMenuComponent { - navItems = NAV_ITEMS; + readonly #router = inject(Router); + readonly #route = inject(ActivatedRoute); + protected readonly navItems = NAV_ITEMS; + protected readonly myProjectMenuItems = PROJECT_MENU_ITEMS; + protected readonly mainMenuItems = this.navItems.map((item) => + this.#convertToMenuItem(item), + ); + + protected readonly currentRoute = toSignal( + this.#router.events.pipe( + filter((event): event is NavigationEnd => event instanceof NavigationEnd), + map(() => this.#getRouteInfo()), + ), + { + initialValue: this.#getRouteInfo(), + }, + ); + + protected readonly currentProjectId = computed( + () => this.currentRoute().projectId, + ); + protected readonly isProjectRoute = computed(() => !!this.currentProjectId()); + + #convertToMenuItem(item: NavItem): MenuItem { + const currentUrl = this.#router.url; + const isExpanded = item.isCollapsible && currentUrl.startsWith(item.path); - private convertToMenuItem(item: (typeof NAV_ITEMS)[number]): MenuItem { return { label: item.label, icon: item.icon ? `osf-icon-${item.icon}` : '', - expanded: false, + expanded: isExpanded, routerLink: item.isCollapsible ? undefined : item.path, - items: item.items?.map((subItem) => this.convertToMenuItem(subItem)), + items: item.items?.map((subItem) => this.#convertToMenuItem(subItem)), }; } - protected menuItems: MenuItem[] = this.navItems.map((item) => - this.convertToMenuItem(item), - ); + #getRouteInfo() { + const projectId = this.#route.firstChild?.snapshot.params['id'] || null; + const section = + this.#route.firstChild?.firstChild?.snapshot.url[0]?.path || 'overview'; + + return { projectId, section }; + } } diff --git a/src/app/core/constants/nav-items.constant.ts b/src/app/core/constants/nav-items.constant.ts index f60e067f8..d507c73c0 100644 --- a/src/app/core/constants/nav-items.constant.ts +++ b/src/app/core/constants/nav-items.constant.ts @@ -1,4 +1,5 @@ import { NavItem } from '@shared/entities/nav-item.interface'; +import { MenuItem } from 'primeng/api'; export const NAV_ITEMS: NavItem[] = [ { path: '/home', label: 'Home', icon: 'home', useExactMatch: true }, @@ -61,3 +62,17 @@ export const NAV_ITEMS: NavItem[] = [ useExactMatch: true, }, ]; + +export const PROJECT_MENU_ITEMS: MenuItem[] = [ + { + label: 'Project details', + icon: 'osf-icon-my-projects', + expanded: true, + items: [ + { label: 'Overview', routerLink: 'overview' }, + { label: 'Metadata', routerLink: 'metadata' }, + { label: 'Files', routerLink: 'files' }, + { label: 'Registrations', routerLink: 'registrations' }, + ], + }, +]; diff --git a/src/app/shared/components/add-project-form/add-project-form.component.ts b/src/app/shared/components/add-project-form/add-project-form.component.ts index 102e7a8ef..ebe52382f 100644 --- a/src/app/shared/components/add-project-form/add-project-form.component.ts +++ b/src/app/shared/components/add-project-form/add-project-form.component.ts @@ -108,6 +108,8 @@ export class AddProjectFormComponent implements OnInit { this.#store.dispatch( new GetMyProjects(1, MY_PROJECTS_TABLE_PARAMS.rows, {}), ); + + this.selectAllAffiliations(); } selectAllAffiliations(): void { diff --git a/src/assets/icons/source/filter.svg b/src/assets/icons/source/filter.svg index d0e579666..85dd7f4ed 100644 --- a/src/assets/icons/source/filter.svg +++ b/src/assets/icons/source/filter.svg @@ -1,4 +1,5 @@ - - - + + + + diff --git a/src/assets/icons/source/orcid.svg b/src/assets/icons/source/orcid.svg deleted file mode 100644 index f573f34e0..000000000 --- a/src/assets/icons/source/orcid.svg +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - - - -