From 1e3cc84ae6873d91d25bcb48b6080ed0a90910db Mon Sep 17 00:00:00 2001
From: Manuel Meister <news.manuelsworld@gmail.com>
Date: Sat, 20 Apr 2024 18:51:32 +0200
Subject: [PATCH 1/4] Remove unnecessary function calls and this.api bindings

---
 .../src/components/activity/DaySwitcher.vue   |   4 +-
 .../src/components/activity/ScheduleEntry.vue |  32 ++--
 .../components/activity/content/Material.vue  |   2 +-
 .../campAdmin/CampActivityProgressLabels.vue  |  10 +-
 .../src/components/campAdmin/CampAddress.vue  |   6 +-
 .../components/campAdmin/CampCategories.vue   |  10 +-
 .../campAdmin/CampConditionalFields.vue       |  10 +-
 .../components/campAdmin/CampDangerZone.vue   |  12 +-
 .../campAdmin/CampMaterialLists.vue           |   8 +-
 .../src/components/campAdmin/CampPeriods.vue  |   8 +-
 .../src/components/campAdmin/CampSettings.vue |   6 +-
 .../material/DialogMaterialItemForm.vue       |   4 +-
 .../src/components/material/MaterialLists.vue |   8 +-
 .../material/useMaterialViewHelper.js         |   4 +-
 .../components/print/PrintConfigurator.vue    |  60 +++----
 .../program/DialogActivityCreate.vue          |   4 +-
 .../components/program/DialogActivityForm.vue |   4 +-
 .../program/FormScheduleEntryList.vue         |   8 +-
 .../src/components/program/PeriodSwitcher.vue |  10 +-
 .../components/program/ScheduleEntries.vue    |  16 +-
 .../program/ScheduleEntryFilters.vue          |  28 ++-
 frontend/src/router.js                        | 159 ++++++++++--------
 frontend/src/views/activity/Activity.vue      |   4 +-
 .../src/views/activity/SideBarProgram.vue     |  10 +-
 frontend/src/views/admin/Activity.vue         |   2 +-
 .../src/views/admin/AdminMaterialLists.vue    |   6 +-
 frontend/src/views/admin/Collaborators.vue    |   8 +-
 frontend/src/views/admin/Info.vue             |   4 +-
 frontend/src/views/admin/Print.vue            |   2 +-
 frontend/src/views/admin/SideBarAdmin.vue     |  12 +-
 .../src/views/admin/__tests__/Admin.spec.js   |   6 +-
 frontend/src/views/camp/Admin.vue             |   8 +-
 frontend/src/views/camp/CampProgram.vue       |  30 ++--
 frontend/src/views/camp/Dashboard.vue         |  28 ++-
 frontend/src/views/camp/Invitation.vue        |  22 ++-
 frontend/src/views/camp/Story.vue             |  16 +-
 .../views/camp/navigation/NavigationCamp.vue  |   2 +-
 .../camp/navigation/desktop/NavTopbar.vue     |  14 +-
 .../camp/navigation/mobile/NavBottombar.vue   |  12 +-
 .../camp/navigation/mobile/NavSidebar.vue     |  18 +-
 frontend/src/views/category/Category.vue      |  52 +++---
 .../src/views/category/SideBarCategory.vue    |   6 +-
 .../src/views/material/MaterialDetail.vue     |  17 +-
 frontend/src/views/material/MaterialLists.vue |   6 +-
 .../src/views/material/MaterialOverview.vue   |   9 +-
 .../views/material/SideBarMaterialLists.vue   |   2 +-
 46 files changed, 360 insertions(+), 349 deletions(-)

diff --git a/frontend/src/components/activity/DaySwitcher.vue b/frontend/src/components/activity/DaySwitcher.vue
index 1034f02590..2235af6b0a 100644
--- a/frontend/src/components/activity/DaySwitcher.vue
+++ b/frontend/src/components/activity/DaySwitcher.vue
@@ -82,7 +82,7 @@ export default {
   name: 'DaySwitcher',
   components: { AvatarRow },
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
     daySelection: { type: Object, required: true },
     loading: { type: Boolean },
   },
@@ -104,7 +104,7 @@ export default {
       )
     },
     periods() {
-      return sortBy(this.camp().periods().items, 'start')
+      return sortBy(this.camp.periods().items, 'start')
     },
   },
   methods: {
diff --git a/frontend/src/components/activity/ScheduleEntry.vue b/frontend/src/components/activity/ScheduleEntry.vue
index 650e80b8ae..75b9afa3ee 100644
--- a/frontend/src/components/activity/ScheduleEntry.vue
+++ b/frontend/src/components/activity/ScheduleEntry.vue
@@ -7,13 +7,13 @@ Displays a single scheduleEntry
     class="ec-schedule-entry"
     toolbar
     back
-    :loaded="!scheduleEntry()._meta.loading && !activity.camp()._meta.loading"
+    :loaded="!scheduleEntry._meta.loading && !activity.camp()._meta.loading"
     :max-width="isPaperDisplaySize ? '944px' : ''"
   >
     <template #title>
       <v-toolbar-title class="font-weight-bold">
         <span class="tabular-nums">
-          {{ scheduleEntry().number }}
+          {{ scheduleEntry.number }}
         </span>
         <v-menu
           offset-y
@@ -24,7 +24,7 @@ Displays a single scheduleEntry
         >
           <template #activator="{ on, attrs }">
             <CategoryChip
-              :schedule-entry="scheduleEntry()"
+              :schedule-entry="scheduleEntry"
               large
               dense
               v-bind="attrs"
@@ -37,11 +37,11 @@ Displays a single scheduleEntry
                   :class="{ 'mdi-spin': categoryChangeState === 'saving' }"
                 >
                   <template v-if="categoryChangeState === 'saving'"
-                    >mdi-autorenew</template
-                  >
+                    >mdi-autorenew
+                  </template>
                   <template v-else-if="categoryChangeState === 'error'"
-                    >mdi-alert</template
-                  >
+                    >mdi-alert
+                  </template>
                   <template v-else>mdi-chevron-down</template>
                 </v-icon>
               </template>
@@ -286,13 +286,13 @@ export default {
     return {
       preferredContentTypes: () => this.preferredContentTypes,
       allContentNodes: () => this.contentNodes,
-      camp: () => this.camp,
+      camp: this.camp,
       isPaperDisplaySize: () => this.isPaperDisplaySize,
     }
   },
   props: {
     scheduleEntry: {
-      type: Function,
+      type: Object,
       required: true,
     },
   },
@@ -306,7 +306,7 @@ export default {
   },
   computed: {
     activity() {
-      return this.scheduleEntry().activity()
+      return this.scheduleEntry.activity()
     },
     camp() {
       return this.activity.camp()
@@ -319,7 +319,7 @@ export default {
     },
     activityName() {
       return (
-        (this.scheduleEntry().number ? this.scheduleEntry().number + ' ' : '') +
+        (this.scheduleEntry.number ? this.scheduleEntry.number + ' ' : '') +
         (this.category.short ? this.category.short + ': ' : '') +
         this.activity.title
       )
@@ -347,7 +347,7 @@ export default {
             type: 'Activity',
             options: {
               activity: this.activity._meta.self,
-              scheduleEntry: this.scheduleEntry()._meta.self,
+              scheduleEntry: this.scheduleEntry._meta.self,
             },
           },
         ],
@@ -369,11 +369,11 @@ export default {
   // reload data every time user navigates to Activity view
   async mounted() {
     this.loading = true
-    await this.scheduleEntry().activity()._meta.load // wait if activity is being loaded as part of a collection
+    await this.scheduleEntry.activity()._meta.load // wait if activity is being loaded as part of a collection
     this.loading = false
 
     // to avoid stale data, trigger reload (which includes embedded contentNode data). However, don't await in order to render early with cached data.
-    this.scheduleEntry().activity().$reload()
+    this.scheduleEntry.activity().$reload()
   },
 
   methods: {
@@ -410,7 +410,7 @@ export default {
         console.warn('clipboard permission not requestable')
       }
 
-      const scheduleEntry = scheduleEntryRoute(this.scheduleEntry())
+      const scheduleEntry = scheduleEntryRoute(this.scheduleEntry)
       const url = window.location.origin + router.resolve(scheduleEntry).href
       await navigator.clipboard.writeText(url)
 
@@ -423,7 +423,7 @@ export default {
     },
     onDelete() {
       // redirect to Picasso
-      this.$router.push(periodRoute(this.scheduleEntry().period()))
+      this.$router.push(periodRoute(this.scheduleEntry.period()))
     },
   },
 }
diff --git a/frontend/src/components/activity/content/Material.vue b/frontend/src/components/activity/content/Material.vue
index 62eb316bf5..db78fe5c85 100644
--- a/frontend/src/components/activity/content/Material.vue
+++ b/frontend/src/components/activity/content/Material.vue
@@ -1,7 +1,7 @@
 <template>
   <ContentNodeCard v-bind="$props">
     <material-table
-      :camp="camp()"
+      :camp="camp"
       :material-node="contentNode"
       :layout-mode="layoutMode"
       :material-item-collection="materialItemCollection"
diff --git a/frontend/src/components/campAdmin/CampActivityProgressLabels.vue b/frontend/src/components/campAdmin/CampActivityProgressLabels.vue
index d37712b892..d8a80fd862 100644
--- a/frontend/src/components/campAdmin/CampActivityProgressLabels.vue
+++ b/frontend/src/components/campAdmin/CampActivityProgressLabels.vue
@@ -3,7 +3,7 @@
     <slot name="title">
       <div class="ec-content-group__title py-1 subtitle-1">
         {{ $tc('components.campAdmin.campActivityProgressLabels.title') }}
-        <DialogActivityProgressLabelCreate v-if="!disabled" :camp="camp()">
+        <DialogActivityProgressLabelCreate v-if="!disabled" :camp="camp">
           <template #activator="{ on }">
             <ButtonAdd
               color="secondary"
@@ -19,7 +19,7 @@
       </div>
     </slot>
     <v-skeleton-loader
-      v-if="camp().progressLabels()._meta.loading"
+      v-if="camp.progressLabels()._meta.loading"
       type="list-item@3"
       class="mx-n4"
     />
@@ -69,7 +69,7 @@
       <template v-else>
         <api-sortable
           v-slot="{ itemPosition, item, on }"
-          :endpoint="camp().progressLabels()"
+          :endpoint="camp.progressLabels()"
         >
           <v-list-item class="px-2 rounded drag-and-drop-handle" v-on="on">
             <v-avatar color="rgba(0,0,0,0.12)" class="mr-2" size="32">{{
@@ -120,7 +120,7 @@ export default {
     DialogActivityProgressLabelEdit,
   },
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
     disabled: { type: Boolean, default: false },
   },
   data: () => ({
@@ -128,7 +128,7 @@ export default {
   }),
   computed: {
     progressLabels() {
-      return sortBy(this.camp().progressLabels().allItems, (label) => label.position)
+      return sortBy(this.camp.progressLabels().allItems, (label) => label.position)
     },
   },
 }
diff --git a/frontend/src/components/campAdmin/CampAddress.vue b/frontend/src/components/campAdmin/CampAddress.vue
index e237aae2c3..bb57fb76e0 100644
--- a/frontend/src/components/campAdmin/CampAddress.vue
+++ b/frontend/src/components/campAdmin/CampAddress.vue
@@ -4,9 +4,9 @@ Displays address and allows to edit
 
 <template>
   <content-group :title="$tc('components.campAdmin.campAddress.title')">
-    <v-skeleton-loader v-if="camp()._meta.loading" type="article" />
+    <v-skeleton-loader v-if="camp._meta.loading" type="article" />
     <div v-else class="mt-3">
-      <api-form :entity="camp()" name="camp">
+      <api-form :entity="camp" name="camp">
         <api-text-field path="addressName" :disabled="disabled" />
 
         <api-text-field path="addressStreet" :disabled="disabled" />
@@ -29,7 +29,7 @@ export default {
   components: { ContentGroup, ApiTextField, ApiForm },
   props: {
     camp: {
-      type: Function,
+      type: Object,
       required: true,
     },
     disabled: {
diff --git a/frontend/src/components/campAdmin/CampCategories.vue b/frontend/src/components/campAdmin/CampCategories.vue
index 17ad1880df..2ddb4015a3 100644
--- a/frontend/src/components/campAdmin/CampCategories.vue
+++ b/frontend/src/components/campAdmin/CampCategories.vue
@@ -3,7 +3,7 @@
     <slot name="title">
       <div class="ec-content-group__title py-1 subtitle-1">
         {{ $tc('components.campAdmin.campCategories.title') }}
-        <DialogCategoryCreate v-if="!disabled" :camp="camp()">
+        <DialogCategoryCreate v-if="!disabled" :camp="camp">
           <template #activator="{ on }">
             <ButtonAdd
               color="secondary"
@@ -19,7 +19,7 @@
       </div>
     </slot>
     <v-skeleton-loader
-      v-if="camp().categories()._meta.loading"
+      v-if="camp.categories()._meta.loading"
       type="list-item@3"
       class="mx-n4"
     />
@@ -28,7 +28,7 @@
         v-for="category in categories.items"
         :key="category._meta.self"
         class="px-2 rounded"
-        :to="categoryRoute(camp(), category)"
+        :to="categoryRoute(camp, category)"
       >
         <v-list-item-content>
           <v-list-item-title>
@@ -68,7 +68,7 @@ export default {
   },
   mixins: [dateHelperUTCFormatted],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
     disabled: { type: Boolean, default: false },
   },
   data() {
@@ -76,7 +76,7 @@ export default {
   },
   computed: {
     categories() {
-      return this.camp().categories()
+      return this.camp.categories()
     },
   },
   methods: {
diff --git a/frontend/src/components/campAdmin/CampConditionalFields.vue b/frontend/src/components/campAdmin/CampConditionalFields.vue
index 9158db5805..39de7a9f10 100644
--- a/frontend/src/components/campAdmin/CampConditionalFields.vue
+++ b/frontend/src/components/campAdmin/CampConditionalFields.vue
@@ -15,9 +15,9 @@ Displays fields which don't apply to all camps, but are required for some
           <content-group
             :title="$tc('components.campAdmin.campConditionalFields.ysCamp.title')"
           >
-            <v-skeleton-loader v-if="camp()._meta.loading" type="article" />
+            <v-skeleton-loader v-if="camp._meta.loading" type="article" />
             <div v-else class="mt-3">
-              <api-form :entity="camp()" name="camp">
+              <api-form :entity="camp" name="camp">
                 <api-text-field path="organizer" :disabled="disabled" />
 
                 <api-text-field path="kind" :disabled="disabled" />
@@ -31,9 +31,9 @@ Displays fields which don't apply to all camps, but are required for some
           <content-group
             :title="$tc('components.campAdmin.campConditionalFields.course.title')"
           >
-            <v-skeleton-loader v-if="camp()._meta.loading" type="article" />
+            <v-skeleton-loader v-if="camp._meta.loading" type="article" />
             <div v-else class="mt-3">
-              <api-form :entity="camp()" name="camp">
+              <api-form :entity="camp" name="camp">
                 <api-text-field path="courseNumber" :disabled="disabled" />
 
                 <api-text-field path="courseKind" :disabled="disabled" />
@@ -61,7 +61,7 @@ export default {
   components: { ContentGroup, ApiTextField, ApiCheckbox, ApiForm },
   props: {
     camp: {
-      type: Function,
+      type: Object,
       required: true,
     },
     disabled: {
diff --git a/frontend/src/components/campAdmin/CampDangerZone.vue b/frontend/src/components/campAdmin/CampDangerZone.vue
index 8b112120db..27fee7e7dd 100644
--- a/frontend/src/components/campAdmin/CampDangerZone.vue
+++ b/frontend/src/components/campAdmin/CampDangerZone.vue
@@ -10,7 +10,7 @@ Critical operations on camp
       </h2>
     </v-expansion-panel-header>
     <v-expansion-panel-content>
-      <v-skeleton-loader v-if="camp()._meta.loading" type="article" />
+      <v-skeleton-loader v-if="camp._meta.loading" type="article" />
       <div v-else>
         <v-list class="py-0" color="transparent">
           <v-list-item class="px-0">
@@ -24,8 +24,8 @@ Critical operations on camp
             </v-list-item-content>
             <v-list-item-action>
               <dialog-entity-delete
-                :entity="camp()"
-                :submit-enabled="promptText === camp().name"
+                :entity="camp"
+                :submit-enabled="promptText === camp.name"
                 icon="mdi-bomb"
                 @submit="$router.push({ name: 'camps' })"
               >
@@ -44,14 +44,14 @@ Critical operations on camp
                 <p class="body-1">
                   {{
                     $tc('components.campAdmin.campDangerZone.deleteCamp.explanation', 0, {
-                      campName: camp().name,
+                      campName: camp.name,
                     })
                   }}
                 </p>
                 <label>
                   {{
                     $tc('components.campAdmin.campDangerZone.deleteCamp.label', 0, {
-                      campName: camp().name,
+                      campName: camp.name,
                     })
                   }}
                   <e-text-field v-model="promptText" />
@@ -79,7 +79,7 @@ export default {
   },
   props: {
     camp: {
-      type: Function,
+      type: Object,
       required: true,
     },
   },
diff --git a/frontend/src/components/campAdmin/CampMaterialLists.vue b/frontend/src/components/campAdmin/CampMaterialLists.vue
index d98b17e069..21dd484b48 100644
--- a/frontend/src/components/campAdmin/CampMaterialLists.vue
+++ b/frontend/src/components/campAdmin/CampMaterialLists.vue
@@ -3,7 +3,7 @@
     <slot name="title">
       <div class="ec-content-group__title py-1 subtitle-1">
         {{ $tc('components.campAdmin.campMaterialLists.title') }}
-        <dialog-material-list-create v-if="!disabled" :camp="camp()">
+        <dialog-material-list-create v-if="!disabled" :camp="camp">
           <template #activator="{ on }">
             <button-add
               color="secondary"
@@ -18,7 +18,7 @@
         </dialog-material-list-create>
       </div>
     </slot>
-    <v-skeleton-loader v-if="camp().materialLists()._meta.loading" type="article" />
+    <v-skeleton-loader v-if="camp.materialLists()._meta.loading" type="article" />
     <v-list>
       <camp-material-lists-item
         v-for="materialList in materialLists.allItems"
@@ -46,7 +46,7 @@ export default {
     DialogMaterialListCreate,
   },
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
     disabled: { type: Boolean, default: false },
   },
   data() {
@@ -54,7 +54,7 @@ export default {
   },
   computed: {
     materialLists() {
-      return this.camp().materialLists()
+      return this.camp.materialLists()
     },
   },
 }
diff --git a/frontend/src/components/campAdmin/CampPeriods.vue b/frontend/src/components/campAdmin/CampPeriods.vue
index 5151c1b389..5bce28fa3b 100644
--- a/frontend/src/components/campAdmin/CampPeriods.vue
+++ b/frontend/src/components/campAdmin/CampPeriods.vue
@@ -9,7 +9,7 @@ Displays all periods of a single camp and allows to edit them & create new ones
         {{
           $tc('components.campAdmin.campPeriods.title', api.get().camps().items.length)
         }}
-        <dialog-period-create v-if="!disabled" :camp="camp()">
+        <dialog-period-create v-if="!disabled" :camp="camp">
           <template #activator="{ on }">
             <button-add
               color="secondary"
@@ -24,7 +24,7 @@ Displays all periods of a single camp and allows to edit them & create new ones
         </dialog-period-create>
       </div>
     </slot>
-    <v-skeleton-loader v-if="camp().periods()._meta.loading" type="article" />
+    <v-skeleton-loader v-if="camp.periods()._meta.loading" type="article" />
     <v-list>
       <period-item
         v-for="period in periods.items"
@@ -47,7 +47,7 @@ export default {
   name: 'CampPeriods',
   components: { ContentGroup, ButtonAdd, PeriodItem, DialogPeriodCreate },
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
     disabled: { type: Boolean, default: false },
   },
   data() {
@@ -55,7 +55,7 @@ export default {
   },
   computed: {
     periods() {
-      return this.camp().periods()
+      return this.camp.periods()
     },
   },
 }
diff --git a/frontend/src/components/campAdmin/CampSettings.vue b/frontend/src/components/campAdmin/CampSettings.vue
index 59a073839b..8194993312 100644
--- a/frontend/src/components/campAdmin/CampSettings.vue
+++ b/frontend/src/components/campAdmin/CampSettings.vue
@@ -4,9 +4,9 @@ Displays details on a single camp and allows to edit them.
 
 <template>
   <content-group :title="$tc('components.campAdmin.campSettings.title')">
-    <v-skeleton-loader v-if="camp()._meta.loading" type="article" />
+    <v-skeleton-loader v-if="camp._meta.loading" type="article" />
     <div v-else class="mt-3">
-      <api-form :entity="camp()" name="camp">
+      <api-form :entity="camp" name="camp">
         <api-text-field path="name" vee-rules="required" :disabled="disabled" />
 
         <api-text-field path="title" vee-rules="required" :disabled="disabled" />
@@ -27,7 +27,7 @@ export default {
   components: { ContentGroup, ApiTextField, ApiForm },
   props: {
     camp: {
-      type: Function,
+      type: Object,
       required: true,
     },
     disabled: {
diff --git a/frontend/src/components/material/DialogMaterialItemForm.vue b/frontend/src/components/material/DialogMaterialItemForm.vue
index 3b112ad492..e916515fed 100644
--- a/frontend/src/components/material/DialogMaterialItemForm.vue
+++ b/frontend/src/components/material/DialogMaterialItemForm.vue
@@ -27,7 +27,7 @@
 export default {
   name: 'DialogMaterialItemForm',
   props: {
-    materialLists: { type: Function, required: true },
+    materialLists: { type: Object, required: true },
     materialItem: { type: Object, required: true },
   },
   computed: {
@@ -35,7 +35,7 @@ export default {
       return this.materialItem
     },
     materialListArray() {
-      return this.materialLists().items.map((l) => ({
+      return this.materialLists.items.map((l) => ({
         value: l._meta.self,
         text: l.name,
       }))
diff --git a/frontend/src/components/material/MaterialLists.vue b/frontend/src/components/material/MaterialLists.vue
index e9fb7b64d8..18adc631a8 100644
--- a/frontend/src/components/material/MaterialLists.vue
+++ b/frontend/src/components/material/MaterialLists.vue
@@ -1,6 +1,6 @@
 <template>
   <v-list>
-    <v-list-item :to="materialListRoute(camp(), '/all', { isDetail: true })" exact-path>
+    <v-list-item :to="materialListRoute(camp, '/all', { isDetail: true })" exact-path>
       <v-list-item-content>
         {{ $tc('components.material.materialLists.overview') }}
       </v-list-item-content>
@@ -12,7 +12,7 @@
     <v-list-item
       v-for="materialList in materialLists.allItems"
       :key="materialList._meta.self"
-      :to="materialListRoute(camp(), materialList, { isDetail: true })"
+      :to="materialListRoute(camp, materialList, { isDetail: true })"
       exact-path
     >
       <v-list-item-content>
@@ -42,11 +42,11 @@ import { materialListRoute } from '@/router.js'
 export default {
   name: 'MaterialLists',
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   computed: {
     materialLists() {
-      return this.camp().materialLists()
+      return this.camp.materialLists()
     },
   },
   mounted() {
diff --git a/frontend/src/components/material/useMaterialViewHelper.js b/frontend/src/components/material/useMaterialViewHelper.js
index 554b0a0c40..d1862e18cc 100644
--- a/frontend/src/components/material/useMaterialViewHelper.js
+++ b/frontend/src/components/material/useMaterialViewHelper.js
@@ -106,9 +106,7 @@ function loadPeriods(camp) {
  * @param {boolean} [list]
  */
 export function useMaterialViewHelper(camp, list) {
-  const computedList = computed(() =>
-    list ? materialListFromRoute(useRoute()).call({ api: apiStore }) : null
-  )
+  const computedList = computed(() => (list ? materialListFromRoute(useRoute()) : null))
 
   const collection = computed(() => {
     const materialList = computedList.value?._meta.self
diff --git a/frontend/src/components/print/PrintConfigurator.vue b/frontend/src/components/print/PrintConfigurator.vue
index 02748d10a2..60863f5764 100644
--- a/frontend/src/components/print/PrintConfigurator.vue
+++ b/frontend/src/components/print/PrintConfigurator.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-skeleton-loader v-if="camp()._meta.loading" type="article" />
+  <v-skeleton-loader v-if="camp._meta.loading" type="article" />
   <div v-else>
     <PagesOverview v-model="cnf.contents" @input="onChange">
       <PagesConfig
@@ -16,7 +16,7 @@
         <component
           :is="contentComponents[content.type]"
           :value="content.options"
-          :camp="camp()"
+          :camp="camp"
           @input="onChange"
         />
       </PagesConfig>
@@ -132,7 +132,7 @@ export default {
   },
   props: {
     camp: {
-      type: Function,
+      type: Object,
       required: true,
     },
   },
@@ -155,10 +155,10 @@ export default {
     },
     cnf() {
       return this.repairConfig(
-        this.$store.getters.getLastPrintConfig(this.camp()._meta.self, {
+        this.$store.getters.getLastPrintConfig(this.camp._meta.self, {
           language: this.lang,
-          documentName: this.camp().name,
-          camp: this.camp()._meta.self,
+          documentName: this.camp.name,
+          camp: this.camp._meta.self,
           contents: this.defaultContents(),
         })
       )
@@ -176,17 +176,15 @@ export default {
     },
   },
   mounted() {
-    this.camp()
-      .periods()
-      .items.forEach((period) => {
-        period.days().$reload()
-        period.contentNodes().$reload()
-      })
+    this.camp.periods().items.forEach((period) => {
+      period.days().$reload()
+      period.contentNodes().$reload()
+    })
   },
   methods: {
     resetConfig() {
       this.$store.commit('setLastPrintConfig', {
-        campUri: this.camp()._meta.self,
+        campUri: this.camp._meta.self,
         printConfig: undefined,
       })
     },
@@ -199,30 +197,26 @@ export default {
         {
           type: 'Picasso',
           options: {
-            periods: this.camp()
-              .periods()
-              .items.map((period) => period._meta.self),
+            periods: this.camp.periods().items.map((period) => period._meta.self),
             orientation: 'L',
           },
         },
       ]
 
-      this.camp()
-        .periods()
-        .items.forEach((period) => {
-          contents.push({
-            type: 'Story',
-            options: {
-              periods: [period._meta.self],
-            },
-          })
-          contents.push({
-            type: 'Program',
-            options: {
-              periods: [period._meta.self],
-            },
-          })
+      this.camp.periods().items.forEach((period) => {
+        contents.push({
+          type: 'Story',
+          options: {
+            periods: [period._meta.self],
+          },
         })
+        contents.push({
+          type: 'Program',
+          options: {
+            periods: [period._meta.self],
+          },
+        })
+      })
 
       contents.push({
         type: 'Toc',
@@ -242,7 +236,7 @@ export default {
     onChange() {
       this.$nextTick(() => {
         this.$store.commit('setLastPrintConfig', {
-          campUri: this.camp()._meta.self,
+          campUri: this.camp._meta.self,
           printConfig: cloneDeep(this.cnf),
         })
       })
@@ -257,7 +251,7 @@ export default {
 
       return repairConfig(
         config,
-        this.camp(),
+        this.camp,
         VueI18n.availableLocales,
         this.lang,
         repairers,
diff --git a/frontend/src/components/program/DialogActivityCreate.vue b/frontend/src/components/program/DialogActivityCreate.vue
index f9f67373e5..1f4d56f053 100644
--- a/frontend/src/components/program/DialogActivityCreate.vue
+++ b/frontend/src/components/program/DialogActivityCreate.vue
@@ -127,7 +127,7 @@ export default {
     scheduleEntry: { type: Object, required: true },
 
     // currently visible period
-    period: { type: Function, required: true },
+    period: { type: Object, required: true },
   },
   data() {
     return {
@@ -143,7 +143,7 @@ export default {
   },
   computed: {
     camp() {
-      return this.period().camp()
+      return this.period.camp()
     },
     clipboardAccessDenied() {
       return (
diff --git a/frontend/src/components/program/DialogActivityForm.vue b/frontend/src/components/program/DialogActivityForm.vue
index 3ca5da3c54..f1d9c7b5eb 100644
--- a/frontend/src/components/program/DialogActivityForm.vue
+++ b/frontend/src/components/program/DialogActivityForm.vue
@@ -66,7 +66,7 @@ export default {
     },
     // currently visible period
     period: {
-      type: Function,
+      type: Object,
       required: true,
     },
     autoselectTitle: {
@@ -84,7 +84,7 @@ export default {
       return this.camp.categories()
     },
     camp() {
-      return this.period().camp()
+      return this.period.camp()
     },
   },
 }
diff --git a/frontend/src/components/program/FormScheduleEntryList.vue b/frontend/src/components/program/FormScheduleEntryList.vue
index 68d15e309c..d8144ac3f5 100644
--- a/frontend/src/components/program/FormScheduleEntryList.vue
+++ b/frontend/src/components/program/FormScheduleEntryList.vue
@@ -55,7 +55,7 @@ export default {
 
     // currently visible period
     period: {
-      type: Function,
+      type: Object,
       required: true,
     },
   },
@@ -72,9 +72,9 @@ export default {
   methods: {
     addScheduleEntry() {
       this.localScheduleEntries.push({
-        period: () => this.period(),
-        start: dayjs.utc(this.period().start).add(7, 'hour').format(),
-        end: dayjs.utc(this.period().start).add(8, 'hour').format(),
+        period: () => this.period,
+        start: dayjs.utc(this.period.start).add(7, 'hour').format(),
+        end: dayjs.utc(this.period.start).add(8, 'hour').format(),
         key: uniqueId(),
         deleted: false,
       })
diff --git a/frontend/src/components/program/PeriodSwitcher.vue b/frontend/src/components/program/PeriodSwitcher.vue
index bc6090468c..4df1bc50a4 100644
--- a/frontend/src/components/program/PeriodSwitcher.vue
+++ b/frontend/src/components/program/PeriodSwitcher.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-toolbar-items v-if="period().camp().periods().items.length > 1">
+  <v-toolbar-items v-if="period.camp().periods().items.length > 1">
     <v-menu offset-y>
       <template #activator="{ on, attrs, value }">
         <v-btn
@@ -12,7 +12,7 @@
           v-on="on"
         >
           <h1 class="text-subtitle-1">
-            {{ period().description }}
+            {{ period.description }}
           </h1>
           <v-icon v-if="value" right>mdi-menu-up</v-icon>
           <v-icon v-else right>mdi-menu-down</v-icon>
@@ -21,7 +21,7 @@
       <v-list>
         <v-subheader>{{ $tc('components.program.periodSwitcher.title') }}</v-subheader>
         <v-list-item
-          v-for="item in period().camp().periods().items"
+          v-for="item in period.camp().periods().items"
           :key="item._meta.self"
           :to="periodRoute(item, routeName)"
           two-line
@@ -38,7 +38,7 @@
   </v-toolbar-items>
   <v-toolbar-title v-else>
     <h1 class="subtitle-1">
-      {{ period().description }}
+      {{ period.description }}
     </h1>
   </v-toolbar-title>
 </template>
@@ -51,7 +51,7 @@ export default {
   mixins: [dateHelperUTCFormatted],
   props: {
     period: {
-      type: Function,
+      type: Object,
       required: true,
     },
     routeName: { type: String, default: 'camp/period/program' },
diff --git a/frontend/src/components/program/ScheduleEntries.vue b/frontend/src/components/program/ScheduleEntries.vue
index 456ed0a04a..fecbd6c77c 100644
--- a/frontend/src/components/program/ScheduleEntries.vue
+++ b/frontend/src/components/program/ScheduleEntries.vue
@@ -40,7 +40,7 @@ export default {
     DialogActivityCreate,
   },
   props: {
-    period: { type: Function, required: true },
+    period: { type: Object, required: true },
     showButton: { type: Boolean, required: true },
     matchFn: { type: Function, required: false, default: () => true },
   },
@@ -50,7 +50,7 @@ export default {
         newEntry: this.newEntryFromPicasso,
       },
       newScheduleEntry: {
-        period: () => this.period(),
+        period: () => this.period,
         start: null,
         end: null,
       },
@@ -59,7 +59,7 @@ export default {
   computed: {
     scheduleEntries() {
       // TODO for SideBar, add filtering for the current day, now that the API supports it
-      return this.period().scheduleEntries()
+      return this.period.scheduleEntries()
     },
     filteredScheduleEntries() {
       return this.scheduleEntries.items.map((item) => ({
@@ -70,8 +70,8 @@ export default {
     loading() {
       return (
         this.scheduleEntries._meta.loading ||
-        this.period().camp().activities()._meta.loading ||
-        this.period().camp().categories()._meta.loading
+        this.period.camp().activities()._meta.loading ||
+        this.period.camp().categories()._meta.loading
       )
     },
   },
@@ -79,11 +79,11 @@ export default {
   methods: {
     createNewActivity() {
       this.newScheduleEntry.start = this.$date
-        .utc(this.period().start)
+        .utc(this.period.start)
         .add(8, 'hour')
         .format()
       this.newScheduleEntry.end = this.$date
-        .utc(this.period().start)
+        .utc(this.period.start)
         .add(9, 'hour')
         .format()
       this.showActivityCreateDialog()
@@ -92,7 +92,7 @@ export default {
       this.$refs.dialogActivityCreate.showDialog = true
     },
     afterCreateActivity() {
-      this.api.reload(this.period().scheduleEntries())
+      this.api.reload(this.period.scheduleEntries())
     },
 
     // Event Handler on.newEntry: update position & open create dialog
diff --git a/frontend/src/components/program/ScheduleEntryFilters.vue b/frontend/src/components/program/ScheduleEntryFilters.vue
index 57f42a16dd..b6f367f4c2 100644
--- a/frontend/src/components/program/ScheduleEntryFilters.vue
+++ b/frontend/src/components/program/ScheduleEntryFilters.vue
@@ -142,7 +142,7 @@ export default {
       }),
     },
     camp: {
-      type: Function,
+      type: Object,
       required: true,
     },
     periods: {
@@ -176,14 +176,14 @@ export default {
           label: this.$tc('components.program.scheduleEntryFilters.responsibleNone'),
           _meta: { self: 'none' },
         },
-        ...keyBy(this.camp().campCollaborations().items, '_meta.self'),
+        ...keyBy(this.camp.campCollaborations().items, '_meta.self'),
       }
     },
     categories() {
-      return keyBy(this.camp().categories().items, '_meta.self')
+      return keyBy(this.camp.categories().items, '_meta.self')
     },
     progressLabels() {
-      const labels = sortBy(this.camp().progressLabels().items, (l) => l.position)
+      const labels = sortBy(this.camp.progressLabels().items, (l) => l.position)
       return {
         none: {
           title: this.$tc('components.program.scheduleEntryFilters.progressLabelNone'),
@@ -229,17 +229,15 @@ export default {
       return campCollaborationDisplayName(campCollaboration, this.$tc.bind(this))
     },
     loadEndpointData(endpoint, filterKey, hasNone = false) {
-      this.camp()
-        [endpoint]()
-        ._meta.load.then(({ allItems }) => {
-          const collection = allItems.map((entry) => entry._meta.self)
-          if (hasNone) {
-            collection.push('none')
-          }
-          this.value[filterKey] =
-            this.value[filterKey].filter((value) => collection.includes(value)) ?? null
-          this.loadingEndpoints[endpoint] = false
-        })
+      this.camp[endpoint]()._meta.load.then(({ allItems }) => {
+        const collection = allItems.map((entry) => entry._meta.self)
+        if (hasNone) {
+          collection.push('none')
+        }
+        this.value[filterKey] =
+          this.value[filterKey].filter((value) => collection.includes(value)) ?? null
+        this.loadingEndpoints[endpoint] = false
+      })
     },
     resetFilter() {
       this.value.period = null
diff --git a/frontend/src/router.js b/frontend/src/router.js
index 4628c3b09a..00e1573615 100644
--- a/frontend/src/router.js
+++ b/frontend/src/router.js
@@ -453,107 +453,136 @@ function requireAuth(to, from, next) {
 }
 
 async function requireCamp(to, from, next) {
-  await campFromRoute(to)
-    .call({ api: { get: apiStore.get } })
-    ._meta.load.then(() => {
-      next()
+  const camp = await campFromRoute(to)
+  if (camp === undefined) {
+    next({
+      name: 'PageNotFound',
+      params: [to.fullPath, ''],
+      replace: true,
     })
-    .catch(() => {
-      next({
-        name: 'PageNotFound',
-        params: [to.fullPath, ''],
-        replace: true,
+  } else {
+    await camp._meta.load
+      .then(() => {
+        next()
       })
-    })
+      .catch(() => {
+        next({
+          name: 'PageNotFound',
+          params: [to.fullPath, ''],
+          replace: true,
+        })
+      })
+  }
 }
 
 async function requireScheduleEntry(to, from, next) {
-  await scheduleEntryFromRoute(to)
-    .call({ api: { get: apiStore.get } })
-    ._meta.load.then(() => {
-      next()
+  const scheduleEntry = await scheduleEntryFromRoute(to)
+  if (scheduleEntry === undefined) {
+    next({
+      name: 'PageNotFound',
+      params: [to.fullPath, ''],
+      replace: true,
     })
-    .catch(() => {
-      next({
-        name: 'PageNotFound',
-        params: [to.fullPath, ''],
-        replace: true,
+  } else {
+    await scheduleEntry._meta.load
+      .then(() => {
+        next()
       })
-    })
+      .catch(() => {
+        next({
+          name: 'PageNotFound',
+          params: [to.fullPath, ''],
+          replace: true,
+        })
+      })
+  }
 }
 
 async function requirePeriod(to, from, next) {
-  await periodFromRoute(to)
-    .call({ api: { get: apiStore.get } })
-    ._meta.load.then(() => {
-      next()
-    })
-    .catch(() => {
-      next(campRoute(campFromRoute(to).call({ api: { get: apiStore.get } })))
+  const period = await periodFromRoute(to)
+  if (period === undefined) {
+    next({
+      name: 'PageNotFound',
+      params: [to.fullPath, ''],
+      replace: true,
     })
+  } else {
+    await period._meta.load
+      .then(() => {
+        next()
+      })
+      .catch(() => {
+        next(campRoute(campFromRoute(to)))
+      })
+  }
 }
 
 async function requireCategory(to, from, next) {
-  await categoryFromRoute(to)
-    .call({ api: { get: apiStore.get } })
-    ._meta.load.then(() => {
-      next()
+  const category = await categoryFromRoute(to)
+  if (category === undefined) {
+    next({
+      name: 'PageNotFound',
+      params: [to.fullPath, ''],
+      replace: true,
     })
-    .catch(() => {
-      next({
-        name: 'PageNotFound',
-        params: [to.fullPath, ''],
-        replace: true,
+  } else {
+    await category._meta.load
+      .then(() => {
+        next()
       })
-    })
+      .catch(() => {
+        next({
+          name: 'PageNotFound',
+          params: [to.fullPath, ''],
+          replace: true,
+        })
+      })
+  }
 }
 
 async function requireMaterialList(to, from, next) {
-  await materialListFromRoute(to)
-    .call({ api: { get: apiStore.get } })
-    ._meta.load.then(() => {
-      next()
-    })
-    .catch(() => {
-      next(campRoute(campFromRoute(to).call({ api: { get: apiStore.get } })))
+  const materialList = await materialListFromRoute(to)
+  if (materialList === undefined) {
+    next({
+      name: 'PageNotFound',
+      params: [to.fullPath, ''],
+      replace: true,
     })
+  } else {
+    await materialList._meta.load
+      .then(() => {
+        next()
+      })
+      .catch(() => {
+        next(campRoute(campFromRoute(to)))
+      })
+  }
 }
 
 export function campFromRoute(route) {
-  return function () {
-    return this.api.get().camps({ id: route.params.campId })
-  }
+  return apiStore.get().camps({ id: route.params.campId })
 }
 
 export function invitationFromInviteKey(inviteKey) {
-  return function () {
-    return this.api.get().invitations({ action: 'find', id: inviteKey })
-  }
+  return apiStore.get().invitations({ action: 'find', id: inviteKey })
 }
 
 export function periodFromRoute(route) {
-  return function () {
-    return this.api.get().periods({ id: route.params.periodId })
-  }
+  return apiStore.get().periods({ id: route.params.periodId })
 }
 
 function scheduleEntryFromRoute(route) {
-  return function () {
-    return this.api.get().scheduleEntries({ id: route.params.scheduleEntryId })
-  }
+  return apiStore.get().scheduleEntries({ id: route.params.scheduleEntryId })
 }
 
 function categoryFromRoute(route) {
-  return function () {
-    const camp = this.api.get().camps({ id: route.params.campId })
-    return camp.categories().allItems.find((c) => c.id === route.params.categoryId)
-  }
+  return campFromRoute(route)
+    .categories()
+    .allItems.find((c) => c.id === route.params.categoryId)
 }
 
 export function materialListFromRoute(route) {
-  return function () {
-    return this.api.get().materialLists({ id: route.params.materialId })
-  }
+  return apiStore.get().materialLists({ id: route.params.materialId })
 }
 
 function getContentLayout(route) {
@@ -575,9 +604,7 @@ function getContentLayout(route) {
 }
 
 function dayFromScheduleEntryInRoute(route) {
-  return function () {
-    return this.api.get().scheduleEntries({ id: route.params.scheduleEntryId }).day()
-  }
+  return apiStore.get().scheduleEntries({ id: route.params.scheduleEntryId }).day()
 }
 
 /**
diff --git a/frontend/src/views/activity/Activity.vue b/frontend/src/views/activity/Activity.vue
index 958ce76170..e297a5b085 100644
--- a/frontend/src/views/activity/Activity.vue
+++ b/frontend/src/views/activity/Activity.vue
@@ -4,7 +4,7 @@ Displays a single activity
 
 <template>
   <v-container fluid>
-    <ScheduleEntry :key="scheduleEntry()._meta.self" :schedule-entry="scheduleEntry" />
+    <ScheduleEntry :key="scheduleEntry._meta.self" :schedule-entry="scheduleEntry" />
   </v-container>
 </template>
 
@@ -19,7 +19,7 @@ export default {
 
   props: {
     scheduleEntry: {
-      type: Function,
+      type: Object,
       required: true,
     },
   },
diff --git a/frontend/src/views/activity/SideBarProgram.vue b/frontend/src/views/activity/SideBarProgram.vue
index c38e8f427f..62d1520dd4 100644
--- a/frontend/src/views/activity/SideBarProgram.vue
+++ b/frontend/src/views/activity/SideBarProgram.vue
@@ -17,7 +17,7 @@
           v-else
           class="ec-sidebar-program__picasso"
           :schedule-entries="slotProps.scheduleEntries"
-          :period="period()"
+          :period="period"
           :start="currentDayAsString"
           :interval-height="36"
           :end="currentDayAsString"
@@ -42,8 +42,8 @@ export default {
   name: 'SideBarProgram',
   components: { DaySwitcher, SideBar, Picasso, ScheduleEntries },
   props: {
-    day: { type: Function, required: true },
-    camp: { type: Function, required: true },
+    day: { type: Object, required: true },
+    camp: { type: Object, required: true },
   },
   data() {
     return {
@@ -52,10 +52,10 @@ export default {
   },
   computed: {
     period() {
-      return this.daySelection.period
+      return this.daySelection.period()
     },
     daySelection() {
-      return this.selectedDay ?? this.day()
+      return this.selectedDay ?? this.day
     },
     currentDayAsString() {
       return this.$date.utc(this.daySelection.start).format(HTML5_FMT.DATE)
diff --git a/frontend/src/views/admin/Activity.vue b/frontend/src/views/admin/Activity.vue
index 43f671b0de..e8ce8d34b9 100644
--- a/frontend/src/views/admin/Activity.vue
+++ b/frontend/src/views/admin/Activity.vue
@@ -28,7 +28,7 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
 }
 </script>
diff --git a/frontend/src/views/admin/AdminMaterialLists.vue b/frontend/src/views/admin/AdminMaterialLists.vue
index 2d8544726c..34607c286d 100644
--- a/frontend/src/views/admin/AdminMaterialLists.vue
+++ b/frontend/src/views/admin/AdminMaterialLists.vue
@@ -5,7 +5,7 @@ Show all material lists for a camp on mobile
 <template>
   <content-card :title="$tc('views.admin.adminMaterialLists.title')" toolbar>
     <template v-if="!isGuest" #title-actions>
-      <DialogMaterialListCreate :camp="camp()">
+      <DialogMaterialListCreate :camp="camp">
         <template #activator="{ on }">
           <ButtonAdd class="mr-n2" height="32" v-on="on"
             >{{ $tc('global.button.create') }}
@@ -38,11 +38,11 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   computed: {
     materialLists() {
-      return this.camp().materialLists()
+      return this.camp.materialLists()
     },
   },
   mounted() {
diff --git a/frontend/src/views/admin/Collaborators.vue b/frontend/src/views/admin/Collaborators.vue
index 713131845a..2e0ff95c41 100644
--- a/frontend/src/views/admin/Collaborators.vue
+++ b/frontend/src/views/admin/Collaborators.vue
@@ -6,7 +6,7 @@ Displays collaborators of a single camp.
     <v-card-text>
       <ContentGroup :title="$tc('views.admin.collaborators.members')">
         <template #title-actions>
-          <CollaboratorCreate v-if="isManager" :camp="camp()" />
+          <CollaboratorCreate v-if="isManager" :camp="camp" />
         </template>
         <CollaboratorList :collaborators="established" :is-manager="isManager" />
       </ContentGroup>
@@ -44,11 +44,11 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   computed: {
     collaborators() {
-      return this.camp().campCollaborations().items
+      return this.camp.campCollaborations().items
     },
     established() {
       return this.collaborators.filter((c) => c.status === 'established')
@@ -61,7 +61,7 @@ export default {
     },
   },
   created() {
-    return this.camp().campCollaborations()
+    return this.camp.campCollaborations()
   },
 }
 </script>
diff --git a/frontend/src/views/admin/Info.vue b/frontend/src/views/admin/Info.vue
index 9d59b5bb7d..46bd035339 100644
--- a/frontend/src/views/admin/Info.vue
+++ b/frontend/src/views/admin/Info.vue
@@ -43,13 +43,13 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   data: () => ({
     openPanels: [],
   }),
   mounted() {
-    this.camp()._meta.load.then((camp) => {
+    this.camp._meta.load.then((camp) => {
       if (
         camp?.organizer ||
         camp?.kind ||
diff --git a/frontend/src/views/admin/Print.vue b/frontend/src/views/admin/Print.vue
index 86166261b6..178260053f 100644
--- a/frontend/src/views/admin/Print.vue
+++ b/frontend/src/views/admin/Print.vue
@@ -25,7 +25,7 @@ export default {
     PrintConfigurator,
   },
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   data() {
     return {}
diff --git a/frontend/src/views/admin/SideBarAdmin.vue b/frontend/src/views/admin/SideBarAdmin.vue
index 4fdf5cbd37..2d1abd7e4a 100644
--- a/frontend/src/views/admin/SideBarAdmin.vue
+++ b/frontend/src/views/admin/SideBarAdmin.vue
@@ -2,28 +2,28 @@
   <SideBar :title="$tc('global.navigation.admin.title')" icon="mdi-menu">
     <v-list class="py-0">
       <SidebarListItem
-        :to="adminRoute(camp(), 'info')"
+        :to="adminRoute(camp, 'info')"
         :title="$tc('views.admin.sideBarAdmin.itemInfos')"
         icon="mdi-tent"
       />
       <SidebarListItem
-        :to="adminRoute(camp(), 'activity')"
+        :to="adminRoute(camp, 'activity')"
         :title="$tc('views.admin.sideBarAdmin.itemActivity')"
         :subtitle="$tc('views.admin.sideBarAdmin.itemActivitySubtitle')"
         icon="mdi-view-dashboard-outline"
       />
       <SidebarListItem
-        :to="adminRoute(camp(), 'collaborators')"
+        :to="adminRoute(camp, 'collaborators')"
         :title="$tc('views.admin.sideBarAdmin.itemCollaborators')"
         icon="mdi-account-group-outline"
       />
       <SidebarListItem
-        :to="adminRoute(camp(), 'material')"
+        :to="adminRoute(camp, 'material')"
         :title="$tc('views.admin.sideBarAdmin.itemMaterialLists')"
         icon="mdi-package-variant-closed"
       />
       <SidebarListItem
-        :to="adminRoute(camp(), 'print')"
+        :to="adminRoute(camp, 'print')"
         :title="$tc('views.admin.sideBarAdmin.itemPrint')"
         icon="mdi-file-outline"
       />
@@ -43,7 +43,7 @@ export default {
   mixins: [campRoleMixin],
   props: {
     camp: {
-      type: Function,
+      type: Object,
       required: true,
     },
   },
diff --git a/frontend/src/views/admin/__tests__/Admin.spec.js b/frontend/src/views/admin/__tests__/Admin.spec.js
index c27a40de78..6aded65fc2 100644
--- a/frontend/src/views/admin/__tests__/Admin.spec.js
+++ b/frontend/src/views/admin/__tests__/Admin.spec.js
@@ -9,7 +9,7 @@ describe('Admin view', () => {
     const camp = createCampWithRole('manager')
     const { getByText } = render(Admin, {
       props: {
-        camp: () => camp,
+        camp,
       },
       routes: [],
       store: createStoreObject(),
@@ -33,7 +33,7 @@ describe('Admin view', () => {
     const camp = createCampWithRole('member')
     const { queryByText } = render(Admin, {
       props: {
-        camp: () => camp,
+        camp,
       },
       routes: [],
       store: createStoreObject(),
@@ -53,7 +53,7 @@ describe('Admin view', () => {
     const camp = createCampWithRole('guest')
     const { queryByText } = render(Admin, {
       props: {
-        camp: () => camp,
+        camp,
       },
       routes: [],
       store: createStoreObject(),
diff --git a/frontend/src/views/camp/Admin.vue b/frontend/src/views/camp/Admin.vue
index 1b55d9cb3d..d94ef0c96b 100644
--- a/frontend/src/views/camp/Admin.vue
+++ b/frontend/src/views/camp/Admin.vue
@@ -60,15 +60,15 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   data() {
     return {}
   },
   mounted() {
-    this.api.reload(this.camp())
-    this.api.reload(this.camp().materialLists())
-    this.api.reload(this.camp().progressLabels())
+    this.api.reload(this.camp)
+    this.api.reload(this.camp.materialLists())
+    this.api.reload(this.camp.progressLabels())
   },
 }
 </script>
diff --git a/frontend/src/views/camp/CampProgram.vue b/frontend/src/views/camp/CampProgram.vue
index 223c3c78ee..9dcab22140 100644
--- a/frontend/src/views/camp/CampProgram.vue
+++ b/frontend/src/views/camp/CampProgram.vue
@@ -104,9 +104,9 @@ Show all activity schedule entries of a single period.
         <Picasso
           :schedule-entries="slotProps.scheduleEntries"
           :reload="slotProps.reloadEntries"
-          :period="period()"
-          :start="period().start"
-          :end="period().end"
+          :period="period"
+          :start="period.start"
+          :end="period.end"
           :editable="editMode"
           :is-filter-set="isFilterSet"
           @newEntry="slotProps.on.newEntry"
@@ -162,7 +162,7 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    period: { type: Function, required: true },
+    period: { type: Object, required: true },
   },
   data() {
     return {
@@ -185,18 +185,18 @@ export default {
   },
   computed: {
     camp() {
-      return this.period().camp
+      return this.period.camp()
     },
     printConfig() {
       return {
-        camp: this.camp()._meta.self,
+        camp: this.camp._meta.self,
         language: this.$store.state.lang.language,
         documentName: this.camp.title + '-picasso.pdf',
         contents: [
           {
             type: 'Picasso',
             options: {
-              periods: [this.period()._meta.self],
+              periods: [this.period._meta.self],
               orientation: 'L',
             },
           },
@@ -205,11 +205,11 @@ export default {
     },
     editMode: {
       get() {
-        return this.$store.getters.getPicassoEditMode(this.camp()._meta.self)
+        return this.$store.getters.getPicassoEditMode(this.camp._meta.self)
       },
       set(value) {
         this.$store.commit('setPicassoEditMode', {
-          campUri: this.camp()._meta.self,
+          campUri: this.camp._meta.self,
           editMode: value,
         })
       },
@@ -230,12 +230,12 @@ export default {
   },
   async mounted() {
     await Promise.all([
-      this.camp()._meta.load,
-      this.period().scheduleEntries()._meta.load,
-      this.camp().activities()._meta.load,
-      this.camp().categories()._meta.load,
-      this.period().days()._meta.load,
-      this.period().dayResponsibles()._meta.load,
+      this.camp._meta.load,
+      this.period.scheduleEntries()._meta.load,
+      this.camp.activities()._meta.load,
+      this.camp.categories()._meta.load,
+      this.period.days()._meta.load,
+      this.period.dayResponsibles()._meta.load,
     ])
 
     this.loading = false
diff --git a/frontend/src/views/camp/Dashboard.vue b/frontend/src/views/camp/Dashboard.vue
index 1742a95065..4c066038cf 100644
--- a/frontend/src/views/camp/Dashboard.vue
+++ b/frontend/src/views/camp/Dashboard.vue
@@ -147,7 +147,7 @@ export default {
   },
   mixins: [dateHelperUTCFormatted],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   data() {
     return {
@@ -171,7 +171,7 @@ export default {
   },
   computed: {
     periods() {
-      return keyBy(this.camp().periods().items, '_meta.self')
+      return keyBy(this.camp.periods().items, '_meta.self')
     },
     scheduleEntries() {
       return Object.values(this.periods).flatMap(
@@ -243,12 +243,10 @@ export default {
   },
   async mounted() {
     await Promise.all([
-      this.camp()._meta.load,
-      this.api.get().days({ 'period.camp': this.camp()._meta.self }),
-      ...this.camp()
-        .periods()
-        .items.map((period) => period.scheduleEntries()._meta.load),
-      this.camp().activities()._meta.load,
+      this.camp._meta.load,
+      this.api.get().days({ 'period.camp': this.camp._meta.self }),
+      ...this.camp.periods().items.map((period) => period.scheduleEntries()._meta.load),
+      this.camp.activities()._meta.load,
     ])
 
     this.loading = false
@@ -258,14 +256,12 @@ export default {
       this.filter[key] = value
     })
 
-    this.camp()
-      .periods()
-      ._meta.load.then(({ allItems }) => {
-        const collection = allItems.map((entry) => entry._meta.self)
-        this.filter.periods =
-          this.filter.periods?.filter((value) => collection.includes(value)) ?? null
-        this.loadingEndpoints.periods = false
-      })
+    this.camp.periods()._meta.load.then(({ allItems }) => {
+      const collection = allItems.map((entry) => entry._meta.self)
+      this.filter.periods =
+        this.filter.periods?.filter((value) => collection.includes(value)) ?? null
+      this.loadingEndpoints.periods = false
+    })
   },
   methods: {
     persistRouterState() {
diff --git a/frontend/src/views/camp/Invitation.vue b/frontend/src/views/camp/Invitation.vue
index e471f222da..43b1895bdd 100644
--- a/frontend/src/views/camp/Invitation.vue
+++ b/frontend/src/views/camp/Invitation.vue
@@ -111,7 +111,7 @@ export default {
   name: 'Invitation',
   components: { ButtonBack, UserMeta },
   props: {
-    invitation: { type: Function, required: false, default: null },
+    invitation: { type: Object, required: false, default: null },
     variant: { type: String, default: 'default' },
   },
   data: () => ({
@@ -119,7 +119,7 @@ export default {
   }),
   computed: {
     invite() {
-      return this.invitationFound === true ? this.invitation?.() : null
+      return this.invitationFound === true ? this.invitation : null
     },
     campLink() {
       return {
@@ -142,16 +142,14 @@ export default {
 
     if (this.variant === 'default') {
       // Content of api response depends on authenticated user --> reload every time this component is mounted
-      this.invitation?.()
-        .$reload()
-        .then(
-          () => {
-            this.invitationFound = true
-          },
-          () => {
-            this.invitationFound = false
-          }
-        )
+      this.invitation.$reload().then(
+        () => {
+          this.invitationFound = true
+        },
+        () => {
+          this.invitationFound = false
+        }
+      )
     }
   },
   methods: {
diff --git a/frontend/src/views/camp/Story.vue b/frontend/src/views/camp/Story.vue
index 05e03b6007..b732514e4e 100644
--- a/frontend/src/views/camp/Story.vue
+++ b/frontend/src/views/camp/Story.vue
@@ -26,7 +26,7 @@
         </v-list>
       </v-menu>
     </template>
-    <story-period :edit-mode="editMode" :period="period()" />
+    <story-period :edit-mode="editMode" :period="period" />
   </content-card>
 </template>
 
@@ -51,20 +51,20 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    period: { type: Function, required: true },
-    camp: { type: Function, required: true },
+    period: { type: Object, required: true },
+    camp: { type: Object, required: true },
   },
   computed: {
     printConfig() {
       return {
-        camp: this.camp()._meta.self,
+        camp: this.camp._meta.self,
         language: this.$store.state.lang.language,
-        documentName: this.camp().title + '-StorySummary.pdf',
+        documentName: this.camp.title + '-StorySummary.pdf',
         contents: [
           {
             type: 'Story',
             options: {
-              periods: [this.period()._meta.self],
+              periods: [this.period._meta.self],
             },
           },
         ],
@@ -72,11 +72,11 @@ export default {
     },
     editMode: {
       get() {
-        return this.$store.getters.getStoryContextEditMode(this.camp()._meta.self)
+        return this.$store.getters.getStoryContextEditMode(this.camp._meta.self)
       },
       set(value) {
         this.$store.commit('setStoryContextEditMode', {
-          campUri: this.camp()._meta.self,
+          campUri: this.camp._meta.self,
           editMode: value,
         })
       },
diff --git a/frontend/src/views/camp/navigation/NavigationCamp.vue b/frontend/src/views/camp/navigation/NavigationCamp.vue
index 16112f7a16..12bd8e5265 100644
--- a/frontend/src/views/camp/navigation/NavigationCamp.vue
+++ b/frontend/src/views/camp/navigation/NavigationCamp.vue
@@ -19,7 +19,7 @@ export default {
     NavSidebar,
   },
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   data() {
     return {
diff --git a/frontend/src/views/camp/navigation/desktop/NavTopbar.vue b/frontend/src/views/camp/navigation/desktop/NavTopbar.vue
index bf3e9dfe56..2464dafd8e 100644
--- a/frontend/src/views/camp/navigation/desktop/NavTopbar.vue
+++ b/frontend/src/views/camp/navigation/desktop/NavTopbar.vue
@@ -3,32 +3,32 @@
     <logo text />
 
     <v-toolbar-items>
-      <v-btn :to="campRoute(camp())" text>
+      <v-btn :to="campRoute(camp)" text>
         <v-icon :left="$vuetify.breakpoint.mdAndUp">mdi-tent</v-icon>
         <span class="sr-only-sm-and-down">{{
-          camp().title
+          camp.title
             | loading($tc('views.camp.navigation.desktop.navTopbar.campIsLoading'))
         }}</span>
       </v-btn>
-      <v-btn :to="campRoute(camp(), 'program')" text>
+      <v-btn :to="campRoute(camp, 'program')" text>
         <v-icon :left="$vuetify.breakpoint.mdAndUp">mdi-view-dashboard</v-icon>
         <span class="sr-only-sm-and-down">{{
           $tc('views.camp.navigation.desktop.navTopbar.program')
         }}</span>
       </v-btn>
-      <v-btn :to="campRoute(camp(), 'story')" text>
+      <v-btn :to="campRoute(camp, 'story')" text>
         <v-icon :left="$vuetify.breakpoint.mdAndUp"> mdi-book-open-variant </v-icon>
         <span class="sr-only-sm-and-down">{{
           $tc('views.camp.navigation.desktop.navTopbar.story')
         }}</span>
       </v-btn>
-      <v-btn :to="materialListRoute(camp())" text>
+      <v-btn :to="materialListRoute(camp)" text>
         <v-icon :left="$vuetify.breakpoint.mdAndUp"> mdi-package-variant </v-icon>
         <span class="sr-only-sm-and-down">{{
           $tc('views.camp.navigation.desktop.navTopbar.material')
         }}</span>
       </v-btn>
-      <v-btn :to="campRoute(camp(), 'admin')" text>
+      <v-btn :to="campRoute(camp, 'admin')" text>
         <v-icon :left="$vuetify.breakpoint.mdAndUp"> mdi-cogs </v-icon>
         <span class="sr-only-sm-and-down">{{
           $tc('global.navigation.admin.title')
@@ -62,7 +62,7 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   data() {
     return {
diff --git a/frontend/src/views/camp/navigation/mobile/NavBottombar.vue b/frontend/src/views/camp/navigation/mobile/NavBottombar.vue
index 1f95ff3161..e458f90590 100644
--- a/frontend/src/views/camp/navigation/mobile/NavBottombar.vue
+++ b/frontend/src/views/camp/navigation/mobile/NavBottombar.vue
@@ -1,18 +1,18 @@
 <template>
   <v-bottom-navigation grow app background-color="blue-grey darken-4" dark>
-    <v-btn :to="campRoute(camp(), 'program')">
+    <v-btn :to="campRoute(camp, 'program')">
       <span>{{ $tc('views.camp.navigation.mobile.navBottombar.program') }}</span>
       <v-icon>mdi-view-dashboard</v-icon>
     </v-btn>
-    <v-btn :to="campRoute(camp(), 'story')">
+    <v-btn :to="campRoute(camp, 'story')">
       <span>{{ $tc('views.camp.navigation.mobile.navBottombar.story') }}</span>
       <v-icon>mdi-book-open-variant</v-icon>
     </v-btn>
-    <v-btn :to="campRoute(camp(), 'dashboard')">
-      <span>{{ camp().name }}</span>
+    <v-btn :to="campRoute(camp, 'dashboard')">
+      <span>{{ camp.name }}</span>
       <v-icon large>mdi-tent</v-icon>
     </v-btn>
-    <v-btn :to="materialListRoute(camp(), '/lists')">
+    <v-btn :to="materialListRoute(camp, '/lists')">
       <span>{{ $tc('views.camp.navigation.mobile.navBottombar.material') }}</span>
       <v-icon>mdi-package-variant</v-icon>
     </v-btn>
@@ -30,7 +30,7 @@ import { mapGetters } from 'vuex'
 export default {
   name: 'NavBottombar',
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   data() {
     return {
diff --git a/frontend/src/views/camp/navigation/mobile/NavSidebar.vue b/frontend/src/views/camp/navigation/mobile/NavSidebar.vue
index e9b93d8b16..0f20487ff8 100644
--- a/frontend/src/views/camp/navigation/mobile/NavSidebar.vue
+++ b/frontend/src/views/camp/navigation/mobile/NavSidebar.vue
@@ -37,23 +37,23 @@
 
       <v-divider />
 
-      <v-list v-if="!camp()._meta.loading">
+      <v-list v-if="!camp._meta.loading">
         <SidebarListItem
-          :title="camp().name"
-          :subtitle="camp().motto"
+          :title="camp.name"
+          :subtitle="camp.motto"
           two-line
           hide-avatar
           hide-chevron
         />
         <v-divider inset i />
         <SidebarListItem
-          :to="adminRoute(camp(), 'info')"
+          :to="adminRoute(camp, 'info')"
           :title="$tc('views.camp.navigation.mobile.navSidebar.itemInfos')"
           icon="mdi-cogs"
         />
         <v-divider inset />
         <SidebarListItem
-          :to="adminRoute(camp(), 'activity')"
+          :to="adminRoute(camp, 'activity')"
           :title="$tc('views.camp.navigation.mobile.navSidebar.itemActivity')"
           :subtitle="$tc('views.camp.navigation.mobile.navSidebar.itemActivitySubtitle')"
           icon="mdi-view-dashboard"
@@ -62,11 +62,11 @@
         <SidebarListItem
           :title="$tc('views.camp.navigation.mobile.navSidebar.itemCollaborators')"
           icon="mdi-account-group"
-          :to="adminRoute(camp(), 'collaborators')"
+          :to="adminRoute(camp, 'collaborators')"
         />
         <v-divider inset />
         <SidebarListItem
-          :to="adminRoute(camp(), 'material')"
+          :to="adminRoute(camp, 'material')"
           :title="$tc('views.camp.navigation.mobile.navSidebar.itemMaterialLists')"
           icon="mdi-package-variant"
         />
@@ -74,7 +74,7 @@
         <SidebarListItem
           :title="$tc('views.camp.navigation.mobile.navSidebar.itemPrinting')"
           icon="mdi-file"
-          :to="adminRoute(camp(), 'print')"
+          :to="adminRoute(camp, 'print')"
         />
       </v-list>
 
@@ -129,7 +129,7 @@ export default {
   },
   props: {
     value: { type: Boolean, required: true },
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   computed: {
     newsLink() {
diff --git a/frontend/src/views/category/Category.vue b/frontend/src/views/category/Category.vue
index ae88dce0ff..1fa30f3cc4 100644
--- a/frontend/src/views/category/Category.vue
+++ b/frontend/src/views/category/Category.vue
@@ -1,7 +1,7 @@
 <template>
   <v-container fluid>
     <content-card
-      v-if="category()"
+      v-if="category"
       class="ec-category"
       toolbar
       back
@@ -9,8 +9,8 @@
     >
       <template #title>
         <v-toolbar-title class="font-weight-bold">
-          <CategoryChip :category="category()" dense large />
-          {{ category().name }}
+          <CategoryChip :category="category" dense large />
+          {{ category.name }}
         </v-toolbar-title>
       </template>
 
@@ -34,8 +34,8 @@
             <CopyCategoryInfoDialog ref="copyInfoDialog" />
             <DialogEntityDelete
               v-if="isManager"
-              :entity="category()"
-              :warning-text-entity="category().name"
+              :entity="category"
+              :warning-text-entity="category.name"
               :dialog-title="$tc('views.category.category.deleteCategory')"
               :success-handler="goToActivityAdmin"
             >
@@ -49,10 +49,10 @@
                   </v-list-item-title>
                 </v-list-item>
               </template>
-              <template v-if="findActivities(category()).length > 0" #error>
+              <template v-if="findActivities(category).length > 0" #error>
                 <ErrorExistingActivitiesList
-                  :camp="camp()"
-                  :existing-activities="findActivities(category())"
+                  :camp="camp"
+                  :existing-activities="findActivities(category)"
                 />
               </template>
             </DialogEntityDelete>
@@ -67,7 +67,7 @@
             </h3>
           </v-expansion-panel-header>
           <v-expansion-panel-content>
-            <CategoryProperties :category="category()" :disabled="!isManager" />
+            <CategoryProperties :category="category" :disabled="!isManager" />
           </v-expansion-panel-content>
         </v-expansion-panel>
 
@@ -79,7 +79,7 @@
           </v-expansion-panel-header>
           <v-expansion-panel-content>
             <CategoryTemplate
-              :category="category()"
+              :category="category"
               :layout-mode="layoutMode"
               :loading="loading"
               :disabled="!isManager"
@@ -120,18 +120,20 @@ export default {
     return {
       preferredContentTypes: () => this.preferredContentTypes,
       allContentNodes: () => this.contentNodes,
-      camp: () => this.camp(),
+      camp: this.camp,
       isPaperDisplaySize: () => this.isPaperDisplaySize,
     }
   },
   props: {
     camp: {
-      type: Function,
-      required: true,
+      type: Object,
+      default: null,
+      required: false,
     },
     category: {
-      type: Function,
-      required: true,
+      type: Object,
+      default: null,
+      required: false,
     },
   },
   data() {
@@ -143,18 +145,18 @@ export default {
   },
   computed: {
     contentNodes() {
-      return this.category().contentNodes()
+      return this.category.contentNodes()
     },
     preferredContentTypes() {
-      return this.category().preferredContentTypes()
+      return this.category.preferredContentTypes()
     },
     isPaperDisplaySize: {
       get() {
-        return this.$store.getters.getPaperDisplaySize(this.camp()._meta.self)
+        return this.$store.getters.getPaperDisplaySize(this.camp._meta.self)
       },
       set(value) {
         this.$store.commit('setPaperDisplaySize', {
-          campUri: this.camp()._meta.self,
+          campUri: this.camp._meta.self,
           paperDisplaySize: value,
         })
       },
@@ -171,20 +173,20 @@ export default {
       this.openPanels = [1]
     }
     this.loading = true
-    await this.category()._meta.load // wait if category is being loaded as part of a collection
-    await this.category().$reload() // reload as single entity to ensure all embedded entities are included in a single network request
+    await this.category._meta.load // wait if category is being loaded as part of a collection
+    await this.category.$reload() // reload as single entity to ensure all embedded entities are included in a single network request
     this.loading = false
   },
   methods: {
     findActivities(category) {
-      return this.camp()
+      return this.camp
         .activities()
         .items.filter(
           (activity) => activity.category()._meta.self === category._meta.self
         )
     },
     goToActivityAdmin() {
-      this.$router.push({ name: 'admin/activity', params: { campId: this.camp().id } })
+      this.$router.replace({ name: 'admin/activity', params: { campId: this.camp.id } })
     },
     async copyUrlToClipboard() {
       try {
@@ -196,12 +198,12 @@ export default {
         console.warn('clipboard permission not requestable')
       }
 
-      const category = categoryRoute(this.camp(), this.category())
+      const category = categoryRoute(this.camp, this.category)
       const url = window.location.origin + router.resolve(category).href
       await navigator.clipboard.writeText(url)
 
       this.$toast.info(
-        this.$tc('global.toast.copied', null, { source: this.category().name }),
+        this.$tc('global.toast.copied', null, { source: this.category.name }),
         {
           timeout: 2000,
         }
diff --git a/frontend/src/views/category/SideBarCategory.vue b/frontend/src/views/category/SideBarCategory.vue
index 14d18fa348..aec7ccb99a 100644
--- a/frontend/src/views/category/SideBarCategory.vue
+++ b/frontend/src/views/category/SideBarCategory.vue
@@ -5,9 +5,9 @@
   >
     <v-list>
       <v-list-item
-        v-for="category in camp().categories().items"
+        v-for="category in camp.categories().items"
         :key="category._meta.self"
-        :to="categoryRoute(camp(), category)"
+        :to="categoryRoute(camp, category)"
         replace
       >
         <v-list-item-title class="d-flex gap-2 align-baseline">
@@ -31,7 +31,7 @@ export default {
   name: 'SideBarCategory',
   components: { CategoryChip, SideBar },
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   methods: { categoryRoute },
 }
diff --git a/frontend/src/views/material/MaterialDetail.vue b/frontend/src/views/material/MaterialDetail.vue
index ec6c27fe05..060167a470 100644
--- a/frontend/src/views/material/MaterialDetail.vue
+++ b/frontend/src/views/material/MaterialDetail.vue
@@ -1,6 +1,6 @@
 <template>
   <v-container fluid>
-    <content-card :title="materialList().name" toolbar>
+    <content-card :title="materialList.name" toolbar>
       <template #title-actions>
         <v-menu offset-y>
           <template #activator="{ attrs, on }">
@@ -9,7 +9,7 @@
             </v-btn>
           </template>
           <v-list class="py-0">
-            <DialogMaterialListEdit v-if="!isGuest" :material-list="materialList()">
+            <DialogMaterialListEdit v-if="!isGuest" :material-list="materialList">
               <template #activator="{ attrs, on }">
                 <v-list-item v-bind="attrs" v-on="on">
                   <v-list-item-icon>
@@ -44,7 +44,7 @@
           :key="period._meta.self"
           :period="period"
           :material-item-collection="materialItems"
-          :material-list="materialList()"
+          :material-list="materialList"
           :disabled="!isContributor"
         />
       </v-expansion-panels>
@@ -52,10 +52,10 @@
         <MaterialTable
           v-for="{ period, materialItems } in collection"
           :key="period._meta.self"
-          :camp="camp()"
+          :camp="camp"
           :material-item-collection="materialItems"
           :period="period"
-          :material-list="materialList()"
+          :material-list="materialList"
           :disabled="!isContributor"
         />
       </v-card-text>
@@ -70,7 +70,6 @@ import MaterialTable from '@/components/material/MaterialTable.vue'
 import DialogMaterialListEdit from '@/components/campAdmin/DialogMaterialListEdit.vue'
 import { campRoleMixin } from '@/mixins/campRoleMixin.js'
 import { useMaterialViewHelper } from '@/components/material/useMaterialViewHelper.js'
-import { apiStore } from '@/plugins/store/index.js'
 
 export default {
   name: 'MaterialDetail',
@@ -82,11 +81,11 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
-    materialList: { type: Function, required: true },
+    camp: { type: Object, required: true },
+    materialList: { type: Object, required: true },
   },
   setup(props) {
-    return useMaterialViewHelper(props.camp.call({ api: { get: apiStore.get } }), true)
+    return useMaterialViewHelper(props.camp, true)
   },
 }
 </script>
diff --git a/frontend/src/views/material/MaterialLists.vue b/frontend/src/views/material/MaterialLists.vue
index 457a88a90a..b41468ac0a 100644
--- a/frontend/src/views/material/MaterialLists.vue
+++ b/frontend/src/views/material/MaterialLists.vue
@@ -5,7 +5,7 @@ Show all material lists for a camp on mobile
 <template>
   <content-card :title="$tc('views.material.materialLists.title')" toolbar>
     <template v-if="!isGuest" #title-actions>
-      <DialogMaterialListCreate :camp="camp()">
+      <DialogMaterialListCreate :camp="camp">
         <template #activator="{ on }">
           <ButtonAdd class="mr-n2" height="32" v-on="on"
             >{{ $tc('global.button.create') }}
@@ -34,11 +34,11 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   computed: {
     materialLists() {
-      return this.camp().materialLists()
+      return this.camp.materialLists()
     },
   },
   mounted() {
diff --git a/frontend/src/views/material/MaterialOverview.vue b/frontend/src/views/material/MaterialOverview.vue
index e8b4402768..5307ad2459 100644
--- a/frontend/src/views/material/MaterialOverview.vue
+++ b/frontend/src/views/material/MaterialOverview.vue
@@ -9,7 +9,7 @@
             </v-btn>
           </template>
           <v-list class="py-0">
-            <DialogMaterialListCreate v-if="!isGuest" :camp="camp()">
+            <DialogMaterialListCreate v-if="!isGuest" :camp="camp">
               <template #activator="{ attrs, on }">
                 <v-list-item v-bind="attrs" v-on="on">
                   <v-list-item-icon>
@@ -50,7 +50,7 @@
         <MaterialTable
           v-for="{ period, materialItems } in collection"
           :key="period._meta.self"
-          :camp="camp()"
+          :camp="camp"
           :material-item-collection="materialItems"
           :period="period"
           :disabled="!isContributor"
@@ -67,7 +67,6 @@ import PeriodMaterialLists from '@/components/material/PeriodMaterialLists.vue'
 import DialogMaterialListCreate from '@/components/campAdmin/DialogMaterialListCreate.vue'
 import { campRoleMixin } from '@/mixins/campRoleMixin.js'
 import { useMaterialViewHelper } from '@/components/material/useMaterialViewHelper.js'
-import { apiStore } from '@/plugins/store/index.js'
 
 export default {
   name: 'MaterialOverview',
@@ -79,10 +78,10 @@ export default {
   },
   mixins: [campRoleMixin],
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
   setup(props) {
-    return useMaterialViewHelper(props.camp.call({ api: { get: apiStore.get } }))
+    return useMaterialViewHelper(props.camp)
   },
 }
 </script>
diff --git a/frontend/src/views/material/SideBarMaterialLists.vue b/frontend/src/views/material/SideBarMaterialLists.vue
index 3478e8e189..aa8ec58cc7 100644
--- a/frontend/src/views/material/SideBarMaterialLists.vue
+++ b/frontend/src/views/material/SideBarMaterialLists.vue
@@ -14,7 +14,7 @@ export default {
   name: 'SideBarMaterialLists',
   components: { MaterialLists, SideBar },
   props: {
-    camp: { type: Function, required: true },
+    camp: { type: Object, required: true },
   },
 }
 </script>

From 805bd05730582f1c9a13ae41bb7e6a91e62f7312 Mon Sep 17 00:00:00 2001
From: Manuel Meister <news.manuelsworld@gmail.com>
Date: Sun, 21 Apr 2024 16:03:31 +0200
Subject: [PATCH 2/4] Fix nullable invitation

---
 frontend/src/views/camp/Invitation.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/views/camp/Invitation.vue b/frontend/src/views/camp/Invitation.vue
index 43b1895bdd..b68b8a4c42 100644
--- a/frontend/src/views/camp/Invitation.vue
+++ b/frontend/src/views/camp/Invitation.vue
@@ -142,7 +142,7 @@ export default {
 
     if (this.variant === 'default') {
       // Content of api response depends on authenticated user --> reload every time this component is mounted
-      this.invitation.$reload().then(
+      this.invitation?.$reload().then(
         () => {
           this.invitationFound = true
         },

From 39a2c4fa0aadf8974beb9136b53fc766dd8634a1 Mon Sep 17 00:00:00 2001
From: Manuel Meister <news.manuelsworld@gmail.com>
Date: Sun, 21 Apr 2024 16:11:41 +0200
Subject: [PATCH 3/4] Fix function instead of object

---
 frontend/src/components/program/DialogActivityEdit.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/components/program/DialogActivityEdit.vue b/frontend/src/components/program/DialogActivityEdit.vue
index 0869d9a1f9..d9d7db9b30 100644
--- a/frontend/src/components/program/DialogActivityEdit.vue
+++ b/frontend/src/components/program/DialogActivityEdit.vue
@@ -23,7 +23,7 @@
         {{ $tc('global.button.open') }}
       </v-btn>
     </template>
-    <dialog-activity-form :activity="entityData" :period="scheduleEntry.period" />
+    <dialog-activity-form :activity="entityData" :period="scheduleEntry.period()" />
   </dialog-form>
 </template>
 

From d96d7ce6e26c629a184d14615e42633a2f665260 Mon Sep 17 00:00:00 2001
From: Manuel Meister <news.manuelsworld@gmail.com>
Date: Sun, 21 Apr 2024 16:24:24 +0200
Subject: [PATCH 4/4] Fix function instead of object

---
 frontend/src/components/material/DialogMaterialItemCreate.vue | 2 +-
 frontend/src/components/material/DialogMaterialItemEdit.vue   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/material/DialogMaterialItemCreate.vue b/frontend/src/components/material/DialogMaterialItemCreate.vue
index 1d1c90aee0..ded58f7e9e 100644
--- a/frontend/src/components/material/DialogMaterialItemCreate.vue
+++ b/frontend/src/components/material/DialogMaterialItemCreate.vue
@@ -14,7 +14,7 @@
     </template>
 
     <dialog-material-item-form
-      :material-lists="camp.materialLists"
+      :material-lists="camp.materialLists()"
       :material-item="entityData"
     />
   </dialog-form>
diff --git a/frontend/src/components/material/DialogMaterialItemEdit.vue b/frontend/src/components/material/DialogMaterialItemEdit.vue
index 8adc552634..9cca2132f5 100644
--- a/frontend/src/components/material/DialogMaterialItemEdit.vue
+++ b/frontend/src/components/material/DialogMaterialItemEdit.vue
@@ -26,7 +26,7 @@
     </template>
 
     <dialog-material-item-form
-      :material-lists="camp.materialLists"
+      :material-lists="camp.materialLists()"
       :material-item="entityData"
     />
   </dialog-form>