12 files changed, 24 insertions, 19 deletions

diff --git a/client/src/app/+admin/plugins/plugins.routes.ts b/client/src/app/+admin/plugins/plugins.routes.ts
index 02e8fd324..4bef27be3 100644
--- a/client/src/app/+admin/plugins/plugins.routes.ts
+++ b/client/src/app/+admin/plugins/plugins.routes.ts
@@ -1,11 +1,10 @@
 import { Routes } from '@angular/router'
-
-import { UserRightGuard } from '../../core'
-import { UserRight } from '../../../../../shared'
 import { PluginListInstalledComponent } from '@app/+admin/plugins/plugin-list-installed/plugin-list-installed.component'
 import { PluginSearchComponent } from '@app/+admin/plugins/plugin-search/plugin-search.component'
 import { PluginShowInstalledComponent } from '@app/+admin/plugins/plugin-show-installed/plugin-show-installed.component'
 import { PluginsComponent } from '@app/+admin/plugins/plugins.component'
+import { UserRightGuard } from '@app/core'
+import { UserRight } from '@shared/models'
 
 export const PluginsRoutes: Routes = [
   {
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 8fa4b0635..22ec42520 100644
--- a/client/src/app/+admin/users/user-edit/user-edit.ts
+++ b/client/src/app/+admin/users/user-edit/user-edit.ts
@@ -1,9 +1,10 @@
-import { OnInit } from '@angular/core'
+import { OnInit, Directive } from '@angular/core'
 import { ConfigService } from '@app/+admin/config/shared/config.service'
 import { AuthService, ScreenService, ServerService, User } from '@app/core'
 import { FormReactive } from '@app/shared/shared-forms'
 import { ServerConfig, USER_ROLE_LABELS, UserAdminFlag, UserRole, VideoResolution } from '@shared/models'
 
+@Directive()
 export abstract class UserEdit extends FormReactive implements OnInit {
   videoQuotaOptions: { value: string, label: string, disabled?: boolean }[] = []
   videoQuotaDailyOptions: { value: string, label: string, disabled?: boolean }[] = []
diff --git a/client/src/app/+videos/+video-edit/video-add-components/video-send.ts b/client/src/app/+videos/+video-edit/video-add-components/video-send.ts
index 94479321d..5d11ba7ce 100644
--- a/client/src/app/+videos/+video-edit/video-add-components/video-send.ts
+++ b/client/src/app/+videos/+video-edit/video-add-components/video-send.ts
@@ -1,5 +1,5 @@
 import { catchError, switchMap, tap } from 'rxjs/operators'
-import { EventEmitter, OnInit } from '@angular/core'
+import { EventEmitter, OnInit, Directive } from '@angular/core'
 import { AuthService, CanComponentDeactivateResult, Notifier, ServerService } from '@app/core'
 import { populateAsyncUserVideoChannels } from '@app/helpers'
 import { FormReactive } from '@app/shared/shared-forms'
@@ -7,6 +7,7 @@ import { VideoCaptionEdit, VideoCaptionService, VideoEdit, VideoService } from '
 import { LoadingBarService } from '@ngx-loading-bar/core'
 import { ServerConfig, VideoConstant, VideoPrivacy } from '@shared/models'
 
+@Directive()
 export abstract class VideoSend extends FormReactive implements OnInit {
   userVideoChannels: { id: number, label: string, support: string }[] = []
   videoPrivacies: VideoConstant<VideoPrivacy>[] = []
diff --git a/client/src/app/app.component.scss b/client/src/app/app.component.scss
index 38ec11b5b..e8447719a 100644
--- a/client/src/app/app.component.scss
+++ b/client/src/app/app.component.scss
@@ -3,6 +3,8 @@
 @import '~bootstrap/scss/functions';
 @import '~bootstrap/scss/variables';
 
+$assets-path: '../assets';
+
 .peertube-container {
   padding-bottom: 20px;
 }
@@ -39,7 +41,7 @@
 
       &.icon-menu {
         background-color: pvar(--mainForegroundColor);
-        mask-image: url('../assets/images/misc/menu.svg');
+        mask-image: url('#{$assets-path}/images/misc/menu.svg');
         margin: 0 18px 0 20px;
       }
     }
@@ -62,7 +64,6 @@
 
       .icon.icon-logo {
         display: inline-block;
-        background-repeat: no-repeat;
         width: 23px;
         height: 24px;
         margin-right: .5rem;
diff --git a/client/src/app/shared/shared-instance/instance-follow.service.ts b/client/src/app/shared/shared-instance/instance-follow.service.ts
index 3c9ccc40f..e52660140 100644
--- a/client/src/app/shared/shared-instance/instance-follow.service.ts
+++ b/client/src/app/shared/shared-instance/instance-follow.service.ts
@@ -4,7 +4,7 @@ import { catchError, map } from 'rxjs/operators'
 import { HttpClient, HttpParams } from '@angular/common/http'
 import { Injectable } from '@angular/core'
 import { RestExtractor, RestPagination, RestService } from '@app/core'
-import { ActivityPubActorType, ActorFollow, FollowState, ResultList } from '@shared/index'
+import { ActivityPubActorType, ActorFollow, FollowState, ResultList } from '@shared/models'
 import { environment } from '../../../environments/environment'
 
 @Injectable()
diff --git a/client/src/app/shared/shared-main/video/video.service.ts b/client/src/app/shared/shared-main/video/video.service.ts
index ee3549695..edaefa9f2 100644
--- a/client/src/app/shared/shared-main/video/video.service.ts
+++ b/client/src/app/shared/shared-main/video/video.service.ts
@@ -1,4 +1,3 @@
-import { FfprobeData } from 'fluent-ffmpeg'
 import { Observable } from 'rxjs'
 import { catchError, map, switchMap } from 'rxjs/operators'
 import { HttpClient, HttpParams, HttpRequest } from '@angular/common/http'
@@ -19,7 +18,8 @@ import {
   VideoFilter,
   VideoPrivacy,
   VideoSortField,
-  VideoUpdate
+  VideoUpdate,
+  VideoFileMetadata
 } from '@shared/models'
 import { environment } from '../../../../environments/environment'
 import { Account, AccountService } from '../account'
@@ -275,7 +275,7 @@ export class VideoService implements VideosProvider {
 
   getVideoFileMetadata (metadataUrl: string) {
     return this.authHttp
-               .get<FfprobeData>(metadataUrl)
+               .get<VideoFileMetadata>(metadataUrl)
                .pipe(
                  catchError(err => this.restExtractor.handleError(err))
                )
diff --git a/client/src/app/shared/shared-moderation/account-blocklist.component.ts b/client/src/app/shared/shared-moderation/account-blocklist.component.ts
index 38e0d0424..11e554978 100644
--- a/client/src/app/shared/shared-moderation/account-blocklist.component.ts
+++ b/client/src/app/shared/shared-moderation/account-blocklist.component.ts
@@ -1,11 +1,12 @@
 import { SortMeta } from 'primeng/api'
-import { OnInit } from '@angular/core'
+import { OnInit, Directive } from '@angular/core'
 import { Notifier, RestPagination, RestTable } from '@app/core'
 import { Actor } from '@app/shared/shared-main'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { AccountBlock } from './account-block.model'
 import { BlocklistComponentType, BlocklistService } from './blocklist.service'
 
+@Directive()
 export class GenericAccountBlocklistComponent extends RestTable implements OnInit {
   // @ts-ignore: "Abstract methods can only appear within an abstract class"
   abstract mode: BlocklistComponentType
diff --git a/client/src/app/shared/shared-moderation/server-blocklist.component.ts b/client/src/app/shared/shared-moderation/server-blocklist.component.ts
index d904d0605..694b03762 100644
--- a/client/src/app/shared/shared-moderation/server-blocklist.component.ts
+++ b/client/src/app/shared/shared-moderation/server-blocklist.component.ts
@@ -1,11 +1,12 @@
 import { SortMeta } from 'primeng/api'
-import { OnInit, ViewChild } from '@angular/core'
+import { OnInit, ViewChild, Directive } from '@angular/core'
 import { BatchDomainsModalComponent } from '@app/shared/shared-moderation/batch-domains-modal.component'
 import { Notifier, RestPagination, RestTable } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
 import { ServerBlock } from '@shared/models'
 import { BlocklistComponentType, BlocklistService } from './blocklist.service'
 
+@Directive()
 export class GenericServerBlocklistComponent extends RestTable implements OnInit {
   @ViewChild('batchDomainsModal') batchDomainsModal: BatchDomainsModalComponent
 
diff --git a/client/src/app/shared/shared-video-miniature/abstract-video-list.ts b/client/src/app/shared/shared-video-miniature/abstract-video-list.ts
index 0ef842652..405af5fa6 100644
--- a/client/src/app/shared/shared-video-miniature/abstract-video-list.ts
+++ b/client/src/app/shared/shared-video-miniature/abstract-video-list.ts
@@ -1,6 +1,6 @@
 import { fromEvent, Observable, Subject, Subscription } from 'rxjs'
 import { debounceTime, switchMap, tap } from 'rxjs/operators'
-import { OnDestroy, OnInit } from '@angular/core'
+import { OnDestroy, OnInit, Directive } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import {
   AuthService,
@@ -30,6 +30,7 @@ enum GroupDate {
   OLDER = 5
 }
 
+@Directive()
 export abstract class AbstractVideoList implements OnInit, OnDestroy, DisableForReuseHook {
   pagination: ComponentPaginationLight = {
     currentPage: 1,
diff --git a/client/src/app/shared/shared-video-miniature/video-download.component.ts b/client/src/app/shared/shared-video-miniature/video-download.component.ts
index 21df8b674..4fd06eacf 100644
--- a/client/src/app/shared/shared-video-miniature/video-download.component.ts
+++ b/client/src/app/shared/shared-video-miniature/video-download.component.ts
@@ -1,4 +1,3 @@
-import { FfprobeFormat, FfprobeStream } from 'fluent-ffmpeg'
 import { mapValues, pick } from 'lodash-es'
 import { BytesPipe } from 'ngx-pipes'
 import { Component, ElementRef, ViewChild } from '@angular/core'
@@ -144,7 +143,7 @@ export class VideoDownloadComponent {
     this.type = type
   }
 
-  getMetadataFormat (format: FfprobeFormat) {
+  getMetadataFormat (format: any) {
     const keyToTranslateFunction = {
       'encoder': (value: string) => ({ label: this.i18n('Encoder'), value }),
       'format_long_name': (value: string) => ({ label: this.i18n('Format name'), value }),
@@ -165,7 +164,7 @@ export class VideoDownloadComponent {
     )
   }
 
-  getMetadataStream (streams: FfprobeStream[], type: 'video' | 'audio') {
+  getMetadataStream (streams: any[], type: 'video' | 'audio') {
     const stream = streams.find(s => s.codec_type === type)
     if (!stream) return undefined
 
@@ -201,6 +200,7 @@ export class VideoDownloadComponent {
   private hydrateMetadataFromMetadataUrl (file: VideoFile) {
     const observable = this.videoService.getVideoFileMetadata(file.metadataUrl)
     observable.subscribe(res => file.metadata = res)
+
     return observable.toPromise()
   }
 }
diff --git a/client/src/app/shared/shared-video-miniature/video-miniature.component.ts b/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
index f434550dd..3c7046de5 100644
--- a/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
+++ b/client/src/app/shared/shared-video-miniature/video-miniature.component.ts
@@ -12,7 +12,7 @@ import {
 } from '@angular/core'
 import { AuthService, ScreenService, ServerService, User } from '@app/core'
 import { I18n } from '@ngx-translate/i18n-polyfill'
-import { ServerConfig, VideoPlaylistType, VideoPrivacy, VideoState } from '../../../../../shared'
+import { ServerConfig, VideoPlaylistType, VideoPrivacy, VideoState } from '@shared/models'
 import { Video } from '../shared-main'
 import { VideoPlaylistService } from '../shared-video-playlist'
 import { VideoActionsDisplayType } from './video-actions-dropdown.component'
diff --git a/client/src/app/shared/shared-video-playlist/video-playlist-element.model.ts b/client/src/app/shared/shared-video-playlist/video-playlist-element.model.ts
index 27a79d1fd..f25f10ede 100644
--- a/client/src/app/shared/shared-video-playlist/video-playlist-element.model.ts
+++ b/client/src/app/shared/shared-video-playlist/video-playlist-element.model.ts
@@ -1,5 +1,5 @@
-import { VideoPlaylistElement as ServerVideoPlaylistElement, VideoPlaylistElementType } from '../../../../../shared/models/videos'
 import { Video } from '@app/shared/shared-main'
+import { VideoPlaylistElement as ServerVideoPlaylistElement, VideoPlaylistElementType } from '@shared/models'
 
 export class VideoPlaylistElement implements ServerVideoPlaylistElement {
   id: number