+ [disabled]="bulkMode" (actionHandler)="handleBulkAction($event, null!)" [hideLabelOnMobile]="true">
@if (bulkMode && bulkAction === Action.CopySettings && sourceCopyToLibrary) {
-
- {{t('bulk-copy-to', {libraryName: sourceCopyToLibrary.name})}}
-
-
-
-
-
-
-
+
+ {{t('bulk-copy-to', {libraryName: sourceCopyToLibrary.name})}}
+
+
+
+
+
+
}
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{{t('type-title')}}
+
{{library.type | libraryType}}
+
+
+
+
{{t('shared-folders-title')}}
+
{{library.folders.length}}
+
+
+
+
{{t('last-scanned-title')}}
+
{{library.lastScanned | timeAgo | defaultDate}}
+
+
+
+
+
+
+
+
+
+ @if (useActionables$ | async) {
+
+ } @else {
+
+
+
+ }
+
diff --git a/UI/Web/src/app/admin/manage-library/manage-library.component.scss b/UI/Web/src/app/admin/manage-library/manage-library.component.scss
index 5d7f358ff..e55bae653 100644
--- a/UI/Web/src/app/admin/manage-library/manage-library.component.scss
+++ b/UI/Web/src/app/admin/manage-library/manage-library.component.scss
@@ -2,7 +2,7 @@
.custom-position {
right: 15px;
- top: -42px;
+ top: -60px;
}
.member-name {
diff --git a/UI/Web/src/app/admin/manage-library/manage-library.component.ts b/UI/Web/src/app/admin/manage-library/manage-library.component.ts
index 9154eb2aa..8052cd335 100644
--- a/UI/Web/src/app/admin/manage-library/manage-library.component.ts
+++ b/UI/Web/src/app/admin/manage-library/manage-library.component.ts
@@ -5,7 +5,8 @@ import {
DestroyRef,
HostListener,
inject,
- OnInit
+ OnInit,
+ TrackByFunction
} from '@angular/core';
import {NgbModal, NgbTooltip} from '@ng-bootstrap/ng-bootstrap';
import {ToastrService} from 'ngx-toastr';
@@ -33,11 +34,18 @@ import {Action, ActionFactoryService, ActionItem} from "../../_services/action-f
import {ActionService} from "../../_services/action.service";
import {CardActionablesComponent} from "../../_single-module/card-actionables/card-actionables.component";
import {BehaviorSubject, catchError, Observable} from "rxjs";
-import {SelectionModel} from "../../typeahead/_models/selection-model";
import {
CopySettingsFromLibraryModalComponent
} from "../_modals/copy-settings-from-library-modal/copy-settings-from-library-modal.component";
import {FormControl, FormGroup, FormsModule, ReactiveFormsModule} from "@angular/forms";
+import {SelectionModel} from "../../typeahead/_models/selection-model";
+import {ResponsiveTableComponent} from "../../shared/_components/responsive-table/responsive-table.component";
+import {
+ DataTableColumnCellDirective,
+ DataTableColumnDirective,
+ DataTableColumnHeaderDirective,
+ DatatableComponent
+} from "@siemens/ngx-datatable";
@Component({
selector: 'app-manage-library',
@@ -45,7 +53,7 @@ import {FormControl, FormGroup, FormsModule, ReactiveFormsModule} from "@angular
styleUrls: ['./manage-library.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [RouterLink, NgbTooltip, LibraryTypePipe, TimeAgoPipe, SentenceCasePipe, TranslocoModule, DefaultDatePipe,
- AsyncPipe, LoadingComponent, CardActionablesComponent, NgTemplateOutlet, ReactiveFormsModule, FormsModule]
+ AsyncPipe, LoadingComponent, CardActionablesComponent, NgTemplateOutlet, ReactiveFormsModule, FormsModule, ResponsiveTableComponent, DatatableComponent, DataTableColumnHeaderDirective, DataTableColumnDirective, DataTableColumnCellDirective]
})
export class ManageLibraryComponent implements OnInit {
@@ -82,6 +90,9 @@ export class ManageLibraryComponent implements OnInit {
isShiftDown: boolean = false;
lastSelectedIndex: number | null = null;
+ trackByLibrary: TrackByFunction
= (_, lib) =>
+ `${lib.name}_${lib.type}_${lib.folders.length}_${lib.lastScanned}`;
+
@HostListener('document:keydown.shift', ['$event'])
handleKeypress(_: Event) {
this.isShiftDown = true;
diff --git a/UI/Web/src/app/admin/manage-users/manage-users.component.html b/UI/Web/src/app/admin/manage-users/manage-users.component.html
index 9d1c988da..2f4297838 100644
--- a/UI/Web/src/app/admin/manage-users/manage-users.component.html
+++ b/UI/Web/src/app/admin/manage-users/manage-users.component.html
@@ -1,123 +1,201 @@
-
-
diff --git a/UI/Web/src/app/book-reader/_components/_annotations/annotation-card/annotation-card.component.ts b/UI/Web/src/app/book-reader/_components/_annotations/annotation-card/annotation-card.component.ts
index 0d42fd56e..4040090d4 100644
--- a/UI/Web/src/app/book-reader/_components/_annotations/annotation-card/annotation-card.component.ts
+++ b/UI/Web/src/app/book-reader/_components/_annotations/annotation-card/annotation-card.component.ts
@@ -8,6 +8,7 @@ import {
input,
model,
Output,
+ signal,
Signal
} from '@angular/core';
import {Annotation} from "../../../_models/annotations/annotation";
@@ -103,7 +104,7 @@ export class AnnotationCardComponent {
@Output() selection = new EventEmitter();
titleColor: Signal;
- hasClicked = model(false);
+ hasClicked = signal(false);
constructor() {
diff --git a/UI/Web/src/app/book-reader/_components/_annotations/epub-highlight/epub-highlight.component.ts b/UI/Web/src/app/book-reader/_components/_annotations/epub-highlight/epub-highlight.component.ts
index bf71ecf7d..b8d1c7f5f 100644
--- a/UI/Web/src/app/book-reader/_components/_annotations/epub-highlight/epub-highlight.component.ts
+++ b/UI/Web/src/app/book-reader/_components/_annotations/epub-highlight/epub-highlight.component.ts
@@ -1,10 +1,9 @@
-import {Component, computed, DestroyRef, effect, ElementRef, inject, input, model, ViewChild} from '@angular/core';
+import {Component, computed, effect, ElementRef, inject, model, ViewChild} from '@angular/core';
import {Annotation} from "../../../_models/annotations/annotation";
import {EpubReaderMenuService} from "../../../../_services/epub-reader-menu.service";
import {AnnotationService} from "../../../../_services/annotation.service";
import {SlotColorPipe} from "../../../../_pipes/slot-color.pipe";
import {NgStyle} from "@angular/common";
-import {MessageHubService} from "../../../../_services/message-hub.service";
@Component({
selector: 'app-epub-highlight',
@@ -17,8 +16,6 @@ import {MessageHubService} from "../../../../_services/message-hub.service";
export class EpubHighlightComponent {
private readonly epubMenuService = inject(EpubReaderMenuService);
private readonly annotationService = inject(AnnotationService);
- private readonly messageHub = inject(MessageHubService);
- private readonly destroyRef = inject(DestroyRef);
showHighlight = model(true);
diff --git a/UI/Web/src/app/book-reader/_components/_drawers/view-bookmarks-drawer/view-bookmark-drawer.component.ts b/UI/Web/src/app/book-reader/_components/_drawers/view-bookmarks-drawer/view-bookmark-drawer.component.ts
index d3fecf0cf..8dee18535 100644
--- a/UI/Web/src/app/book-reader/_components/_drawers/view-bookmarks-drawer/view-bookmark-drawer.component.ts
+++ b/UI/Web/src/app/book-reader/_components/_drawers/view-bookmarks-drawer/view-bookmark-drawer.component.ts
@@ -1,4 +1,4 @@
-import {ChangeDetectionStrategy, Component, effect, EventEmitter, inject, model} from '@angular/core';
+import {ChangeDetectionStrategy, Component, effect, EventEmitter, inject, input, model, signal} from '@angular/core';
import {TranslocoDirective} from "@jsverse/transloco";
import {
NgbActiveOffcanvas,
@@ -52,8 +52,8 @@ export class ViewBookmarkDrawerComponent {
protected readonly imageService = inject(ImageService);
- chapterId = model();
- bookmarks = model();
+ chapterId = input.required();
+ bookmarks = signal([]);
/**
* Current Page
*/
diff --git a/UI/Web/src/app/book-reader/_components/_drawers/view-edit-annotation-drawer/view-edit-annotation-drawer.component.html b/UI/Web/src/app/book-reader/_components/_drawers/view-edit-annotation-drawer/view-edit-annotation-drawer.component.html
index 78c80541d..8394d5dab 100644
--- a/UI/Web/src/app/book-reader/_components/_drawers/view-edit-annotation-drawer/view-edit-annotation-drawer.component.html
+++ b/UI/Web/src/app/book-reader/_components/_drawers/view-edit-annotation-drawer/view-edit-annotation-drawer.component.html
@@ -65,7 +65,7 @@