mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-13 07:46:06 +00:00
4e4eff8dc9
Fixes long comment overflow. There is some underlying problem with flex box and overflows. A better solution could be to use a grid, but this was the fastest I would come up with. Fixes hidden group name appearance
82 lines
2.4 KiB
Vue
82 lines
2.4 KiB
Vue
<template>
|
|
<div>
|
|
<base-card>
|
|
<ds-heading tag="h3">{{ $t('invite-codes.group-invite-links') }}</ds-heading>
|
|
<ds-space margin="large" />
|
|
<invitation-list
|
|
@generate-invite-code="generateGroupInviteCode"
|
|
@invalidate-invite-code="invalidateInviteCode"
|
|
:inviteCodes="group.inviteCodes"
|
|
:copy-message="
|
|
group.groupType === 'hidden'
|
|
? $t('invite-codes.invite-link-message-hidden-group', {
|
|
network: $env.NETWORK_NAME,
|
|
})
|
|
: $t('invite-codes.invite-link-message-group', {
|
|
groupName: group.name,
|
|
network: $env.NETWORK_NAME,
|
|
})
|
|
"
|
|
/>
|
|
</base-card>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import InvitationList from '~/components/_new/features/Invitations/InvitationList.vue'
|
|
import { generateGroupInviteCode, invalidateInviteCode } from '~/graphql/InviteCode'
|
|
|
|
export default {
|
|
components: {
|
|
InvitationList,
|
|
},
|
|
props: {
|
|
group: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
},
|
|
methods: {
|
|
async generateGroupInviteCode(comment) {
|
|
try {
|
|
await this.$apollo.mutate({
|
|
mutation: generateGroupInviteCode(),
|
|
variables: {
|
|
comment,
|
|
groupId: this.group.id,
|
|
},
|
|
update: (_, { data: { generateGroupInviteCode } }) => {
|
|
this.$emit('update-invite-codes', [...this.group.inviteCodes, generateGroupInviteCode])
|
|
},
|
|
})
|
|
this.$toast.success(this.$t('invite-codes.create-success'))
|
|
} catch (error) {
|
|
this.$toast.error(this.$t('invite-codes.create-error', { error: error.message }))
|
|
}
|
|
},
|
|
async invalidateInviteCode(code) {
|
|
try {
|
|
await this.$apollo.mutate({
|
|
mutation: invalidateInviteCode(),
|
|
variables: {
|
|
code,
|
|
},
|
|
update: (_, { data: { _invalidateInviteCode } }) => {
|
|
this.$emit(
|
|
'update-invite-codes',
|
|
this.group.inviteCodes.map((inviteCode) => ({
|
|
...inviteCode,
|
|
isValid: inviteCode.code === code ? false : inviteCode.isValid,
|
|
})),
|
|
)
|
|
},
|
|
})
|
|
this.$toast.success(this.$t('invite-codes.invalidate-success'))
|
|
} catch (error) {
|
|
this.$toast.error(this.$t('invite-codes.invalidate-error', { error: error.message }))
|
|
}
|
|
},
|
|
},
|
|
}
|
|
</script>
|