New client many fixes (#8981)

* Footer style fixes

* Limited string display

* Fixed background reload

* Began adding more avatar items

* Fixed challenge updated cats and official to be seen by admins

* Fixed min prize

* Fixed required fields

* Added my challenges and find challenges to menu

* Removed nav to party page when have no party

* Updated user and notifications icon

* Added accept, reject and messages

* Added selfcare

* Underline links

* Added forgot password

* Fixed task adding

* Disabled habit options that should be

* Added markdown to tags

* Added confirm to delete

* Fixed cancel/delete style

* Fixed rounding

* Added gold icon

* Fixed task icon styles

* Fixed margin botton

* Fixed some repeat styles

* Fixed custom reward style

* Hide like count 0

* Added new tavern images

* Redirect to party page after create

* Hid leader options from non leaders

* Removed manager options from non group plan

* Fixed some nav styles

* Fixed overlay color

* Prevented edit data from being transfered to create

* Added hover state for spells

* Add performance fixes for chat avatars

* Fixed merge conflicts

* Updated fron navigation

* Fixed reg gryphon logo

* Began adding gem modal functionality

* Added purchase gems with gold

* Fixed restore

* Replaced description with summary

* Spells that target tasks fix

* Added initial challenge task load

* Fixed lint issue

website/client/components/groups/membersModal.vue

@@ -19,24 +19,24 @@ div
       .col-8.offset-1
         member-details(:member='member')
       .col-3.actions
-        b-dropdown(:text="$t('sort')", right=true)
-          b-dropdown-item(@click='sort(option.value)')
+        b-dropdown(text="...", right=true)
+          b-dropdown-item(@click='sort(option.value)', v-if='isLeader')
             span.dropdown-icon-item
-              .svg-icon.inline(v-html="icons.removeIcon")
+              .svg-icon.inline(v-html="icons.removeIcon", v-if='isLeader')
               span.text {{$t('removeMember')}}
           b-dropdown-item(@click='sort(option.value)')
             span.dropdown-icon-item
               .svg-icon.inline(v-html="icons.messageIcon")
               span.text {{$t('sendMessage')}}
-          b-dropdown-item(@click='sort(option.value)')
+          b-dropdown-item(@click='sort(option.value)', v-if='isLeader')
             span.dropdown-icon-item
               .svg-icon.inline(v-html="icons.starIcon")
               span.text {{$t('promoteToLeader')}}
-          b-dropdown-item(@click='sort(option.value)')
+          b-dropdown-item(@click='sort(option.value)', v-if='isLeader && groupIsSubscribed')
             span.dropdown-icon-item
               .svg-icon.inline(v-html="icons.starIcon")
               span.text {{$t('addManager')}}
-          b-dropdown-item(@click='sort(option.value)')
+          b-dropdown-item(@click='sort(option.value)', v-if='isLeader && groupIsSubscribed')
             span.dropdown-icon-item
               .svg-icon.inline(v-html="icons.removeIcon")
               span.text {{$t('removeManager2')}}
@@ -109,6 +109,7 @@ import sortBy from 'lodash/sortBy';
 import bModal from 'bootstrap-vue/lib/components/modal';
 import bDropdown from 'bootstrap-vue/lib/components/dropdown';
 import bDropdownItem from 'bootstrap-vue/lib/components/dropdown-item';
+import { mapState } from 'client/libs/store';
 
 import MemberDetails from '../memberDetails';
 import removeIcon from 'assets/members/remove.svg';
@@ -116,7 +117,7 @@ import messageIcon from 'assets/members/message.svg';
 import starIcon from 'assets/members/star.svg';
 
 export default {
-  props: ['group', 'hideBadge'],
+  props: ['hideBadge'],
   components: {
     bModal,
     bDropdown,
@@ -160,6 +161,16 @@ export default {
     };
   },
   computed: {
+    ...mapState({user: 'user.data'}),
+    isLeader () {
+      return this.user._id === this.group.leader || this.user._id === this.group.leader._id;
+    },
+    groupIsSubscribed () {
+      return this.group.purchased.active;
+    },
+    group () {
+      return this.$store.state.memberModalOptions.group;
+    },
     sortedMembers () {
       let sortedMembers = this.members;
       if (!this.sortOption) return sortedMembers;
@@ -182,7 +193,7 @@ export default {
   },
   methods: {
     async getMembers () {
-      let groupId = this.$store.state.groupId || this.group._id;
+      let groupId = this.$store.state.memberModalOptions.groupId || this.group._id;
       if (groupId && groupId !== 'challenge') {
         let members = await this.$store.dispatch('members:getGroupMembers', {
           groupId,
@@ -191,7 +202,7 @@ export default {
         this.members = members;
       }
 
-      if (this.$store.state.viewingMembers.length > 0) {
+      if (this.$store.state.memberModalOptions.viewingMembers.length > 0) {
         this.members = this.$store.state.viewingMembers;
       }
     },