diff --git a/frontend/src/app/projects/project-overview/project-overview.component.html b/frontend/src/app/projects/project-overview/project-overview.component.html index a05ed2d9a..f96e99993 100644 --- a/frontend/src/app/projects/project-overview/project-overview.component.html +++ b/frontend/src/app/projects/project-overview/project-overview.component.html @@ -16,10 +16,19 @@ search - - Projects - Trainings - +
+ + Projects + Trainings + + +
+ + + Internal + Private + +
diff --git a/frontend/src/app/projects/project-overview/project-overview.component.ts b/frontend/src/app/projects/project-overview/project-overview.component.ts index 45f8fb729..ecf85e6a2 100644 --- a/frontend/src/app/projects/project-overview/project-overview.component.ts +++ b/frontend/src/app/projects/project-overview/project-overview.component.ts @@ -12,6 +12,7 @@ import { } from '@angular/forms'; import { MatChipsModule } from '@angular/material/chips'; import { MatRipple } from '@angular/material/core'; +import { MatDivider } from '@angular/material/divider'; import { MatFormField, MatLabel, @@ -45,12 +46,14 @@ import { ProjectWrapperService } from '../service/project.service'; ReactiveFormsModule, FormsModule, MatChipsModule, + MatDivider, ], }) export class ProjectOverviewComponent implements OnInit { form = new FormGroup({ search: new FormControl(''), projectType: new FormControl(null), + projectVisibility: new FormControl(null), }); public readonly filteredProjects$ = this.form.valueChanges.pipe( startWith(this.form.value), @@ -58,11 +61,16 @@ export class ProjectOverviewComponent implements OnInit { this.searchAndSortProjects( query.search!, query?.projectType ?? undefined, + query?.projectVisibility ?? undefined, ), ), ); - searchAndSortProjects(query: string, projectType?: string) { + searchAndSortProjects( + query: string, + projectType?: string, + projectVisibility?: string, + ) { return this.projectService.projects$.pipe( map((projects) => projects?.filter((project) => { @@ -72,6 +80,14 @@ export class ProjectOverviewComponent implements OnInit { return true; }), ), + map((projects) => + projects?.filter((project) => { + if (projectVisibility) { + return project.visibility === projectVisibility; + } + return true; + }), + ), map((projects) => projects?.filter((project) => project.name.toLocaleLowerCase().includes(query.toLocaleLowerCase()),