Hide content blocks for teachers when not in edit mode

client/src/components/Chapter.vue

@@ -10,7 +10,7 @@
 
     <content-block :contentBlock="contentBlock"
                    :parent="chapter.id"
-                   :key="contentBlock.id" v-for="contentBlock in chapter.contentBlocks">
+                   :key="contentBlock.id" v-for="contentBlock in filteredContentBlocks">
     </content-block>
   </div>
 </template>
@@ -20,6 +20,8 @@
   import AddContentBlockButton from '@/components/AddContentBlockButton';
 
   import {mapGetters} from 'vuex';
+  import {isHidden} from '@/helpers/content-block';
+  import {meQuery} from '@/graphql/queries';
 
   export default {
     props: ['chapter', 'index'],
@@ -30,8 +32,30 @@
     },
 
     computed: {
-      ...mapGetters(['editModule'])
+      ...mapGetters(['editModule']),
+      filteredContentBlocks() {
+        if (!(this.chapter && this.chapter.contentBlocks)) {
+          return []
+        }
+        if (this.editModule) {
+          return this.chapter.contentBlocks;
+        }
+        return this.chapter.contentBlocks.filter(contentBlock => !isHidden(contentBlock, this.schoolClass));
+      },
+      schoolClass() {
+        return this.me.selectedClass;
+      },
     },
+
+    data() {
+      return {
+        me: {}
+      }
+    },
+
+    apollo: {
+      me: meQuery
+    }
   }
 </script>
 

client/src/components/ContentBlock.vue

@@ -69,6 +69,8 @@
 
   import {mapGetters} from 'vuex';
 
+  import {isHidden} from '@/helpers/content-block';
+
   const instruments = {
     base_communication: 'Sprache & Kommunikation',
     base_society: 'Gesellschaft'
@@ -174,17 +176,7 @@
         return this.me.selectedClass;
       },
       hidden() {
-        if (!this.contentBlock.id || !this.contentBlock.visibleFor || !this.contentBlock.hiddenFor) {
-          return false;
-        }
-        if (this.contentBlock.userCreated) {
-          if (this.schoolClass.id === '') {
-            return false;
-          }
-          return !this.contentBlock.visibleFor.map(entry => entry.id).includes(this.schoolClass.id);
-        } else {
-          return this.contentBlock.hiddenFor.map(entry => entry.id).includes(this.schoolClass.id);
-        }
+        return isHidden(this.contentBlock, this.schoolClass);
       }
     },
 

client/src/helpers/content-block.js

@@ -1,3 +1,17 @@
 export function setUserBlockType(isAssignment) {
   return isAssignment ? 'TASK' : 'NORMAL';
 }
+
+export const isHidden = (contentBlock, schoolClass) => {
+  if (!contentBlock.id || !contentBlock.visibleFor || !contentBlock.hiddenFor) {
+    return false;
+  }
+  if (contentBlock.userCreated) {
+    if (schoolClass.id === '') {
+      return false;
+    }
+    return !contentBlock.visibleFor.map(entry => entry.id).includes(schoolClass.id);
+  } else {
+    return contentBlock.hiddenFor.map(entry => entry.id).includes(schoolClass.id);
+  }
+};