diff options
8 files changed, 142 insertions, 14 deletions
diff --git a/src/DevHive.Angular/src/app/app-constants.module.ts b/src/DevHive.Angular/src/app/app-constants.module.ts index 2215abd..7552a5e 100644 --- a/src/DevHive.Angular/src/app/app-constants.module.ts +++ b/src/DevHive.Angular/src/app/app-constants.module.ts @@ -1,8 +1,12 @@ export class AppConstants { public static BASE_API_URL = 'http://localhost:5000/api'; + public static API_USER_URL = AppConstants.BASE_API_URL + '/User'; public static API_USER_LOGIN_URL = AppConstants.API_USER_URL + '/login'; public static API_USER_REGISTER_URL = AppConstants.API_USER_URL + '/register'; + public static API_LANGUAGE_URL = AppConstants.BASE_API_URL + '/Language'; + public static API_TECHNOLOGY_URL = AppConstants.BASE_API_URL + '/Technology'; + public static FALLBACK_PROFILE_ICON = 'assets/images/feed/profile-pic.png'; } diff --git a/src/DevHive.Angular/src/app/components/post/post.component.ts b/src/DevHive.Angular/src/app/components/post/post.component.ts index 4ed42a6..76a4873 100644 --- a/src/DevHive.Angular/src/app/components/post/post.component.ts +++ b/src/DevHive.Angular/src/app/components/post/post.component.ts @@ -22,7 +22,9 @@ export class PostComponent implements OnInit { 'Gosho', 'Trapov', 'gotra@bg.com', - AppConstants.FALLBACK_PROFILE_ICON + AppConstants.FALLBACK_PROFILE_ICON, + new Array(), + new Array() ); this.votesNumber = 23; diff --git a/src/DevHive.Angular/src/app/components/profile/profile.component.html b/src/DevHive.Angular/src/app/components/profile/profile.component.html index d775b46..43d580f 100644 --- a/src/DevHive.Angular/src/app/components/profile/profile.component.html +++ b/src/DevHive.Angular/src/app/components/profile/profile.component.html @@ -21,20 +21,24 @@ </div> <div class="secondary-info rounded-border"> Languages: - <div class="user-language"> - C# + <div *ngFor="let lang of user.languages"> + <div class="user-language"> + {{ lang.name }} + </div> </div> - <div class="user-language"> - TypeScript + <div *ngIf="showNoLangMsg"> + None </div> </div> <div class="secondary-info rounded-border"> Technologies: - <div class="user-technology"> - .NET 5 + <div *ngFor="let tech of user.technologies"> + <div class="user-language"> + {{ tech.name }} + </div> </div> - <div class="user-technology"> - Angular + <div *ngIf="showNoTechMsg"> + None </div> </div> <div id="posts"> diff --git a/src/DevHive.Angular/src/app/components/profile/profile.component.ts b/src/DevHive.Angular/src/app/components/profile/profile.component.ts index 42addfb..5bc1976 100644 --- a/src/DevHive.Angular/src/app/components/profile/profile.component.ts +++ b/src/DevHive.Angular/src/app/components/profile/profile.component.ts @@ -5,6 +5,8 @@ import { User } from 'src/models/identity/user'; import { AppConstants } from 'src/app/app-constants.module'; import {HttpErrorResponse} from '@angular/common/http'; import {Location} from '@angular/common'; +import {LanguageService} from 'src/app/services/language.service'; +import {TechnologyService} from 'src/app/services/technology.service'; @Component({ selector: 'app-profile', @@ -16,8 +18,10 @@ export class ProfileComponent implements OnInit { public loggedInUser = false; public dataArrived = false; public user: User; + public showNoLangMsg = false; + public showNoTechMsg = false; - constructor(private _router: Router, private _userService: UserService, private _location: Location) + constructor(private _router: Router, private _userService: UserService, private _languageService: LanguageService, private _technologyService: TechnologyService, private _location: Location) { } private setDefaultUser(): void { @@ -29,13 +33,62 @@ export class ProfileComponent implements OnInit { this.user = this._userService.getDefaultUser(); this._userService.getUserByUsernameRequest(this._urlUsername).subscribe( - (res: object) => this.finishUserLoading(res), + (res: object) => this.loadLanguages(res), (err: HttpErrorResponse) => { this._router.navigate(['/not-found']); } ); } - private finishUserLoading(res: object): void { + private loadLanguages(res: object): void { Object.assign(this.user, res); + + if (this.user.languages.length > 0) { + // For each language in the user, request it's name and assign it, + // when you finally finish with them, start loading technologies + const lastGuid = this.user.languages[this.user.languages.length - 1].id; + for (const lang of this.user.languages) { + this._languageService.getLanguageRequest(lang.id).subscribe( + (result: object) => { + // this only assigns the response "name" property to language + Object.assign(lang, result); + + if (lastGuid === lang.id) { + this.loadTechnologies(); + } + } + ); + } + } + else { + this.showNoLangMsg = true; + this.loadTechnologies(); + } + } + + private loadTechnologies(): void { + if (this.user.technologies.length > 0) { + // For each language in the user, request it's name and assign it, + // when you finish with them, finally finish user loading + const lastGuid = this.user.technologies[this.user.technologies.length - 1].id; + for (const tech of this.user.technologies) { + this._technologyService.getTechnologyRequest(tech.id).subscribe( + (result: object) => { + // this only assigns the response "name" property to technology + Object.assign(tech, result); + + if (lastGuid === tech.id) { + this.finishUserLoading(); + } + } + ); + } + } + else { + this.showNoTechMsg = true; + this.finishUserLoading(); + } + } + + private finishUserLoading(): void { if (this.user.imageUrl === '') { this.user.imageUrl = AppConstants.FALLBACK_PROFILE_ICON; } diff --git a/src/DevHive.Angular/src/app/services/language.service.ts b/src/DevHive.Angular/src/app/services/language.service.ts new file mode 100644 index 0000000..8613a65 --- /dev/null +++ b/src/DevHive.Angular/src/app/services/language.service.ts @@ -0,0 +1,19 @@ +import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http'; +import {Injectable} from '@angular/core'; +import {Guid} from 'guid-typescript'; +import {Observable} from 'rxjs'; +import {AppConstants} from '../app-constants.module'; + +@Injectable({ + providedIn: 'root' +}) +export class LanguageService { + constructor(private http: HttpClient) { } + + getLanguageRequest(langId: Guid): Observable<object> { + const options = { + params: new HttpParams().set('Id', langId.toString()), + }; + return this.http.get(AppConstants.API_LANGUAGE_URL, options); + } +} diff --git a/src/DevHive.Angular/src/app/services/technology.service.ts b/src/DevHive.Angular/src/app/services/technology.service.ts new file mode 100644 index 0000000..4df0412 --- /dev/null +++ b/src/DevHive.Angular/src/app/services/technology.service.ts @@ -0,0 +1,19 @@ +import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http'; +import {Injectable} from '@angular/core'; +import {Guid} from 'guid-typescript'; +import {Observable} from 'rxjs'; +import {AppConstants} from '../app-constants.module'; + +@Injectable({ + providedIn: 'root' +}) +export class TechnologyService { + constructor(private http: HttpClient) { } + + getTechnologyRequest(techId: Guid): Observable<object> { + const options = { + params: new HttpParams().set('Id', techId.toString()) + }; + return this.http.get(AppConstants.API_TECHNOLOGY_URL, options); + } +} diff --git a/src/DevHive.Angular/src/app/services/user.service.ts b/src/DevHive.Angular/src/app/services/user.service.ts index b8678d7..5b4b63c 100644 --- a/src/DevHive.Angular/src/app/services/user.service.ts +++ b/src/DevHive.Angular/src/app/services/user.service.ts @@ -16,7 +16,7 @@ export class UserService { constructor(private http: HttpClient) { } getDefaultUser(): User { - return new User(Guid.createEmpty(), 'gosho_trapov', 'Gosho', 'Trapov', 'gotra@bg.com', AppConstants.FALLBACK_PROFILE_ICON); + return new User(Guid.createEmpty(), 'gosho_trapov', 'Gosho', 'Trapov', 'gotra@bg.com', AppConstants.FALLBACK_PROFILE_ICON, new Array(), new Array()); } getUserIdFromSessionStorageToken(): Guid { diff --git a/src/DevHive.Angular/src/models/identity/user.ts b/src/DevHive.Angular/src/models/identity/user.ts index 68a14fb..c92ed26 100644 --- a/src/DevHive.Angular/src/models/identity/user.ts +++ b/src/DevHive.Angular/src/models/identity/user.ts @@ -1,5 +1,15 @@ import { Guid } from 'guid-typescript'; +export class Language { + public id: Guid; + public name: string; +} + +export class Technology { + public id: Guid; + public name: string; +} + export class User { private _id : Guid; private _lastName : string; @@ -7,14 +17,17 @@ export class User { private _userName : string; private _email: string; private _imageUrl : string; + private _languages: Language[]; + private _technologies: Technology[]; - constructor(id: Guid, userName: string, firstName: string, lastName: string, email: string, imageUrl: string) { + constructor(id: Guid, userName: string, firstName: string, lastName: string, email: string, imageUrl: string, languages: Language[], technologies: Technology[]) { this.id = id; this.userName = userName; this.firstName = firstName; this.lastName = lastName; this.email = email; this.imageUrl = imageUrl; + this.technologies = technologies; } public get id(): Guid { @@ -58,4 +71,18 @@ export class User { public set imageUrl(v: string) { this._imageUrl = v; } + + public get languages(): Language[] { + return this._languages; + } + public set languages(v: Language[]) { + this._languages = v; + } + + public get technologies(): Technology[] { + return this._technologies; + } + public set technologies(v: Technology[]) { + this._technologies = v; + } } |