From 66357162f8e1227495f09bd4f68446aad7071c6d Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Wed, 12 Aug 2020 10:40:04 +0200 Subject: Migrate to $localize * Remove i18n polyfill to translate things in components * Reduce bundle sizes * Improve runtime perf * Reduce a lot the time to make a full client build * Reduce client build complexity * We don't need a service to translate things anymore (so we will be able to translate title pages etc) Unfortunately we may loose some translations in the migration process. I'll put a message on weblate to notify translators --- .../shared-abuse-list/abuse-details.component.ts | 21 +++--- .../abuse-list-table.component.ts | 77 ++++++++++------------ .../abuse-message-modal.component.ts | 10 ++- .../moderation-comment-modal.component.ts | 8 +-- 4 files changed, 51 insertions(+), 65 deletions(-) (limited to 'client/src/app/shared/shared-abuse-list') diff --git a/client/src/app/shared/shared-abuse-list/abuse-details.component.ts b/client/src/app/shared/shared-abuse-list/abuse-details.component.ts index 0e872079a..282a6fe19 100644 --- a/client/src/app/shared/shared-abuse-list/abuse-details.component.ts +++ b/client/src/app/shared/shared-abuse-list/abuse-details.component.ts @@ -1,7 +1,6 @@ import { Component, Input } from '@angular/core' import { durationToString } from '@app/helpers' import { Actor } from '@app/shared/shared-main' -import { I18n } from '@ngx-translate/i18n-polyfill' import { AbusePredefinedReasonsString } from '@shared/models' import { ProcessedAbuse } from './processed-abuse.model' @@ -17,18 +16,16 @@ export class AbuseDetailsComponent { private predefinedReasonsTranslations: { [key in AbusePredefinedReasonsString]: string } - constructor ( - private i18n: I18n - ) { + constructor () { this.predefinedReasonsTranslations = { - violentOrRepulsive: this.i18n('Violent or Repulsive'), - hatefulOrAbusive: this.i18n('Hateful or Abusive'), - spamOrMisleading: this.i18n('Spam or Misleading'), - privacy: this.i18n('Privacy'), - rights: this.i18n('Copyright'), - serverRules: this.i18n('Server rules'), - thumbnails: this.i18n('Thumbnails'), - captions: this.i18n('Captions') + violentOrRepulsive: $localize`Violent or Repulsive`, + hatefulOrAbusive: $localize`Hateful or Abusive`, + spamOrMisleading: $localize`Spam or Misleading`, + privacy: $localize`Privacy`, + rights: $localize`Copyright`, + serverRules: $localize`Server rules`, + thumbnails: $localize`Thumbnails`, + captions: $localize`Captions` } } diff --git a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts index c7dc5f4d2..cc933db0d 100644 --- a/client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts +++ b/client/src/app/shared/shared-abuse-list/abuse-list-table.component.ts @@ -1,16 +1,15 @@ import * as debug from 'debug' import truncate from 'lodash-es/truncate' import { SortMeta } from 'primeng/api' -import { buildVideoOrPlaylistEmbed, buildVideoLink } from 'src/assets/player/utils' +import { buildVideoLink, buildVideoOrPlaylistEmbed } from 'src/assets/player/utils' import { environment } from 'src/environments/environment' -import { AfterViewInit, Component, OnInit, ViewChild, Input } from '@angular/core' +import { AfterViewInit, Component, Input, OnInit, ViewChild } from '@angular/core' import { DomSanitizer } from '@angular/platform-browser' import { ActivatedRoute, Params, Router } from '@angular/router' import { ConfirmService, MarkdownService, Notifier, RestPagination, RestTable } from '@app/core' import { Account, Actor, DropdownAction, Video, VideoService } from '@app/shared/shared-main' import { AbuseService, BlocklistService, VideoBlockService } from '@app/shared/shared-moderation' import { VideoCommentService } from '@app/shared/shared-video-comment' -import { I18n } from '@ngx-translate/i18n-polyfill' import { AbuseState, AdminAbuse } from '@shared/models' import { AbuseMessageModalComponent } from './abuse-message-modal.component' import { ModerationCommentModalComponent } from './moderation-comment-modal.component' @@ -45,7 +44,6 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV private videoService: VideoService, private videoBlocklistService: VideoBlockService, private confirmService: ConfirmService, - private i18n: I18n, private markdownRenderer: MarkdownService, private sanitizer: DomSanitizer, private route: ActivatedRoute, @@ -157,12 +155,12 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV } async removeAbuse (abuse: AdminAbuse) { - const res = await this.confirmService.confirm(this.i18n('Do you really want to delete this abuse report?'), this.i18n('Delete')) + const res = await this.confirmService.confirm($localize`Do you really want to delete this abuse report?`, $localize`Delete`) if (res === false) return this.abuseService.removeAbuse(abuse).subscribe( () => { - this.notifier.success(this.i18n('Abuse deleted.')) + this.notifier.success($localize`Abuse deleted.`) this.loadData() }, @@ -238,7 +236,7 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV if (abuse.comment) { if (abuse.comment.deleted) { - abuse.truncatedCommentHtml = abuse.commentHtml = this.i18n('Deleted comment') + abuse.truncatedCommentHtml = abuse.commentHtml = $localize`Deleted comment` } else { const truncated = truncate(abuse.comment.text, { length: 100 }) abuse.truncatedCommentHtml = await this.markdownRenderer.textMarkdownToHTML(truncated, true) @@ -267,38 +265,38 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV private buildInternalActions (): DropdownAction[] { return [ { - label: this.i18n('Internal actions'), + label: $localize`Internal actions`, isHeader: true }, { label: this.isAdminView() - ? this.i18n('Messages with reporter') - : this.i18n('Messages with moderators'), + ? $localize`Messages with reporter` + : $localize`Messages with moderators`, handler: abuse => this.openAbuseMessagesModal(abuse), isDisplayed: abuse => this.isLocalAbuse(abuse) }, { - label: this.i18n('Update internal note'), + label: $localize`Update internal note`, handler: abuse => this.openModerationCommentModal(abuse), isDisplayed: abuse => this.isAdminView() && !!abuse.moderationComment }, { - label: this.i18n('Mark as accepted'), + label: $localize`Mark as accepted`, handler: abuse => this.updateAbuseState(abuse, AbuseState.ACCEPTED), isDisplayed: abuse => this.isAdminView() && !this.isAbuseAccepted(abuse) }, { - label: this.i18n('Mark as rejected'), + label: $localize`Mark as rejected`, handler: abuse => this.updateAbuseState(abuse, AbuseState.REJECTED), isDisplayed: abuse => this.isAdminView() && !this.isAbuseRejected(abuse) }, { - label: this.i18n('Add internal note'), + label: $localize`Add internal note`, handler: abuse => this.openModerationCommentModal(abuse), isDisplayed: abuse => this.isAdminView() && !abuse.moderationComment }, { - label: this.i18n('Delete report'), + label: $localize`Delete report`, handler: abuse => this.isAdminView() && this.removeAbuse(abuse) } ] @@ -309,19 +307,19 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV return [ { - label: this.i18n('Actions for the flagged account'), + label: $localize`Actions for the flagged account`, isHeader: true, isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video }, { - label: this.i18n('Mute account'), + label: $localize`Mute account`, isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video, handler: abuse => this.muteAccountHelper(abuse.flaggedAccount) }, { - label: this.i18n('Mute server account'), + label: $localize`Mute server account`, isDisplayed: abuse => abuse.flaggedAccount && !abuse.comment && !abuse.video, handler: abuse => this.muteServerHelper(abuse.flaggedAccount.host) } @@ -333,19 +331,19 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV return [ { - label: this.i18n('Actions for the reporter'), + label: $localize`Actions for the reporter`, isHeader: true, isDisplayed: abuse => !!abuse.reporterAccount }, { - label: this.i18n('Mute reporter'), + label: $localize`Mute reporter`, isDisplayed: abuse => !!abuse.reporterAccount, handler: abuse => this.muteAccountHelper(abuse.reporterAccount) }, { - label: this.i18n('Mute server'), + label: $localize`Mute server`, isDisplayed: abuse => abuse.reporterAccount && !abuse.reporterAccount.userId, handler: abuse => this.muteServerHelper(abuse.reporterAccount.host) } @@ -357,18 +355,18 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV return [ { - label: this.i18n('Actions for the video'), + label: $localize`Actions for the video`, isHeader: true, isDisplayed: abuse => abuse.video && !abuse.video.deleted }, { - label: this.i18n('Block video'), + label: $localize`Block video`, isDisplayed: abuse => abuse.video && !abuse.video.deleted && !abuse.video.blacklisted, handler: abuse => { this.videoBlocklistService.blockVideo(abuse.video.id, undefined, true) .subscribe( () => { - this.notifier.success(this.i18n('Video blocked.')) + this.notifier.success($localize`Video blocked.`) this.updateAbuseState(abuse, AbuseState.ACCEPTED) }, @@ -378,13 +376,13 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV } }, { - label: this.i18n('Unblock video'), + label: $localize`Unblock video`, isDisplayed: abuse => abuse.video && !abuse.video.deleted && abuse.video.blacklisted, handler: abuse => { this.videoBlocklistService.unblockVideo(abuse.video.id) .subscribe( () => { - this.notifier.success(this.i18n('Video unblocked.')) + this.notifier.success($localize`Video unblocked.`) this.updateAbuseState(abuse, AbuseState.ACCEPTED) }, @@ -394,19 +392,19 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV } }, { - label: this.i18n('Delete video'), + label: $localize`Delete video`, isDisplayed: abuse => abuse.video && !abuse.video.deleted, handler: async abuse => { const res = await this.confirmService.confirm( - this.i18n('Do you really want to delete this video?'), - this.i18n('Delete') + $localize`Do you really want to delete this video?`, + $localize`Delete` ) if (res === false) return this.videoService.removeVideo(abuse.video.id) .subscribe( () => { - this.notifier.success(this.i18n('Video deleted.')) + this.notifier.success($localize`Video deleted.`) this.updateAbuseState(abuse, AbuseState.ACCEPTED) }, @@ -423,25 +421,25 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV return [ { - label: this.i18n('Actions for the comment'), + label: $localize`Actions for the comment`, isHeader: true, isDisplayed: abuse => abuse.comment && !abuse.comment.deleted }, { - label: this.i18n('Delete comment'), + label: $localize`Delete comment`, isDisplayed: abuse => abuse.comment && !abuse.comment.deleted, handler: async abuse => { const res = await this.confirmService.confirm( - this.i18n('Do you really want to delete this comment?'), - this.i18n('Delete') + $localize`Do you really want to delete this comment?`, + $localize`Delete` ) if (res === false) return this.commentService.deleteVideoComment(abuse.comment.video.id, abuse.comment.id) .subscribe( () => { - this.notifier.success(this.i18n('Comment deleted.')) + this.notifier.success($localize`Comment deleted.`) this.updateAbuseState(abuse, AbuseState.ACCEPTED) }, @@ -457,10 +455,7 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV this.blocklistService.blockAccountByInstance(account) .subscribe( () => { - this.notifier.success( - this.i18n('Account {{nameWithHost}} muted by the instance.', { nameWithHost: account.nameWithHost }) - ) - + this.notifier.success($localize`Account ${account.nameWithHost} muted by the instance.`) account.mutedByInstance = true }, @@ -472,9 +467,7 @@ export class AbuseListTableComponent extends RestTable implements OnInit, AfterV this.blocklistService.blockServerByInstance(host) .subscribe( () => { - this.notifier.success( - this.i18n('Server {{host}} muted by the instance.', { host: host }) - ) + this.notifier.success($localize`Server ${host} muted by the instance.`) }, err => this.notifier.error(err.message) diff --git a/client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts b/client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts index 6686d91f4..0c3c8ff48 100644 --- a/client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts +++ b/client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts @@ -1,9 +1,8 @@ -import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core' -import { AuthService, Notifier, HtmlRendererService } from '@app/core' +import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core' +import { AuthService, HtmlRendererService, Notifier } from '@app/core' import { AbuseValidatorsService, FormReactive, FormValidatorService } from '@app/shared/shared-forms' import { NgbModal } from '@ng-bootstrap/ng-bootstrap' import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' -import { I18n } from '@ngx-translate/i18n-polyfill' import { AbuseMessage, UserAbuse } from '@shared/models' import { AbuseService } from '../shared-moderation' @@ -31,7 +30,6 @@ export class AbuseMessageModalComponent extends FormReactive implements OnInit { protected formValidatorService: FormValidatorService, private abuseValidatorsService: AbuseValidatorsService, private modalService: NgbModal, - private i18n: I18n, private htmlRenderer: HtmlRendererService, private auth: AuthService, private notifier: Notifier, @@ -99,10 +97,10 @@ export class AbuseMessageModalComponent extends FormReactive implements OnInit { getPlaceholderMessage () { if (this.isAdminView) { - return this.i18n('Add a message to communicate with the reporter') + return $localize`Add a message to communicate with the reporter` } - return this.i18n('Add a message to communicate with the moderation team') + return $localize`Add a message to communicate with the moderation team` } private loadMessages () { diff --git a/client/src/app/shared/shared-abuse-list/moderation-comment-modal.component.ts b/client/src/app/shared/shared-abuse-list/moderation-comment-modal.component.ts index ecb7966bf..fad7f888d 100644 --- a/client/src/app/shared/shared-abuse-list/moderation-comment-modal.component.ts +++ b/client/src/app/shared/shared-abuse-list/moderation-comment-modal.component.ts @@ -1,10 +1,9 @@ import { Component, EventEmitter, OnInit, Output, ViewChild } from '@angular/core' import { Notifier } from '@app/core' -import { FormReactive, FormValidatorService, AbuseValidatorsService } from '@app/shared/shared-forms' +import { AbuseValidatorsService, FormReactive, FormValidatorService } from '@app/shared/shared-forms' import { AbuseService } from '@app/shared/shared-moderation' import { NgbModal } from '@ng-bootstrap/ng-bootstrap' import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' -import { I18n } from '@ngx-translate/i18n-polyfill' import { AdminAbuse } from '@shared/models' @Component({ @@ -24,8 +23,7 @@ export class ModerationCommentModalComponent extends FormReactive implements OnI private modalService: NgbModal, private notifier: Notifier, private abuseService: AbuseService, - private abuseValidatorsService: AbuseValidatorsService, - private i18n: I18n + private abuseValidatorsService: AbuseValidatorsService ) { super() } @@ -57,7 +55,7 @@ export class ModerationCommentModalComponent extends FormReactive implements OnI this.abuseService.updateAbuse(this.abuseToComment, { moderationComment }) .subscribe( () => { - this.notifier.success(this.i18n('Comment updated.')) + this.notifier.success($localize`Comment updated.`) this.commentUpdated.emit(moderationComment) this.hide() -- cgit v1.2.3