diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html index b154324c7..b3a29aed4 100644 --- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html +++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html @@ -15,7 +15,7 @@ } @if (document && displayFields?.includes(DisplayField.TAGS)) { -
+
@for (tagID of tagIDs; track tagID) { } diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss index 508c5251a..dce77802e 100644 --- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss +++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss @@ -72,4 +72,14 @@ a { max-width: 80%; row-gap: .2rem; line-height: 1; + + &.tags-no-wrap { + ::ng-deep .badge { + display: inline-block; + max-width: 100%; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + } } diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts index 63cfc5a50..982b3980b 100644 --- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts +++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts @@ -82,6 +82,16 @@ describe('DocumentCardSmallComponent', () => { ).toHaveLength(6) }) + it('should clear hidden tag counter when tag count falls below the limit', () => { + expect(component.moreTags).toEqual(3) + + component.document.tags = [1, 2, 3, 4, 5, 6] + fixture.detectChanges() + + expect(component.moreTags).toBeNull() + expect(fixture.nativeElement.textContent).not.toContain('+ 3') + }) + it('should try to close the preview on mouse leave', () => { component.popupPreview = { close: jest.fn(), diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts index ad428dfab..05f84d752 100644 --- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts +++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts @@ -126,6 +126,7 @@ export class DocumentCardSmallComponent this.moreTags = this.document.tags.length - (limit - 1) return this.document.tags.slice(0, limit - 1) } else { + this.moreTags = null return this.document.tags } }