Display message for empty efforts

aleksis/apps/maka/frontend/components/efforts/UnwrappedEffortTab.vue

@@ -5,12 +5,14 @@ import { effortsForGroup } from "./effortTab.graphql";
 import GradeChip from "../grades/GradeChip.vue";
 import UpdateOrCreateGrade from "../grades/UpdateOrCreateGrade.vue";
 import CreateEffort from "./CreateEffort.vue";
+import MessageBox from "aleksis.core/components/generic/MessageBox.vue";
 
 export default {
   name: "UnwrappedEffortTab",
   components: {
     CreateEffort,
     GradeChip,
+    MessageBox,
     PersonChip,
     UpdateOrCreateGrade,
   },
@@ -54,12 +56,17 @@ export default {
 <template>
   <v-data-table
     :headers="headers"
-    :items="group.members"
+    :items="efforts.length > 0 ? group.members : []"
     hide-default-footer
     disable-pagination
     multi-sort
   >
-    <template #top>
+    <!--  TODO: this block should only be rendered if the user is allowed to create efforts for this group  -->
+    <template #top v-if="true">
+
+      <message-box type="info" class="ma-2" v-if="!efforts.length">
+        {{ $t("maka.efforts.none_yet") }}
+      </message-box>
       <create-effort
         :fixed-group="group.id"
         :affected-query="$apollo.queries.efforts"

aleksis/apps/maka/frontend/messages/en.json

@@ -22,7 +22,8 @@
       "group": "Related group",
       "grade_set": "Grade Set",
       "menu_title": "Efforts",
-      "title_plural": "Efforts"
+      "title_plural": "Efforts",
+      "none_yet": "You did not define graded efforts for this group. Create some below to use this feature."
     },
     "effort_types": {
       "menu_title": "Effort Types",