43 files changed, 511 insertions, 171 deletions

diff --git a/client/src/app/+about/about-instance/about-instance.component.html b/client/src/app/+about/about-instance/about-instance.component.html
index 1026c4e0d..7f2a6aa77 100644
--- a/client/src/app/+about/about-instance/about-instance.component.html
+++ b/client/src/app/+about/about-instance/about-instance.component.html
@@ -116,95 +116,99 @@
       <my-custom-markup-container [content]="descriptionContent"></my-custom-markup-container>
     </div>
 
-    <div class="anchor" id="moderation"></div>
-    <a
-      *ngIf="html.moderationInformation || html.codeOfConduct || html.terms"
-      class="anchor-link"
-      routerLink="/about/instance"
-      fragment="moderation"
-      #anchorLink
-      (click)="onClickCopyLink(anchorLink)">
-      <h2 i18n class="middle-title">
-        MODERATION
-      </h2>
-    </a>
-
-    <div class="block moderation-information" *ngIf="html.moderationInformation">
-      <div class="anchor" id="moderation-information"></div>
+    <div myPluginSelector pluginSelectorId="about-instance-moderation">
+      <div class="anchor" id="moderation"></div>
       <a
+        *ngIf="html.moderationInformation || html.codeOfConduct || html.terms"
         class="anchor-link"
         routerLink="/about/instance"
-        fragment="moderation-information"
+        fragment="moderation"
         #anchorLink
         (click)="onClickCopyLink(anchorLink)">
-        <h3 i18n class="section-title">Moderation information</h3>
+        <h2 i18n class="middle-title">
+          MODERATION
+        </h2>
       </a>
 
-      <div [innerHTML]="html.moderationInformation"></div>
-    </div>
+      <div class="block moderation-information" *ngIf="html.moderationInformation">
+        <div class="anchor" id="moderation-information"></div>
+        <a
+          class="anchor-link"
+          routerLink="/about/instance"
+          fragment="moderation-information"
+          #anchorLink
+          (click)="onClickCopyLink(anchorLink)">
+          <h3 i18n class="section-title">Moderation information</h3>
+        </a>
 
-    <div class="block code-of-conduct" *ngIf="html.codeOfConduct">
-      <div class="anchor" id="code-of-conduct"></div>
-      <a
-        class="anchor-link"
-        routerLink="/about/instance"
-        fragment="code-of-conduct"
-        #anchorLink
-        (click)="onClickCopyLink(anchorLink)">
-        <h3 i18n class="section-title">Code of conduct</h3>
-      </a>
+        <div [innerHTML]="html.moderationInformation"></div>
+      </div>
 
-      <div [innerHTML]="html.codeOfConduct"></div>
-    </div>
+      <div class="block code-of-conduct" *ngIf="html.codeOfConduct">
+        <div class="anchor" id="code-of-conduct"></div>
+        <a
+          class="anchor-link"
+          routerLink="/about/instance"
+          fragment="code-of-conduct"
+          #anchorLink
+          (click)="onClickCopyLink(anchorLink)">
+          <h3 i18n class="section-title">Code of conduct</h3>
+        </a>
 
-    <div class="block terms">
-      <div class="anchor" id="terms"></div>
-      <a
-        class="anchor-link"
-        routerLink="/about/instance"
-        fragment="terms"
-        #anchorLink
-        (click)="onClickCopyLink(anchorLink)">
-        <h3 i18n class="section-title">Terms</h3>
-      </a>
+        <div [innerHTML]="html.codeOfConduct"></div>
+      </div>
 
-      <div [innerHTML]="html.terms"></div>
-    </div>
+      <div class="block terms">
+        <div class="anchor" id="terms"></div>
+        <a
+          class="anchor-link"
+          routerLink="/about/instance"
+          fragment="terms"
+          #anchorLink
+          (click)="onClickCopyLink(anchorLink)">
+          <h3 i18n class="section-title">Terms</h3>
+        </a>
 
-    <div class="anchor" id="other-information"></div>
-    <a
-      *ngIf="html.hardwareInformation"
-      class="anchor-link"
-      routerLink="/about/instance"
-      fragment="other-information"
-      #anchorLink
-      (click)="onClickCopyLink(anchorLink)">
-      <h2 i18n class="middle-title">
-        OTHER INFORMATION
-      </h2>
-    </a>
+        <div [innerHTML]="html.terms"></div>
+      </div>
+    </div>
 
-    <div class="block hardware-information" *ngIf="html.hardwareInformation">
-      <div class="anchor" id="hardware-information"></div>
+    <div myPluginSelector pluginSelectorId="about-instance-other-information">
+      <div class="anchor" id="other-information"></div>
       <a
+        *ngIf="html.hardwareInformation"
         class="anchor-link"
         routerLink="/about/instance"
-        fragment="hardware-information"
+        fragment="other-information"
         #anchorLink
         (click)="onClickCopyLink(anchorLink)">
-        <h3 i18n class="section-title">Hardware information</h3>
+        <h2 i18n class="middle-title">
+          OTHER INFORMATION
+        </h2>
       </a>
 
-      <div [innerHTML]="html.hardwareInformation"></div>
+      <div class="block hardware-information" *ngIf="html.hardwareInformation">
+        <div class="anchor" id="hardware-information"></div>
+        <a
+          class="anchor-link"
+          routerLink="/about/instance"
+          fragment="hardware-information"
+          #anchorLink
+          (click)="onClickCopyLink(anchorLink)">
+          <h3 i18n class="section-title">Hardware information</h3>
+        </a>
+
+        <div [innerHTML]="html.hardwareInformation"></div>
+      </div>
     </div>
   </div>
 
-  <div class="col-md-12 col-xl-6">
+  <div class="col-md-12 col-xl-6" myPluginSelector pluginSelectorId="about-instance-features">
     <h2 class="sr-only" i18n>FEATURES</h2>
     <my-instance-features-table></my-instance-features-table>
   </div>
 
-  <div class="col">
+  <div class="col" myPluginSelector pluginSelectorId="about-instance-statistics">
     <div class="anchor" id="statistics"></div>
     <a
       class="anchor-link"
diff --git a/client/src/app/+about/about.component.html b/client/src/app/+about/about.component.html
index 1ab00c5df..63d429ebf 100644
--- a/client/src/app/+about/about.component.html
+++ b/client/src/app/+about/about.component.html
@@ -2,11 +2,11 @@
   <div class="sub-menu" [ngClass]="{ 'sub-menu-fixed': !isBroadcastMessageDisplayed }">
 
     <div class="links">
-      <a i18n routerLink="instance" routerLinkActive="active" class="title-page title-page-about">Instance</a>
+      <a myPluginSelector pluginSelectorId="about-menu-instance" i18n routerLink="instance" routerLinkActive="active" class="title-page title-page-about">Instance</a>
 
-      <a i18n routerLink="peertube" routerLinkActive="active" class="title-page title-page-about">PeerTube</a>
+      <a myPluginSelector pluginSelectorId="about-menu-peertube" i18n routerLink="peertube" routerLinkActive="active" class="title-page title-page-about">PeerTube</a>
 
-      <a i18n routerLink="follows" routerLinkActive="active" class="title-page title-page-about">Network</a>
+      <a myPluginSelector pluginSelectorId="about-menu-network" i18n routerLink="follows" routerLinkActive="active" class="title-page title-page-about">Network</a>
     </div>
   </div>
 
diff --git a/client/src/app/+accounts/accounts.component.html b/client/src/app/+accounts/accounts.component.html
index 0bb24de2e..8362e6b7e 100644
--- a/client/src/app/+accounts/accounts.component.html
+++ b/client/src/app/+accounts/accounts.component.html
@@ -19,10 +19,8 @@
               ></my-user-moderation-dropdown>
 
               <span *ngIf="accountUser?.blocked" [ngbTooltip]="accountUser.blockedReason" class="badge badge-danger" i18n>Banned</span>
-              <span *ngIf="account.mutedByUser" class="badge badge-danger" i18n>Muted</span>
-              <span *ngIf="account.mutedServerByUser" class="badge badge-danger" i18n>Instance muted</span>
-              <span *ngIf="account.mutedByInstance" class="badge badge-danger" i18n>Muted by your instance</span>
-              <span *ngIf="account.mutedServerByInstance" class="badge badge-danger" i18n>Instance muted by your instance</span>
+
+              <my-account-block-badges [account]="account"></my-account-block-badges>
             </div>
 
             <div class="actor-handle">
diff --git a/client/src/app/+accounts/accounts.component.scss b/client/src/app/+accounts/accounts.component.scss
index cdd00487b..5043b98c4 100644
--- a/client/src/app/+accounts/accounts.component.scss
+++ b/client/src/app/+accounts/accounts.component.scss
@@ -30,16 +30,10 @@
   }
 }
 
-my-user-moderation-dropdown,
-.badge {
-  @include margin-left(10px);
+my-user-moderation-dropdown {
+  margin: 0 10px;
 
-  position: relative;
-  top: 3px;
-}
-
-.badge {
-  font-size: 13px;
+  height: fit-content;
 }
 
 .copy-button {
@@ -64,6 +58,10 @@ my-user-moderation-dropdown,
   @include avatar-row-responsive(var(--myImgMargin), var(--myGreyFontSize));
 }
 
+.actor-display-name {
+  align-items: center;
+}
+
 .description {
   grid-column: 1 / 3;
   max-width: 1000px;
diff --git a/client/src/app/+accounts/accounts.component.ts b/client/src/app/+accounts/accounts.component.ts
index 0dcbc250a..898325492 100644
--- a/client/src/app/+accounts/accounts.component.ts
+++ b/client/src/app/+accounts/accounts.component.ts
@@ -12,7 +12,7 @@ import {
   VideoChannelService,
   VideoService
 } from '@app/shared/shared-main'
-import { AccountReportComponent } from '@app/shared/shared-moderation'
+import { AccountReportComponent, BlocklistService } from '@app/shared/shared-moderation'
 import { HttpStatusCode, User, UserRight } from '@shared/models'
 
 @Component({
@@ -52,6 +52,7 @@ export class AccountsComponent implements OnInit, OnDestroy {
     private authService: AuthService,
     private videoService: VideoService,
     private markdown: MarkdownService,
+    private blocklist: BlocklistService,
     private screenService: ScreenService
   ) {
   }
@@ -159,6 +160,7 @@ export class AccountsComponent implements OnInit, OnDestroy {
     this.updateModerationActions()
     this.loadUserIfNeeded(account)
     this.loadAccountVideosCount()
+    this.loadAccountBlockStatus()
   }
 
   private showReportModal () {
@@ -217,4 +219,9 @@ export class AccountsComponent implements OnInit, OnDestroy {
       this.accountVideosCount = res.total
     })
   }
+
+  private loadAccountBlockStatus () {
+    this.blocklist.getStatus({ accounts: [ this.account.nameWithHostForced ], hosts: [ this.account.host ] })
+      .subscribe(status => this.account.updateBlockStatus(status))
+  }
 }
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html b/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html
index 318c8e2c2..c9533208a 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html
+++ b/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.html
@@ -56,6 +56,36 @@
         </ng-container>
       </div>
 
+      <ng-container formGroupName="client">
+
+        <ng-container formGroupName="videos">
+          <ng-container formGroupName="miniature">
+            <div class="form-group">
+              <my-peertube-checkbox
+                inputName="clientVideosMiniaturePreferAuthorDisplayName" formControlName="preferAuthorDisplayName"
+                i18n-labelText labelText="Prefer author display name in video miniature"
+              ></my-peertube-checkbox>
+            </div>
+          </ng-container>
+        </ng-container>
+
+        <ng-container formGroupName="menu">
+          <ng-container formGroupName="login">
+            <div class="form-group">
+              <my-peertube-checkbox
+                inputName="clientMenuLoginRedirectOnSingleExternalAuth" formControlName="redirectOnSingleExternalAuth"
+                i18n-labelText labelText="Redirect users on single external auth when users click on the login button in menu"
+              >
+                <ng-container ngProjectAs="description">
+                  <span *ngIf="countExternalAuth() === 0" i18n>⚠️ You don't have any external auth plugin enabled.</span>
+                  <span *ngIf="countExternalAuth() > 1" i18n>⚠️ You have multiple external auth plugins enabled.</span>
+                </ng-container>
+             </my-peertube-checkbox>
+            </div>
+          </ng-container>
+        </ng-container>
+      </ng-container>
+
     </div>
   </div>
 
@@ -276,7 +306,7 @@
     <div class="form-group col-12 col-lg-4 col-xl-3">
       <div i18n class="inner-form-title">VIDEO CHANNELS</div>
     </div>
-    
+
     <div class="form-group form-group-right col-12 col-lg-8 col-xl-9">
       <div class="form-group" formGroupName="videoChannels">
         <label i18n for="videoChannelsMaxPerUser">Max video channels per user</label>
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.ts b/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.ts
index 7a8258820..81457bd36 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.ts
+++ b/client/src/app/+admin/config/edit-custom-config/edit-basic-configuration.component.ts
@@ -36,6 +36,10 @@ export class EditBasicConfigurationComponent implements OnInit, OnChanges {
     }
   }
 
+  countExternalAuth () {
+    return this.serverConfig.plugin.registeredExternalAuths.length
+  }
+
   getVideoQuotaOptions () {
     return this.configService.videoQuotaOptions
   }
diff --git a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
index fdb0a7532..f2eaa3033 100644
--- a/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
+++ b/client/src/app/+admin/config/edit-custom-config/edit-custom-config.component.ts
@@ -106,6 +106,18 @@ export class EditCustomConfigComponent extends FormReactive implements OnInit {
           whitelisted: null
         }
       },
+      client: {
+        videos: {
+          miniature: {
+            preferAuthorDisplayName: null
+          }
+        },
+        menu: {
+          login: {
+            redirectOnSingleExternalAuth: null
+          }
+        }
+      },
       cache: {
         previews: {
           size: CACHE_PREVIEWS_SIZE_VALIDATOR
diff --git a/client/src/app/+login/login.component.html b/client/src/app/+login/login.component.html
index 90eea1505..531b06dc9 100644
--- a/client/src/app/+login/login.component.html
+++ b/client/src/app/+login/login.component.html
@@ -48,7 +48,8 @@
           <input type="submit" class="peertube-button orange-button" i18n-value value="Login" [disabled]="!form.valid">
 
           <div class="additionnal-links">
-            <a i18n class="forgot-password-button" (click)="openForgotPasswordModal()" i18n-title title="Click here to reset your password">I forgot my password</a>
+            <a i18n role="button" class="forgot-password-button" (click)="openForgotPasswordModal()" i18n-title title="Click here to reset your password">I forgot my password</a>
+
             <div *ngIf="signupAllowed" class="signup-link">
               <span>·</span>
               <a i18n routerLink="/signup" class="create-an-account">Create an account</a>
diff --git a/client/src/app/+login/login.component.ts b/client/src/app/+login/login.component.ts
index 1fa4bd3b5..648b8db36 100644
--- a/client/src/app/+login/login.component.ts
+++ b/client/src/app/+login/login.component.ts
@@ -1,4 +1,4 @@
-import { environment } from 'src/environments/environment'
+
 import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angular/core'
 import { ActivatedRoute } from '@angular/router'
 import { AuthService, Notifier, RedirectService, UserService } from '@app/core'
@@ -7,6 +7,7 @@ import { LOGIN_PASSWORD_VALIDATOR, LOGIN_USERNAME_VALIDATOR } from '@app/shared/
 import { FormReactive, FormValidatorService } from '@app/shared/shared-forms'
 import { InstanceAboutAccordionComponent } from '@app/shared/shared-instance'
 import { NgbAccordion, NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap'
+import { PluginsManager } from '@root-helpers/plugins-manager'
 import { RegisteredExternalAuthConfig, ServerConfig } from '@shared/models'
 
 @Component({
@@ -98,7 +99,7 @@ export class LoginComponent extends FormReactive implements OnInit, AfterViewIni
   }
 
   getAuthHref (auth: RegisteredExternalAuthConfig) {
-    return environment.apiUrl + `/plugins/${auth.name}/${auth.version}/auth/${auth.authName}`
+    return PluginsManager.getExternalAuthHref(auth)
   }
 
   login () {
diff --git a/client/src/app/+plugin-pages/index.ts b/client/src/app/+plugin-pages/index.ts
new file mode 100644
index 000000000..b988f13f6
--- /dev/null
+++ b/client/src/app/+plugin-pages/index.ts
@@ -0,0 +1,3 @@
+export * from './plugin-pages-routing.module'
+export * from './plugin-pages.component'
+export * from './plugin-pages.module'
diff --git a/client/src/app/+plugin-pages/plugin-pages-routing.module.ts b/client/src/app/+plugin-pages/plugin-pages-routing.module.ts
new file mode 100644
index 000000000..b47a787e0
--- /dev/null
+++ b/client/src/app/+plugin-pages/plugin-pages-routing.module.ts
@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core'
+import { RouterModule, Routes } from '@angular/router'
+import { PluginPagesComponent } from './plugin-pages.component'
+
+const pluginPagesRoutes: Routes = [
+  {
+    path: '**',
+    component: PluginPagesComponent,
+    data: {
+      reloadOnSameNavigation: true
+    }
+  }
+]
+
+@NgModule({
+  imports: [ RouterModule.forChild(pluginPagesRoutes) ],
+  exports: [ RouterModule ]
+})
+export class PluginPagesRoutingModule {}
diff --git a/client/src/app/+plugin-pages/plugin-pages.component.html b/client/src/app/+plugin-pages/plugin-pages.component.html
new file mode 100644
index 000000000..cf62d1bd7
--- /dev/null
+++ b/client/src/app/+plugin-pages/plugin-pages.component.html
@@ -0,0 +1 @@
+<div #root></div>
diff --git a/client/src/app/+plugin-pages/plugin-pages.component.ts b/client/src/app/+plugin-pages/plugin-pages.component.ts
new file mode 100644
index 000000000..5f294ee13
--- /dev/null
+++ b/client/src/app/+plugin-pages/plugin-pages.component.ts
@@ -0,0 +1,31 @@
+import { AfterViewInit, Component, ElementRef, ViewChild } from '@angular/core'
+import { ActivatedRoute, Router } from '@angular/router'
+import { PluginService } from '@app/core'
+
+@Component({
+  templateUrl: './plugin-pages.component.html'
+})
+export class PluginPagesComponent implements AfterViewInit {
+  @ViewChild('root') root: ElementRef
+
+  constructor (
+    private route: ActivatedRoute,
+    private router: Router,
+    private pluginService: PluginService
+  ) {
+
+  }
+
+  ngAfterViewInit () {
+    const path = '/' + this.route.snapshot.url.map(u => u.path).join('/')
+
+    const registered = this.pluginService.getRegisteredClientRoute(path)
+    if (!registered) {
+      console.log('Could not find registered route %s.', path, this.pluginService.getAllRegisteredClientRoutes())
+
+      return this.router.navigate([ '/404' ], { skipLocationChange: true })
+    }
+
+    registered.onMount({ rootEl: this.root.nativeElement })
+  }
+}
diff --git a/client/src/app/+plugin-pages/plugin-pages.module.ts b/client/src/app/+plugin-pages/plugin-pages.module.ts
new file mode 100644
index 000000000..86f86c752
--- /dev/null
+++ b/client/src/app/+plugin-pages/plugin-pages.module.ts
@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core'
+import { PluginPagesRoutingModule } from './plugin-pages-routing.module'
+import { PluginPagesComponent } from './plugin-pages.component'
+
+@NgModule({
+  imports: [
+    PluginPagesRoutingModule
+  ],
+
+  declarations: [
+    PluginPagesComponent
+  ],
+
+  exports: [
+    PluginPagesComponent
+  ],
+
+  providers: [
+  ]
+})
+export class PluginPagesModule { }
diff --git a/client/src/app/+search/search-filters.component.html b/client/src/app/+search/search-filters.component.html
index 4b87a2102..c4861e8c4 100644
--- a/client/src/app/+search/search-filters.component.html
+++ b/client/src/app/+search/search-filters.component.html
@@ -182,6 +182,31 @@
         >
       </div>
 
+      <div class="form-group">
+        <div class="radio-label label-container">
+          <label i18n>Result types</label>
+          <button i18n class="reset-button reset-button-small" (click)="resetField('resultType')" *ngIf="advancedSearch.resultType !== undefined">
+            Reset
+          </button>
+        </div>
+
+        <div class="peertube-radio-container">
+          <input type="radio" name="resultType" id="resultTypeVideos" value="videos" [(ngModel)]="advancedSearch.resultType">
+          <label i18n for="resultTypeVideos" class="radio">Videos</label>
+        </div>
+
+        <div class="peertube-radio-container">
+          <input type="radio" name="resultType" id="resultTypeChannels" value="channels" [(ngModel)]="advancedSearch.resultType">
+          <label i18n for="resultTypeChannels" class="radio">Channels</label>
+        </div>
+
+        <div class="peertube-radio-container">
+          <input type="radio" name="resultType" id="resultTypePlaylists" value="playlists" [(ngModel)]="advancedSearch.resultType">
+          <label i18n for="resultTypePlaylists" class="radio">Playlists</label>
+        </div>
+
+      </div>
+
       <div class="form-group" *ngIf="isSearchTargetEnabled()">
         <div class="radio-label label-container">
           <label i18n>Search target</label>
diff --git a/client/src/app/+search/search-filters.component.ts b/client/src/app/+search/search-filters.component.ts
index 5972ba553..aaa4ecc5a 100644
--- a/client/src/app/+search/search-filters.component.ts
+++ b/client/src/app/+search/search-filters.component.ts
@@ -22,7 +22,6 @@ export class SearchFiltersComponent implements OnInit {
   publishedDateRanges: FormOption[] = []
   sorts: FormOption[] = []
   durationRanges: FormOption[] = []
-  videoType: FormOption[] = []
 
   publishedDateRange: string
   durationRange: string
@@ -54,17 +53,6 @@ export class SearchFiltersComponent implements OnInit {
       }
     ]
 
-    this.videoType = [
-      {
-        id: 'vod',
-        label: $localize`VOD videos`
-      },
-      {
-        id: 'live',
-        label: $localize`Live videos`
-      }
-    ]
-
     this.durationRanges = [
       {
         id: 'short',
diff --git a/client/src/app/+search/search.component.ts b/client/src/app/+search/search.component.ts
index fcf6ebbec..b9ec6dbcc 100644
--- a/client/src/app/+search/search.component.ts
+++ b/client/src/app/+search/search.component.ts
@@ -47,10 +47,6 @@ export class SearchComponent implements OnInit, OnDestroy {
   private subActivatedRoute: Subscription
   private isInitialLoad = false // set to false to show the search filters on first arrival
 
-  private channelsPerPage = 2
-  private playlistsPerPage = 2
-  private videosPerPage = 10
-
   private hasMoreResults = true
   private isSearching = false
 
@@ -247,7 +243,6 @@ export class SearchComponent implements OnInit, OnDestroy {
   private resetPagination () {
     this.pagination.currentPage = 1
     this.pagination.totalItems = null
-    this.channelsPerPage = 2
 
     this.results = []
   }
@@ -272,7 +267,7 @@ export class SearchComponent implements OnInit, OnDestroy {
   private getVideosObs () {
     const params = {
       search: this.currentSearch,
-      componentPagination: immutableAssign(this.pagination, { itemsPerPage: this.videosPerPage }),
+      componentPagination: immutableAssign(this.pagination, { itemsPerPage: 10 }),
       advancedSearch: this.advancedSearch
     }
 
@@ -288,7 +283,7 @@ export class SearchComponent implements OnInit, OnDestroy {
   private getVideoChannelObs () {
     const params = {
       search: this.currentSearch,
-      componentPagination: immutableAssign(this.pagination, { itemsPerPage: this.channelsPerPage }),
+      componentPagination: immutableAssign(this.pagination, { itemsPerPage: this.buildChannelsPerPage() }),
       advancedSearch: this.advancedSearch
     }
 
@@ -304,7 +299,7 @@ export class SearchComponent implements OnInit, OnDestroy {
   private getVideoPlaylistObs () {
     const params = {
       search: this.currentSearch,
-      componentPagination: immutableAssign(this.pagination, { itemsPerPage: this.playlistsPerPage }),
+      componentPagination: immutableAssign(this.pagination, { itemsPerPage: this.buildPlaylistsPerPage() }),
       advancedSearch: this.advancedSearch
     }
 
@@ -334,4 +329,16 @@ export class SearchComponent implements OnInit, OnDestroy {
 
     return undefined
   }
+
+  private buildChannelsPerPage () {
+    if (this.advancedSearch.resultType === 'channels') return 10
+
+    return 2
+  }
+
+  private buildPlaylistsPerPage () {
+    if (this.advancedSearch.resultType === 'playlists') return 10
+
+    return 2
+  }
 }
diff --git a/client/src/app/+video-channels/video-channels.component.html b/client/src/app/+video-channels/video-channels.component.html
index 064fbb6f5..aec2e373c 100644
--- a/client/src/app/+video-channels/video-channels.component.html
+++ b/client/src/app/+video-channels/video-channels.component.html
@@ -23,14 +23,16 @@
         <div class="section-label" i18n>OWNER ACCOUNT</div>
 
         <div class="avatar-row">
-          <my-actor-avatar class="account-avatar" [account]="videoChannel.ownerAccount" [internalHref]="getAccountUrl()"></my-actor-avatar>
+          <my-actor-avatar class="account-avatar" [account]="ownerAccount" [internalHref]="getAccountUrl()"></my-actor-avatar>
 
           <div class="actor-info">
             <h4>
-              <a [routerLink]="getAccountUrl()" title="View account" i18n-title>{{ videoChannel.ownerAccount.displayName }}</a>
+              <a [routerLink]="getAccountUrl()" title="View account" i18n-title>{{ ownerAccount.displayName }}</a>
             </h4>
 
             <div class="actor-handle">@{{ videoChannel.ownerBy }}</div>
+
+            <my-account-block-badges [account]="ownerAccount"></my-account-block-badges>
           </div>
         </div>
 
diff --git a/client/src/app/+video-channels/video-channels.component.ts b/client/src/app/+video-channels/video-channels.component.ts
index 272fc41d9..ebb991f4e 100644
--- a/client/src/app/+video-channels/video-channels.component.ts
+++ b/client/src/app/+video-channels/video-channels.component.ts
@@ -4,7 +4,8 @@ import { catchError, distinctUntilChanged, map, switchMap } from 'rxjs/operators
 import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core'
 import { ActivatedRoute } from '@angular/router'
 import { AuthService, MarkdownService, Notifier, RestExtractor, ScreenService } from '@app/core'
-import { ListOverflowItem, VideoChannel, VideoChannelService, VideoService } from '@app/shared/shared-main'
+import { Account, ListOverflowItem, VideoChannel, VideoChannelService, VideoService } from '@app/shared/shared-main'
+import { BlocklistService } from '@app/shared/shared-moderation'
 import { SupportModalComponent } from '@app/shared/shared-support-modal'
 import { SubscribeButtonComponent } from '@app/shared/shared-user-subscription'
 import { HttpStatusCode } from '@shared/models'
@@ -18,6 +19,7 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
   @ViewChild('supportModal') supportModal: SupportModalComponent
 
   videoChannel: VideoChannel
+  ownerAccount: Account
   hotkeys: Hotkey[]
   links: ListOverflowItem[] = []
   isChannelManageable = false
@@ -38,7 +40,8 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
     private restExtractor: RestExtractor,
     private hotkeysService: HotkeysService,
     private screenService: ScreenService,
-    private markdown: MarkdownService
+    private markdown: MarkdownService,
+    private blocklist: BlocklistService
   ) { }
 
   ngOnInit () {
@@ -58,8 +61,10 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
 
                           // After the markdown renderer to avoid layout changes
                           this.videoChannel = videoChannel
+                          this.ownerAccount = new Account(this.videoChannel.ownerAccount)
 
                           this.loadChannelVideosCount()
+                          this.loadOwnerBlockStatus()
                         })
 
     this.hotkeys = [
@@ -125,4 +130,9 @@ export class VideoChannelsComponent implements OnInit, OnDestroy {
       sort: '-publishedAt'
     }).subscribe(res => this.channelVideosCount = res.total)
   }
+
+  private loadOwnerBlockStatus () {
+    this.blocklist.getStatus({ accounts: [ this.ownerAccount.nameWithHostForced ], hosts: [ this.ownerAccount.host ] })
+      .subscribe(status => this.ownerAccount.updateBlockStatus(status))
+  }
 }
diff --git a/client/src/app/+video-channels/video-channels.module.ts b/client/src/app/+video-channels/video-channels.module.ts
index 35c39cc2e..76aaecf83 100644
--- a/client/src/app/+video-channels/video-channels.module.ts
+++ b/client/src/app/+video-channels/video-channels.module.ts
@@ -2,15 +2,16 @@ import { NgModule } from '@angular/core'
 import { SharedFormModule } from '@app/shared/shared-forms'
 import { SharedGlobalIconModule } from '@app/shared/shared-icons'
 import { SharedMainModule } from '@app/shared/shared-main'
+import { SharedModerationModule } from '@app/shared/shared-moderation'
 import { SharedSupportModal } from '@app/shared/shared-support-modal'
 import { SharedUserSubscriptionModule } from '@app/shared/shared-user-subscription'
 import { SharedVideoMiniatureModule } from '@app/shared/shared-video-miniature'
 import { SharedVideoPlaylistModule } from '@app/shared/shared-video-playlist'
+import { SharedActorImageModule } from '../shared/shared-actor-image/shared-actor-image.module'
 import { VideoChannelPlaylistsComponent } from './video-channel-playlists/video-channel-playlists.component'
 import { VideoChannelVideosComponent } from './video-channel-videos/video-channel-videos.component'
 import { VideoChannelsRoutingModule } from './video-channels-routing.module'
 import { VideoChannelsComponent } from './video-channels.component'
-import { SharedActorImageModule } from '../shared/shared-actor-image/shared-actor-image.module'
 
 @NgModule({
   imports: [
@@ -23,7 +24,8 @@ import { SharedActorImageModule } from '../shared/shared-actor-image/shared-acto
     SharedUserSubscriptionModule,
     SharedGlobalIconModule,
     SharedSupportModal,
-    SharedActorImageModule
+    SharedActorImageModule,
+    SharedModerationModule
   ],
 
   declarations: [
diff --git a/client/src/app/app-routing.module.ts b/client/src/app/app-routing.module.ts
index 438cb6512..42328d83d 100644
--- a/client/src/app/app-routing.module.ts
+++ b/client/src/app/app-routing.module.ts
@@ -58,6 +58,12 @@ const routes: Routes = [
   },
 
   {
+    path: 'p',
+    loadChildren: () => import('./+plugin-pages/plugin-pages.module').then(m => m.PluginPagesModule),
+    canActivateChild: [ MetaGuard ]
+  },
+
+  {
     path: 'about',
     loadChildren: () => import('./+about/about.module').then(m => m.AboutModule),
     canActivateChild: [ MetaGuard ]
diff --git a/client/src/app/core/plugins/plugin.service.ts b/client/src/app/core/plugins/plugin.service.ts
index 89391c2c5..fdbbd2d56 100644
--- a/client/src/app/core/plugins/plugin.service.ts
+++ b/client/src/app/core/plugins/plugin.service.ts
@@ -20,7 +20,8 @@ import {
   PluginType,
   PublicServerSetting,
   RegisterClientFormFieldOptions,
-  RegisterClientSettingsScript,
+  RegisterClientSettingsScriptOptions,
+  RegisterClientRouteOptions,
   RegisterClientVideoFieldOptions,
   ServerConfigPlugin
 } from '@shared/models'
@@ -48,7 +49,8 @@ export class PluginService implements ClientHook {
   private formFields: FormFields = {
     video: []
   }
-  private settingsScripts: { [ npmName: string ]: RegisterClientSettingsScript } = {}
+  private settingsScripts: { [ npmName: string ]: RegisterClientSettingsScriptOptions } = {}
+  private clientRoutes: { [ route: string ]: RegisterClientRouteOptions } = {}
 
   private pluginsManager: PluginsManager
 
@@ -67,7 +69,8 @@ export class PluginService implements ClientHook {
     this.pluginsManager = new PluginsManager({
       peertubeHelpersFactory: this.buildPeerTubeHelpers.bind(this),
       onFormFields: this.onFormFields.bind(this),
-      onSettingsScripts: this.onSettingsScripts.bind(this)
+      onSettingsScripts: this.onSettingsScripts.bind(this),
+      onClientRoute: this.onClientRoute.bind(this)
     })
   }
 
@@ -123,6 +126,14 @@ export class PluginService implements ClientHook {
     return this.settingsScripts[npmName]
   }
 
+  getRegisteredClientRoute (route: string) {
+    return this.clientRoutes[route]
+  }
+
+  getAllRegisteredClientRoutes () {
+    return Object.keys(this.clientRoutes)
+  }
+
   translateBy (npmName: string, toTranslate: string) {
     const helpers = this.helpers[npmName]
     if (!helpers) {
@@ -140,12 +151,20 @@ export class PluginService implements ClientHook {
     })
   }
 
-  private onSettingsScripts (pluginInfo: PluginInfo, options: RegisterClientSettingsScript) {
+  private onSettingsScripts (pluginInfo: PluginInfo, options: RegisterClientSettingsScriptOptions) {
     const npmName = this.nameToNpmName(pluginInfo.plugin.name, pluginInfo.pluginType)
 
     this.settingsScripts[npmName] = options
   }
 
+  private onClientRoute (options: RegisterClientRouteOptions) {
+    const route = options.route.startsWith('/')
+      ? options.route
+      : `/${options.route}`
+
+    this.clientRoutes[route] = options
+  }
+
   private buildPeerTubeHelpers (pluginInfo: PluginInfo): RegisterClientHelpers {
     const { plugin } = pluginInfo
     const npmName = this.nameToNpmName(pluginInfo.plugin.name, pluginInfo.pluginType)
@@ -161,6 +180,10 @@ export class PluginService implements ClientHook {
         return environment.apiUrl + `${pathPrefix}/${plugin.name}/${plugin.version}/router`
       },
 
+      getBasePluginClientPath: () => {
+        return '/p'
+      },
+
       getSettings: () => {
         const path = PluginService.BASE_PLUGIN_API_URL + '/' + npmName + '/public-settings'
 
diff --git a/client/src/app/core/routing/custom-reuse-strategy.ts b/client/src/app/core/routing/custom-reuse-strategy.ts
index 1498e221f..5d3ad2e67 100644
--- a/client/src/app/core/routing/custom-reuse-strategy.ts
+++ b/client/src/app/core/routing/custom-reuse-strategy.ts
@@ -58,7 +58,7 @@ export class CustomReuseStrategy implements RouteReuseStrategy {
 
   // Reuse the route if we're going to and from the same route
   shouldReuseRoute (future: ActivatedRouteSnapshot, curr: ActivatedRouteSnapshot): boolean {
-    return future.routeConfig === curr.routeConfig
+    return future.routeConfig === curr.routeConfig && future.routeConfig?.data?.reloadOnSameNavigation !== true
   }
 
   private gb () {
diff --git a/client/src/app/menu/menu.component.html b/client/src/app/menu/menu.component.html
index 46dd807ec..9ea991042 100644
--- a/client/src/app/menu/menu.component.html
+++ b/client/src/app/menu/menu.component.html
@@ -30,7 +30,10 @@
 
               <div class="dropdown-divider"></div>
 
-              <a ngbDropdownItem ngbDropdownToggle class="dropdown-item" (click)="openLanguageChooser()">
+              <a
+                myPluginSelector pluginSelectorId="menu-user-dropdown-language-item"
+                ngbDropdownItem ngbDropdownToggle class="dropdown-item" (click)="openLanguageChooser()"
+              >
                 <my-global-icon iconName="language" aria-hidden="true"></my-global-icon>
                 <span i18n>Interface:</span>
                 <span class="ml-auto text-muted">{{ currentInterfaceLanguage }}</span>
@@ -96,7 +99,9 @@
       </div>
 
       <div *ngIf="!isLoggedIn" class="login-buttons-block">
-        <a i18n routerLink="/login" class="peertube-button-link orange-button">Login</a>
+        <a i18n *ngIf="!getExternalLoginHref()" routerLink="/login" class="peertube-button-link orange-button">Login</a>
+        <a i18n *ngIf="getExternalLoginHref()" [href]="getExternalLoginHref()" class="peertube-button-link orange-button">Login</a>
+
         <a i18n *ngIf="isRegistrationAllowed()" routerLink="/signup" class="peertube-button-link create-account-button">Create an account</a>
       </div>
 
diff --git a/client/src/app/menu/menu.component.ts b/client/src/app/menu/menu.component.ts
index 97f07c956..d5ddc29cb 100644
--- a/client/src/app/menu/menu.component.ts
+++ b/client/src/app/menu/menu.component.ts
@@ -21,6 +21,7 @@ import { LanguageChooserComponent } from '@app/menu/language-chooser.component'
 import { QuickSettingsModalComponent } from '@app/modal/quick-settings-modal.component'
 import { PeertubeModalService } from '@app/shared/shared-main/peertube-modal/peertube-modal.service'
 import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
+import { PluginsManager } from '@root-helpers/plugins-manager'
 import { HTMLServerConfig, ServerConfig, UserRight, VideoConstant } from '@shared/models'
 
 const logger = debug('peertube:menu:MenuComponent')
@@ -129,6 +130,15 @@ export class MenuComponent implements OnInit {
       .subscribe(() => this.openQuickSettings())
   }
 
+  getExternalLoginHref () {
+    if (!this.serverConfig || this.serverConfig.client.menu.login.redirectOnSingleExternalAuth !== true) return undefined
+
+    const externalAuths = this.serverConfig.plugin.registeredExternalAuths
+    if (externalAuths.length !== 1) return undefined
+
+    return PluginsManager.getExternalAuthHref(externalAuths[0])
+  }
+
   isRegistrationAllowed () {
     if (!this.serverConfig) return false
 
diff --git a/client/src/app/shared/shared-main/account/account.model.ts b/client/src/app/shared/shared-main/account/account.model.ts
index 92606e7fa..8b78d01a6 100644
--- a/client/src/app/shared/shared-main/account/account.model.ts
+++ b/client/src/app/shared/shared-main/account/account.model.ts
@@ -1,4 +1,4 @@
-import { Account as ServerAccount, ActorImage } from '@shared/models'
+import { Account as ServerAccount, ActorImage, BlockStatus } from '@shared/models'
 import { Actor } from './actor.model'
 
 export class Account extends Actor implements ServerAccount {
@@ -49,4 +49,11 @@ export class Account extends Actor implements ServerAccount {
   resetAvatar () {
     this.avatar = null
   }
+
+  updateBlockStatus (blockStatus: BlockStatus) {
+    this.mutedByInstance = blockStatus.accounts[this.nameWithHostForced].blockedByServer
+    this.mutedByUser = blockStatus.accounts[this.nameWithHostForced].blockedByUser
+    this.mutedServerByUser = blockStatus.hosts[this.host].blockedByUser
+    this.mutedServerByInstance = blockStatus.hosts[this.host].blockedByServer
+  }
 }
diff --git a/client/src/app/shared/shared-moderation/account-block-badges.component.html b/client/src/app/shared/shared-moderation/account-block-badges.component.html
new file mode 100644
index 000000000..feac707c2
--- /dev/null
+++ b/client/src/app/shared/shared-moderation/account-block-badges.component.html
@@ -0,0 +1,4 @@
+<span *ngIf="account.mutedByUser" class="badge badge-danger" i18n>Muted</span>
+<span *ngIf="account.mutedServerByUser" class="badge badge-danger" i18n>Instance muted</span>
+<span *ngIf="account.mutedByInstance" class="badge badge-danger" i18n>Muted by your instance</span>
+<span *ngIf="account.mutedServerByInstance" class="badge badge-danger" i18n>Instance muted by your instance</span>
diff --git a/client/src/app/shared/shared-moderation/account-block-badges.component.scss b/client/src/app/shared/shared-moderation/account-block-badges.component.scss
new file mode 100644
index 000000000..ccc3666aa
--- /dev/null
+++ b/client/src/app/shared/shared-moderation/account-block-badges.component.scss
@@ -0,0 +1,9 @@
+@use '_variables' as *;
+@use '_mixins' as *;
+
+.badge {
+  @include margin-right(10px);
+
+  height: fit-content;
+  font-size: 12px;
+}
diff --git a/client/src/app/shared/shared-moderation/account-block-badges.component.ts b/client/src/app/shared/shared-moderation/account-block-badges.component.ts
new file mode 100644
index 000000000..a72601118
--- /dev/null
+++ b/client/src/app/shared/shared-moderation/account-block-badges.component.ts
@@ -0,0 +1,11 @@
+import { Component, Input } from '@angular/core'
+import { Account } from '../shared-main'
+
+@Component({
+  selector: 'my-account-block-badges',
+  styleUrls: [ './account-block-badges.component.scss' ],
+  templateUrl: './account-block-badges.component.html'
+})
+export class AccountBlockBadgesComponent {
+  @Input() account: Account
+}
diff --git a/client/src/app/shared/shared-moderation/blocklist.service.ts b/client/src/app/shared/shared-moderation/blocklist.service.ts
index db2a8c584..f4836c6c4 100644
--- a/client/src/app/shared/shared-moderation/blocklist.service.ts
+++ b/client/src/app/shared/shared-moderation/blocklist.service.ts
@@ -3,7 +3,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 { AccountBlock as AccountBlockServer, ResultList, ServerBlock } from '@shared/models'
+import { AccountBlock as AccountBlockServer, BlockStatus, ResultList, ServerBlock } from '@shared/models'
 import { environment } from '../../../environments/environment'
 import { Account } from '../shared-main'
 import { AccountBlock } from './account-block.model'
@@ -12,6 +12,7 @@ export enum BlocklistComponentType { Account, Instance }
 
 @Injectable()
 export class BlocklistService {
+  static BASE_BLOCKLIST_URL = environment.apiUrl + '/api/v1/blocklist'
   static BASE_USER_BLOCKLIST_URL = environment.apiUrl + '/api/v1/users/me/blocklist'
   static BASE_SERVER_BLOCKLIST_URL = environment.apiUrl + '/api/v1/server/blocklist'
 
@@ -21,6 +22,23 @@ export class BlocklistService {
     private restService: RestService
   ) { }
 
+  /** ********************* Blocklist status ***********************/
+
+  getStatus (options: {
+    accounts?: string[]
+    hosts?: string[]
+  }) {
+    const { accounts, hosts } = options
+
+    let params = new HttpParams()
+
+    if (accounts) params = this.restService.addArrayParams(params, 'accounts', accounts)
+    if (hosts) params = this.restService.addArrayParams(params, 'hosts', hosts)
+
+    return this.authHttp.get<BlockStatus>(BlocklistService.BASE_BLOCKLIST_URL + '/status', { params })
+      .pipe(catchError(err => this.restExtractor.handleError(err)))
+  }
+
   /** ********************* User -> Account blocklist ***********************/
 
   getUserAccountBlocklist (options: { pagination: RestPagination, sort: SortMeta, search?: string }) {
diff --git a/client/src/app/shared/shared-moderation/index.ts b/client/src/app/shared/shared-moderation/index.ts
index 41c910ffe..da85b2299 100644
--- a/client/src/app/shared/shared-moderation/index.ts
+++ b/client/src/app/shared/shared-moderation/index.ts
@@ -1,6 +1,7 @@
 export * from './report-modals'
 
 export * from './abuse.service'
+export * from './account-block-badges.component'
 export * from './account-block.model'
 export * from './account-blocklist.component'
 export * from './batch-domains-modal.component'
diff --git a/client/src/app/shared/shared-moderation/shared-moderation.module.ts b/client/src/app/shared/shared-moderation/shared-moderation.module.ts
index 95213e2bd..7cadda67c 100644
--- a/client/src/app/shared/shared-moderation/shared-moderation.module.ts
+++ b/client/src/app/shared/shared-moderation/shared-moderation.module.ts
@@ -13,6 +13,7 @@ import { UserBanModalComponent } from './user-ban-modal.component'
 import { UserModerationDropdownComponent } from './user-moderation-dropdown.component'
 import { VideoBlockComponent } from './video-block.component'
 import { VideoBlockService } from './video-block.service'
+import { AccountBlockBadgesComponent } from './account-block-badges.component'
 import { SharedActorImageModule } from '../shared-actor-image/shared-actor-image.module'
 
 @NgModule({
@@ -31,7 +32,8 @@ import { SharedActorImageModule } from '../shared-actor-image/shared-actor-image
     VideoReportComponent,
     BatchDomainsModalComponent,
     CommentReportComponent,
-    AccountReportComponent
+    AccountReportComponent,
+    AccountBlockBadgesComponent
   ],
 
   exports: [
@@ -41,7 +43,8 @@ import { SharedActorImageModule } from '../shared-actor-image/shared-actor-image
     VideoReportComponent,
     BatchDomainsModalComponent,
     CommentReportComponent,
-    AccountReportComponent
+    AccountReportComponent,
+    AccountBlockBadgesComponent
   ],
 
   providers: [
diff --git a/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts b/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
index b18d861d6..e2cd2cdc1 100644
--- a/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
+++ b/client/src/app/shared/shared-moderation/user-moderation-dropdown.component.ts
@@ -289,13 +289,13 @@ export class UserModerationDropdownComponent implements OnInit, OnChanges {
       {
         label: $localize`Mute the instance`,
         description: $localize`Hide any content from that instance for you.`,
-        isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === false,
+        isDisplayed: ({ account }) => !account.userId && account.mutedServerByUser === false,
         handler: ({ account }) => this.blockServerByUser(account.host)
       },
       {
         label: $localize`Unmute the instance`,
         description: $localize`Show back content from that instance for you.`,
-        isDisplayed: ({ account }) => !account.userId && account.mutedServerByInstance === true,
+        isDisplayed: ({ account }) => !account.userId && account.mutedServerByUser === true,
         handler: ({ account }) => this.unblockServerByUser(account.host)
       },
       {
diff --git a/client/src/app/shared/shared-search/advanced-search.model.ts b/client/src/app/shared/shared-search/advanced-search.model.ts
index 2675c6135..724c4d834 100644
--- a/client/src/app/shared/shared-search/advanced-search.model.ts
+++ b/client/src/app/shared/shared-search/advanced-search.model.ts
@@ -8,6 +8,8 @@ import {
   VideosSearchQuery
 } from '@shared/models'
 
+export type AdvancedSearchResultType = 'videos' | 'playlists' | 'channels'
+
 export class AdvancedSearch {
   startDate: string // ISO 8601
   endDate: string // ISO 8601
@@ -36,6 +38,7 @@ export class AdvancedSearch {
   sort: string
 
   searchTarget: SearchTargetType
+  resultType: AdvancedSearchResultType
 
   // Filters we don't want to count, because they are mandatory
   private silentFilters = new Set([ 'sort', 'searchTarget' ])
@@ -61,6 +64,7 @@ export class AdvancedSearch {
     durationMax?: string
     sort?: string
     searchTarget?: SearchTargetType
+    resultType?: AdvancedSearchResultType
   }) {
     if (!options) return
 
@@ -84,6 +88,12 @@ export class AdvancedSearch {
 
     this.searchTarget = options.searchTarget || undefined
 
+    this.resultType = options.resultType || undefined
+
+    if (!this.resultType && this.hasVideoFilter()) {
+      this.resultType = 'videos'
+    }
+
     if (isNaN(this.durationMin)) this.durationMin = undefined
     if (isNaN(this.durationMax)) this.durationMax = undefined
 
@@ -137,7 +147,8 @@ export class AdvancedSearch {
       isLive: this.isLive,
       host: this.host,
       sort: this.sort,
-      searchTarget: this.searchTarget
+      searchTarget: this.searchTarget,
+      resultType: this.resultType
     }
   }
 
@@ -199,4 +210,21 @@ export class AdvancedSearch {
 
     return true
   }
+
+  private hasVideoFilter () {
+    return this.startDate !== undefined ||
+      this.endDate !== undefined ||
+      this.originallyPublishedStartDate !== undefined ||
+      this.originallyPublishedEndDate !== undefined ||
+      this.nsfw !== undefined !== undefined ||
+      this.categoryOneOf !== undefined ||
+      this.licenceOneOf !== undefined ||
+      this.languageOneOf !== undefined ||
+      this.tagsOneOf !== undefined ||
+      this.tagsAllOf !== undefined ||
+      this.durationMin !== undefined ||
+      this.durationMax !== undefined ||
+      this.host !== undefined ||
+      this.isLive !== undefined
+  }
 }
diff --git a/client/src/app/shared/shared-search/search.service.ts b/client/src/app/shared/shared-search/search.service.ts
index 71350c733..61acfb466 100644
--- a/client/src/app/shared/shared-search/search.service.ts
+++ b/client/src/app/shared/shared-search/search.service.ts
@@ -1,4 +1,4 @@
-import { Observable } from 'rxjs'
+import { Observable, of } from 'rxjs'
 import { catchError, map, switchMap } from 'rxjs/operators'
 import { HttpClient, HttpParams } from '@angular/common/http'
 import { Injectable } from '@angular/core'
@@ -39,6 +39,10 @@ export class SearchService {
   }): Observable<ResultList<Video>> {
     const { search, uuids, componentPagination, advancedSearch } = parameters
 
+    if (advancedSearch?.resultType !== undefined && advancedSearch.resultType !== 'videos') {
+      return of({ total: 0, data: [] })
+    }
+
     const url = SearchService.BASE_SEARCH_URL + 'videos'
     let pagination: RestPagination
 
@@ -73,6 +77,10 @@ export class SearchService {
   }): Observable<ResultList<VideoChannel>> {
     const { search, advancedSearch, componentPagination, handles } = parameters
 
+    if (advancedSearch?.resultType !== undefined && advancedSearch.resultType !== 'channels') {
+      return of({ total: 0, data: [] })
+    }
+
     const url = SearchService.BASE_SEARCH_URL + 'video-channels'
 
     let pagination: RestPagination
@@ -107,6 +115,10 @@ export class SearchService {
   }): Observable<ResultList<VideoPlaylist>> {
     const { search, advancedSearch, componentPagination, uuids } = parameters
 
+    if (advancedSearch?.resultType !== undefined && advancedSearch.resultType !== 'playlists') {
+      return of({ total: 0, data: [] })
+    }
+
     const url = SearchService.BASE_SEARCH_URL + 'video-playlists'
 
     let pagination: RestPagination
diff --git a/client/src/assets/player/p2p-media-loader/hls-plugin.ts b/client/src/assets/player/p2p-media-loader/hls-plugin.ts
index 71c31696a..421ce4934 100644
--- a/client/src/assets/player/p2p-media-loader/hls-plugin.ts
+++ b/client/src/assets/player/p2p-media-loader/hls-plugin.ts
@@ -146,7 +146,10 @@ class Html5Hlsjs {
   }
 
   duration () {
-    return this._duration || this.videoElement.duration || 0
+    if (this._duration === Infinity) return Infinity
+    if (!isNaN(this.videoElement.duration)) return this.videoElement.duration
+
+    return this._duration || 0
   }
 
   seekable () {
@@ -366,6 +369,7 @@ class Html5Hlsjs {
 
       this.isLive = data.details.live
       this.dvrDuration = data.details.totalduration
+
       this._duration = this.isLive ? Infinity : data.details.totalduration
     })
 
diff --git a/client/src/assets/player/peertube-plugin.ts b/client/src/assets/player/peertube-plugin.ts
index 0121e87d7..451b4a161 100644
--- a/client/src/assets/player/peertube-plugin.ts
+++ b/client/src/assets/player/peertube-plugin.ts
@@ -11,6 +11,7 @@ import {
 } from './peertube-player-local-storage'
 import { PeerTubePluginOptions, UserWatching, VideoJSCaption } from './peertube-videojs-typings'
 import { isMobile } from './utils'
+import { SettingsButton } from './videojs-components/settings-menu-button'
 
 const Plugin = videojs.getPlugin('plugin')
 
@@ -31,7 +32,8 @@ class PeerTubePlugin extends Plugin {
 
   private menuOpened = false
   private mouseInControlBar = false
-  private readonly savedInactivityTimeout: number
+  private mouseInSettings = false
+  private readonly initialInactivityTimeout: number
 
   constructor (player: videojs.Player, options?: PeerTubePluginOptions) {
     super(player)
@@ -40,8 +42,7 @@ class PeerTubePlugin extends Plugin {
     this.videoDuration = options.videoDuration
     this.videoCaptions = options.videoCaptions
     this.isLive = options.isLive
-
-    this.savedInactivityTimeout = player.options_.inactivityTimeout
+    this.initialInactivityTimeout = this.player.options_.inactivityTimeout
 
     if (options.autoplay) this.player.addClass('vjs-has-autoplay')
 
@@ -108,13 +109,13 @@ class PeerTubePlugin extends Plugin {
     if (this.userWatchingVideoInterval) clearInterval(this.userWatchingVideoInterval)
   }
 
-  onMenuOpen () {
-    this.menuOpened = false
+  onMenuOpened () {
+    this.menuOpened = true
     this.alterInactivity()
   }
 
   onMenuClosed () {
-    this.menuOpened = true
+    this.menuOpened = false
     this.alterInactivity()
   }
 
@@ -126,6 +127,8 @@ class PeerTubePlugin extends Plugin {
     this.initCaptions()
 
     this.listenControlBarMouse()
+
+    this.listenFullScreenChange()
   }
 
   private runViewAdd () {
@@ -198,27 +201,50 @@ class PeerTubePlugin extends Plugin {
     return fetch(url, { method: 'PUT', body, headers })
   }
 
+  private listenFullScreenChange () {
+    this.player.on('fullscreenchange', () => {
+      if (this.player.isFullscreen()) this.player.focus()
+    })
+  }
+
   private listenControlBarMouse () {
-    this.player.controlBar.on('mouseenter', () => {
+    const controlBar = this.player.controlBar
+    const settingsButton: SettingsButton = (controlBar as any).settingsButton
+
+    controlBar.on('mouseenter', () => {
       this.mouseInControlBar = true
       this.alterInactivity()
     })
 
-    this.player.controlBar.on('mouseleave', () => {
+    controlBar.on('mouseleave', () => {
       this.mouseInControlBar = false
       this.alterInactivity()
     })
+
+    settingsButton.dialog.on('mouseenter', () => {
+      this.mouseInSettings = true
+      this.alterInactivity()
+    })
+
+    settingsButton.dialog.on('mouseleave', () => {
+      this.mouseInSettings = false
+      this.alterInactivity()
+    })
   }
 
   private alterInactivity () {
-    if (this.menuOpened) {
-      this.player.options_.inactivityTimeout = this.savedInactivityTimeout
+    if (this.menuOpened || this.mouseInSettings || this.mouseInControlBar || this.isTouchEnabled()) {
+      this.setInactivityTimeout(0)
       return
     }
 
-    if (!this.mouseInControlBar && !this.isTouchEnabled()) {
-      this.player.options_.inactivityTimeout = 1
-    }
+    this.setInactivityTimeout(this.initialInactivityTimeout)
+    this.player.reportUserActivity(true)
+  }
+
+  private setInactivityTimeout (timeout: number) {
+    (this.player as any).cache_.inactivityTimeout = timeout
+    this.player.options_.inactivityTimeout = timeout
   }
 
   private isTouchEnabled () {
diff --git a/client/src/assets/player/videojs-components/settings-menu-button.ts b/client/src/assets/player/videojs-components/settings-menu-button.ts
index 75a5c6904..6de390f4d 100644
--- a/client/src/assets/player/videojs-components/settings-menu-button.ts
+++ b/client/src/assets/player/videojs-components/settings-menu-button.ts
@@ -144,7 +144,7 @@ class SettingsButton extends Button {
   }
 
   showDialog () {
-    this.player().peertube().onMenuOpen();
+    this.player().peertube().onMenuOpened();
 
     (this.menu.el() as HTMLElement).style.opacity = '1'
 
diff --git a/client/src/root-helpers/plugins-manager.ts b/client/src/root-helpers/plugins-manager.ts
index a1b763ff2..e574e75a3 100644
--- a/client/src/root-helpers/plugins-manager.ts
+++ b/client/src/root-helpers/plugins-manager.ts
@@ -13,8 +13,10 @@ import {
   PluginType,
   RegisterClientFormFieldOptions,
   RegisterClientHookOptions,
-  RegisterClientSettingsScript,
+  RegisterClientRouteOptions,
+  RegisterClientSettingsScriptOptions,
   RegisterClientVideoFieldOptions,
+  RegisteredExternalAuthConfig,
   ServerConfigPlugin
 } from '../../../shared/models'
 import { environment } from '../environments/environment'
@@ -36,7 +38,8 @@ type PluginInfo = {
 
 type PeertubeHelpersFactory = (pluginInfo: PluginInfo) => RegisterClientHelpers
 type OnFormFields = (options: RegisterClientFormFieldOptions, videoFormOptions: RegisterClientVideoFieldOptions) => void
-type OnSettingsScripts = (pluginInfo: PluginInfo, options: RegisterClientSettingsScript) => void
+type OnSettingsScripts = (pluginInfo: PluginInfo, options: RegisterClientSettingsScriptOptions) => void
+type OnClientRoute = (options: RegisterClientRouteOptions) => void
 
 const logger = debug('peertube:plugins')
 
@@ -63,21 +66,29 @@ class PluginsManager {
   private readonly peertubeHelpersFactory: PeertubeHelpersFactory
   private readonly onFormFields: OnFormFields
   private readonly onSettingsScripts: OnSettingsScripts
+  private readonly onClientRoute: OnClientRoute
 
   constructor (options: {
     peertubeHelpersFactory: PeertubeHelpersFactory
     onFormFields?: OnFormFields
     onSettingsScripts?: OnSettingsScripts
+    onClientRoute?: OnClientRoute
   }) {
     this.peertubeHelpersFactory = options.peertubeHelpersFactory
     this.onFormFields = options.onFormFields
     this.onSettingsScripts = options.onSettingsScripts
+    this.onClientRoute = options.onClientRoute
   }
 
   static getPluginPathPrefix (isTheme: boolean) {
     return isTheme ? '/themes' : '/plugins'
   }
 
+  static getExternalAuthHref (auth: RegisteredExternalAuthConfig) {
+    return environment.apiUrl + `/plugins/${auth.name}/${auth.version}/auth/${auth.authName}`
+
+  }
+
   loadPluginsList (config: HTMLServerConfig) {
     for (const plugin of config.plugin.registered) {
       this.addPlugin(plugin)
@@ -215,7 +226,7 @@ class PluginsManager {
       return this.onFormFields(commonOptions, videoFormOptions)
     }
 
-    const registerSettingsScript = (options: RegisterClientSettingsScript) => {
+    const registerSettingsScript = (options: RegisterClientSettingsScriptOptions) => {
       if (!this.onSettingsScripts) {
         throw new Error('Registering settings script is not supported')
       }
@@ -223,13 +234,29 @@ class PluginsManager {
       return this.onSettingsScripts(pluginInfo, options)
     }
 
+    const registerClientRoute = (options: RegisterClientRouteOptions) => {
+      if (!this.onClientRoute) {
+        throw new Error('Registering client route is not supported')
+      }
+
+      return this.onClientRoute(options)
+    }
+
     const peertubeHelpers = this.peertubeHelpersFactory(pluginInfo)
 
     console.log('Loading script %s of plugin %s.', clientScript.script, plugin.name)
 
     const absURL = (environment.apiUrl || window.location.origin) + clientScript.script
     return dynamicImport(absURL)
-      .then((script: ClientScriptModule) => script.register({ registerHook, registerVideoField, registerSettingsScript, peertubeHelpers }))
+      .then((script: ClientScriptModule) => {
+        return script.register({
+          registerHook,
+          registerVideoField,
+          registerSettingsScript,
+          registerClientRoute,
+          peertubeHelpers
+        })
+      })
       .then(() => this.sortHooksByPriority())
       .catch(err => console.error('Cannot import or register plugin %s.', pluginInfo.plugin.name, err))
   }
diff --git a/client/src/sass/player/peertube-skin.scss b/client/src/sass/player/peertube-skin.scss
index 96d752699..332a0e17d 100644
--- a/client/src/sass/player/peertube-skin.scss
+++ b/client/src/sass/player/peertube-skin.scss
@@ -71,7 +71,7 @@ body {
     height: $big-play-height;
     line-height: $big-play-height;
     margin-top: -(math.div($big-play-height, 2));
-    transition: 0.4s opacity;
+    transition: 0.2s background-color;
 
     &::-moz-focus-inner {
       border: 0;
@@ -89,30 +89,6 @@ body {
     &:hover {
       background-color: var(--mainColor, #696969);
     }
-
-  }
-
-  // Small effect when we click on the play button
-  &.vjs-has-big-play-button-clicked {
-
-    .vjs-big-play-button,
-    .vjs-poster {
-      display: block;
-      visibility: hidden;
-
-      &.vjs-big-play-button,
-      &.vjs-big-play-button::before {
-        opacity: 0;
-        transition: visibility 0.2s, opacity 0.2s;
-      }
-
-      &.vjs-poster,
-      &.vjs-poster::before {
-        opacity: 0;
-        transition: visibility 0.3s, opacity 0.3s;
-        transition-delay: 0.05s;
-      }
-    }
   }
 
   // Show poster and controls when playing audio-only content
@@ -158,6 +134,7 @@ body {
     background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.6));
     box-shadow: 0 -15px 40px 10px rgba(0, 0, 0, 0.2);
     text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
+    transition: visibility 0.3s, opacity 0.3s !important;
 
     > button:first-child {
       @include margin-left($first-control-bar-element-margin-left);
diff --git a/client/src/standalone/videos/embed.ts b/client/src/standalone/videos/embed.ts
index 9d1c6c443..874be580d 100644
--- a/client/src/standalone/videos/embed.ts
+++ b/client/src/standalone/videos/embed.ts
@@ -758,8 +758,8 @@ export class PeerTubeEmbed {
 
     return {
       getBaseStaticRoute: unimplemented,
-
       getBaseRouterRoute: unimplemented,
+      getBasePluginClientPath: unimplemented,
 
       getSettings: unimplemented,
 
diff --git a/client/src/types/register-client-option.model.ts b/client/src/types/register-client-option.model.ts
index 3415ef08f..73f82e781 100644
--- a/client/src/types/register-client-option.model.ts
+++ b/client/src/types/register-client-option.model.ts
@@ -1,7 +1,8 @@
 import {
   RegisterClientFormFieldOptions,
   RegisterClientHookOptions,
-  RegisterClientSettingsScript,
+  RegisterClientRouteOptions,
+  RegisterClientSettingsScriptOptions,
   RegisterClientVideoFieldOptions,
   ServerConfig
 } from '@shared/models'
@@ -11,7 +12,9 @@ export type RegisterClientOptions = {
 
   registerVideoField: (commonOptions: RegisterClientFormFieldOptions, videoFormOptions: RegisterClientVideoFieldOptions) => void
 
-  registerSettingsScript: (options: RegisterClientSettingsScript) => void
+  registerSettingsScript: (options: RegisterClientSettingsScriptOptions) => void
+
+  registerClientRoute: (options: RegisterClientRouteOptions) => void
 
   peertubeHelpers: RegisterClientHelpers
 }
@@ -21,6 +24,8 @@ export type RegisterClientHelpers = {
 
   getBaseRouterRoute: () => string
 
+  getBasePluginClientPath: () => string
+
   isLoggedIn: () => boolean
 
   getAuthHeader: () => { 'Authorization': string } | undefined