1
0
forked from mirror/misskey

feat: ユーザーをcontextmenuからアンテナに追加できるようになど (#11206)

* feat: ユーザーをcontextmenuからアンテナに追加できるように close #11115

* MkAvatars.vue変更

* nanka iroiro

* fix MkAvatars

* ix

* fix

---------

Co-authored-by: tamaina <tamaina@hotmail.co.jp>
This commit is contained in:
yupix 2023-07-10 15:55:10 +09:00 committed by GitHub
parent 239ea39d6f
commit f4d1fcaf67
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 144 additions and 77 deletions

View File

@ -27,6 +27,7 @@
- フォルダーやファイルに対しても開発者モード使用時、IDをコピーできるように - フォルダーやファイルに対しても開発者モード使用時、IDをコピーできるように
- 引用対象を「もっと見る」で展開した場合、「閉じる」で畳めるように - 引用対象を「もっと見る」で展開した場合、「閉じる」で畳めるように
- プロフィールURLをコピーできるボタンを追加 #11190 - プロフィールURLをコピーできるボタンを追加 #11190
- ユーザーのContextMenuに「アンテナに追加」ボタンを追加
- フォローやお気に入り登録をしていないチャンネルを開く時は概要ページを開くように - フォローやお気に入り登録をしていないチャンネルを開く時は概要ページを開くように
- 画面ビューワをタップした場合、マウスクリックと同様に画像ビューワを閉じるように - 画面ビューワをタップした場合、マウスクリックと同様に画像ビューワを閉じるように
- Fix: サーバーメトリクスが90度傾いている - Fix: サーバーメトリクスが90度傾いている

1
locales/index.d.ts vendored
View File

@ -52,6 +52,7 @@ export interface Locale {
"deleteAndEdit": string; "deleteAndEdit": string;
"deleteAndEditConfirm": string; "deleteAndEditConfirm": string;
"addToList": string; "addToList": string;
"addToAntenna": string;
"sendMessage": string; "sendMessage": string;
"copyRSS": string; "copyRSS": string;
"copyUsername": string; "copyUsername": string;

View File

@ -49,6 +49,7 @@ delete: "削除"
deleteAndEdit: "削除して編集" deleteAndEdit: "削除して編集"
deleteAndEditConfirm: "このートを削除してもう一度編集しますかこのートへのリアクション、Renote、返信も全て削除されます。" deleteAndEditConfirm: "このートを削除してもう一度編集しますかこのートへのリアクション、Renote、返信も全て削除されます。"
addToList: "リストに追加" addToList: "リストに追加"
addToAntenna: "アンテナに追加"
sendMessage: "メッセージを送信" sendMessage: "メッセージを送信"
copyRSS: "RSSをコピー" copyRSS: "RSSをコピー"
copyUsername: "ユーザー名をコピー" copyUsername: "ユーザー名をコピー"

View File

@ -4,3 +4,4 @@ import { Cache } from '@/scripts/cache';
export const clipsCache = new Cache<misskey.entities.Clip[]>(Infinity); export const clipsCache = new Cache<misskey.entities.Clip[]>(Infinity);
export const rolesCache = new Cache(Infinity); export const rolesCache = new Cache(Infinity);
export const userListsCache = new Cache<misskey.entities.UserList[]>(Infinity); export const userListsCache = new Cache<misskey.entities.UserList[]>(Infinity);
export const antennasCache = new Cache<misskey.entities.Antenna[]>(Infinity);

View File

@ -1,24 +1,29 @@
<template> <template>
<div> <div>
<div v-for="user in users" :key="user.id" style="display:inline-block;width:32px;height:32px;margin-right:8px;"> <div v-for="user in users.slice(0, limit)" :key="user.id" style="display:inline-block;width:32px;height:32px;margin-right:8px;">
<MkAvatar :user="user" style="width:32px; height:32px;" indicator link preview/> <MkAvatar :user="user" style="width:32px; height:32px;" indicator link preview/>
</div> </div>
<div v-if="users.length > limit" style="display: inline-block;">...</div>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { onMounted, ref } from 'vue'; import { onMounted, ref } from 'vue';
import * as os from '@/os'; import * as os from '@/os';
import { UserLite } from 'misskey-js/built/entities';
const props = defineProps<{ const props = withDefaults(defineProps<{
userIds: string[]; userIds: string[];
}>(); limit?: number;
}>(), {
limit: Infinity,
});
const users = ref([]); const users = ref<UserLite[]>([]);
onMounted(async () => { onMounted(async () => {
users.value = await os.api('users/show', { users.value = await os.api('users/show', {
userIds: props.userIds, userIds: props.userIds,
}); }) as unknown as UserLite[];
}); });
</script> </script>

View File

@ -9,6 +9,7 @@ import XAntenna from './editor.vue';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
import { useRouter } from '@/router'; import { useRouter } from '@/router';
import { antennasCache } from '@/cache';
const router = useRouter(); const router = useRouter();
@ -26,13 +27,10 @@ let draft = $ref({
}); });
function onAntennaCreated() { function onAntennaCreated() {
antennasCache.delete();
router.push('/my/antennas'); router.push('/my/antennas');
} }
const headerActions = $computed(() => []);
const headerTabs = $computed(() => []);
definePageMetadata({ definePageMetadata({
title: i18n.ts.manageAntennas, title: i18n.ts.manageAntennas,
icon: 'ti ti-antenna', icon: 'ti ti-antenna',

View File

@ -10,6 +10,7 @@ import * as os from '@/os';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { useRouter } from '@/router'; import { useRouter } from '@/router';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
import { antennasCache } from '@/cache';
const router = useRouter(); const router = useRouter();
@ -20,6 +21,7 @@ const props = defineProps<{
}>(); }>();
function onAntennaUpdated() { function onAntennaUpdated() {
antennasCache.delete();
router.push('/my/antennas'); router.push('/my/antennas');
} }
@ -27,10 +29,6 @@ os.api('antennas/show', { antennaId: props.antennaId }).then((antennaResponse) =
antenna = antennaResponse; antenna = antennaResponse;
}); });
const headerActions = $computed(() => []);
const headerTabs = $computed(() => []);
definePageMetadata({ definePageMetadata({
title: i18n.ts.manageAntennas, title: i18n.ts.manageAntennas,
icon: 'ti ti-antenna', icon: 'ti ti-antenna',

View File

@ -2,15 +2,20 @@
<MkStickyContainer> <MkStickyContainer>
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :contentMax="700"> <MkSpacer :contentMax="700">
<div class="ieepwinx"> <div>
<MkButton :link="true" to="/my/antennas/create" primary class="add"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton> <div v-if="antennas.length === 0" class="empty">
<div class="_fullinfo">
<img :src="infoImageUrl" class="_ghost"/>
<div>{{ i18n.ts.nothing }}</div>
</div>
</div>
<div class=""> <MkButton :link="true" to="/my/antennas/create" primary :class="$style.add"><i class="ti ti-plus"></i> {{ i18n.ts.add }}</MkButton>
<MkPagination v-slot="{items}" ref="list" :pagination="pagination">
<MkA v-for="antenna in items" :key="antenna.id" class="ljoevbzj" :to="`/my/antennas/${antenna.id}`"> <div v-if="antennas.length > 0" class="_gaps">
<div class="name">{{ antenna.name }}</div> <MkA v-for="antenna in antennas" :key="antenna.id" :class="$style.antenna" :to="`/my/antennas/${antenna.id}`">
</MkA> <div class="name">{{ antenna.name }}</div>
</MkPagination> </MkA>
</div> </div>
</div> </div>
</MkSpacer> </MkSpacer>
@ -18,19 +23,31 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { } from 'vue';
import MkPagination from '@/components/MkPagination.vue';
import MkButton from '@/components/MkButton.vue'; import MkButton from '@/components/MkButton.vue';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
import { antennasCache } from '@/cache';
import { api } from '@/os';
import { onActivated } from 'vue';
import { infoImageUrl } from '@/instance';
const pagination = { const antennas = $computed(() => antennasCache.value.value ?? []);
endpoint: 'antennas/list' as const,
noPaging: true,
limit: 10,
};
const headerActions = $computed(() => []); function fetch() {
antennasCache.fetch(() => api('antennas/list'));
}
fetch();
const headerActions = $computed(() => [{
asFullButton: true,
icon: 'ti ti-refresh',
text: i18n.ts.reload,
handler: () => {
antennasCache.delete();
fetch();
},
}]);
const headerTabs = $computed(() => []); const headerTabs = $computed(() => []);
@ -38,30 +55,30 @@ definePageMetadata({
title: i18n.ts.manageAntennas, title: i18n.ts.manageAntennas,
icon: 'ti ti-antenna', icon: 'ti ti-antenna',
}); });
onActivated(() => {
antennasCache.fetch(() => api('antennas/list'));
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" module>
.ieepwinx { .add {
margin: 0 auto 16px auto;
}
> .add { .antenna {
margin: 0 auto 16px auto; display: block;
} padding: 16px;
border: solid 1px var(--divider);
border-radius: 6px;
.ljoevbzj { &:hover {
display: block; border: solid 1px var(--accent);
padding: 16px; text-decoration: none;
margin-bottom: 8px;
border: solid 1px var(--divider);
border-radius: 6px;
&:hover {
border: solid 1px var(--accent);
text-decoration: none;
}
> .name {
font-weight: bold;
}
} }
} }
.name {
font-weight: bold;
}
</style> </style>

View File

@ -3,38 +3,43 @@
<template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template> <template #header><MkPageHeader :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :contentMax="700"> <MkSpacer :contentMax="700">
<div class="_gaps"> <div class="_gaps">
<div v-if="items.length === 0" class="empty">
<div class="_fullinfo">
<img :src="infoImageUrl" class="_ghost"/>
<div>{{ i18n.ts.nothing }}</div>
</div>
</div>
<MkButton primary rounded style="margin: 0 auto;" @click="create"><i class="ti ti-plus"></i> {{ i18n.ts.createList }}</MkButton> <MkButton primary rounded style="margin: 0 auto;" @click="create"><i class="ti ti-plus"></i> {{ i18n.ts.createList }}</MkButton>
<MkPagination v-slot="{items}" ref="pagingComponent" :pagination="pagination"> <div v-if="items.length > 0" class="_gaps">
<div class="_gaps"> <MkA v-for="list in items" :key="list.id" class="_panel" :class="$style.list" :to="`/my/lists/${ list.id }`">
<MkA v-for="list in items" :key="list.id" class="_panel" :class="$style.list" :to="`/my/lists/${ list.id }`"> <div style="margin-bottom: 4px;">{{ list.name }}</div>
<div style="margin-bottom: 4px;">{{ list.name }}</div> <MkAvatars :userIds="list.userIds" :limit="10"/>
<MkAvatars :userIds="list.userIds"/> </MkA>
</MkA> </div>
</div>
</MkPagination>
</div> </div>
</MkSpacer> </MkSpacer>
</MkStickyContainer> </MkStickyContainer>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { } from 'vue'; import { onActivated } from 'vue';
import MkPagination from '@/components/MkPagination.vue';
import MkButton from '@/components/MkButton.vue'; import MkButton from '@/components/MkButton.vue';
import MkAvatars from '@/components/MkAvatars.vue'; import MkAvatars from '@/components/MkAvatars.vue';
import * as os from '@/os'; import * as os from '@/os';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
import { userListsCache } from '@/cache'; import { userListsCache } from '@/cache';
import { infoImageUrl } from '@/instance';
const pagingComponent = $shallowRef<InstanceType<typeof MkPagination>>(); const items = $computed(() => userListsCache.value.value ?? []);
const pagination = { function fetch() {
endpoint: 'users/lists/list' as const, userListsCache.fetch(() => os.api('users/lists/list'));
noPaging: true, }
limit: 10,
}; fetch();
async function create() { async function create() {
const { canceled, result: name } = await os.inputText({ const { canceled, result: name } = await os.inputText({
@ -43,10 +48,18 @@ async function create() {
if (canceled) return; if (canceled) return;
await os.apiWithDialog('users/lists/create', { name: name }); await os.apiWithDialog('users/lists/create', { name: name });
userListsCache.delete(); userListsCache.delete();
pagingComponent.reload(); fetch();
} }
const headerActions = $computed(() => []); const headerActions = $computed(() => [{
asFullButton: true,
icon: 'ti ti-refresh',
text: i18n.ts.reload,
handler: () => {
userListsCache.delete();
fetch();
},
}]);
const headerTabs = $computed(() => []); const headerTabs = $computed(() => []);
@ -58,6 +71,10 @@ definePageMetadata({
handler: create, handler: create,
}, },
}); });
onActivated(() => {
fetch();
});
</script> </script>
<style lang="scss" module> <style lang="scss" module>

View File

@ -1,7 +1,8 @@
import { ref } from "vue";
export class Cache<T> { export class Cache<T> {
private cachedAt: number | null = null; private cachedAt: number | null = null;
private value: T | undefined; public value = ref<T | undefined>();
private lifetime: number; private lifetime: number;
constructor(lifetime: Cache<never>['lifetime']) { constructor(lifetime: Cache<never>['lifetime']) {
@ -10,21 +11,20 @@ export class Cache<T> {
public set(value: T): void { public set(value: T): void {
this.cachedAt = Date.now(); this.cachedAt = Date.now();
this.value = value; this.value.value = value;
} }
public get(): T | undefined { private get(): T | undefined {
if (this.cachedAt == null) return undefined; if (this.cachedAt == null) return undefined;
if ((Date.now() - this.cachedAt) > this.lifetime) { if ((Date.now() - this.cachedAt) > this.lifetime) {
this.value = undefined; this.value.value = undefined;
this.cachedAt = null; this.cachedAt = null;
return undefined; return undefined;
} }
return this.value; return this.value.value;
} }
public delete() { public delete() {
this.value = undefined;
this.cachedAt = null; this.cachedAt = null;
} }

View File

@ -1,3 +1,4 @@
import { toUnicode } from 'punycode';
import { defineAsyncComponent } from 'vue'; import { defineAsyncComponent } from 'vue';
import * as misskey from 'misskey-js'; import * as misskey from 'misskey-js';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
@ -8,8 +9,7 @@ import { defaultStore, userActions } from '@/store';
import { $i, iAmModerator } from '@/account'; import { $i, iAmModerator } from '@/account';
import { mainRouter } from '@/router'; import { mainRouter } from '@/router';
import { Router } from '@/nirax'; import { Router } from '@/nirax';
import { rolesCache, userListsCache } from '@/cache'; import { antennasCache, rolesCache, userListsCache } from '@/cache';
import { toUnicode } from 'punycode';
export function getUserMenu(user: misskey.entities.UserDetailed, router: Router = mainRouter) { export function getUserMenu(user: misskey.entities.UserDetailed, router: Router = mainRouter) {
const meId = $i ? $i.id : null; const meId = $i ? $i.id : null;
@ -166,11 +166,39 @@ export function getUserMenu(user: misskey.entities.UserDetailed, router: Router
return lists.map(list => ({ return lists.map(list => ({
text: list.name, text: list.name,
action: () => { action: async () => {
os.apiWithDialog('users/lists/push', { await os.apiWithDialog('users/lists/push', {
listId: list.id, listId: list.id,
userId: user.id, userId: user.id,
}); });
userListsCache.delete();
},
}));
},
}, {
type: 'parent',
icon: 'ti ti-antenna',
text: i18n.ts.addToAntenna,
children: async () => {
const antennas = await antennasCache.fetch(() => os.api('antennas/list'));
const canonical = user.host === null ? `@${user.username}` : `@${user.username}@${toUnicode(user.host)}`;
return antennas.filter((a) => a.src === 'users').map(antenna => ({
text: antenna.name,
action: async () => {
await os.apiWithDialog('antennas/update', {
antennaId: antenna.id,
name: antenna.name,
keywords: antenna.keywords,
excludeKeywords: antenna.excludeKeywords,
src: antenna.src,
userListId: antenna.userListId,
users: [...antenna.users, canonical],
caseSensitive: antenna.caseSensitive,
withReplies: antenna.withReplies,
withFile: antenna.withFile,
notify: antenna.notify,
});
antennasCache.delete();
}, },
})); }));
}, },