From 507fffcaa89a79d2aa3d21c5af839db48919f54e Mon Sep 17 00:00:00 2001
From: TheIceCreamTroll <33820904+TheIceCreamTroll@users.noreply.github.com>
Date: Fri, 21 Oct 2022 15:54:59 -0700
Subject: [PATCH] UI Polish (#1599)

* Make the positioning of "Library | Recommended" consistent

* Fix reading lists not navigating back to their library after deletion
---
 .../library-detail.component.html             | 58 +++++++++----------
 .../reading-list-detail.component.ts          |  2 +-
 2 files changed, 29 insertions(+), 31 deletions(-)

diff --git a/UI/Web/src/app/library-detail/library-detail.component.html b/UI/Web/src/app/library-detail/library-detail.component.html
index 19478898a..8454aa6d4 100644
--- a/UI/Web/src/app/library-detail/library-detail.component.html
+++ b/UI/Web/src/app/library-detail/library-detail.component.html
@@ -3,45 +3,43 @@
         <app-card-actionables [actions]="actions" (actionHandler)="performAction($event)"></app-card-actionables>
         <span>{{libraryName}}</span>
     </h2>
-    <h6 subtitle class="subtitle-with-actionables" *ngIf="active.fragment === ''">{{pagination.totalItems}} Series</h6>
     <div main>
         <ul ngbNav #nav="ngbNav" [(activeId)]="active" class="nav nav-pills" style="flex-wrap: nowrap;">
             <li *ngFor="let tab of tabs" [ngbNavItem]="tab">
-              <a ngbNavLink>
-                  <span class="d-none d-sm-flex align-items-center"><i class="fa {{tab.icon}} me-1" style="padding-right: 5px;" aria-hidden="true"></i> {{tab.title | sentenceCase}}</span>
-                  <span class="d-flex d-sm-none">
+                <a ngbNavLink>
+                    <span class="d-none d-sm-flex align-items-center"><i class="fa {{tab.icon}} me-1" style="padding-right: 5px;" aria-hidden="true"></i> {{tab.title | sentenceCase}}</span>
+                    <span class="d-flex d-sm-none">
                       <i class="fa {{tab.icon}}" aria-hidden="true"></i>
                   </span>
-              </a>
-              <ng-template ngbNavContent>
-                <ng-container *ngIf="tab.title === 'Recommended'">
-                  <app-library-recommended [libraryId]="libraryId"></app-library-recommended>
-                </ng-container>
-                <ng-container *ngIf="tab.title === 'Library'">
-                    <app-card-detail-layout 
-                        [isLoading]="loadingSeries"
-                        [items]="series"
-                        [pagination]="pagination"
-                        [filterSettings]="filterSettings"
-                        [trackByIdentity]="trackByIdentity"
-                        [filterOpen]="filterOpen"
-                        [jumpBarKeys]="jumpKeys"
-                        [refresh]="refresh"
-                        (applyFilter)="updateFilter($event)"
+                </a>
+                <ng-template ngbNavContent>
+                    <ng-container *ngIf="tab.title === 'Recommended'">
+                        <app-library-recommended [libraryId]="libraryId"></app-library-recommended>
+                    </ng-container>
+                    <ng-container *ngIf="tab.title === 'Library'">
+                        <app-card-detail-layout
+                            [isLoading]="loadingSeries"
+                            [items]="series"
+                            [pagination]="pagination"
+                            [filterSettings]="filterSettings"
+                            [trackByIdentity]="trackByIdentity"
+                            [filterOpen]="filterOpen"
+                            [jumpBarKeys]="jumpKeys"
+                            [refresh]="refresh"
+                            (applyFilter)="updateFilter($event)"
                         >
-                        <ng-template #cardItem let-item let-position="idx">
-                            <app-series-card [data]="item" [libraryId]="libraryId" [suppressLibraryLink]="true" (reload)="loadPage()" 
-                            (selection)="bulkSelectionService.handleCardSelection('series', position, series.length, $event)" 
-                            [selected]="bulkSelectionService.isCardSelected('series', position)" [allowSelection]="true"></app-series-card>
-                        </ng-template>
-                    </app-card-detail-layout>
-                </ng-container>
-              </ng-template>
+                            <ng-template #cardItem let-item let-position="idx">
+                                <app-series-card [data]="item" [libraryId]="libraryId" [suppressLibraryLink]="true" (reload)="loadPage()"
+                                                 (selection)="bulkSelectionService.handleCardSelection('series', position, series.length, $event)"
+                                                 [selected]="bulkSelectionService.isCardSelected('series', position)" [allowSelection]="true"></app-series-card>
+                            </ng-template>
+                        </app-card-detail-layout>
+                    </ng-container>
+                </ng-template>
             </li>
         </ul>
     </div>
 </app-side-nav-companion-bar>
+<h6 subtitle class="subtitle-with-actionables" *ngIf="active.fragment === ''">{{pagination.totalItems}} Series</h6>
 <app-bulk-operations [actionCallback]="bulkActionCallback"></app-bulk-operations>
 <div [ngbNavOutlet]="nav"></div>
-
-
diff --git a/UI/Web/src/app/reading-list/reading-list-detail/reading-list-detail.component.ts b/UI/Web/src/app/reading-list/reading-list-detail/reading-list-detail.component.ts
index 67b6f611a..3f6fde7a8 100644
--- a/UI/Web/src/app/reading-list/reading-list-detail/reading-list-detail.component.ts
+++ b/UI/Web/src/app/reading-list/reading-list-detail/reading-list-detail.component.ts
@@ -144,7 +144,7 @@ export class ReadingListDetailComponent implements OnInit {
 
     this.readingListService.delete(readingList.id).subscribe(() => {
       this.toastr.success('Reading list deleted');
-      this.router.navigateByUrl('library#lists');
+      this.router.navigateByUrl('/lists');
     });
   }