diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 6d1e015..823f68b 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -7,12 +7,12 @@ import {DialogModule} from 'primeng/dialog';
import {isPlatformBrowser} from '@angular/common';
import {Button} from 'primeng/button';
import {AuthService} from './auth.service';
-import {CookieService} from 'ngx-cookie-service';
+import {Router, RouterOutlet} from '@angular/router';
@Component({
selector: 'app-root',
standalone: true,
- imports: [MenubarModule, FloatLabelModule, ToastModule, DialogModule, Button],
+ imports: [MenubarModule, FloatLabelModule, ToastModule, DialogModule, Button, RouterOutlet],
providers: [
MessageService,
],
@@ -23,17 +23,18 @@ export class AppComponent implements OnInit {
isSessionExpired: boolean = false;
constructor(@Inject(PLATFORM_ID) private platformId: object,
- private authService: AuthService,
- private cookieService: CookieService) {
+ protected authService: AuthService,
+ private router: Router,) {
}
isBrowser(): boolean {
- return isPlatformBrowser(this.platformId);
+ return isPlatformBrowser(this.platformId)
}
setSessionExpiredFalse(): void {
this.isSessionExpired = false;
this.authService.setSessionExpired(false);
+ this.router.navigate(['/logout']);
}
ngOnInit(): void {
diff --git a/src/app/app.config.ts b/src/app/app.config.ts
index a955765..ef61b55 100644
--- a/src/app/app.config.ts
+++ b/src/app/app.config.ts
@@ -1,10 +1,12 @@
import {ApplicationConfig, importProvidersFrom, provideZoneChangeDetection} from '@angular/core';
import {provideRouter} from '@angular/router';
-
import {routes} from './app.routes';
import {provideClientHydration} from '@angular/platform-browser';
import {provideHttpClient, withFetch} from '@angular/common/http';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import {provideAnimationsAsync} from '@angular/platform-browser/animations/async';
+import {providePrimeNG} from 'primeng/config';
+import {myPreset} from './preset'
export const appConfig: ApplicationConfig = {
providers: [
@@ -12,5 +14,14 @@ export const appConfig: ApplicationConfig = {
provideRouter(routes),
provideClientHydration(),
provideHttpClient(withFetch()),
- importProvidersFrom([BrowserAnimationsModule])]
+ provideAnimationsAsync(),
+ providePrimeNG({
+ theme: {
+ preset: myPreset,
+ options: {
+ darkModeSelector: '.my-app-dark' // class css pour activer le dark mode
+ }
+ }
+ }),
+ importProvidersFrom([BrowserAnimationsModule]), provideAnimationsAsync()]
};
diff --git a/src/app/auth.service.ts b/src/app/auth.service.ts
index 8e341bf..3471c95 100644
--- a/src/app/auth.service.ts
+++ b/src/app/auth.service.ts
@@ -1,7 +1,6 @@
-import { Injectable } from '@angular/core';
-import { CookieService } from 'ngx-cookie-service';
-import { Author } from './models/author';
-import { BehaviorSubject } from 'rxjs';
+import {Injectable} from '@angular/core';
+import {Author} from './models/author';
+import {BehaviorSubject} from 'rxjs';
import {DateTime} from 'luxon';
@Injectable({
@@ -11,33 +10,38 @@ export class AuthService {
private sessionExpiredSubject = new BehaviorSubject(false);
sessionExpired$ = this.sessionExpiredSubject.asObservable();
- constructor(private cookieService: CookieService) {
+ constructor() {
this.checkSessionExpiration();
}
isAuthenticated(): boolean {
- return this.cookieService.check("author") &&
- this.cookieService.check("token") &&
- this.cookieService.check("token-expiration-date") &&
- this.cookieService.get("author") !== '' &&
- this.cookieService.get("token-expiration-date") !== '' &&
- this.cookieService.get("token") !== '';
+ return sessionStorage.getItem("author") !== null &&
+ sessionStorage.getItem("token") !== null &&
+ sessionStorage.getItem("token-expiration-date") !== null;
}
- getTokenExpirationDate(): DateTime {
- return DateTime.fromISO(this.cookieService.get("token-expiration-date"));
+ getTokenExpirationDate(): string | null {
+ return sessionStorage.getItem("token-expiration-date");
}
isSessionExpired(): boolean {
- return this.getTokenExpirationDate() < DateTime.now() && this.isAuthenticated();
+ const tokenExpirationDate = this.getTokenExpirationDate();
+ if (tokenExpirationDate) {
+ return DateTime.fromISO(tokenExpirationDate) < DateTime.now() && this.isAuthenticated();
+ }
+ return true
}
- getAuthenticatedAuthor(): Author {
- return JSON.parse(this.cookieService.get('author'));
+ getAuthenticatedAuthor(): Author | null {
+ const authorStr = sessionStorage.getItem('author')
+ if (authorStr) {
+ return JSON.parse(authorStr);
+ }
+ return null;
}
- getAuthenticatedAuthorToken(): string {
- return this.cookieService.get('token');
+ getAuthenticatedAuthorToken(): string | null{
+ return sessionStorage.getItem('token');
}
setSessionExpired(expired: boolean) {
diff --git a/src/app/components/comment-form/comment-form.component.ts b/src/app/components/comment-form/comment-form.component.ts
index 56d2dca..e23278e 100644
--- a/src/app/components/comment-form/comment-form.component.ts
+++ b/src/app/components/comment-form/comment-form.component.ts
@@ -1,21 +1,19 @@
import {Component, EventEmitter, Input, Output} from '@angular/core';
import {FormControl, FormGroup, ReactiveFormsModule, Validators} from '@angular/forms';
-import {InputTextareaModule} from 'primeng/inputtextarea';
import {Button} from 'primeng/button';
import {CommentService} from '../../services/comment.service';
-import {Author} from '../../models/author';
-import {Subscription} from 'rxjs';
+import {Subscription, switchMap} from 'rxjs';
import {Comment} from '../../models/comment';
import {MessageService} from 'primeng/api';
import {NgStyle} from '@angular/common';
import {AuthService} from '../../auth.service';
+import {AuthorService} from '../../services/author.service';
@Component({
selector: 'app-comment-form',
standalone: true,
imports: [
ReactiveFormsModule,
- InputTextareaModule,
Button,
NgStyle
],
@@ -29,25 +27,36 @@ export class CommentFormComponent {
@Input({required: true}) postId: bigint = BigInt(1);
@Output() commentToEmit = new EventEmitter();
subs: Subscription[] = [];
+ createdComment: Comment = {} as Comment;
constructor(private commentService: CommentService,
private messageService: MessageService,
- private authService: AuthService,) {
+ private authService: AuthService,
+ private authorService: AuthorService) {
}
onSubmit() {
- let token: string = this.authService.getAuthenticatedAuthorToken();
- let author: Author = this.authService.getAuthenticatedAuthor();
+ let token = this.authService.getAuthenticatedAuthorToken();
+ let author = this.authService.getAuthenticatedAuthor();
if (this.commentForm.valid && author && token && this.commentForm.value.content) {
// get l'image de profile après avoir créé le commentaire
- this.subs.push(this.commentService.create(this.commentForm.value.content, this.postId, author.id, token).subscribe({
- next: (comment: Comment) => {
- comment.authorId = author.id;
- comment.authorName = author.name;
- comment.profilePicture = author.profilePicture;
- comment.authorRole = author.role;
+ this.subs.push(this.commentService.create(this.commentForm.value.content, this.postId, author.id, token).pipe(
+ switchMap((comment: Comment) => {
+ this.createdComment = { ... this.createdComment } // attention a bien mettre à jour la ref sinon ça casse
+ this.createdComment.authorId = author.id;
+ this.createdComment.content = comment.content;
+ this.createdComment.id = comment.id;
+ this.createdComment.commentDate = comment.commentDate;
+ this.createdComment.authorName = author.name;
+ this.createdComment.authorRole = author.role;
this.commentForm.value.content = "";
- this.commentToEmit.emit(comment);
+ return this.authorService.getAvatar(author?.id)
+ })
+ ).subscribe({
+ next: (profilePicture: string) => {
+ this.createdComment.profilePicture = profilePicture;
+ this.commentForm.value.content = "";
+ this.commentToEmit.emit(this.createdComment);
this.successMessage("Succès", "Commentaire créé avec succès");
},
error: (error) => {
diff --git a/src/app/components/header/header.component.ts b/src/app/components/header/header.component.ts
index 1ff54ca..bce565c 100644
--- a/src/app/components/header/header.component.ts
+++ b/src/app/components/header/header.component.ts
@@ -25,8 +25,9 @@ export class HeaderComponent {
}
private initializeMenu(): void {
- if (!(this.authService.isSessionExpired()) && this.authService.isAuthenticated()) {
- this.actualAuthor = this.authService.getAuthenticatedAuthor();
+ const authenticatedAuthor = this.authService.getAuthenticatedAuthor();
+ if (!(this.authService.isSessionExpired()) && this.authService.isAuthenticated() && authenticatedAuthor) {
+ this.actualAuthor = authenticatedAuthor;
}
if (this.actualAuthor) {
diff --git a/src/app/components/loading/loading.component.css b/src/app/components/loading/loading.component.css
new file mode 100644
index 0000000..22d260e
--- /dev/null
+++ b/src/app/components/loading/loading.component.css
@@ -0,0 +1,24 @@
+div {
+ margin-top: 10em;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+img {
+ animation-name: spin;
+ animation-duration: 2000ms;
+ animation-iteration-count: infinite;
+ animation-timing-function: linear;
+ max-width: 40%;
+ max-height: 40%;
+}
+
+@keyframes spin {
+ from {
+ transform:rotate(0deg);
+ }
+ to {
+ transform:rotate(360deg);
+ }
+}
diff --git a/src/app/components/loading/loading.component.html b/src/app/components/loading/loading.component.html
new file mode 100644
index 0000000..f989d89
--- /dev/null
+++ b/src/app/components/loading/loading.component.html
@@ -0,0 +1,3 @@
+
+
+}
diff --git a/src/app/components/modal/preview-modal/preview-modal.component.ts b/src/app/components/modal/preview-modal/preview-modal.component.ts
new file mode 100644
index 0000000..c446233
--- /dev/null
+++ b/src/app/components/modal/preview-modal/preview-modal.component.ts
@@ -0,0 +1,21 @@
+import {Component, Input} from '@angular/core';
+import {Dialog} from 'primeng/dialog';
+import {PostHomeComponent} from '../../post-home/post-home.component';
+import {Post} from '../../../models/post';
+
+@Component({
+ selector: 'app-preview-modal',
+ standalone: true,
+ imports: [
+ Dialog,
+ PostHomeComponent
+ ],
+ templateUrl: './preview-modal.component.html',
+ styleUrl: './preview-modal.component.css'
+})
+export class PreviewModalComponent {
+ opened: boolean = true;
+ @Input({required: true}) post: Post | undefined;
+ @Input() username: string = '';
+ @Input() profilePicture: string = '';
+}
diff --git a/src/app/components/modal/update-modal/update-modal.component.css b/src/app/components/modal/update-modal/update-modal.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/components/modal/update-modal/update-modal.component.html b/src/app/components/modal/update-modal/update-modal.component.html
new file mode 100644
index 0000000..1f4b39a
--- /dev/null
+++ b/src/app/components/modal/update-modal/update-modal.component.html
@@ -0,0 +1,15 @@
+@if (post) {
+
+
+}
diff --git a/src/app/components/modal/update-modal/update-modal.component.ts b/src/app/components/modal/update-modal/update-modal.component.ts
new file mode 100644
index 0000000..3e55abc
--- /dev/null
+++ b/src/app/components/modal/update-modal/update-modal.component.ts
@@ -0,0 +1,33 @@
+import {Component, EventEmitter, Input, Output} from '@angular/core';
+import {Dialog} from 'primeng/dialog';
+import {PostFormComponent} from '../../post-form/post-form.component';
+import {Post} from '../../../models/post';
+import {AuthService} from '../../../auth.service';
+import {Author} from '../../../models/author';
+
+@Component({
+ selector: 'app-update-modal',
+ standalone: true,
+ imports: [
+ Dialog,
+ PostFormComponent
+ ],
+ templateUrl: './update-modal.component.html',
+ styleUrl: './update-modal.component.css'
+})
+export class UpdateModalComponent {
+ actualAuthor: Author | undefined;
+ opened: boolean = true;
+ @Input({required: true}) post: Post | undefined;
+ @Output() updatedPost: EventEmitter = new EventEmitter();
+
+ constructor(private authService: AuthService) {
+ this.authService.getAuthenticatedAuthor();
+ }
+
+
+ onSubmit(updatedPost: Post) {
+ this.updatedPost.emit(updatedPost);
+ this.opened = false
+ }
+}
diff --git a/src/app/components/post-form/post-form.component.html b/src/app/components/post-form/post-form.component.html
index 0fdaae2..a2eace2 100644
--- a/src/app/components/post-form/post-form.component.html
+++ b/src/app/components/post-form/post-form.component.html
@@ -1,13 +1,20 @@
+ 
+
diff --git a/src/app/components/loading/loading.component.ts b/src/app/components/loading/loading.component.ts
new file mode 100644
index 0000000..0e1870f
--- /dev/null
+++ b/src/app/components/loading/loading.component.ts
@@ -0,0 +1,15 @@
+import { Component } from '@angular/core';
+import {NgOptimizedImage} from '@angular/common';
+
+@Component({
+ selector: 'app-loading',
+ standalone: true,
+ imports: [
+ NgOptimizedImage
+ ],
+ templateUrl: './loading.component.html',
+ styleUrl: './loading.component.css'
+})
+export class LoadingComponent {
+
+}
diff --git a/src/app/components/modal/preview-modal/preview-modal.component.css b/src/app/components/modal/preview-modal/preview-modal.component.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/components/modal/preview-modal/preview-modal.component.html b/src/app/components/modal/preview-modal/preview-modal.component.html
new file mode 100644
index 0000000..5554195
--- /dev/null
+++ b/src/app/components/modal/preview-modal/preview-modal.component.html
@@ -0,0 +1,15 @@
+@if (post) {
+
+