Filter pipe + fixes

website/src/app/consts/bios.const.ts

@@ -45,7 +45,7 @@ export const people: Person[] =[
 {'name': 'Mahak Bindal', type: "masters",'bio': 'Mahak graduated in 2023, completing her undergraduate degree in Computer Science in May, and her MEng in December. She worked on CAT API, helping build a Docker image to run MOVES on Linux. Now, she works at Bloomberg as a Software Engineer.', 'title': 'MEng Student', 'image': imageDir + 'Mahak Bindal Photo - Mahak Bindal.JPG', 'role': 'Developer for CAT', 'team': 'CAT', 'yearIfPastMember': 2023, 'linkedinUrl': 'https://www.linkedin.com/in/mahakbindal/'},
 {'name': 'Carl Closs', type: "staff",'bio': 'Carl is the first staff developer in the lab, being brought on in 2022. They are one of the key contributors to the PPS project. Their skills include data analysis in (geo)pandas, Python in general, and MOVES wrangling.', 'title': 'Applications Programmer III', 'image': imageDir + 'headshot - Carl Closs.png', 'role': 'Staff Developer', 'team': 'uTech', 'yearIfPastMember': 2022, 'email': 'cjc384@cornell.edu', 'githubUrl': 'https://github.com/ccloss65536'},
 {'name': 'Megh Khaire', type: "masters",'bio': 'Megh is one of the backend developers at UTech, currently working on creating the UTech Engine database and API server.', 'title': 'Meng', 'image': imageDir + 'photo - Megh Khaire.jpg', 'role': 'Backend Developer', 'team': 'uTech', 'yearIfPastMember': 2023, 'linkedinUrl': 'https://www.linkedin.com/in/megh-khaire', 'githubUrl': 'https://github.com/megh-khaire/'},
-{'name': 'Dr. Cafer Avcı', type: "postdoc", 'bio': 'Cafer is a research associate in the Civil & Environmental Engineering Department. Holding PhD in computer science, he has expertise in software development, robo-taxis, transportation modeling, and traffic & vehicle simulation. He possesses extensive R&D experience spanning his own projects, international collaborations, industrial experience, and involvement with start-ups. Currently, he is leading the uTECH development.', 'title': 'Research Associate', 'image': "../../../assets/headshots/cafer1 - Cafer Avcı.jpg", 'team': 'uTech', 'yearIfPastMember': 2023, 'linkedinUrl': 'https://linkedin.com/in/cafer-avci', 'websiteUrl': 'https://caferavci.com/'},
+{'name': 'Dr. Cafer Avcı', type: "postdoc", 'bio': 'Cafer is a research associate in the Civil & Environmental Engineering Department. Holding PhD in computer science, he has expertise in software development, robo-taxis, transportation modeling, and traffic & vehicle simulation. He possesses extensive R&D experience spanning his own projects, international collaborations, industrial experience, and involvement with start-ups. Currently, he is leading the uTECH development.', 'title': 'Research Associate', 'image': "../../../assets/headshots/cafer.jpg", 'team': 'uTech', 'yearIfPastMember': 2023, 'linkedinUrl': 'https://linkedin.com/in/cafer-avci', 'websiteUrl': 'https://caferavci.com/'},
 {'name': 'Yizhou Wang', type: "masters",'bio': "Yizhou Wang is an urban planner deeply committed to fostering sustainable communities through the integration of data insights. With a Master's from Cornell University and a Bachelor's from Xi’an Jiaotong-Liverpool University, she specializes in GIS analysis, policy development, climate resilience, and transportation planning. Her professional journey has included intensive studies on urban density dynamics and contributing to pioneering research in climate resilience. Additionally, her experience as a real estate and transportation data analyst has enabled her to devise innovative solutions to complex urban challenges.", 'title': 'Master of Regional Planning', 'image': imageDir + '证件 - Yizhou Wang.jpg', 'team': 'uTech', 'yearIfPastMember': 2024, 'linkedinUrl': 'https://www.linkedin.com/in/yizhou-wang-974a111ba/', 'email': 'yw2552@cornell.edu', 'githubUrl': 'https://github.com/YizhouWang19'},
 {'name': 'Carmel Fiscko', type: "postdoc",'bio': 'Carmel Fiscko is an Ezra Systems Postdoctoral Associate at Cornell University working with Professors Francesca Parise and Oliver Gao. She earned her PhD in Electrical and Computer Engineering at Carnegie Mellon University in 2023 advised by Professors Soummya Kar and Bruno Sinopoli, where she also received her MS in 2019. She received her BS Cum Laude in Electrical Engineering in 2017 from the University of California at San Diego. She was selected as a 2019 National Science Foundation Graduate Research Fellow, 2022 iREDEFINE Fellow, and 2020 Hsu Chang Memorial Fellow in ECE. Her research focuses in understanding agent decision-making processes, with broader interests in multi-agent reinforcement learning, game theory, optimization, and control.', 'title': 'Ezra Systems Postdoctoral Associate', 'image': imageDir + 'cf - Carmel Fiscko.png', 'yearIfPastMember': 2024, 'websiteUrl': 'https://sites.coecis.cornell.edu/cfiscko/', 'email': 'cfiscko@cornell.edu'},
 {'name': 'Ricky Takkar', type: "masters",'bio': 'Ricky Takkar is a Systems PhD student whose research focuses on identifying aspects of complex sociotechnical problems that can be tackled through technical means, especially those tied to computer science. His current project involves enhancing traceability in buyer-driven commodity chains based on novel system invariants. He is designing specifications to satisfy these invariants using a combination of blockchain technology, including smart contracts, and human intervention. Ricky holds a BS in Computer Engineering from Syracuse University.', 'title': 'PhD Student', 'image': imageDir + '1714678434.827008 - Ricky Takkar.JPG', 'linkedinUrl': 'https://www.linkedin.com/in/rt~/', 'websiteUrl': 'https://rickytakkar.com/'},

website/src/app/pages/bios/bios.component.html

@@ -4,7 +4,16 @@
  <input matInput type="text" [(ngModel)]="searchValue" (input)="onSearch(searchValue)" placeholder="Search for a name...">
  </mat-form-field>
  <h1>Lab Members</h1>
+ <h2>Core Team</h2>
  <div class="card-container">
- <app-bio-card *ngFor="let person of filteredPeople" [person]="person"/>
+ <app-bio-card *ngFor="let person of filteredPeople | filterByType: ['postdoc', 'pi', 'staff']" [person]="person"/>
+ </div>
+ <h2>PhD Students</h2>
+ <div class="card-container">
+ <app-bio-card *ngFor="let person of filteredPeople | filterByType: ['phd']" [person]="person"/>
+ </div>
+ <h2>Master's Students</h2>
+ <div class="card-container">
+ <app-bio-card *ngFor="let person of filteredPeople | filterByType: ['masters']" [person]="person"/>
  </div>
 </div>

website/src/app/pages/bios/bios.component.ts

@@ -1,8 +1,8 @@
 import { Component } from '@angular/core';
 import { people } from 'src/app/consts/bios.const';
+import { FilterByTypePipe } from 'src/app/pipes/filter-by-type.pipe';
 import { Person } from 'src/app/types/Person.type';
 
-
 @Component({
  selector: 'app-bios',
  templateUrl: './bios.component.html',
@@ -12,7 +12,22 @@ export class BiosComponent {
 
  imageDir = '../../assets/headshots/';
  public searchValue = ""
+
+
+ getLastName(person: Person): string {
+ const nameParts = person.name.split(' ');
+ return nameParts[nameParts.length - 1];
+ }
+
+ sortedPeople = people.sort((a, b) => {
+ const lastNameA = this.getLastName(a).toLowerCase(); // Convert to lowercase for case-insensitive comparison
+ const lastNameB = this.getLastName(b).toLowerCase(); // Convert to lowercase for case-insensitive comparison
+ if (lastNameA < lastNameB) return -1;
+ if (lastNameA > lastNameB) return 1;
+ return 0;
+ });
 
+ filteredPeople = this.sortedPeople
 
  onSearch(searchTerm: string) {
  let tempPeople = people;
@@ -30,6 +45,6 @@ export class BiosComponent {
  }
 
 
-filteredPeople = people
+
 
 }

website/src/app/pages/bios/bios.module.ts

@@ -5,11 +5,12 @@ import { ComponentsModule } from 'src/app/components/components.module';
 import {MatInputModule} from '@angular/material/input';
 import {MatIconModule} from '@angular/material/icon';
 import { FormsModule } from '@angular/forms'; 
+import { FilterByTypePipe } from 'src/app/pipes/filter-by-type.pipe';
 
 
 
 @NgModule({
- declarations: [BiosComponent],
+ declarations: [BiosComponent, FilterByTypePipe],
  imports: [CommonModule, ComponentsModule, MatInputModule, MatIconModule, FormsModule],
  exports: [BiosComponent],
 })

website/src/app/pipes/filter-by-type.pipe.ts

@@ -0,0 +1,11 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { Person } from '../types/Person.type';
+
+@Pipe({
+ name: 'filterByType'
+})
+export class FilterByTypePipe implements PipeTransform {
+ transform(people: Person[], types: string[]): Person[] {
+ return people.filter(person => types.includes(person.type));
+}
+}