From 34425008d4e3ce8b42126d05bb5d6110ef7148cf Mon Sep 17 00:00:00 2001 From: Joseph Milazzo Date: Fri, 9 Aug 2024 11:30:28 -0500 Subject: [PATCH] Fixed a bad highlight color and fixed 5 missing localization areas. --- UI/Web/src/app/_services/action.service.ts | 6 +++--- .../bulk-add-to-collection.component.html | 2 +- .../bulk-add-to-collection.component.scss | 2 +- .../bulk-add-to-collection.component.ts | 1 + .../user-stats-info-cards.component.ts | 16 +++++++++++----- UI/Web/src/assets/langs/en.json | 11 ++++++++--- 6 files changed, 25 insertions(+), 13 deletions(-) diff --git a/UI/Web/src/app/_services/action.service.ts b/UI/Web/src/app/_services/action.service.ts index 54d7207cf4..3d290f9c53 100644 --- a/UI/Web/src/app/_services/action.service.ts +++ b/UI/Web/src/app/_services/action.service.ts @@ -469,7 +469,7 @@ export class ActionService implements OnDestroy { this.readingListModalRef.componentInstance.seriesId = seriesId; this.readingListModalRef.componentInstance.volumeIds = volumes.map(v => v.id); this.readingListModalRef.componentInstance.chapterIds = chapters?.map(c => c.id); - this.readingListModalRef.componentInstance.title = 'Multiple Selections'; + this.readingListModalRef.componentInstance.title = translate('action.multiple-selections'); this.readingListModalRef.componentInstance.type = ADD_FLOW.Multiple; @@ -509,7 +509,7 @@ export class ActionService implements OnDestroy { if (this.readingListModalRef != null) { return; } this.readingListModalRef = this.modalService.open(AddToListModalComponent, { scrollable: true, size: 'md', fullscreen: 'md' }); this.readingListModalRef.componentInstance.seriesIds = series.map(v => v.id); - this.readingListModalRef.componentInstance.title = 'Multiple Selections'; + this.readingListModalRef.componentInstance.title = translate('action.multiple-selections'); this.readingListModalRef.componentInstance.type = ADD_FLOW.Multiple_Series; @@ -537,7 +537,7 @@ export class ActionService implements OnDestroy { if (this.collectionModalRef != null) { return; } this.collectionModalRef = this.modalService.open(BulkAddToCollectionComponent, { scrollable: true, size: 'md', windowClass: 'collection', fullscreen: 'md' }); this.collectionModalRef.componentInstance.seriesIds = series.map(v => v.id); - this.collectionModalRef.componentInstance.title = 'New Collection'; + this.collectionModalRef.componentInstance.title = translate('action.new-collection'); this.collectionModalRef.closed.pipe(take(1)).subscribe(() => { this.collectionModalRef = null; diff --git a/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.html b/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.html index fad45f7c31..38fbff6c8d 100644 --- a/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.html +++ b/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.html @@ -6,7 +6,7 @@
- @if (lists.length >= 5) { + @if (lists.length >= MaxItems) {
diff --git a/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.scss b/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.scss index 03416cd052..17e5bc30aa 100644 --- a/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.scss +++ b/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.scss @@ -1,5 +1,5 @@ .clickable:hover, .clickable:focus { - background-color: lightgreen; + background-color: var(--list-group-hover-bg-color, --primary-color); } .collection { diff --git a/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.ts b/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.ts index c83fbdf3d5..2a40ebc354 100644 --- a/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.ts +++ b/UI/Web/src/app/cards/_modals/bulk-add-to-collection/bulk-add-to-collection.component.ts @@ -35,6 +35,7 @@ export class BulkAddToCollectionComponent implements OnInit, AfterViewInit { private readonly collectionService = inject(CollectionTagService); private readonly toastr = inject(ToastrService); private readonly cdRef = inject(ChangeDetectorRef); + protected readonly MaxItems = 8; @Input({required: true}) title!: string; /** diff --git a/UI/Web/src/app/statistics/_components/user-stats-info-cards/user-stats-info-cards.component.ts b/UI/Web/src/app/statistics/_components/user-stats-info-cards/user-stats-info-cards.component.ts index 065d7ab1b3..6d80b0a498 100644 --- a/UI/Web/src/app/statistics/_components/user-stats-info-cards/user-stats-info-cards.component.ts +++ b/UI/Web/src/app/statistics/_components/user-stats-info-cards/user-stats-info-cards.component.ts @@ -8,7 +8,7 @@ import { DecimalPipe } from '@angular/common'; import { IconAndTitleComponent } from '../../../shared/icon-and-title/icon-and-title.component'; import {AccountService} from "../../../_services/account.service"; import {CompactNumberPipe} from "../../../_pipes/compact-number.pipe"; -import {TranslocoDirective} from "@ngneat/transloco"; +import {translate, TranslocoDirective} from "@ngneat/transloco"; @Component({ selector: 'app-user-stats-info-cards', @@ -33,8 +33,11 @@ export class UserStatsInfoCardsComponent { const numberPipe = new CompactNumberPipe(); this.statsService.getPagesPerYear().subscribe(yearCounts => { const ref = this.modalService.open(GenericListModalComponent, { scrollable: true }); - ref.componentInstance.items = yearCounts.map(t => `${t.name}: ${numberPipe.transform(t.value)} pages`); - ref.componentInstance.title = 'Pages Read By Year'; + ref.componentInstance.items = yearCounts.map(t => { + const countStr = translate('user-stats-info-cards.pages-count', {num: numberPipe.transform(t.value)}); + return `${t.name}: ${countStr})`; + }); + ref.componentInstance.title = translate('user-stats-info-cards.pages-read-by-year-title'); }); } @@ -42,8 +45,11 @@ export class UserStatsInfoCardsComponent { const numberPipe = new CompactNumberPipe(); this.statsService.getWordsPerYear().subscribe(yearCounts => { const ref = this.modalService.open(GenericListModalComponent, { scrollable: true }); - ref.componentInstance.items = yearCounts.map(t => `${t.name}: ${numberPipe.transform(t.value)} words`); - ref.componentInstance.title = 'Words Read By Year'; + ref.componentInstance.items = yearCounts.map(t => { + const countStr = translate('user-stats-info-cards.words-count', {num: numberPipe.transform(t.value)}); + return `${t.name}: ${countStr})`; + }); + ref.componentInstance.title = translate('user-stats-info-cards.words-read-by-year-title'); }); } } diff --git a/UI/Web/src/assets/langs/en.json b/UI/Web/src/assets/langs/en.json index 1a81f70105..a120246136 100644 --- a/UI/Web/src/assets/langs/en.json +++ b/UI/Web/src/assets/langs/en.json @@ -370,8 +370,11 @@ "chapters-read-tooltip": "{{user-stats-info-cards.chapters-read-label}}: {{value}}", "avg-reading-per-week-label": "Average Reading / Week", "last-active-label": "Last Active", - "chapters": "{{value}} chapters" - + "chapters": "{{value}} chapters", + "pages-read-by-year-title": "Pages Read By Year", + "words-read-by-year-title": "Words Read By Year", + "words-count": "{{num}} words", + "pages-count": "{{num}} pages" }, "user-stats": { @@ -2306,7 +2309,9 @@ "mark-visible": "Mark as Visible", "mark-invisible": "Mark as Invisible", "unpromote": "Un-Promote", - "promote": "Promote" + "promote": "Promote", + "new-collection": "New Collection", + "multiple-selections": "Multiple Selections" }, "preferences": {