From 2fbe7f1933f4bd5de96e6428234e56965616120e Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Thu, 15 Nov 2018 09:24:56 +0100 Subject: [PATCH] Fix new Angular 7 issues --- client/package.json | 1 - .../app/+admin/users/user-edit/user-edit.ts | 2 +- .../users/user-list/user-list.component.html | 2 +- .../users/user-list/user-list.component.ts | 2 +- .../my-account-video-channel-edit.ts | 4 + client/src/app/header/header.component.scss | 2 +- client/src/app/shared/forms/index.ts | 1 + .../forms/textarea-autoresize.directive.ts | 25 + client/src/app/shared/misc/from-now.pipe.ts | 5 +- client/src/app/shared/shared.module.ts | 10 +- .../comment/video-comment-add.component.html | 2 +- .../comment/video-comment-add.component.ts | 2 +- .../videos/+video-watch/video-watch.module.ts | 2 - .../header/{upload.svg => upload-white.svg} | 0 client/yarn.lock | 874 +++++++++--------- scripts/travis.sh | 2 +- 16 files changed, 499 insertions(+), 437 deletions(-) create mode 100644 client/src/app/shared/forms/textarea-autoresize.directive.ts rename client/src/assets/images/header/{upload.svg => upload-white.svg} (100%) diff --git a/client/package.json b/client/package.json index 94e1855a7..a28832c50 100644 --- a/client/package.json +++ b/client/package.json @@ -129,7 +129,6 @@ "ngx-clipboard": "11.1.7", "ngx-pipes": "^2.1.7", "ngx-qrcode2": "^0.0.9", - "ngx-textarea-autosize": "^2.0.0", "node-sass": "^4.9.3", "npm-font-source-sans-pro": "^1.0.2", "path-browserify": "^1.0.0", diff --git a/client/src/app/+admin/users/user-edit/user-edit.ts b/client/src/app/+admin/users/user-edit/user-edit.ts index 99ce5804b..0b3511e8e 100644 --- a/client/src/app/+admin/users/user-edit/user-edit.ts +++ b/client/src/app/+admin/users/user-edit/user-edit.ts @@ -4,10 +4,10 @@ import { USER_ROLE_LABELS, VideoResolution } from '../../../../../../shared' import { ConfigService } from '@app/+admin/config/shared/config.service' export abstract class UserEdit extends FormReactive { - videoQuotaOptions: { value: string, label: string }[] = [] videoQuotaDailyOptions: { value: string, label: string }[] = [] roles = Object.keys(USER_ROLE_LABELS).map(key => ({ value: key.toString(), label: USER_ROLE_LABELS[key] })) + username: string protected abstract serverService: ServerService protected abstract configService: ConfigService diff --git a/client/src/app/+admin/users/user-list/user-list.component.html b/client/src/app/+admin/users/user-list/user-list.component.html index eb8d30e17..5684004a5 100644 --- a/client/src/app/+admin/users/user-list/user-list.component.html +++ b/client/src/app/+admin/users/user-list/user-list.component.html @@ -86,4 +86,4 @@ - + diff --git a/client/src/app/+admin/users/user-list/user-list.component.ts b/client/src/app/+admin/users/user-list/user-list.component.ts index 3859af9ff..31e783622 100644 --- a/client/src/app/+admin/users/user-list/user-list.component.ts +++ b/client/src/app/+admin/users/user-list/user-list.component.ts @@ -66,7 +66,7 @@ export class UserListComponent extends RestTable implements OnInit { this.userBanModal.openModal(users) } - onUsersBanned () { + onUserChanged () { this.loadData() } diff --git a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.ts b/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.ts index ccdd9a3dc..4dc65dd99 100644 --- a/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.ts +++ b/client/src/app/+my-account/my-account-video-channels/my-account-video-channel-edit.ts @@ -4,7 +4,11 @@ import { VideoChannel } from '@app/shared/video-channel/video-channel.model' export abstract class MyAccountVideoChannelEdit extends FormReactive { // We need it even in the create component because it's used in the edit template videoChannelToUpdate: VideoChannel + instanceHost: string abstract isCreation (): boolean abstract getFormButtonTitle (): string + + // FIXME: We need this method so angular does not complain in the child template + onAvatarChange (formData: FormData) { /* empty */ } } diff --git a/client/src/app/header/header.component.scss b/client/src/app/header/header.component.scss index bd03c338a..2f9820665 100644 --- a/client/src/app/header/header.component.scss +++ b/client/src/app/header/header.component.scss @@ -50,7 +50,7 @@ .icon.icon-upload { @include icon(22px); - background-image: url('../../assets/images/header/upload.svg'); + background-image: url('../../assets/images/header/upload-white.svg'); height: 24px; vertical-align: middle; margin-right: 6px; diff --git a/client/src/app/shared/forms/index.ts b/client/src/app/shared/forms/index.ts index 41c321c4c..8febbfee9 100644 --- a/client/src/app/shared/forms/index.ts +++ b/client/src/app/shared/forms/index.ts @@ -1,3 +1,4 @@ export * from './form-validators' export * from './form-reactive' export * from './reactive-file.component' +export * from './textarea-autoresize.directive' diff --git a/client/src/app/shared/forms/textarea-autoresize.directive.ts b/client/src/app/shared/forms/textarea-autoresize.directive.ts new file mode 100644 index 000000000..f8c855c16 --- /dev/null +++ b/client/src/app/shared/forms/textarea-autoresize.directive.ts @@ -0,0 +1,25 @@ +// Thanks: https://github.com/evseevdev/ngx-textarea-autosize +import { AfterViewInit, Directive, ElementRef, HostBinding, HostListener } from '@angular/core' + +@Directive({ + selector: 'textarea[myAutoResize]' +}) +export class TextareaAutoResizeDirective implements AfterViewInit { + @HostBinding('attr.rows') rows = '1' + @HostBinding('style.overflow') overflow = 'hidden' + + constructor (private elem: ElementRef) { } + + public ngAfterViewInit () { + this.resize() + } + + @HostListener('input') + resize () { + const textarea = this.elem.nativeElement as HTMLTextAreaElement + // Reset textarea height to auto that correctly calculate the new height + textarea.style.height = 'auto' + // Set new height + textarea.style.height = `${textarea.scrollHeight}px` + } +} diff --git a/client/src/app/shared/misc/from-now.pipe.ts b/client/src/app/shared/misc/from-now.pipe.ts index 33e6d25fe..00b5be6c9 100644 --- a/client/src/app/shared/misc/from-now.pipe.ts +++ b/client/src/app/shared/misc/from-now.pipe.ts @@ -7,8 +7,9 @@ export class FromNowPipe implements PipeTransform { constructor (private i18n: I18n) { } - transform (value: number) { - const seconds = Math.floor((Date.now() - value) / 1000) + transform (arg: number | Date | string) { + const argDate = new Date(arg) + const seconds = Math.floor((Date.now() - argDate.getTime()) / 1000) let interval = Math.floor(seconds / 31536000) if (interval > 1) { diff --git a/client/src/app/shared/shared.module.ts b/client/src/app/shared/shared.module.ts index 0ec2a9b15..a2fa27b72 100644 --- a/client/src/app/shared/shared.module.ts +++ b/client/src/app/shared/shared.module.ts @@ -37,13 +37,15 @@ import { LoginValidatorsService, ReactiveFileComponent, ResetPasswordValidatorsService, + TextareaAutoResizeDirective, UserValidatorsService, VideoAbuseValidatorsService, + VideoAcceptOwnershipValidatorsService, VideoBlacklistValidatorsService, + VideoChangeOwnershipValidatorsService, VideoChannelValidatorsService, VideoCommentValidatorsService, - VideoValidatorsService, - VideoChangeOwnershipValidatorsService, VideoAcceptOwnershipValidatorsService + VideoValidatorsService } from '@app/shared/forms' import { I18nPrimengCalendarService } from '@app/shared/i18n/i18n-primeng-calendar' import { ScreenService } from '@app/shared/misc/screen.service' @@ -53,7 +55,7 @@ import { PeertubeCheckboxComponent } from '@app/shared/forms/peertube-checkbox.c import { VideoImportService } from '@app/shared/video-import/video-import.service' import { ActionDropdownComponent } from '@app/shared/buttons/action-dropdown.component' import { NgbDropdownModule, NgbModalModule, NgbPopoverModule, NgbTabsetModule, NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap' -import { SubscribeButtonComponent, RemoteSubscribeComponent, UserSubscriptionService } from '@app/shared/user-subscription' +import { RemoteSubscribeComponent, SubscribeButtonComponent, UserSubscriptionService } from '@app/shared/user-subscription' import { InstanceFeaturesTableComponent } from '@app/shared/instance/instance-features-table.component' import { OverviewService } from '@app/shared/overview' import { UserBanModalComponent } from '@app/shared/moderation' @@ -92,6 +94,7 @@ import { BlocklistService } from '@app/shared/blocklist' FromNowPipe, MarkdownTextareaComponent, InfiniteScrollerDirective, + TextareaAutoResizeDirective, HelpComponent, ReactiveFileComponent, PeertubeCheckboxComponent, @@ -129,6 +132,7 @@ import { BlocklistService } from '@app/shared/blocklist' ActionDropdownComponent, MarkdownTextareaComponent, InfiniteScrollerDirective, + TextareaAutoResizeDirective, HelpComponent, ReactiveFileComponent, PeertubeCheckboxComponent, diff --git a/client/src/app/videos/+video-watch/comment/video-comment-add.component.html b/client/src/app/videos/+video-watch/comment/video-comment-add.component.html index b58a56596..d8a7a78c4 100644 --- a/client/src/app/videos/+video-watch/comment/video-comment-add.component.html +++ b/client/src/app/videos/+video-watch/comment/video-comment-add.component.html @@ -3,7 +3,7 @@ Avatar
-