add "followers" tab to following feed
This commit is contained in:
parent
053b47d78a
commit
04654b2f84
|
@ -4,12 +4,14 @@
|
|||
*/
|
||||
|
||||
import { Inject, Injectable } from '@nestjs/common';
|
||||
import { ObjectLiteral, SelectQueryBuilder } from 'typeorm';
|
||||
import { SkLatestNote, MiFollowing } from '@/models/_.js';
|
||||
import type { NotesRepository } from '@/models/_.js';
|
||||
import { Endpoint } from '@/server/api/endpoint-base.js';
|
||||
import { NoteEntityService } from '@/core/entities/NoteEntityService.js';
|
||||
import { DI } from '@/di-symbols.js';
|
||||
import { QueryService } from '@/core/QueryService.js';
|
||||
import { ApiError } from '@/server/api/error.js';
|
||||
|
||||
export const meta = {
|
||||
tags: ['notes'],
|
||||
|
@ -34,13 +36,19 @@ export const meta = {
|
|||
code: 'BOTH_INCLUDE_REPLIES_AND_FILES_ONLY',
|
||||
id: '91c8cb9f-36ed-46e7-9ca2-7df96ed6e222',
|
||||
},
|
||||
bothWithFollowersAndIncludeNonPublic: {
|
||||
message: 'Specifying both list:followers and includeNonPublic is not supported',
|
||||
code: 'BOTH_LIST_FOLLOWERS_AND_INCLUDE_NON_PUBLIC',
|
||||
id: '7a1b9cb6-235b-4e58-9c00-32c1796f502c',
|
||||
},
|
||||
},
|
||||
} as const;
|
||||
|
||||
export const paramDef = {
|
||||
type: 'object',
|
||||
properties: {
|
||||
mutualsOnly: { type: 'boolean', default: false },
|
||||
list: { type: 'string', enum: ['following', 'followers', 'mutuals'], default: 'following' },
|
||||
|
||||
filesOnly: { type: 'boolean', default: false },
|
||||
includeNonPublic: { type: 'boolean', default: false },
|
||||
includeReplies: { type: 'boolean', default: false },
|
||||
|
@ -67,6 +75,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
|
|||
) {
|
||||
super(meta, paramDef, async (ps, me) => {
|
||||
if (ps.includeReplies && ps.filesOnly) throw new ApiError(meta.errors.bothWithRepliesAndWithFiles);
|
||||
if (ps.list === 'followers' && ps.includeNonPublic) throw new ApiError(meta.errors.bothWithFollowersAndIncludeNonPublic);
|
||||
|
||||
const query = this.notesRepository
|
||||
.createQueryBuilder('note')
|
||||
|
@ -107,14 +116,15 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
|
|||
.leftJoinAndSelect('reply.user', 'replyUser')
|
||||
.leftJoinAndSelect('renote.user', 'renoteUser')
|
||||
.leftJoinAndSelect('note.channel', 'channel')
|
||||
;
|
||||
|
||||
// Limit to followers
|
||||
.innerJoin(MiFollowing, 'following', 'latest.user_id = following."followeeId"')
|
||||
.andWhere('following."followerId" = :me');
|
||||
|
||||
// Limit to mutuals, if requested
|
||||
if (ps.mutualsOnly) {
|
||||
query.innerJoin(MiFollowing, 'mutuals', 'latest.user_id = mutuals."followerId" AND mutuals."followeeId" = :me');
|
||||
// Select the appropriate collection of users
|
||||
if (ps.list === 'followers') {
|
||||
addFollower(query);
|
||||
} else if (ps.list === 'following') {
|
||||
addFollowee(query);
|
||||
} else {
|
||||
addMutual(query);
|
||||
}
|
||||
|
||||
// Limit to files, if requested
|
||||
|
@ -143,3 +153,26 @@ export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-
|
|||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Limit to followers (they follow us)
|
||||
*/
|
||||
function addFollower<T extends SelectQueryBuilder<ObjectLiteral>>(query: T): T {
|
||||
return query.innerJoin(MiFollowing, 'follower', 'follower."followerId" = latest.user_id AND follower."followeeId" = :me');
|
||||
}
|
||||
|
||||
/**
|
||||
* Limit to followees (we follow them)
|
||||
*/
|
||||
function addFollowee<T extends SelectQueryBuilder<ObjectLiteral>>(query: T): T {
|
||||
return query.innerJoin(MiFollowing, 'followee', 'followee."followerId" = :me AND followee."followeeId" = latest.user_id');
|
||||
}
|
||||
|
||||
/**
|
||||
* Limit to mutuals (they follow us AND we follow them)
|
||||
*/
|
||||
function addMutual<T extends SelectQueryBuilder<ObjectLiteral>>(query: T): T {
|
||||
addFollower(query);
|
||||
addFollowee(query);
|
||||
return query;
|
||||
}
|
||||
|
|
|
@ -5,10 +5,10 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
|
||||
<template>
|
||||
<div :class="$style.root">
|
||||
<MkPageHeader v-model:tab="currentTab" :class="$style.header" :tabs="headerTabs" :actions="headerActions" :displayBackButton="true" @update:tab="onChangeTab"/>
|
||||
<MkPageHeader v-model:tab="userList" :class="$style.header" :tabs="headerTabs" :actions="headerActions" :displayBackButton="true" @update:tab="onChangeTab"/>
|
||||
|
||||
<div ref="noteScroll" :class="$style.notes">
|
||||
<MkHorizontalSwipe v-model:tab="currentTab" :tabs="headerTabs">
|
||||
<MkHorizontalSwipe v-model:tab="userList" :tabs="headerTabs">
|
||||
<MkPullToRefresh :refresher="() => reloadLatestNotes()">
|
||||
<MkPagination ref="latestNotesPaging" :pagination="latestNotesPagination" @init="onListReady">
|
||||
<template #empty>
|
||||
|
@ -29,21 +29,28 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</div>
|
||||
|
||||
<div v-if="isWideViewport" ref="userScroll" :class="$style.user">
|
||||
<MkHorizontalSwipe v-if="selectedUserId" v-model:tab="currentTab" :tabs="headerTabs">
|
||||
<MkHorizontalSwipe v-if="selectedUserId" v-model:tab="userList" :tabs="headerTabs">
|
||||
<SkUserRecentNotes ref="userRecentNotes" :userId="selectedUserId" :withNonPublic="withNonPublic" :withQuotes="withQuotes" :withBots="withBots" :withReplies="withReplies" :onlyFiles="onlyFiles"/>
|
||||
</MkHorizontalSwipe>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
export const followingTab = 'following' as const;
|
||||
export const mutualsTab = 'mutuals' as const;
|
||||
export const followersTab = 'followers' as const;
|
||||
export type FollowingFeedTab = typeof followingTab | typeof mutualsTab | typeof followersTab;
|
||||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, Ref, ref, shallowRef } from 'vue';
|
||||
import * as Misskey from 'misskey-js';
|
||||
import { getScrollContainer } from '@@/js/scroll.js';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import MkHorizontalSwipe from '@/components/MkHorizontalSwipe.vue';
|
||||
import MkPullToRefresh from '@/components/MkPullToRefresh.vue';
|
||||
import MkPagination, { Paging } from '@/components/MkPagination.vue';
|
||||
import { infoImageUrl } from '@/instance.js';
|
||||
import MkDateSeparatedList from '@/components/MkDateSeparatedList.vue';
|
||||
import { Tab } from '@/components/global/MkPageHeader.tabs.vue';
|
||||
|
@ -56,12 +63,15 @@ import { $i } from '@/account.js';
|
|||
import { checkWordMute } from '@/scripts/check-word-mute.js';
|
||||
import SkUserRecentNotes from '@/components/SkUserRecentNotes.vue';
|
||||
import { useScrollPositionManager } from '@/nirax.js';
|
||||
import { getScrollContainer } from '@@/js/scroll.js';
|
||||
import { defaultStore } from '@/store.js';
|
||||
import { deepMerge } from '@/scripts/merge.js';
|
||||
import MkPagination, { Paging } from '@/components/MkPagination.vue';
|
||||
|
||||
const withNonPublic = computed({
|
||||
get: () => defaultStore.reactiveState.followingFeed.value.withNonPublic,
|
||||
get: () => {
|
||||
if (userList.value === 'followers') return false;
|
||||
return defaultStore.reactiveState.followingFeed.value.withNonPublic;
|
||||
},
|
||||
set: value => saveFollowingFilter('withNonPublic', value),
|
||||
});
|
||||
const withQuotes = computed({
|
||||
|
@ -80,26 +90,19 @@ const onlyFiles = computed({
|
|||
get: () => defaultStore.reactiveState.followingFeed.value.onlyFiles,
|
||||
set: value => saveFollowingFilter('onlyFiles', value),
|
||||
});
|
||||
const onlyMutuals = computed({
|
||||
get: () => defaultStore.reactiveState.followingFeed.value.onlyMutuals,
|
||||
set: value => saveFollowingFilter('onlyMutuals', value),
|
||||
const userList = computed({
|
||||
get: () => defaultStore.reactiveState.followingFeed.value.userList,
|
||||
set: value => saveFollowingFilter('userList', value),
|
||||
});
|
||||
|
||||
// Based on timeline.saveTlFilter()
|
||||
function saveFollowingFilter(key: keyof typeof defaultStore.state.followingFeed, value: boolean) {
|
||||
function saveFollowingFilter<Key extends keyof typeof defaultStore.state.followingFeed>(key: Key, value: (typeof defaultStore.state.followingFeed)[Key]) {
|
||||
const out = deepMerge({ [key]: value }, defaultStore.state.followingFeed);
|
||||
defaultStore.set('followingFeed', out);
|
||||
}
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const followingTab = 'following' as const;
|
||||
const mutualsTab = 'mutuals' as const;
|
||||
const currentTab = computed({
|
||||
get: () => onlyMutuals.value ? mutualsTab : followingTab,
|
||||
set: value => onlyMutuals.value = (value === mutualsTab),
|
||||
});
|
||||
|
||||
const userRecentNotes = shallowRef<InstanceType<typeof SkUserRecentNotes>>();
|
||||
const userScroll = shallowRef<HTMLElement>();
|
||||
const noteScroll = shallowRef<HTMLElement>();
|
||||
|
@ -137,9 +140,12 @@ async function reload() {
|
|||
|
||||
async function onListReady(): Promise<void> {
|
||||
if (!selectedUserId.value && latestNotesPaging.value?.items.size) {
|
||||
// This just gets the first user ID
|
||||
const selectedNote: Misskey.entities.Note = latestNotesPaging.value.items.values().next().value;
|
||||
selectedUserId.value = selectedNote.userId;
|
||||
// This looks messy, but actually just gets the first user ID.
|
||||
const selectedNote = latestNotesPaging.value.items.values().next().value;
|
||||
|
||||
// We know this to be non-null because of the size check above.
|
||||
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
|
||||
selectedUserId.value = selectedNote!.userId;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -184,7 +190,7 @@ const latestNotesPagination: Paging<'notes/following'> = {
|
|||
endpoint: 'notes/following' as const,
|
||||
limit: 20,
|
||||
params: computed(() => ({
|
||||
mutualsOnly: onlyMutuals.value,
|
||||
list: userList.value,
|
||||
filesOnly: onlyFiles.value,
|
||||
includeNonPublic: withNonPublic.value,
|
||||
includeReplies: withReplies.value,
|
||||
|
@ -208,6 +214,7 @@ const headerActions: PageHeaderItem[] = [
|
|||
type: 'switch',
|
||||
text: i18n.ts.showNonPublicNotes,
|
||||
ref: withNonPublic,
|
||||
disabled: userList.value === 'followers',
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
|
@ -250,6 +257,11 @@ const headerTabs = computed(() => [
|
|||
icon: 'ph-user-switch ph-bold ph-lg',
|
||||
title: i18n.ts.mutuals,
|
||||
} satisfies Tab,
|
||||
{
|
||||
key: followersTab,
|
||||
icon: 'ph-user ph-bold ph-lg',
|
||||
title: i18n.ts.followers,
|
||||
} satisfies Tab,
|
||||
]);
|
||||
|
||||
useScrollPositionManager(() => getScrollContainer(userScroll.value ?? null), router);
|
||||
|
|
|
@ -11,6 +11,7 @@ import darkTheme from '@@/themes/d-ice.json5';
|
|||
import { miLocalStorage } from './local-storage.js';
|
||||
import { searchEngineMap } from './scripts/search-engine-map.js';
|
||||
import type { SoundType } from '@/scripts/sound.js';
|
||||
import type { FollowingFeedTab } from '@/pages/following-feed.vue';
|
||||
import { Storage } from '@/pizzax.js';
|
||||
|
||||
interface PostFormAction {
|
||||
|
@ -249,7 +250,7 @@ export const defaultStore = markRaw(new Storage('base', {
|
|||
withBots: true,
|
||||
withReplies: false,
|
||||
onlyFiles: false,
|
||||
onlyMutuals: false,
|
||||
userList: 'following' as FollowingFeedTab,
|
||||
},
|
||||
},
|
||||
|
||||
|
|
|
@ -22547,8 +22547,11 @@ export type operations = {
|
|||
requestBody: {
|
||||
content: {
|
||||
'application/json': {
|
||||
/** @default false */
|
||||
mutualsOnly?: boolean;
|
||||
/**
|
||||
* @default following
|
||||
* @enum {string}
|
||||
*/
|
||||
list?: 'following' | 'followers' | 'mutuals';
|
||||
/** @default false */
|
||||
filesOnly?: boolean;
|
||||
/** @default false */
|
||||
|
|
Loading…
Reference in New Issue