2 files changed, 32 insertions, 5 deletions

diff --git a/client/src/app/+page-not-found/page-not-found.component.html b/client/src/app/+page-not-found/page-not-found.component.html
index aa57b07e8..efd3cc9f9 100644
--- a/client/src/app/+page-not-found/page-not-found.component.html
+++ b/client/src/app/+page-not-found/page-not-found.component.html
@@ -1,23 +1,32 @@
 <div class="root">
-  <div *ngIf="status === 404" class="box">
+  <div *ngIf="status !== 403 && status !== 418" class="box">
     <strong>{{ status }}.</strong>
     <span class="ml-1 text-muted" i18n>That's an error.</span>
 
     <div class="text mt-4" i18n>
-      We couldn't find any ressource tied to the URL {{ pathname }} you were looking for.
+      We couldn't find any {{ getRessourceName() }} tied to the URL {{ pathname }} you were looking for.
     </div>
 
     <div class="text-muted mt-4">
       <span i18n="Possible reasons preceding a list of reasons a `Not Found` error page may occur">Possible reasons:</span>
 
       <ul>
-        <li i18n>The page may have been moved or deleted</li>
         <li i18n>You may have used an outdated or broken link</li>
+        <li i18n>The {{ getRessourceName() }} may have been moved or deleted</li>
         <li i18n>You may have typed the address or URL incorrectly</li>
       </ul>
     </div>
   </div>
 
+  <div *ngIf="status === 403" class="box">
+    <strong>{{ status }}.</strong>
+    <span class="ml-1 text-muted" i18n>You are not authorized here.</span>
+
+    <div class="text mt-4" i18n>
+      You might need to check your account is allowed by the {{ getRessourceName() }} or instance owner.
+    </div>
+  </div>
+
   <div *ngIf="status === 418" class="box">
     <strong>{{ status }}.</strong>
     <span class="ml-1 text-muted">I'm a teapot.</span>
diff --git a/client/src/app/+page-not-found/page-not-found.component.ts b/client/src/app/+page-not-found/page-not-found.component.ts
index 81830d415..9302201ea 100644
--- a/client/src/app/+page-not-found/page-not-found.component.ts
+++ b/client/src/app/+page-not-found/page-not-found.component.ts
@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core'
 import { Title } from '@angular/platform-browser'
+import { Router } from '@angular/router'
 import { HttpStatusCode } from '@shared/core-utils/miscs/http-error-codes'
 
 @Component({
@@ -9,10 +10,16 @@ import { HttpStatusCode } from '@shared/core-utils/miscs/http-error-codes'
 })
 export class PageNotFoundComponent implements OnInit {
   status = HttpStatusCode.NOT_FOUND_404
+  type: string
 
   public constructor (
-    private titleService: Title
-  ) {}
+    private titleService: Title,
+    private router: Router
+  ) {
+    const state = this.router.getCurrentNavigation()?.extras.state
+    this.type = state?.type || this.type
+    this.status = state?.obj.status || this.status
+  }
 
   ngOnInit () {
     if (this.pathname.includes('teapot')) {
@@ -25,10 +32,21 @@ export class PageNotFoundComponent implements OnInit {
     return window.location.pathname
   }
 
+  getRessourceName () {
+    switch (this.type) {
+      case 'video':
+        return $localize`video`
+      default:
+        return $localize`ressource`
+    }
+  }
+
   getMascotName () {
     switch (this.status) {
       case HttpStatusCode.I_AM_A_TEAPOT_418:
         return 'happy'
+      case HttpStatusCode.FORBIDDEN_403:
+        return 'arguing'
       case HttpStatusCode.NOT_FOUND_404:
       default:
         return 'defeated'