sort categories on group profile

This commit is contained in:
Moriz Wahl 2022-11-28 14:02:37 +01:00
parent ab9b14d756
commit e2ac3ba846
5 changed files with 59 additions and 56 deletions

View File

@ -74,7 +74,7 @@ export default {
return CategoryQuery() return CategoryQuery()
}, },
result({ data: { Category } }) { result({ data: { Category } }) {
this.categories = this.sortCategories(Category, this.$t) this.categories = this.sortCategories(Category)
}, },
}, },
}, },

View File

@ -86,7 +86,7 @@ export default {
}, },
update({ Category }) { update({ Category }) {
if (!Category) return [] if (!Category) return []
this.categories = this.sortCategories(Category, this.$t) this.categories = this.sortCategories(Category)
}, },
fetchPolicy: 'cache-and-network', fetchPolicy: 'cache-and-network',
}, },

View File

@ -1,19 +1,19 @@
export default { export default {
methods: { methods: {
sortCategories(categories, locales) { sortCategories(categories) {
const miscSlug = 'miscellaneous' const miscSlug = 'miscellaneous'
const misc = categories.find((cat) => cat.slug === miscSlug) const misc = categories.find((cat) => cat.slug === miscSlug)
const sortedCategories = categories const sortedCategories = categories
.filter((cat) => cat.slug !== miscSlug) .filter((cat) => cat.slug !== miscSlug)
.sort((a, b) => { .sort((a, b) => {
if ( if (
locales(`contribution.category.name.${a.slug}`) < this.$t(`contribution.category.name.${a.slug}`) <
locales(`contribution.category.name.${b.slug}`) this.$t(`contribution.category.name.${b.slug}`)
) )
return -1 return -1
if ( if (
locales(`contribution.category.name.${a.slug}`) > this.$t(`contribution.category.name.${a.slug}`) >
locales(`contribution.category.name.${b.slug}`) this.$t(`contribution.category.name.${b.slug}`)
) )
return 1 return 1
return 0 return 0

View File

@ -26,10 +26,10 @@
/> />
<!-- TODO: implement later on --> <!-- TODO: implement later on -->
<!-- @mute="muteUser" <!-- @mute="muteUser"
@unmute="unmuteUser" @unmute="unmuteUser"
@block="blockUser" @block="blockUser"
@unblock="unblockUser" @unblock="unblockUser"
@delete="deleteUser" --> @delete="deleteUser" -->
</client-only> </client-only>
<ds-space margin="small"> <ds-space margin="small">
<!-- group name --> <!-- group name -->
@ -65,38 +65,38 @@
</client-only> </client-only>
</ds-flex-item> </ds-flex-item>
<!-- <ds-flex-item> <!-- <ds-flex-item>
<client-only> <client-only>
<ds-number :label="$t('profile.followers')"> <ds-number :label="$t('profile.followers')">
<count-to <count-to
slot="count" slot="count"
:start-val="followedByCountStartValue" :start-val="followedByCountStartValue"
:end-val="user.followedByCount" :end-val="user.followedByCount"
/> />
</ds-number> </ds-number>
</client-only> </client-only>
</ds-flex-item> --> </ds-flex-item> -->
<!-- <ds-flex-item> <!-- <ds-flex-item>
<client-only> <client-only>
<ds-number :label="$t('profile.following')"> <ds-number :label="$t('profile.following')">
<count-to slot="count" :end-val="user.followingCount" /> <count-to slot="count" :end-val="user.followingCount" />
</ds-number> </ds-number>
</client-only> </client-only>
</ds-flex-item> --> </ds-flex-item> -->
</ds-flex> </ds-flex>
<div class="action-buttons"> <div class="action-buttons">
<!-- <base-button v-if="user.isBlocked" @click="unblockUser(user)"> <!-- <base-button v-if="user.isBlocked" @click="unblockUser(user)">
{{ $t('settings.blocked-users.unblock') }} {{ $t('settings.blocked-users.unblock') }}
</base-button> </base-button>
<base-button v-if="user.isMuted" @click="unmuteUser(user)"> <base-button v-if="user.isMuted" @click="unmuteUser(user)">
{{ $t('settings.muted-users.unmute') }} {{ $t('settings.muted-users.unmute') }}
</base-button> </base-button>
<follow-button <follow-button
v-if="!user.isMuted && !user.isBlocked" v-if="!user.isMuted && !user.isBlocked"
:follow-id="user.id" :follow-id="user.id"
:is-followed="user.followedByCurrentUser" :is-followed="user.followedByCurrentUser"
@optimistic="optimisticFollow" @optimistic="optimisticFollow"
@update="updateFollow" @update="updateFollow"
/> --> /> -->
<!-- Group join / leave --> <!-- Group join / leave -->
<join-leave-button <join-leave-button
:group="group || {}" :group="group || {}"
@ -108,7 +108,7 @@
@update="updateJoinLeave" @update="updateJoinLeave"
/> />
<!-- implement: <!-- implement:
v-if="!user.isMuted && !user.isBlocked" --> v-if="!user.isMuted && !user.isBlocked" -->
</div> </div>
<hr /> <hr />
<ds-space margin-top="small" margin-bottom="small"> <ds-space margin-top="small" margin-bottom="small">
@ -161,7 +161,9 @@
<ds-space margin="xx-small" /> <ds-space margin="xx-small" />
<div class="categories"> <div class="categories">
<div <div
v-for="(category, index) in group.categories" v-for="(category, index) in sortCategories(
group && group.categories ? group.categories : [],
)"
:key="category.id" :key="category.id"
align="center" align="center"
> >
@ -211,19 +213,19 @@
@fetchAllProfiles="fetchAllMembers" @fetchAllProfiles="fetchAllMembers"
/> />
<!-- <ds-space /> <!-- <ds-space />
<follow-list <follow-list
:loading="$apollo.loading" :loading="$apollo.loading"
:user="user" :user="user"
type="followedBy" type="followedBy"
@fetchAllConnections="fetchAllConnections" @fetchAllConnections="fetchAllConnections"
/> />
<ds-space /> <ds-space />
<follow-list <follow-list
:loading="$apollo.loading" :loading="$apollo.loading"
:user="user" :user="user"
type="following" type="following"
@fetchAllConnections="fetchAllConnections" @fetchAllConnections="fetchAllConnections"
/> --> /> -->
<!-- <social-media :user-name="groupName" :user="user" /> --> <!-- <social-media :user-name="groupName" :user="user" /> -->
</ds-flex-item> </ds-flex-item>
@ -326,6 +328,7 @@ import MasonryGridItem from '~/components/MasonryGrid/MasonryGridItem.vue'
import PostTeaser from '~/components/PostTeaser/PostTeaser.vue' import PostTeaser from '~/components/PostTeaser/PostTeaser.vue'
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar' import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
import ProfileList from '~/components/features/ProfileList/ProfileList' import ProfileList from '~/components/features/ProfileList/ProfileList'
import SortCategories from '~/mixins/sortCategoriesMixin.js'
// import SocialMedia from '~/components/SocialMedia/SocialMedia' // import SocialMedia from '~/components/SocialMedia/SocialMedia'
// import TabNavigation from '~/components/_new/generic/TabNavigation/TabNavigation' // import TabNavigation from '~/components/_new/generic/TabNavigation/TabNavigation'
@ -356,7 +359,7 @@ export default {
// SocialMedia, // SocialMedia,
// TabNavigation, // TabNavigation,
}, },
mixins: [postListActions], mixins: [postListActions, SortCategories],
transition: { transition: {
name: 'slide-up', name: 'slide-up',
mode: 'out-in', mode: 'out-in',

View File

@ -61,7 +61,7 @@
<ds-space margin="xx-large" /> <ds-space margin="xx-large" />
<ds-space margin="xx-small" /> <ds-space margin="xx-small" />
<hc-category <hc-category
v-for="category in sortCategories(post.categories, $t)" v-for="category in sortCategories(post.categories)"
:key="category.id" :key="category.id"
:icon="category.icon" :icon="category.icon"
:name="$t(`contribution.category.name.${category.slug}`)" :name="$t(`contribution.category.name.${category.slug}`)"