Fixes #12966 pass the group to groupChallenges so the leader only check can be used to display the create challenge button (#13221)

Co-authored-by: SpeedyLom <speedylomuk@gmail.com>

website/client/src/components/challenges/groupChallenges.vue

@@ -20,6 +20,7 @@
           {{ $t('challengeDetails') }}
         </p>
         <button
+          v-if="canCreateChallenges"
           class="btn btn-secondary"
           @click="createChallenge()"
         >
@@ -36,6 +37,7 @@
       />
       <div class="col-12 text-center">
         <button
+          v-if="canCreateChallenges"
           class="btn btn-secondary"
           @click="createChallenge()"
         >
@@ -86,7 +88,7 @@ export default {
   directives: {
     markdown: markdownDirective,
   },
-  props: ['groupId'],
+  props: ['group'],
   data () {
     return {
       challenges: [],
@@ -98,6 +100,12 @@ export default {
   },
   computed: {
     ...mapState({ user: 'user.data' }),
+    canCreateChallenges () {
+      if (this.group.leaderOnly.challenges) {
+        return this.group.leader._id === this.user._id;
+      }
+      return true;
+    },
   },
   watch: {
     async groupId () {
@@ -109,8 +117,8 @@ export default {
   },
   methods: {
     async loadChallenges () {
-      this.groupIdForChallenges = this.groupId;
+      this.groupIdForChallenges = this.group._id;
-      if (this.groupId === 'party' && this.user.party._id) this.groupIdForChallenges = this.user.party._id;
+      if (this.group._id === 'party' && this.user.party._id) this.groupIdForChallenges = this.user.party._id;
       this.challenges = await this.$store.dispatch('challenges:getGroupChallenges', { groupId: this.groupIdForChallenges });
     },
     createChallenge () {

website/client/src/components/groups/group.vue

@@ -176,7 +176,7 @@
           :title="$t('challenges')"
           :tooltip="$t('challengeDetails')"
         >
-          <group-challenges :group-id="searchId" />
+          <group-challenges :group="group" />
         </sidebar-section>
       </div>
       <div class="text-center">