amechama/sharkey
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

auto-select the first user in the following feed

Browse Source
This commit is contained in:
Hazel K 2024-10-02 00:11:57 -04:00
parent 2a11c1ecf6
commit 21277eab8f
1 changed files with 27 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
packages/frontend/src/pages/following-feed.vue
View File

@ -10,7 +10,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkSpacer :contentMax="1200"> <MkSpacer :contentMax="1200">
<div :class="$style.columns"> <div :class="$style.columns">
<MkPullToRefresh :refresher="() => reloadList()"> <MkPullToRefresh :refresher="() => reloadList()">
<MkPagination ref="listPaging" :pagination="listPagination"> <MkPagination ref="listPaging" :pagination="listPagination" @init="onListReady">
<template #empty> <template #empty>
<div class="_fullinfo"> <div class="_fullinfo">
<img :src="infoImageUrl" class="_ghost" :alt="i18n.ts.noNotes" aria-hidden="true"/> <img :src="infoImageUrl" class="_ghost" :alt="i18n.ts.noNotes" aria-hidden="true"/>
@ -26,13 +26,13 @@ SPDX-License-Identifier: AGPL-3.0-only
</MkPagination> </MkPagination>
</MkPullToRefresh> </MkPullToRefresh>
<MkPullToRefresh v-if="selectedUserId" :refresher="() => reloadUser()"> <MkPullToRefresh :refresher="() => reloadUser()">
<div v-if="selectedUser" :class="$style.userInfo"> <div v-if="selectedUser" :class="$style.userInfo">
<MkUserInfo class="user" :user="selectedUser"/> <MkUserInfo class="user" :user="selectedUser"/>
<MkNotes :noGap="true" :pagination="userPagination"/> <MkNotes :noGap="true" :pagination="userPagination"/>
</div> </div>
<div v-else-if="selectedUserError" :class="$style.list">{{ selectedUserError }}</div> <div v-else-if="selectedUserError" :class="$style.list">{{ selectedUserError }}</div>
<MkLoading v-else/> <MkLoading v-else-if="selectedUserId"/>
</MkPullToRefresh> </MkPullToRefresh>
</div> </div>
</MkSpacer> </MkSpacer>
@ -115,6 +115,18 @@ async function reloadBoth() {
]); ]);
} }
async function onListReady(): Promise<void> {
if (!selectedUserId.value && listPaging.value?.items.size) {
// This just gets the first user ID
const selectedNote: Misskey.entities.Note = listPaging.value.items.values().next().value;
// Wait for 1 second to match the animation effects.
// Otherwise, the page appears to load "backwards".
await new Promise(resolve => setTimeout(resolve, 1000));
await selectUser(selectedNote.userId);
}
}
const listPagination: Paging<'notes/following'> = { const listPagination: Paging<'notes/following'> = {
endpoint: 'notes/following' as const, endpoint: 'notes/following' as const,
limit: 20, limit: 20,
@ -168,6 +180,16 @@ definePageMetadata(() => ({
background: var(--panel); background: var(--panel);
} }
.info {
margin-bottom: 6px;
}
@container (min-width: 451px) {
.info {
margin-bottom: 12px;
}
}
.columns { .columns {
display: flex; display: flex;
flex-direction: row; flex-direction: row;