From a03557fcada16ad6e42b50ae94b77c129329ee02 Mon Sep 17 00:00:00 2001 From: Rezart Vata Date: Wed, 18 May 2022 16:44:20 +0200 Subject: [PATCH] [CST-5270] fixed accordion issue and changed it to collapsable --- .../content-accordion.component.html | 119 +++++++++--------- .../content-accordion.component.spec.ts | 8 +- .../content-accordion.component.ts | 4 + .../section-sherpa-policies.component.html | 94 +++++++------- .../section-sherpa-policies.component.spec.ts | 12 +- .../section-sherpa-policies.component.ts | 30 +---- src/app/submission/submission.module.ts | 6 +- 7 files changed, 122 insertions(+), 151 deletions(-) diff --git a/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.html b/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.html index c2d7207c98..767bab0d98 100644 --- a/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.html +++ b/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.html @@ -1,63 +1,62 @@ - - - - - {{version.articleVersion | titlecase}} {{ 'submission.sections.sherpa.publisher.policy.version' | - translate }} - -
- - -
-
- -
-
-
-

{{ 'submission.sections.sherpa.publisher.policy.embargo' | translate }}

-
-
-

{{version.embargo.amount}} - {{version.embargo.units}}

- -

{{ 'submission.sections.sherpa.publisher.policy.noembargo' | translate }}

-
+
+
+ +
+ + +
+
+
+
+
+
+

{{ 'submission.sections.sherpa.publisher.policy.embargo' | translate }}

+
+
+

{{version.embargo.amount}} + {{version.embargo.units}}

+ +

{{ 'submission.sections.sherpa.publisher.policy.noembargo' | translate }}

+
-
-
-
-
-

{{ 'submission.sections.sherpa.publisher.policy.license' | translate }}

-
-
-

{{license}}

-
-
-
-
-

{{ 'submission.sections.sherpa.publisher.policy.prerequisites' | translate }}

-
-
-

{{prerequisite}}

-
-
-
-
-

{{ 'submission.sections.sherpa.publisher.policy.location' | translate }}

-
-
-

{{location}}

-
-
-
-
-

{{ 'submission.sections.sherpa.publisher.policy.conditions' | translate }}

-
-
-

{{condition}}

-
- - - \ No newline at end of file +
+
+

{{ 'submission.sections.sherpa.publisher.policy.license' | translate }}

+
+
+

{{license}}

+
+
+
+
+

{{ 'submission.sections.sherpa.publisher.policy.prerequisites' | translate }}

+
+
+

{{prerequisite}}

+
+
+
+
+

{{ 'submission.sections.sherpa.publisher.policy.location' | translate }}

+
+
+

{{location}}

+
+
+
+
+

{{ 'submission.sections.sherpa.publisher.policy.conditions' | translate }}

+
+
+

{{condition}}

+
+
+
+
+
\ No newline at end of file diff --git a/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.spec.ts b/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.spec.ts index 382450fbd3..b07674c40d 100644 --- a/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.spec.ts +++ b/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.spec.ts @@ -1,4 +1,4 @@ -import { NgbAccordionModule } from '@ng-bootstrap/ng-bootstrap'; +import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap'; import { TranslateLoaderMock } from '../../../../shared/mocks/translate-loader.mock'; import { ComponentFixture, TestBed } from '@angular/core/testing'; @@ -23,7 +23,7 @@ describe('ContentAccordionComponent', () => { useClass: TranslateLoaderMock } }), - NgbAccordionModule + NgbCollapseModule ], declarations: [ContentAccordionComponent] }) @@ -42,10 +42,6 @@ describe('ContentAccordionComponent', () => { expect(component).toBeTruthy(); }); - it('should show accordion', () => { - expect(de.query(By.css('ngb-accordion'))).toBeTruthy(); - }); - it('should show 5 rows', () => { expect(de.queryAll(By.css('.row')).length).toEqual(5); }); diff --git a/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.ts b/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.ts index a2decc38e1..94d085db39 100644 --- a/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.ts +++ b/src/app/submission/sections/sherpa-policies/content-accordion/content-accordion.component.ts @@ -13,4 +13,8 @@ export class ContentAccordionComponent { */ @Input() version: PermittedVersions; + /** + * A boolean representing if div should start collapsed + */ + public isCollapsed = false; } diff --git a/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.html b/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.html index f74e38bf8f..1ebcfc26c8 100644 --- a/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.html +++ b/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.html @@ -7,56 +7,56 @@
- + - - - {{'submission.sections.sherpa.publication.information' - | translate}} -
- - +
+
+ +
+ +
- - - - - - - - - {{'submission.sections.sherpa.publisher.policy' - | translate}} -
- - -
-
- - - -
-
- - - - {{'submission.sections.sherpa.record.information' - | translate}} -
- -
-
- +
+ +
+
+
+
+ +
+ + +
+
+
+ +
+
+ + +
+
+ +
+ + +
+
+
- - +
+
- \ No newline at end of file + + \ No newline at end of file diff --git a/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.spec.ts b/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.spec.ts index 0637745939..30a50743b7 100644 --- a/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.spec.ts +++ b/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.spec.ts @@ -1,5 +1,5 @@ import { SharedModule } from './../../../shared/shared.module'; -import { NgbAccordionModule } from '@ng-bootstrap/ng-bootstrap'; +import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap'; import { SubmissionServiceStub } from '../../../shared/testing/submission-service.stub'; import { SherpaDataResponse } from '../../../shared/mocks/section-sherpa-policies.service.mock'; import { ComponentFixture, inject, TestBed, fakeAsync, tick } from '@angular/core/testing'; @@ -59,7 +59,7 @@ describe('SubmissionSectionSherpaPoliciesComponent', () => { useClass: TranslateLoaderMock } }), - NgbAccordionModule, + NgbCollapseModule, SharedModule ], declarations: [SubmissionSectionSherpaPoliciesComponent], @@ -88,14 +88,6 @@ describe('SubmissionSectionSherpaPoliciesComponent', () => { expect(component).toBeTruthy(); }); - it('should show accordions', () => { - expect(de.query(By.css('ngb-accordion'))).toBeTruthy(); - }); - - it('should show expanded accordion', () => { - expect(component.acc.first.isExpanded('publication-information-0')).toBeTrue(); - }); - it('should show refresh button', () => { expect(de.query(By.css('.refresh-container > button'))).toBeTruthy(); }); diff --git a/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.ts b/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.ts index a56eb5f663..8e133224e9 100644 --- a/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.ts +++ b/src/app/submission/sections/sherpa-policies/section-sherpa-policies.component.ts @@ -27,8 +27,6 @@ import { debounce, debounceTime, timeInterval } from 'rxjs/operators'; @renderSectionFor(SectionsType.SherpaPolicies) export class SubmissionSectionSherpaPoliciesComponent extends SectionModelComponent { - @ViewChildren('acc', { emitDistinctChangesOnly: true }) acc: QueryList; - /** * The accesses section data * @type {WorkspaceitemSectionAccessesObject} @@ -47,6 +45,11 @@ export class SubmissionSectionSherpaPoliciesComponent extends SectionModelCompon */ protected subs: Subscription[] = []; + /** + * A boolean representing if div should start collapsed + */ + public isCollapsed = false; + /** * Initialize instance variables * @@ -74,17 +77,6 @@ export class SubmissionSectionSherpaPoliciesComponent extends SectionModelCompon .forEach((subscription) => subscription.unsubscribe()); } - /** - * Expand all primary accordions - */ - ngAfterViewInit() { - if (this.acc) { - this.acc.forEach(accordion => { - accordion.expandAll(); - }); - } - } - /** * Initialize all instance variables and retrieve collection default access conditions @@ -98,18 +90,6 @@ export class SubmissionSectionSherpaPoliciesComponent extends SectionModelCompon this.sherpaPoliciesData$.next(sherpaPolicies); }) ); - - this.subs.push( - this.sherpaPoliciesData$.pipe( - debounceTime(500) - ).subscribe((sherpaPolicies: WorkspaceitemSectionSherpaPoliciesObject) => { - if (this.acc) { - this.acc.forEach(accordion => { - accordion.expandAll(); - }); - } - }) - ); } /** diff --git a/src/app/submission/submission.module.ts b/src/app/submission/submission.module.ts index b0b6d5195d..c25dab2624 100644 --- a/src/app/submission/submission.module.ts +++ b/src/app/submission/submission.module.ts @@ -50,7 +50,7 @@ import { ThemedSubmissionEditComponent } from './edit/themed-submission-edit.com import { ThemedSubmissionSubmitComponent } from './submit/themed-submission-submit.component'; import { ThemedSubmissionImportExternalComponent } from './import-external/themed-submission-import-external.component'; import { FormModule } from '../shared/form/form.module'; -import { NgbAccordionModule, NgbModalModule } from '@ng-bootstrap/ng-bootstrap'; +import { NgbCollapseModule, NgbModalModule } from '@ng-bootstrap/ng-bootstrap'; import { SubmissionSectionAccessesComponent } from './sections/accesses/section-accesses.component'; import { SubmissionAccessesConfigService } from '../core/config/submission-accesses-config.service'; import { SectionAccessesService } from './sections/accesses/section-accesses.service'; @@ -113,8 +113,8 @@ const DECLARATIONS = [ JournalEntitiesModule.withEntryComponents(), ResearchEntitiesModule.withEntryComponents(), FormModule, - NgbAccordionModule, - NgbModalModule + NgbModalModule, + NgbCollapseModule, ], declarations: DECLARATIONS, exports: DECLARATIONS,