48 lines
1.5 KiB
TypeScript
48 lines
1.5 KiB
TypeScript
import { Component, computed, inject } from '@angular/core';
|
|
import { CommonModule } from '@angular/common';
|
|
import { RouterLink, RouterOutlet } from '@angular/router';
|
|
import { BootstrapService } from '../../core/services/bootstrap.service';
|
|
import { AuthService } from '../../core/services/auth.service';
|
|
import { shouldShowAdminNav } from './home.shell';
|
|
|
|
export { shouldShowAdminNav } from './home.shell';
|
|
|
|
@Component({
|
|
selector: 'app-home',
|
|
standalone: true,
|
|
imports: [CommonModule, RouterLink, RouterOutlet],
|
|
template: `
|
|
<div class="container">
|
|
<header class="shell-header">
|
|
<h1 class="shell-title">{{ bootstrap.payload()?.pageTitle ?? 'HIPCTF' }}</h1>
|
|
<div class="shell-user" *ngIf="auth.isAuthenticated()">
|
|
<span>Signed in as <b>{{ auth.currentUser()?.username }}</b> ({{ auth.currentUser()?.role }})</span>
|
|
</div>
|
|
</header>
|
|
|
|
<nav class="shell-nav" *ngIf="showAdminNav()">
|
|
<a routerLink="/admin" data-testid="nav-admin">Admin</a>
|
|
</nav>
|
|
|
|
<section class="shell-body">
|
|
<div *ngIf="!auth.isAuthenticated()">
|
|
<p>{{ bootstrap.payload()?.welcomeMarkdown }}</p>
|
|
<a href="/login">Sign in</a>
|
|
</div>
|
|
<router-outlet></router-outlet>
|
|
</section>
|
|
</div>
|
|
`,
|
|
})
|
|
export class HomeComponent {
|
|
bootstrap = inject(BootstrapService);
|
|
auth = inject(AuthService);
|
|
|
|
readonly showAdminNav = computed(() =>
|
|
shouldShowAdminNav({
|
|
isAuthenticated: this.auth.isAuthenticated(),
|
|
role: this.auth.currentUser()?.role,
|
|
}),
|
|
);
|
|
}
|