diff --git a/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.html b/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.html
new file mode 100644
index 000000000..ba96bcc33
--- /dev/null
+++ b/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.html
@@ -0,0 +1,30 @@
+
+
+
diff --git a/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.scss b/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.scss
new file mode 100644
index 000000000..e69de29bb
diff --git a/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.spec.ts b/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.spec.ts
new file mode 100644
index 000000000..aa24d27d5
--- /dev/null
+++ b/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.spec.ts
@@ -0,0 +1,87 @@
+/*
+ * ComiXed - A digital comic book library management application.
+ * Copyright (C) 2020, The ComiXed Project
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see
+ */
+
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddComicsToReadingListComponent } from './add-comics-to-reading-list.component';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { TranslateModule } from '@ngx-translate/core';
+import { DropdownModule } from 'primeng/dropdown';
+import { DialogModule } from 'primeng/dialog';
+import { ButtonModule } from 'primeng/button';
+import {
+ LibraryAdaptor,
+ ReadingListAdaptor,
+ SelectionAdaptor
+} from 'app/library';
+import { StoreModule } from '@ngrx/store';
+import * as forReadingList from 'app/library/reducers/reading-list.reducer';
+import { READING_LIST_FEATURE_KEY } from 'app/library/reducers/reading-list.reducer';
+import * as forLibrary from 'app/library/reducers/library.reducer';
+import { LIBRARY_FEATURE_KEY } from 'app/library/reducers/library.reducer';
+import { EffectsModule } from '@ngrx/effects';
+import { ReadingListEffects } from 'app/library/effects/reading-list.effects';
+import { LibraryEffects } from 'app/library/effects/library.effects';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { LoggerModule } from '@angular-ru/logger';
+import { MessageService } from 'primeng/api';
+import { ComicsModule } from 'app/comics/comics.module';
+
+describe('AddComicsToReadingListComponent', () => {
+ let component: AddComicsToReadingListComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ imports: [
+ ComicsModule,
+ HttpClientTestingModule,
+ FormsModule,
+ ReactiveFormsModule,
+ TranslateModule.forRoot(),
+ LoggerModule.forRoot(),
+ StoreModule.forRoot({}),
+ StoreModule.forFeature(
+ READING_LIST_FEATURE_KEY,
+ forReadingList.reducer
+ ),
+ StoreModule.forFeature(LIBRARY_FEATURE_KEY, forLibrary.reducer),
+ EffectsModule.forRoot([]),
+ EffectsModule.forFeature([ReadingListEffects, LibraryEffects]),
+ DropdownModule,
+ DialogModule,
+ ButtonModule
+ ],
+ declarations: [AddComicsToReadingListComponent],
+ providers: [
+ ReadingListAdaptor,
+ LibraryAdaptor,
+ SelectionAdaptor,
+ MessageService
+ ]
+ }).compileComponents();
+
+ fixture = TestBed.createComponent(AddComicsToReadingListComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ }));
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.ts b/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.ts
new file mode 100644
index 000000000..080ab1b8b
--- /dev/null
+++ b/comixed-frontend/src/app/library/components/add-comics-to-list-reading-list/add-comics-to-reading-list.component.ts
@@ -0,0 +1,93 @@
+/*
+ * ComiXed - A digital comic book library management application.
+ * Copyright (C) 2020, The ComiXed Project
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see
+ */
+
+import { Component, OnDestroy, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import {
+ LibraryAdaptor,
+ ReadingListAdaptor,
+ SelectionAdaptor
+} from 'app/library';
+import { ReadingList } from 'app/comics/models/reading-list';
+import { Subscription } from 'rxjs';
+import { SelectItem } from 'primeng/api';
+import { Comic } from 'app/comics';
+
+@Component({
+ selector: 'app-add-comics-to-reading-list',
+ templateUrl: './add-comics-to-reading-list.component.html',
+ styleUrls: ['./add-comics-to-reading-list.component.scss']
+})
+export class AddComicsToReadingListComponent implements OnInit, OnDestroy {
+ readingListForm: FormGroup;
+ showDialogSubscription: Subscription;
+ showDialog = false;
+ readingListsSubscription: Subscription;
+ readingLists: ReadingList[];
+ readingListOptions: SelectItem[] = [];
+ selectedComicsSubscription: Subscription;
+ selectedComics: Comic[] = [];
+
+ constructor(
+ private formBuilder: FormBuilder,
+ private readingListAdaptor: ReadingListAdaptor,
+ private libraryAdaptor: LibraryAdaptor,
+ private selectionAdaptor: SelectionAdaptor
+ ) {
+ this.readingListForm = this.formBuilder.group({
+ readingLists: ['', Validators.required]
+ });
+ this.showDialogSubscription = this.readingListAdaptor.showSelectionDialog$.subscribe(
+ show => (this.showDialog = show)
+ );
+ this.readingListsSubscription = this.libraryAdaptor.lists$.subscribe(
+ readingLists => {
+ this.readingListOptions = [{ label: '' } as SelectItem].concat(
+ readingLists.map(readingList => {
+ return {
+ label: readingList.name,
+ value: readingList
+ } as SelectItem;
+ })
+ );
+ }
+ );
+ this.selectedComicsSubscription = this.selectionAdaptor.comicSelection$.subscribe(
+ selected => (this.selectedComics = selected)
+ );
+ }
+
+ ngOnInit() {}
+
+ ngOnDestroy(): void {
+ this.showDialogSubscription.unsubscribe();
+ this.readingListsSubscription.unsubscribe();
+ this.selectedComicsSubscription.unsubscribe();
+ }
+
+ readingListSelected() {
+ this.readingListAdaptor.addComicsToList(
+ this.readingListForm.controls['readingLists'].value,
+ this.selectedComics
+ );
+ }
+
+ hideSelection() {
+ this.readingListAdaptor.hideSelectDialog();
+ }
+}
diff --git a/comixed-frontend/src/app/library/library.module.ts b/comixed-frontend/src/app/library/library.module.ts
index 3c2cc5777..862150e9d 100644
--- a/comixed-frontend/src/app/library/library.module.ts
+++ b/comixed-frontend/src/app/library/library.module.ts
@@ -81,6 +81,7 @@ import { FileSaverModule } from 'ngx-filesaver';
import { LibraryNavigationTreeComponent } from './components/library-navigation-tree/library-navigation-tree.component';
import { DuplicateComicsPageComponent } from './pages/duplicate-comics-page/duplicate-comics-page.component';
import { ReadingListEditComponent } from './components/reading-list-edit/reading-list-edit.component';
+import { AddComicsToReadingListComponent } from './components/add-comics-to-list-reading-list/add-comics-to-reading-list.component';
@NgModule({
imports: [
@@ -150,7 +151,8 @@ import { ReadingListEditComponent } from './components/reading-list-edit/reading
LibraryAdminPageComponent,
LibraryNavigationTreeComponent,
DuplicateComicsPageComponent,
- ReadingListEditComponent
+ ReadingListEditComponent,
+ AddComicsToReadingListComponent
],
providers: [
LibraryService,
diff --git a/comixed-frontend/src/assets/i18n/library-en.json b/comixed-frontend/src/assets/i18n/library-en.json
index 2b99aacef..2cac44e38 100644
--- a/comixed-frontend/src/assets/i18n/library-en.json
+++ b/comixed-frontend/src/assets/i18n/library-en.json
@@ -471,5 +471,10 @@
"header": "Save Reading List",
"message": "Save changes to \"{name}\"?"
}
+ },
+ "add-comics-to-reading-list": {
+ "label": {
+ "select-reading-list": "Select A Reading List"
+ }
}
}