98 lines
4.4 KiB
HTML
98 lines
4.4 KiB
HTML
<app-side-nav-companion-bar></app-side-nav-companion-bar>
|
|
|
|
<ng-container *transloco="let t; read: 'dashboard'">
|
|
@if (libraries$ | async; as libraries) {
|
|
@if (libraries.length === 0) {
|
|
@if (accountService.isAdmin$ | async; as isAdmin) {
|
|
<div class="mt-3">
|
|
@if (isAdmin) {
|
|
<div class="d-flex justify-content-center">
|
|
<p>{{t('no-libraries')}} <a routerLink="/settings" [fragment]="SettingsTabId.Libraries">{{t('server-settings-link')}}</a>.</p>
|
|
</div>
|
|
} @else {
|
|
<div class="d-flex justify-content-center">
|
|
<p>{{t('not-granted')}}</p>
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|
|
}
|
|
}
|
|
|
|
@for(stream of streams; track stream.id) {
|
|
@switch (stream.streamType) {
|
|
@case (StreamType.OnDeck) {
|
|
<ng-container [ngTemplateOutlet]="onDeck" [ngTemplateOutletContext]="{ stream: stream }"></ng-container>
|
|
}
|
|
@case (StreamType.RecentlyUpdated) {
|
|
<ng-container [ngTemplateOutlet]="recentlyUpdated" [ngTemplateOutletContext]="{ stream: stream }"></ng-container>
|
|
}
|
|
@case (StreamType.NewlyAdded) {
|
|
<ng-container [ngTemplateOutlet]="newlyUpdated" [ngTemplateOutletContext]="{ stream: stream }"></ng-container>
|
|
}
|
|
@case (StreamType.SmartFilter) {
|
|
<ng-container [ngTemplateOutlet]="smartFilter" [ngTemplateOutletContext]="{ stream: stream }"></ng-container>
|
|
}
|
|
@case (StreamType.MoreInGenre) {
|
|
<ng-container [ngTemplateOutlet]="moreInGenre" [ngTemplateOutletContext]="{ stream: stream }"></ng-container>
|
|
}
|
|
}
|
|
|
|
|
|
<ng-template #smartFilter let-stream: DashboardStream>
|
|
@if(stream.api | async; as data) {
|
|
<app-carousel-reel [items]="data" [title]="stream.name" (sectionClick)="handleFilterSectionClick(stream)">
|
|
<ng-template #carouselItem let-item>
|
|
<app-series-card [data]="item" [libraryId]="item.libraryId"
|
|
(reload)="reloadStream(item.id)" (dataChanged)="reloadStream(item.id)"></app-series-card>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
</ng-template>
|
|
|
|
<ng-template #onDeck let-stream: DashboardStream>
|
|
@if(stream.api | async; as data) {
|
|
<app-carousel-reel [items]="data" [title]="t('on-deck-title')" (sectionClick)="handleSectionClick(StreamId.OnDeck)">
|
|
<ng-template #carouselItem let-item>
|
|
<app-series-card [data]="item" [libraryId]="item.libraryId" [isOnDeck]="true"
|
|
(reload)="reloadStream(stream.id, true)" (dataChanged)="reloadStream(stream.id)"></app-series-card>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
</ng-template>
|
|
|
|
<ng-template #recentlyUpdated let-stream: DashboardStream>
|
|
@if(stream.api | async; as data) {
|
|
<app-carousel-reel [items]="data" [title]="t('recently-updated-title')" (sectionClick)="handleSectionClick(StreamId.RecentlyUpdatedSeries)">
|
|
<ng-template #carouselItem let-item>
|
|
<app-card-item [entity]="item" [title]="item.seriesName" [imageUrl]="imageService.getSeriesCoverImage(item.seriesId)"
|
|
[suppressArchiveWarning]="true" (clicked)="handleRecentlyAddedChapterClick(item)" [count]="item.count"></app-card-item>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
</ng-template>
|
|
|
|
<ng-template #newlyUpdated let-stream: DashboardStream>
|
|
@if(stream.api | async; as data) {
|
|
<app-carousel-reel [items]="data" [title]="t('recently-added-title')" (sectionClick)="handleSectionClick(StreamId.NewlyAddedSeries)">
|
|
<ng-template #carouselItem let-item>
|
|
<app-series-card [data]="item" [libraryId]="item.libraryId" (dataChanged)="reloadStream(stream.id)"></app-series-card>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
</ng-template>
|
|
|
|
<ng-template #moreInGenre let-stream: DashboardStream>
|
|
@if(stream.api | async; as data) {
|
|
<app-carousel-reel [items]="data" [title]="t('more-in-genre-title', {genre: genre?.title})" (sectionClick)="handleSectionClick(StreamId.MoreInGenre)">
|
|
<ng-template #carouselItem let-item>
|
|
<app-series-card [data]="item" [libraryId]="item.libraryId" (dataChanged)="reloadStream(stream.id)"></app-series-card>
|
|
</ng-template>
|
|
</app-carousel-reel>
|
|
}
|
|
</ng-template>
|
|
}
|
|
|
|
<app-loading [loading]="isLoadingDashboard || (streamCount !== streamsLoaded)"></app-loading>
|
|
</ng-container>
|
|
|