From: Tiago Melo Date: Fri, 9 Feb 2018 19:49:55 +0000 (+0000) Subject: mgr/dashboard_v2: add 404 page X-Git-Tag: v13.0.2~84^2~59 X-Git-Url: http://git-server-git.apps.pok.os.sepia.ceph.com/?a=commitdiff_plain;h=e6692ed853aacc1975e4a63bccf94c2b05149d11;p=ceph.git mgr/dashboard_v2: add 404 page Add a 404 page that will be triggered every time the user tries to access a route that does not exists or the servers responds with 404. Signed-off-by: Tiago Melo --- diff --git a/src/pybind/mgr/dashboard_v2/frontend/src/app/app-routing.module.ts b/src/pybind/mgr/dashboard_v2/frontend/src/app/app-routing.module.ts index b5c2dc06bbb2..253ba0fdbcf1 100644 --- a/src/pybind/mgr/dashboard_v2/frontend/src/app/app-routing.module.ts +++ b/src/pybind/mgr/dashboard_v2/frontend/src/app/app-routing.module.ts @@ -10,6 +10,7 @@ import { } from './ceph/performance-counter/performance-counter/performance-counter.component'; import { RgwDaemonListComponent } from './ceph/rgw/rgw-daemon-list/rgw-daemon-list.component'; import { LoginComponent } from './core/auth/login/login.component'; +import { NotFoundComponent } from './core/not-found/not-found.component'; import { AuthGuardService } from './shared/services/auth-guard.service'; const routes: Routes = [ @@ -29,7 +30,9 @@ const routes: Routes = [ component: PerformanceCounterComponent, canActivate: [AuthGuardService] }, - { path: 'monitor', component: MonitorComponent, canActivate: [AuthGuardService] } + { path: 'monitor', component: MonitorComponent, canActivate: [AuthGuardService] }, + { path: '404', component: NotFoundComponent }, + { path: '**', redirectTo: '/404'} ]; @NgModule({ diff --git a/src/pybind/mgr/dashboard_v2/frontend/src/app/core/core.module.ts b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/core.module.ts index cbd40c6610a1..bd1768158e7e 100644 --- a/src/pybind/mgr/dashboard_v2/frontend/src/app/core/core.module.ts +++ b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/core.module.ts @@ -3,6 +3,7 @@ import { NgModule } from '@angular/core'; import { AuthModule } from './auth/auth.module'; import { NavigationModule } from './navigation/navigation.module'; +import { NotFoundComponent } from './not-found/not-found.component'; @NgModule({ imports: [ @@ -11,6 +12,6 @@ import { NavigationModule } from './navigation/navigation.module'; AuthModule ], exports: [NavigationModule], - declarations: [] + declarations: [NotFoundComponent] }) export class CoreModule { } diff --git a/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.html b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.html new file mode 100644 index 000000000000..5ba41d229c35 --- /dev/null +++ b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.html @@ -0,0 +1,14 @@ +
+
+

Sorry, we could not find what you were looking for

+ + + + "Mimic Octopus" by prilfish is licensed under + CC BY 2.0 + +
+
diff --git a/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.scss b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.scss new file mode 100644 index 000000000000..e94d9f2fb82c --- /dev/null +++ b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.scss @@ -0,0 +1,15 @@ +h1 { + font-size: -webkit-xxx-large; +} + +h2 { + font-size: xx-large; +} + +*{ + font-family: monospace; +} + +img{ + width: 50vw; +} diff --git a/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.spec.ts b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.spec.ts new file mode 100644 index 000000000000..35189ed0b766 --- /dev/null +++ b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { NotFoundComponent } from './not-found.component'; + +describe('NotFoundComponent', () => { + let component: NotFoundComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ NotFoundComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(NotFoundComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.ts b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.ts new file mode 100644 index 000000000000..d12bc32100de --- /dev/null +++ b/src/pybind/mgr/dashboard_v2/frontend/src/app/core/not-found/not-found.component.ts @@ -0,0 +1,10 @@ +import { Component } from '@angular/core'; + +@Component({ + selector: 'cd-not-found', + templateUrl: './not-found.component.html', + styleUrls: ['./not-found.component.scss'] +}) +export class NotFoundComponent { + constructor() {} +} diff --git a/src/pybind/mgr/dashboard_v2/frontend/src/app/shared/services/auth-interceptor.service.ts b/src/pybind/mgr/dashboard_v2/frontend/src/app/shared/services/auth-interceptor.service.ts index b609d14cc860..f09250d6c172 100644 --- a/src/pybind/mgr/dashboard_v2/frontend/src/app/shared/services/auth-interceptor.service.ts +++ b/src/pybind/mgr/dashboard_v2/frontend/src/app/shared/services/auth-interceptor.service.ts @@ -26,6 +26,11 @@ export class AuthInterceptorService implements HttpInterceptor { } }, (err: any) => { if (err instanceof HttpErrorResponse) { + if (err.status === 404) { + this.router.navigate(['/404']); + return; + } + this.toastr.error(err.error.detail || '', `${err.status} - ${err.statusText}`); if (err.status === 401) { this.authStorageService.remove(); diff --git a/src/pybind/mgr/dashboard_v2/frontend/src/assets/1280px-Mimic_Octopus2.jpg b/src/pybind/mgr/dashboard_v2/frontend/src/assets/1280px-Mimic_Octopus2.jpg new file mode 100644 index 000000000000..f8cf2a8de5f3 Binary files /dev/null and b/src/pybind/mgr/dashboard_v2/frontend/src/assets/1280px-Mimic_Octopus2.jpg differ