From 7c199795f9be8a562b6a0e5991b45e5778fb79e6 Mon Sep 17 00:00:00 2001 From: Mason Payne Date: Sat, 23 Mar 2019 23:26:17 -0600 Subject: [PATCH] add basic profile put request use purple as main color --- src/app/User.ts | 2 +- src/app/app.module.ts | 3 +- .../components/sidebar/sidebar.component.ts | 8 --- .../admin-layout/admin-layout.component.html | 2 +- .../admin-layout/admin-layout.component.ts | 21 +++++- .../admin-layout/admin-layout.module.ts | 1 + src/app/profile.service.ts | 9 +++ .../user-profile/user-profile.component.html | 71 ++++++++++--------- .../user-profile/user-profile.component.ts | 38 +++++++++- 9 files changed, 110 insertions(+), 45 deletions(-) diff --git a/src/app/User.ts b/src/app/User.ts index 0e8ccb3..b5072ec 100644 --- a/src/app/User.ts +++ b/src/app/User.ts @@ -24,7 +24,7 @@ interface Claims { interface User { claims: Claims; - customers: string[]; + customers?: string[]; } interface Address { diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 3968bb5..6bf16ce 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,6 +1,6 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { NgModule } from '@angular/core'; -import { FormsModule } from '@angular/forms'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; import { HttpClientModule } from '@angular/common/http'; import { RouterModule } from '@angular/router'; @@ -35,6 +35,7 @@ import { AdminLayoutComponent } from './layouts/admin-layout/admin-layout.compon imports: [ BrowserAnimationsModule, FormsModule, + ReactiveFormsModule, HttpClientModule, ComponentsModule, RouterModule, diff --git a/src/app/components/sidebar/sidebar.component.ts b/src/app/components/sidebar/sidebar.component.ts index 6845476..096438b 100644 --- a/src/app/components/sidebar/sidebar.component.ts +++ b/src/app/components/sidebar/sidebar.component.ts @@ -89,14 +89,6 @@ export class SidebarComponent implements OnInit { appModulesService.showTestData.subscribe((newValue: boolean) => { this.showTestData = newValue; }); - - profileService.currentUser().subscribe((user) => { - console.log(user); - }); - - profileService.currentUser().subscribe((user) => { - console.log(user); - }); } ngOnInit() { diff --git a/src/app/layouts/admin-layout/admin-layout.component.html b/src/app/layouts/admin-layout/admin-layout.component.html index 7d7b1bf..6b4e519 100644 --- a/src/app/layouts/admin-layout/admin-layout.component.html +++ b/src/app/layouts/admin-layout/admin-layout.component.html @@ -1,5 +1,5 @@
-
+
diff --git a/src/app/layouts/admin-layout/admin-layout.component.ts b/src/app/layouts/admin-layout/admin-layout.component.ts index 017f33b..980d9c1 100644 --- a/src/app/layouts/admin-layout/admin-layout.component.ts +++ b/src/app/layouts/admin-layout/admin-layout.component.ts @@ -6,6 +6,16 @@ import { Router, NavigationEnd, NavigationStart } from '@angular/router'; import { Subscription } from 'rxjs/Subscription'; import PerfectScrollbar from 'perfect-scrollbar'; +const COLORS = [ + `danger`, + `purple`, + `azure`, + `green`, + `orange`, + `rose`, + `white`, +]; + @Component({ selector: 'app-admin-layout', templateUrl: './admin-layout.component.html', @@ -15,8 +25,17 @@ export class AdminLayoutComponent implements OnInit { private _router: Subscription; private lastPoppedUrl: string; private yScrollStack: number[] = []; + private colorIndex: number = 1; + public currentColor: string = COLORS[this.colorIndex]; - constructor( public location: Location, private router: Router) {} + constructor( public location: Location, private router: Router) { + // setInterval(() => { + // this.colorIndex = this.colorIndex + 1; + // if (this.colorIndex > COLORS.length - 1) this.colorIndex = 0; + // this.currentColor = COLORS[this.colorIndex]; + // }, 3000); + + } ngOnInit() { const isWindows = navigator.platform.indexOf('Win') > -1 ? true : false; diff --git a/src/app/layouts/admin-layout/admin-layout.module.ts b/src/app/layouts/admin-layout/admin-layout.module.ts index 84ac423..e97f242 100644 --- a/src/app/layouts/admin-layout/admin-layout.module.ts +++ b/src/app/layouts/admin-layout/admin-layout.module.ts @@ -33,6 +33,7 @@ import { CommonModule, RouterModule.forChild(AdminLayoutRoutes), FormsModule, + ReactiveFormsModule, MatButtonModule, MatRippleModule, MatFormFieldModule, diff --git a/src/app/profile.service.ts b/src/app/profile.service.ts index eccdfca..79a944c 100644 --- a/src/app/profile.service.ts +++ b/src/app/profile.service.ts @@ -25,6 +25,10 @@ export class ProfileService { return this.uberCache.getRequest(this.requestCurrentUser.bind(this), `/api/v1/profile/events`, 'userUpdated'); } + public updateCurrentUser(newUserInfo: User): Observable { + return this.http.put('/api/v1/profile/me', newUserInfo).pipe(catchError(this.handleError)); + } + private handleError(error: HttpErrorResponse) { if (error.error instanceof ErrorEvent) { // client or network error @@ -46,3 +50,8 @@ interface UserResponse { status: string; user: User } + +interface RequestStatus { + status: string; + eventId: string; +} diff --git a/src/app/user-profile/user-profile.component.html b/src/app/user-profile/user-profile.component.html index 8099050..f69f469 100644 --- a/src/app/user-profile/user-profile.component.html +++ b/src/app/user-profile/user-profile.component.html @@ -3,12 +3,12 @@
-
+

Edit Profile

Complete your profile

-
+
@@ -17,56 +17,63 @@
- +
- +
- +
- +
-
-
- - - -
-
-
-
- - - -
-
- - - -
-
- - - -
+
+
+
+ + + +
+
+
+
+ + + +
+
+ + + +
+
+ + + +
+
+ + + +
+
- +
- +
@@ -96,7 +103,7 @@

Don't be scared of the truth because we need to restart the human foundation in truth And I love you like Kanye loves Kanye I love Rick Owens’ bed design but the back is...

- Follow + Follow
diff --git a/src/app/user-profile/user-profile.component.ts b/src/app/user-profile/user-profile.component.ts index bdc2bb0..48e76fa 100644 --- a/src/app/user-profile/user-profile.component.ts +++ b/src/app/user-profile/user-profile.component.ts @@ -1,4 +1,9 @@ import { Component, OnInit } from '@angular/core'; +import { FormGroup, FormControl } from '@angular/forms'; +import { Observable } from 'rxjs'; +import { take } from 'rxjs/operators'; +import { ProfileService } from '../profile.service'; +import { User } from '../User'; @Component({ selector: 'app-user-profile', @@ -6,10 +11,41 @@ import { Component, OnInit } from '@angular/core'; styleUrls: ['./user-profile.component.css'] }) export class UserProfileComponent implements OnInit { + private _currentUser: Observable; + public profileForm: FormGroup = new FormGroup({ + given_name: new FormControl(''), + family_name: new FormControl(''), + middle_name: new FormControl(''), + nickname: new FormControl(''), + preferred_username: new FormControl(''), + birthdate: new FormControl(''), + gender: new FormControl(''), + phone_number: new FormControl(''), + website: new FormControl(''), + address: new FormGroup({ + street_address: new FormControl(''), + locality: new FormControl(''), + region: new FormControl(''), + postal_code: new FormControl(''), + country: new FormControl('') + }) + }); - constructor() { } + + constructor( + private profileService: ProfileService + ) { } ngOnInit() { + this._currentUser = this.profileService.currentUser(); + this.profileService.currentUser().pipe(take(1)).subscribe((user: User) => { + if (user) { + this.profileForm.patchValue(user.claims); + } + }); } + submitUpdatedUserInfo() { + this.profileService.updateCurrentUser({claims: this.profileForm.value}).subscribe(); + } }