From f5d0fac8007adb234bb84922b25e63589c08d983 Mon Sep 17 00:00:00 2001 From: Ward Bell Date: Sun, 16 Apr 2017 16:27:13 -0700 Subject: [PATCH] feat(aio): about/contributor page rebased and tweaked --- aio/content/marketing/contributors.json | 2 +- .../contributor/contributor-list.component.ts | 42 +++++++++++++------ .../contributor/contributor.component.ts | 2 +- .../contributor/contributor.service.spec.ts | 38 ++++++++++------- .../contributor/contributor.service.ts | 2 +- 5 files changed, 56 insertions(+), 30 deletions(-) diff --git a/aio/content/marketing/contributors.json b/aio/content/marketing/contributors.json index b05d14b9aa..051708c1c6 100644 --- a/aio/content/marketing/contributors.json +++ b/aio/content/marketing/contributors.json @@ -68,7 +68,7 @@ "twitter": "ThomasBurleson", "website": "http://www.solutionOptimist.com", "bio": "AngularJS Material and @angular/flex-layout Team Lead. Thomas joined the core team in 2014. He leads a team of developers working on UX components for AngularJS.", - "group": "Lead" + "group": "Angular" }, "stephenfluin": { "name": "Stephen Fluin", diff --git a/aio/src/app/embedded/contributor/contributor-list.component.ts b/aio/src/app/embedded/contributor/contributor-list.component.ts index 31a90d2227..c8fbacde24 100644 --- a/aio/src/app/embedded/contributor/contributor-list.component.ts +++ b/aio/src/app/embedded/contributor/contributor-list.component.ts @@ -1,22 +1,40 @@ -import { Component } from '@angular/core'; - -import { Observable } from 'rxjs/Observable'; - +import { Component, OnInit } from '@angular/core'; import { ContributorGroup } from './contributors.model'; import { ContributorService } from './contributor.service'; @Component({ - selector: 'aio-contributor-list', + selector: `aio-contributor-list`, template: ` -
-

{{group.name}}

- +
+ {{name}} +
+
+
+ +
` }) -export class ContributorListComponent { - groups: Observable; +export class ContributorListComponent implements OnInit { + private groups: ContributorGroup[]; + groupNames: string[]; + selectedGroup: ContributorGroup; - constructor(private contributorService: ContributorService) { - this.groups = this.contributorService.contributors; + constructor(private contributorService: ContributorService) { } + + ngOnInit() { + // no need to unsubscribe because `contributors` completes + this.contributorService.contributors + .subscribe(grps => { + this.groups = grps; + this.groupNames = grps.map(g => g.name); + this.selectGroup(grps[0].name); + }); + } + + selectGroup(name) { + this.selectedGroup = this.groups.find(g => g.name === name); } } diff --git a/aio/src/app/embedded/contributor/contributor.component.ts b/aio/src/app/embedded/contributor/contributor.component.ts index 964dcba7c9..88eb375801 100644 --- a/aio/src/app/embedded/contributor/contributor.component.ts +++ b/aio/src/app/embedded/contributor/contributor.component.ts @@ -22,7 +22,7 @@ import { Contributor } from './contributors.model';
- View Bio + View Bio
diff --git a/aio/src/app/embedded/contributor/contributor.service.spec.ts b/aio/src/app/embedded/contributor/contributor.service.spec.ts index 75bc5d3b7c..9a7b7fdeee 100644 --- a/aio/src/app/embedded/contributor/contributor.service.spec.ts +++ b/aio/src/app/embedded/contributor/contributor.service.spec.ts @@ -56,15 +56,15 @@ describe('ContributorService', () => { }); it('should reshape the contributor json to expected result', () => { - const groupNames = contribs.map(g => g.name); - expect(groupNames).toEqual(['Lead', 'Google', 'Community']); + const groupNames = contribs.map(g => g.name).join(','); + expect(groupNames).toEqual('Angular,Community'); }); - it('should have expected "Lead" contribs in order', () => { - const leads = contribs[0]; - const actualLeadNames = leads.contributors.map(l => l.name).join(','); - const expectedLeadNames = [testData.igor, testData.misko, testData.naomi].map(l => l.name).join(','); - expect(actualLeadNames).toEqual(expectedLeadNames); + it('should have expected "Community" contribs in order', () => { + const community = contribs[1]; + const actualAngularNames = community.contributors.map(l => l.name).join(','); + const expectedAngularNames = [testData.jeffcross, testData.kapunahelewong].map(l => l.name).join(','); + expect(actualAngularNames).toEqual(expectedAngularNames); }); }); @@ -74,29 +74,37 @@ describe('ContributorService', () => { function getTestContribs() { // tslint:disable:quotemark return { + "kapunahelewong": { + "name": "Kapunahele Wong", + "picture": "kapunahelewong.jpg", + "website": " https://github.com/kapunahelewong", + "twitter": "kapunahele", + "bio": "Kapunahele is a front-end developer and contributor to angular.io", + "group": "Community" + }, "misko": { "name": "Miško Hevery", "picture": "misko.jpg", "twitter": "mhevery", "website": "http://misko.hevery.com", "bio": "Miško Hevery is the creator of AngularJS framework.", - "group": "Lead" + "group": "Angular" }, "igor": { "name": "Igor Minar", "picture": "igor-minar.jpg", "twitter": "IgorMinar", - "website": "https://google.com/+IgorMinar", - "bio": "Igor is a software engineer at Google.", - "group": "Lead" + "website": "https://Angular.com/+IgorMinar", + "bio": "Igor is a software engineer at Angular.", + "group": "Angular" }, "kara": { "name": "Kara Erickson", "picture": "kara-erickson.jpg", "twitter": "karaforthewin", "website": "https://github.com/kara", - "bio": "Kara is a software engineer on the Angular team at Google and a co-organizer of the Angular-SF Meetup. ", - "group": "Google" + "bio": "Kara is a software engineer on the Angular team at Angular and a co-organizer of the Angular-SF Meetup. ", + "group": "Angular" }, "jeffcross": { "name": "Jeff Cross", @@ -110,9 +118,9 @@ function getTestContribs() { "name": "Naomi Black", "picture": "naomi.jpg", "twitter": "naomitraveller", - "website": "http://google.com/+NaomiBlack", + "website": "http://Angular.com/+NaomiBlack", "bio": "Naomi is Angular's TPM generalist and jack-of-all-trades.", - "group": "Lead" + "group": "Angular" } }; } diff --git a/aio/src/app/embedded/contributor/contributor.service.ts b/aio/src/app/embedded/contributor/contributor.service.ts index ae060cf4ac..40de0a9fda 100644 --- a/aio/src/app/embedded/contributor/contributor.service.ts +++ b/aio/src/app/embedded/contributor/contributor.service.ts @@ -9,7 +9,7 @@ import { Logger } from 'app/shared/logger.service'; import { Contributor, ContributorGroup } from './contributors.model'; const contributorsPath = 'content/contributors.json'; -const knownGroups = ['Lead', 'Google', 'Community']; +const knownGroups = ['Angular', 'Community']; @Injectable() export class ContributorService {