feat: テスト通知を送信できるようにする (#11810)

* (add) Notification test

* Update Changelog

* (add) backend, frontend impl

* globalEventの名前を明確にする

* Run API Extractor
This commit is contained in:
かっこかり 2023-09-11 14:31:50 +09:00 committed by GitHub
parent 98e40e666c
commit cd6428715e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 112 additions and 4 deletions

View File

@ -33,6 +33,7 @@
- 投稿フォームのプレビューの表示状態を記憶するように - 投稿フォームのプレビューの表示状態を記憶するように
- AiScriptからMisskeyサーバーAPIを呼び出す際の制限を撤廃 - AiScriptからMisskeyサーバーAPIを呼び出す際の制限を撤廃
- Playで直接投稿フォームを埋め込めるように(`Ui:C:postForm`) - Playで直接投稿フォームを埋め込めるように(`Ui:C:postForm`)
- 通知をテストできるように
- Enhance: ユーザーメニューでスイッチでユーザーリストに追加・削除できるように - Enhance: ユーザーメニューでスイッチでユーザーリストに追加・削除できるように
- Enhance: 自分が押したリアクションのデザインを改善 - Enhance: 自分が押したリアクションのデザインを改善
- Enhance: ノート検索にローカルのみ検索可能なオプションの追加 - Enhance: ノート検索にローカルのみ検索可能なオプションの追加

4
locales/index.d.ts vendored
View File

@ -2132,6 +2132,10 @@ export interface Locale {
"unreadAntennaNote": string; "unreadAntennaNote": string;
"emptyPushNotificationMessage": string; "emptyPushNotificationMessage": string;
"achievementEarned": string; "achievementEarned": string;
"testNotification": string;
"checkNotificationBehavior": string;
"sendTestNotification": string;
"notificationWillBeDisplayedLikeThis": string;
"_types": { "_types": {
"all": string; "all": string;
"follow": string; "follow": string;

View File

@ -2047,6 +2047,10 @@ _notification:
unreadAntennaNote: "アンテナ {name}" unreadAntennaNote: "アンテナ {name}"
emptyPushNotificationMessage: "プッシュ通知の更新をしました" emptyPushNotificationMessage: "プッシュ通知の更新をしました"
achievementEarned: "実績を獲得" achievementEarned: "実績を獲得"
testNotification: "通知テスト"
checkNotificationBehavior: "通知の表示を確かめる"
sendTestNotification: "テスト通知を送信する"
notificationWillBeDisplayedLikeThis: "通知はこのように表示されます"
_types: _types:
all: "すべて" all: "すべて"

View File

@ -33,6 +33,7 @@ export type MiNotification = {
* followRequestAccepted - * followRequestAccepted -
* achievementEarned - * achievementEarned -
* app - * app -
* test -
*/ */
type: typeof notificationTypes[number]; type: typeof notificationTypes[number];

View File

@ -283,6 +283,7 @@ import * as ep___notes_unrenote from './endpoints/notes/unrenote.js';
import * as ep___notes_userListTimeline from './endpoints/notes/user-list-timeline.js'; import * as ep___notes_userListTimeline from './endpoints/notes/user-list-timeline.js';
import * as ep___notifications_create from './endpoints/notifications/create.js'; import * as ep___notifications_create from './endpoints/notifications/create.js';
import * as ep___notifications_markAllAsRead from './endpoints/notifications/mark-all-as-read.js'; import * as ep___notifications_markAllAsRead from './endpoints/notifications/mark-all-as-read.js';
import * as ep___notifications_testNotification from './endpoints/notifications/test-notification.js';
import * as ep___pagePush from './endpoints/page-push.js'; import * as ep___pagePush from './endpoints/page-push.js';
import * as ep___pages_create from './endpoints/pages/create.js'; import * as ep___pages_create from './endpoints/pages/create.js';
import * as ep___pages_delete from './endpoints/pages/delete.js'; import * as ep___pages_delete from './endpoints/pages/delete.js';
@ -629,6 +630,7 @@ const $notes_unrenote: Provider = { provide: 'ep:notes/unrenote', useClass: ep__
const $notes_userListTimeline: Provider = { provide: 'ep:notes/user-list-timeline', useClass: ep___notes_userListTimeline.default }; const $notes_userListTimeline: Provider = { provide: 'ep:notes/user-list-timeline', useClass: ep___notes_userListTimeline.default };
const $notifications_create: Provider = { provide: 'ep:notifications/create', useClass: ep___notifications_create.default }; const $notifications_create: Provider = { provide: 'ep:notifications/create', useClass: ep___notifications_create.default };
const $notifications_markAllAsRead: Provider = { provide: 'ep:notifications/mark-all-as-read', useClass: ep___notifications_markAllAsRead.default }; const $notifications_markAllAsRead: Provider = { provide: 'ep:notifications/mark-all-as-read', useClass: ep___notifications_markAllAsRead.default };
const $notifications_testNotification: Provider = { provide: 'ep:notifications/test-notification', useClass: ep___notifications_testNotification.default };
const $pagePush: Provider = { provide: 'ep:page-push', useClass: ep___pagePush.default }; const $pagePush: Provider = { provide: 'ep:page-push', useClass: ep___pagePush.default };
const $pages_create: Provider = { provide: 'ep:pages/create', useClass: ep___pages_create.default }; const $pages_create: Provider = { provide: 'ep:pages/create', useClass: ep___pages_create.default };
const $pages_delete: Provider = { provide: 'ep:pages/delete', useClass: ep___pages_delete.default }; const $pages_delete: Provider = { provide: 'ep:pages/delete', useClass: ep___pages_delete.default };
@ -979,6 +981,7 @@ const $retention: Provider = { provide: 'ep:retention', useClass: ep___retention
$notes_userListTimeline, $notes_userListTimeline,
$notifications_create, $notifications_create,
$notifications_markAllAsRead, $notifications_markAllAsRead,
$notifications_testNotification,
$pagePush, $pagePush,
$pages_create, $pages_create,
$pages_delete, $pages_delete,

View File

@ -283,6 +283,7 @@ import * as ep___notes_unrenote from './endpoints/notes/unrenote.js';
import * as ep___notes_userListTimeline from './endpoints/notes/user-list-timeline.js'; import * as ep___notes_userListTimeline from './endpoints/notes/user-list-timeline.js';
import * as ep___notifications_create from './endpoints/notifications/create.js'; import * as ep___notifications_create from './endpoints/notifications/create.js';
import * as ep___notifications_markAllAsRead from './endpoints/notifications/mark-all-as-read.js'; import * as ep___notifications_markAllAsRead from './endpoints/notifications/mark-all-as-read.js';
import * as ep___notifications_testNotification from './endpoints/notifications/test-notification.js';
import * as ep___pagePush from './endpoints/page-push.js'; import * as ep___pagePush from './endpoints/page-push.js';
import * as ep___pages_create from './endpoints/pages/create.js'; import * as ep___pages_create from './endpoints/pages/create.js';
import * as ep___pages_delete from './endpoints/pages/delete.js'; import * as ep___pages_delete from './endpoints/pages/delete.js';
@ -627,6 +628,7 @@ const eps = [
['notes/user-list-timeline', ep___notes_userListTimeline], ['notes/user-list-timeline', ep___notes_userListTimeline],
['notifications/create', ep___notifications_create], ['notifications/create', ep___notifications_create],
['notifications/mark-all-as-read', ep___notifications_markAllAsRead], ['notifications/mark-all-as-read', ep___notifications_markAllAsRead],
['notifications/test-notification', ep___notifications_testNotification],
['page-push', ep___pagePush], ['page-push', ep___pagePush],
['pages/create', ep___pages_create], ['pages/create', ep___pages_create],
['pages/delete', ep___pages_delete], ['pages/delete', ep___pages_delete],

View File

@ -0,0 +1,33 @@
/*
* SPDX-FileCopyrightText: syuilo and other misskey contributors
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { Injectable } from '@nestjs/common';
import { Endpoint } from '@/server/api/endpoint-base.js';
import { NotificationService } from '@/core/NotificationService.js';
export const meta = {
tags: ['notifications'],
requireCredential: true,
kind: 'write:notifications',
} as const;
export const paramDef = {
type: 'object',
properties: {},
required: [],
} as const;
@Injectable()
export default class extends Endpoint<typeof meta, typeof paramDef> { // eslint-disable-line import/no-default-export
constructor(
private notificationService: NotificationService,
) {
super(meta, paramDef, async (ps, user) => {
this.notificationService.createNotification(user.id, 'test', {});
});
}
}

View File

@ -3,7 +3,7 @@
* SPDX-License-Identifier: AGPL-3.0-only * SPDX-License-Identifier: AGPL-3.0-only
*/ */
export const notificationTypes = ['follow', 'mention', 'reply', 'renote', 'quote', 'reaction', 'pollEnded', 'receiveFollowRequest', 'followRequestAccepted', 'achievementEarned', 'app'] as const; export const notificationTypes = ['follow', 'mention', 'reply', 'renote', 'quote', 'reaction', 'pollEnded', 'receiveFollowRequest', 'followRequestAccepted', 'achievementEarned', 'app', 'test'] as const;
export const obsoleteNotificationTypes = ['pollVote', 'groupInvited'] as const; export const obsoleteNotificationTypes = ['pollVote', 'groupInvited'] as const;
export const noteVisibilities = ['public', 'home', 'followers', 'specified'] as const; export const noteVisibilities = ['public', 'home', 'followers', 'specified'] as const;

View File

@ -8,6 +8,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div :class="$style.head"> <div :class="$style.head">
<MkAvatar v-if="notification.type === 'pollEnded'" :class="$style.icon" :user="notification.note.user" link preview/> <MkAvatar v-if="notification.type === 'pollEnded'" :class="$style.icon" :user="notification.note.user" link preview/>
<MkAvatar v-else-if="notification.type === 'achievementEarned'" :class="$style.icon" :user="$i" link preview/> <MkAvatar v-else-if="notification.type === 'achievementEarned'" :class="$style.icon" :user="$i" link preview/>
<img v-else-if="notification.type === 'test'" :class="$style.icon" :src="infoImageUrl"/>
<MkAvatar v-else-if="notification.user" :class="$style.icon" :user="notification.user" link preview/> <MkAvatar v-else-if="notification.user" :class="$style.icon" :user="notification.user" link preview/>
<img v-else-if="notification.icon" :class="$style.icon" :src="notification.icon" alt=""/> <img v-else-if="notification.icon" :class="$style.icon" :src="notification.icon" alt=""/>
<div <div
@ -47,6 +48,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<header :class="$style.header"> <header :class="$style.header">
<span v-if="notification.type === 'pollEnded'">{{ i18n.ts._notification.pollEnded }}</span> <span v-if="notification.type === 'pollEnded'">{{ i18n.ts._notification.pollEnded }}</span>
<span v-else-if="notification.type === 'achievementEarned'">{{ i18n.ts._notification.achievementEarned }}</span> <span v-else-if="notification.type === 'achievementEarned'">{{ i18n.ts._notification.achievementEarned }}</span>
<span v-else-if="notification.type === 'test'">{{ i18n.ts._notification.testNotification }}</span>
<MkA v-else-if="notification.user" v-user-preview="notification.user.id" :class="$style.headerName" :to="userPage(notification.user)"><MkUserName :user="notification.user"/></MkA> <MkA v-else-if="notification.user" v-user-preview="notification.user.id" :class="$style.headerName" :to="userPage(notification.user)"><MkUserName :user="notification.user"/></MkA>
<span v-else>{{ notification.header }}</span> <span v-else>{{ notification.header }}</span>
<MkTime v-if="withTime" :time="notification.createdAt" :class="$style.headerTime"/> <MkTime v-if="withTime" :time="notification.createdAt" :class="$style.headerTime"/>
@ -91,6 +93,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkButton :class="$style.followRequestCommandButton" rounded danger @click="rejectFollowRequest()"><i class="ti ti-x"/> {{ i18n.ts.reject }}</MkButton> <MkButton :class="$style.followRequestCommandButton" rounded danger @click="rejectFollowRequest()"><i class="ti ti-x"/> {{ i18n.ts.reject }}</MkButton>
</div> </div>
</template> </template>
<span v-else-if="notification.type === 'test'" :class="$style.text">{{ i18n.ts._notification.notificationWillBeDisplayedLikeThis }}</span>
<span v-else-if="notification.type === 'app'" :class="$style.text"> <span v-else-if="notification.type === 'app'" :class="$style.text">
<Mfm :text="notification.body" :nowrap="false"/> <Mfm :text="notification.body" :nowrap="false"/>
</span> </span>
@ -113,6 +116,7 @@ import { i18n } from '@/i18n';
import * as os from '@/os'; import * as os from '@/os';
import { useTooltip } from '@/scripts/use-tooltip'; import { useTooltip } from '@/scripts/use-tooltip';
import { $i } from '@/account'; import { $i } from '@/account';
import { infoImageUrl } from '@/instance';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
notification: Misskey.entities.Notification; notification: Misskey.entities.Notification;

View File

@ -95,6 +95,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<option value="vertical"><i class="ti ti-carousel-vertical"></i> {{ i18n.ts.vertical }}</option> <option value="vertical"><i class="ti ti-carousel-vertical"></i> {{ i18n.ts.vertical }}</option>
<option value="horizontal"><i class="ti ti-carousel-horizontal"></i> {{ i18n.ts.horizontal }}</option> <option value="horizontal"><i class="ti ti-carousel-horizontal"></i> {{ i18n.ts.horizontal }}</option>
</MkRadios> </MkRadios>
<MkButton @click="testNotification('client')">{{ i18n.ts._notification.checkNotificationBehavior }}</MkButton>
</div> </div>
</FormSection> </FormSection>
@ -190,6 +192,7 @@ import { unisonReload } from '@/scripts/unison-reload';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
import { miLocalStorage } from '@/local-storage'; import { miLocalStorage } from '@/local-storage';
import { testNotification } from '@/scripts/test-notification';
const lang = ref(miLocalStorage.getItem('lang')); const lang = ref(miLocalStorage.getItem('lang'));
const fontSize = ref(miLocalStorage.getItem('fontSize')); const fontSize = ref(miLocalStorage.getItem('fontSize'));

View File

@ -12,6 +12,11 @@ SPDX-License-Identifier: AGPL-3.0-only
<FormLink @click="readAllUnreadNotes">{{ i18n.ts.markAsReadAllUnreadNotes }}</FormLink> <FormLink @click="readAllUnreadNotes">{{ i18n.ts.markAsReadAllUnreadNotes }}</FormLink>
</div> </div>
</FormSection> </FormSection>
<FormSection>
<div class="_gaps_m">
<FormLink @click="testNotification('server')">{{ i18n.ts._notification.sendTestNotification }}</FormLink>
</div>
</FormSection>
<FormSection> <FormSection>
<template #label>{{ i18n.ts.pushNotification }}</template> <template #label>{{ i18n.ts.pushNotification }}</template>
@ -41,6 +46,7 @@ import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata'; import { definePageMetadata } from '@/scripts/page-metadata';
import MkPushNotificationAllowButton from '@/components/MkPushNotificationAllowButton.vue'; import MkPushNotificationAllowButton from '@/components/MkPushNotificationAllowButton.vue';
import { notificationTypes } from '@/const'; import { notificationTypes } from '@/const';
import { testNotification } from '@/scripts/test-notification';
let allowButton = $shallowRef<InstanceType<typeof MkPushNotificationAllowButton>>(); let allowButton = $shallowRef<InstanceType<typeof MkPushNotificationAllowButton>>();
let pushRegistrationInServer = $computed(() => allowButton?.pushRegistrationInServer); let pushRegistrationInServer = $computed(() => allowButton?.pushRegistrationInServer);

View File

@ -0,0 +1,34 @@
/*
* SPDX-FileCopyrightText: syuilo and other misskey contributors
* SPDX-License-Identifier: AGPL-3.0-only
*/
import * as Misskey from 'misskey-js';
import * as os from '@/os';
import { globalEvents } from '@/events';
/**
*
*
* - `client`
* - `server`
*
* @param type
*/
export function testNotification(type: 'client' | 'server'): void {
const notification: Misskey.entities.Notification = {
id: Math.random().toString(),
createdAt: new Date().toUTCString(),
isRead: false,
type: 'test',
};
switch (type) {
case 'server':
os.api('notifications/test-notification');
break;
case 'client':
globalEvents.emit('clientNotification', notification);
break;
}
}

View File

@ -56,6 +56,7 @@ import { $i } from '@/account';
import { useStream } from '@/stream'; import { useStream } from '@/stream';
import { i18n } from '@/i18n'; import { i18n } from '@/i18n';
import { defaultStore } from '@/store'; import { defaultStore } from '@/store';
import { globalEvents } from '@/events';
const XStreamIndicator = defineAsyncComponent(() => import('./stream-indicator.vue')); const XStreamIndicator = defineAsyncComponent(() => import('./stream-indicator.vue'));
const XUpload = defineAsyncComponent(() => import('./upload.vue')); const XUpload = defineAsyncComponent(() => import('./upload.vue'));
@ -64,11 +65,13 @@ const dev = _DEV_;
let notifications = $ref<Misskey.entities.Notification[]>([]); let notifications = $ref<Misskey.entities.Notification[]>([]);
function onNotification(notification) { function onNotification(notification: Misskey.entities.Notification, isClient: boolean = false) {
if ($i.mutingNotificationTypes.includes(notification.type)) return; if ($i.mutingNotificationTypes.includes(notification.type)) return;
if (document.visibilityState === 'visible') { if (document.visibilityState === 'visible') {
if (!isClient) {
useStream().send('readNotification'); useStream().send('readNotification');
}
notifications.unshift(notification); notifications.unshift(notification);
window.setTimeout(() => { window.setTimeout(() => {
@ -86,6 +89,7 @@ function onNotification(notification) {
if ($i) { if ($i) {
const connection = useStream().useChannel('main', null, 'UI'); const connection = useStream().useChannel('main', null, 'UI');
connection.on('notification', onNotification); connection.on('notification', onNotification);
globalEvents.on('clientNotification', notification => onNotification(notification, true));
//#region Listen message from SW //#region Listen message from SW
if ('serviceWorker' in navigator) { if ('serviceWorker' in navigator) {

View File

@ -1915,6 +1915,10 @@ export type Endpoints = {
}; };
res: null; res: null;
}; };
'notifications/test-notification': {
req: NoParams;
res: null;
};
'notifications/mark-all-as-read': { 'notifications/mark-all-as-read': {
req: NoParams; req: NoParams;
res: null; res: null;
@ -2627,6 +2631,8 @@ type Notification_2 = {
header?: string | null; header?: string | null;
body: string; body: string;
icon?: string | null; icon?: string | null;
} | {
type: 'test';
}); });
// @public (undocumented) // @public (undocumented)
@ -2842,7 +2848,7 @@ type UserSorting = '+follower' | '-follower' | '+createdAt' | '-createdAt' | '+u
// //
// src/api.types.ts:16:32 - (ae-forgotten-export) The symbol "TODO" needs to be exported by the entry point index.d.ts // src/api.types.ts:16:32 - (ae-forgotten-export) The symbol "TODO" needs to be exported by the entry point index.d.ts
// src/api.types.ts:18:25 - (ae-forgotten-export) The symbol "NoParams" needs to be exported by the entry point index.d.ts // src/api.types.ts:18:25 - (ae-forgotten-export) The symbol "NoParams" needs to be exported by the entry point index.d.ts
// src/api.types.ts:630:18 - (ae-forgotten-export) The symbol "ShowUserReq" needs to be exported by the entry point index.d.ts // src/api.types.ts:631:18 - (ae-forgotten-export) The symbol "ShowUserReq" needs to be exported by the entry point index.d.ts
// src/streaming.types.ts:33:4 - (ae-forgotten-export) The symbol "FIXME" needs to be exported by the entry point index.d.ts // src/streaming.types.ts:33:4 - (ae-forgotten-export) The symbol "FIXME" needs to be exported by the entry point index.d.ts
// (No @packageDocumentation comment for this package) // (No @packageDocumentation comment for this package)

View File

@ -534,6 +534,7 @@ export type Endpoints = {
// notifications // notifications
'notifications/create': { req: { body: string; header?: string | null; icon?: string | null; }; res: null; }; 'notifications/create': { req: { body: string; header?: string | null; icon?: string | null; }; res: null; };
'notifications/test-notification': { req: NoParams; res: null; };
'notifications/mark-all-as-read': { req: NoParams; res: null; }; 'notifications/mark-all-as-read': { req: NoParams; res: null; };
// page-push // page-push

View File

@ -257,6 +257,8 @@ export type Notification = {
header?: string | null; header?: string | null;
body: string; body: string;
icon?: string | null; icon?: string | null;
} | {
type: 'test';
}); });
export type MessagingMessage = { export type MessagingMessage = {