27 files changed, 125 insertions, 95 deletions

diff --git a/client/package.json b/client/package.json
index 8c164ae0e..1b9863308 100644
--- a/client/package.json
+++ b/client/package.json
@@ -51,7 +51,6 @@
     "@ngx-loading-bar/core": "^5.0.0",
     "@ngx-loading-bar/http-client": "^5.0.0",
     "@ngx-loading-bar/router": "^5.0.0",
-    "@ngx-meta/core": "^9.0.0",
     "@types/chart.js": "^2.9.16",
     "@types/core-js": "^2.5.2",
     "@types/debug": "^4.1.5",
diff --git a/client/src/app/+about/about-routing.module.ts b/client/src/app/+about/about-routing.module.ts
index 96a737555..880bf4a39 100644
--- a/client/src/app/+about/about-routing.module.ts
+++ b/client/src/app/+about/about-routing.module.ts
@@ -1,17 +1,15 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
-import { AboutComponent } from './about.component'
-import { AboutInstanceComponent } from '@app/+about/about-instance/about-instance.component'
-import { AboutPeertubeComponent } from '@app/+about/about-peertube/about-peertube.component'
 import { AboutFollowsComponent } from '@app/+about/about-follows/about-follows.component'
+import { AboutInstanceComponent } from '@app/+about/about-instance/about-instance.component'
 import { AboutInstanceResolver } from '@app/+about/about-instance/about-instance.resolver'
+import { AboutPeertubeComponent } from '@app/+about/about-peertube/about-peertube.component'
+import { AboutComponent } from './about.component'
 
 const aboutRoutes: Routes = [
   {
     path: '',
     component: AboutComponent,
-    canActivateChild: [ MetaGuard ],
     children: [
       {
         path: '',
diff --git a/client/src/app/+accounts/accounts-routing.module.ts b/client/src/app/+accounts/accounts-routing.module.ts
index 3bf0f7185..2f3792a8d 100644
--- a/client/src/app/+accounts/accounts-routing.module.ts
+++ b/client/src/app/+accounts/accounts-routing.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
 import { AccountSearchComponent } from './account-search/account-search.component'
 import { AccountVideoChannelsComponent } from './account-video-channels/account-video-channels.component'
 import { AccountVideosComponent } from './account-videos/account-videos.component'
@@ -14,7 +13,6 @@ const accountsRoutes: Routes = [
   {
     path: ':accountId',
     component: AccountsComponent,
-    canActivateChild: [ MetaGuard ],
     children: [
       {
         path: '',
diff --git a/client/src/app/+admin/admin-routing.module.ts b/client/src/app/+admin/admin-routing.module.ts
index 986dae8eb..d029661d3 100644
--- a/client/src/app/+admin/admin-routing.module.ts
+++ b/client/src/app/+admin/admin-routing.module.ts
@@ -4,7 +4,6 @@ import { ConfigRoutes } from '@app/+admin/config'
 import { ModerationRoutes } from '@app/+admin/moderation/moderation.routes'
 import { PluginsRoutes } from '@app/+admin/plugins/plugins.routes'
 import { SystemRoutes } from '@app/+admin/system'
-import { MetaGuard } from '@ngx-meta/core'
 import { AdminComponent } from './admin.component'
 import { FollowsRoutes } from './follows'
 import { UsersRoutes } from './users'
@@ -13,8 +12,6 @@ const adminRoutes: Routes = [
   {
     path: '',
     component: AdminComponent,
-    canActivate: [ MetaGuard ],
-    canActivateChild: [ MetaGuard ],
     children: [
       {
         path: '',
diff --git a/client/src/app/+login/login-routing.module.ts b/client/src/app/+login/login-routing.module.ts
index 258ddc5c1..c5f0f23c2 100644
--- a/client/src/app/+login/login-routing.module.ts
+++ b/client/src/app/+login/login-routing.module.ts
@@ -1,14 +1,12 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
-import { LoginComponent } from './login.component'
 import { ServerConfigResolver } from '@app/core/routing/server-config-resolver.service'
+import { LoginComponent } from './login.component'
 
 const loginRoutes: Routes = [
   {
     path: '',
     component: LoginComponent,
-    canActivate: [ MetaGuard ],
     data: {
       meta: {
         title: $localize`Login`
diff --git a/client/src/app/+my-account/my-account-routing.module.ts b/client/src/app/+my-account/my-account-routing.module.ts
index e2f8660fb..ef39c1a36 100644
--- a/client/src/app/+my-account/my-account-routing.module.ts
+++ b/client/src/app/+my-account/my-account-routing.module.ts
@@ -1,20 +1,19 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
 import { LoginGuard } from '../core'
 import { MyAccountAbusesListComponent } from './my-account-abuses/my-account-abuses-list.component'
+import { MyAccountApplicationsComponent } from './my-account-applications/my-account-applications.component'
 import { MyAccountBlocklistComponent } from './my-account-blocklist/my-account-blocklist.component'
 import { MyAccountServerBlocklistComponent } from './my-account-blocklist/my-account-server-blocklist.component'
 import { MyAccountNotificationsComponent } from './my-account-notifications/my-account-notifications.component'
 import { MyAccountSettingsComponent } from './my-account-settings/my-account-settings.component'
 import { MyAccountComponent } from './my-account.component'
-import { MyAccountApplicationsComponent } from './my-account-applications/my-account-applications.component'
 
 const myAccountRoutes: Routes = [
   {
     path: '',
     component: MyAccountComponent,
-    canActivateChild: [ MetaGuard, LoginGuard ],
+    canActivateChild: [ LoginGuard ],
     children: [
       {
         path: '',
diff --git a/client/src/app/+my-library/my-library-routing.module.ts b/client/src/app/+my-library/my-library-routing.module.ts
index d8e5aa562..76894bed8 100644
--- a/client/src/app/+my-library/my-library-routing.module.ts
+++ b/client/src/app/+my-library/my-library-routing.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
 import { LoginGuard } from '../core'
 import { MyHistoryComponent } from './my-history/my-history.component'
 import { MyLibraryComponent } from './my-library.component'
@@ -17,7 +16,7 @@ const myLibraryRoutes: Routes = [
   {
     path: '',
     component: MyLibraryComponent,
-    canActivateChild: [ MetaGuard, LoginGuard ],
+    canActivateChild: [ LoginGuard ],
     children: [
       {
         path: '',
diff --git a/client/src/app/+reset-password/reset-password-routing.module.ts b/client/src/app/+reset-password/reset-password-routing.module.ts
index 7f1ba2f68..3532cdbc1 100644
--- a/client/src/app/+reset-password/reset-password-routing.module.ts
+++ b/client/src/app/+reset-password/reset-password-routing.module.ts
@@ -1,16 +1,14 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
 import { ResetPasswordComponent } from './reset-password.component'
 
 const resetPasswordRoutes: Routes = [
   {
     path: '',
     component: ResetPasswordComponent,
-    canActivate: [ MetaGuard ],
     data: {
       meta: {
-        title: `Reset password`
+        title: $localize`Reset password`
       }
     }
   }
diff --git a/client/src/app/+search/search-routing.module.ts b/client/src/app/+search/search-routing.module.ts
index e5d7d1ede..0d778af0d 100644
--- a/client/src/app/+search/search-routing.module.ts
+++ b/client/src/app/+search/search-routing.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
 import { ChannelLazyLoadResolver } from './channel-lazy-load.resolver'
 import { SearchComponent } from './search.component'
 import { VideoLazyLoadResolver } from './video-lazy-load.resolver'
@@ -9,7 +8,6 @@ const searchRoutes: Routes = [
   {
     path: '',
     component: SearchComponent,
-    canActivate: [ MetaGuard ],
     data: {
       meta: {
         title: $localize`Search`
@@ -19,7 +17,6 @@ const searchRoutes: Routes = [
   {
     path: 'lazy-load-video',
     component: SearchComponent,
-    canActivate: [ MetaGuard ],
     resolve: {
       data: VideoLazyLoadResolver
     }
@@ -27,7 +24,6 @@ const searchRoutes: Routes = [
   {
     path: 'lazy-load-channel',
     component: SearchComponent,
-    canActivate: [ MetaGuard ],
     resolve: {
       data: ChannelLazyLoadResolver
     }
diff --git a/client/src/app/+search/search.component.ts b/client/src/app/+search/search.component.ts
index ecede19a3..dcf654b7a 100644
--- a/client/src/app/+search/search.component.ts
+++ b/client/src/app/+search/search.component.ts
@@ -1,12 +1,11 @@
 import { forkJoin, of, Subscription } from 'rxjs'
 import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
-import { AuthService, ComponentPagination, HooksService, Notifier, ServerService, User, UserService } from '@app/core'
+import { AuthService, ComponentPagination, HooksService, MetaService, Notifier, ServerService, User, UserService } from '@app/core'
 import { immutableAssign } from '@app/helpers'
 import { Video, VideoChannel } from '@app/shared/shared-main'
 import { AdvancedSearch, SearchService } from '@app/shared/shared-search'
 import { MiniatureDisplayOptions, VideoLinkType } from '@app/shared/shared-video-miniature'
-import { MetaService } from '@ngx-meta/core'
 import { SearchTargetType, ServerConfig } from '@shared/models'
 
 @Component({
@@ -238,7 +237,10 @@ export class SearchComponent implements OnInit, OnDestroy {
   }
 
   private updateTitle () {
-    const suffix = this.currentSearch ? ' ' + this.currentSearch : ''
+    const suffix = this.currentSearch
+      ? ' ' + this.currentSearch
+      : ''
+
     this.metaService.setTitle($localize`Search` + suffix)
   }
 
diff --git a/client/src/app/+signup/+register/register-routing.module.ts b/client/src/app/+signup/+register/register-routing.module.ts
index 61a2fa42d..dabe79fa5 100644
--- a/client/src/app/+signup/+register/register-routing.module.ts
+++ b/client/src/app/+signup/+register/register-routing.module.ts
@@ -1,14 +1,13 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
 import { ServerConfigResolver, UnloggedGuard } from '@app/core'
-import { MetaGuard } from '@ngx-meta/core'
 import { RegisterComponent } from './register.component'
 
 const registerRoutes: Routes = [
   {
     path: '',
     component: RegisterComponent,
-    canActivate: [ MetaGuard, UnloggedGuard ],
+    canActivate: [ UnloggedGuard ],
     data: {
       meta: {
         title: $localize`Register`
diff --git a/client/src/app/+signup/+verify-account/verify-account-routing.module.ts b/client/src/app/+signup/+verify-account/verify-account-routing.module.ts
index 67c80ae93..1bc636345 100644
--- a/client/src/app/+signup/+verify-account/verify-account-routing.module.ts
+++ b/client/src/app/+signup/+verify-account/verify-account-routing.module.ts
@@ -1,13 +1,11 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
-import { VerifyAccountEmailComponent } from './verify-account-email/verify-account-email.component'
 import { VerifyAccountAskSendEmailComponent } from './verify-account-ask-send-email/verify-account-ask-send-email.component'
+import { VerifyAccountEmailComponent } from './verify-account-email/verify-account-email.component'
 
 const verifyAccountRoutes: Routes = [
   {
     path: '',
-    canActivateChild: [ MetaGuard ],
     children: [
       {
         path: 'email',
diff --git a/client/src/app/+video-channels/video-channels-routing.module.ts b/client/src/app/+video-channels/video-channels-routing.module.ts
index fcaad8934..4ee052873 100644
--- a/client/src/app/+video-channels/video-channels-routing.module.ts
+++ b/client/src/app/+video-channels/video-channels-routing.module.ts
@@ -1,6 +1,5 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
 import { VideoChannelPlaylistsComponent } from './video-channel-playlists/video-channel-playlists.component'
 import { VideoChannelVideosComponent } from './video-channel-videos/video-channel-videos.component'
 import { VideoChannelsComponent } from './video-channels.component'
@@ -9,7 +8,6 @@ const videoChannelsRoutes: Routes = [
   {
     path: ':videoChannelName',
     component: VideoChannelsComponent,
-    canActivateChild: [ MetaGuard ],
     children: [
       {
         path: '',
diff --git a/client/src/app/+videos/+video-edit/video-add-routing.module.ts b/client/src/app/+videos/+video-edit/video-add-routing.module.ts
index 9ff66bea0..3b9a5ab3a 100644
--- a/client/src/app/+videos/+video-edit/video-add-routing.module.ts
+++ b/client/src/app/+videos/+video-edit/video-add-routing.module.ts
@@ -1,14 +1,13 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
 import { CanDeactivateGuard, LoginGuard } from '@app/core'
-import { MetaGuard } from '@ngx-meta/core'
 import { VideoAddComponent } from './video-add.component'
 
 const videoAddRoutes: Routes = [
   {
     path: '',
     component: VideoAddComponent,
-    canActivate: [ MetaGuard, LoginGuard ],
+    canActivate: [ LoginGuard ],
     canDeactivate: [ CanDeactivateGuard ]
   }
 ]
diff --git a/client/src/app/+videos/+video-edit/video-update-routing.module.ts b/client/src/app/+videos/+video-edit/video-update-routing.module.ts
index a04351b05..ba9167dd0 100644
--- a/client/src/app/+videos/+video-edit/video-update-routing.module.ts
+++ b/client/src/app/+videos/+video-edit/video-update-routing.module.ts
@@ -1,7 +1,6 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
 import { CanDeactivateGuard, LoginGuard } from '@app/core'
-import { MetaGuard } from '@ngx-meta/core'
 import { VideoUpdateComponent } from './video-update.component'
 import { VideoUpdateResolver } from './video-update.resolver'
 
@@ -9,7 +8,7 @@ const videoUpdateRoutes: Routes = [
   {
     path: '',
     component: VideoUpdateComponent,
-    canActivate: [ MetaGuard, LoginGuard ],
+    canActivate: [ LoginGuard ],
     canDeactivate: [ CanDeactivateGuard ],
     resolve: {
       videoData: VideoUpdateResolver
diff --git a/client/src/app/+videos/+video-watch/video-watch-routing.module.ts b/client/src/app/+videos/+video-watch/video-watch-routing.module.ts
index d8fecb87d..cb77685c0 100644
--- a/client/src/app/+videos/+video-watch/video-watch-routing.module.ts
+++ b/client/src/app/+videos/+video-watch/video-watch-routing.module.ts
@@ -1,13 +1,11 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
-import { MetaGuard } from '@ngx-meta/core'
 import { VideoWatchComponent } from './video-watch.component'
 
 const videoWatchRoutes: Routes = [
   {
     path: 'playlist/:playlistId',
-    component: VideoWatchComponent,
-    canActivate: [ MetaGuard ]
+    component: VideoWatchComponent
   },
   {
     path: ':videoId/comments/:commentId',
@@ -15,8 +13,7 @@ const videoWatchRoutes: Routes = [
   },
   {
     path: ':videoId',
-    component: VideoWatchComponent,
-    canActivate: [ MetaGuard ]
+    component: VideoWatchComponent
   }
 ]
 
diff --git a/client/src/app/+videos/+video-watch/video-watch.component.ts b/client/src/app/+videos/+video-watch/video-watch.component.ts
index 77405d149..88c5cef52 100644
--- a/client/src/app/+videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/+videos/+video-watch/video-watch.component.ts
@@ -9,6 +9,7 @@ import {
   AuthUser,
   ConfirmService,
   MarkdownService,
+  MetaService,
   Notifier,
   PeerTubeSocket,
   RestExtractor,
@@ -25,7 +26,6 @@ import { SupportModalComponent } from '@app/shared/shared-support-modal'
 import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription'
 import { VideoActionsDisplayType, VideoDownloadComponent } from '@app/shared/shared-video-miniature'
 import { VideoPlaylist, VideoPlaylistService } from '@app/shared/shared-video-playlist'
-import { MetaService } from '@ngx-meta/core'
 import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
 import { HttpStatusCode } from '@shared/core-utils/miscs/http-error-codes'
 import { ServerConfig, ServerErrorCode, UserVideoRateType, VideoCaption, VideoPrivacy, VideoState } from '@shared/models'
diff --git a/client/src/app/+videos/videos-routing.module.ts b/client/src/app/+videos/videos-routing.module.ts
index 16e3b9bb2..f9f476b18 100644
--- a/client/src/app/+videos/videos-routing.module.ts
+++ b/client/src/app/+videos/videos-routing.module.ts
@@ -1,7 +1,6 @@
 import { NgModule } from '@angular/core'
 import { RouterModule, Routes } from '@angular/router'
 import { LoginGuard } from '@app/core'
-import { MetaGuard } from '@ngx-meta/core'
 import { VideoTrendingComponent } from './video-list'
 import { VideoOverviewComponent } from './video-list/overview/video-overview.component'
 import { VideoLocalComponent } from './video-list/video-local.component'
@@ -13,7 +12,6 @@ const videosRoutes: Routes = [
   {
     path: '',
     component: VideosComponent,
-    canActivateChild: [ MetaGuard ],
     children: [
       {
         path: 'overview',
diff --git a/client/src/app/app-routing.module.ts b/client/src/app/app-routing.module.ts
index 57e485e8e..4e3cce590 100644
--- a/client/src/app/app-routing.module.ts
+++ b/client/src/app/app-routing.module.ts
@@ -3,7 +3,7 @@ import { RouteReuseStrategy, RouterModule, Routes } from '@angular/router'
 import { CustomReuseStrategy } from '@app/core/routing/custom-reuse-strategy'
 import { MenuGuards } from '@app/core/routing/menu-guard.service'
 import { POSSIBLE_LOCALES } from '@shared/core-utils/i18n'
-import { PreloadSelectedModulesList } from './core'
+import { MetaGuard, PreloadSelectedModulesList } from './core'
 import { EmptyComponent } from './empty.component'
 
 const routes: Routes = [
@@ -11,7 +11,8 @@ const routes: Routes = [
     path: 'admin',
     canActivate: [ MenuGuards.close() ],
     canDeactivate: [ MenuGuards.open() ],
-    loadChildren: () => import('./+admin/admin.module').then(m => m.AdminModule)
+    loadChildren: () => import('./+admin/admin.module').then(m => m.AdminModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'home',
@@ -19,51 +20,63 @@ const routes: Routes = [
   },
   {
     path: 'my-account',
-    loadChildren: () => import('./+my-account/my-account.module').then(m => m.MyAccountModule)
+    loadChildren: () => import('./+my-account/my-account.module').then(m => m.MyAccountModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'my-library',
-    loadChildren: () => import('./+my-library/my-library.module').then(m => m.MyLibraryModule)
+    loadChildren: () => import('./+my-library/my-library.module').then(m => m.MyLibraryModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'verify-account',
-    loadChildren: () => import('./+signup/+verify-account/verify-account.module').then(m => m.VerifyAccountModule)
+    loadChildren: () => import('./+signup/+verify-account/verify-account.module').then(m => m.VerifyAccountModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'accounts',
-    loadChildren: () => import('./+accounts/accounts.module').then(m => m.AccountsModule)
+    loadChildren: () => import('./+accounts/accounts.module').then(m => m.AccountsModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'video-channels',
-    loadChildren: () => import('./+video-channels/video-channels.module').then(m => m.VideoChannelsModule)
+    loadChildren: () => import('./+video-channels/video-channels.module').then(m => m.VideoChannelsModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'about',
-    loadChildren: () => import('./+about/about.module').then(m => m.AboutModule)
+    loadChildren: () => import('./+about/about.module').then(m => m.AboutModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'signup',
-    loadChildren: () => import('./+signup/+register/register.module').then(m => m.RegisterModule)
+    loadChildren: () => import('./+signup/+register/register.module').then(m => m.RegisterModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'reset-password',
-    loadChildren: () => import('./+reset-password/reset-password.module').then(m => m.ResetPasswordModule)
+    loadChildren: () => import('./+reset-password/reset-password.module').then(m => m.ResetPasswordModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'login',
-    loadChildren: () => import('./+login/login.module').then(m => m.LoginModule)
+    loadChildren: () => import('./+login/login.module').then(m => m.LoginModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'search',
-    loadChildren: () => import('./+search/search.module').then(m => m.SearchModule)
+    loadChildren: () => import('./+search/search.module').then(m => m.SearchModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'videos',
-    loadChildren: () => import('./+videos/videos.module').then(m => m.VideosModule)
+    loadChildren: () => import('./+videos/videos.module').then(m => m.VideosModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'remote-interaction',
-    loadChildren: () => import('./+remote-interaction/remote-interaction.module').then(m => m.RemoteInteractionModule)
+    loadChildren: () => import('./+remote-interaction/remote-interaction.module').then(m => m.RemoteInteractionModule),
+    canActivateChild: [ MetaGuard ]
   },
   {
     path: 'video-playlists/watch',
diff --git a/client/src/app/app.module.ts b/client/src/app/app.module.ts
index 3cec6d739..9f46d49a2 100644
--- a/client/src/app/app.module.ts
+++ b/client/src/app/app.module.ts
@@ -4,9 +4,7 @@ import { APP_BASE_HREF, registerLocaleData } from '@angular/common'
 import { NgModule } from '@angular/core'
 import { BrowserModule } from '@angular/platform-browser'
 import { ServiceWorkerModule } from '@angular/service-worker'
-import { ServerService } from '@app/core'
 import localeOc from '@app/helpers/locales/oc'
-import { MetaLoader, MetaModule, MetaStaticLoader, PageTitlePositioning } from '@ngx-meta/core'
 import { AppRoutingModule } from './app-routing.module'
 import { AppComponent } from './app.component'
 import { CoreModule } from './core'
@@ -19,12 +17,12 @@ import { CustomModalComponent } from './modal/custom-modal.component'
 import { InstanceConfigWarningModalComponent } from './modal/instance-config-warning-modal.component'
 import { QuickSettingsModalComponent } from './modal/quick-settings-modal.component'
 import { WelcomeModalComponent } from './modal/welcome-modal.component'
+import { SharedActorImageModule } from './shared/shared-actor-image/shared-actor-image.module'
 import { SharedFormModule } from './shared/shared-forms'
 import { SharedGlobalIconModule } from './shared/shared-icons'
 import { SharedInstanceModule } from './shared/shared-instance'
 import { SharedMainModule } from './shared/shared-main'
 import { SharedUserInterfaceSettingsModule } from './shared/shared-user-settings'
-import { SharedActorImageModule } from './shared/shared-actor-image/shared-actor-image.module'
 
 registerLocaleData(localeOc, 'oc')
 
@@ -62,22 +60,6 @@ registerLocaleData(localeOc, 'oc')
     SharedInstanceModule,
     SharedActorImageModule,
 
-    MetaModule.forRoot({
-      provide: MetaLoader,
-      useFactory: (serverService: ServerService) => {
-        return new MetaStaticLoader({
-          pageTitlePositioning: PageTitlePositioning.PrependPageTitle,
-          pageTitleSeparator: ' - ',
-          get applicationName () { return serverService.getTmpConfig().instance.name },
-          defaults: {
-            get title () { return serverService.getTmpConfig().instance.name },
-            get description () { return serverService.getTmpConfig().instance.shortDescription }
-          }
-        })
-      },
-      deps: [ ServerService ]
-    }),
-
     AppRoutingModule // Put it after all the module because it has the 404 route
   ],
 
diff --git a/client/src/app/core/core.module.ts b/client/src/app/core/core.module.ts
index 3152a7003..de3274544 100644
--- a/client/src/app/core/core.module.ts
+++ b/client/src/app/core/core.module.ts
@@ -14,7 +14,7 @@ import { throwIfAlreadyLoaded } from './module-import-guard'
 import { Notifier } from './notification'
 import { HtmlRendererService, LinkifierService, MarkdownService } from './renderer'
 import { RestExtractor, RestService } from './rest'
-import { LoginGuard, RedirectService, UnloggedGuard, UserRightGuard } from './routing'
+import { LoginGuard, MetaGuard, MetaService, RedirectService, UnloggedGuard, UserRightGuard } from './routing'
 import { CanDeactivateGuard } from './routing/can-deactivate-guard.service'
 import { ServerConfigResolver } from './routing/server-config-resolver.service'
 import { ScopedTokensService } from './scoped-tokens'
@@ -77,7 +77,10 @@ import { LocalStorageService, ScreenService, SessionStorageService } from './wra
     MessageService,
     PeerTubeSocket,
     ServerConfigResolver,
-    CanDeactivateGuard
+    CanDeactivateGuard,
+
+    MetaService,
+    MetaGuard
   ]
 })
 export class CoreModule {
diff --git a/client/src/app/core/routing/index.ts b/client/src/app/core/routing/index.ts
index 239c27caf..4314ea475 100644
--- a/client/src/app/core/routing/index.ts
+++ b/client/src/app/core/routing/index.ts
@@ -3,6 +3,8 @@ export * from './custom-reuse-strategy'
 export * from './disable-for-reuse-hook'
 export * from './login-guard.service'
 export * from './menu-guard.service'
+export * from './meta-guard.service'
+export * from './meta.service'
 export * from './preload-selected-modules-list'
 export * from './redirect.service'
 export * from './server-config-resolver.service'
diff --git a/client/src/app/core/routing/meta-guard.service.ts b/client/src/app/core/routing/meta-guard.service.ts
new file mode 100644
index 000000000..bedb3450e
--- /dev/null
+++ b/client/src/app/core/routing/meta-guard.service.ts
@@ -0,0 +1,23 @@
+import { Injectable } from '@angular/core'
+import { ActivatedRouteSnapshot, CanActivate, CanActivateChild, RouterStateSnapshot } from '@angular/router'
+import { MetaService } from './meta.service'
+
+@Injectable()
+export class MetaGuard implements CanActivate, CanActivateChild {
+
+  constructor (private meta: MetaService) { }
+
+  canActivate (route: ActivatedRouteSnapshot): boolean {
+    const metaSettings = route.data?.meta
+
+    if (metaSettings) {
+      this.meta.update(metaSettings)
+    }
+
+    return true
+  }
+
+  canActivateChild (route: ActivatedRouteSnapshot): boolean {
+    return this.canActivate(route)
+  }
+}
diff --git a/client/src/app/core/routing/meta.service.ts b/client/src/app/core/routing/meta.service.ts
new file mode 100644
index 000000000..a5ac778dc
--- /dev/null
+++ b/client/src/app/core/routing/meta.service.ts
@@ -0,0 +1,40 @@
+import { Injectable } from '@angular/core'
+import { Meta, Title } from '@angular/platform-browser'
+import { HTMLServerConfig } from '@shared/models/server'
+import { ServerService } from '../server'
+
+export interface MetaSettings {
+  title?: string
+}
+
+@Injectable()
+export class MetaService {
+  private config: HTMLServerConfig
+
+  constructor (
+    private titleService: Title,
+    private meta: Meta,
+    private server: ServerService
+  ) {
+    this.config = this.server.getTmpConfig()
+    this.server.getConfig()
+      .subscribe(config => this.config = config)
+  }
+
+  setTitle (subTitle?: string) {
+    let title = ''
+    if (subTitle) title += `${subTitle} - `
+
+    title += this.config.instance.name
+
+    this.titleService.setTitle(title)
+  }
+
+  setTag (name: string, value: string) {
+    this.meta.addTag({ name, content: value })
+  }
+
+  update (meta: MetaSettings) {
+    this.setTitle(meta.title)
+  }
+}
diff --git a/client/src/root-helpers/peertube-web-storage.ts b/client/src/root-helpers/peertube-web-storage.ts
index f29845443..d4cad8a20 100644
--- a/client/src/root-helpers/peertube-web-storage.ts
+++ b/client/src/root-helpers/peertube-web-storage.ts
@@ -4,17 +4,19 @@ const valuesMap = new Map()
 
 function proxify (instance: MemoryStorage) {
   return new Proxy(instance, {
-    set: function (obj, prop: string | number, value) {
+    set: function (obj, prop: string | symbol, value) {
       if (MemoryStorage.prototype.hasOwnProperty(prop)) {
-        instance[prop] = value
+        // FIXME: symbol typing issue https://github.com/microsoft/TypeScript/issues/1863
+        instance[prop as any] = value
       } else {
         instance.setItem(prop, value)
       }
       return true
     },
-    get: function (target, name: string | number) {
+    get: function (target, name: string | symbol | number) {
       if (MemoryStorage.prototype.hasOwnProperty(name)) {
-        return instance[name]
+        // FIXME: symbol typing issue https://github.com/microsoft/TypeScript/issues/1863
+        return instance[name as any]
       }
       if (valuesMap.has(name)) {
         return instance.getItem(name)
@@ -23,9 +25,8 @@ function proxify (instance: MemoryStorage) {
   })
 }
 
-class MemoryStorage {
+class MemoryStorage implements Storage {
   [key: string]: any
-  [index: number]: string
 
   getItem (key: any) {
     const stringKey = String(key)
diff --git a/client/tsconfig.base.json b/client/tsconfig.base.json
index 9f63ac11a..68e902d26 100644
--- a/client/tsconfig.base.json
+++ b/client/tsconfig.base.json
@@ -7,7 +7,6 @@
     "declaration": false,
     "moduleResolution": "node",
     "module": "esnext",
-    "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
     "noImplicitAny": true,
     "noImplicitThis": true,
diff --git a/client/yarn.lock b/client/yarn.lock
index aeafe81a2..beeedefdb 100644
--- a/client/yarn.lock
+++ b/client/yarn.lock
@@ -1468,11 +1468,6 @@
   dependencies:
     tslib "^1.10.0"
 
-"@ngx-meta/core@^9.0.0":
-  version "9.0.0"
-  resolved "https://registry.yarnpkg.com/@ngx-meta/core/-/core-9.0.0.tgz#2c3b27bd32d41f7aaf0712d4007e0afed8e5dd3f"
-  integrity sha512-WL/HyKM+4gJPS3TNTO0M+46LlIvGTSyofL//8hxoozAyRPsiMyR0xrwUvPBJkVqFyD6j0iI5FaNcQ9d0JCVJhg==
-
 "@nodelib/fs.scandir@2.1.4":
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.4.tgz#d4b3549a5db5de2683e0c1071ab4f140904bbf69"