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" + } } }