Make bookmarks work with content list blocks

client/src/components/ContentBlock.vue

@@ -21,7 +21,8 @@
       <content-component v-for="component in contentBlocksWithContentLists.contents"
                          :key="component.id"
                          :component="component"
-                         :parent="contentBlock.id"
+                         :root="root"
+                         :parent="contentBlock"
                          :bookmarks="contentBlock.bookmarks"
                          :notes="contentBlock.notes"
       >
@@ -151,6 +152,10 @@
       },
       hidden() {
         return isHidden(this.contentBlock, this.schoolClass);
+      },
+      root() {
+        // we need the root content block id, not the generated content block if inside a content list block
+        return this.contentBlock.root ? this.contentBlock.root : this.contentBlock.id;
       }
     },
 

client/src/components/content-blocks/ContentComponent.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="content-component" :class="{'content-component--bookmarked': bookmarked}">
     <bookmark-actions
+      v-if="component.type !== 'content_list' && component.type !== 'basic_knowledge'"
       @add-note="addNote(component.id)"
       @edit-note="editNote"
       @bookmark="bookmarkContent(component.id, !bookmarked)"
@@ -8,7 +9,9 @@
       :note="note"></bookmark-actions>
     <component
       :is="component.type"
-      v-bind="component">
+      v-bind="component"
+      :parent="parent"
+    >
     </component>
   </div>
 </template>
@@ -35,7 +38,7 @@
   import MODULE_DETAILS_QUERY from '@/graphql/gql/moduleDetailsQuery.gql';
 
   export default {
-    props: ['component', 'parent', 'bookmarks', 'notes'],
+    props: ['component', 'parent', 'bookmarks', 'notes', 'root'],
 
     components: {
       'text_block': TextBlock,
@@ -59,11 +62,9 @@
 
     computed: {
       bookmarked() {
-        // fixme: make indented sub-contents work
         return this.bookmarks && !!this.bookmarks.find(bookmark => bookmark.uuid === this.component.id);
       },
       note() {
-        // fixme: make indented sub-contents work
         const bookmark = this.bookmarks && this.bookmarks.find(bookmark => bookmark.uuid === this.component.id);
         return bookmark && bookmark.note;
       }
@@ -73,7 +74,7 @@
       addNote(id) {
         this.$store.dispatch('addNote', {
           content: id,
-          contentBlock: this.parent
+          contentBlock: this.root
         });
       },
       editNote() {
@@ -85,7 +86,7 @@
           variables: {
             input: {
               uuid,
-              contentBlock: this.parent,
+              contentBlock: this.root,
               bookmarked
             }
           },

client/src/components/content-blocks/ContentListBlock.vue

@@ -6,7 +6,10 @@
             :key="contentBlock.id"
             v-for="(contentBlock, index) in contentBlocks">
           <p class="content-list__numbering">{{alphaIndex(index)}})</p>
-          <content-block :contentBlock="contentBlock"></content-block>
+          <content-block
+            :contentBlock="contentBlock"
+            :parent="parent"
+          ></content-block>
         </li>
       </ol>
     </div>
@@ -35,11 +38,13 @@
 
     computed: {
       contentBlocks() {
-        // fixme: make indented sub-contents work
         return this.contents.map(contentBlock => {
           return Object.assign({}, contentBlock, {
             contents: [...contentBlock.value],
-            indent: true
+            indent: true,
+            bookmarks: this.parent.bookmarks,
+            notes: this.parent.notes,
+            root: this.parent.id
           })
         });
       }
@@ -58,7 +63,7 @@
       &__item {
         list-style: none;
         position: relative;
-        padding: 0 2*15px;
+        padding: 0 0 0 2*15px;
       }
 
       &__numbering {