commit: ad5bd09204b30b601f5bbfdf51044363386dfd6a
parent 1f7ec86b80079c3080d2871986ef8e91c54be265
Author: HJ <30-hj@users.noreply.git.pleroma.social>
Date: Tue, 11 Apr 2023 21:25:39 +0000
Merge branch 'tusooa/blocklist-loadmore' into 'develop'
Make block & mute lists able to load more
Closes #1150, #1071, #1226, and #1041
See merge request pleroma/pleroma-fe!1790
Diffstat:
5 files changed, 55 insertions(+), 14 deletions(-)
diff --git a/src/components/list/list.vue b/src/components/list/list.vue
@@ -1,9 +1,13 @@
<template>
- <div class="list">
+ <div
+ class="list"
+ role="list"
+ >
<div
v-for="item in items"
:key="getKey(item)"
class="list-item"
+ role="listitem"
>
<slot
name="item"
diff --git a/src/components/settings_modal/tabs/mutes_and_blocks_tab.js b/src/components/settings_modal/tabs/mutes_and_blocks_tab.js
@@ -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 ProgressButton from 'src/components/progress_button/progress_button.vue'
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'
-const BlockList = withSubscription({
+const BlockList = withLoadMore({
fetch: (props, $store) => $store.dispatch('fetchBlocks'),
select: (props, $store) => get($store.state.users.currentUser, 'blockIds', []),
+ destroy: () => {},
childPropName: 'items'
})(SelectableList)
-const MuteList = withSubscription({
+const MuteList = withLoadMore({
fetch: (props, $store) => $store.dispatch('fetchMutes'),
select: (props, $store) => get($store.state.users.currentUser, 'muteIds', []),
+ destroy: () => {},
childPropName: 'items'
})(SelectableList)
diff --git a/src/hocs/with_load_more/with_load_more.jsx b/src/hocs/with_load_more/with_load_more.jsx
@@ -98,7 +98,7 @@ const withLoadMore = ({
</button>
}
{!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>
)
diff --git a/src/modules/users.js b/src/modules/users.js
@@ -195,9 +195,15 @@ export const mutations = {
state.currentUser.blockIds.push(blockId)
}
},
+ setBlockIdsMaxId (state, blockIdsMaxId) {
+ state.currentUser.blockIdsMaxId = blockIdsMaxId
+ },
saveMuteIds (state, muteIds) {
state.currentUser.muteIds = muteIds
},
+ setMuteIdsMaxId (state, muteIdsMaxId) {
+ state.currentUser.muteIdsMaxId = muteIdsMaxId
+ },
addMuteId (state, muteId) {
if (state.currentUser.muteIds.indexOf(muteId) === -1) {
state.currentUser.muteIds.push(muteId)
@@ -320,10 +326,20 @@ const users = {
.then((inLists) => store.commit('updateUserInLists', { id, inLists }))
}
},
- fetchBlocks (store) {
- return store.rootState.api.backendInteractor.fetchBlocks()
+ fetchBlocks (store, args) {
+ const { reset } = args || {}
+
+ const maxId = store.state.currentUser.blockIdsMaxId
+ return store.rootState.api.backendInteractor.fetchBlocks({ maxId })
.then((blocks) => {
- store.commit('saveBlockIds', map(blocks, 'id'))
+ if (reset) {
+ 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)
return blocks
})
@@ -346,10 +362,20 @@ const users = {
editUserNote (store, args) {
return editUserNote(store, args)
},
- fetchMutes (store) {
- return store.rootState.api.backendInteractor.fetchMutes()
+ fetchMutes (store, args) {
+ const { reset } = args || {}
+
+ const maxId = store.state.currentUser.muteIdsMaxId
+ return store.rootState.api.backendInteractor.fetchMutes({ maxId })
.then((mutes) => {
- store.commit('saveMuteIds', map(mutes, 'id'))
+ if (reset) {
+ 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)
return mutes
})
diff --git a/src/services/api/api.service.js b/src/services/api/api.service.js
@@ -1113,8 +1113,12 @@ const generateMfaBackupCodes = ({ credentials }) => {
}).then((data) => data.json())
}
-const fetchMutes = ({ credentials }) => {
- return promisedRequest({ url: MASTODON_USER_MUTES_URL, credentials })
+const fetchMutes = ({ maxId, 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))
}
@@ -1138,8 +1142,12 @@ const unsubscribeUser = ({ id, credentials }) => {
return promisedRequest({ url: MASTODON_UNSUBSCRIBE_USER(id), credentials, method: 'POST' })
}
-const fetchBlocks = ({ credentials }) => {
- return promisedRequest({ url: MASTODON_USER_BLOCKS_URL, credentials })
+const fetchBlocks = ({ maxId, 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))
}