IT4Change/Ocelot-Social
3
0
Fork 0
mirror of https://github.com/IT4Change/Ocelot-Social.git synced 2025-12-13 07:45:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor join/leave button function and the related events

Browse Source
This commit is contained in:
Wolfgang Huß 2022-09-14 13:01:07 +02:00
parent 176fb3919a
commit 13727729a5
2 changed files with 8 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
webapp/components/Button/JoinLeaveButton.vue
View File

@ -68,19 +68,17 @@ export default {
const mutation = join ? joinGroupMutation : leaveGroupMutation const mutation = join ? joinGroupMutation : leaveGroupMutation
this.hovered = false this.hovered = false
const optimisticResult = { joinedByCurrentUser: join } this.$emit('prepare', join)
this.$emit('optimistic', optimisticResult)
try { try {
const { data } = await this.$apollo.mutate({ const { data } = await this.$apollo.mutate({
mutation, mutation,
variables: { groupId: this.groupId, userId: this.userId }, variables: { groupId: this.groupId, userId: this.userId },
}) })
const joinedGroup = join ? data.JoinGroup : data.LeaveGroup const joinedLeftGroupResult = join ? data.JoinGroup : data.LeaveGroup
this.$emit('update', joinedGroup) this.$emit('update', joinedLeftGroupResult)
} catch (error) { } catch (error) {
optimisticResult.joinedByCurrentUser = !join this.$toast.error(error.message)
this.$emit('optimistic', optimisticResult)
} }
}, },
}, },

24
webapp/pages/group/_id/_slug.vue
View File

@ -96,7 +96,7 @@
:isMember="isGroupMember" :isMember="isGroupMember"
:disabled="isGroupOwner" :disabled="isGroupOwner"
:loading="$apollo.loading" :loading="$apollo.loading"
@optimistic="optimisticJoinLeave" @prepare="prepareJoinLeave"
@update="updateJoinLeave" @update="updateJoinLeave"
/> />
<!-- implement: <!-- implement:
@ -457,31 +457,13 @@ export default {
// this.user.followedByCurrentUser = followedByCurrentUser // this.user.followedByCurrentUser = followedByCurrentUser
// this.user.followedBy = followedBy // this.user.followedBy = followedBy
// }, // },
optimisticJoinLeave({ joinedByCurrentUser }) { prepareJoinLeave() {
/* // "membersCountStartValue" is updated to avoid counting from 0 when join/leave
* Note: "membersCountStartValue" is updated to avoid counting from 0 when join/leave
*/
let members
this.membersCountStartValue = this.GroupMembers.length this.membersCountStartValue = this.GroupMembers.length
if (joinedByCurrentUser) {
// this.membersCountToLoad++
members = [this.currentUser, ...this.GroupMembers]
} else {
// this.membersCountToLoad--
members = this.GroupMembers.filter((user) => user.id !== this.currentUser.id)
}
this.GroupMembers = members
}, },
updateJoinLeave({ myRoleInGroup }) { updateJoinLeave({ myRoleInGroup }) {
this.Group[0].myRole = myRoleInGroup this.Group[0].myRole = myRoleInGroup
const currentUserInGroupMembers = this.GroupMembers.find(
(user) => user.id === this.currentUser.id,
)
if (currentUserInGroupMembers) {
currentUserInGroupMembers.myRoleInGroup = myRoleInGroup
} else {
this.$apollo.queries.GroupMembers.refetch() this.$apollo.queries.GroupMembers.refetch()
}
}, },
fetchAllMembers() { fetchAllMembers() {
this.membersCountToLoad = Infinity this.membersCountToLoad = Infinity