diff --git a/package.json b/package.json index 6896556574..50e223ccfd 100755 --- a/package.json +++ b/package.json @@ -1,10 +1,10 @@ { "name": "planet", "license": "AGPL-3.0", - "version": "0.16.10", + "version": "0.16.11", "myplanet": { - "latest": "v0.21.42", - "min": "v0.20.42" + "latest": "v0.21.43", + "min": "v0.20.43" }, "scripts": { "ng": "ng", diff --git a/src/app/shared/forms/planet-tag-input-dialog.component.html b/src/app/shared/forms/planet-tag-input-dialog.component.html index eeb210d37a..b26ea2446b 100644 --- a/src/app/shared/forms/planet-tag-input-dialog.component.html +++ b/src/app/shared/forms/planet-tag-input-dialog.component.html @@ -68,7 +68,7 @@ subdirectory_arrow_right - {{subTag.name + ' (' + (subTag.count || 0) + ')'}} + {{ truncateTagName(subTag) }} diff --git a/src/app/shared/forms/planet-tag-input-dialog.component.ts b/src/app/shared/forms/planet-tag-input-dialog.component.ts index fdff521c14..9b86062c86 100644 --- a/src/app/shared/forms/planet-tag-input-dialog.component.ts +++ b/src/app/shared/forms/planet-tag-input-dialog.component.ts @@ -1,4 +1,4 @@ -import { Component, Inject, Input } from '@angular/core'; +import { Component, Inject, Input, HostListener } from '@angular/core'; import { FormGroup, FormBuilder } from '@angular/forms'; import { MAT_DIALOG_DATA, MatDialogRef, MatDialog } from '@angular/material/dialog'; import { TagsService } from './tags.service'; @@ -6,6 +6,7 @@ import { PlanetMessageService } from '../planet-message.service'; import { ValidatorService } from '../../validators/validator.service'; import { DialogsFormService } from '../dialogs/dialogs-form.service'; import { UserService } from '../user.service'; +import { DeviceInfoService, DeviceType } from '../../shared/device-info.service'; import { CustomValidators } from '../../validators/custom-validators'; import { mapToArray, isInMap } from '../utils'; import { DialogsLoadingService } from '../../shared/dialogs/dialogs-loading.service'; @@ -52,6 +53,8 @@ export class PlanetTagInputDialogComponent { get okClickValue() { return { wasOkClicked: true, indeterminate: this.indeterminate ? mapToArray(this.indeterminate, true) : [] }; } + deviceType: DeviceType; + deviceTypes: typeof DeviceType = DeviceType; constructor( public dialogRef: MatDialogRef, @@ -63,7 +66,8 @@ export class PlanetTagInputDialogComponent { private dialogsFormService: DialogsFormService, private userService: UserService, private dialogsLoadingService: DialogsLoadingService, - private dialog: MatDialog + private dialog: MatDialog, + private deviceInfoService: DeviceInfoService, ) { this.dataInit(); // April 17, 2019: Removing selectMany toggle, but may revisit later @@ -80,8 +84,13 @@ export class PlanetTagInputDialogComponent { attachedTo: [ [] ] }); this.isUserAdmin = this.userService.get().isUserAdmin; + this.deviceType = this.deviceInfoService.getDeviceType(); } + @HostListener('window:resize') OnResize() { + this.deviceType = this.deviceInfoService.getDeviceType(); + } + dataInit() { this.tags = this.filterTags(this.filterValue); this.mode = this.data.mode; @@ -268,6 +277,12 @@ export class PlanetTagInputDialogComponent { return checkValue(this.selected.entries()); } + truncateTagName(subTag: { name: string; count?: number }, maxLength: number): string { + if (this.deviceType === this.deviceTypes.DESKTOP) { maxLength = 50; } else { maxLength = 25; } + const truncatedName = subTag.name.length > maxLength ? subTag.name.slice(0, maxLength) + '...' : subTag.name; + return `${truncatedName} (${subTag.count || 0})`; + } + } @Component({