mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-13 07:46:06 +00:00
resolve conflicts
This commit is contained in:
ogerly
commit
f6de01e821
@ -161,15 +161,17 @@ export const groupQuery = gql`
|
||||
description
|
||||
groupType
|
||||
actionRadius
|
||||
myRole
|
||||
categories {
|
||||
id
|
||||
slug
|
||||
name
|
||||
icon
|
||||
}
|
||||
# avatar # test this as result
|
||||
avatar {
|
||||
url
|
||||
}
|
||||
# locationName # test this as result
|
||||
myRole
|
||||
}
|
||||
}
|
||||
`
|
||||
|
||||
@ -31,7 +31,9 @@ export default {
|
||||
return resolve(root, args, context, info)
|
||||
},
|
||||
UpdateGroup: async (resolve, root, args, context, info) => {
|
||||
if (args.name) {
|
||||
args.slug = args.slug || (await uniqueSlug(args.name, isUniqueFor(context, 'Group')))
|
||||
}
|
||||
return resolve(root, args, context, info)
|
||||
},
|
||||
CreatePost: async (resolve, root, args, context, info) => {
|
||||
@ -39,6 +41,7 @@ export default {
|
||||
return resolve(root, args, context, info)
|
||||
},
|
||||
UpdatePost: async (resolve, root, args, context, info) => {
|
||||
// TODO: is this absolutely correct, see condition in 'UpdateGroup' above? may it works accidentally, because args.slug is always send?
|
||||
args.slug = args.slug || (await uniqueSlug(args.title, isUniqueFor(context, 'Post')))
|
||||
return resolve(root, args, context, info)
|
||||
},
|
||||
|
||||
@ -137,6 +137,7 @@ export default {
|
||||
const { categoryIds } = params
|
||||
const { id: groupId, avatar: avatarInput } = params
|
||||
delete params.categoryIds
|
||||
delete params.avatar
|
||||
if (CONFIG.CATEGORIES_ACTIVE && categoryIds) {
|
||||
if (categoryIds.length < CATEGORIES_MIN) {
|
||||
throw new UserInputError('Too view categories!')
|
||||
@ -270,6 +271,9 @@ export default {
|
||||
hasMany: {
|
||||
categories: '-[:CATEGORIZED]->(related:Category)',
|
||||
},
|
||||
hasOne: {
|
||||
avatar: '-[:AVATAR_IMAGE]->(related:Image)',
|
||||
},
|
||||
}),
|
||||
},
|
||||
}
|
||||
|
||||
@ -5,7 +5,7 @@ Then("I should see my comment", () => {
|
||||
.should("contain", "Ocelot.social rocks")
|
||||
.get(".user-teaser span.slug")
|
||||
.should("contain", "@peter-pan") // specific enough
|
||||
.get(".user-avatar img")
|
||||
.get(".profile-avatar img")
|
||||
.should("have.attr", "src")
|
||||
.and("contain", 'https://') // some url
|
||||
.get(".user-teaser > .info > .text")
|
||||
|
||||
@ -4,5 +4,5 @@ Then("I cannot upload a picture", () => {
|
||||
cy.get(".base-card")
|
||||
.children()
|
||||
.should("not.have.id", "customdropzone")
|
||||
.should("have.class", "user-avatar");
|
||||
.should("have.class", "profile-avatar");
|
||||
});
|
||||
@ -9,7 +9,7 @@ Then("I should be able to change my profile picture", () => {
|
||||
{ subjectType: "drag-n-drop", force: true }
|
||||
);
|
||||
});
|
||||
cy.get(".profile-avatar img")
|
||||
cy.get(".profile-page-avatar img")
|
||||
.should("have.attr", "src")
|
||||
.and("contains", "onourjourney");
|
||||
cy.contains(".iziToast-message", "Upload successful")
|
||||
|
||||
@ -42,9 +42,9 @@ describe('AvatarMenu.vue', () => {
|
||||
wrapper = Wrapper()
|
||||
})
|
||||
|
||||
it('renders the UserAvatar component', () => {
|
||||
it('renders the ProfileAvatar component', () => {
|
||||
wrapper.find('.avatar-menu-trigger').trigger('click')
|
||||
expect(wrapper.find('.user-avatar').exists()).toBe(true)
|
||||
expect(wrapper.find('.profile-avatar').exists()).toBe(true)
|
||||
})
|
||||
|
||||
describe('given a userName', () => {
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
"
|
||||
@click.prevent="toggleMenu"
|
||||
>
|
||||
<user-avatar :user="user" size="small" />
|
||||
<profile-avatar :profile="user" size="small" />
|
||||
<base-icon class="dropdown-arrow" name="angle-down" />
|
||||
</a>
|
||||
</template>
|
||||
@ -50,12 +50,12 @@
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import Dropdown from '~/components/Dropdown'
|
||||
import UserAvatar from '~/components/_new/generic/UserAvatar/UserAvatar'
|
||||
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Dropdown,
|
||||
UserAvatar,
|
||||
ProfileAvatar,
|
||||
},
|
||||
props: {
|
||||
placement: { type: String, default: 'top-end' },
|
||||
@ -130,7 +130,7 @@ export default {
|
||||
align-items: center;
|
||||
padding-left: $space-xx-small;
|
||||
|
||||
> .user-avatar {
|
||||
> .profile-avatar {
|
||||
margin-right: $space-xx-small;
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@ import ContributionForm from './ContributionForm.vue'
|
||||
import Vuex from 'vuex'
|
||||
import PostMutations from '~/graphql/PostMutations.js'
|
||||
|
||||
import ImageUploader from '~/components/ImageUploader/ImageUploader'
|
||||
import ImageUploader from '~/components/Uploader/ImageUploader'
|
||||
import MutationObserver from 'mutation-observer'
|
||||
|
||||
global.MutationObserver = MutationObserver
|
||||
|
||||
@ -83,7 +83,7 @@ import { mapGetters } from 'vuex'
|
||||
import HcEditor from '~/components/Editor/Editor'
|
||||
import PostMutations from '~/graphql/PostMutations.js'
|
||||
import CategoriesSelect from '~/components/CategoriesSelect/CategoriesSelect'
|
||||
import ImageUploader from '~/components/ImageUploader/ImageUploader'
|
||||
import ImageUploader from '~/components/Uploader/ImageUploader'
|
||||
import links from '~/constants/links.js'
|
||||
import PageParamsLink from '~/components/_new/features/PageParamsLink/PageParamsLink.vue'
|
||||
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import { shallowMount } from '@vue/test-utils'
|
||||
import Vue from 'vue'
|
||||
import Upload from '.'
|
||||
import AvatarUploader from './AvatarUploader'
|
||||
|
||||
const localVue = global.localVue
|
||||
|
||||
describe('Upload', () => {
|
||||
describe('AvatarUploader', () => {
|
||||
let wrapper
|
||||
|
||||
const mocks = {
|
||||
@ -26,14 +26,14 @@ describe('Upload', () => {
|
||||
}
|
||||
|
||||
const propsData = {
|
||||
user: {
|
||||
profile: {
|
||||
avatar: { url: '/api/generic.jpg' },
|
||||
},
|
||||
}
|
||||
|
||||
beforeEach(() => {
|
||||
jest.useFakeTimers()
|
||||
wrapper = shallowMount(Upload, { localVue, propsData, mocks })
|
||||
wrapper = shallowMount(AvatarUploader, { localVue, propsData, mocks })
|
||||
})
|
||||
|
||||
afterEach(() => {
|
||||
@ -10,8 +10,8 @@
|
||||
>
|
||||
<div class="dz-message" @mouseover="hover = true" @mouseleave="hover = false">
|
||||
<slot></slot>
|
||||
<div class="hc-attachments-upload-area">
|
||||
<div class="hc-drag-marker">
|
||||
<div class="avatar-attachments-upload-area">
|
||||
<div class="avatar-drag-marker">
|
||||
<base-icon v-if="hover" name="image" />
|
||||
</div>
|
||||
</div>
|
||||
@ -21,14 +21,15 @@
|
||||
</template>
|
||||
<script>
|
||||
import vueDropzone from 'nuxt-dropzone'
|
||||
import { updateUserMutation } from '~/graphql/User.js'
|
||||
|
||||
export default {
|
||||
name: 'AvatarUploader',
|
||||
components: {
|
||||
vueDropzone,
|
||||
},
|
||||
props: {
|
||||
user: { type: Object, default: null },
|
||||
profile: { type: Object, required: true },
|
||||
updateMutation: { type: Object, required: true },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@ -43,7 +44,7 @@ export default {
|
||||
},
|
||||
computed: {
|
||||
avatarUrl() {
|
||||
const { avatar } = this.user
|
||||
const { avatar } = this.profile
|
||||
return avatar && avatar.url
|
||||
},
|
||||
},
|
||||
@ -68,16 +69,16 @@ export default {
|
||||
const avatarUpload = file[0]
|
||||
this.$apollo
|
||||
.mutate({
|
||||
mutation: updateUserMutation(),
|
||||
mutation: this.updateMutation,
|
||||
variables: {
|
||||
avatar: {
|
||||
upload: avatarUpload,
|
||||
},
|
||||
id: this.user.id,
|
||||
id: this.profile.id,
|
||||
},
|
||||
})
|
||||
.then(() => {
|
||||
this.$toast.success(this.$t('user.avatar.submitted'))
|
||||
this.$toast.success(this.$t('profile.avatar.submitted'))
|
||||
})
|
||||
.catch((error) => this.$toast.error(error.message))
|
||||
},
|
||||
@ -115,7 +116,7 @@ export default {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hc-attachments-upload-area {
|
||||
.avatar-attachments-upload-area {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -123,11 +124,11 @@ export default {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hc-attachments-upload-button {
|
||||
.avatar-attachments-upload-button {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.hc-drag-marker {
|
||||
.avatar-drag-marker {
|
||||
position: relative;
|
||||
width: 122px;
|
||||
height: 122px;
|
||||
@ -165,7 +166,7 @@ export default {
|
||||
border-radius: 100%;
|
||||
border: 1px dashed hsl(0, 0%, 25%);
|
||||
}
|
||||
.hc-attachments-upload-area:hover & {
|
||||
.avatar-attachments-upload-area:hover & {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@ -1,11 +1,11 @@
|
||||
<template>
|
||||
<div class="user-teaser" v-if="displayAnonymous">
|
||||
<user-avatar v-if="showAvatar" size="small" />
|
||||
<profile-avatar v-if="showAvatar" size="small" />
|
||||
<span class="info anonymous">{{ $t('profile.userAnonym') }}</span>
|
||||
</div>
|
||||
<div v-else :class="[{ 'disabled-content': user.disabled }]" placement="top-start">
|
||||
<nuxt-link :to="userLink" :class="['user-teaser']">
|
||||
<user-avatar v-if="showAvatar" :user="user" size="small" />
|
||||
<profile-avatar v-if="showAvatar" :profile="user" size="small" />
|
||||
<div class="info">
|
||||
<span class="text">
|
||||
<span class="slug">{{ userSlug }}</span>
|
||||
@ -26,13 +26,13 @@
|
||||
import { mapGetters } from 'vuex'
|
||||
|
||||
import HcRelativeDateTime from '~/components/RelativeDateTime'
|
||||
import UserAvatar from '~/components/_new/generic/UserAvatar/UserAvatar'
|
||||
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
|
||||
|
||||
export default {
|
||||
name: 'UserTeaser',
|
||||
components: {
|
||||
HcRelativeDateTime,
|
||||
UserAvatar,
|
||||
ProfileAvatar,
|
||||
},
|
||||
props: {
|
||||
user: { type: Object, default: null },
|
||||
@ -88,7 +88,7 @@ export default {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
> .user-avatar {
|
||||
> .profile-avatar {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
import { mount } from '@vue/test-utils'
|
||||
import UserAvatar from './UserAvatar.vue'
|
||||
import ProfileAvatar from './ProfileAvatar'
|
||||
import BaseIcon from '~/components/_new/generic/BaseIcon/BaseIcon'
|
||||
|
||||
const localVue = global.localVue
|
||||
|
||||
describe('UserAvatar.vue', () => {
|
||||
describe('ProfileAvatar', () => {
|
||||
let propsData, wrapper
|
||||
beforeEach(() => {
|
||||
propsData = {}
|
||||
@ -12,7 +12,7 @@ describe('UserAvatar.vue', () => {
|
||||
})
|
||||
|
||||
const Wrapper = () => {
|
||||
return mount(UserAvatar, { propsData, localVue })
|
||||
return mount(ProfileAvatar, { propsData, localVue })
|
||||
}
|
||||
|
||||
it('renders no image', () => {
|
||||
@ -23,39 +23,39 @@ describe('UserAvatar.vue', () => {
|
||||
expect(wrapper.find(BaseIcon).exists()).toBe(true)
|
||||
})
|
||||
|
||||
describe('given a user', () => {
|
||||
describe('given a profile', () => {
|
||||
describe('with no image', () => {
|
||||
beforeEach(() => {
|
||||
propsData = {
|
||||
user: {
|
||||
profile: {
|
||||
name: 'Matt Rider',
|
||||
},
|
||||
}
|
||||
wrapper = Wrapper()
|
||||
})
|
||||
|
||||
describe('no user name', () => {
|
||||
describe('no profile name', () => {
|
||||
it('renders an icon', () => {
|
||||
propsData = { user: { name: null } }
|
||||
propsData = { profile: { name: null } }
|
||||
wrapper = Wrapper()
|
||||
expect(wrapper.find(BaseIcon).exists()).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe("user name is 'Anonymous'", () => {
|
||||
describe("profile name is 'Anonymous'", () => {
|
||||
it('renders an icon', () => {
|
||||
propsData = { user: { name: 'Anonymous' } }
|
||||
propsData = { profile: { name: 'Anonymous' } }
|
||||
wrapper = Wrapper()
|
||||
expect(wrapper.find(BaseIcon).exists()).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
it('displays user initials', () => {
|
||||
it('displays profile initials', () => {
|
||||
expect(wrapper.find('.initials').text()).toEqual('MR')
|
||||
})
|
||||
|
||||
it('displays no more than 3 initials', () => {
|
||||
propsData = { user: { name: 'Ana Paula Nunes Marques' } }
|
||||
propsData = { profile: { name: 'Ana Paula Nunes Marques' } }
|
||||
wrapper = Wrapper()
|
||||
expect(wrapper.find('.initials').text()).toEqual('APN')
|
||||
})
|
||||
@ -64,7 +64,7 @@ describe('UserAvatar.vue', () => {
|
||||
describe('with a relative avatar url', () => {
|
||||
beforeEach(() => {
|
||||
propsData = {
|
||||
user: {
|
||||
profile: {
|
||||
name: 'Not Anonymous',
|
||||
avatar: {
|
||||
url: '/avatar.jpg',
|
||||
@ -82,7 +82,7 @@ describe('UserAvatar.vue', () => {
|
||||
describe('with an absolute avatar url', () => {
|
||||
beforeEach(() => {
|
||||
propsData = {
|
||||
user: {
|
||||
profile: {
|
||||
name: 'Not Anonymous',
|
||||
avatar: {
|
||||
url: 'https://s3.amazonaws.com/uifaces/faces/twitter/sawalazar/128.jpg',
|
||||
@ -1,7 +1,7 @@
|
||||
import { storiesOf } from '@storybook/vue'
|
||||
import { withA11y } from '@storybook/addon-a11y'
|
||||
import StoryRouter from 'storybook-vue-router'
|
||||
import UserAvatar from '~/components/_new/generic/UserAvatar/UserAvatar'
|
||||
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
|
||||
import helpers from '~/storybook/helpers'
|
||||
import { user } from '~/components/UserTeaser/UserTeaser.story.js'
|
||||
import imageFile from './storybook/critical-avatar-white-background.png'
|
||||
@ -22,56 +22,56 @@ const userWithAvatar = {
|
||||
name: 'Jochen Image',
|
||||
avatar: { url: imageFile },
|
||||
}
|
||||
storiesOf('UserAvatar', module)
|
||||
storiesOf('ProfileAvatar', module)
|
||||
.addDecorator(withA11y)
|
||||
.addDecorator(helpers.layout)
|
||||
.addDecorator(StoryRouter())
|
||||
.add('normal, with image', () => ({
|
||||
components: { UserAvatar },
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithAvatar,
|
||||
}),
|
||||
template: '<user-avatar :user="user" />',
|
||||
template: '<profile-avatar :profile="user" />',
|
||||
}))
|
||||
.add('normal without image, anonymous user', () => ({
|
||||
components: { UserAvatar },
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: anonymousUser,
|
||||
}),
|
||||
template: '<user-avatar :user="user" />',
|
||||
template: '<profile-avatar :profile="user" />',
|
||||
}))
|
||||
.add('normal without image, user initials', () => ({
|
||||
components: { UserAvatar },
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithoutAvatar,
|
||||
}),
|
||||
template: '<user-avatar :user="user" />',
|
||||
template: '<profile-avatar :profile="user" />',
|
||||
}))
|
||||
.add('small, with image', () => ({
|
||||
components: { UserAvatar },
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithAvatar,
|
||||
}),
|
||||
template: '<user-avatar :user="user" size="small"/>',
|
||||
template: '<profile-avatar :profile="user" size="small"/>',
|
||||
}))
|
||||
.add('small', () => ({
|
||||
components: { UserAvatar },
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithoutAvatar,
|
||||
}),
|
||||
template: '<user-avatar :user="user" size="small"/>',
|
||||
template: '<profile-avatar :profile="user" size="small"/>',
|
||||
}))
|
||||
.add('large, with image', () => ({
|
||||
components: { UserAvatar },
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithAvatar,
|
||||
}),
|
||||
template: '<user-avatar :user="user" size="large"/>',
|
||||
template: '<profile-avatar :profile="user" size="large"/>',
|
||||
}))
|
||||
.add('large', () => ({
|
||||
components: { UserAvatar },
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithoutAvatar,
|
||||
}),
|
||||
template: '<user-avatar :user="user" size="large"/>',
|
||||
template: '<profile-avatar :profile="user" size="large"/>',
|
||||
}))
|
||||
@ -1,14 +1,14 @@
|
||||
<template>
|
||||
<div :class="['user-avatar', size && `--${this.size}`, !isAvatar && '--no-image']">
|
||||
<div :class="['profile-avatar', size && `--${this.size}`, !isAvatar && '--no-image']">
|
||||
<!-- '--no-image' is neccessary, because otherwise we still have a little unwanted boarder araund the image for images with white backgrounds -->
|
||||
<span class="initials">{{ userInitials }}</span>
|
||||
<span class="initials">{{ profileInitials }}</span>
|
||||
<base-icon v-if="isAnonymous" name="eye-slash" />
|
||||
<img
|
||||
v-if="isAvatar"
|
||||
:src="user.avatar | proxyApiUrl"
|
||||
:src="profile.avatar | proxyApiUrl"
|
||||
class="image"
|
||||
:alt="user.name"
|
||||
:title="user.name"
|
||||
:alt="profile.name"
|
||||
:title="profile.name"
|
||||
@error="$event.target.style.display = 'none'"
|
||||
/>
|
||||
</div>
|
||||
@ -16,7 +16,7 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'UserAvatar',
|
||||
name: 'ProfileAvatar',
|
||||
props: {
|
||||
size: {
|
||||
type: String,
|
||||
@ -25,30 +25,30 @@ export default {
|
||||
return value.match(/(small|large)/)
|
||||
},
|
||||
},
|
||||
user: {
|
||||
profile: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
isAnonymous() {
|
||||
return !this.user || !this.user.name || this.user.name.toLowerCase() === 'anonymous'
|
||||
return !this.profile || !this.profile.name || this.profile.name.toLowerCase() === 'anonymous'
|
||||
},
|
||||
isAvatar() {
|
||||
// TODO may we could test as well if the image is reachable? otherwise the background gets white and the initails can not be read
|
||||
return this.user && this.user.avatar
|
||||
return this.profile && this.profile.avatar
|
||||
},
|
||||
userInitials() {
|
||||
profileInitials() {
|
||||
if (this.isAnonymous) return ''
|
||||
|
||||
return this.user.name.match(/\b\w/g).join('').substring(0, 3).toUpperCase()
|
||||
return this.profile.name.match(/\b\w/g).join('').substring(0, 3).toUpperCase()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.user-avatar {
|
||||
.profile-avatar {
|
||||
position: relative;
|
||||
height: $size-avatar-base;
|
||||
width: $size-avatar-base;
|
||||
|
Before Width: | Height: | Size: 242 KiB After Width: | Height: | Size: 242 KiB |
@ -12,6 +12,7 @@ export const createGroupMutation = gql`
|
||||
$groupType: GroupType!
|
||||
$actionRadius: GroupActionRadius!
|
||||
$categoryIds: [ID]
|
||||
$locationName: String
|
||||
) {
|
||||
CreateGroup(
|
||||
id: $id
|
||||
@ -22,6 +23,7 @@ export const createGroupMutation = gql`
|
||||
groupType: $groupType
|
||||
actionRadius: $actionRadius
|
||||
categoryIds: $categoryIds
|
||||
locationName: $locationName
|
||||
) {
|
||||
id
|
||||
name
|
||||
@ -34,6 +36,13 @@ export const createGroupMutation = gql`
|
||||
description
|
||||
groupType
|
||||
actionRadius
|
||||
categories {
|
||||
id
|
||||
slug
|
||||
name
|
||||
icon
|
||||
}
|
||||
# locationName # test this as result
|
||||
myRole
|
||||
}
|
||||
}
|
||||
@ -86,6 +95,28 @@ export const updateGroupMutation = gql`
|
||||
}
|
||||
`
|
||||
|
||||
export const joinGroupMutation = gql`
|
||||
mutation ($groupId: ID!, $userId: ID!) {
|
||||
JoinGroup(groupId: $groupId, userId: $userId) {
|
||||
id
|
||||
name
|
||||
slug
|
||||
myRoleInGroup
|
||||
}
|
||||
}
|
||||
`
|
||||
|
||||
export const changeGroupMemberRoleMutation = gql`
|
||||
mutation ($groupId: ID!, $userId: ID!, $roleInGroup: GroupMemberRole!) {
|
||||
ChangeGroupMemberRole(groupId: $groupId, userId: $userId, roleInGroup: $roleInGroup) {
|
||||
id
|
||||
name
|
||||
slug
|
||||
myRoleInGroup
|
||||
}
|
||||
}
|
||||
`
|
||||
|
||||
// ------ queries
|
||||
|
||||
export const groupQuery = gql`
|
||||
@ -130,15 +161,37 @@ export const groupQuery = gql`
|
||||
description
|
||||
groupType
|
||||
actionRadius
|
||||
<<<<<<< HEAD
|
||||
myRole
|
||||
=======
|
||||
>>>>>>> 5059-epic-groups
|
||||
categories {
|
||||
id
|
||||
slug
|
||||
name
|
||||
icon
|
||||
}
|
||||
<<<<<<< HEAD
|
||||
# avatar # test this as result
|
||||
# locationName # test this as result
|
||||
=======
|
||||
avatar {
|
||||
url
|
||||
}
|
||||
# locationName # test this as result
|
||||
myRole
|
||||
}
|
||||
}
|
||||
`
|
||||
|
||||
export const groupMembersQuery = gql`
|
||||
query ($id: ID!, $first: Int, $offset: Int, $orderBy: [_UserOrdering], $filter: _UserFilter) {
|
||||
GroupMembers(id: $id, first: $first, offset: $offset, orderBy: $orderBy, filter: $filter) {
|
||||
id
|
||||
name
|
||||
slug
|
||||
myRoleInGroup
|
||||
>>>>>>> 5059-epic-groups
|
||||
}
|
||||
}
|
||||
`
|
||||
|
||||
@ -336,15 +336,16 @@
|
||||
"placeholder": "Schreib etwas Inspirierendes …"
|
||||
},
|
||||
"error-pages": {
|
||||
"403-default": "Kein Zugang zu dieser Seite",
|
||||
"404-default": "Diese Seite konnte nicht gefunden werden",
|
||||
"500-default": "Internal Server Error",
|
||||
"503-default": "Dienst steht nicht zur Verfügung",
|
||||
"back-to-index": "Zurück zur Startseite",
|
||||
"cannot-edit-post": "Dieser Beitrag kann nicht editiert werden",
|
||||
"default": "Ein Fehler ist aufgetreten",
|
||||
"post-not-found": "Dieser Beitrag konnte nicht gefunden werden",
|
||||
"profile-not-found": "Dieses Profil konnte nicht gefunden werden"
|
||||
"403-default": "Kein Zugang zu dieser Seite!",
|
||||
"404-default": "Diese Seite konnte nicht gefunden werden!",
|
||||
"500-default": "Internal Server Error!",
|
||||
"503-default": "Dienst steht nicht zur Verfügung!",
|
||||
"back-to-index": "Zurück zur Startseite!",
|
||||
"cannot-edit-post": "Dieser Beitrag kann nicht editiert werden!",
|
||||
"default": "Ein Fehler ist aufgetreten!",
|
||||
"group-not-found": "Dieses Gruppenprofil konnte nicht gefunden werden!",
|
||||
"post-not-found": "Dieser Beitrag konnte nicht gefunden werden!",
|
||||
"profile-not-found": "Dieses Profil konnte nicht gefunden werden!"
|
||||
},
|
||||
"filter-menu": {
|
||||
"all": "Alle",
|
||||
@ -526,10 +527,15 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": "Erfolgreich hochgeladen!"
|
||||
},
|
||||
"commented": "Kommentiert",
|
||||
"follow": "Folgen",
|
||||
"followers": "Folgen",
|
||||
"following": "Folge Ich",
|
||||
"groupGoal": "Ziel:",
|
||||
"groupSince": "Gründung",
|
||||
"invites": {
|
||||
"description": "Zur Einladung die E-Mail-Adresse hier eintragen.",
|
||||
"emailPlaceholder": "E-Mail-Adresse für die Einladung",
|
||||
@ -828,10 +834,5 @@
|
||||
"newTermsAndConditions": "Neue Nutzungsbedingungen",
|
||||
"termsAndConditionsNewConfirm": "Ich habe die neuen Nutzungsbedingungen durchgelesen und stimme zu.",
|
||||
"termsAndConditionsNewConfirmText": "Bitte lies Dir die neuen Nutzungsbedingungen jetzt durch!"
|
||||
},
|
||||
"user": {
|
||||
"avatar": {
|
||||
"submitted": "Erfolgreich hochgeladen!"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -336,15 +336,16 @@
|
||||
"placeholder": "Leave your inspirational thoughts …"
|
||||
},
|
||||
"error-pages": {
|
||||
"403-default": "Not authorized to this page",
|
||||
"404-default": "This page could not be found",
|
||||
"500-default": "Internal Server Error",
|
||||
"503-default": "Service Unavailable",
|
||||
"back-to-index": "Back to index page",
|
||||
"cannot-edit-post": "This post cannot be edited",
|
||||
"default": "An error occurred",
|
||||
"post-not-found": "This post could not be found",
|
||||
"profile-not-found": "This profile could not be found"
|
||||
"403-default": "Not authorized to this page!",
|
||||
"404-default": "This page could not be found!",
|
||||
"500-default": "Internal Server Error!",
|
||||
"503-default": "Service Unavailable!",
|
||||
"back-to-index": "Back to index page!",
|
||||
"cannot-edit-post": "This post cannot be edited!",
|
||||
"default": "An error occurred!",
|
||||
"group-not-found": "This group profile could not be found!",
|
||||
"post-not-found": "This post could not be found!",
|
||||
"profile-not-found": "This profile could not be found!"
|
||||
},
|
||||
"filter-menu": {
|
||||
"all": "All",
|
||||
@ -526,10 +527,15 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": "Upload successful!"
|
||||
},
|
||||
"commented": "Commented",
|
||||
"follow": "Follow",
|
||||
"followers": "Followers",
|
||||
"following": "Following",
|
||||
"groupGoal": "Goal:",
|
||||
"groupSince": "Foundation",
|
||||
"invites": {
|
||||
"description": "Enter their e-mail address for invitation.",
|
||||
"emailPlaceholder": "E-mail to invite",
|
||||
@ -828,10 +834,5 @@
|
||||
"newTermsAndConditions": "New Terms and Conditions",
|
||||
"termsAndConditionsNewConfirm": "I have read and agree to the new terms of conditions.",
|
||||
"termsAndConditionsNewConfirmText": "Please read the new terms of use now!"
|
||||
},
|
||||
"user": {
|
||||
"avatar": {
|
||||
"submitted": "Upload successful!"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -435,6 +435,9 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": "Carga con éxito"
|
||||
},
|
||||
"commented": "Comentado",
|
||||
"follow": "Seguir",
|
||||
"followers": "Seguidores",
|
||||
@ -715,10 +718,5 @@
|
||||
"newTermsAndConditions": "Nuevos términos de uso",
|
||||
"termsAndConditionsNewConfirm": "He leído y acepto los nuevos términos de uso.",
|
||||
"termsAndConditionsNewConfirmText": "¡Por favor, lea los nuevos términos de uso ahora!"
|
||||
},
|
||||
"user": {
|
||||
"avatar": {
|
||||
"submitted": "Carga con éxito"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -423,6 +423,9 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": "Téléchargement réussi"
|
||||
},
|
||||
"commented": "Commentais",
|
||||
"follow": "Suivre",
|
||||
"followers": "Suiveurs",
|
||||
@ -683,10 +686,5 @@
|
||||
"newTermsAndConditions": "Nouvelles conditions générales",
|
||||
"termsAndConditionsNewConfirm": "J'ai lu et accepté les nouvelles conditions générales.",
|
||||
"termsAndConditionsNewConfirmText": "Veuillez lire les nouvelles conditions d'utilisation dès maintenant !"
|
||||
},
|
||||
"user": {
|
||||
"avatar": {
|
||||
"submitted": "Téléchargement réussi"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -376,6 +376,9 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": null
|
||||
},
|
||||
"commented": "Commentato",
|
||||
"follow": "Seguire",
|
||||
"followers": "Seguenti",
|
||||
@ -633,10 +636,5 @@
|
||||
"newTermsAndConditions": "Nuovi Termini e Condizioni",
|
||||
"termsAndConditionsNewConfirm": "Ho letto e accetto le nuove condizioni generali di contratto.",
|
||||
"termsAndConditionsNewConfirmText": "Si prega di leggere le nuove condizioni d'uso ora!"
|
||||
},
|
||||
"user": {
|
||||
"avatar": {
|
||||
"submitted": null
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -100,6 +100,9 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": null
|
||||
},
|
||||
"follow": "Volgen",
|
||||
"followers": "Volgelingen",
|
||||
"following": "Volgt",
|
||||
|
||||
@ -208,6 +208,9 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": "Przesłano pomyślnie"
|
||||
},
|
||||
"commented": "Skomentuj",
|
||||
"follow": "Obserwuj",
|
||||
"followers": "Obserwujący",
|
||||
@ -356,10 +359,5 @@
|
||||
"taxident": "Numer identyfikacyjny podatku od wartości dodanej zgodnie z § 27 a Ustawa o podatku od wartości dodanej (Niemcy)",
|
||||
"termsAc": "Warunki użytkowania",
|
||||
"tribunal": "sąd rejestrowy"
|
||||
},
|
||||
"user": {
|
||||
"avatar": {
|
||||
"submitted": "Przesłano pomyślnie"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -412,6 +412,9 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": "Carregado com sucesso!"
|
||||
},
|
||||
"commented": "Comentou",
|
||||
"follow": "Seguir",
|
||||
"followers": "Seguidores",
|
||||
@ -668,10 +671,5 @@
|
||||
"newTermsAndConditions": "Novos Termos e Condições",
|
||||
"termsAndConditionsNewConfirm": "Eu li e concordo com os novos termos de condições.",
|
||||
"termsAndConditionsNewConfirmText": "Por favor, leia os novos termos de uso agora!"
|
||||
},
|
||||
"user": {
|
||||
"avatar": {
|
||||
"submitted": "Carregado com sucesso!"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -449,6 +449,9 @@
|
||||
}
|
||||
},
|
||||
"profile": {
|
||||
"avatar": {
|
||||
"submitted": "Успешная загрузка!"
|
||||
},
|
||||
"commented": "Прокомментированные",
|
||||
"follow": "Подписаться",
|
||||
"followers": "Подписчики",
|
||||
@ -729,10 +732,5 @@
|
||||
"newTermsAndConditions": "Новые условия и положения",
|
||||
"termsAndConditionsNewConfirm": "Я прочитал(а) и согласен(на) с новыми условиями.",
|
||||
"termsAndConditionsNewConfirmText": "Пожалуйста, ознакомьтесь с новыми условиями использования!"
|
||||
},
|
||||
"user": {
|
||||
"avatar": {
|
||||
"submitted": "Успешная загрузка!"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
33
webapp/pages/group/_id.spec.js
Normal file
33
webapp/pages/group/_id.spec.js
Normal file
@ -0,0 +1,33 @@
|
||||
import { config, mount } from '@vue/test-utils'
|
||||
import _id from './_id.vue'
|
||||
|
||||
const localVue = global.localVue
|
||||
|
||||
config.stubs['nuxt-child'] = '<span class="nuxt-child"><slot /></span>'
|
||||
|
||||
describe('Group profile _id.vue', () => {
|
||||
let wrapper
|
||||
let Wrapper
|
||||
let mocks
|
||||
|
||||
beforeEach(() => {
|
||||
mocks = {}
|
||||
})
|
||||
|
||||
describe('mount', () => {
|
||||
Wrapper = () => {
|
||||
return mount(_id, {
|
||||
mocks,
|
||||
localVue,
|
||||
})
|
||||
}
|
||||
|
||||
beforeEach(() => {
|
||||
wrapper = Wrapper()
|
||||
})
|
||||
|
||||
it('renders', () => {
|
||||
expect(wrapper.findAll('.nuxt-child')).toHaveLength(1)
|
||||
})
|
||||
})
|
||||
})
|
||||
@ -1,9 +1,34 @@
|
||||
<template>
|
||||
<div>
|
||||
_id groupe page
|
||||
<nuxt-link :to="{ name: 'group-create' }">
|
||||
bearbeiten
|
||||
<ds-icon name="ellipsis-v"></ds-icon>
|
||||
</nuxt-link>
|
||||
</div>
|
||||
<nuxt-child />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import gql from 'graphql-tag'
|
||||
import PersistentLinks from '~/mixins/persistentLinks.js'
|
||||
|
||||
const options = {
|
||||
queryId: gql`
|
||||
query ($idOrSlug: ID) {
|
||||
Group(id: $idOrSlug) {
|
||||
id
|
||||
slug
|
||||
}
|
||||
}
|
||||
`,
|
||||
querySlug: gql`
|
||||
query ($idOrSlug: String) {
|
||||
Group(slug: $idOrSlug) {
|
||||
id
|
||||
slug
|
||||
}
|
||||
}
|
||||
`,
|
||||
message: 'error-pages.group-not-found',
|
||||
path: 'group',
|
||||
}
|
||||
const persistentLinks = PersistentLinks(options)
|
||||
|
||||
export default {
|
||||
mixins: [persistentLinks],
|
||||
}
|
||||
</script>
|
||||
|
||||
95
webapp/pages/group/_id/_slug.___spec.js
Normal file
95
webapp/pages/group/_id/_slug.___spec.js
Normal file
@ -0,0 +1,95 @@
|
||||
// import { config, mount } from '@vue/test-utils'
|
||||
// import ProfileSlug from './_slug.vue'
|
||||
|
||||
// const localVue = global.localVue
|
||||
|
||||
// localVue.filter('date', (d) => d)
|
||||
|
||||
// config.stubs['client-only'] = '<span><slot /></span>'
|
||||
// config.stubs['v-popover'] = '<span><slot /></span>'
|
||||
// config.stubs['nuxt-link'] = '<span><slot /></span>'
|
||||
// config.stubs['infinite-loading'] = '<span><slot /></span>'
|
||||
// config.stubs['follow-list'] = '<span><slot /></span>'
|
||||
|
||||
// describe('ProfileSlug', () => {
|
||||
// let wrapper
|
||||
// let Wrapper
|
||||
// let mocks
|
||||
|
||||
// beforeEach(() => {
|
||||
// mocks = {
|
||||
// post: {
|
||||
// id: 'p23',
|
||||
// name: 'It is a post',
|
||||
// },
|
||||
// $t: jest.fn(),
|
||||
// // If you're mocking router, then don't use VueRouter with localVue: https://vue-test-utils.vuejs.org/guides/using-with-vue-router.html
|
||||
// $route: {
|
||||
// params: {
|
||||
// id: '4711',
|
||||
// slug: 'john-doe',
|
||||
// },
|
||||
// },
|
||||
// $router: {
|
||||
// history: {
|
||||
// push: jest.fn(),
|
||||
// },
|
||||
// },
|
||||
// $toast: {
|
||||
// success: jest.fn(),
|
||||
// error: jest.fn(),
|
||||
// },
|
||||
// $apollo: {
|
||||
// loading: false,
|
||||
// mutate: jest.fn().mockResolvedValue(),
|
||||
// },
|
||||
// }
|
||||
// })
|
||||
|
||||
// describe('mount', () => {
|
||||
// Wrapper = () => {
|
||||
// return mount(ProfileSlug, {
|
||||
// mocks,
|
||||
// localVue,
|
||||
// })
|
||||
// }
|
||||
|
||||
// describe('given an authenticated user', () => {
|
||||
// beforeEach(() => {
|
||||
// mocks.$filters = {
|
||||
// removeLinks: (c) => c,
|
||||
// truncate: (a) => a,
|
||||
// }
|
||||
// mocks.$store = {
|
||||
// getters: {
|
||||
// 'auth/isModerator': () => false,
|
||||
// 'auth/user': {
|
||||
// id: 'u23',
|
||||
// },
|
||||
// },
|
||||
// }
|
||||
// })
|
||||
|
||||
// describe('given a user for the profile', () => {
|
||||
// beforeEach(() => {
|
||||
// wrapper = Wrapper()
|
||||
// wrapper.setData({
|
||||
// User: [
|
||||
// {
|
||||
// id: 'u3',
|
||||
// name: 'Bob the builder',
|
||||
// contributionsCount: 6,
|
||||
// shoutedCount: 7,
|
||||
// commentedCount: 8,
|
||||
// },
|
||||
// ],
|
||||
// })
|
||||
// })
|
||||
|
||||
// it('displays name of the user', () => {
|
||||
// expect(wrapper.text()).toContain('Bob the builder')
|
||||
// })
|
||||
// })
|
||||
// })
|
||||
// })
|
||||
// })
|
||||
@ -1,6 +1,452 @@
|
||||
<template>
|
||||
<div>
|
||||
<ds-space />
|
||||
Group Page
|
||||
<ds-flex v-if="group" :width="{ base: '100%' }" gutter="base">
|
||||
<ds-flex-item :width="{ base: '100%', sm: 2, md: 2, lg: 1 }">
|
||||
<base-card
|
||||
:class="{ 'disabled-content': group.disabled }"
|
||||
style="position: relative; height: auto; overflow: visible"
|
||||
>
|
||||
<avatar-uploader
|
||||
v-if="isGroupOwner"
|
||||
:profile="group"
|
||||
:updateMutation="updateGroupMutation"
|
||||
>
|
||||
<profile-avatar :profile="group" class="profile-page-avatar" size="large" />
|
||||
</avatar-uploader>
|
||||
<profile-avatar v-else :profile="group" class="profile-page-avatar" size="large" />
|
||||
<!-- Menu -->
|
||||
<!-- <client-only>
|
||||
<content-menu
|
||||
placement="bottom-end"
|
||||
resource-type="user"
|
||||
:resource="user"
|
||||
:is-owner="isGroupOwner"
|
||||
class="user-content-menu"
|
||||
@mute="muteUser"
|
||||
@unmute="unmuteUser"
|
||||
@block="blockUser"
|
||||
@unblock="unblockUser"
|
||||
@delete="deleteUser"
|
||||
/>
|
||||
</client-only> -->
|
||||
<ds-space margin="small">
|
||||
<ds-heading tag="h3" align="center" no-margin>
|
||||
{{ groupName }}
|
||||
</ds-heading>
|
||||
<ds-text align="center" color="soft">
|
||||
{{ groupSlug }}
|
||||
</ds-text>
|
||||
<!-- <ds-text v-if="user.location" align="center" color="soft" size="small">
|
||||
<base-icon name="map-marker" />
|
||||
{{ user.location.name }}
|
||||
</ds-text> -->
|
||||
<ds-text align="center" color="soft" size="small">
|
||||
{{ $t('profile.groupSince') }} {{ group.createdAt | date('MMMM yyyy') }}
|
||||
</ds-text>
|
||||
</ds-space>
|
||||
<ds-flex>
|
||||
<ds-flex-item>
|
||||
<!-- <client-only>
|
||||
<ds-number :label="$t('profile.followers')">
|
||||
<hc-count-to
|
||||
slot="count"
|
||||
:start-val="followedByCountStartValue"
|
||||
:end-val="user.followedByCount"
|
||||
/>
|
||||
</ds-number>
|
||||
</client-only> -->
|
||||
</ds-flex-item>
|
||||
<ds-flex-item>
|
||||
<!-- <client-only>
|
||||
<ds-number :label="$t('profile.following')">
|
||||
<hc-count-to slot="count" :end-val="user.followingCount" />
|
||||
</ds-number>
|
||||
</client-only> -->
|
||||
</ds-flex-item>
|
||||
</ds-flex>
|
||||
<div v-if="!isGroupMember" class="action-buttons">
|
||||
<!-- <base-button v-if="user.isBlocked" @click="unblockUser(user)">
|
||||
{{ $t('settings.blocked-users.unblock') }}
|
||||
</base-button>
|
||||
<base-button v-if="user.isMuted" @click="unmuteUser(user)">
|
||||
{{ $t('settings.muted-users.unmute') }}
|
||||
</base-button>
|
||||
<hc-follow-button
|
||||
v-if="!user.isMuted && !user.isBlocked"
|
||||
:follow-id="user.id"
|
||||
:is-followed="user.followedByCurrentUser"
|
||||
@optimistic="optimisticFollow"
|
||||
@update="updateFollow"
|
||||
/> -->
|
||||
</div>
|
||||
<template v-if="group.about">
|
||||
<hr />
|
||||
<ds-space margin-top="small" margin-bottom="small">
|
||||
<ds-text color="soft" size="small" class="hyphenate-text">
|
||||
{{ $t('profile.groupGoal') }} {{ group.about }}
|
||||
</ds-text>
|
||||
</ds-space>
|
||||
</template>
|
||||
</base-card>
|
||||
<ds-space />
|
||||
<ds-heading tag="h3" soft style="text-align: center; margin-bottom: 10px">
|
||||
{{ $t('profile.network.title') }}
|
||||
</ds-heading>
|
||||
<!-- <follow-list
|
||||
:loading="$apollo.loading"
|
||||
:user="user"
|
||||
type="followedBy"
|
||||
@fetchAllConnections="fetchAllConnections"
|
||||
/>
|
||||
<ds-space />
|
||||
<follow-list
|
||||
:loading="$apollo.loading"
|
||||
:user="user"
|
||||
type="following"
|
||||
@fetchAllConnections="fetchAllConnections"
|
||||
/> -->
|
||||
<!-- <social-media :user-name="groupName" :user="user" /> -->
|
||||
</ds-flex-item>
|
||||
|
||||
<ds-flex-item :width="{ base: '100%', sm: 3, md: 5, lg: 3 }">
|
||||
<masonry-grid>
|
||||
<!-- TapNavigation -->
|
||||
<!-- <tab-navigation :tabs="tabOptions" :activeTab="tabActive" @switch-tab="handleTab" /> -->
|
||||
|
||||
<!-- feed -->
|
||||
<ds-grid-item :row-span="2" column-span="fullWidth">
|
||||
<ds-space centered>
|
||||
<nuxt-link :to="{ name: 'post-create' }">
|
||||
<base-button
|
||||
v-if="isGroupMember"
|
||||
v-tooltip="{
|
||||
content: $t('contribution.newPost'),
|
||||
placement: 'left',
|
||||
delay: { show: 500 },
|
||||
}"
|
||||
:path="{ name: 'post-create' }"
|
||||
class="profile-post-add-button"
|
||||
icon="plus"
|
||||
circle
|
||||
filled
|
||||
/>
|
||||
</nuxt-link>
|
||||
</ds-space>
|
||||
</ds-grid-item>
|
||||
|
||||
<template v-if="posts && posts.length">
|
||||
<masonry-grid-item
|
||||
v-for="post in posts"
|
||||
:key="post.id"
|
||||
:imageAspectRatio="post.image && post.image.aspectRatio"
|
||||
>
|
||||
<post-teaser
|
||||
:post="post"
|
||||
:width="{ base: '100%', md: '100%', xl: '50%' }"
|
||||
@removePostFromList="posts = removePostFromList(post, posts)"
|
||||
@pinPost="pinPost(post, refetchPostList)"
|
||||
@unpinPost="unpinPost(post, refetchPostList)"
|
||||
/>
|
||||
</masonry-grid-item>
|
||||
</template>
|
||||
<template v-else-if="$apollo.loading">
|
||||
<ds-grid-item column-span="fullWidth">
|
||||
<ds-space centered>
|
||||
<ds-spinner size="base"></ds-spinner>
|
||||
</ds-space>
|
||||
</ds-grid-item>
|
||||
</template>
|
||||
<template v-else>
|
||||
<ds-grid-item column-span="fullWidth">
|
||||
<hc-empty margin="xx-large" icon="file" />
|
||||
</ds-grid-item>
|
||||
</template>
|
||||
</masonry-grid>
|
||||
<!-- <client-only>
|
||||
<infinite-loading v-if="hasMore" @infinite="showMoreContributions" />
|
||||
</client-only> -->
|
||||
</ds-flex-item>
|
||||
</ds-flex>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uniqBy from 'lodash/uniqBy'
|
||||
import postListActions from '~/mixins/postListActions'
|
||||
import PostTeaser from '~/components/PostTeaser/PostTeaser.vue'
|
||||
// import HcFollowButton from '~/components/FollowButton.vue'
|
||||
// import HcCountTo from '~/components/CountTo.vue'
|
||||
// import HcBadges from '~/components/Badges.vue'
|
||||
// import FollowList from '~/components/features/FollowList/FollowList'
|
||||
import HcEmpty from '~/components/Empty/Empty'
|
||||
// import ContentMenu from '~/components/ContentMenu/ContentMenu'
|
||||
import AvatarUploader from '~/components/Uploader/AvatarUploader'
|
||||
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
|
||||
import MasonryGrid from '~/components/MasonryGrid/MasonryGrid.vue'
|
||||
import MasonryGridItem from '~/components/MasonryGrid/MasonryGridItem.vue'
|
||||
// import TabNavigation from '~/components/_new/generic/TabNavigation/TabNavigation'
|
||||
// import { profilePagePosts } from '~/graphql/PostQuery'
|
||||
import { groupQuery } from '~/graphql/groups'
|
||||
import { updateGroupMutation } from '~/graphql/groups.js'
|
||||
// import { muteUser, unmuteUser } from '~/graphql/settings/MutedUsers'
|
||||
// import { blockUser, unblockUser } from '~/graphql/settings/BlockedUsers'
|
||||
// import UpdateQuery from '~/components/utils/UpdateQuery'
|
||||
// import SocialMedia from '~/components/SocialMedia/SocialMedia'
|
||||
|
||||
// const tabToFilterMapping = ({ tab, id }) => {
|
||||
// return {
|
||||
// post: { author: { id } },
|
||||
// comment: { comments_some: { author: { id } } },
|
||||
// shout: { shoutedBy_some: { id } },
|
||||
// }[tab]
|
||||
// }
|
||||
|
||||
export default {
|
||||
components: {
|
||||
// SocialMedia,
|
||||
PostTeaser,
|
||||
// HcFollowButton,
|
||||
// HcCountTo,
|
||||
// HcBadges,
|
||||
HcEmpty,
|
||||
ProfileAvatar,
|
||||
// ContentMenu,
|
||||
AvatarUploader,
|
||||
MasonryGrid,
|
||||
MasonryGridItem,
|
||||
// FollowList,
|
||||
// TabNavigation,
|
||||
},
|
||||
mixins: [postListActions],
|
||||
transition: {
|
||||
name: 'slide-up',
|
||||
mode: 'out-in',
|
||||
},
|
||||
data() {
|
||||
// const filter = tabToFilterMapping({ tab: 'post', id: this.$route.params.id })
|
||||
return {
|
||||
Group: [],
|
||||
posts: [],
|
||||
hasMore: true,
|
||||
offset: 0,
|
||||
pageSize: 6,
|
||||
tabActive: 'post',
|
||||
// filter,
|
||||
followedByCountStartValue: 0,
|
||||
followedByCount: 7,
|
||||
followingCount: 7,
|
||||
updateGroupMutation,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isGroupOwner() {
|
||||
return this.group.myRole === 'owner'
|
||||
},
|
||||
isGroupMember() {
|
||||
return this.group.myRole
|
||||
},
|
||||
group() {
|
||||
return this.Group ? this.Group[0] : {}
|
||||
},
|
||||
groupName() {
|
||||
const { name } = this.group || {}
|
||||
return name || this.$t('profile.userAnonym')
|
||||
},
|
||||
groupSlug() {
|
||||
const { slug } = this.group || {}
|
||||
return slug && `@${slug}`
|
||||
},
|
||||
// tabOptions() {
|
||||
// return [
|
||||
// {
|
||||
// type: 'post',
|
||||
// title: this.$t('common.post', null, this.user.contributionsCount),
|
||||
// count: this.user.contributionsCount,
|
||||
// disabled: this.user.contributionsCount === 0,
|
||||
// },
|
||||
// {
|
||||
// type: 'comment',
|
||||
// title: this.$t('profile.commented'),
|
||||
// count: this.user.commentedCount,
|
||||
// disabled: this.user.commentedCount === 0,
|
||||
// },
|
||||
// {
|
||||
// type: 'shout',
|
||||
// title: this.$t('profile.shouted'),
|
||||
// count: this.user.shoutedCount,
|
||||
// disabled: this.user.shoutedCount === 0,
|
||||
// },
|
||||
// ]
|
||||
// },
|
||||
},
|
||||
methods: {
|
||||
// handleTab(tab) {
|
||||
// if (this.tabActive !== tab) {
|
||||
// this.tabActive = tab
|
||||
// this.filter = tabToFilterMapping({ tab, id: this.$route.params.id })
|
||||
// this.resetPostList()
|
||||
// }
|
||||
// },
|
||||
uniq(items, field = 'id') {
|
||||
return uniqBy(items, field)
|
||||
},
|
||||
// showMoreContributions($state) {
|
||||
// const { profilePagePosts: PostQuery } = this.$apollo.queries
|
||||
// if (!PostQuery) return // seems this can be undefined on subpages
|
||||
// this.offset += this.pageSize
|
||||
|
||||
// PostQuery.fetchMore({
|
||||
// variables: {
|
||||
// offset: this.offset,
|
||||
// filter: this.filter,
|
||||
// first: this.pageSize,
|
||||
// orderBy: 'createdAt_desc',
|
||||
// },
|
||||
// updateQuery: UpdateQuery(this, { $state, pageKey: 'profilePagePosts' }),
|
||||
// })
|
||||
// },
|
||||
// resetPostList() {
|
||||
// this.offset = 0
|
||||
// this.posts = []
|
||||
// this.hasMore = true
|
||||
// },
|
||||
// refetchPostList() {
|
||||
// this.resetPostList()
|
||||
// this.$apollo.queries.profilePagePosts.refetch()
|
||||
// },
|
||||
// async muteUser(user) {
|
||||
// try {
|
||||
// await this.$apollo.mutate({ mutation: muteUser(), variables: { id: user.id } })
|
||||
// } catch (error) {
|
||||
// this.$toast.error(error.message)
|
||||
// } finally {
|
||||
// this.$apollo.queries.User.refetch()
|
||||
// this.resetPostList()
|
||||
// this.$apollo.queries.profilePagePosts.refetch()
|
||||
// }
|
||||
// },
|
||||
// async unmuteUser(user) {
|
||||
// try {
|
||||
// this.$apollo.mutate({ mutation: unmuteUser(), variables: { id: user.id } })
|
||||
// } catch (error) {
|
||||
// this.$toast.error(error.message)
|
||||
// } finally {
|
||||
// this.$apollo.queries.User.refetch()
|
||||
// this.resetPostList()
|
||||
// this.$apollo.queries.profilePagePosts.refetch()
|
||||
// }
|
||||
// },
|
||||
// async blockUser(user) {
|
||||
// try {
|
||||
// await this.$apollo.mutate({ mutation: blockUser(), variables: { id: user.id } })
|
||||
// } catch (error) {
|
||||
// this.$toast.error(error.message)
|
||||
// } finally {
|
||||
// this.$apollo.queries.User.refetch()
|
||||
// }
|
||||
// },
|
||||
// async unblockUser(user) {
|
||||
// try {
|
||||
// this.$apollo.mutate({ mutation: unblockUser(), variables: { id: user.id } })
|
||||
// } catch (error) {
|
||||
// this.$toast.error(error.message)
|
||||
// } finally {
|
||||
// this.$apollo.queries.User.refetch()
|
||||
// }
|
||||
// },
|
||||
// async deleteUser(userdata) {
|
||||
// this.$store.commit('modal/SET_OPEN', {
|
||||
// name: 'delete',
|
||||
// data: {
|
||||
// userdata: userdata,
|
||||
// },
|
||||
// })
|
||||
// },
|
||||
// optimisticFollow({ followedByCurrentUser }) {
|
||||
// /*
|
||||
// * Note: followedByCountStartValue is updated to avoid counting from 0 when follow/unfollow
|
||||
// */
|
||||
// this.followedByCountStartValue = this.user.followedByCount
|
||||
// const currentUser = this.$store.getters['auth/user']
|
||||
// if (followedByCurrentUser) {
|
||||
// this.user.followedByCount++
|
||||
// this.user.followedBy = [currentUser, ...this.user.followedBy]
|
||||
// } else {
|
||||
// this.user.followedByCount--
|
||||
// this.user.followedBy = this.user.followedBy.filter((user) => user.id !== currentUser.id)
|
||||
// }
|
||||
// this.user.followedByCurrentUser = followedByCurrentUser
|
||||
// },
|
||||
// updateFollow({ followedByCurrentUser, followedBy, followedByCount }) {
|
||||
// this.followedByCountStartValue = this.user.followedByCount
|
||||
// this.user.followedByCount = followedByCount
|
||||
// this.user.followedByCurrentUser = followedByCurrentUser
|
||||
// this.user.followedBy = followedBy
|
||||
// },
|
||||
// fetchAllConnections(type) {
|
||||
// if (type === 'following') this.followingCount = Infinity
|
||||
// if (type === 'followedBy') this.followedByCount = Infinity
|
||||
// },
|
||||
},
|
||||
apollo: {
|
||||
// profilePagePosts: {
|
||||
// query() {
|
||||
// return profilePagePosts(this.$i18n)
|
||||
// },
|
||||
// variables() {
|
||||
// return {
|
||||
// filter: this.filter,
|
||||
// first: this.pageSize,
|
||||
// offset: 0,
|
||||
// orderBy: 'createdAt_desc',
|
||||
// }
|
||||
// },
|
||||
// update({ profilePagePosts }) {
|
||||
// this.posts = profilePagePosts
|
||||
// },
|
||||
// fetchPolicy: 'cache-and-network',
|
||||
// },
|
||||
Group: {
|
||||
query() {
|
||||
// return groupQuery(this.$i18n) // language will be needed for locations
|
||||
return groupQuery
|
||||
},
|
||||
variables() {
|
||||
return {
|
||||
id: this.$route.params.id,
|
||||
// followedByCount: this.followedByCount,
|
||||
// followingCount: this.followingCount,
|
||||
}
|
||||
},
|
||||
fetchPolicy: 'cache-and-network',
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.profile-page-avatar.profile-avatar {
|
||||
margin: auto;
|
||||
margin-top: -60px;
|
||||
}
|
||||
.page-name-profile-id-slug {
|
||||
.ds-flex-item:first-child .content-menu {
|
||||
position: absolute;
|
||||
top: $space-x-small;
|
||||
right: $space-x-small;
|
||||
}
|
||||
}
|
||||
.profile-post-add-button {
|
||||
box-shadow: $box-shadow-x-large;
|
||||
}
|
||||
.action-buttons {
|
||||
margin: $space-small 0;
|
||||
|
||||
> .base-button {
|
||||
display: block;
|
||||
width: 100%;
|
||||
margin-bottom: $space-x-small;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -7,10 +7,10 @@
|
||||
:class="{ 'disabled-content': user.disabled }"
|
||||
style="position: relative; height: auto; overflow: visible"
|
||||
>
|
||||
<hc-upload v-if="myProfile" :user="user">
|
||||
<user-avatar :user="user" class="profile-avatar" size="large"></user-avatar>
|
||||
</hc-upload>
|
||||
<user-avatar v-else :user="user" class="profile-avatar" size="large" />
|
||||
<avatar-uploader v-if="myProfile" :profile="user" :updateMutation="updateUserMutation">
|
||||
<profile-avatar :profile="user" class="profile-page-avatar" size="large" />
|
||||
</avatar-uploader>
|
||||
<profile-avatar v-else :profile="user" class="profile-page-avatar" size="large" />
|
||||
<!-- Menu -->
|
||||
<client-only>
|
||||
<content-menu
|
||||
@ -178,13 +178,14 @@ import HcBadges from '~/components/Badges.vue'
|
||||
import FollowList from '~/components/features/FollowList/FollowList'
|
||||
import HcEmpty from '~/components/Empty/Empty'
|
||||
import ContentMenu from '~/components/ContentMenu/ContentMenu'
|
||||
import HcUpload from '~/components/Upload'
|
||||
import UserAvatar from '~/components/_new/generic/UserAvatar/UserAvatar'
|
||||
import AvatarUploader from '~/components/Uploader/AvatarUploader'
|
||||
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
|
||||
import MasonryGrid from '~/components/MasonryGrid/MasonryGrid.vue'
|
||||
import MasonryGridItem from '~/components/MasonryGrid/MasonryGridItem.vue'
|
||||
import TabNavigation from '~/components/_new/generic/TabNavigation/TabNavigation'
|
||||
import { profilePagePosts } from '~/graphql/PostQuery'
|
||||
import UserQuery from '~/graphql/User'
|
||||
import { updateUserMutation } from '~/graphql/User.js'
|
||||
import { muteUser, unmuteUser } from '~/graphql/settings/MutedUsers'
|
||||
import { blockUser, unblockUser } from '~/graphql/settings/BlockedUsers'
|
||||
import UpdateQuery from '~/components/utils/UpdateQuery'
|
||||
@ -206,9 +207,9 @@ export default {
|
||||
HcCountTo,
|
||||
HcBadges,
|
||||
HcEmpty,
|
||||
UserAvatar,
|
||||
ProfileAvatar,
|
||||
ContentMenu,
|
||||
HcUpload,
|
||||
AvatarUploader,
|
||||
MasonryGrid,
|
||||
MasonryGridItem,
|
||||
FollowList,
|
||||
@ -232,6 +233,7 @@ export default {
|
||||
followedByCountStartValue: 0,
|
||||
followedByCount: 7,
|
||||
followingCount: 7,
|
||||
updateUserMutation: updateUserMutation(),
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@ -417,7 +419,7 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.profile-avatar.user-avatar {
|
||||
.profile-page-avatar.profile-avatar {
|
||||
margin: auto;
|
||||
margin-top: -60px;
|
||||
}
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
params: { id: scope.row.id, slug: scope.row.slug },
|
||||
}"
|
||||
>
|
||||
<user-avatar :user="scope.row" size="small" />
|
||||
<profile-avatar :profile="scope.row" size="small" />
|
||||
</nuxt-link>
|
||||
</template>
|
||||
<template #name="scope">
|
||||
@ -74,11 +74,11 @@
|
||||
|
||||
<script>
|
||||
import { blockedUsers, unblockUser } from '~/graphql/settings/BlockedUsers'
|
||||
import UserAvatar from '~/components/_new/generic/UserAvatar/UserAvatar'
|
||||
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
UserAvatar,
|
||||
ProfileAvatar,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
params: { id: scope.row.id, slug: scope.row.slug },
|
||||
}"
|
||||
>
|
||||
<user-avatar :user="scope.row" size="small" />
|
||||
<profile-avatar :profile="scope.row" size="small" />
|
||||
</nuxt-link>
|
||||
</template>
|
||||
<template #name="scope">
|
||||
@ -71,11 +71,11 @@
|
||||
|
||||
<script>
|
||||
import { mutedUsers, unmuteUser } from '~/graphql/settings/MutedUsers'
|
||||
import UserAvatar from '~/components/_new/generic/UserAvatar/UserAvatar'
|
||||
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
|
||||
|
||||
export default {
|
||||
components: {
|
||||
UserAvatar,
|
||||
ProfileAvatar,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user