patch test Signal use
This commit is contained in:
@@ -2,11 +2,11 @@
|
|||||||
class="relative flex h-[calc(100vh-2rem)] w-full max-w-[20rem] flex-col rounded-xl bg-white bg-clip-border p-4 text-gray-700 shadow-xl shadow-blue-gray-900/5">
|
class="relative flex h-[calc(100vh-2rem)] w-full max-w-[20rem] flex-col rounded-xl bg-white bg-clip-border p-4 text-gray-700 shadow-xl shadow-blue-gray-900/5">
|
||||||
<div routerLink="/" class="p-4 mb-2">
|
<div routerLink="/" class="p-4 mb-2">
|
||||||
<h5 class="block cursor-pointer font-sans text-xl antialiased font-semibold leading-snug tracking-normal text-blue-gray-900">
|
<h5 class="block cursor-pointer font-sans text-xl antialiased font-semibold leading-snug tracking-normal text-blue-gray-900">
|
||||||
YouVideo {{ (user$ | async)?.id }}
|
YouVideo
|
||||||
</h5>
|
</h5>
|
||||||
</div>
|
</div>
|
||||||
<nav class="flex min-w-[240px] flex-col gap-1 p-2 font-sans text-base font-normal text-blue-gray-700">
|
<nav class="flex min-w-[240px] flex-col gap-1 p-2 font-sans text-base font-normal text-blue-gray-700">
|
||||||
<div *ngIf="(user$ | async)?.id" class="relative block w-full">
|
<div *ngIf="user.id !== 0" class="relative block w-full">
|
||||||
<div role="button"
|
<div role="button"
|
||||||
class="flex items-center w-full p-0 leading-tight transition-all rounded-lg outline-none bg-blue-gray-50/50 text-start text-blue-gray-700 hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-blue-gray-900 focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-blue-gray-900 active:bg-blue-gray-50 active:bg-opacity-80 active:text-blue-gray-900">
|
class="flex items-center w-full p-0 leading-tight transition-all rounded-lg outline-none bg-blue-gray-50/50 text-start text-blue-gray-700 hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-blue-gray-900 focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-blue-gray-900 active:bg-blue-gray-50 active:bg-opacity-80 active:text-blue-gray-900">
|
||||||
<button type="button"
|
<button type="button"
|
||||||
@@ -51,7 +51,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="(user$ | async)?.id" routerLink="/login" role="button"
|
<div *ngIf="user.id !== 0" routerLink="/login" role="button"
|
||||||
class="flex cursor-pointer items-center w-full p-3 leading-tight transition-all rounded-lg outline-none text-start hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-blue-gray-900 focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-blue-gray-900 active:bg-blue-gray-50 active:bg-opacity-80 active:text-blue-gray-900">
|
class="flex cursor-pointer items-center w-full p-3 leading-tight transition-all rounded-lg outline-none text-start hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-blue-gray-900 focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-blue-gray-900 active:bg-blue-gray-50 active:bg-opacity-80 active:text-blue-gray-900">
|
||||||
<div class="grid mr-4 place-items-center">
|
<div class="grid mr-4 place-items-center">
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
|
||||||
@@ -63,7 +63,7 @@
|
|||||||
</div>
|
</div>
|
||||||
Connexion/Inscription
|
Connexion/Inscription
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="(user$ | async)?.id" routerLink="/p" role="button"
|
<div *ngIf="user.id !== 0" routerLink="/p" role="button"
|
||||||
class="flex cursor-pointer items-center w-full p-3 leading-tight transition-all rounded-lg outline-none text-start hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-blue-gray-900 focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-blue-gray-900 active:bg-blue-gray-50 active:bg-opacity-80 active:text-blue-gray-900">
|
class="flex cursor-pointer items-center w-full p-3 leading-tight transition-all rounded-lg outline-none text-start hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-blue-gray-900 focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-blue-gray-900 active:bg-blue-gray-50 active:bg-opacity-80 active:text-blue-gray-900">
|
||||||
<div class="grid mr-4 place-items-center">
|
<div class="grid mr-4 place-items-center">
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
|
||||||
@@ -75,7 +75,7 @@
|
|||||||
</div>
|
</div>
|
||||||
Profile
|
Profile
|
||||||
</div>
|
</div>
|
||||||
<div *ngIf="(user$ | async)?.id" (click)="logout()" role="button"
|
<div *ngIf="user.id !== 0" (click)="logout()" role="button"
|
||||||
class="flex cursor-pointer items-center w-full p-3 leading-tight transition-all rounded-lg outline-none text-start hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-blue-gray-900 focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-blue-gray-900 active:bg-blue-gray-50 active:bg-opacity-80 active:text-blue-gray-900">
|
class="flex cursor-pointer items-center w-full p-3 leading-tight transition-all rounded-lg outline-none text-start hover:bg-blue-gray-50 hover:bg-opacity-80 hover:text-blue-gray-900 focus:bg-blue-gray-50 focus:bg-opacity-80 focus:text-blue-gray-900 active:bg-blue-gray-50 active:bg-opacity-80 active:text-blue-gray-900">
|
||||||
<div class="grid mr-4 place-items-center">
|
<div class="grid mr-4 place-items-center">
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"
|
||||||
|
|||||||
@@ -1,35 +1,36 @@
|
|||||||
import {Component, OnDestroy, OnInit} from '@angular/core';
|
import {Component, OnInit} from '@angular/core';
|
||||||
import {AuthService} from '../../_services/auth.service';
|
import {AuthService} from '../../_services/auth.service';
|
||||||
import {Users} from '../../_models/users';
|
import {Users} from '../../_models/users';
|
||||||
import {BehaviorSubject, catchError, Observable, of, Subscription} from 'rxjs';
|
import {catchError, of} from 'rxjs';
|
||||||
import {AsyncPipe, NgIf} from '@angular/common';
|
import {NgIf} from '@angular/common';
|
||||||
import {Router, RouterLink} from '@angular/router';
|
import {Router, RouterLink} from '@angular/router';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-sidbar',
|
selector: 'app-sidbar',
|
||||||
imports: [
|
imports: [
|
||||||
NgIf,
|
NgIf,
|
||||||
RouterLink,
|
RouterLink
|
||||||
AsyncPipe
|
|
||||||
],
|
],
|
||||||
templateUrl: './sidbar.component.html',
|
templateUrl: './sidbar.component.html',
|
||||||
styleUrl: './sidbar.component.css'
|
styleUrl: './sidbar.component.css'
|
||||||
})
|
})
|
||||||
export class SidbarComponent implements OnInit {
|
export class SidbarComponent implements OnInit {
|
||||||
|
|
||||||
user$: BehaviorSubject<Users> = new BehaviorSubject<Users>(null as unknown as Users);
|
user: Users = { id: 0, email: '', firstname: '', lastname: '', password_hash: '', updated_at: new Date(), created_at: new Date() };
|
||||||
|
|
||||||
constructor(private authService: AuthService, private router: Router) {}
|
constructor(private authService: AuthService, private router: Router) {}
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
this.checkAuthAndLoadUser();
|
this.checkAuthAndLoadUser();
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
checkAuthAndLoadUser(): void {
|
checkAuthAndLoadUser(): void {
|
||||||
this.authService.isAuthenticated().subscribe(isAuthenticated => {
|
this.authService.isAuthenticated().subscribe(isAuthenticated => {
|
||||||
console.log(isAuthenticated);
|
|
||||||
if (isAuthenticated) {
|
if (isAuthenticated) {
|
||||||
this.loadUsers();
|
this.loadUsers();
|
||||||
|
} else {
|
||||||
|
this.user = { id: 0, email: '', firstname: '', lastname: '', password_hash: '', updated_at: new Date(), created_at: new Date() };
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -42,7 +43,8 @@ export class SidbarComponent implements OnInit {
|
|||||||
})
|
})
|
||||||
).subscribe(users => {
|
).subscribe(users => {
|
||||||
if (users) {
|
if (users) {
|
||||||
this.user$.next(users)
|
console.log(users);
|
||||||
|
this.user = users;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user