applied new directory structure to device add page

projects/account/src/app/modules/device/components/view/add-complete/add-complete.component.scss

@@ -1,4 +1,4 @@
-@import "~@angular/material/theming";
+@import "../../../../../../../../../node_modules/@angular/material/theming";
 @import "mycroft-colors";
 
 mat-card {

projects/account/src/app/modules/device/device-add/pairing/pairing.component.html

@@ -1,17 +0,0 @@
-<mat-card class="mat-elevation-z0">
-    <mat-card-title>Verify your pairing code</mat-card-title>
-    <mat-card-content>
-        <p>Enter the code spoken by your device:</p>
-        <mat-form-field [appearance]="'outline'">
-            <mat-label>Pairing Code</mat-label>
-            <input
-                    matInput
-                    required
-                    type="text"
-                    onInput="this.value = this.value.toUpperCase()"
-                    [formControl]="pairingCodeControl"
-            >
-            <mat-hint>Six alphanumeric characters</mat-hint>
-        </mat-form-field>
-    </mat-card-content>
-</mat-card>

projects/account/src/app/modules/device/device-add/pairing/pairing.component.scss

@@ -1,12 +0,0 @@
-@import "~@angular/material/theming";
-@import "mycroft-colors";
-
-mat-card {
-    margin-left: auto;
-    margin-right: auto;
-    max-width: 300px;
-
-    mat-card-title {
-        color: mat-color($mycroft-primary)
-    }
-}

projects/account/src/app/modules/device/device-add/pairing/pairing.component.ts

@@ -1,17 +0,0 @@
-import { Component, OnInit, Input } from '@angular/core';
-import { AbstractControl } from '@angular/forms';
-
-@Component({
-    selector: 'account-device-pairing',
-    templateUrl: './pairing.component.html',
-    styleUrls: ['./pairing.component.scss']
-})
-export class PairingComponent implements OnInit {
-    @Input() pairingCodeControl: AbstractControl;
-
-    constructor() { }
-
-    ngOnInit() {
-    }
-
-}

projects/account/src/app/modules/device/device-routing.module.ts

@@ -2,7 +2,7 @@ import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';
 
 import { DefaultsResolverService } from '../../core/guards/defaults-resolver.service';
-import { DeviceAddComponent } from './device-add/device-add.component';
+import { DeviceAddComponent } from './pages/device-add/device-add.component';
 import { DevicesComponent } from './pages/devices/devices.component';
 import { DeviceEditComponent } from './device-edit/device-edit.component';
 import { DeviceResolverService } from '../../core/guards/device-resolver.service';

projects/account/src/app/modules/device/device.module.ts

@@ -23,14 +23,14 @@ import { DeviceService } from '@account/http/device.service';
 import { PreferencesComponent } from './components/view/preferences/preferences.component';
 import { RemoveComponent } from './remove/remove.component';
 import { SharedModule } from '../../shared/shared.module';
-import { DeviceAddComponent } from './device-add/device-add.component';
+import { DeviceAddComponent } from './pages/device-add/device-add.component';
 import { DeviceListComponent } from './components/view/device-list/device-list.component';
 import { DeviceEditComponent } from './device-edit/device-edit.component';
 import { CityInputComponent } from './components/input/city-input/city-input.component';
 import { CountryInputComponent } from './components/input/country-input/country-input.component';
 import { RegionInputComponent } from './components/input/region-input/region-input.component';
 import { TimezoneInputComponent } from './components/input/timezone-input/timezone-input.component';
-import { AddCompleteComponent } from './device-add/add-complete/add-complete.component';
+import { AddCompleteComponent } from './components/view/add-complete/add-complete.component';
 import { DevicesComponent } from './pages/devices/devices.component';
 import { DeviceInfoComponent } from './components/view/device-info/device-info.component';
 import { DefaultsComponent } from './components/view/defaults/defaults.component';

projects/account/src/app/modules/device/pages/device-add/device-add.component.scss

@@ -1,6 +1,6 @@
-@import "~@angular/material/theming";
+@import "../../../../../../../../node_modules/@angular/material/theming";
 @import "mycroft-colors";
-@import "components/buttons";
+@import "../../../../../../../../src/stylesheets/components/buttons";
 
 button {
     @include action-button-primary;

projects/account/src/app/modules/device/pages/device-add/device-add.component.ts

@@ -10,9 +10,9 @@ import { ActivatedRoute } from '@angular/router';
 import { faCheck } from '@fortawesome/free-solid-svg-icons';
 import { Subscription } from 'rxjs';
 
-import { AccountPreferences } from '../../../shared/models/preferences.model';
+import { AccountPreferences } from '../../../../shared/models/preferences.model';
-import { DeviceService } from '../../../core/http/device.service';
+import { DeviceService } from '../../../../core/http/device.service';
-import { AccountDefaults } from '../../../shared/models/defaults.model';
+import { AccountDefaults } from '../../../../shared/models/defaults.model';
 
 @Component({
   selector: 'account-device-add',

projects/account/src/app/modules/device/pages/devices/devices.component.ts

@@ -28,15 +28,15 @@ export class DevicesComponent implements OnInit {
 
         this.defaultsForm = this.formBuilder.group(
             {
-                city: [this.defaults ? this.defaults.city : null],
+                city: [this.defaults ? this.defaults.city.name : null],
-                country: [this.defaults ? this.defaults.country : null],
+                country: [this.defaults ? this.defaults.country.name : null],
                 name: [null],
                 pairingCode: [null],
                 placement: [null],
-                region: [this.defaults ? this.defaults.region : null],
+                region: [this.defaults ? this.defaults.region.name : null],
-                timezone: [this.defaults ? this.defaults.timezone : null],
+                timezone: [this.defaults ? this.defaults.timezone.name : null],
-                wakeWord: [this.defaults ? this.defaults.wakeWord : null],
+                wakeWord: [this.defaults ? this.defaults.wakeWord.displayName : null],
-                voice: [this.defaults ? this.defaults.voice : null]
+                voice: [this.defaults ? this.defaults.voice.displayName : null]
             }
         );
         this.preferencesForm = this.formBuilder.group(