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

3 files changed, 10 insertions, 14 deletions

diff --git a/client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts b/client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts
index 19e4bc1f4..537c7d08e 100644
--- a/client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts
+++ b/client/src/app/+video-channels/video-channel-about/video-channel-about.component.ts
@@ -2,7 +2,6 @@ import { Subscription } from 'rxjs'
 import { Component, OnDestroy, OnInit } from '@angular/core'
 import { MarkdownService } from '@app/core'
 import { VideoChannel, VideoChannelService } from '@app/shared/shared-main'
-import { I18n } from '@ngx-translate/i18n-polyfill'
 
 @Component({
   selector: 'my-video-channel-about',
@@ -17,7 +16,6 @@ export class VideoChannelAboutComponent implements OnInit, OnDestroy {
   private videoChannelSub: Subscription
 
   constructor (
-    private i18n: I18n,
     private videoChannelService: VideoChannelService,
     private markdownService: MarkdownService
   ) { }
@@ -40,6 +38,6 @@ export class VideoChannelAboutComponent implements OnInit, OnDestroy {
   getVideoChannelDescription () {
     if (this.descriptionHTML) return this.descriptionHTML
 
-    return this.i18n('No description')
+    return $localize`No description`
   }
 }
diff --git a/client/src/app/+video-channels/video-channel-videos/video-channel-videos.component.ts b/client/src/app/+video-channels/video-channel-videos/video-channel-videos.component.ts
index 599d38da9..e1ec6bbcb 100644
--- a/client/src/app/+video-channels/video-channel-videos/video-channel-videos.component.ts
+++ b/client/src/app/+video-channels/video-channel-videos/video-channel-videos.component.ts
@@ -6,7 +6,6 @@ import { AuthService, ConfirmService, LocalStorageService, Notifier, ScreenServi
 import { immutableAssign } from '@app/helpers'
 import { VideoChannel, VideoChannelService, VideoService } from '@app/shared/shared-main'
 import { AbstractVideoList } from '@app/shared/shared-video-miniature'
-import { I18n } from '@ngx-translate/i18n-polyfill'
 
 @Component({
   selector: 'my-video-channel-videos',
@@ -23,7 +22,6 @@ export class VideoChannelVideosComponent extends AbstractVideoList implements On
   private videoChannelSub: Subscription
 
   constructor (
-    protected i18n: I18n,
     protected router: Router,
     protected serverService: ServerService,
     protected route: ActivatedRoute,
@@ -38,7 +36,7 @@ export class VideoChannelVideosComponent extends AbstractVideoList implements On
   ) {
     super()
 
-    this.titlePage = this.i18n('Published videos')
+    this.titlePage = $localize`Published videos`
     this.displayOptions = {
       ...this.displayOptions,
       avatar: false
@@ -72,7 +70,9 @@ export class VideoChannelVideosComponent extends AbstractVideoList implements On
                .getVideoChannelVideos(this.videoChannel, newPagination, this.sort, this.nsfwPolicy)
                .pipe(
                  tap(({ total }) => {
-                   this.titlePage = this.i18n(`{total, plural, =1 {Published 1 video} other {Published {{total}} videos}}`, { total })
+                   this.titlePage = total === 1
+                    ? $localize`Published 1 video`
+                    : $localize`Published ${total} videos`
                  })
                )
   }
diff --git a/client/src/app/+video-channels/video-channels.component.ts b/client/src/app/+video-channels/video-channels.component.ts
index cae442ee7..ea8bda1cf 100644
--- a/client/src/app/+video-channels/video-channels.component.ts
+++ b/client/src/app/+video-channels/video-channels.component.ts
@@ -6,7 +6,6 @@ import { ActivatedRoute } from '@angular/router'
 import { AuthService, Notifier, RestExtractor, ScreenService } from '@app/core'
 import { ListOverflowItem, VideoChannel, VideoChannelService } from '@app/shared/shared-main'
 import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription'
-import { I18n } from '@ngx-translate/i18n-polyfill'
 
 @Component({
   templateUrl: './video-channels.component.html',
@@ -23,7 +22,6 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
   private routeSub: Subscription
 
   constructor (
-    private i18n: I18n,
     private route: ActivatedRoute,
     private notifier: Notifier,
     private authService: AuthService,
@@ -59,14 +57,14 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
           this.subscribeButton.unsubscribe() :
           this.subscribeButton.subscribe()
         return false
-      }, undefined, this.i18n('Subscribe to the account'))
+      }, undefined, $localize`Subscribe to the account`)
     ]
     if (this.isUserLoggedIn()) this.hotkeysService.add(this.hotkeys)
 
     this.links = [
-      { label: this.i18n('VIDEOS'), routerLink: 'videos' },
-      { label: this.i18n('VIDEO PLAYLISTS'), routerLink: 'video-playlists' },
-      { label: this.i18n('ABOUT'), routerLink: 'about' }
+      { label: $localize`VIDEOS`, routerLink: 'videos' },
+      { label: $localize`VIDEO PLAYLISTS`, routerLink: 'video-playlists' },
+      { label: $localize`ABOUT`, routerLink: 'about' }
     ]
   }
 
@@ -91,6 +89,6 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
   }
 
   activateCopiedMessage () {
-    this.notifier.success(this.i18n('Username copied'))
+    this.notifier.success($localize`Username copied`)
   }
 }