Refined list deletion functions and started writing custom mutation for DeleteComment and their tests

This commit is contained in:
Wolfgang Huß 2019-05-31 15:46:34 +02:00
parent b46016203a
commit 5bec0f1d72
9 changed files with 352 additions and 244 deletions

View File

@ -16,11 +16,15 @@ const isAdmin = rule()(async (parent, args, { user }, info) => {
return user && user.role === 'admin'
})
const isMyOwn = rule({ cache: 'no_cache' })(async (parent, args, context, info) => {
const isMyOwn = rule({
cache: 'no_cache',
})(async (parent, args, context, info) => {
return context.user.id === parent.id
})
const belongsToMe = rule({ cache: 'no_cache' })(async (_, args, context) => {
const belongsToMe = rule({
cache: 'no_cache',
})(async (_, args, context) => {
const {
driver,
user: { id: userId },
@ -32,7 +36,10 @@ const belongsToMe = rule({ cache: 'no_cache' })(async (_, args, context) => {
MATCH (u:User {id: $userId})<-[:NOTIFIED]-(n:Notification {id: $notificationId})
RETURN n
`,
{ userId, notificationId },
{
userId,
notificationId,
},
)
const [notification] = result.records.map(record => {
return record.get('n')
@ -41,12 +48,16 @@ const belongsToMe = rule({ cache: 'no_cache' })(async (_, args, context) => {
return Boolean(notification)
})
const onlyEnabledContent = rule({ cache: 'strict' })(async (parent, args, ctx, info) => {
const onlyEnabledContent = rule({
cache: 'strict',
})(async (parent, args, ctx, info) => {
const { disabled, deleted } = args
return !(disabled || deleted)
})
const isAuthor = rule({ cache: 'no_cache' })(async (parent, args, { user, driver }) => {
const isAuthor = rule({
cache: 'no_cache',
})(async (parent, args, { user, driver }) => {
if (!user) return false
const session = driver.session()
const { id: postId } = args
@ -55,7 +66,9 @@ const isAuthor = rule({ cache: 'no_cache' })(async (parent, args, { user, driver
MATCH (post:Post {id: $postId})<-[:WROTE]-(author)
RETURN author
`,
{ postId },
{
postId,
},
)
const [author] = result.records.map(record => {
return record.get('author')
@ -100,6 +113,7 @@ const permissions = shield({
enable: isModerator,
disable: isModerator,
CreateComment: isAuthenticated,
DeleteComment: isAuthenticated,
// CreateUser: allow,
},
User: {

View File

@ -53,6 +53,11 @@ export default {
)
session.close()
return comment
},
DeleteComment: async (object, params, context, resolveInfo) => {
const socialMedia = await neo4jgraphql(object, params, context, resolveInfo, false)
return comment
},
},

View File

@ -1,3 +1,4 @@
import gql from 'graphql-tag'
import Factory from '../seed/factories'
import { GraphQLClient } from 'graphql-request'
import { host, login } from '../jest/helpers'
@ -5,6 +6,7 @@ import { host, login } from '../jest/helpers'
const factory = Factory()
let client
let createCommentVariables
let deleteCommentVariables
let createPostVariables
let createCommentVariablesSansPostId
let createCommentVariablesWithNonExistentPost
@ -21,22 +23,22 @@ afterEach(async () => {
})
describe('CreateComment', () => {
const createCommentMutation = `
mutation($postId: ID, $content: String!) {
CreateComment(postId: $postId, content: $content) {
id
content
const createCommentMutation = gql`
mutation($postId: ID, $content: String!) {
CreateComment(postId: $postId, content: $content) {
id
content
}
}
}
`
const createPostMutation = `
mutation($id: ID!, $title: String!, $content: String!) {
CreatePost(id: $id, title: $title, content: $content) {
id
const createPostMutation = gql`
mutation($id: ID!, $title: String!, $content: String!) {
CreatePost(id: $id, title: $title, content: $content) {
id
}
}
}
`
const commentQueryForPostId = `
const commentQueryForPostId = gql`
query($content: String) {
Comment(content: $content) {
postId
@ -59,8 +61,13 @@ describe('CreateComment', () => {
describe('authenticated', () => {
let headers
beforeEach(async () => {
headers = await login({ email: 'test@example.org', password: '1234' })
client = new GraphQLClient(host, { headers })
headers = await login({
email: 'test@example.org',
password: '1234',
})
client = new GraphQLClient(host, {
headers,
})
createCommentVariables = {
postId: 'p1',
content: "I'm authorised to comment",
@ -96,7 +103,15 @@ describe('CreateComment', () => {
}
}`)
expect(User).toEqual([{ comments: [{ content: "I'm authorised to comment" }] }])
expect(User).toEqual([
{
comments: [
{
content: "I'm authorised to comment",
},
],
},
])
})
it('throw an error if an empty string is sent from the editor as content', async () => {
@ -186,7 +201,204 @@ describe('CreateComment', () => {
commentQueryForPostId,
commentQueryVariablesByContent,
)
expect(Comment).toEqual([{ postId: null }])
expect(Comment).toEqual([
{
postId: null,
},
])
})
})
})
// describe('DeleteComment', () => {
// const createCommentMutation = gql `
// mutation($postId: ID, $content: String!) {
// CreateComment(postId: $postId, content: $content) {
// id
// content
// }
// }
// `
// const deleteCommentMutation = gql `
// mutation($id: ID!) {
// DeleteComment(id: $id) {
// id
// content
// }
// }
// `
// const createPostMutation = gql `
// mutation($id: ID!, $title: String!, $content: String!) {
// CreatePost(id: $id, title: $title, content: $content) {
// id
// }
// }
// `
// const commentQueryForPostId = gql `
// query($content: String) {
// Comment(content: $content) {
// postId
// }
// }
// `
// describe('unauthenticated', () => {
// it('throws authorization error', async () => {
// deleteCommentVariables = {
// id: 'c1',
// }
// client = new GraphQLClient(host)
// await expect(client.request(deleteCommentMutation, deleteCommentVariables)).rejects.toThrow(
// 'Not Authorised',
// )
// })
// })
// // describe('authenticated', () => {
// // let headers
// // beforeEach(async () => {
// // headers = await login({
// // email: 'test@example.org',
// // password: '1234'
// // })
// // client = new GraphQLClient(host, {
// // headers
// // })
// // createCommentVariables = {
// // postId: 'p1',
// // content: "I'm authorised to comment",
// // }
// // createPostVariables = {
// // id: 'p1',
// // title: 'post to comment on',
// // content: 'please comment on me',
// // }
// // await client.request(createPostMutation, createPostVariables)
// // })
// // it('creates a comment', async () => {
// // const expected = {
// // CreateComment: {
// // content: "I'm authorised to comment",
// // },
// // }
// // await expect(
// // client.request(createCommentMutation, createCommentVariables),
// // ).resolves.toMatchObject(expected)
// // })
// // it('assigns the authenticated user as author', async () => {
// // await client.request(createCommentMutation, createCommentVariables)
// // const {
// // User
// // } = await client.request(`{
// // User(email: "test@example.org") {
// // comments {
// // content
// // }
// // }
// // }`)
// // expect(User).toEqual([{
// // comments: [{
// // content: "I'm authorised to comment"
// // }]
// // }])
// // })
// // it('throw an error if an empty string is sent from the editor as content', async () => {
// // createCommentVariables = {
// // postId: 'p1',
// // content: '<p></p>',
// // }
// // await expect(client.request(createCommentMutation, createCommentVariables)).rejects.toThrow(
// // 'Comment must be at least 1 character long!',
// // )
// // })
// // it('throws an error if a comment sent from the editor does not contain a single character', async () => {
// // createCommentVariables = {
// // postId: 'p1',
// // content: '<p> </p>',
// // }
// // await expect(client.request(createCommentMutation, createCommentVariables)).rejects.toThrow(
// // 'Comment must be at least 1 character long!',
// // )
// // })
// // it('throws an error if postId is sent as an empty string', async () => {
// // createCommentVariables = {
// // postId: 'p1',
// // content: '',
// // }
// // await expect(client.request(createCommentMutation, createCommentVariables)).rejects.toThrow(
// // 'Comment must be at least 1 character long!',
// // )
// // })
// // it('throws an error if content is sent as an string of empty characters', async () => {
// // createCommentVariables = {
// // postId: 'p1',
// // content: ' ',
// // }
// // await expect(client.request(createCommentMutation, createCommentVariables)).rejects.toThrow(
// // 'Comment must be at least 1 character long!',
// // )
// // })
// // it('throws an error if postId is sent as an empty string', async () => {
// // createCommentVariablesSansPostId = {
// // postId: '',
// // content: 'this comment should not be created',
// // }
// // await expect(
// // client.request(createCommentMutation, createCommentVariablesSansPostId),
// // ).rejects.toThrow('Comment cannot be created without a post!')
// // })
// // it('throws an error if postId is sent as an string of empty characters', async () => {
// // createCommentVariablesSansPostId = {
// // postId: ' ',
// // content: 'this comment should not be created',
// // }
// // await expect(
// // client.request(createCommentMutation, createCommentVariablesSansPostId),
// // ).rejects.toThrow('Comment cannot be created without a post!')
// // })
// // it('throws an error if the post does not exist in the database', async () => {
// // createCommentVariablesWithNonExistentPost = {
// // postId: 'p2',
// // content: "comment should not be created cause the post doesn't exist",
// // }
// // await expect(
// // client.request(createCommentMutation, createCommentVariablesWithNonExistentPost),
// // ).rejects.toThrow('Comment cannot be created without a post!')
// // })
// // it('does not create the comment with the postId as an attribute', async () => {
// // const commentQueryVariablesByContent = {
// // content: "I'm authorised to comment",
// // }
// // await client.request(createCommentMutation, createCommentVariables)
// // const {
// // Comment
// // } = await client.request(
// // commentQueryForPostId,
// // commentQueryVariablesByContent,
// // )
// // expect(Comment).toEqual([{
// // postId: null
// // }])
// // })
// // })
// })

View File

@ -1,8 +1,4 @@
import {
config,
shallowMount,
createLocalVue
} from '@vue/test-utils'
import { config, shallowMount, createLocalVue } from '@vue/test-utils'
import Comment from './Comment.vue'
import Vuex from 'vuex'
import Styleguide from '@human-connection/styleguide'
@ -25,6 +21,13 @@ describe('Comment.vue', () => {
propsData = {}
mocks = {
$t: jest.fn(),
$toast: {
success: jest.fn(),
error: jest.fn(),
},
$apollo: {
mutate: jest.fn().mockResolvedValue(),
},
}
getters = {
'auth/user': () => {
@ -76,12 +79,9 @@ describe('Comment.vue', () => {
})
it('translates a placeholder', () => {
/* const wrapper = */
Wrapper()
wrapper = Wrapper()
const calls = mocks.$t.mock.calls
const expected = [
['comment.content.unavailable-placeholder']
]
const expected = [['comment.content.unavailable-placeholder']]
expect(calls).toEqual(expect.arrayContaining(expected))
})
@ -121,10 +121,6 @@ describe('Comment.vue', () => {
expect(wrapper.emitted().deleteComment.length).toBe(1)
})
// it('does not go to index (main) page', () => {
// expect(mocks.$router.history.push).not.toHaveBeenCalled()
// })
it('does call mutation', () => {
expect(mocks.$apollo.mutate).toHaveBeenCalledTimes(1)
})

View File

@ -1,18 +1,32 @@
<template>
<dropdown class="content-menu"
:placement="placement" offset="5">
<template slot="default"
slot-scope="{toggleMenu}">
<slot name="button"
:toggleMenu="toggleMenu">
<ds-button class="content-menu-trigger"
size="small" ghost @click.prevent="toggleMenu">
<dropdown
class="content-menu"
:placement="placement"
offset="5"
>
<template
slot="default"
slot-scope="{toggleMenu}"
>
<slot
name="button"
:toggleMenu="toggleMenu"
>
<ds-button
class="content-menu-trigger"
size="small"
ghost
@click.prevent="toggleMenu"
>
<ds-icon name="ellipsis-v" />
</ds-button>
</slot>
</template>
<div slot="popover"
slot-scope="{toggleMenu}" class="content-menu-popover">
<div
slot="popover"
slot-scope="{toggleMenu}"
class="content-menu-popover"
>
<ds-menu :routes="routes">
<ds-menu-item
slot="menuitem"

View File

@ -22,7 +22,7 @@
v-for="(comment, index) in comments"
:key="comment.id"
:comment="comment"
@deleteComment="deleteComment(index)"
@deleteComment="comments.splice(index, 1)"
/>
</div>
<hc-empty
@ -65,9 +65,6 @@ export default {
this.$apollo.queries.Post.refetch()
}
},
deleteComment(index) {
this.comments.splice(index, 1)
},
},
apollo: {
Post: {

View File

@ -1,10 +1,7 @@
<template>
<div>
<ds-flex
v-if="Post && Post.length"
:width="{ base: '100%' }"
gutter="base"
>
<ds-flex v-if="Post && Post.length"
:width="{ base: '100%' }" gutter="base">
<hc-post-card
v-for="(post, index) in uniq(Post)"
:key="post.id"
@ -23,11 +20,8 @@
primary
/>
</no-ssr>
<hc-load-more
v-if="true"
:loading="$apollo.loading"
@click="showMoreContributions"
/>
<hc-load-more v-if="true"
:loading="$apollo.loading" @click="showMoreContributions" />
</div>
</template>
@ -90,7 +84,8 @@ export default {
this.Post = this.Post.filter(post => {
return post.id !== postId
})
// Ideal solution:
// Why "uniq(Post)" is used in the array for list creation?
// Ideal solution here:
// this.Post.splice(index, 1)
},
},

View File

@ -1,11 +1,13 @@
<template>
<ds-card>
<h2 style="margin-bottom: .2em;">
Mehr Informationen
</h2>
Mehr Informationen
</h2>
<p>Hier findest du weitere infos zum Thema.</p>
<ds-space />
<h3><ds-icon name="compass" /> Themenkategorien</h3>
<h3>
<ds-icon name="compass" />Themenkategorien
</h3>
<div class="tags">
<ds-icon
v-for="category in post.categories"
@ -16,39 +18,34 @@
/>&nbsp;
<!--<ds-tag
v-for="category in post.categories"
:key="category.id"><ds-icon :name="category.icon" /> {{ category.name }}</ds-tag>-->
:key="category.id"><ds-icon :name="category.icon" /> {{ category.name }}</ds-tag>-->
</div>
<template v-if="post.tags && post.tags.length">
<h3><ds-icon name="tags" /> Schlagwörter</h3>
<h3>
<ds-icon name="tags" />Schlagwörter
</h3>
<div class="tags">
<ds-tag
v-for="tag in post.tags"
:key="tag.id"
>
<ds-icon name="tag" /> {{ tag.name }}
<ds-tag v-for="tag in post.tags"
:key="tag.id">
<ds-icon name="tag" />
{{ tag.name }}
</ds-tag>
</div>
</template>
<h3>Verwandte Beiträge</h3>
<ds-section style="margin: 0 -1.5rem; padding: 1.5rem;">
<ds-flex
v-if="post.relatedContributions && post.relatedContributions.length"
gutter="small"
>
<ds-flex v-if="post.relatedContributions && post.relatedContributions.length"
gutter="small">
<hc-post-card
v-for="(relatedPost, index) in post.relatedContributions"
:key="relatedPost.id"
:post="relatedPost"
:width="{ base: '100%', lg: 1 }"
@deletePost="deletePost(index)"
@deletePost="post.relatedContributions.splice(index, 1)"
/>
</ds-flex>
<hc-empty
v-else
margin="large"
icon="file"
message="No related Posts"
/>
<hc-empty v-else
margin="large" icon="file" message="No related Posts" />
</ds-section>
<ds-space margin-bottom="large" />
</ds-card>
@ -73,11 +70,6 @@ export default {
return this.Post ? this.Post[0] || {} : {}
},
},
methods: {
deletePost(index) {
this.post.relatedContributions.splice(index, 1)
},
},
apollo: {
Post: {
query() {

View File

@ -3,27 +3,15 @@
<ds-card v-if="user && user.image">
<p>PROFILE IMAGE</p>
</ds-card>
<ds-space />
<ds-flex
v-if="user"
:width="{ base: '100%' }"
gutter="base"
>
<ds-space/>
<ds-flex v-if="user" :width="{ base: '100%' }" gutter="base">
<ds-flex-item :width="{ base: '100%', sm: 2, md: 2, lg: 1 }">
<ds-card
:class="{'disabled-content': user.disabled}"
style="position: relative; height: auto;"
>
<hc-upload
v-if="myProfile"
:user="user"
/>
<hc-avatar
v-else
:user="user"
class="profile-avatar"
size="x-large"
/>
<hc-upload v-if="myProfile" :user="user"/>
<hc-avatar v-else :user="user" class="profile-avatar" size="x-large"/>
<no-ssr>
<content-menu
placement="bottom-end"
@ -35,54 +23,32 @@
/>
</no-ssr>
<ds-space margin="small">
<ds-heading
tag="h3"
align="center"
no-margin
>
{{ userName }}
</ds-heading>
<ds-text
v-if="user.location"
align="center"
color="soft"
size="small"
>
<ds-icon name="map-marker" />
<ds-heading tag="h3" align="center" no-margin>{{ userName }}</ds-heading>
<ds-text v-if="user.location" align="center" color="soft" size="small">
<ds-icon name="map-marker"/>
{{ user.location.name }}
</ds-text>
<ds-text
align="center"
color="soft"
size="small"
>
{{ $t('profile.memberSince') }} {{ user.createdAt | date('MMMM yyyy') }}
</ds-text>
>{{ $t('profile.memberSince') }} {{ user.createdAt | date('MMMM yyyy') }}</ds-text>
</ds-space>
<ds-space
v-if="user.badges && user.badges.length"
margin="x-small"
>
<hc-badges :badges="user.badges" />
<ds-space v-if="user.badges && user.badges.length" margin="x-small">
<hc-badges :badges="user.badges"/>
</ds-space>
<ds-flex>
<ds-flex-item>
<no-ssr>
<ds-number :label="$t('profile.followers')">
<hc-count-to
slot="count"
:end-val="followedByCount"
/>
<hc-count-to slot="count" :end-val="followedByCount"/>
</ds-number>
</no-ssr>
</ds-flex-item>
<ds-flex-item>
<no-ssr>
<ds-number :label="$t('profile.following')">
<hc-count-to
slot="count"
:end-val="Number(user.followingCount) || 0"
/>
<hc-count-to slot="count" :end-val="Number(user.followingCount) || 0"/>
</ds-number>
</no-ssr>
</ds-flex-item>
@ -98,136 +64,69 @@
</ds-space>
<template v-if="user.about">
<hr>
<ds-space
margin-top="small"
margin-bottom="small"
>
<ds-text
color="soft"
size="small"
>
{{ user.about }}
</ds-text>
<ds-space margin-top="small" margin-bottom="small">
<ds-text color="soft" size="small">{{ user.about }}</ds-text>
</ds-space>
</template>
</ds-card>
<ds-space />
<ds-heading
tag="h3"
soft
style="text-align: center; margin-bottom: 10px;"
>
Netzwerk
</ds-heading>
<ds-space/>
<ds-heading tag="h3" soft style="text-align: center; margin-bottom: 10px;">Netzwerk</ds-heading>
<ds-card style="position: relative; height: auto;">
<ds-space
v-if="user.following && user.following.length"
margin="x-small"
>
<ds-text
tag="h5"
color="soft"
>
Wem folgt {{ userName | truncate(15) }}?
</ds-text>
<ds-space v-if="user.following && user.following.length" margin="x-small">
<ds-text tag="h5" color="soft">Wem folgt {{ userName | truncate(15) }}?</ds-text>
</ds-space>
<template v-if="user.following && user.following.length">
<ds-space
v-for="follow in uniq(user.following)"
:key="follow.id"
margin="x-small"
>
<ds-space v-for="follow in uniq(user.following)" :key="follow.id" margin="x-small">
<!-- TODO: find better solution for rendering errors -->
<no-ssr>
<user
:user="follow"
:trunc="15"
/>
<user :user="follow" :trunc="15"/>
</no-ssr>
</ds-space>
<ds-space
v-if="user.followingCount - user.following.length"
margin="small"
>
<ds-space v-if="user.followingCount - user.following.length" margin="small">
<ds-text
size="small"
color="softer"
>
und {{ user.followingCount - user.following.length }} weitere
</ds-text>
>und {{ user.followingCount - user.following.length }} weitere</ds-text>
</ds-space>
</template>
<template v-else>
<p style="text-align: center; opacity: .5;">
{{ userName }} folgt niemandem
</p>
<p style="text-align: center; opacity: .5;">{{ userName }} folgt niemandem</p>
</template>
</ds-card>
<ds-space />
<ds-space/>
<ds-card style="position: relative; height: auto;">
<ds-space
v-if="user.followedBy && user.followedBy.length"
margin="x-small"
>
<ds-text
tag="h5"
color="soft"
>
Wer folgt {{ userName | truncate(15) }}?
</ds-text>
<ds-space v-if="user.followedBy && user.followedBy.length" margin="x-small">
<ds-text tag="h5" color="soft">Wer folgt {{ userName | truncate(15) }}?</ds-text>
</ds-space>
<template v-if="user.followedBy && user.followedBy.length">
<ds-space
v-for="follow in uniq(user.followedBy)"
:key="follow.id"
margin="x-small"
>
<ds-space v-for="follow in uniq(user.followedBy)" :key="follow.id" margin="x-small">
<!-- TODO: find better solution for rendering errors -->
<no-ssr>
<user
:user="follow"
:trunc="15"
/>
<user :user="follow" :trunc="15"/>
</no-ssr>
</ds-space>
<ds-space
v-if="user.followedByCount - user.followedBy.length"
margin="small"
>
<ds-space v-if="user.followedByCount - user.followedBy.length" margin="small">
<ds-text
size="small"
color="softer"
>
und {{ user.followedByCount - user.followedBy.length }} weitere
</ds-text>
>und {{ user.followedByCount - user.followedBy.length }} weitere</ds-text>
</ds-space>
</template>
<template v-else>
<p style="text-align: center; opacity: .5;">
niemand folgt {{ userName }}
</p>
<p style="text-align: center; opacity: .5;">niemand folgt {{ userName }}</p>
</template>
</ds-card>
<ds-space
v-if="user.socialMedia && user.socialMedia.length"
margin="large"
>
<ds-space v-if="user.socialMedia && user.socialMedia.length" margin="large">
<ds-card style="position: relative; height: auto;">
<ds-space margin="x-small">
<ds-text
tag="h5"
color="soft"
>
{{ $t('profile.socialMedia') }} {{ user.name | truncate(15) }}?
</ds-text>
>{{ $t('profile.socialMedia') }} {{ user.name | truncate(15) }}?</ds-text>
<template>
<ds-space
v-for="link in socialMediaLinks"
:key="link.username"
margin="x-small"
>
<ds-space v-for="link in socialMediaLinks" :key="link.username" margin="x-small">
<a :href="link.url">
<ds-avatar :image="link.favicon" />
<ds-avatar :image="link.favicon"/>
{{ 'link.username' }}
</a>
</ds-space>
@ -237,10 +136,7 @@
</ds-space>
</ds-flex-item>
<ds-flex-item :width="{ base: '100%', sm: 3, md: 5, lg: 3 }">
<ds-flex
:width="{ base: '100%' }"
gutter="small"
>
<ds-flex :width="{ base: '100%' }" gutter="small">
<ds-flex-item class="profile-top-navigation">
<ds-card class="ds-tab-nav">
<ds-flex>
@ -249,10 +145,7 @@
<!-- TODO: find better solution for rendering errors -->
<no-ssr>
<ds-number :label="$t('common.post', null, user.contributionsCount)">
<hc-count-to
slot="count"
:end-val="user.contributionsCount"
/>
<hc-count-to slot="count" :end-val="user.contributionsCount"/>
</ds-number>
</no-ssr>
</ds-space>
@ -299,23 +192,16 @@
:key="post.id"
:post="post"
:width="{ base: '100%', md: '100%', xl: '50%' }"
@deletePost="deletePost(index)"
@deletePost="user.contributions.splice(index, 1)"
/>
</template>
<template v-else>
<ds-flex-item :width="{ base: '100%' }">
<hc-empty
margin="xx-large"
icon="file"
/>
<hc-empty margin="xx-large" icon="file"/>
</ds-flex-item>
</template>
</ds-flex>
<hc-load-more
v-if="hasMore"
:loading="$apollo.loading"
@click="showMoreContributions"
/>
<hc-load-more v-if="hasMore" :loading="$apollo.loading" @click="showMoreContributions"/>
</ds-flex-item>
</ds-flex>
</div>
@ -440,9 +326,6 @@ export default {
fetchPolicy: 'cache-and-network',
})
},
deletePost(index) {
this.user.contributions.splice(index, 1)
},
},
apollo: {
User: {