add search pagination (just for statuses)

This commit is contained in:
notfire 2025-03-16 17:22:22 -04:00
parent 56aa0e6204
commit c43ddf6c7b
Signed by: notfire
GPG key ID: 3AFDACAAB4E56B16
9 changed files with 151 additions and 15 deletions

View file

@ -390,6 +390,19 @@ const PostStatusForm = {
return
}
switch (newStatus.status) {
case "ENABLESILLYFEATURES=1":
this.$store.dispatch('setOption', { name: 'sillyFeatures', value: true })
console.log("Silly features ENABLED...")
this.clearStatus()
return
case "ENABLESILLYFEATURES=0":
this.$store.dispatch('setOption', { name: 'sillyFeatures', value: false })
console.log("Silly features DISABLED...")
this.clearStatus()
return
}
const poll = this.pollFormVisible ? this.newStatus.poll : {}
if (this.pollContentError) {
this.error = this.pollContentError

View file

@ -3,6 +3,7 @@ import Conversation from '../conversation/conversation.vue'
import Status from '../status/status.vue'
import TabSwitcher from 'src/components/tab_switcher/tab_switcher.jsx'
import map from 'lodash/map'
import { throttle } from 'lodash'
import { library } from '@fortawesome/fontawesome-svg-core'
import {
faCircleNotch,
@ -73,14 +74,58 @@ const Search = {
this.hashtags = []
this.$refs.searchInput.blur()
this.$store.dispatch('search', { q: query, resolve: true })
this.$store.dispatch('search', { q: query, resolve: true, limit: this.$store.getters.mergedConfig.searchPaginationLimit })
.then(data => {
this.loading = false
this.userIds = map(data.accounts, 'id')
if (data.statuses.length < 20)
this.bottomedOut = true
else
this.bottomedOut = false
this.statuses = data.statuses
this.hashtags = data.hashtags
this.currenResultTab = this.getActiveTab()
this.loaded = true
if (this.$store.getters.mergedConfig.recurseSearch) {
this.fetchMorePosts(this.visibleStatuses.length)
}
})
},
searchWithOffset (query, offset) {
if (!query) {
this.loading = false
return
}
this.loading = true
this.userIds = []
this.hashtags = []
this.$refs.searchInput.blur()
this.$store.dispatch('search', {
q: query,
resolve: true,
offset: offset,
max_id: this.statuses[this.statuses.length - 1]["id"],
limit: this.$store.getters.mergedConfig.searchPaginationLimit
}).then(data => {
console.log(this.$store)
this.loading = false
this.userIds = map(data.accounts, 'id')
if (data.statuses.length < this.$store.getters.mergedConfig.searchPaginationLimit)
this.bottomedOut = true
else
this.bottomedOut = false
data.statuses.forEach(element => {
this.statuses.push(element)
})
this.hashtags = data.hashtags
this.currenResultTab = this.getActiveTab()
this.loaded = true
if (this.$store.getters.mergedConfig.recurseSearch && !this.bottomedOut && (this.visibleStatuses.length < this.$store.getters.mergedConfig.recurseSearchLimit)) {
this.fetchMorePosts(this.visibleStatuses.length)
}
})
},
resultCount (tabName) {
@ -103,6 +148,9 @@ const Search = {
},
lastHistoryRecord (hashtag) {
return hashtag.history && hashtag.history[0]
},
fetchMorePosts(offset) {
this.searchWithOffset(this.query, offset)
}
}
}

View file

@ -21,17 +21,7 @@
<FAIcon icon="search" />
</button>
</div>
<div
v-if="loading"
class="text-center loading-icon"
>
<FAIcon
icon="circle-notch"
spin
size="lg"
/>
</div>
<div v-else-if="loaded">
<div v-if="loaded">
<div class="search-nav-heading">
<tab-switcher
ref="tabSwitcher"
@ -71,6 +61,34 @@
:statusoid="status"
:no-heading="false"
/>
<!-- this is just ripped from notifications.vue because im lazy -->
<div class="panel-footer">
<div
v-if="bottomedOut && !loading"
class="new-status-notification text-center faint"
>
{{ $t('search.no_more_posts') }}
</div>
<button
v-else-if="!loading"
class="button-unstyled -link -fullwidth"
@click.prevent="fetchMorePosts(visibleStatuses.length)"
>
<div class="new-status-notification text-center">
{{ $t('search.load_older') }}
</div>
</button>
<div
v-else
class="new-status-notification text-center"
>
<FAIcon
icon="circle-notch"
spin
size="lg"
/>
</div>
</div>
</div>
<div v-else-if="currenResultTab === 'people'">
<div

View file

@ -275,6 +275,16 @@
{{ $t('settings.autohide_floating_post_button') }}
</BooleanSetting>
</li>
<li>
<IntegerSetting
path="searchPaginationLimit"
:min="20"
:max="40"
:expert="1"
>
{{ $t('settings.search_pagination_limit') }}
</IntegerSetting>
</li>
<li>
<h3>{{ $t('settings.columns') }}</h3>
</li>
@ -697,6 +707,35 @@
</li>
</ul>
</div>
<div
v-if="this.$store.getters.mergedConfig.sillyFeatures"
>
<div class="setting-item">
<h2>{{ $t('settings.silly_features') }}</h2>
<ul class="setting-list">
<li>
<BooleanSetting
path="recurseSearch"
>
{{ $t('settings.recurse_search') }}
</BooleanSetting>
<ul
class="setting-list suboptions"
:class="[{disabled: !recurseSearch}]"
>
<li>
<IntegerSetting
path="recurseSearchLimit"
:min="100"
>
{{ $t('settings.recurse_search_limit') }}
</IntegerSetting>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</template>

View file

@ -452,7 +452,9 @@
},
"search": {
"hashtags": "Hashtags",
"no_more_posts": "No more posts",
"no_results": "No results",
"load_older": "Load older posts",
"people": "People",
"people_talking": "{count} people talking",
"person_talking": "{count} person talking"
@ -717,6 +719,8 @@
},
"profile_tab": "Profile",
"radii_help": "Set up interface edge rounding (in pixels)",
"recurse_search": "When searching, run searches until no results are found anymore",
"recurse_search_limit": "Number of posts to stop recurse searching at (>300 will cause massive performance issues)",
"refresh_token": "Refresh token",
"remove_alias": "Remove this alias",
"remove_backup": "Remove",
@ -740,6 +744,7 @@
"saving_err": "Error saving settings",
"saving_ok": "Settings saved",
"scope_copy": "Copy scope when replying (DMs are always copied)",
"search_pagination_limit": "Results to show per search page",
"search_user_to_block": "Search whom you want to block",
"search_user_to_mute": "Search whom you want to mute",
"security": "Security",
@ -774,6 +779,7 @@
"show_page_backgrounds": "Show page-specific backgrounds, e.g. for user profiles",
"show_wider_shortcuts": "Show wider gap between top panel shortcuts",
"show_yous": "Show (You)s",
"silly_features": "Silly features",
"sound_on_notification": "Play a sound when you get a notification",
"sound_on_notification_custom": "Custom sounds",
"sound_on_notification_custom_exp": "Put URLs to custom sounds in this box, one line for each. If you want one sound to have a different volume, put a semicolon after the link and the volume as a number between 0 and 1. If you want a sound to affect a certain user, use a second semicolon and then their ID.",

View file

@ -122,6 +122,10 @@ export const defaultState = {
soundOnNotifVolume: 0.2,
soundOnNotifCustom: '',
boostsFollowDefVis: false,
searchPaginationLimit: 40,
sillyFeatures: false,
recurseSearch: false,
recurseSearchLimit: 100,
renderMisskeyMarkdown: undefined,
renderMfmOnHover: undefined, // instance default
conversationDisplay: undefined, // instance default

View file

@ -78,6 +78,10 @@ const defaultState = {
soundOnNotifCustom: '',
boostsFollowDefVis: false,
deletePostsStreaming: true,
searchPaginationLimit: 40,
sillyFeatures: false,
recurseSearch: false,
recurseSearchLimit: 100,
renderMisskeyMarkdown: true,
renderMfmOnHover: false,
conversationDisplay: 'linear',

View file

@ -772,8 +772,8 @@ const statuses = {
rootState.api.backendInteractor.fetchRebloggedByUsers({ id })
.then(rebloggedByUsers => commit('addRepeats', { id, rebloggedByUsers, currentUser: rootState.users.currentUser }))
},
search (store, { q, resolve, limit, offset, following, type }) {
return store.rootState.api.backendInteractor.search2({ q, resolve, limit, offset, following, type })
search (store, { q, resolve, limit, offset, following, type, max_id }) {
return store.rootState.api.backendInteractor.search2({ q, resolve, limit, offset, following, type, max_id })
.then((data) => {
store.commit('addNewUsers', data.accounts)
store.commit('addNewStatuses', { statuses: data.statuses })

View file

@ -1402,7 +1402,7 @@ const searchUsers = ({ credentials, query }) => {
.then((data) => data.map(parseUser))
}
const search2 = ({ credentials, q, resolve, limit, offset, following, type }) => {
const search2 = ({ credentials, q, resolve, limit, offset, following, type, max_id }) => {
let url = MASTODON_SEARCH_2
let params = []
@ -1430,6 +1430,10 @@ const search2 = ({ credentials, q, resolve, limit, offset, following, type }) =>
params.push(['type', type])
}
if (max_id) {
params.push(['max_id', max_id])
}
params.push(['with_relationships', true])
let queryString = map(params, (param) => `${param[0]}=${param[1]}`).join('&')