Files
frontend-hideyoshi.com/src/app/header/header-slider/user-slider/user-slider.component.ts

102 lines
2.5 KiB
TypeScript

import { Component, EventEmitter, OnInit, Output } from '@angular/core';
import { Subscription } from 'rxjs';
import { AuthService } from 'src/app/shared/service/auth.service';
import { SliderItemComponent } from 'src/app/shared/components/slider-item/slider-item.component';
import { User } from 'src/app/shared/model/user/user.model';
import {Value} from "@sinclair/typebox/value";
@Component({
selector: 'app-user-slider',
templateUrl: './user-slider.component.html',
styleUrls: ['./user-slider.component.css'],
})
export class UserSliderComponent extends SliderItemComponent implements OnInit {
userlessOptions = [
{
name: 'Login',
onClick: () => {
this.onLoginOptionClicked();
},
},
{
name: 'Signup',
onClick: () => {
this.onSignUpOptionClick();
},
},
];
userOptions = [
{
name: 'My Profile',
onClick: () => {
this.onMyProfileClicked();
},
},
{
name: 'Help',
onClick: () => {
this.onHelpClicked();
},
},
{
name: 'Logout',
onClick: () => {
this.onLogout();
},
},
];
user!: User | null;
authSubscription!: Subscription;
@Output()
loginPopupState: EventEmitter<boolean> = new EventEmitter();
@Output()
signupPopupState: EventEmitter<boolean> = new EventEmitter();
@Output()
helpPopupState: EventEmitter<boolean> = new EventEmitter();
@Output()
myProfilePopupState: EventEmitter<boolean> = new EventEmitter();
constructor(private authService: AuthService) {
super();
}
ngOnInit() {
this.authSubscription = this.authService.authSubject.subscribe(
(res) => {
if (Value.Check(User, res)) {
this.user = <User>res;
} else {
this.user = null;
}
},
);
}
onLoginOptionClicked(): void {
this.loginPopupState.emit(true);
}
onSignUpOptionClick(): void {
this.signupPopupState.emit(true);
}
onMyProfileClicked(): void {
this.myProfilePopupState.emit(true);
}
onHelpClicked(): void {
this.helpPopupState.emit(true);
}
onLogout() {
this.authService.logout();
}
}