Skip to content

Commit ad9d674

Browse files
alisaismailatialisaismailati
committed
[DSC-1988][DSC-1989] Limit the number of metadata values of truncatable component based on its collapsible status (item-list-preview.component.ts, item-search-result-list-element.component.ts)
1 parent 6b21eea commit ad9d674

6 files changed

Lines changed: 106 additions & 13 deletions

File tree

‎src/app/shared/object-list/my-dspace-result-list-element/item-list-preview/item-list-preview.component.html‎

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,20 @@ <h3 [innerHTML]="dsoTitle" [ngClass]="{'lead': true,'text-muted': !item.firstMet
1818
<span class="item-list-date" [innerHTML]="item.firstMetadataValue('dc.date.issued') || ('mydspace.results.no-date' | translate)"></span>)
1919
<span *ngIf="item.hasMetadata(authorMetadata);" class="item-list-authors">
2020
<span *ngIf="item.allMetadataValues(authorMetadata).length === 0">{{'mydspace.results.no-authors' | translate}}</span>
21-
<span *ngFor="let author of item.limitedMetadata(authorMetadata, authorMetadataLimit); let i=index; let last=last;">
22-
<ds-metadata-link-view *ngIf="!!item && !!author" [item]="item" [metadataName]="authorMetadata"
23-
[metadata]="author"></ds-metadata-link-view><span
24-
*ngIf="!last">; </span>
25-
</span>
21+
<span *ngIf="!(isCollapsed$ | async)">
22+
<span *ngFor="let author of item.allMetadata(authorMetadata); let i=index; let last=last;">
23+
<ds-metadata-link-view *ngIf="!!item && !!author" [item]="item" [metadataName]="authorMetadata"
24+
[metadata]="author"></ds-metadata-link-view><span
25+
*ngIf="!last">; </span>
26+
</span>
27+
</span>
28+
<span *ngIf="isCollapsed$ | async">
29+
<span *ngFor="let author of item.limitedMetadata(authorMetadata, authorMetadataLimit); let i=index; let last=last;">
30+
<ds-metadata-link-view *ngIf="!!item && !!author" [item]="item" [metadataName]="authorMetadata"
31+
[metadata]="author"></ds-metadata-link-view><span
32+
*ngIf="!last">; </span>
33+
</span>
34+
</span>
2635
</span>
2736
</ds-truncatable-part>
2837
</span>

‎src/app/shared/object-list/my-dspace-result-list-element/item-list-preview/item-list-preview.component.spec.ts‎

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import { TranslateLoaderMock } from '../../../mocks/translate-loader.mock';
1212
import { NoopAnimationsModule } from '@angular/platform-browser/animations';
1313
import { VarDirective } from '../../../utils/var.directive';
1414
import { APP_CONFIG } from '../../../../../config/app-config.interface';
15+
import { TruncatableService } from '../../../truncatable/truncatable.service';
1516

1617
let component: ItemListPreviewComponent;
1718
let fixture: ComponentFixture<ItemListPreviewComponent>;
@@ -80,6 +81,10 @@ const enviromentNoThumbs = {
8081
}
8182
};
8283

84+
const truncatableServiceStub: any = {
85+
isCollapsed: (id: number) => observableOf(true),
86+
};
87+
8388
describe('ItemListPreviewComponent', () => {
8489
beforeEach(waitForAsync(() => {
8590
TestBed.configureTestingModule({
@@ -95,7 +100,8 @@ describe('ItemListPreviewComponent', () => {
95100
declarations: [ItemListPreviewComponent, TruncatePipe, VarDirective],
96101
providers: [
97102
{ provide: 'objectElementProvider', useValue: { mockItemWithAuthorAndDate }},
98-
{ provide: APP_CONFIG, useValue: environmentUseThumbs }
103+
{ provide: APP_CONFIG, useValue: environmentUseThumbs },
104+
{ provide: TruncatableService, useValue: truncatableServiceStub },
99105
],
100106

101107
schemas: [NO_ERRORS_SCHEMA]
@@ -198,6 +204,33 @@ describe('ItemListPreviewComponent', () => {
198204
expect(entityField).toBeNull();
199205
});
200206
});
207+
208+
209+
describe('When truncatable section is collapsed', () => {
210+
beforeEach(() => {
211+
component.isCollapsed$ = observableOf(true);
212+
component.item = mockItemWithAuthorAndDate;
213+
fixture.detectChanges();
214+
});
215+
216+
it('should show limitedMetadata', () => {
217+
const authorElements = fixture.debugElement.queryAll(By.css('span.item-list-authors ds-metadata-link-view'));
218+
expect(authorElements.length).toBe(mockItemWithAuthorAndDate.limitedMetadata(component.authorMetadata, component.authorMetadataLimit).length);
219+
});
220+
});
221+
222+
describe('When truncatable section is expanded', () => {
223+
beforeEach(() => {
224+
component.isCollapsed$ = observableOf(false);
225+
component.item = mockItemWithAuthorAndDate;
226+
fixture.detectChanges();
227+
});
228+
229+
it('should show allMetadata', () => {
230+
const authorElements = fixture.debugElement.queryAll(By.css('span.item-list-authors ds-metadata-link-view'));
231+
expect(authorElements.length).toBe(mockItemWithAuthorAndDate.allMetadata(component.authorMetadata).length);
232+
});
233+
});
201234
});
202235

203236
describe('ItemListPreviewComponent', () => {
@@ -215,7 +248,8 @@ describe('ItemListPreviewComponent', () => {
215248
declarations: [ItemListPreviewComponent, TruncatePipe],
216249
providers: [
217250
{provide: 'objectElementProvider', useValue: {mockItemWithAuthorAndDate}},
218-
{provide: APP_CONFIG, useValue: enviromentNoThumbs}
251+
{provide: APP_CONFIG, useValue: enviromentNoThumbs},
252+
{ provide: TruncatableService, useValue: truncatableServiceStub },
219253
],
220254

221255
schemas: [NO_ERRORS_SCHEMA]

‎src/app/shared/object-list/my-dspace-result-list-element/item-list-preview/item-list-preview.component.ts‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,8 @@ import {
1111
DuplicateMatchMetadataDetailConfig
1212
} from '../../../../submission/sections/detect-duplicate/models/duplicate-detail-metadata.model';
1313
import { environment } from '../../../../../environments/environment';
14+
import { TruncatableService } from '../../../truncatable/truncatable.service';
15+
import { Observable } from 'rxjs';
1416

1517
/**
1618
* This component show metadata for the given item object in the list view.
@@ -79,15 +81,18 @@ export class ItemListPreviewComponent implements OnInit {
7981

8082
authorMetadataLimit = environment.followAuthorityMetadataValuesLimit;
8183

84+
isCollapsed$: Observable<boolean>;
85+
8286
constructor(
8387
@Inject(APP_CONFIG) protected appConfig: AppConfig,
8488
public dsoNameService: DSONameService,
89+
public truncateService: TruncatableService
8590
) {
8691
}
8792

8893
ngOnInit(): void {
8994
this.showThumbnails = this.showThumbnails ?? this.appConfig.browseBy.showThumbnails;
9095
this.dsoTitle = this.dsoNameService.getHitHighlights(this.object, this.item);
96+
this.isCollapsed$ = this.truncateService.isCollapsed(this.item.uuid);
9197
}
92-
9398
}

‎src/app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component.html‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,9 +35,18 @@
3535
[innerHTML]="firstMetadataValue('dc.date.issued')"></span>)
3636
</ng-container>
3737
<span *ngIf="dso.allMetadataValues(authorMetadata).length > 0" class="item-list-authors">
38-
<span *ngFor="let author of dso.allMetadata(authorMetadata); let i=index; let last=last;">
39-
<ds-metadata-link-view [item]="dso" [metadata]="author" [metadataName]="authorMetadata"></ds-metadata-link-view><span *ngIf="!last">; </span>
40-
</span>
38+
<ng-container *ngVar="(isCollapsed() | async) as isCollapsed">
39+
<ng-container *ngIf="isCollapsed">
40+
<span *ngFor="let author of dso.limitedMetadata(authorMetadata, additionalMetadataLimit); let i=index; let last=last;">
41+
<ds-metadata-link-view [item]="dso" [metadata]="author" [metadataName]="authorMetadata"></ds-metadata-link-view><span *ngIf="!last">; </span>
42+
</span>
43+
</ng-container>
44+
<ng-container *ngIf="!isCollapsed">
45+
<span *ngFor="let author of dso.allMetadata(authorMetadata); let i=index; let last=last;">
46+
<ds-metadata-link-view [item]="dso" [metadata]="author" [metadataName]="authorMetadata"></ds-metadata-link-view><span *ngIf="!last">; </span>
47+
</span>
48+
</ng-container>
49+
</ng-container>
4150
</span>
4251
</ds-truncatable-part>
4352
</span>

‎src/app/shared/object-list/search-result-list-element/item-search-result/item-types/item/item-search-result-list-element.component.spec.ts‎

Lines changed: 32 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -186,13 +186,17 @@ const enviromentNoThumbs = {
186186
}
187187
};
188188

189+
const truncatableServiceStub = {
190+
isCollapsed: (id: number) => observableOf(true),
191+
};
192+
189193
describe('ItemSearchResultListElementComponent', () => {
190194
beforeEach(waitForAsync(() => {
191195
TestBed.configureTestingModule({
192196
imports: [TranslateModule.forRoot()],
193197
declarations: [ItemSearchResultListElementComponent, TruncatePipe, VarDirective],
194198
providers: [
195-
{ provide: TruncatableService, useValue: {} },
199+
{ provide: TruncatableService, useValue: truncatableServiceStub },
196200
{ provide: DSONameService, useClass: DSONameServiceMock },
197201
{ provide: APP_CONFIG, useValue: environmentUseThumbs }
198202
],
@@ -247,6 +251,32 @@ describe('ItemSearchResultListElementComponent', () => {
247251
});
248252
});
249253

254+
describe('When the item has authors and isCollapsed is true', () => {
255+
beforeEach(() => {
256+
spyOn(publicationListElementComponent, 'isCollapsed').and.returnValue(observableOf(true));
257+
publicationListElementComponent.object = mockItemWithMetadata;
258+
fixture.detectChanges();
259+
});
260+
261+
it('should show limitedMetadata', () => {
262+
const authorElements = fixture.debugElement.queryAll(By.css('span.item-list-authors ds-metadata-link-view'));
263+
expect(authorElements.length).toBe(mockItemWithMetadata.indexableObject.limitedMetadata(publicationListElementComponent.authorMetadata, publicationListElementComponent.additionalMetadataLimit).length);
264+
});
265+
});
266+
267+
describe('When the item has authors and isCollapsed is false', () => {
268+
beforeEach(() => {
269+
spyOn(publicationListElementComponent, 'isCollapsed').and.returnValue(observableOf(false));
270+
publicationListElementComponent.object = mockItemWithMetadata;
271+
fixture.detectChanges();
272+
});
273+
274+
it('should show allMetadata', () => {
275+
const authorElements = fixture.debugElement.queryAll(By.css('span.item-list-authors ds-metadata-link-view'));
276+
expect(authorElements.length).toBe(mockItemWithMetadata.indexableObject.allMetadata(publicationListElementComponent.authorMetadata).length);
277+
});
278+
});
279+
250280
describe('When the item has a publisher', () => {
251281
beforeEach(() => {
252282
publicationListElementComponent.object = mockItemWithMetadata;
@@ -375,7 +405,7 @@ describe('ItemSearchResultListElementComponent', () => {
375405
imports: [TranslateModule.forRoot()],
376406
declarations: [ItemSearchResultListElementComponent, TruncatePipe],
377407
providers: [
378-
{provide: TruncatableService, useValue: {}},
408+
{provide: TruncatableService, useValue: truncatableServiceStub},
379409
{provide: DSONameService, useClass: DSONameServiceMock},
380410
{ provide: APP_CONFIG, useValue: enviromentNoThumbs }
381411
],

‎src/app/shared/object-list/search-result-list-element/search-result-list-element.component.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { TruncatableService } from '../../truncatable/truncatable.service';
1111
import { Metadata } from '../../../core/shared/metadata.utils';
1212
import { DSONameService } from '../../../core/breadcrumbs/dso-name.service';
1313
import { APP_CONFIG, AppConfig } from '../../../../config/app-config.interface';
14+
import { environment } from '../../../../environments/environment';
1415

1516
@Component({
1617
selector: 'ds-search-result-list-element',
@@ -23,6 +24,11 @@ export class SearchResultListElementComponent<T extends SearchResult<K>, K exten
2324
dso: K;
2425
dsoTitle: string;
2526

27+
/**
28+
* Limit of additional metadata values to show
29+
*/
30+
additionalMetadataLimit = environment.followAuthorityMetadataValuesLimit;
31+
2632
public constructor(protected truncatableService: TruncatableService,
2733
public dsoNameService: DSONameService,
2834
@Inject(APP_CONFIG) protected appConfig?: AppConfig) {

0 commit comments

Comments
 (0)