mirror of
https://github.com/IT4Change/Ocelot-Social.git
synced 2025-12-13 07:45:56 +00:00
caeff070b7
* basics to notify a user when a followed user posted * do not notify following user on posts in groups * followig user wrote post notification * notify regular group members when a new post is posted in the group * mute and unmute groups * clean database at end * locale for post in group notification * post in group notification triggers correctly * email settings for post in group * Add mute/unumute group to menu (WIP) * Add mute group functionality (WIP) * Add locales; use mute/unmute mutations, cleanup tests * Overhaul group content menu test * Rename isMuted to isMutedByMe and add it to group query * Add German and English locales * Add spanish translations * Add missing translation keys (with null values) * Remove console statement * Add snapshot * Replace mount by render * Mock Math.random(), add tests for mute/unmute * Use container instead of baseElement for snapshots * fix group slug tests * undo wrong variable naming * rename parameter to groupId of mute/unmute group mutation * rename parameter to groupId of mute/unmute group mutation * only non pending members have access to the comtext menu --------- Co-authored-by: Moriz Wahl <moriz.wahl@gmx.de> Co-authored-by: Ulf Gebhardt <ulf.gebhardt@webcraft-media.de>
120 lines
2.8 KiB
Vue
120 lines
2.8 KiB
Vue
<template>
|
|
<dropdown class="group-content-menu" :placement="placement" offset="5">
|
|
<template #default="{ toggleMenu }">
|
|
<slot name="button" :toggleMenu="toggleMenu">
|
|
<base-button
|
|
icon="ellipsis-v"
|
|
size="small"
|
|
circle
|
|
@click.prevent="toggleMenu()"
|
|
data-test="group-menu-button"
|
|
/>
|
|
</slot>
|
|
</template>
|
|
<template #popover="{ toggleMenu }">
|
|
<div class="group-menu-popover">
|
|
<ds-menu :routes="routes">
|
|
<template #menuitem="item">
|
|
{{ item.parents }}
|
|
<ds-menu-item
|
|
:route="item.route"
|
|
:parents="item.parents"
|
|
@click.stop.prevent="openItem(item.route, toggleMenu)"
|
|
>
|
|
<base-icon :name="item.route.icon" />
|
|
{{ item.route.label }}
|
|
</ds-menu-item>
|
|
</template>
|
|
</ds-menu>
|
|
</div>
|
|
</template>
|
|
</dropdown>
|
|
</template>
|
|
|
|
<script>
|
|
import Dropdown from '~/components/Dropdown'
|
|
|
|
export default {
|
|
name: 'GroupContentMenu',
|
|
components: {
|
|
Dropdown,
|
|
},
|
|
props: {
|
|
usage: {
|
|
type: String,
|
|
required: true,
|
|
validator: (value) => {
|
|
return value.match(/(groupTeaser|groupProfile)/)
|
|
},
|
|
},
|
|
group: { type: Object, required: true },
|
|
placement: { type: String, default: 'bottom-end' },
|
|
},
|
|
computed: {
|
|
routes() {
|
|
const routes = []
|
|
|
|
if (this.usage !== 'groupProfile') {
|
|
routes.push({
|
|
label: this.$t('group.contentMenu.visitGroupPage'),
|
|
icon: 'home',
|
|
path: `/groups/${this.group.id}`,
|
|
params: { id: this.group.id, slug: this.group.slug },
|
|
})
|
|
}
|
|
|
|
if (this.usage === 'groupProfile') {
|
|
if (this.group.isMutedByMe) {
|
|
routes.push({
|
|
label: this.$t('group.contentMenu.unmuteGroup'),
|
|
icon: 'volume-up',
|
|
callback: () => {
|
|
this.$emit('unmute', this.group.id)
|
|
},
|
|
})
|
|
} else {
|
|
routes.push({
|
|
label: this.$t('group.contentMenu.muteGroup'),
|
|
icon: 'volume-off',
|
|
callback: () => {
|
|
this.$emit('mute', this.group.id)
|
|
},
|
|
})
|
|
}
|
|
}
|
|
|
|
if (this.group.myRole === 'owner') {
|
|
routes.push({
|
|
label: this.$t('admin.settings.name'),
|
|
path: `/groups/edit/${this.group.id}`,
|
|
icon: 'edit',
|
|
})
|
|
}
|
|
|
|
return routes
|
|
},
|
|
},
|
|
methods: {
|
|
openItem(route, toggleMenu) {
|
|
if (route.callback) {
|
|
route.callback()
|
|
} else {
|
|
this.$router.push(route)
|
|
}
|
|
toggleMenu()
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.group-menu-popover {
|
|
nav {
|
|
margin-top: -$space-xx-small;
|
|
margin-bottom: -$space-xx-small;
|
|
margin-left: -$space-x-small;
|
|
margin-right: -$space-x-small;
|
|
}
|
|
}
|
|
</style>
|