Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

feat: お知らせの確認待機時間・優先順位機能

Browse source 
b7fd6bf33a835fd73c2a86eb007074d3680f6efd によるリワーク

This reverts commit eeef3965b7
This reverts commit 04fefb2056
This reverts commit 576251200f
This commit is contained in:
まっちゃとーにゅ 2023-08-19 04:48:28 +09:00
parent 3c2b83c3ae
commit 6893e5d60b
No known key found for this signature in database
GPG key ID: 6AFBBF529601C1DB
27 changed files with 832 additions and 264 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
locales/en-US.yml
View file

@ -251,6 +251,7 @@ noSuchUser: "User not found"
lookup: "Lookup"
announcements: "Announcements"
imageUrl: "Image URL"
displayOrder: "Position"
remove: "Delete"
removed: "Successfully deleted"
removeAreYouSure: "Are you sure that you want to remove \"{x}\"?"

2
locales/index.d.ts vendored
View file

@ -254,6 +254,7 @@ export interface Locale {
"lookup": string;
"announcements": string;
"imageUrl": string;
"displayOrder": string;
"remove": string;
"removed": string;
"removeAreYouSure": string;
@ -1075,6 +1076,7 @@ export interface Locale {
"additionalEmojiDictionary": string;
"installed": string;
"branding": string;
"dialogCloseDuration": string;
"enableServerMachineStats": string;
"enableIdenticonGeneration": string;
"turnOffToImprovePerformance": string;

2
locales/ja-JP.yml
View file

@ -251,6 +251,7 @@ noSuchUser: "ユーザーが見つかりません"
lookup: "照会"
announcements: "お知らせ"
imageUrl: "画像URL"
displayOrder: "表示順"
remove: "削除"
removed: "削除しました"
removeAreYouSure: "「{x}」を削除しますか？"
@ -1072,6 +1073,7 @@ goToMisskey: "Misskeyへ"
additionalEmojiDictionary: "絵文字の追加辞書"
installed: "インストール済み"
branding: "ブランディング"
dialogCloseDuration: "ダイアログを閉じるまでの待機時間"
enableServerMachineStats: "サーバーのマシン情報を公開する"
enableIdenticonGeneration: "ユーザーごとのIdenticon生成を有効にする"
turnOffToImprovePerformance: "オフにするとパフォーマンスが向上します。"

20
packages/backend/migration/1688647797135-userannouncement.js Normal file
View file

@ -0,0 +1,20 @@
/*
* SPDX-FileCopyrightText: syuilo and other misskey contributors
* SPDX-License-Identifier: AGPL-3.0-only
*/
export class Userannouncement1688647797135 {
name = 'Userannouncement1688647797135'
async up(queryRunner) {
await queryRunner.query(`ALTER TABLE "announcement" ADD COLUMN "userId" character varying(32)`);
await queryRunner.query(`ALTER TABLE "announcement" ADD COLUMN "closeDuration" integer NOT NULL DEFAULT 0`);
await queryRunner.query(`CREATE INDEX "IDX_fd25dfe3da37df1715f11ba6ec" ON "announcement" ("userId") `);
}
async down(queryRunner) {
await queryRunner.query(`DROP INDEX "public"."IDX_fd25dfe3da37df1715f11ba6ec"`);
await queryRunner.query(`ALTER TABLE "announcement" DROP COLUMN "userId"`);
await queryRunner.query(`ALTER TABLE "announcement" DROP COLUMN "closeDuration"`);
}
}

18
packages/backend/migration/1690463372775-announcement-display-order.js Normal file
View file

@ -0,0 +1,18 @@
/*
* SPDX-FileCopyrightText: syuilo and other misskey contributors
* SPDX-License-Identifier: AGPL-3.0-only
*/
export class AnnouncementDisplayOrder1690463372775 {
name = 'AnnouncementDisplayOrder1690463372775'
async up(queryRunner) {
await queryRunner.query(`ALTER TABLE "announcement" ADD "displayOrder" integer NOT NULL DEFAULT '0'`);
await queryRunner.query(`CREATE INDEX "IDX_b64d293ca4bef21e91963054b0" ON "announcement" ("displayOrder") `);
}
async down(queryRunner) {
await queryRunner.query(`DROP INDEX "public"."IDX_b64d293ca4bef21e91963054b0"`);
await queryRunner.query(`ALTER TABLE "announcement" DROP COLUMN "displayOrder"`);
}
}

385
packages/backend/src/core/AnnouncementService.ts
View file

@ -4,14 +4,17 @@
*/
import { Inject, Injectable } from '@nestjs/common';
import { Brackets } from 'typeorm';
import { DI } from '@/di-symbols.js';
import { Brackets, In } from 'typeorm';
import type { AnnouncementReadsRepository, AnnouncementsRepository, UsersRepository } from '@/models/index.js';
import type { User } from '@/models/entities/User.js';
import type { AnnouncementReadsRepository, AnnouncementsRepository, Announcement, AnnouncementRead } from '@/models/index.js';
import { Announcement, AnnouncementRead } from '@/models/index.js';
import { AnnouncementEntityService } from '@/core/entities/AnnouncementEntityService.js';
import { bindThis } from '@/decorators.js';
import { Packed } from '@/misc/json-schema.js';
import { IdService } from '@/core/IdService.js';
import { DI } from '@/di-symbols.js';
import { GlobalEventService } from '@/core/GlobalEventService.js';
import { IdService } from '@/core/IdService.js';
import { Packed } from '@/misc/json-schema.js';
import { UserEntityService } from '@/core/entities/UserEntityService.js';
@Injectable()
export class AnnouncementService {
@ -22,63 +25,52 @@ export class AnnouncementService {
@Inject(DI.announcementReadsRepository)
private announcementReadsRepository: AnnouncementReadsRepository,
@Inject(DI.usersRepository)
private usersRepository: UsersRepository,
private idService: IdService,
private userEntityService: UserEntityService,
private announcementEntityService: AnnouncementEntityService,
private globalEventService: GlobalEventService,
) {
}
) {}
@bindThis
public async getReads(userId: User['id']): Promise<AnnouncementRead[]> {
return this.announcementReadsRepository.findBy({
userId: userId,
});
}
public async create(
values: Partial<Announcement>,
): Promise<{ raw: Announcement; packed: Packed<'Announcement'> }> {
const announcement = await this.announcementsRepository
.insert({
id: this.idService.genId(),
createdAt: new Date(),
updatedAt: null,
title: values.title,
text: values.text,
imageUrl: values.imageUrl,
icon: values.icon,
display: values.display,
forExistingUsers: values.forExistingUsers,
needConfirmationToRead: values.needConfirmationToRead,
closeDuration: values.closeDuration,
displayOrder: values.displayOrder,
userId: values.userId,
})
.then((x) =>
this.announcementsRepository.findOneByOrFail(x.identifiers[0]),
);
@bindThis
public async getUnreadAnnouncements(user: User): Promise<Announcement[]> {
const readsQuery = this.announcementReadsRepository.createQueryBuilder('read')
.select('read.announcementId')
.where('read.userId = :userId', { userId: user.id });
const q = this.announcementsRepository.createQueryBuilder('announcement')
.where('announcement.isActive = true')
.andWhere(new Brackets(qb => {
qb.orWhere('announcement.userId = :userId', { userId: user.id });
qb.orWhere('announcement.userId IS NULL');
}))
.andWhere(new Brackets(qb => {
qb.orWhere('announcement.forExistingUsers = false');
qb.orWhere('announcement.createdAt > :createdAt', { createdAt: user.createdAt });
}))
.andWhere(`announcement.id NOT IN (${ readsQuery.getQuery() })`);
q.setParameters(readsQuery.getParameters());
return q.getMany();
}
@bindThis
public async create(values: Partial<Announcement>): Promise<{ raw: Announcement; packed: Packed<'Announcement'> }> {
const announcement = await this.announcementsRepository.insert({
id: this.idService.genId(),
createdAt: new Date(),
updatedAt: null,
title: values.title,
text: values.text,
imageUrl: values.imageUrl,
icon: values.icon,
display: values.display,
forExistingUsers: values.forExistingUsers,
needConfirmationToRead: values.needConfirmationToRead,
userId: values.userId,
}).then(x => this.announcementsRepository.findOneByOrFail(x.identifiers[0]));
const packed = (await this.packMany([announcement]))[0];
const packed = await this.announcementEntityService.pack(
announcement,
null,
);
if (values.userId) {
this.globalEventService.publishMainStream(values.userId, 'announcementCreated', {
announcement: packed,
});
this.globalEventService.publishMainStream(
values.userId,
'announcementCreated',
{
announcement: packed,
},
);
} else {
this.globalEventService.publishBroadcastStream('announcementCreated', {
announcement: packed,
@ -92,44 +84,271 @@ export class AnnouncementService {
}
@bindThis
public async read(user: User, announcementId: Announcement['id']): Promise<void> {
public async list(
userId: User['id'] | null,
limit: number,
offset: number,
moderator: User,
): Promise<(Announcement & { userInfo: Packed<'UserLite'> | null, readCount: number })[]> {
const query = this.announcementsRepository.createQueryBuilder('announcement');
if (userId) {
query.andWhere('announcement."userId" = :userId', { userId: userId });
} else {
query.andWhere('announcement."userId" IS NULL');
}
query.orderBy({
'announcement."displayOrder"': 'DESC',
'announcement."createdAt"': 'DESC',
});
const announcements = await query
.limit(limit)
.offset(offset)
.getMany();
const reads = new Map<Announcement, number>();
for (const announcement of announcements) {
reads.set(announcement, await this.announcementReadsRepository.countBy({
announcementId: announcement.id,
}));
}
const users = await this.usersRepository.findBy({
id: In(announcements.map(a => a.userId).filter(id => id != null)),
});
const packedUsers = await this.userEntityService.packMany(users, moderator, {
detail: false,
});
return announcements.map(announcement => ({
...announcement,
userInfo: packedUsers.find(u => u.id === announcement.userId) ?? null,
readCount: reads.get(announcement) ?? 0,
}));
}
@bindThis
public async update(
announcementId: Announcement['id'],
values: Partial<Announcement>,
): Promise<{ raw: Announcement; packed: Packed<'Announcement'> }> {
const oldAnnouncement = await this.announcementsRepository.findOneByOrFail({
id: announcementId,
});
if (oldAnnouncement.userId && oldAnnouncement.userId !== values.userId) {
await this.announcementReadsRepository.delete({
announcementId: announcementId,
userId: oldAnnouncement.userId,
});
}
const announcement = await this.announcementsRepository
.update(announcementId, {
updatedAt: new Date(),
isActive: values.isActive,
title: values.title,
text: values.text,
imageUrl: values.imageUrl !== '' ? values.imageUrl : null,
icon: values.icon,
display: values.display,
forExistingUsers: values.forExistingUsers,
needConfirmationToRead: values.needConfirmationToRead,
closeDuration: values.closeDuration,
displayOrder: values.displayOrder,
userId: values.userId,
})
.then(() =>
this.announcementsRepository.findOneByOrFail({ id: announcementId }),
);
const packed = await this.announcementEntityService.pack(
announcement,
values.userId ? { id: values.userId } : null,
);
if (values.userId) {
this.globalEventService.publishMainStream(
values.userId,
'announcementCreated',
{
announcement: packed,
},
);
} else {
this.globalEventService.publishBroadcastStream('announcementCreated', {
announcement: packed,
});
}
return {
raw: announcement,
packed: packed,
};
}
@bindThis
public async delete(announcementId: Announcement['id']): Promise<void> {
await this.announcementReadsRepository.delete({
announcementId: announcementId,
});
await this.announcementsRepository.delete({ id: announcementId });
}
@bindThis
public async getAnnouncements(
me: User | null,
limit: number,
offset: number,
isActive?: boolean,
): Promise<Packed<'Announcement'>[]> {
const query = this.announcementsRepository.createQueryBuilder('announcement');
if (me) {
query.leftJoin(
AnnouncementRead,
'read',
'read."announcementId" = announcement.id AND read."userId" = :userId',
{ userId: me.id },
);
query.select([
'announcement.*',
'CASE WHEN read.id IS NULL THEN FALSE ELSE TRUE END as "isRead"',
]);
query
.andWhere(
new Brackets((qb) => {
qb.orWhere('announcement."userId" = :userId', { userId: me.id });
qb.orWhere('announcement."userId" IS NULL');
}),
)
.andWhere(
new Brackets((qb) => {
qb.orWhere('announcement."forExistingUsers" = false');
qb.orWhere('announcement."createdAt" > :createdAt', {
createdAt: me.createdAt,
});
}),
);
} else {
query.select([
'announcement.*',
'NULL as "isRead"',
]);
query.andWhere('announcement."userId" IS NULL');
query.andWhere('announcement."forExistingUsers" = false');
}
if (isActive !== undefined) {
query.andWhere('announcement."isActive" = :isActive', {
isActive: isActive,
});
}
query.orderBy({
'"isRead"': 'ASC',
'announcement."displayOrder"': 'DESC',
'announcement."createdAt"': 'DESC',
});
return this.announcementEntityService.packMany(
await query
.limit(limit)
.offset(offset)
.getRawMany<Announcement & { isRead?: boolean | null }>(),
me,
);
}
@bindThis
public async getUnreadAnnouncements(me: User): Promise<Packed<'Announcement'>[]> {
const query = this.announcementsRepository.createQueryBuilder('announcement');
query.leftJoinAndSelect(
AnnouncementRead,
'read',
'read."announcementId" = announcement.id AND read."userId" = :userId',
{ userId: me.id },
);
query.andWhere('read.id IS NULL');
query.andWhere('announcement."isActive" = true');
query
.andWhere(
new Brackets((qb) => {
qb.orWhere('announcement."userId" = :userId', { userId: me.id });
qb.orWhere('announcement."userId" IS NULL');
}),
)
.andWhere(
new Brackets((qb) => {
qb.orWhere('announcement."forExistingUsers" = false');
qb.orWhere('announcement."createdAt" > :createdAt', {
createdAt: me.createdAt,
});
}),
);
query.orderBy({
'announcement."displayOrder"': 'DESC',
'announcement."createdAt"': 'DESC',
});
return this.announcementEntityService.packMany(
await query.getMany(),
me,
);
}
@bindThis
public async countUnreadAnnouncements(me: User): Promise<number> {
const query = this.announcementsRepository.createQueryBuilder('announcement');
query.leftJoinAndSelect(
AnnouncementRead,
'read',
'read."announcementId" = announcement.id AND read."userId" = :userId',
{ userId: me.id },
);
query.andWhere('read.id IS NULL');
query.andWhere('announcement."isActive" = true');
query
.andWhere(
new Brackets((qb) => {
qb.orWhere('announcement."userId" = :userId', { userId: me.id });
qb.orWhere('announcement."userId" IS NULL');
}),
)
.andWhere(
new Brackets((qb) => {
qb.orWhere('announcement."forExistingUsers" = false');
qb.orWhere('announcement."createdAt" > :createdAt', {
createdAt: me.createdAt,
});
}),
);
return query.getCount();
}
@bindThis
public async markAsRead(
me: User,
announcementId: Announcement['id'],
): Promise<void> {
try {
await this.announcementReadsRepository.insert({
id: this.idService.genId(),
createdAt: new Date(),
announcementId: announcementId,
userId: user.id,
userId: me.id,
});
} catch (e) {
return;
}
if ((await this.getUnreadAnnouncements(user)).length === 0) {
this.globalEventService.publishMainStream(user.id, 'readAllAnnouncements');
if ((await this.countUnreadAnnouncements(me)) === 0) {
this.globalEventService.publishMainStream(me.id, 'readAllAnnouncements');
}
}
@bindThis
public async packMany(
announcements: Announcement[],
me?: { id: User['id'] } | null | undefined,
options?: {
reads?: AnnouncementRead[];
},
): Promise<Packed<'Announcement'>[]> {
const reads = me ? (options?.reads ?? await this.getReads(me.id)) : [];
return announcements.map(announcement => ({
id: announcement.id,
createdAt: announcement.createdAt.toISOString(),
updatedAt: announcement.updatedAt?.toISOString() ?? null,
text: announcement.text,
title: announcement.title,
imageUrl: announcement.imageUrl,
icon: announcement.icon,
display: announcement.display,
needConfirmationToRead: announcement.needConfirmationToRead,
forYou: announcement.userId === me?.id,
isRead: reads.some(read => read.announcementId === announcement.id),
}));
}
}

6
packages/backend/src/core/CoreModule.ts
View file

@ -72,6 +72,7 @@ import PerUserDriveChart from './chart/charts/per-user-drive.js';
import ApRequestChart from './chart/charts/ap-request.js';
import { ChartManagementService } from './chart/ChartManagementService.js';
import { AbuseUserReportEntityService } from './entities/AbuseUserReportEntityService.js';
import { AnnouncementEntityService } from './entities/AnnouncementEntityService.js';
import { AntennaEntityService } from './entities/AntennaEntityService.js';
import { AppEntityService } from './entities/AppEntityService.js';
import { AuthSessionEntityService } from './entities/AuthSessionEntityService.js';
@ -198,6 +199,7 @@ const $ApRequestChart: Provider = { provide: 'ApRequestChart', useExisting: ApRe
const $ChartManagementService: Provider = { provide: 'ChartManagementService', useExisting: ChartManagementService };
const $AbuseUserReportEntityService: Provider = { provide: 'AbuseUserReportEntityService', useExisting: AbuseUserReportEntityService };
const $AnnouncementEntityService: Provider = { provide: 'AnnouncementEntityService', useExisting: AnnouncementEntityService };
const $AntennaEntityService: Provider = { provide: 'AntennaEntityService', useExisting: AntennaEntityService };
const $AppEntityService: Provider = { provide: 'AppEntityService', useExisting: AppEntityService };
const $AuthSessionEntityService: Provider = { provide: 'AuthSessionEntityService', useExisting: AuthSessionEntityService };
@ -324,6 +326,7 @@ const $ApQuestionService: Provider = { provide: 'ApQuestionService', useExisting
ApRequestChart,
ChartManagementService,
AbuseUserReportEntityService,
AnnouncementEntityService,
AntennaEntityService,
AppEntityService,
AuthSessionEntityService,
@ -445,6 +448,7 @@ const $ApQuestionService: Provider = { provide: 'ApQuestionService', useExisting
$ApRequestChart,
$ChartManagementService,
$AbuseUserReportEntityService,
$AnnouncementEntityService,
$AntennaEntityService,
$AppEntityService,
$AuthSessionEntityService,
@ -566,6 +570,7 @@ const $ApQuestionService: Provider = { provide: 'ApQuestionService', useExisting
ApRequestChart,
ChartManagementService,
AbuseUserReportEntityService,
AnnouncementEntityService,
AntennaEntityService,
AppEntityService,
AuthSessionEntityService,
@ -686,6 +691,7 @@ const $ApQuestionService: Provider = { provide: 'ApQuestionService', useExisting
$ApRequestChart,
$ChartManagementService,
$AbuseUserReportEntityService,
$AnnouncementEntityService,
$AntennaEntityService,
$AppEntityService,
$AuthSessionEntityService,

71
packages/backend/src/core/entities/AnnouncementEntityService.ts Normal file
View file

@ -0,0 +1,71 @@
/*
* SPDX-FileCopyrightText: syuilo and other misskey contributors
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { Inject, Injectable } from '@nestjs/common';
import { DI } from '@/di-symbols.js';
import type {
AnnouncementReadsRepository,
AnnouncementsRepository,
} from '@/models/index.js';
import type { Packed } from '@/misc/json-schema.js';
import { bindThis } from '@/decorators.js';
import { Announcement, User } from '@/models/index.js';
@Injectable()
export class AnnouncementEntityService {
constructor(
@Inject(DI.announcementsRepository)
private announcementsRepository: AnnouncementsRepository,
@Inject(DI.announcementReadsRepository)
private announcementReadsRepository: AnnouncementReadsRepository,
) {
}
@bindThis
public async pack(
src: Announcement['id'] | Announcement & { isRead?: boolean | null },
me: { id: User['id'] } | null | undefined,
): Promise<Packed<'Announcement'>> {
const announcement = typeof src === 'object'
? src
: await this.announcementsRepository.findOneByOrFail({
id: src,
}) as Announcement & { isRead?: boolean | null };
if (me && announcement.isRead === undefined) {
announcement.isRead = await this.announcementReadsRepository.countBy({
announcementId: announcement.id,
userId: me.id,
}).then(count => count > 0);
}
return {
id: announcement.id,
createdAt: announcement.createdAt.toISOString(),
updatedAt: announcement.updatedAt?.toISOString() ?? null,
title: announcement.title,
text: announcement.text,
imageUrl: announcement.imageUrl,
icon: announcement.icon,
display: announcement.display,
forYou: announcement.userId === me?.id,
needConfirmationToRead: announcement.needConfirmationToRead,
closeDuration: announcement.closeDuration,
displayOrder: announcement.displayOrder,
isRead: announcement.isRead !== null ? announcement.isRead : undefined,
};
}
@bindThis
public async packMany(
announcements: (Announcement['id'] | Announcement & { isRead?: boolean | null } | Announcement)[],
me: { id: User['id'] } | null | undefined,
) : Promise<Packed<'Announcement'>[]> {
return (await Promise.allSettled(announcements.map(x => this.pack(x, me))))
.filter(result => result.status === 'fulfilled')
.map(result => (result as PromiseFulfilledResult<Packed<'Announcement'>>).value);
}
}

14
packages/backend/src/models/entities/Announcement.ts
View file

@ -60,12 +60,26 @@ export class Announcement {
})
public needConfirmationToRead: boolean;
@Column('integer', {
nullable: false,
default: 0,
})
public closeDuration: number;
@Index()
@Column('boolean', {
default: true,
})
public isActive: boolean;
// UIに表示する際の並び順用(大きいほど先頭)
@Index()
@Column('integer', {
nullable: false,
default: 0,
})
public displayOrder: number;
@Index()
@Column('boolean', {
default: false,

8
packages/backend/src/models/json-schema/announcement.ts
View file

@ -50,6 +50,14 @@ export const packedAnnouncementSchema = {
type: 'boolean',
optional: false, nullable: false,
},
closeDuration: {
type: 'number',
optional: false, nullable: false,
},
displayOrder: {
type: 'number',
optional: false, nullable: false,
},
isRead: {
type: 'boolean',
optional: true, nullable: false,

48
packages/backend/src/server/api/endpoints/admin/announcements/create.ts
View file

@ -45,6 +45,34 @@ export const meta = {
type: 'string',
optional: false, nullable: true,
},
icon: {
type: 'string',
optional: false, nullable: false,
},
display: {
type: 'string',
optional: false, nullable: false,
},
forExistingUsers: {
type: 'boolean',
optional: false, nullable: false,
},
needConfirmationToRead: {
type: 'boolean',
optional: false, nullable: false,
},
closeDuration: {
type: 'number',
optional: false, nullable: false,
},
displayOrder: {
type: 'number',
optional: false, nullable: false,
},
userId: {
type: 'string',
optional: false, nullable: true,
},
},
},
} as const;
@ -59,6 +87,8 @@ export const paramDef = {
display: { type: 'string', enum: ['normal', 'banner', 'dialog'], default: 'normal' },
forExistingUsers: { type: 'boolean', default: false },
needConfirmationToRead: { type: 'boolean', default: false },
closeDuration: { type: 'number', default: 0 },
displayOrder: { type: 'number', default: 0 },
userId: { type: 'string', format: 'misskey:id', nullable: true, default: null },
},
required: ['title', 'text', 'imageUrl'],
@ -81,10 +111,26 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
display: ps.display,
forExistingUsers: ps.forExistingUsers,
needConfirmationToRead: ps.needConfirmationToRead,
closeDuration: ps.closeDuration,
displayOrder: ps.displayOrder,
userId: ps.userId,
});
return packed;
return {
id: packed.id,
createdAt: packed.createdAt,
updatedAt: packed.updatedAt,
title: packed.title,
text: packed.text,
imageUrl: packed.imageUrl,
icon: packed.icon,
display: packed.display,
forExistingUsers: raw.forExistingUsers,
needConfirmationToRead: packed.needConfirmationToRead,
closeDuration: packed.closeDuration,
displayOrder: packed.displayOrder,
userId: raw.userId,
};
});
}
}

9
packages/backend/src/server/api/endpoints/admin/announcements/delete.ts
View file

@ -5,9 +5,10 @@
import { Inject, Injectable } from '@nestjs/common';
import { Endpoint } from '@/server/api/endpoint-base.js';
import type { AnnouncementsRepository } from '@/models/index.js';
import { ApiError } from '@/server/api/error.js';
import { DI } from '@/di-symbols.js';
import { ApiError } from '../../../error.js';
import type { AnnouncementsRepository } from '@/models/index.js';
import { AnnouncementService } from '@/core/AnnouncementService.js';
export const meta = {
tags: ['admin'],
@ -38,13 +39,15 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
constructor(
@Inject(DI.announcementsRepository)
private announcementsRepository: AnnouncementsRepository,
private announcementService: AnnouncementService,
) {
super(meta, paramDef, async (ps, me) => {
const announcement = await this.announcementsRepository.findOneBy({ id: ps.id });
if (announcement == null) throw new ApiError(meta.errors.noSuchAnnouncement);
await this.announcementsRepository.delete(announcement.id);
await this.announcementService.delete(announcement.id);
});
}
}

85
packages/backend/src/server/api/endpoints/admin/announcements/list.ts
View file

@ -3,12 +3,9 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { Inject, Injectable } from '@nestjs/common';
import type { AnnouncementsRepository, AnnouncementReadsRepository } from '@/models/index.js';
import type { Announcement } from '@/models/entities/Announcement.js';
import { Injectable } from '@nestjs/common';
import { Endpoint } from '@/server/api/endpoint-base.js';
import { QueryService } from '@/core/QueryService.js';
import { DI } from '@/di-symbols.js';
import { AnnouncementService } from '@/core/AnnouncementService.js';
export const meta = {
tags: ['admin'],
@ -39,19 +36,56 @@ export const meta = {
optional: false, nullable: true,
format: 'date-time',
},
text: {
type: 'string',
isActive: {
type: 'boolean',
optional: false, nullable: false,
},
title: {
type: 'string',
optional: false, nullable: false,
},
text: {
type: 'string',
optional: false, nullable: false,
},
imageUrl: {
type: 'string',
optional: false, nullable: true,
},
reads: {
icon: {
type: 'string',
optional: false, nullable: false,
},
display: {
type: 'string',
optional: false, nullable: false,
},
forExistingUsers: {
type: 'boolean',
optional: false, nullable: false,
},
needConfirmationToRead: {
type: 'boolean',
optional: false, nullable: false,
},
closeDuration: {
type: 'number',
optional: false, nullable: false,
},
displayOrder: {
type: 'number',
optional: false, nullable: false,
},
userId: {
type: 'string',
optional: false, nullable: true,
},
user: {
type: 'object',
optional: false, nullable: true,
ref: 'UserLite',
},
readCount: {
type: 'number',
optional: false, nullable: false,
},
@ -64,8 +98,7 @@ export const paramDef = {
type: 'object',
properties: {
limit: { type: 'integer', minimum: 1, maximum: 100, default: 10 },
sinceId: { type: 'string', format: 'misskey:id' },
untilId: { type: 'string', format: 'misskey:id' },
offset: { type: 'integer', default: 0 },
userId: { type: 'string', format: 'misskey:id', nullable: true },
},
required: [],
@ -75,46 +108,28 @@ export const paramDef = {
@Injectable()
export default class extends Endpoint<typeof meta, typeof paramDef> {
constructor(
@Inject(DI.announcementsRepository)
private announcementsRepository: AnnouncementsRepository,
@Inject(DI.announcementReadsRepository)
private announcementReadsRepository: AnnouncementReadsRepository,
private queryService: QueryService,
private announcementService: AnnouncementService,
) {
super(meta, paramDef, async (ps, me) => {
const query = this.queryService.makePaginationQuery(this.announcementsRepository.createQueryBuilder('announcement'), ps.sinceId, ps.untilId);
if (ps.userId) {
query.andWhere('announcement.userId = :userId', { userId: ps.userId });
} else {
query.andWhere('announcement.userId IS NULL');
}
const announcements = await query.limit(ps.limit).getMany();
const reads = new Map<Announcement, number>();
for (const announcement of announcements) {
reads.set(announcement, await this.announcementReadsRepository.countBy({
announcementId: announcement.id,
}));
}
const announcements = await this.announcementService.list(ps.userId ?? null, ps.limit, ps.offset, me);
return announcements.map(announcement => ({
id: announcement.id,
createdAt: announcement.createdAt.toISOString(),
updatedAt: announcement.updatedAt?.toISOString() ?? null,
isActive: announcement.isActive,
title: announcement.title,
text: announcement.text,
imageUrl: announcement.imageUrl,
icon: announcement.icon,
display: announcement.display,
isActive: announcement.isActive,
forExistingUsers: announcement.forExistingUsers,
needConfirmationToRead: announcement.needConfirmationToRead,
closeDuration: announcement.closeDuration,
displayOrder: announcement.displayOrder,
userId: announcement.userId,
reads: reads.get(announcement)!,
user: announcement.userInfo,
readCount: announcement.readCount,
}));
});
}

22
packages/backend/src/server/api/endpoints/admin/announcements/update.ts
View file

@ -5,9 +5,10 @@
import { Inject, Injectable } from '@nestjs/common';
import { Endpoint } from '@/server/api/endpoint-base.js';
import type { AnnouncementsRepository } from '@/models/index.js';
import { ApiError } from '@/server/api/error.js';
import { DI } from '@/di-symbols.js';
import { ApiError } from '../../../error.js';
import type { AnnouncementsRepository } from '@/models/index.js';
import { AnnouncementService } from '@/core/AnnouncementService.js';
export const meta = {
tags: ['admin'],
@ -35,6 +36,8 @@ export const paramDef = {
display: { type: 'string', enum: ['normal', 'banner', 'dialog'] },
forExistingUsers: { type: 'boolean' },
needConfirmationToRead: { type: 'boolean' },
closeDuration: { type: 'number', default: 0 },
displayOrder: { type: 'number', default: 0 },
isActive: { type: 'boolean' },
},
required: ['id'],
@ -46,24 +49,15 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
constructor(
@Inject(DI.announcementsRepository)
private announcementsRepository: AnnouncementsRepository,
private announcementService: AnnouncementService,
) {
super(meta, paramDef, async (ps, me) => {
const announcement = await this.announcementsRepository.findOneBy({ id: ps.id });
if (announcement == null) throw new ApiError(meta.errors.noSuchAnnouncement);
await this.announcementsRepository.update(announcement.id, {
updatedAt: new Date(),
title: ps.title,
text: ps.text,
/* eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing -- 空の文字列の場合、nullを渡すようにするため */
imageUrl: ps.imageUrl || null,
display: ps.display,
icon: ps.icon,
forExistingUsers: ps.forExistingUsers,
needConfirmationToRead: ps.needConfirmationToRead,
isActive: ps.isActive,
});
await this.announcementService.update(announcement.id, ps);
});
}
}

14
packages/backend/src/server/api/endpoints/announcements.ts
View file

@ -31,8 +31,7 @@ export const paramDef = {
type: 'object',
properties: {
limit: { type: 'integer', minimum: 1, maximum: 100, default: 10 },
sinceId: { type: 'string', format: 'misskey:id' },
untilId: { type: 'string', format: 'misskey:id' },
offset: { type: 'integer', default: 0 },
isActive: { type: 'boolean', default: true },
},
required: [],
@ -52,16 +51,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
private announcementService: AnnouncementService,
) {
super(meta, paramDef, async (ps, me) => {
const query = this.queryService.makePaginationQuery(this.announcementsRepository.createQueryBuilder('announcement'), ps.sinceId, ps.untilId)
.where('announcement.isActive = :isActive', { isActive: ps.isActive })
.andWhere(new Brackets(qb => {
if (me) qb.orWhere('announcement.userId = :meId', { meId: me.id });
qb.orWhere('announcement.userId IS NULL');
}));
const announcements = await query.limit(ps.limit).getMany();
return this.announcementService.packMany(announcements, me);
return this.announcementService.getAnnouncements(me, ps.limit, ps.offset, ps.isActive);
});
}
}

2
packages/backend/src/server/api/endpoints/i/read-announcement.ts
View file

@ -33,7 +33,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
private announcementService: AnnouncementService,
) {
super(meta, paramDef, async (ps, me) => {
await this.announcementService.read(me, ps.announcementId);
await this.announcementService.markAsRead(me, ps.announcementId);
});
}
}

18
packages/backend/test/unit/AnnouncementService.ts
View file

@ -5,18 +5,19 @@
process.env.NODE_ENV = 'test';
import { jest } from '@jest/globals';
import { ModuleMocker } from 'jest-mock';
import { Test } from '@nestjs/testing';
import { GlobalModule } from '@/GlobalModule.js';
import { AnnouncementService } from '@/core/AnnouncementService.js';
import { jest } from '@jest/globals';
import type { Announcement, AnnouncementsRepository, AnnouncementReadsRepository, UsersRepository, User } from '@/models/index.js';
import { DI } from '@/di-symbols.js';
import { genAid } from '@/misc/id/aid.js';
import { CacheService } from '@/core/CacheService.js';
import { IdService } from '@/core/IdService.js';
import { GlobalEventService } from '@/core/GlobalEventService.js';
import { secureRndstr } from '@/misc/secure-rndstr.js';
import { GlobalModule } from '@/GlobalModule.js';
import { IdService } from '@/core/IdService.js';
import { AnnouncementEntityService } from '@/core/entities/AnnouncementEntityService.js';
import { AnnouncementService } from '@/core/AnnouncementService.js';
import { DI } from '@/di-symbols.js';
import { CacheService } from '@/core/CacheService.js';
import { genAid } from '@/misc/id/aid.js';
import { GlobalEventService } from '@/core/GlobalEventService.js';
import type { TestingModule } from '@nestjs/testing';
import type { MockFunctionMetadata } from 'jest-mock';
@ -60,6 +61,7 @@ describe('AnnouncementService', () => {
GlobalModule,
],
providers: [
AnnouncementEntityService,
AnnouncementService,
CacheService,
IdService,

42
packages/frontend/src/boot/main-boot.ts
View file

@ -89,15 +89,6 @@ export async function mainBoot() {
}, {}, 'closed');
}
stream.on('announcementCreated', (ev) => {
const announcement = ev.announcement;
if (announcement.display === 'dialog') {
popup(defineAsyncComponent(() => import('@/components/MkAnnouncementDialog.vue')), {
announcement,
}, {}, 'closed');
}
});
if ($i.isDeleted) {
alert({
type: 'warning',
@ -224,6 +215,20 @@ export async function mainBoot() {
updateAccount(i);
});
main.on('announcementCreated', (ev) => {
const announcement = ev.announcement;
updateAccount({
hasUnreadAnnouncement: true,
unreadAnnouncements: [...($i?.unreadAnnouncements ?? []), announcement],
});
if (announcement.display === 'dialog') {
popup(defineAsyncComponent(() => import('@/components/MkAnnouncementDialog.vue')), {
announcement,
}, {}, 'closed');
}
});
main.on('readAllNotifications', () => {
updateAccount({ hasUnreadNotification: false });
});
@ -257,8 +262,25 @@ export async function mainBoot() {
sound.play('antenna');
});
stream.on('announcementCreated', (ev) => {
const announcement = ev.announcement;
updateAccount({
hasUnreadAnnouncement: true,
unreadAnnouncements: [...($i?.unreadAnnouncements ?? []), announcement],
});
if (announcement.display === 'dialog') {
popup(defineAsyncComponent(() => import('@/components/MkAnnouncementDialog.vue')), {
announcement,
}, {}, 'closed');
}
});
main.on('readAllAnnouncements', () => {
updateAccount({ hasUnreadAnnouncement: false });
updateAccount({
hasUnreadAnnouncement: false,
unreadAnnouncements: [],
});
});
// トークンが再生成されたとき

52
packages/frontend/src/components/MkAnnouncementDialog.vue
View file

@ -13,16 +13,16 @@ SPDX-License-Identifier: AGPL-3.0-only
<i v-else-if="announcement.icon === 'error'" class="ti ti-circle-x" style="color: var(--error);"></i>
<i v-else-if="announcement.icon === 'success'" class="ti ti-check" style="color: var(--success);"></i>
</span>
<span :class="$style.title">{{ announcement.title }}</span>
<Mfm :text="announcement.title"/>
</div>
<div :class="$style.text"><Mfm :text="announcement.text"/></div>
<MkButton primary full @click="ok">{{ i18n.ts.ok }}</MkButton>
<div :class="$style.content"><Mfm :text="announcement.text"/></div>
<MkButton :class="$style.gotIt" primary full :disabled="gotItDisabled" @click="gotIt">{{ i18n.ts.gotIt }}<span v-if="secVisible"> ({{ sec }})</span></MkButton>
</div>
</MkModal>
</template>
<script lang="ts" setup>
import { onMounted, shallowRef } from 'vue';
import { onMounted, ref, shallowRef } from 'vue';
import * as misskey from 'misskey-js';
import * as os from '@/os';
import MkModal from '@/components/MkModal.vue';
@ -37,8 +37,11 @@ const props = withDefaults(defineProps<{
const rootEl = shallowRef<HTMLDivElement>();
const modal = shallowRef<InstanceType<typeof MkModal>>();
const gotItDisabled = ref(true);
const secVisible = ref(true);
const sec = ref(props.announcement.closeDuration);
async function ok() {
async function gotIt(): Promise<void> {
if (props.announcement.needConfirmationToRead) {
const confirm = await os.confirm({
type: 'question',
@ -48,15 +51,19 @@ async function ok() {
if (confirm.canceled) return;
}
modal.value.close();
os.api('i/read-announcement', { announcementId: props.announcement.id });
updateAccount({
unreadAnnouncements: $i!.unreadAnnouncements.filter(a => a.id !== props.announcement.id),
});
await os.api('i/read-announcement', { announcementId: props.announcement.id });
if ($i) {
updateAccount({
unreadAnnouncements: $i.unreadAnnouncements.filter((a: { id: string; }) => a.id !== props.announcement.id),
});
}
modal.value?.close();
}
function onBgClick() {
rootEl.value.animate([{
function onBgClick(): void {
if (sec.value > 0) return;
rootEl.value?.animate([{
offset: 0,
transform: 'scale(1)',
}, {
@ -71,6 +78,21 @@ function onBgClick() {
}
onMounted(() => {
if (sec.value > 0 ) {
const waitTimer = setInterval(() => {
if (sec.value === 0) {
clearInterval(waitTimer);
gotItDisabled.value = false;
secVisible.value = false;
} else {
gotItDisabled.value = true;
}
sec.value = sec.value - 1;
}, 1000);
} else {
gotItDisabled.value = false;
secVisible.value = false;
}
});
</script>
@ -94,11 +116,7 @@ onMounted(() => {
margin-right: 0.5em;
}
.title {
font-weight: bold;
}
.text {
.content {
margin: 1em 0;
}
</style>

60
packages/frontend/src/components/MkUserAnnouncementEditDialog.vue
View file

@ -6,8 +6,11 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<MkModalWindow
ref="dialog"
:width="400"
@close="dialog.close()"
:width="800"
:height="600"
:withOkButton="false"
:okButtonDisabled="false"
@close="dialog?.close()"
@closed="$emit('closed')"
>
<template v-if="announcement" #header>:{{ announcement.title }}:</template>
@ -16,8 +19,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<div>
<MkSpacer :marginMin="20" :marginMax="28">
<div class="_gaps_m">
<MkInput v-model="title">
<template #label>{{ i18n.ts.title }}</template>
<MkInput ref="announceTitleEl" v-model="title" :large="false">
<template #label>{{ i18n.ts.title }}&nbsp;<button v-tooltip="i18n.ts.emoji" :class="['_button']" @click="insertEmoji"><i class="ti ti-mood-happy"></i></button></template>
</MkInput>
<MkTextarea v-model="text">
<template #label>{{ i18n.ts.text }}</template>
@ -39,6 +42,15 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ i18n.ts._announcement.needConfirmationToRead }}
<template #caption>{{ i18n.ts._announcement.needConfirmationToReadDescription }}</template>
</MkSwitch>
<MkInput v-model="closeDuration" type="number">
<template #label>{{ i18n.ts.dialogCloseDuration }}</template>
<template #suffix>{{ i18n.ts._time.second }}</template>
</MkInput>
<MkInput v-model="displayOrder" type="number">
<template #label>{{ i18n.ts.displayOrder }}</template>
</MkInput>
<p v-if="readCount">{{ i18n.t('nUsersRead', { n: readCount }) }}</p>
<MkUserCardMini v-if="props.user.id" :user="props.user"></MkUserCardMini>
<MkButton v-if="announcement" danger @click="del()"><i class="ti ti-trash"></i> {{ i18n.ts.delete }}</MkButton>
</div>
</MkSpacer>
@ -50,35 +62,44 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
import { } from 'vue';
import * as misskey from 'misskey-js';
import MkModalWindow from '@/components/MkModalWindow.vue';
import MkButton from '@/components/MkButton.vue';
import MkInput from '@/components/MkInput.vue';
import * as os from '@/os';
import { i18n } from '@/i18n';
import MkTextarea from '@/components/MkTextarea.vue';
import MkSwitch from '@/components/MkSwitch.vue';
import MkButton from '@/components/MkButton.vue';
import MkInput from '@/components/MkInput.vue';
import MkModalWindow from '@/components/MkModalWindow.vue';
import MkRadios from '@/components/MkRadios.vue';
import MkSwitch from '@/components/MkSwitch.vue';
import MkTextarea from '@/components/MkTextarea.vue';
import MkUserCardMini from '@/components/MkUserCardMini.vue';
const props = defineProps<{
user: misskey.entities.User,
user: misskey.entities.UserLite,
announcement?: any,
}>();
let dialog = $ref(null);
let title: string = $ref(props.announcement ? props.announcement.title : '');
let text: string = $ref(props.announcement ? props.announcement.text : '');
let icon: string = $ref(props.announcement ? props.announcement.icon : 'info');
let display: string = $ref(props.announcement ? props.announcement.display : 'dialog');
let needConfirmationToRead = $ref(props.announcement ? props.announcement.needConfirmationToRead : false);
let needConfirmationToRead: boolean = $ref(props.announcement ? props.announcement.needConfirmationToRead : false);
let closeDuration: number = $ref(props.announcement ? props.announcement.closeDuration : 0);
let displayOrder: number = $ref(props.announcement ? props.announcement.displayOrder : 0);
let readCount: number = $ref(props.announcement ? props.announcement.readCount : 0);
const emit = defineEmits<{
(ev: 'done', v: { deleted?: boolean; updated?: any; created?: any }): void,
(ev: 'closed'): void
}>();
async function done() {
const dialog = $shallowRef<typeof MkModalWindow | null>(null);
const announceTitleEl = $shallowRef<HTMLInputElement | null>(null);
function insertEmoji(ev: MouseEvent): void {
os.openEmojiPicker((ev.currentTarget ?? ev.target) as HTMLElement, {}, announceTitleEl);
}
async function done(): Promise<void> {
const params = {
title: title,
text: text,
@ -86,6 +107,9 @@ async function done() {
imageUrl: null,
display: display,
needConfirmationToRead: needConfirmationToRead,
closeDuration: closeDuration,
displayOrder: displayOrder,
readCount: readCount,
userId: props.user.id,
};
@ -102,7 +126,7 @@ async function done() {
},
});
dialog.close();
dialog?.close();
} else {
const created = await os.apiWithDialog('admin/announcements/create', params);
@ -110,11 +134,11 @@ async function done() {
created: created,
});
dialog.close();
dialog?.close();
}
}
async function del() {
async function del(): Promise<void> {
const { canceled } = await os.confirm({
type: 'warning',
text: i18n.t('removeAreYouSure', { x: title }),
@ -127,7 +151,7 @@ async function del() {
emit('done', {
deleted: true,
});
dialog.close();
dialog?.close();
});
}
</script>

120
packages/frontend/src/pages/admin/announcements.vue
View file

@ -8,7 +8,22 @@ SPDX-License-Identifier: AGPL-3.0-only
<template #header><XHeader :actions="headerActions" :tabs="headerTabs"/></template>
<MkSpacer :contentMax="900">
<div class="_gaps">
<MkInfo v-if="announcements.length > 5" warn>{{ i18n.ts._announcement.tooManyActiveAnnouncementDescription }}</MkInfo>
<MkFolder>
<template #label>{{ i18n.ts.options }}</template>
<MkFolder>
<template #label>{{ i18n.ts.specifyUser }}</template>
<template v-if="user" #suffix>@{{ user.username }}</template>
<div style="text-align: center;" class="_gaps">
<div v-if="user">@{{ user.username }}</div>
<div>
<MkButton v-if="user == null" primary rounded inline @click="selectUserFilter">{{ i18n.ts.selectUser }}</MkButton>
<MkButton v-else danger rounded inline @click="user = null">{{ i18n.ts.remove }}</MkButton>
</div>
</div>
</MkFolder>
</MkFolder>
<MkFolder v-for="announcement in announcements" :key="announcement.id ?? announcement._id" :defaultOpen="announcement.id == null">
<template #label>{{ announcement.title }}</template>
@ -21,8 +36,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<template #caption>{{ announcement.text }}</template>
<div class="_gaps_m">
<MkInput v-model="announcement.title">
<template #label>{{ i18n.ts.title }}</template>
<MkInput ref="announceTitleEl" v-model="announcement.title" :large="false">
<template #label>{{ i18n.ts.title }}&nbsp;<button v-tooltip="i18n.ts.emoji" :class="['_button']" @click="insertEmoji"><i class="ti ti-mood-happy"></i></button></template>
</MkInput>
<MkTextarea v-model="announcement.text">
<template #label>{{ i18n.ts.text }}</template>
@ -49,40 +64,69 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkSwitch v-model="announcement.needConfirmationToRead" :helpText="i18n.ts._announcement.needConfirmationToReadDescription">
{{ i18n.ts._announcement.needConfirmationToRead }}
</MkSwitch>
<p v-if="announcement.reads">{{ i18n.t('nUsersRead', { n: announcement.reads }) }}</p>
<MkInput v-model="announcement.closeDuration" type="number">
<template #label>{{ i18n.ts.dialogCloseDuration }}</template>
<template #suffix>{{ i18n.ts._time.second }}</template>
</MkInput>
<MkInput v-model="announcement.displayOrder" type="number">
<template #label>{{ i18n.ts.displayOrder }}</template>
</MkInput>
<p v-if="announcement.readCount">{{ i18n.t('nUsersRead', { n: announcement.readCount }) }}</p>
<MkUserCardMini v-if="announcement.userId" :user="announcement.user" @click="editUser(announcement)"></MkUserCardMini>
<MkButton v-else class="button" inline primary @click="editUser(announcement)">{{ i18n.ts.specifyUser }}</MkButton>
<div class="buttons _buttons">
<MkButton class="button" inline primary @click="save(announcement)"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
<MkButton v-if="announcement.id != null" class="button" inline @click="archive(announcement)"><i class="ti ti-check"></i> {{ i18n.ts._announcement.end }} ({{ i18n.ts.archive }})</MkButton>
<MkButton v-if="announcement.id == null || announcement.isActive" class="button" inline primary @click="save(announcement)"><i class="ti ti-device-floppy"></i> {{ i18n.ts.save }}</MkButton>
<MkButton v-if="announcement.id != null && announcement.isActive" class="button" inline @click="archive(announcement)"><i class="ti ti-check"></i> {{ i18n.ts._announcement.end }} ({{ i18n.ts.archive }})</MkButton>
<MkButton v-if="announcement.id != null" class="button" inline danger @click="del(announcement)"><i class="ti ti-trash"></i> {{ i18n.ts.delete }}</MkButton>
</div>
</div>
</MkFolder>
<MkButton v-if="hasMore" :class="$style.more" :disabled="!hasMore" primary rounded @click="fetch()">{{ i18n.ts.loadMore }}</MkButton>
</div>
</MkSpacer>
</MkStickyContainer>
</template>
<script lang="ts" setup>
import { } from 'vue';
import { ref, watch } from 'vue';
import * as misskey from 'misskey-js';
import XHeader from './_header_.vue';
import MkButton from '@/components/MkButton.vue';
import MkInput from '@/components/MkInput.vue';
import MkTextarea from '@/components/MkTextarea.vue';
import MkSwitch from '@/components/MkSwitch.vue';
import MkRadios from '@/components/MkRadios.vue';
import MkInfo from '@/components/MkInfo.vue';
import * as os from '@/os';
import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata';
import MkButton from '@/components/MkButton.vue';
import MkFolder from '@/components/MkFolder.vue';
import MkInput from '@/components/MkInput.vue';
import MkRadios from '@/components/MkRadios.vue';
import MkSwitch from '@/components/MkSwitch.vue';
import MkTextarea from '@/components/MkTextarea.vue';
import MkUserCardMini from '@/components/MkUserCardMini.vue';
const announceTitleEl = $shallowRef<HTMLInputElement | null>(null);
const user = ref<misskey.entities.UserLite | null>(null);
const offset = ref(0);
const hasMore = ref(false);
let announcements: any[] = $ref([]);
os.api('admin/announcements/list').then(announcementResponse => {
announcements = announcementResponse;
});
function selectUserFilter(): void {
os.selectUser().then(_user => {
user.value = _user;
});
}
function add() {
function editUser(announcement): void {
os.selectUser().then(_user => {
announcement.userId = _user.id;
announcement.user = _user;
});
}
function insertEmoji(ev: MouseEvent): void {
os.openEmojiPicker((ev.currentTarget ?? ev.target) as HTMLElement, {}, announceTitleEl);
}
function add(): void {
announcements.unshift({
_id: Math.random().toString(36),
id: null,
@ -93,10 +137,12 @@ function add() {
display: 'normal',
forExistingUsers: false,
needConfirmationToRead: false,
closeDuration: 0,
displayOrder: 0,
});
}
function del(announcement) {
function del(announcement): void {
os.confirm({
type: 'warning',
text: i18n.t('deleteAreYouSure', { x: announcement.title }),
@ -107,30 +153,43 @@ function del(announcement) {
});
}
async function archive(announcement) {
async function archive(announcement): Promise<void> {
await os.apiWithDialog('admin/announcements/update', {
...announcement,
isActive: false,
});
refresh();
fetch(true);
}
async function save(announcement) {
async function save(announcement): Promise<void> {
if (announcement.id == null) {
await os.apiWithDialog('admin/announcements/create', announcement);
refresh();
} else {
os.apiWithDialog('admin/announcements/update', announcement);
await os.apiWithDialog('admin/announcements/update', announcement);
}
fetch(true);
}
function refresh() {
os.api('admin/announcements/list').then(announcementResponse => {
announcements = announcementResponse;
function fetch(resetOffset = false): void {
if (resetOffset) {
announcements = [];
offset.value = 0;
}
os.api('admin/announcements/list', {
offsetMode: true,
offset: offset.value,
limit: 10,
userId: user.value?.id,
}).then(announcementResponse => {
announcements = announcements.concat(announcementResponse);
hasMore.value = announcementResponse?.length === 10;
offset.value += announcements.length;
});
}
refresh();
watch(user, () => fetch(true));
fetch(true);
const headerActions = $computed(() => [{
asFullButton: true,
@ -146,3 +205,10 @@ definePageMetadata({
icon: 'ti ti-speakerphone',
});
</script>
<style lang="scss" module>
.more {
margin-left: auto;
margin-right: auto;
}
</style>

34
packages/frontend/src/pages/announcements.vue
View file

@ -20,7 +20,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<i v-else-if="announcement.icon === 'error'" class="ti ti-circle-x" style="color: var(--error);"></i>
<i v-else-if="announcement.icon === 'success'" class="ti ti-check" style="color: var(--success);"></i>
</span>
<span>{{ announcement.title }}</span>
<Mfm :text="announcement.title"/>
</div>
<div :class="$style.content">
<Mfm :text="announcement.text"/>
@ -40,17 +40,18 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
import { } from 'vue';
import MkPagination from '@/components/MkPagination.vue';
import MkButton from '@/components/MkButton.vue';
import MkInfo from '@/components/MkInfo.vue';
import { ref, watch } from 'vue';
import * as os from '@/os';
import { i18n } from '@/i18n';
import { definePageMetadata } from '@/scripts/page-metadata';
import { $i, updateAccount } from '@/account';
import MkPagination from '@/components/MkPagination.vue';
import MkButton from '@/components/MkButton.vue';
import MkInfo from '@/components/MkInfo.vue';
const paginationCurrent = {
endpoint: 'announcements' as const,
offsetMode: true,
limit: 10,
params: {
isActive: true,
@ -59,6 +60,7 @@ const paginationCurrent = {
const paginationPast = {
endpoint: 'announcements' as const,
offsetMode: true,
limit: 10,
params: {
isActive: false,
@ -66,10 +68,9 @@ const paginationPast = {
};
const paginationEl = ref<InstanceType<typeof MkPagination>>();
const tab = ref('current');
async function read(announcement) {
async function read(announcement): Promise<void> {
if (announcement.needConfirmationToRead) {
const confirm = await os.confirm({
type: 'question',
@ -84,10 +85,12 @@ async function read(announcement) {
a.isRead = true;
return a;
});
os.api('i/read-announcement', { announcementId: announcement.id });
updateAccount({
unreadAnnouncements: $i!.unreadAnnouncements.filter(a => a.id !== announcement.id),
});
await os.api('i/read-announcement', { announcementId: announcement.id });
if ($i) {
updateAccount({
unreadAnnouncements: $i.unreadAnnouncements.filter((a: { id: string; }) => a.id !== announcement.id),
});
}
}
const headerActions = $computed(() => []);
@ -106,6 +109,15 @@ definePageMetadata({
title: i18n.ts.announcements,
icon: 'ti ti-speakerphone',
});
const unreadCount = ref($i?.unreadAnnouncements.length ?? 0);
watch(() => $i?.unreadAnnouncements.length ?? 0, () => {
// 未読が増えた場合はリロード
if (($i?.unreadAnnouncements.length ?? 0) > unreadCount.value) {
paginationEl.value?.reload();
}
unreadCount.value = $i?.unreadAnnouncements.length ?? 0;
});
</script>
<style lang="scss" module>

51
packages/frontend/src/pages/user-info.vue
View file

@ -139,7 +139,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div class="_gaps">
<MkButton primary rounded @click="createAnnouncement"><i class="ti ti-plus"></i> {{ i18n.ts.new }}</MkButton>
<MkPagination :pagination="announcementsPagination">
<MkPagination ref="announcementsPaginationEl" :pagination="announcementsPagination">
<template #default="{ items }">
<div class="_gaps_s">
<div v-for="announcement in items" :key="announcement.id" v-panel :class="$style.announcementItem" @click="editAnnouncement(announcement)">
@ -211,29 +211,30 @@ SPDX-License-Identifier: AGPL-3.0-only
</template>
<script lang="ts" setup>
import { computed, defineAsyncComponent, watch } from 'vue';
import { computed, defineAsyncComponent, ref, watch } from 'vue';
import * as misskey from 'misskey-js';
import MkChart from '@/components/MkChart.vue';
import MkObjectView from '@/components/MkObjectView.vue';
import MkTextarea from '@/components/MkTextarea.vue';
import MkSwitch from '@/components/MkSwitch.vue';
import FormLink from '@/components/form/link.vue';
import FormSection from '@/components/form/section.vue';
import MkButton from '@/components/MkButton.vue';
import MkFolder from '@/components/MkFolder.vue';
import MkKeyValue from '@/components/MkKeyValue.vue';
import MkSelect from '@/components/MkSelect.vue';
import FormSuspense from '@/components/form/suspense.vue';
import MkFileListForAdmin from '@/components/MkFileListForAdmin.vue';
import MkInfo from '@/components/MkInfo.vue';
import * as os from '@/os';
import { url } from '@/config';
import { userPage, acct } from '@/filters/user';
import { definePageMetadata } from '@/scripts/page-metadata';
import { i18n } from '@/i18n';
import { iAmAdmin, iAmModerator, $i } from '@/account';
import FormLink from '@/components/form/link.vue';
import FormSection from '@/components/form/section.vue';
import FormSuspense from '@/components/form/suspense.vue';
import MkButton from '@/components/MkButton.vue';
import MkChart from '@/components/MkChart.vue';
import MkFileListForAdmin from '@/components/MkFileListForAdmin.vue';
import MkFolder from '@/components/MkFolder.vue';
import MkInfo from '@/components/MkInfo.vue';
import MkKeyValue from '@/components/MkKeyValue.vue';
import MkObjectView from '@/components/MkObjectView.vue';
import MkPagination from '@/components/MkPagination.vue';
import MkRolePreview from '@/components/MkRolePreview.vue';
import MkPagination, { Paging } from '@/components/MkPagination.vue';
import MkSelect from '@/components/MkSelect.vue';
import MkSwitch from '@/components/MkSwitch.vue';
import MkTextarea from '@/components/MkTextarea.vue';
import { updateColumn } from '@/ui/deck/deck-store';
const props = withDefaults(defineProps<{
userId: string;
@ -261,8 +262,10 @@ const filesPagination = {
userId: props.userId,
})),
};
const announcementsPaginationEl = ref<InstanceType<typeof MkPagination>>();
const announcementsPagination = {
endpoint: 'admin/announcements/list' as const,
offsetMode: true,
limit: 10,
params: computed(() => ({
userId: props.userId,
@ -442,17 +445,25 @@ function toggleRoleItem(role) {
}
}
function createAnnouncement() {
function createAnnouncement(): void {
os.popup(defineAsyncComponent(() => import('@/components/MkUserAnnouncementEditDialog.vue')), {
user,
}, {}, 'closed');
}, {
done: async () => {
announcementsPaginationEl.value?.reload();
},
}, 'closed');
}
function editAnnouncement(announcement) {
function editAnnouncement(announcement): void {
os.popup(defineAsyncComponent(() => import('@/components/MkUserAnnouncementEditDialog.vue')), {
user,
announcement,
}, {}, 'closed');
}, {
done: async () => {
announcementsPaginationEl.value?.reload();
},
}, 'closed');
}
watch(() => props.userId, () => {

1
packages/frontend/src/ui/visitor.vue
View file

@ -96,6 +96,7 @@ provideMetadataReceiver((info) => {
const announcements = {
endpoint: 'announcements',
offsetMode: true,
limit: 10,
};

7
packages/misskey-js/etc/misskey-js.api.md
View file

@ -33,6 +33,8 @@ type Announcement = {
display: 'normal' | 'banner' | 'dialog';
icon: 'info' | 'warning' | 'error' | 'success';
needConfirmationToRead: boolean;
closeDuration: number;
displayOrder: number;
forYou: boolean;
isRead?: boolean;
};
@ -568,10 +570,9 @@ export type Endpoints = {
};
'announcements': {
req: {
isActive?: boolean;
limit?: number;
withUnreads?: boolean;
sinceId?: Announcement['id'];
untilId?: Announcement['id'];
offset?: number;
};
res: Announcement[];
};

2
packages/misskey-js/src/api.types.ts
View file

@ -77,7 +77,7 @@ export type Endpoints = {
'admin/relays/remove': { req: TODO; res: TODO; };
// announcements
'announcements': { req: { limit?: number; withUnreads?: boolean; sinceId?: Announcement['id']; untilId?: Announcement['id']; }; res: Announcement[]; };
'announcements': { req: { isActive?: boolean; limit?: number; offset?: number; }; res: Announcement[]; };
// antennas
'antennas/create': { req: TODO; res: Antenna; };

2
packages/misskey-js/src/entities.ts
View file

@ -422,6 +422,8 @@ export type Announcement = {
display: 'normal' | 'banner' | 'dialog';
icon: 'info' | 'warning' | 'error' | 'success';
needConfirmationToRead: boolean;
closeDuration: number;
displayOrder: number;
forYou: boolean;
isRead?: boolean;
};