Rewrote the urls

src/app/app-routing.module.ts

@@ -3,19 +3,17 @@ import {Routes, RouterModule} from '@angular/router';
 import {DashboardComponent} from './dashboard/dashboard.component';
 import {WeatherComponent} from './weather/weather.component';
 import {SecurityComponent} from './security/security.component';
-import {SettingsComponent} from './settings/settings.component';
 import {BatteryComponent} from './battery/battery.component';
 import {LoginComponent} from './login/login.component';
 import {LoginGuard} from './login/login.guard';
 
 const routes: Routes = [
     {path: 'battery', component: BatteryComponent, canActivate: [LoginGuard]},
-    {path: 'dashboard', component: DashboardComponent, canActivate: [LoginGuard]},
     {path: 'login', component: LoginComponent, data: {hide: true, noAnimation: true}},
     {path: 'security', component: SecurityComponent, canActivate: [LoginGuard]},
-    {path: 'settings', component: SettingsComponent, canActivate: [LoginGuard]},
     {path: 'weather', component: WeatherComponent, canActivate: [LoginGuard]},
-    {path: '**', redirectTo: '/dashboard'}
+    {path: '', component: DashboardComponent, canActivate: [LoginGuard]},
+    {path: '**', redirectTo: '/'}
 ];
 
 @NgModule({

src/app/app.component.html

@@ -10,7 +10,7 @@
     <mat-drawer class="bg-primary" [mode]="mobile ? 'push' : 'side'" [opened]="open" [disableClose]="!mobile" [autoFocus]="false">
         <mat-nav-list class="p-0">
             <mat-divider></mat-divider>
-            <a mat-list-item routerLink="dashboard" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">insert_chart</mat-icon> Dashboard</span></a>
+            <a mat-list-item routerLink="" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">insert_chart</mat-icon> Dashboard</span></a>
             <mat-divider></mat-divider>
             <a mat-list-item routerLink="battery" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">{{batteryService.icon}}</mat-icon> Powerwall</span></a>
             <mat-divider></mat-divider>
@@ -18,8 +18,6 @@
             <mat-divider></mat-divider>
             <a mat-list-item routerLink="security" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">security</mat-icon> Security</span></a>
             <mat-divider></mat-divider>
-            <a mat-list-item routerLink="settings" routerLinkActive="active"><span class="p-3 pl-0 mr-5"><mat-icon class="mr-2">settings</mat-icon> Settings</span></a>
-            <mat-divider></mat-divider>
             <a mat-list-item (click)="logout()"><span class="p-3 pl-0 mr-5" style="color: darkred"><mat-icon class="mr-2">logout</mat-icon> Logout</span></a>
             <mat-divider></mat-divider>
         </mat-nav-list>

src/app/app.module.ts

@@ -14,18 +14,17 @@ import {
     MatSidenavModule,
     MatToolbarModule
 } from '@angular/material';
-import { DashboardComponent } from './dashboard/dashboard.component';
+import {DashboardComponent} from './dashboard/dashboard.component';
-import { BatteryComponent } from './battery/battery.component';
+import {BatteryComponent} from './battery/battery.component';
-import { WeatherComponent } from './weather/weather.component';
+import {WeatherComponent} from './weather/weather.component';
-import { SecurityComponent } from './security/security.component';
+import {SecurityComponent} from './security/security.component';
-import { SettingsComponent } from './settings/settings.component';
 import {HttpClientModule} from '@angular/common/http';
-import { LoginComponent } from './login/login.component';
+import {LoginComponent} from './login/login.component';
 import {environment} from '../environments/environment';
 import * as firebase from 'firebase/app';
-import { ServiceWorkerModule } from '@angular/service-worker';
+import {ServiceWorkerModule} from '@angular/service-worker';
 import {LineChartModule, NgxChartsModule} from '@swimlane/ngx-charts';
-import { RoundPipe } from './round.pipe';
+import {RoundPipe} from './round.pipe';
 
 export const firebaseApp = firebase.initializeApp(environment.firebase);
 
@@ -36,7 +35,6 @@ export const firebaseApp = firebase.initializeApp(environment.firebase);
         BatteryComponent,
         WeatherComponent,
         SecurityComponent,
-        SettingsComponent,
         LoginComponent,
         RoundPipe
     ],
@@ -59,7 +57,7 @@ export const firebaseApp = firebase.initializeApp(environment.firebase);
         MatSidenavModule,
         MatToolbarModule,
         NgxChartsModule,
-        ServiceWorkerModule.register('ngsw-worker.js', { enabled: false }),
+        ServiceWorkerModule.register('ngsw-worker.js', {enabled: false}),
     ],
     providers: [],
     bootstrap: [AppComponent]

src/app/settings/settings.component.html

@@ -1 +0,0 @@
-<h3 class="mt-3 text-center">Coming Soon</h3>

src/app/settings/settings.component.ts

@@ -1,14 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-settings',
-  templateUrl: './settings.component.html'
-})
-export class SettingsComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {
-  }
-
-}