Make block & mute lists able to load more
This commit is contained in:
parent
eec27700f0
commit
e516eee479
@ -1,9 +1,13 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="list">
|
<div
|
||||||
|
class="list"
|
||||||
|
role="list"
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
v-for="item in items"
|
v-for="item in items"
|
||||||
:key="getKey(item)"
|
:key="getKey(item)"
|
||||||
class="list-item"
|
class="list-item"
|
||||||
|
role="listitem"
|
||||||
>
|
>
|
||||||
<slot
|
<slot
|
||||||
name="item"
|
name="item"
|
||||||
|
@ -9,17 +9,20 @@ import DomainMuteCard from 'src/components/domain_mute_card/domain_mute_card.vue
|
|||||||
import SelectableList from 'src/components/selectable_list/selectable_list.vue'
|
import SelectableList from 'src/components/selectable_list/selectable_list.vue'
|
||||||
import ProgressButton from 'src/components/progress_button/progress_button.vue'
|
import ProgressButton from 'src/components/progress_button/progress_button.vue'
|
||||||
import withSubscription from 'src/components/../hocs/with_subscription/with_subscription'
|
import withSubscription from 'src/components/../hocs/with_subscription/with_subscription'
|
||||||
|
import withLoadMore from 'src/components/../hocs/with_load_more/with_load_more'
|
||||||
import Checkbox from 'src/components/checkbox/checkbox.vue'
|
import Checkbox from 'src/components/checkbox/checkbox.vue'
|
||||||
|
|
||||||
const BlockList = withSubscription({
|
const BlockList = withLoadMore({
|
||||||
fetch: (props, $store) => $store.dispatch('fetchBlocks'),
|
fetch: (props, $store) => $store.dispatch('fetchBlocks'),
|
||||||
select: (props, $store) => get($store.state.users.currentUser, 'blockIds', []),
|
select: (props, $store) => get($store.state.users.currentUser, 'blockIds', []),
|
||||||
|
destroy: () => {},
|
||||||
childPropName: 'items'
|
childPropName: 'items'
|
||||||
})(SelectableList)
|
})(SelectableList)
|
||||||
|
|
||||||
const MuteList = withSubscription({
|
const MuteList = withLoadMore({
|
||||||
fetch: (props, $store) => $store.dispatch('fetchMutes'),
|
fetch: (props, $store) => $store.dispatch('fetchMutes'),
|
||||||
select: (props, $store) => get($store.state.users.currentUser, 'muteIds', []),
|
select: (props, $store) => get($store.state.users.currentUser, 'muteIds', []),
|
||||||
|
destroy: () => {},
|
||||||
childPropName: 'items'
|
childPropName: 'items'
|
||||||
})(SelectableList)
|
})(SelectableList)
|
||||||
|
|
||||||
|
@ -98,7 +98,7 @@ const withLoadMore = ({
|
|||||||
</button>
|
</button>
|
||||||
}
|
}
|
||||||
{!this.error && this.loading && <FAIcon spin icon="circle-notch"/>}
|
{!this.error && this.loading && <FAIcon spin icon="circle-notch"/>}
|
||||||
{!this.error && !this.loading && !this.bottomedOut && <a onClick={this.fetchEntries}>{this.$t('general.more')}</a>}
|
{!this.error && !this.loading && !this.bottomedOut && <a onClick={this.fetchEntries} role="button" tabindex="0">{this.$t('general.more')}</a>}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
@ -195,9 +195,15 @@ export const mutations = {
|
|||||||
state.currentUser.blockIds.push(blockId)
|
state.currentUser.blockIds.push(blockId)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
setBlockIdsMaxId (state, blockIdsMaxId) {
|
||||||
|
state.currentUser.blockIdsMaxId = blockIdsMaxId
|
||||||
|
},
|
||||||
saveMuteIds (state, muteIds) {
|
saveMuteIds (state, muteIds) {
|
||||||
state.currentUser.muteIds = muteIds
|
state.currentUser.muteIds = muteIds
|
||||||
},
|
},
|
||||||
|
setMuteIdsMaxId (state, muteIdsMaxId) {
|
||||||
|
state.currentUser.muteIdsMaxId = muteIdsMaxId
|
||||||
|
},
|
||||||
addMuteId (state, muteId) {
|
addMuteId (state, muteId) {
|
||||||
if (state.currentUser.muteIds.indexOf(muteId) === -1) {
|
if (state.currentUser.muteIds.indexOf(muteId) === -1) {
|
||||||
state.currentUser.muteIds.push(muteId)
|
state.currentUser.muteIds.push(muteId)
|
||||||
@ -320,10 +326,20 @@ const users = {
|
|||||||
.then((inLists) => store.commit('updateUserInLists', { id, inLists }))
|
.then((inLists) => store.commit('updateUserInLists', { id, inLists }))
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
fetchBlocks (store) {
|
fetchBlocks (store, args) {
|
||||||
return store.rootState.api.backendInteractor.fetchBlocks()
|
const { reset } = args || {}
|
||||||
|
|
||||||
|
const maxId = store.state.currentUser.blockIdsMaxId
|
||||||
|
return store.rootState.api.backendInteractor.fetchBlocks({ maxId })
|
||||||
.then((blocks) => {
|
.then((blocks) => {
|
||||||
|
if (reset) {
|
||||||
store.commit('saveBlockIds', map(blocks, 'id'))
|
store.commit('saveBlockIds', map(blocks, 'id'))
|
||||||
|
} else {
|
||||||
|
map(blocks, 'id').map(id => store.commit('addBlockId', id))
|
||||||
|
}
|
||||||
|
if (blocks.length) {
|
||||||
|
store.commit('setBlockIdsMaxId', last(blocks).id)
|
||||||
|
}
|
||||||
store.commit('addNewUsers', blocks)
|
store.commit('addNewUsers', blocks)
|
||||||
return blocks
|
return blocks
|
||||||
})
|
})
|
||||||
@ -346,10 +362,20 @@ const users = {
|
|||||||
editUserNote (store, args) {
|
editUserNote (store, args) {
|
||||||
return editUserNote(store, args)
|
return editUserNote(store, args)
|
||||||
},
|
},
|
||||||
fetchMutes (store) {
|
fetchMutes (store, args) {
|
||||||
return store.rootState.api.backendInteractor.fetchMutes()
|
const { reset } = args || {}
|
||||||
|
|
||||||
|
const maxId = store.state.currentUser.muteIdsMaxId
|
||||||
|
return store.rootState.api.backendInteractor.fetchMutes({ maxId })
|
||||||
.then((mutes) => {
|
.then((mutes) => {
|
||||||
|
if (reset) {
|
||||||
store.commit('saveMuteIds', map(mutes, 'id'))
|
store.commit('saveMuteIds', map(mutes, 'id'))
|
||||||
|
} else {
|
||||||
|
map(mutes, 'id').map(id => store.commit('addMuteId', id))
|
||||||
|
}
|
||||||
|
if (mutes.length) {
|
||||||
|
store.commit('setMuteIdsMaxId', last(mutes).id)
|
||||||
|
}
|
||||||
store.commit('addNewUsers', mutes)
|
store.commit('addNewUsers', mutes)
|
||||||
return mutes
|
return mutes
|
||||||
})
|
})
|
||||||
|
@ -1113,8 +1113,12 @@ const generateMfaBackupCodes = ({ credentials }) => {
|
|||||||
}).then((data) => data.json())
|
}).then((data) => data.json())
|
||||||
}
|
}
|
||||||
|
|
||||||
const fetchMutes = ({ credentials }) => {
|
const fetchMutes = ({ maxId, credentials }) => {
|
||||||
return promisedRequest({ url: MASTODON_USER_MUTES_URL, credentials })
|
const query = new URLSearchParams({ with_relationships: true })
|
||||||
|
if (maxId) {
|
||||||
|
query.append('max_id', maxId)
|
||||||
|
}
|
||||||
|
return promisedRequest({ url: `${MASTODON_USER_MUTES_URL}?${query.toString()}`, credentials })
|
||||||
.then((users) => users.map(parseUser))
|
.then((users) => users.map(parseUser))
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -1138,8 +1142,12 @@ const unsubscribeUser = ({ id, credentials }) => {
|
|||||||
return promisedRequest({ url: MASTODON_UNSUBSCRIBE_USER(id), credentials, method: 'POST' })
|
return promisedRequest({ url: MASTODON_UNSUBSCRIBE_USER(id), credentials, method: 'POST' })
|
||||||
}
|
}
|
||||||
|
|
||||||
const fetchBlocks = ({ credentials }) => {
|
const fetchBlocks = ({ maxId, credentials }) => {
|
||||||
return promisedRequest({ url: MASTODON_USER_BLOCKS_URL, credentials })
|
const query = new URLSearchParams({ with_relationships: true })
|
||||||
|
if (maxId) {
|
||||||
|
query.append('max_id', maxId)
|
||||||
|
}
|
||||||
|
return promisedRequest({ url: `${MASTODON_USER_BLOCKS_URL}?${query.toString()}`, credentials })
|
||||||
.then((users) => users.map(parseUser))
|
.then((users) => users.map(parseUser))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user