Merge pull request #1805 from Human-Connection/1754-fix-buggy-profile-page-posts-duplicates

Update profile posts apollo query
This commit is contained in:
mattwr18 2019-10-11 10:05:21 +02:00 committed by GitHub
commit 596b8de615
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 276 additions and 63 deletions

View File

@ -24,10 +24,8 @@ import { gql } from '../jest/helpers'
})
const { mutate } = createTestClient(server)
const f = Factory()
const [Hamburg, Berlin, Germany, Paris, France] = await Promise.all([
f.create('Location', {
factory.create('Location', {
id: 'region.5127278006398860',
name: 'Hamburg',
type: 'region',
@ -42,7 +40,7 @@ import { gql } from '../jest/helpers'
nameNL: 'Hamburg',
namePL: 'Hamburg',
}),
f.create('Location', {
factory.create('Location', {
id: 'region.14880313158564380',
type: 'region',
name: 'Berlin',
@ -57,7 +55,7 @@ import { gql } from '../jest/helpers'
nameNL: 'Berlijn',
namePL: 'Berlin',
}),
f.create('Location', {
factory.create('Location', {
id: 'country.10743216036480410',
name: 'Germany',
type: 'country',
@ -70,7 +68,7 @@ import { gql } from '../jest/helpers'
nameIT: 'Germania',
nameEN: 'Germany',
}),
f.create('Location', {
factory.create('Location', {
id: 'region.9397217726497330',
name: 'Paris',
type: 'region',
@ -85,7 +83,7 @@ import { gql } from '../jest/helpers'
nameNL: 'Parijs',
namePL: 'Paryż',
}),
f.create('Location', {
factory.create('Location', {
id: 'country.9759535382641660',
name: 'France',
type: 'country',
@ -106,27 +104,27 @@ import { gql } from '../jest/helpers'
])
const [racoon, rabbit, wolf, bear, turtle, rhino] = await Promise.all([
f.create('Badge', {
factory.create('Badge', {
id: 'indiegogo_en_racoon',
icon: '/img/badges/indiegogo_en_racoon.svg',
}),
f.create('Badge', {
factory.create('Badge', {
id: 'indiegogo_en_rabbit',
icon: '/img/badges/indiegogo_en_rabbit.svg',
}),
f.create('Badge', {
factory.create('Badge', {
id: 'indiegogo_en_wolf',
icon: '/img/badges/indiegogo_en_wolf.svg',
}),
f.create('Badge', {
factory.create('Badge', {
id: 'indiegogo_en_bear',
icon: '/img/badges/indiegogo_en_bear.svg',
}),
f.create('Badge', {
factory.create('Badge', {
id: 'indiegogo_en_turtle',
icon: '/img/badges/indiegogo_en_turtle.svg',
}),
f.create('Badge', {
factory.create('Badge', {
id: 'indiegogo_en_rhino',
icon: '/img/badges/indiegogo_en_rhino.svg',
}),
@ -141,49 +139,49 @@ import { gql } from '../jest/helpers'
louie,
dagobert,
] = await Promise.all([
f.create('User', {
factory.create('User', {
id: 'u1',
name: 'Peter Lustig',
slug: 'peter-lustig',
role: 'admin',
email: 'admin@example.org',
}),
f.create('User', {
factory.create('User', {
id: 'u2',
name: 'Bob der Baumeister',
slug: 'bob-der-baumeister',
role: 'moderator',
email: 'moderator@example.org',
}),
f.create('User', {
factory.create('User', {
id: 'u3',
name: 'Jenny Rostock',
slug: 'jenny-rostock',
role: 'user',
email: 'user@example.org',
}),
f.create('User', {
factory.create('User', {
id: 'u4',
name: 'Huey',
slug: 'huey',
role: 'user',
email: 'huey@example.org',
}),
f.create('User', {
factory.create('User', {
id: 'u5',
name: 'Dewey',
slug: 'dewey',
role: 'user',
email: 'dewey@example.org',
}),
f.create('User', {
factory.create('User', {
id: 'u6',
name: 'Louie',
slug: 'louie',
role: 'user',
email: 'louie@example.org',
}),
f.create('User', {
factory.create('User', {
id: 'u7',
name: 'Dagobert',
slug: 'dagobert',
@ -226,97 +224,97 @@ import { gql } from '../jest/helpers'
])
await Promise.all([
f.create('Category', {
factory.create('Category', {
id: 'cat1',
name: 'Just For Fun',
slug: 'just-for-fun',
icon: 'smile',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat2',
name: 'Happiness & Values',
slug: 'happiness-values',
icon: 'heart-o',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat3',
name: 'Health & Wellbeing',
slug: 'health-wellbeing',
icon: 'medkit',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat4',
name: 'Environment & Nature',
slug: 'environment-nature',
icon: 'tree',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat5',
name: 'Animal Protection',
slug: 'animal-protection',
icon: 'paw',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat6',
name: 'Human Rights & Justice',
slug: 'human-rights-justice',
icon: 'balance-scale',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat7',
name: 'Education & Sciences',
slug: 'education-sciences',
icon: 'graduation-cap',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat8',
name: 'Cooperation & Development',
slug: 'cooperation-development',
icon: 'users',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat9',
name: 'Democracy & Politics',
slug: 'democracy-politics',
icon: 'university',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat10',
name: 'Economy & Finances',
slug: 'economy-finances',
icon: 'money',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat11',
name: 'Energy & Technology',
slug: 'energy-technology',
icon: 'flash',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat12',
name: 'IT, Internet & Data Privacy',
slug: 'it-internet-data-privacy',
icon: 'mouse-pointer',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat13',
name: 'Art, Culture & Sport',
slug: 'art-culture-sport',
icon: 'paint-brush',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat14',
name: 'Freedom of Speech',
slug: 'freedom-of-speech',
icon: 'bullhorn',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat15',
name: 'Consumption & Sustainability',
slug: 'consumption-sustainability',
icon: 'shopping-cart',
}),
f.create('Category', {
factory.create('Category', {
id: 'cat16',
name: 'Global Peace & Nonviolence',
slug: 'global-peace-nonviolence',
@ -325,16 +323,16 @@ import { gql } from '../jest/helpers'
])
const [environment, nature, democracy, freedom] = await Promise.all([
f.create('Tag', {
factory.create('Tag', {
id: 'Environment',
}),
f.create('Tag', {
factory.create('Tag', {
id: 'Nature',
}),
f.create('Tag', {
factory.create('Tag', {
id: 'Democracy',
}),
f.create('Tag', {
factory.create('Tag', {
id: 'Freedom',
}),
])
@ -684,7 +682,223 @@ import { gql } from '../jest/helpers'
await Promise.all(
[...Array(30).keys()].map(i => {
return f.create('User')
return factory.create('User')
}),
)
await Promise.all(
[...Array(30).keys()].map(() => {
return factory.create('Post', {
author: jennyRostock,
image: faker.image.unsplash.objects(),
})
}),
)
await Promise.all(
[...Array(6).keys()].map(() => {
return factory.create('Comment', {
author: jennyRostock,
postId: 'p2',
})
}),
)
await Promise.all(
[...Array(4).keys()].map(() => {
return factory.create('Comment', {
author: jennyRostock,
postId: 'p15',
})
}),
)
await Promise.all(
[...Array(2).keys()].map(() => {
return factory.create('Comment', {
author: jennyRostock,
postId: 'p4',
})
}),
)
await Promise.all(
[...Array(21).keys()].map(() => {
return factory.create('Post', {
author: peterLustig,
image: faker.image.unsplash.buildings(),
})
}),
)
await Promise.all(
[...Array(3).keys()].map(() => {
return factory.create('Comment', {
author: peterLustig,
postId: 'p4',
})
}),
)
await Promise.all(
[...Array(5).keys()].map(() => {
return factory.create('Comment', {
author: peterLustig,
postId: 'p14',
})
}),
)
await Promise.all(
[...Array(6).keys()].map(() => {
return factory.create('Comment', {
author: peterLustig,
postId: 'p0',
})
}),
)
await Promise.all(
[...Array(11).keys()].map(() => {
return factory.create('Post', {
author: dewey,
image: faker.image.unsplash.food(),
})
}),
)
await Promise.all(
[...Array(7).keys()].map(() => {
return factory.create('Comment', {
author: dewey,
postId: 'p2',
})
}),
)
await Promise.all(
[...Array(5).keys()].map(() => {
return factory.create('Comment', {
author: dewey,
postId: 'p6',
})
}),
)
await Promise.all(
[...Array(2).keys()].map(() => {
return factory.create('Comment', {
author: dewey,
postId: 'p9',
})
}),
)
await Promise.all(
[...Array(16).keys()].map(() => {
return factory.create('Post', {
author: louie,
image: faker.image.unsplash.technology(),
})
}),
)
await Promise.all(
[...Array(4).keys()].map(() => {
return factory.create('Comment', {
author: louie,
postId: 'p1',
})
}),
)
await Promise.all(
[...Array(8).keys()].map(() => {
return factory.create('Comment', {
author: louie,
postId: 'p10',
})
}),
)
await Promise.all(
[...Array(5).keys()].map(() => {
return factory.create('Comment', {
author: louie,
postId: 'p13',
})
}),
)
await Promise.all(
[...Array(45).keys()].map(() => {
return factory.create('Post', {
author: bobDerBaumeister,
image: faker.image.unsplash.people(),
})
}),
)
await Promise.all(
[...Array(2).keys()].map(() => {
return factory.create('Comment', {
author: bobDerBaumeister,
postId: 'p2',
})
}),
)
await Promise.all(
[...Array(3).keys()].map(() => {
return factory.create('Comment', {
author: bobDerBaumeister,
postId: 'p12',
})
}),
)
await Promise.all(
[...Array(7).keys()].map(() => {
return factory.create('Comment', {
author: bobDerBaumeister,
postId: 'p13',
})
}),
)
await Promise.all(
[...Array(8).keys()].map(() => {
return factory.create('Post', {
author: huey,
image: faker.image.unsplash.nature(),
})
}),
)
await Promise.all(
[...Array(6).keys()].map(() => {
return factory.create('Comment', {
author: huey,
postId: 'p0',
})
}),
)
await Promise.all(
[...Array(8).keys()].map(() => {
return factory.create('Comment', {
author: huey,
postId: 'p13',
})
}),
)
await Promise.all(
[...Array(9).keys()].map(() => {
return factory.create('Comment', {
author: huey,
postId: 'p15',
})
}),
)

View File

@ -50,7 +50,7 @@
:infinite-scroll-throttle-delay="800"
:infinite-scroll-immediate-check="true"
>
<hc-load-more v-if="true" :loading="$apollo.loading" @click="showMoreContributions" />
<hc-load-more :loading="$apollo.loading" @click="showMoreContributions" />
</div>
</div>
</template>

View File

@ -139,7 +139,23 @@ describe('ProfileSlug', () => {
wrapper.setData({ posts, hasMore: true })
})
it('displays a "load more" button', () => {
it('does not display a "load more" button', () => {
expect(wrapper.find('.load-more').exists()).toBe(false)
})
})
describe('pagination returned at least as many posts as pageSize', () => {
beforeEach(() => {
const posts = [1, 2, 3, 4, 5, 6].map(id => {
return {
...aPost,
id,
}
})
wrapper.setData({ posts })
})
it('displays "load more" button', () => {
expect(wrapper.find('.load-more').exists()).toBe(true)
})
@ -157,23 +173,6 @@ describe('ProfileSlug', () => {
})
})
})
describe('pagination returned as many posts as available', () => {
beforeEach(() => {
const posts = [1, 2, 3, 4, 5, 6].map(id => {
return {
...aPost,
id,
}
})
wrapper.setData({ posts, hasMore: false })
})
it('displays no "load more" button', () => {
expect(wrapper.find('.load-more').exists()).toBe(false)
})
})
})
})
})

View File

@ -251,7 +251,7 @@
</template>
</masonry-grid>
<div
v-if="hasMore"
v-if="hasMore && posts.length >= pageSize"
v-infinite-scroll="showMoreContributions"
:infinite-scroll-disabled="$apollo.loading"
:infinite-scroll-distance="10"
@ -375,14 +375,14 @@ export default {
showMoreContributions() {
const { Post: 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: this.sorting,
orderBy: 'createdAt_desc',
},
updateQuery: (previousResult, { fetchMoreResult }) => {
if (!fetchMoreResult || fetchMoreResult.Post.length < this.pageSize) {