Update..

frontend/pages/create.vue

@@ -21,6 +21,8 @@
                         auto-grow
                     ></v-textarea>
                     <client-only v-else>
+                        <!-- html is sanitized -->
+                        <!-- eslint-disable-next-line -->
                         <div class="html" v-html="html" />
                     </client-only>
                 </v-card-text>
@@ -51,12 +53,7 @@ export default {
         },
     },
     mounted() {
-        this.$axios
-            .get('/tags')
-            .then((e) => (this.possibleTags = e.data))
-            .catch((e) => {
-                console.log(e)
-            })
+        this.$axios.get('/tags').then((e) => (this.possibleTags = e.data))
     },
     methods: {
         createNote() {
@@ -71,8 +68,6 @@ export default {
                 .catch((e) => {
                     if (e.response && e.response.status === 409) {
                         this.conflict = true
-                    } else {
-                        console.log('??')
                     }
                 })
         },

frontend/pages/notes/_uuid.vue

@@ -6,6 +6,8 @@
             <TagsGroup :tags="note.tags" />
         </v-card-title>
         <v-card-text>
+            <!-- html is sanitized -->
+            <!-- eslint-disable-next-line -->
             <div v-html="renderedMarkdown"></div>
         </v-card-text>
     </v-card>
@@ -23,8 +25,9 @@ export default {
     }),
     computed: {
         renderedMarkdown() {
-            if (!this.note.chapters) return ''
-            return renderMarkdown(this.note.chapters[0].content).contents
+            return !this.note.content
+                ? ''
+                : renderMarkdown(this.note.content).contents
         },
     },
     mounted() {

frontend/pages/notes/index.vue

@@ -1,13 +1,16 @@
 <template>
     <div>
         <v-progress-circular
-            v-if="loading && notes.length === 0"
+            v-if="!isInitialized"
             :size="100"
             :width="7"
             color="purple"
             indeterminate
         ></v-progress-circular>
-        <v-row>
+        <v-card v-if="isEmpty">
+            <v-card-text>No notes yet :/</v-card-text>
+        </v-card>
+        <v-row v-else>
             <v-col
                 v-for="note in notes"
                 :key="note.uuid"
@@ -28,7 +31,7 @@
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters, mapActions } from 'vuex'
 
 export default {
     name: 'Notes',
@@ -36,10 +39,14 @@ export default {
         loading: true,
     }),
     computed: {
-        ...mapState('notes', { notes: (state) => state.notes }),
+        ...mapState('notes', ['notes', 'isInitialized']),
+        ...mapGetters('notes', ['isEmpty']),
     },
     mounted() {
-        this.$store.dispatch('notes/load').then(() => (this.loading = false))
+        if (!this.initialized) this.load()
+    },
+    methods: {
+        ...mapActions('notes', ['load']),
     },
     head: () => ({
         title: 'My notes',