added recorder status component and other stuff

src/views/Home.vue

@@ -1,30 +1,63 @@
 <template>
     <div class="home">
-        <b-alert show>Default Alert</b-alert>
+        <div class="container">
+            <section class="section">
 
-        <img alt="Vue logo" src="../assets/logo.png">
-        <HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
+                <HelloWorld v-if="!authenticated" msg="you are not authenticated!"/>
+                <div v-else>
+                    <h1>Welcome <span v-if="profile.last_seen!=null">back</span> {{$store.getters.getUserName}}! <span
+                            v-if="profile.last_seen!=null">(Last seen: {{profile.last_seen | moment("dddd, MMMM Do YYYY")}})</span>
+                    </h1>
+                    <SelectRecorder/>
+
+                    <div v-if="profile.favorite_recorders.length >0">
+                        <ul>
+                            <li v-for="recorder in profile.favorite_recorders">{{recorder.name}}</li>
+                        </ul>
+                        <RecorderState v-for="recorder in profile.favorite_recorders" :recorder="recorder"/>
+                    </div>
+
+                </div>
+
+            </section>
+        </div>
     </div>
 </template>
 
 <script lang="ts">
-    import {Component, Vue} from 'vue-property-decorator';
-    import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
-    import i18n from '@/plugins/i18n';
-
-    @Component({
-        components: {
-            HelloWorld,
-        },
-    })
-    export default class Home extends Vue {
-        public data() {
-            return {
-
-            };
-        }
+  import {Component, Vue} from 'vue-property-decorator';
+  import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
+  import i18n from '@/plugins/i18n';
+  import SelectRecorder from '@/components/SelectRecorder.vue';
+  import RecorderState from '@/components/RecorderState.vue';
 
+  @Component({
+    components: {
+      RecorderState,
+      SelectRecorder,
+      HelloWorld,
+    },
+  })
+  export default class Home extends Vue {
+    public data() {
+      return {};
     }
+
+    mounted() {
+      if (this.profile == null || Object.keys(this.profile).length === 0) {
+        this.$store.dispatch('loadProfile');
+      }
+    }
+
+    get authenticated() {
+      return this.$store.getters.isAuthenticated;
+    }
+
+    get profile() {
+      return this.$store.state.profile;
+    }
+
+  }
 </script>
 
 <style>