diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/Documentation.vue b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/Documentation.vue
index 07918bc166c5b0717b30f11a8d4cf8e252ebadcb..c1044137a4703acc834bce50a03ddd41d03ab8de 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/Documentation.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/Documentation.vue
@@ -4,24 +4,25 @@
     <!-- align-stretch - stretch full-width -->
     <div
       class="full-width d-flex flex-column align-stretch"
-      :class="{ 'flex-md-row': 'compact' in $attrs }"
+      :class="{ 'flex-md-row': compact }"
     >
-      <lesson-information class="flex-grow-1" :documentation="documentation" />
+      <lesson-information class="flex-grow-1" v-bind="documentationPartProps" />
       <lesson-summary
         class="flex-grow-1"
         ref="summary"
         v-bind="$attrs"
         :documentation="documentation"
+        :compact="compact"
         :is-create="false"
         :gql-patch-mutation="documentationsMutation"
         @open="$emit('open')"
         @loading="loading = $event"
         @save="$emit('close')"
       />
-      <lesson-notes class="flex-grow-1" :documentation="documentation" />
+      <lesson-notes class="flex-grow-1" v-bind="documentationPartProps" />
     </div>
     <v-divider />
-    <v-card-actions v-if="!('compact' in $attrs)">
+    <v-card-actions v-if="!compact">
       <v-spacer />
       <cancel-button @click="$emit('close')" :disabled="loading" />
       <save-button @click="save" :loading="loading" />
@@ -39,6 +40,8 @@ import CancelButton from "aleksis.core/components/generic/buttons/CancelButton.v
 
 import { createOrUpdateDocumentations } from "../coursebook.graphql";
 
+import documentationPartMixin from "./documentationPartMixin";
+
 export default {
   name: "Documentation",
   components: {
@@ -49,18 +52,13 @@ export default {
     CancelButton,
   },
   emits: ["open", "close"],
+  mixins: [documentationPartMixin],
   data() {
     return {
       loading: false,
       documentationsMutation: createOrUpdateDocumentations,
     };
   },
-  props: {
-    documentation: {
-      type: Object,
-      required: true,
-    },
-  },
   methods: {
     save() {
       this.$refs.summary.save();
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonInformation.vue b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonInformation.vue
index c438a5575a81732fc9928351059ff0e2f78cdc2b..aae88b5ddc5a765f08c04e1a0685b7e32361ff81 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonInformation.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonInformation.vue
@@ -15,18 +15,14 @@
 <script>
 import SubjectChip from "aleksis.apps.cursus/components/SubjectChip.vue";
 import { DateTime } from "luxon";
+import documentationPartMixin from "./documentationPartMixin";
 
 export default {
   name: "LessonInformation",
+  mixins: [documentationPartMixin],
   components: {
     SubjectChip,
   },
-  props: {
-    documentation: {
-      type: Object,
-      required: true,
-    },
-  },
   methods: {
     toDateTime(dateString) {
       return DateTime.fromISO(dateString);
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonNotes.vue b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonNotes.vue
index f5cb72e1b7195f4e14943599e76df5ab0365f332..24bc9b8ff0af176e2f6e26c9bd4fb43623e80c8d 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonNotes.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonNotes.vue
@@ -30,14 +30,11 @@
 </template>
 
 <script>
+import documentationPartMixin from "./documentationPartMixin";
+
 export default {
   name: "LessonNotes",
-  props: {
-    documentation: {
-      type: Object,
-      required: true,
-    },
-  },
+  mixins: [documentationPartMixin],
 };
 </script>
 
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonSummary.vue b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonSummary.vue
index 6bc2b112795cac307519ce94bc8add9e8c38b32e..1eea012f527e91478c8431257c852ec8b0d2c519 100644
--- a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonSummary.vue
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/LessonSummary.vue
@@ -82,21 +82,11 @@
 
 <script>
 import createOrPatchMixin from "aleksis.core/mixins/createOrPatchMixin.js";
+import documentationPartMixin from "./documentationPartMixin";
 
 export default {
   name: "LessonSummary",
-  mixins: [createOrPatchMixin],
-  props: {
-    documentation: {
-      type: Object,
-      required: true,
-    },
-    compact: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
-  },
+  mixins: [createOrPatchMixin, documentationPartMixin],
   emits: ["open"],
   data() {
     return {
diff --git a/aleksis/apps/alsijil/frontend/components/coursebook/documentation/documentationPartMixin.js b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/documentationPartMixin.js
new file mode 100644
index 0000000000000000000000000000000000000000..9624d4cdb80f77e4372cacd9255a45850941c5cb
--- /dev/null
+++ b/aleksis/apps/alsijil/frontend/components/coursebook/documentation/documentationPartMixin.js
@@ -0,0 +1,35 @@
+/**
+ * Mixin to provide common fields for all components specific to a singular documentation inside the coursebook
+ */
+export default {
+    props: {
+        /**
+         * The documentation in question
+         */
+        documentation: {
+            type: Object,
+            required: true,
+        },
+        /**
+         * Whether the documentation is currently in the compact mode (meaning coursebook row)
+         */
+        compact: {
+            type: Boolean,
+            required: false,
+            default: false,
+        }
+    },
+
+    computed: {
+        /**
+         * All necessary props bundled together to easily pass to child components
+         * @returns {{compact: Boolean, documentation: Object}}
+         */
+        documentationPartProps() {
+            return {
+                documentation: this.documentation,
+                compact: this.compact,
+            }
+        }
+    }
+};