diff options
Diffstat (limited to 'src/DevHive.Angular')
4 files changed, 53 insertions, 4 deletions
diff --git a/src/DevHive.Angular/src/app/components/feed/feed.component.css b/src/DevHive.Angular/src/app/components/feed/feed.component.css index f810e83..7b73533 100644 --- a/src/DevHive.Angular/src/app/components/feed/feed.component.css +++ b/src/DevHive.Angular/src/app/components/feed/feed.component.css @@ -75,6 +75,10 @@ /* Top bar */ +form { + width: 100%; +} + #top-bar { display: flex; width: 98%; diff --git a/src/DevHive.Angular/src/app/components/feed/feed.component.html b/src/DevHive.Angular/src/app/components/feed/feed.component.html index e3c6e83..052f7b3 100644 --- a/src/DevHive.Angular/src/app/components/feed/feed.component.html +++ b/src/DevHive.Angular/src/app/components/feed/feed.component.html @@ -17,7 +17,10 @@ <div id="feed-content"> <nav id="top-bar" class="rounded-border"> <img id="top-bar-profile-pic" class="round-image" [src]="user.imageUrl" alt="" (click)="goToProfile()"> - <input id="top-bar-create-post" type="text" placeholder="What's on your mind?"/> + <form [formGroup]="createPostFormGroup" (ngSubmit)="createPost()"> + <input id="top-bar-create-post" type="text" formControlName="newPostMessage" placeholder="What's on your mind?"/> + <input type="submit" style="display: none" /> + </form> <a id="top-bar-open-chat" href=""> <img src="assets/images/feed/chat-pic.png" alt=""/> </a> diff --git a/src/DevHive.Angular/src/app/components/feed/feed.component.ts b/src/DevHive.Angular/src/app/components/feed/feed.component.ts index f260fd4..a399717 100644 --- a/src/DevHive.Angular/src/app/components/feed/feed.component.ts +++ b/src/DevHive.Angular/src/app/components/feed/feed.component.ts @@ -7,6 +7,8 @@ import { AppConstants } from 'src/app/app-constants.module'; import {HttpErrorResponse} from '@angular/common/http'; import {FeedService} from 'src/app/services/feed.service'; import {Post} from 'src/models/post'; +import {FormBuilder, FormControl, FormGroup} from '@angular/forms'; +import {PostService} from 'src/app/services/post.service'; @Component({ selector: 'app-feed', @@ -19,17 +21,23 @@ export class FeedComponent implements OnInit { public dataArrived = false; public user: User; public posts: Post[] = []; + public createPostFormGroup: FormGroup; - constructor(private _titleService: Title, private _router: Router, private _userService: UserService, private _feedService: FeedService) { + constructor(private _titleService: Title, private _fb: FormBuilder, private _router: Router, private _userService: UserService, private _feedService: FeedService, private _postService: PostService) { this._titleService.setTitle(this._title); } ngOnInit(): void { this.user = this._userService.getDefaultUser(); + const now = new Date(); now.setHours(now.getHours() + 2); // accounting for eastern european timezone this._timeLoaded = now.toISOString(); + this.createPostFormGroup = this._fb.group({ + newPostMessage: new FormControl('') + }); + if (sessionStorage.getItem('UserCred')) { this._userService.getUserFromSessionStorageRequest().subscribe( (res: object) => this.loadFeed(res), @@ -78,4 +86,16 @@ export class FeedComponent implements OnInit { this._userService.logoutUserFromSessionStorage(); this._router.navigate(['/login']); } + + createPost(): void { + const postMessage = this.createPostFormGroup.get('newPostMessage')?.value; + this._postService.createPostFromSessionStorageRequest(postMessage).subscribe( + (result: object) => { + this.createPostFormGroup.patchValue({ + newPostMessage: '' + }); + this.goToProfile(); + } + ); + } } diff --git a/src/DevHive.Angular/src/app/services/post.service.ts b/src/DevHive.Angular/src/app/services/post.service.ts index 4cd96bc..c81aca5 100644 --- a/src/DevHive.Angular/src/app/services/post.service.ts +++ b/src/DevHive.Angular/src/app/services/post.service.ts @@ -1,20 +1,42 @@ -import {HttpClient, HttpParams} from '@angular/common/http'; +import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http'; import {Injectable} from '@angular/core'; import {Guid} from 'guid-typescript'; import {Observable} from 'rxjs'; import {Post} from 'src/models/post'; import {AppConstants} from '../app-constants.module'; +import {UserService} from './user.service'; @Injectable({ providedIn: 'root' }) export class PostService { - constructor(private http: HttpClient) { } + constructor(private http: HttpClient, private _userService: UserService) + { } getDefaultPost(): Post { return new Post(Guid.createEmpty(), 'Gosho', 'Trapov', 'gosho_trapov', 'Your opinion on my idea?', new Date()); } + createPostFromSessionStorageRequest(postMessage: string): Observable<object> { + const token = sessionStorage.getItem('UserCred') ?? ''; + const userId = this._userService.getUserIdFromSessionStorageToken(); + + return this.createPostRequest(userId, token, postMessage); + } + + createPostRequest(userId: Guid, authToken: string, postMessage: string): Observable<object> { + const body = { + message: postMessage, + files: [] + }; + const options = { + params: new HttpParams().set('UserId', userId.toString()), + headers: new HttpHeaders().set('Authorization', 'Bearer ' + authToken) + }; + return this.http.post(AppConstants.API_POST_URL, body, options); + + } + getPostRequest(id: Guid): Observable<object> { const options = { params: new HttpParams().set('Id', id.toString()) |