diff --git a/src/App.vue b/src/App.vue
index a94b015f..90959d61 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -9,19 +9,21 @@
 					<div class="columns">
 						<div class="column is-3">
 							<aside class="menu">
+								<p class="menu-label" v-if="loading">Loading...</p>
 								<template v-for="n in namespaces">
-									<p v-bind:key="n.id" class="menu-label">
+									<p class="menu-label" :key="n.id">
 										{{n.name}}
 									</p>
-									<ul v-bind:key="n.lists" class="menu-list">
-										<template v-for="l in n.lists">
-											<li v-bind:key="l.id"><a>{{l.title}}</a></li>
-										</template>
+									<ul class="menu-list" :key="n.id + 'child'">
+										<li v-for="l in n.lists" :key="l.id">
+											<a>{{l.title}}</a>
+										</li>
 									</ul>
 								</template>
 							</aside>
 						</div>
 						<div class="column is-9">
+							<button class="button is-success" v-on:click="loadNamespaces()">Load Namespaces</button>
 							<router-view/>
 						</div>
 					</div>
@@ -61,16 +63,17 @@
                 HTTP.get(`namespaces`, {headers: {'Authorization': 'Bearer ' + localStorage.getItem('token')}})
                     .then(response => {
 
-                        let namespaces = response.data
+                        let nps = response.data
 
-                        // Get the lists
-                        for (const n in namespaces) {
+                        // Loop through the namespaces and get their lists
+                        for (const n in nps) {
 
-                            this.namespaces[n] = namespaces[n]
+                            this.namespaces.push(nps[n])
 
-                            HTTP.get(`namespaces/` + namespaces[n].id + `/lists`, {headers: {'Authorization': 'Bearer ' + localStorage.getItem('token')}})
+                            HTTP.get(`namespaces/` + nps[n].id + `/lists`, {headers: {'Authorization': 'Bearer ' + localStorage.getItem('token')}})
                                 .then(response => {
-                                    this.namespaces[n].lists = response.data
+                                    // This adds a new element "list" to our object which contains all lists
+                                    this.$set(this.namespaces[n], 'lists', response.data)
                                 })
                                 .catch(e => {
                                     this.loading = false
@@ -79,9 +82,6 @@
                                 })
                         }
 
-                        // eslint-disable-next-line
-                        console.log(this.namespaces)
-
                         this.loading = false
                     })
                     .catch(e => {