Merge branch 'develop'

* New translations ja-JP.yml (Ukrainian)

* New translations ja-JP.yml (Ukrainian)

* New translations ja-JP.yml (Ukrainian)

* New translations ja-JP.yml (Ukrainian)

* New translations ja-JP.yml (Ukrainian)

CHANGELOG.md

@@ -9,6 +9,21 @@
 You should also include the user name that made the change.
 -->
 
+## 13.2.3 (2023/01/26)
+### Improvements
+- カスタム絵文字の更新をリアルタイムで反映するように
+
+### Bugfixes
+- turnstile-failed: missing-input-secret
+
+## 13.2.2 (2023/01/25)
+### Improvements
+- サーバーのパフォーマンスを改善
+
+### Bugfixes
+- サインイン時に誤ったレートリミットがかかることがある問題を修正
+- MFMのposition、rotate、scaleで小数が使えない問題を修正
+
 ## 13.2.1 (2023/01/24)
 ### Improvements
 - デザインの調整

locales/uk-UA.yml

@@ -901,6 +901,7 @@ show: "Відображення"
 color: "Колір"
 achievements: "Досягнення"
 _achievements:
+  earnedAt: "Відкрито"
   _types:
     _notes1:
       title: "налаштовую свій msky"
@@ -954,35 +955,100 @@ _achievements:
       flavor: "Так багато потрібно сказати?"
     _login3:
       title: "Новачок I"
+      description: "3 дні користування загально"
+      flavor: "Відсьогодні називайте мене \"Місскіст\""
     _login7:
       title: "Новачок II"
+      description: "7 днів користування загально"
+      flavor: "Ви звикли до цього?"
     _login15:
       title: "Новачок III"
+      description: "15 днів користування загально"
     _login30:
       title: "Міскієць I"
+      description: "30 днів користування загально"
     _login60:
       title: "Міскієць II"
+      description: "60 днів користування загально"
     _login100:
       title: "Міскієць III"
+      description: "100 днів користування загально"
+      flavor: "Цей юзер лютий місскіст"
     _login200:
       title: "Завсідник I"
+      description: "200 днів користування загально"
     _login300:
       title: "Завсідник II"
+      description: "300 днів користування загально"
     _login400:
       title: "Завсідник III"
+      description: "400 днів користування загально"
     _login500:
       title: "Ветеран I"
+      description: "500 днів користування загально"
+      flavor: "Meine Kameraden, ich liebe sie, die Notizen."
     _login600:
       title: "Ветеран II"
+      description: "600 днів користування загально"
     _login700:
       title: "Ветеран III"
+      description: "700 днів користування загально"
+    _login800:
+      title: "Майстер нотаток I"
+      description: "800 днів користування загально"
+    _login900:
+      title: "Майстер нотаток II"
+      description: "900 днів користування загально"
     _login1000:
+      title: "Майстер нотаток III"
+      description: "1000 днів користування загально"
       flavor: "Дякуємо, що користуєтеся Misskey!"
+    _myNoteFavorited1:
+      title: "У пошуках зірок"
+    _markedAsCat:
+      flavor: "Я дам тобі ім'я пізніше"
+    _following1:
+      title: "Перша підписка"
+    _following10:
+      title: "Продовжуй, продовжуй"
+    _following50:
+      title: "Багато друзів"
+      description: "Кількість підписок сягнула 50"
+    _following100:
+      title: "100 друзів"
+      description: "Кількість підписок сягнула 100"
+    _following300:
+      title: "Надлишок друзів"
+      description: "Кількість підписок сягнула 300"
+    _followers1:
+      title: "Перший підписник"
+      description: "З'явився перший підписник"
+    _followers10:
+      title: "Follow me!"
+      description: "Кількість підписників досягла 10"
+    _followers50:
+      description: "Кількість підписників досягла 50"
+    _followers100:
+      title: "Популярна особа"
+      description: "Кількість підписників досягла 100"
+    _followers300:
+      description: "Кількість підписників досягла 300"
+    _followers500:
+      description: "Кількість підписників досягла 500"
+    _followers1000:
+      title: "Інфлюенсер"
+      description: "Кількість підписників досягла 1000"
+    _passedSinceAccountCreated1:
+      title: "Перша річниця"
+    _passedSinceAccountCreated2:
+      title: "Друга річниця"
     _passedSinceAccountCreated3:
+      title: "Третя річниця"
       description: "Минуло 3 роки з моменту створення акаунта"
     _loggedInOnBirthday:
       title: "З Днем народження!"
     _brainDiver:
+      title: "Brain Diver"
       flavor: "Misskey-Misskey La-Tu-Ma"
 _role:
   priority: "Пріоритет"

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "misskey",
-	"version": "13.2.1",
+	"version": "13.2.3",
 	"codename": "nasubi",
 	"repository": {
 		"type": "git",

packages/backend/package.json

@@ -63,7 +63,7 @@
 		"file-type": "18.2.0",
 		"fluent-ffmpeg": "2.1.2",
 		"form-data": "^4.0.0",
-		"got": "12.5.3",
+		"got": "^12.5.3",
 		"hpagent": "1.2.0",
 		"ioredis": "4.28.5",
 		"ip-cidr": "3.0.11",
@@ -119,14 +119,14 @@
 		"typeorm": "0.3.11",
 		"typescript": "4.9.4",
 		"ulid": "2.3.0",
-		"undici": "^5.16.0",
 		"unzipper": "0.10.11",
 		"uuid": "9.0.0",
 		"vary": "1.1.2",
 		"web-push": "3.5.0",
 		"websocket": "1.0.34",
 		"ws": "8.12.0",
-		"xev": "3.0.2"
+		"xev": "3.0.2",
+		"node-fetch": "3.3.0"
 	},
 	"devDependencies": {
 		"@redocly/openapi-core": "1.0.0-beta.120",
@@ -182,7 +182,6 @@
 		"eslint-plugin-import": "2.27.5",
 		"execa": "6.1.0",
 		"jest": "29.3.1",
-		"jest-mock": "^29.3.1",
-		"node-fetch": "3.3.0"
+		"jest-mock": "^29.3.1"
 	}
 }

packages/backend/src/core/AntennaService.ts

@@ -77,10 +77,16 @@ export class AntennaService implements OnApplicationShutdown {
 			const { type, body } = obj.message as StreamMessages['internal']['payload'];
 			switch (type) {
 				case 'antennaCreated':
-					this.antennas.push(body);
+					this.antennas.push({
+						...body,
+						createdAt: new Date(body.createdAt),
+					});
 					break;
 				case 'antennaUpdated':
-					this.antennas[this.antennas.findIndex(a => a.id === body.id)] = body;
+					this.antennas[this.antennas.findIndex(a => a.id === body.id)] = {
+						...body,
+						createdAt: new Date(body.createdAt),
+					};
 					break;
 				case 'antennaDeleted':
 					this.antennas = this.antennas.filter(a => a.id !== body.id);

packages/backend/src/core/CaptchaService.ts

@@ -21,18 +21,13 @@ export class CaptchaService {
 			response,
 		});
 	
-		const res = await this.httpRequestService.fetch(
-			url,
-			{
-				method: 'POST',
-				body: params,
+		const res = await this.httpRequestService.send(url, {
+			method: 'POST',
+			body: params.toString(),
+			headers: {
+				'Content-Type': 'application/x-www-form-urlencoded',
 			},
-			{
-				noOkError: true,
-			}
-		).catch(err => {
-			throw `${err.message ?? err}`;
-		});
+		}, { throwErrorWhenResponseNotOk: false });
 	
 		if (!res.ok) {
 			throw `${res.status}`;

packages/backend/src/core/CustomEmojiService.ts

@@ -2,6 +2,8 @@ import { Inject, Injectable } from '@nestjs/common';
 import { DataSource, In, IsNull } from 'typeorm';
 import { DI } from '@/di-symbols.js';
 import { IdService } from '@/core/IdService.js';
+import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
+import { GlobalEventService } from '@/core/GlobalEventService.js';
 import type { DriveFile } from '@/models/entities/DriveFile.js';
 import type { Emoji } from '@/models/entities/Emoji.js';
 import type { EmojisRepository } from '@/models/index.js';
@@ -17,6 +19,8 @@ export class CustomEmojiService {
 		private emojisRepository: EmojisRepository,
 
 		private idService: IdService,
+		private emojiEntityService: EmojiEntityService,
+		private globalEventService: GlobalEventService,
 	) {
 	}
 
@@ -42,6 +46,10 @@ export class CustomEmojiService {
 
 		await this.db.queryResultCache!.remove(['meta_emojis']);
 
+		this.globalEventService.publishBroadcastStream('emojiAdded', {
+			emoji: await this.emojiEntityService.pack(emoji.id),
+		});
+
 		return emoji;
 	}
 }

packages/backend/src/core/DownloadService.ts

@@ -5,10 +5,10 @@ import { Inject, Injectable } from '@nestjs/common';
 import IPCIDR from 'ip-cidr';
 import PrivateIp from 'private-ip';
 import chalk from 'chalk';
-import { buildConnector } from 'undici';
+import got, * as Got from 'got';
 import { DI } from '@/di-symbols.js';
 import type { Config } from '@/config.js';
-import { HttpRequestService, UndiciFetcher } from '@/core/HttpRequestService.js';
+import { HttpRequestService } from '@/core/HttpRequestService.js';
 import { createTemp } from '@/misc/create-temp.js';
 import { StatusError } from '@/misc/status-error.js';
 import { LoggerService } from '@/core/LoggerService.js';
@@ -20,7 +20,6 @@ import { bindThis } from '@/decorators.js';
 @Injectable()
 export class DownloadService {
 	private logger: Logger;
-	private undiciFetcher: UndiciFetcher;
 
 	constructor(
 		@Inject(DI.config)
@@ -30,21 +29,6 @@ export class DownloadService {
 		private loggerService: LoggerService,
 	) {
 		this.logger = this.loggerService.getLogger('download');
-
-		this.undiciFetcher = this.httpRequestService.createFetcher({
-			connect: process.env.NODE_ENV === 'development' ?
-				this.httpRequestService.clientDefaults.connect
-				:
-				this.httpRequestService.getConnectorWithIpCheck(
-					buildConnector({
-						...this.httpRequestService.clientDefaults.connect,
-					}),
-					(ip) => !this.isPrivateIp(ip),
-				),
-			bodyTimeout: 30 * 1000,
-		}, {
-			connect: this.httpRequestService.clientDefaults.connect,
-		}, this.logger);
 	}
 
 	@bindThis
@@ -55,14 +39,60 @@ export class DownloadService {
 		const operationTimeout = 60 * 1000;
 		const maxSize = this.config.maxFileSize ?? 262144000;
 
-		const response = await this.undiciFetcher.fetch(url);
+		const req = got.stream(url, {
+			headers: {
+				'User-Agent': this.config.userAgent,
+			},
+			timeout: {
+				lookup: timeout,
+				connect: timeout,
+				secureConnect: timeout,
+				socket: timeout,	// read timeout
+				response: timeout,
+				send: timeout,
+				request: operationTimeout,	// whole operation timeout
+			},
+			agent: {
+				http: this.httpRequestService.httpAgent,
+				https: this.httpRequestService.httpsAgent,
+			},
+			http2: false,	// default
+			retry: {
+				limit: 0,
+			},
+		}).on('response', (res: Got.Response) => {
+			if ((process.env.NODE_ENV === 'production' || process.env.NODE_ENV === 'test') && !this.config.proxy && res.ip) {
+				if (this.isPrivateIp(res.ip)) {
+					this.logger.warn(`Blocked address: ${res.ip}`);
+					req.destroy();
+				}
+			}
 
-		if (response.body === null) {
-			throw new StatusError('No body', 400, 'No body');
+			const contentLength = res.headers['content-length'];
+			if (contentLength != null) {
+				const size = Number(contentLength);
+				if (size > maxSize) {
+					this.logger.warn(`maxSize exceeded (${size} > ${maxSize}) on response`);
+					req.destroy();
+				}
+			}
+		}).on('downloadProgress', (progress: Got.Progress) => {
+			if (progress.transferred > maxSize) {
+				this.logger.warn(`maxSize exceeded (${progress.transferred} > ${maxSize}) on downloadProgress`);
+				req.destroy();
+			}
+		});
+
+		try {
+			await pipeline(req, fs.createWriteStream(path));
+		} catch (e) {
+			if (e instanceof Got.HTTPError) {
+				throw new StatusError(`${e.response.statusCode} ${e.response.statusMessage}`, e.response.statusCode, e.response.statusMessage);
+			} else {
+				throw e;
+			}
 		}
 
-		await pipeline(stream.Readable.fromWeb(response.body), fs.createWriteStream(path));
-
 		this.logger.succ(`Download finished: ${chalk.cyan(url)}`);
 	}
 

packages/backend/src/core/FetchInstanceMetadataService.ts

@@ -2,6 +2,7 @@ import { URL } from 'node:url';
 import { Inject, Injectable } from '@nestjs/common';
 import { JSDOM } from 'jsdom';
 import tinycolor from 'tinycolor2';
+import fetch from 'node-fetch';
 import type { Instance } from '@/models/entities/Instance.js';
 import type { InstancesRepository } from '@/models/index.js';
 import { AppLockService } from '@/core/AppLockService.js';
@@ -190,7 +191,9 @@ export class FetchInstanceMetadataService {
 	
 		const faviconUrl = url + '/favicon.ico';
 	
-		const favicon = await this.httpRequestService.fetch(faviconUrl, {}, { noOkError: true });
+		const favicon = await this.httpRequestService.send(faviconUrl, {
+			method: 'HEAD',
+		}, { throwErrorWhenResponseNotOk: false });
 	
 		if (favicon.ok) {
 			return faviconUrl;

packages/backend/src/core/HttpRequestService.ts

@@ -1,284 +1,67 @@
 import * as http from 'node:http';
 import * as https from 'node:https';
-import { LookupFunction } from 'node:net';
 import CacheableLookup from 'cacheable-lookup';
+import fetch from 'node-fetch';
 import { HttpProxyAgent, HttpsProxyAgent } from 'hpagent';
 import { Inject, Injectable } from '@nestjs/common';
-import * as undici from 'undici';
 import { DI } from '@/di-symbols.js';
 import type { Config } from '@/config.js';
 import { StatusError } from '@/misc/status-error.js';
 import { bindThis } from '@/decorators.js';
-import { LoggerService } from '@/core/LoggerService.js';
-import type Logger from '@/logger.js';
-
-// true to allow, false to deny
-export type IpChecker = (ip: string) => boolean;
-
-/* 
- *  Child class to create and save Agent for fetch.
- *  You should construct this when you want
- *  to change timeout, size limit, socket connect function, etc.
- */
-export class UndiciFetcher {
-	/**
-	 * Get http non-proxy agent (undici)
-	 */
-	public nonProxiedAgent: undici.Agent;
-
-	/**
-	 * Get http proxy or non-proxy agent (undici)
-	 */
-	public agent: undici.ProxyAgent | undici.Agent;
-
-	private proxyBypassHosts: string[];
-	private userAgent: string | undefined;
-
-	private logger: Logger | undefined;
-
-	constructor(
-		args: {
-			agentOptions: undici.Agent.Options;
-			proxy?: {
-				uri: string;
-				options?: undici.Agent.Options; // Override of agentOptions
-			},
-			proxyBypassHosts?: string[];
-			userAgent?: string;
-		},
-		logger?: Logger,
-	) {
-		this.logger = logger;
-		this.logger?.debug('UndiciFetcher constructor', args);
-
-		this.proxyBypassHosts = args.proxyBypassHosts ?? [];
-		this.userAgent = args.userAgent;
-
-		this.nonProxiedAgent = new undici.Agent({
-			...args.agentOptions,
-			connect: (process.env.NODE_ENV !== 'production' && typeof args.agentOptions.connect !== 'function')
-				? (options, cb) => {
-					// Custom connector for debug
-					undici.buildConnector(args.agentOptions.connect as undici.buildConnector.BuildOptions)(options, (err, socket) => {
-						this.logger?.debug('Socket connector called', socket);
-						if (err) {
-							this.logger?.debug('Socket error', err);
-							cb(new Error(`Error while socket connecting\n${err}`), null);
-							return;
-						}
-						this.logger?.debug(`Socket connected: port ${socket.localPort} => remote ${socket.remoteAddress}`);
-						cb(null, socket);
-					});
-				} : args.agentOptions.connect,
-		});
-
-		this.agent = args.proxy
-			? new undici.ProxyAgent({
-				...args.agentOptions,
-				...args.proxy.options,
-
-				uri: args.proxy.uri,
-
-				connect: (process.env.NODE_ENV !== 'production' && typeof (args.proxy.options?.connect ?? args.agentOptions.connect) !== 'function')
-					? (options, cb) => {
-						// Custom connector for debug
-						undici.buildConnector((args.proxy?.options?.connect ?? args.agentOptions.connect) as undici.buildConnector.BuildOptions)(options, (err, socket) => {
-							this.logger?.debug('Socket connector called (secure)', socket);
-							if (err) {
-								this.logger?.debug('Socket error', err);
-								cb(new Error(`Error while socket connecting\n${err}`), null);
-								return;
-							}
-							this.logger?.debug(`Socket connected (secure): port ${socket.localPort} => remote ${socket.remoteAddress}`);
-							cb(null, socket);
-						});
-					} : (args.proxy.options?.connect ?? args.agentOptions.connect),
-			})
-			: this.nonProxiedAgent;
-	}
-
-	/**
-	 * Get agent by URL
-	 * @param url URL
-	 * @param bypassProxy Allways bypass proxy
-	 */
-	@bindThis
-	public getAgentByUrl(url: URL, bypassProxy = false): undici.Agent | undici.ProxyAgent {
-		if (bypassProxy || this.proxyBypassHosts.includes(url.hostname)) {
-			return this.nonProxiedAgent;
-		} else {
-			return this.agent;
-		}
-	}
-
-	@bindThis
-	public async fetch(
-		url: string | URL,
-		options: undici.RequestInit = {},
-		privateOptions: { noOkError?: boolean; bypassProxy?: boolean; } = { noOkError: false, bypassProxy: false },
-	): Promise<undici.Response> {
-		const res = await undici.fetch(url, {
-			dispatcher: this.getAgentByUrl(new URL(url), privateOptions.bypassProxy),
-			...options,
-			headers: {
-				'User-Agent': this.userAgent ?? '',
-				...(options.headers ?? {}),
-			},
-		}).catch((err) => {
-			this.logger?.error(`fetch error to ${typeof url === 'string' ? url : url.href}`, err);
-			throw new StatusError('Resource Unreachable', 500, 'Resource Unreachable');
-		});
-		if (!res.ok && !privateOptions.noOkError) {
-			throw new StatusError(`${res.status} ${res.statusText}`, res.status, res.statusText);
-		}
-		return res;
-	}
-
-	@bindThis
-	public async request(
-		url: string | URL,
-		options: { dispatcher?: undici.Dispatcher } & Omit<undici.Dispatcher.RequestOptions, 'origin' | 'path' | 'method'> & Partial<Pick<undici.Dispatcher.RequestOptions, 'method'>> = {},
-		privateOptions: { noOkError?: boolean; bypassProxy?: boolean; } = { noOkError: false, bypassProxy: false },
-	): Promise<undici.Dispatcher.ResponseData> {
-		const res = await undici.request(url, {
-			dispatcher: this.getAgentByUrl(new URL(url), privateOptions.bypassProxy),
-			...options,
-			headers: {
-				'user-agent': this.userAgent ?? '',
-				...(options.headers ?? {}),
-			},
-		}).catch((err) => {
-			this.logger?.error(`fetch error to ${typeof url === 'string' ? url : url.href}`, err);
-			throw new StatusError('Resource Unreachable', 500, 'Resource Unreachable');
-		});
-
-		if (res.statusCode >= 400) {
-			throw new StatusError(`${res.statusCode}`, res.statusCode, '');
-		}
-
-		return res;
-	}
-
-	@bindThis
-	public async getJson<T extends unknown>(url: string, accept = 'application/json, */*', headers?: Record<string, string>): Promise<T> {
-		const { body } = await this.request( 
-			url,
-			{
-				headers: Object.assign({
-					Accept: accept,
-				}, headers ?? {}),
-			},
-		);
-
-		return await body.json() as T;
-	}
-
-	@bindThis
-	public async getHtml(url: string, accept = 'text/html, */*', headers?: Record<string, string>): Promise<string> {
-		const { body } = await this.request(
-			url,
-			{
-				headers: Object.assign({
-					Accept: accept,
-				}, headers ?? {}),
-			},
-		);
-
-		return await body.text();
-	}
-}
+import type { Response } from 'node-fetch';
+import type { URL } from 'node:url';
 
 @Injectable()
 export class HttpRequestService {
-	public defaultFetcher: UndiciFetcher;
-	public fetch: UndiciFetcher['fetch'];
-	public request: UndiciFetcher['request'];
-	public getHtml: UndiciFetcher['getHtml'];
-	public defaultJsonFetcher: UndiciFetcher;
-	public getJson: UndiciFetcher['getJson'];
-
-	//#region for old http/https, only used in S3Service
-	// http non-proxy agent
+	/**
+	 * Get http non-proxy agent
+	 */
 	private http: http.Agent;
 
-	// https non-proxy agent
+	/**
+	 * Get https non-proxy agent
+	 */
 	private https: https.Agent;
 
-	// http proxy or non-proxy agent
+	/**
+	 * Get http proxy or non-proxy agent
+	 */
 	public httpAgent: http.Agent;
 
-	// https proxy or non-proxy agent
+	/**
+	 * Get https proxy or non-proxy agent
+	 */
 	public httpsAgent: https.Agent;
-	//#endregion
-
-	public readonly dnsCache: CacheableLookup;
-	public readonly clientDefaults: undici.Agent.Options;
-	private maxSockets: number;
-
-	private logger: Logger;
 
 	constructor(
 		@Inject(DI.config)
 		private config: Config,
-		private loggerService: LoggerService,
 	) {
-		this.logger = this.loggerService.getLogger('http-request');
-
-		this.dnsCache = new CacheableLookup({
+		const cache = new CacheableLookup({
 			maxTtl: 3600,	// 1hours
 			errorTtl: 30,	// 30secs
 			lookup: false,	// nativeのdns.lookupにfallbackしない
 		});
-
-		this.clientDefaults = {
-			keepAliveTimeout: 30 * 1000,
-			keepAliveMaxTimeout: 10 * 60 * 1000,
-			keepAliveTimeoutThreshold: 1 * 1000,
-			strictContentLength: true,
-			headersTimeout: 10 * 1000,
-			bodyTimeout: 10 * 1000,
-			maxHeaderSize: 16364, // default
-			maxResponseSize: 10 * 1024 * 1024,
-			maxRedirections: 3,
-			connect: {
-				timeout: 10 * 1000, // コネクションが確立するまでのタイムアウト
-				maxCachedSessions: 300, // TLSセッションのキャッシュ数 https://github.com/nodejs/undici/blob/v5.14.0/lib/core/connect.js#L80
-				lookup: this.dnsCache.lookup as LookupFunction, // https://github.com/nodejs/undici/blob/v5.14.0/lib/core/connect.js#L98
-			},
-		};
-
-		this.maxSockets = Math.max(64, ((this.config.deliverJobConcurrency ?? 128) / (this.config.clusterLimit ?? 1)));
-
-		this.defaultFetcher = this.createFetcher({}, {}, this.logger);
-
-		this.fetch = this.defaultFetcher.fetch;
-		this.request = this.defaultFetcher.request;
-		this.getHtml = this.defaultFetcher.getHtml;
-
-		this.defaultJsonFetcher = this.createFetcher({
-			maxResponseSize: 1024 * 256,
-		}, {}, this.logger);
-
-		this.getJson = this.defaultJsonFetcher.getJson;
-
-		//#region for old http/https, only used in S3Service
+		
 		this.http = new http.Agent({
 			keepAlive: true,
 			keepAliveMsecs: 30 * 1000,
-			lookup: this.dnsCache.lookup,
+			lookup: cache.lookup,
 		} as http.AgentOptions);
 		
 		this.https = new https.Agent({
 			keepAlive: true,
 			keepAliveMsecs: 30 * 1000,
-			lookup: this.dnsCache.lookup,
+			lookup: cache.lookup,
 		} as https.AgentOptions);
-
+		
+		const maxSockets = Math.max(256, config.deliverJobConcurrency ?? 128);
+		
 		this.httpAgent = config.proxy
 			? new HttpProxyAgent({
 				keepAlive: true,
 				keepAliveMsecs: 30 * 1000,
-				maxSockets: this.maxSockets,
+				maxSockets,
 				maxFreeSockets: 256,
 				scheduling: 'lifo',
 				proxy: config.proxy,
@@ -289,47 +72,21 @@ export class HttpRequestService {
 			? new HttpsProxyAgent({
 				keepAlive: true,
 				keepAliveMsecs: 30 * 1000,
-				maxSockets: this.maxSockets,
+				maxSockets,
 				maxFreeSockets: 256,
 				scheduling: 'lifo',
 				proxy: config.proxy,
 			})
 			: this.https;
-		//#endregion
-	}
-
-	@bindThis
-	private getStandardUndiciFetcherOption(opts: undici.Agent.Options = {}, proxyOpts: undici.Agent.Options = {}) {
-		return {
-			agentOptions: {
-				...this.clientDefaults,
-				...opts,
-			},
-			...(this.config.proxy ? {
-				proxy: {
-					uri: this.config.proxy,
-					options: {
-						connections: this.maxSockets,
-						...proxyOpts,
-					},
-				},
-			} : {}),
-			userAgent: this.config.userAgent,
-		};
-	}
-
-	@bindThis
-	public createFetcher(opts: undici.Agent.Options = {}, proxyOpts: undici.Agent.Options = {}, logger: Logger) {
-		return new UndiciFetcher(this.getStandardUndiciFetcherOption(opts, proxyOpts), logger);
 	}
 
 	/**
-	 * Get http agent by URL
+	 * Get agent by URL
 	 * @param url URL
 	 * @param bypassProxy Allways bypass proxy
 	 */
 	@bindThis
-	public getHttpAgentByUrl(url: URL, bypassProxy = false): http.Agent | https.Agent {
+	public getAgentByUrl(url: URL, bypassProxy = false): http.Agent | https.Agent {
 		if (bypassProxy || (this.config.proxyBypassHosts || []).includes(url.hostname)) {
 			return url.protocol === 'http:' ? this.http : this.https;
 		} else {
@@ -337,37 +94,67 @@ export class HttpRequestService {
 		}
 	}
 
-	/**
-	 * check ip
-	 */
 	@bindThis
-	public getConnectorWithIpCheck(connector: undici.buildConnector.connector, checkIp: IpChecker): undici.buildConnector.connectorAsync {
-		return (options, cb) => {
-			connector(options, (err, socket) => {
-				this.logger.debug('Socket connector (with ip checker) called', socket);
-				if (err) {
-					this.logger.error('Socket error', err);
-					cb(new Error(`Error while socket connecting\n${err}`), null);
-					return;
-				}
+	public async getJson(url: string, accept = 'application/json, */*', headers?: Record<string, string>): Promise<unknown> {
+		const res = await this.send(url, {
+			method: 'GET',
+			headers: Object.assign({
+				'User-Agent': this.config.userAgent,
+				Accept: accept,
+			}, headers ?? {}),
+			timeout: 5000,
+			size: 1024 * 256,
+		});
 
-				if (socket.remoteAddress == undefined) {
-					this.logger.error('Socket error: remoteAddress is undefined');
-					cb(new Error('remoteAddress is undefined (maybe socket destroyed)'), null);
-					return;
-				}
+		return await res.json();
+	}
 
-				// allow
-				if (checkIp(socket.remoteAddress)) {
-					this.logger.debug(`Socket connected (ip ok): ${socket.localPort} => ${socket.remoteAddress}`);
-					cb(null, socket);
-					return;
-				}
+	@bindThis
+	public async getHtml(url: string, accept = 'text/html, */*', headers?: Record<string, string>): Promise<string> {
+		const res = await this.send(url, {
+			method: 'GET',
+			headers: Object.assign({
+				'User-Agent': this.config.userAgent,
+				Accept: accept,
+			}, headers ?? {}),
+			timeout: 5000,
+		});
 
-				this.logger.error('IP is not allowed', socket);
-				cb(new StatusError('IP is not allowed', 403, 'IP is not allowed'), null);
-				socket.destroy();
-			});
-		};
+		return await res.text();
+	}
+
+	@bindThis
+	public async send(url: string, args: {
+		method?: string,
+		body?: string,
+		headers?: Record<string, string>,
+		timeout?: number,
+		size?: number,
+	} = {}, extra: {
+		throwErrorWhenResponseNotOk: boolean;
+	} = {
+		throwErrorWhenResponseNotOk: true,
+	}): Promise<Response> {
+		const timeout = args.timeout ?? 5000;
+
+		const controller = new AbortController();
+		setTimeout(() => {
+			controller.abort();
+		}, timeout);
+
+		const res = await fetch(url, {
+			method: args.method ?? 'GET',
+			headers: args.headers,
+			body: args.body,
+			size: args.size ?? 10 * 1024 * 1024,
+			agent: (url) => this.getAgentByUrl(url),
+			signal: controller.signal,
+		});
+
+		if (!res.ok && extra.throwErrorWhenResponseNotOk) {
+			throw new StatusError(`${res.status} ${res.statusText}`, res.status, res.statusText);
+		}
+
+		return res;
 	}
 }

packages/backend/src/core/RoleService.ts

@@ -91,10 +91,12 @@ export class RoleService implements OnApplicationShutdown {
 				case 'roleCreated': {
 					const cached = this.rolesCache.get(null);
 					if (cached) {
-						body.createdAt = new Date(body.createdAt);
-						body.updatedAt = new Date(body.updatedAt);
-						body.lastUsedAt = new Date(body.lastUsedAt);
-						cached.push(body);
+						cached.push({
+							...body,
+							createdAt: new Date(body.createdAt),
+							updatedAt: new Date(body.updatedAt),
+							lastUsedAt: new Date(body.lastUsedAt),
+						});
 					}
 					break;
 				}
@@ -103,10 +105,12 @@ export class RoleService implements OnApplicationShutdown {
 					if (cached) {
 						const i = cached.findIndex(x => x.id === body.id);
 						if (i > -1) {
-							body.createdAt = new Date(body.createdAt);
-							body.updatedAt = new Date(body.updatedAt);
-							body.lastUsedAt = new Date(body.lastUsedAt);
-							cached[i] = body;
+							cached[i] = {
+								...body,
+								createdAt: new Date(body.createdAt),
+								updatedAt: new Date(body.updatedAt),
+								lastUsedAt: new Date(body.lastUsedAt),
+							};
 						}
 					}
 					break;
@@ -121,8 +125,10 @@ export class RoleService implements OnApplicationShutdown {
 				case 'userRoleAssigned': {
 					const cached = this.roleAssignmentByUserIdCache.get(body.userId);
 					if (cached) {
-						body.createdAt = new Date(body.createdAt);
-						cached.push(body);
+						cached.push({
+							...body,
+							createdAt: new Date(body.createdAt),
+						});
 					}
 					break;
 				}

packages/backend/src/core/S3Service.ts

@@ -33,7 +33,7 @@ export class S3Service {
 				? false
 				: meta.objectStorageS3ForcePathStyle,
 			httpOptions: {
-				agent: this.httpRequestService.getHttpAgentByUrl(new URL(u), !meta.objectStorageUseProxy),
+				agent: this.httpRequestService.getAgentByUrl(new URL(u), !meta.objectStorageUseProxy),
 			},
 		});
 	}

packages/backend/src/core/activitypub/ApRendererService.ts

@@ -21,11 +21,11 @@ import { UserEntityService } from '@/core/entities/UserEntityService.js';
 import { DriveFileEntityService } from '@/core/entities/DriveFileEntityService.js';
 import type { UserKeypair } from '@/models/entities/UserKeypair.js';
 import type { UsersRepository, UserProfilesRepository, NotesRepository, DriveFilesRepository, EmojisRepository, PollsRepository } from '@/models/index.js';
+import { bindThis } from '@/decorators.js';
 import { LdSignatureService } from './LdSignatureService.js';
 import { ApMfmService } from './ApMfmService.js';
 import type { IActivity, IObject } from './type.js';
 import type { IIdentifier } from './models/identifier.js';
-import { bindThis } from '@/decorators.js';
 
 @Injectable()
 export class ApRendererService {

packages/backend/src/core/activitypub/ApRequestService.ts

@@ -5,16 +5,14 @@ import { DI } from '@/di-symbols.js';
 import type { Config } from '@/config.js';
 import type { User } from '@/models/entities/User.js';
 import { UserKeypairStoreService } from '@/core/UserKeypairStoreService.js';
-import { HttpRequestService, UndiciFetcher } from '@/core/HttpRequestService.js';
+import { HttpRequestService } from '@/core/HttpRequestService.js';
 import { LoggerService } from '@/core/LoggerService.js';
 import { bindThis } from '@/decorators.js';
 import type Logger from '@/logger.js';
-import type { Dispatcher } from 'undici';
-import { DevNull } from '@/misc/dev-null.js';
 
 type Request = {
 	url: string;
-	method: Dispatcher.HttpMethod;
+	method: string;
 	headers: Record<string, string>;
 };
 
@@ -32,7 +30,6 @@ type PrivateKey = {
 
 @Injectable()
 export class ApRequestService {
-	private undiciFetcher: UndiciFetcher;
 	private logger: Logger;
 
 	constructor(
@@ -43,10 +40,8 @@ export class ApRequestService {
 		private httpRequestService: HttpRequestService,
 		private loggerService: LoggerService,
 	) {
-		this.logger = this.loggerService.getLogger('ap-request'); // なぜか TypeError: Cannot read properties of undefined (reading 'getLogger') と言われる
-		this.undiciFetcher = this.httpRequestService.createFetcher({
-			maxRedirections: 0,
-		}, {}, this.logger);
+		// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+		this.logger = this.loggerService?.getLogger('ap-request'); // なぜか TypeError: Cannot read properties of undefined (reading 'getLogger') と言われる
 	}
 
 	@bindThis
@@ -165,15 +160,11 @@ export class ApRequestService {
 			},
 		});
 
-		const response = await this.undiciFetcher.request(
-			url,
-			{
-				method: req.request.method,
-				headers: req.request.headers,
-				body,
-			},
-		);
-		response.body.pipe(new DevNull());
+		await this.httpRequestService.send(url, {
+			method: req.request.method,
+			headers: req.request.headers,
+			body,
+		});
 	}
 
 	/**
@@ -195,13 +186,10 @@ export class ApRequestService {
 			},
 		});
 
-		const res = await this.httpRequestService.fetch(
-			url,
-			{
-				method: req.request.method,
-				headers: req.request.headers,
-			},
-		);
+		const res = await this.httpRequestService.send(url, {
+			method: req.request.method,
+			headers: req.request.headers,
+		});
 
 		return await res.json();
 	}

packages/backend/src/core/activitypub/ApResolverService.ts

@@ -4,7 +4,7 @@ import { InstanceActorService } from '@/core/InstanceActorService.js';
 import type { NotesRepository, PollsRepository, NoteReactionsRepository, UsersRepository } from '@/models/index.js';
 import type { Config } from '@/config.js';
 import { MetaService } from '@/core/MetaService.js';
-import { HttpRequestService, UndiciFetcher } from '@/core/HttpRequestService.js';
+import { HttpRequestService } from '@/core/HttpRequestService.js';
 import { DI } from '@/di-symbols.js';
 import { UtilityService } from '@/core/UtilityService.js';
 import { bindThis } from '@/decorators.js';
@@ -19,7 +19,6 @@ import type { IObject, ICollection, IOrderedCollection } from './type.js';
 export class Resolver {
 	private history: Set<string>;
 	private user?: ILocalUser;
-	private undiciFetcher: UndiciFetcher;
 	private logger: Logger;
 
 	constructor(
@@ -39,10 +38,8 @@ export class Resolver {
 		private recursionLimit = 100,
 	) {
 		this.history = new Set();
+		// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
 		this.logger = this.loggerService?.getLogger('ap-resolve'); // なぜか TypeError: Cannot read properties of undefined (reading 'getLogger') と言われる
-		this.undiciFetcher = this.httpRequestService.createFetcher({
-			maxRedirections: 0,
-		}, {}, this.logger);
 	}
 
 	@bindThis
@@ -106,7 +103,7 @@ export class Resolver {
 
 		const object = (this.user
 			? await this.apRequestService.signedGet(value, this.user) as IObject
-			: await this.undiciFetcher.getJson<IObject>(value, 'application/activity+json, application/ld+json'));
+			: await this.httpRequestService.getJson(value, 'application/activity+json, application/ld+json')) as IObject;
 
 		if (object == null || (
 			Array.isArray(object['@context']) ?

packages/backend/src/core/activitypub/LdSignatureService.ts

@@ -9,7 +9,7 @@ import { CONTEXTS } from './misc/contexts.js';
 class LdSignature {
 	public debug = false;
 	public preLoad = true;
-	public loderTimeout = 10 * 1000;
+	public loderTimeout = 5000;
 
 	constructor(
 		private httpRequestService: HttpRequestService,
@@ -115,19 +115,12 @@ class LdSignature {
 
 	@bindThis
 	private async fetchDocument(url: string) {
-		const json = await this.httpRequestService.fetch(
-			url,
-			{
-				headers: {
-					Accept: 'application/ld+json, application/json',
-				},
-				// TODO
-				//timeout: this.loderTimeout,
+		const json = await this.httpRequestService.send(url, {
+			headers: {
+				Accept: 'application/ld+json, application/json',
 			},
-			{
-				noOkError: true,
-			}
-		).then(res => {
+			timeout: this.loderTimeout,
+		}, { throwErrorWhenResponseNotOk: false }).then(res => {
 			if (!res.ok) {
 				throw `${res.status} ${res.statusText}`;
 			} else {

packages/backend/src/core/activitypub/models/ApPersonService.ts

@@ -566,22 +566,22 @@ export class ApPersonService implements OnModuleInit {
 
 		this.logger.info(`Updating the featured: ${user.uri}`);
 
-		if (resolver == null) resolver = this.apResolverService.createResolver();
+		const _resolver = resolver ?? this.apResolverService.createResolver();
 
 		// Resolve to (Ordered)Collection Object
-		const collection = await resolver.resolveCollection(user.featured);
+		const collection = await _resolver.resolveCollection(user.featured);
 		if (!isCollectionOrOrderedCollection(collection)) throw new Error('Object is not Collection or OrderedCollection');
 
 		// Resolve to Object(may be Note) arrays
 		const unresolvedItems = isCollection(collection) ? collection.items : collection.orderedItems;
-		const items = await Promise.all(toArray(unresolvedItems).map(x => resolver.resolve(x)));
+		const items = await Promise.all(toArray(unresolvedItems).map(x => _resolver.resolve(x)));
 
 		// Resolve and regist Notes
 		const limit = promiseLimit<Note | null>(2);
 		const featuredNotes = await Promise.all(items
 			.filter(item => getApType(item) === 'Note')	// TODO: Noteでなくてもいいかも
 			.slice(0, 5)
-			.map(item => limit(() => this.apNoteService.resolveNote(item, resolver))));
+			.map(item => limit(() => this.apNoteService.resolveNote(item, _resolver))));
 
 		await this.db.transaction(async transactionalEntityManager => {
 			await transactionalEntityManager.delete(UserNotePining, { userId: user.id });

packages/backend/src/core/entities/EmojiEntityService.ts

@@ -22,8 +22,10 @@ export class EmojiEntityService {
 	@bindThis
 	public async pack(
 		src: Emoji['id'] | Emoji,
-		opts: { omitHost?: boolean; omitId?: boolean; withUrl?: boolean; } = {},
+		opts: { omitHost?: boolean; omitId?: boolean; withUrl?: boolean; } = { omitHost: true, omitId: true, withUrl: true },
 	): Promise<Packed<'Emoji'>> {
+		opts = { omitHost: true, omitId: true, withUrl: true, ...opts }
+
 		const emoji = typeof src === 'object' ? src : await this.emojisRepository.findOneByOrFail({ id: src });
 
 		return {

packages/backend/src/core/entities/UserEntityService.ts

@@ -496,10 +496,10 @@ export class UserEntityService implements OnModuleInit {
 				showTimelineReplies: user.showTimelineReplies ?? falsy,
 				achievements: profile!.achievements,
 				loggedInDays: profile!.loggedInDates.length,
+				policies: this.roleService.getUserPolicies(user.id),
 			} : {}),
 
 			...(opts.includeSecrets ? {
-				policies: this.roleService.getUserPolicies(user.id),
 				email: profile!.email,
 				emailVerified: profile!.emailVerified,
 				securityKeysList: profile!.twoFactorEnabled

packages/backend/src/misc/get-ip-hash.ts

@@ -1,9 +1,14 @@
 import IPCIDR from 'ip-cidr';
 
 export function getIpHash(ip: string) {
-	// because a single person may control many IPv6 addresses,
-	// only a /64 subnet prefix of any IP will be taken into account.
-	// (this means for IPv4 the entire address is used)
-	const prefix = IPCIDR.createAddress(ip).mask(64);
-	return 'ip-' + BigInt('0b' + prefix).toString(36);
+	try {
+		// because a single person may control many IPv6 addresses,
+		// only a /64 subnet prefix of any IP will be taken into account.
+		// (this means for IPv4 the entire address is used)
+		const prefix = IPCIDR.createAddress(ip).mask(64);
+		return 'ip-' + BigInt('0b' + prefix).toString(36);
+	} catch (e) {
+		const prefix = IPCIDR.createAddress(ip.replace(/:[0-9]+$/, '')).mask(64);
+		return 'ip-' + BigInt('0b' + prefix).toString(36);
+	}
 }

packages/backend/src/queue/processors/WebhookDeliverProcessorService.ts

@@ -6,10 +6,10 @@ import type { Config } from '@/config.js';
 import type Logger from '@/logger.js';
 import { HttpRequestService } from '@/core/HttpRequestService.js';
 import { StatusError } from '@/misc/status-error.js';
+import { bindThis } from '@/decorators.js';
 import { QueueLoggerService } from '../QueueLoggerService.js';
 import type Bull from 'bull';
 import type { WebhookDeliverJobData } from '../types.js';
-import { bindThis } from '@/decorators.js';
 
 @Injectable()
 export class WebhookDeliverProcessorService {
@@ -33,26 +33,23 @@ export class WebhookDeliverProcessorService {
 		try {
 			this.logger.debug(`delivering ${job.data.webhookId}`);
 	
-			const res = await this.httpRequestService.fetch(
-				job.data.to,
-				{
-					method: 'POST',
-					headers: {
-						'User-Agent': 'Misskey-Hooks',
-						'X-Misskey-Host': this.config.host,
-						'X-Misskey-Hook-Id': job.data.webhookId,
-						'X-Misskey-Hook-Secret': job.data.secret,
-					},
-					body: JSON.stringify({
-						hookId: job.data.webhookId,
-						userId: job.data.userId,
-						eventId: job.data.eventId,
-						createdAt: job.data.createdAt,
-						type: job.data.type,
-						body: job.data.content,
-					}),
-				}
-			);
+			const res = await this.httpRequestService.send(job.data.to, {
+				method: 'POST',
+				headers: {
+					'User-Agent': 'Misskey-Hooks',
+					'X-Misskey-Host': this.config.host,
+					'X-Misskey-Hook-Id': job.data.webhookId,
+					'X-Misskey-Hook-Secret': job.data.secret,
+				},
+				body: JSON.stringify({
+					hookId: job.data.webhookId,
+					userId: job.data.userId,
+					eventId: job.data.eventId,
+					createdAt: job.data.createdAt,
+					type: job.data.type,
+					body: job.data.content,
+				}),
+			});
 	
 			this.webhooksRepository.update({ id: job.data.webhookId }, {
 				latestSentAt: new Date(),

packages/backend/src/server/api/endpoints/admin/emoji/add-aliases-bulk.ts

@@ -3,6 +3,8 @@ import { DataSource, In } from 'typeorm';
 import { Endpoint } from '@/server/api/endpoint-base.js';
 import type { EmojisRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
+import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
+import { GlobalEventService } from '@/core/GlobalEventService.js';
 
 export const meta = {
 	tags: ['admin'],
@@ -35,6 +37,9 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 		@Inject(DI.emojisRepository)
 		private emojisRepository: EmojisRepository,
+
+		private emojiEntityService: EmojiEntityService,
+		private globalEventService: GlobalEventService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
 			const emojis = await this.emojisRepository.findBy({
@@ -49,6 +54,10 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			}
 
 			await this.db.queryResultCache!.remove(['meta_emojis']);
+
+			this.globalEventService.publishBroadcastStream('emojiUpdated', {
+				emojis: await this.emojiEntityService.packMany(ps.ids),
+			});
 		});
 	}
 }

packages/backend/src/server/api/endpoints/admin/emoji/add.ts

@@ -2,12 +2,10 @@ import { Inject, Injectable } from '@nestjs/common';
 import rndstr from 'rndstr';
 import { DataSource } from 'typeorm';
 import { Endpoint } from '@/server/api/endpoint-base.js';
-import type { DriveFilesRepository, EmojisRepository } from '@/models/index.js';
-import { IdService } from '@/core/IdService.js';
+import type { DriveFilesRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
-import { GlobalEventService } from '@/core/GlobalEventService.js';
+import { CustomEmojiService } from '@/core/CustomEmojiService.js';
 import { ModerationLogService } from '@/core/ModerationLogService.js';
-import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
 import { ApiError } from '../../../error.js';
 
 export const meta = {
@@ -39,43 +37,26 @@ export const paramDef = {
 @Injectable()
 export default class extends Endpoint<typeof meta, typeof paramDef> {
 	constructor(
-		@Inject(DI.db)
-		private db: DataSource,
-
 		@Inject(DI.driveFilesRepository)
 		private driveFilesRepository: DriveFilesRepository,
 
-		@Inject(DI.emojisRepository)
-		private emojisRepository: EmojisRepository,
+		private customEmojiService: CustomEmojiService,
 
-		private emojiEntityService: EmojiEntityService,
-		private idService: IdService,
-		private globalEventService: GlobalEventService,
 		private moderationLogService: ModerationLogService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
-			const file = await this.driveFilesRepository.findOneBy({ id: ps.fileId });
+			const driveFile = await this.driveFilesRepository.findOneBy({ id: ps.fileId });
 
-			if (file == null) throw new ApiError(meta.errors.noSuchFile);
+			if (driveFile == null) throw new ApiError(meta.errors.noSuchFile);
 
-			const name = file.name.split('.')[0].match(/^[a-z0-9_]+$/) ? file.name.split('.')[0] : `_${rndstr('a-z0-9', 8)}_`;
+			const name = driveFile.name.split('.')[0].match(/^[a-z0-9_]+$/) ? driveFile.name.split('.')[0] : `_${rndstr('a-z0-9', 8)}_`;
 
-			const emoji = await this.emojisRepository.insert({
-				id: this.idService.genId(),
-				updatedAt: new Date(),
-				name: name,
+			const emoji = await this.customEmojiService.add({
+				driveFile,
+				name,
 				category: null,
-				host: null,
 				aliases: [],
-				originalUrl: file.url,
-				publicUrl: file.webpublicUrl ?? file.url,
-				type: file.webpublicType ?? file.type,
-			}).then(x => this.emojisRepository.findOneByOrFail(x.identifiers[0]));
-
-			await this.db.queryResultCache!.remove(['meta_emojis']);
-
-			this.globalEventService.publishBroadcastStream('emojiAdded', {
-				emoji: await this.emojiEntityService.pack(emoji.id),
+				host: null,
 			});
 
 			this.moderationLogService.insertModerationLog(me, 'addEmoji', {

packages/backend/src/server/api/endpoints/admin/emoji/delete-bulk.ts

@@ -4,6 +4,8 @@ import { Endpoint } from '@/server/api/endpoint-base.js';
 import type { EmojisRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
 import { ModerationLogService } from '@/core/ModerationLogService.js';
+import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
+import { GlobalEventService } from '@/core/GlobalEventService.js';
 
 export const meta = {
 	tags: ['admin'],
@@ -35,6 +37,8 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 		private emojisRepository: EmojisRepository,
 
 		private moderationLogService: ModerationLogService,
+		private emojiEntityService: EmojiEntityService,
+		private globalEventService: GlobalEventService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
 			const emojis = await this.emojisRepository.findBy({
@@ -43,13 +47,15 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 			for (const emoji of emojis) {
 				await this.emojisRepository.delete(emoji.id);
-	
 				await this.db.queryResultCache!.remove(['meta_emojis']);
-	
 				this.moderationLogService.insertModerationLog(me, 'deleteEmoji', {
 					emoji: emoji,
 				});
 			}
+
+			this.globalEventService.publishBroadcastStream('emojiDeleted', {
+				emojis: await this.emojiEntityService.packMany(emojis),
+			});
 		});
 	}
 }

packages/backend/src/server/api/endpoints/admin/emoji/delete.ts

@@ -5,6 +5,8 @@ import type { EmojisRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
 import { ModerationLogService } from '@/core/ModerationLogService.js';
 import { ApiError } from '../../../error.js';
+import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
+import { GlobalEventService } from '@/core/GlobalEventService.js';
 
 export const meta = {
 	tags: ['admin'],
@@ -42,6 +44,8 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 		private emojisRepository: EmojisRepository,
 
 		private moderationLogService: ModerationLogService,
+		private emojiEntityService: EmojiEntityService,
+		private globalEventService: GlobalEventService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
 			const emoji = await this.emojisRepository.findOneBy({ id: ps.id });
@@ -52,6 +56,10 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 			await this.db.queryResultCache!.remove(['meta_emojis']);
 
+			this.globalEventService.publishBroadcastStream('emojiDeleted', {
+				emojis: [ await this.emojiEntityService.pack(emoji) ],
+			});
+
 			this.moderationLogService.insertModerationLog(me, 'deleteEmoji', {
 				emoji: emoji,
 			});

packages/backend/src/server/api/endpoints/admin/emoji/list-remote.ts

@@ -101,7 +101,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 				.take(ps.limit)
 				.getMany();
 
-			return this.emojiEntityService.packMany(emojis);
+			return this.emojiEntityService.packMany(emojis, { omitHost: false, omitId: false, withUrl: false });
 		});
 	}
 }

packages/backend/src/server/api/endpoints/admin/emoji/list.ts

@@ -98,7 +98,7 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 				emojis = await q.take(ps.limit).getMany();
 			}
 
-			return this.emojiEntityService.packMany(emojis);
+			return this.emojiEntityService.packMany(emojis, { omitHost: false, omitId: false, withUrl: false });
 		});
 	}
 }

packages/backend/src/server/api/endpoints/admin/emoji/remove-aliases-bulk.ts

@@ -3,6 +3,8 @@ import { DataSource, In } from 'typeorm';
 import { Endpoint } from '@/server/api/endpoint-base.js';
 import type { EmojisRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
+import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
+import { GlobalEventService } from '@/core/GlobalEventService.js';
 
 export const meta = {
 	tags: ['admin'],
@@ -35,6 +37,9 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 		@Inject(DI.emojisRepository)
 		private emojisRepository: EmojisRepository,
+
+		private emojiEntityService: EmojiEntityService,
+		private globalEventService: GlobalEventService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
 			const emojis = await this.emojisRepository.findBy({
@@ -49,6 +54,10 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			}
 
 			await this.db.queryResultCache!.remove(['meta_emojis']);
+		
+			this.globalEventService.publishBroadcastStream('emojiUpdated', {
+				emojis: await this.emojiEntityService.packMany(ps.ids),
+			});
 		});
 	}
 }

packages/backend/src/server/api/endpoints/admin/emoji/set-aliases-bulk.ts

@@ -3,6 +3,8 @@ import { DataSource, In } from 'typeorm';
 import { Endpoint } from '@/server/api/endpoint-base.js';
 import type { EmojisRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
+import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
+import { GlobalEventService } from '@/core/GlobalEventService.js';
 
 export const meta = {
 	tags: ['admin'],
@@ -35,6 +37,9 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 		@Inject(DI.emojisRepository)
 		private emojisRepository: EmojisRepository,
+
+		private emojiEntityService: EmojiEntityService,
+		private globalEventService: GlobalEventService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
 			await this.emojisRepository.update({
@@ -45,6 +50,10 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			});
 
 			await this.db.queryResultCache!.remove(['meta_emojis']);
+
+			this.globalEventService.publishBroadcastStream('emojiUpdated', {
+				emojis: await this.emojiEntityService.packMany(ps.ids),
+			});
 		});
 	}
 }

packages/backend/src/server/api/endpoints/admin/emoji/set-category-bulk.ts

@@ -3,6 +3,8 @@ import { DataSource, In } from 'typeorm';
 import { Endpoint } from '@/server/api/endpoint-base.js';
 import type { EmojisRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
+import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
+import { GlobalEventService } from '@/core/GlobalEventService.js';
 
 export const meta = {
 	tags: ['admin'],
@@ -37,6 +39,9 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 		@Inject(DI.emojisRepository)
 		private emojisRepository: EmojisRepository,
+
+		private emojiEntityService: EmojiEntityService,
+		private globalEventService: GlobalEventService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
 			await this.emojisRepository.update({
@@ -47,6 +52,10 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			});
 
 			await this.db.queryResultCache!.remove(['meta_emojis']);
+
+			this.globalEventService.publishBroadcastStream('emojiUpdated', {
+				emojis: await this.emojiEntityService.packMany(ps.ids),
+			});
 		});
 	}
 }

packages/backend/src/server/api/endpoints/admin/emoji/update.ts

@@ -4,6 +4,8 @@ import { Endpoint } from '@/server/api/endpoint-base.js';
 import type { EmojisRepository } from '@/models/index.js';
 import { DI } from '@/di-symbols.js';
 import { ApiError } from '../../../error.js';
+import { EmojiEntityService } from '@/core/entities/EmojiEntityService.js';
+import { GlobalEventService } from '@/core/GlobalEventService.js';
 
 export const meta = {
 	tags: ['admin'],
@@ -48,6 +50,9 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 		@Inject(DI.emojisRepository)
 		private emojisRepository: EmojisRepository,
+
+		private emojiEntityService: EmojiEntityService,
+		private globalEventService: GlobalEventService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
 			const emoji = await this.emojisRepository.findOneBy({ id: ps.id });
@@ -62,6 +67,22 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 			});
 
 			await this.db.queryResultCache!.remove(['meta_emojis']);
+
+			const updated = await this.emojiEntityService.pack(emoji.id);
+
+			if (emoji.name === ps.name) {
+				this.globalEventService.publishBroadcastStream('emojiUpdated', {
+					emojis: [ updated ],
+				});
+			} else {
+				this.globalEventService.publishBroadcastStream('emojiDeleted', {
+					emojis: [ await this.emojiEntityService.pack(emoji) ],
+				});
+
+				this.globalEventService.publishBroadcastStream('emojiAdded', {
+					emoji: updated,
+				});	
+			}
 		});
 	}
 }

packages/backend/src/server/api/endpoints/emojis.ts

@@ -10,6 +10,8 @@ export const meta = {
 	tags: ['meta'],
 
 	requireCredential: false,
+	allowGet: true,
+	cacheSec: 3600,
 
 	res: {
 		type: 'object',

packages/backend/src/server/api/endpoints/fetch-rss.ts

@@ -33,16 +33,13 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 		private httpRequestService: HttpRequestService,
 	) {
 		super(meta, paramDef, async (ps, me) => {
-			const res = await this.httpRequestService.fetch(
-				ps.url,
-				{
-					method: 'GET',
-					headers: {
-						Accept: 'application/rss+xml, */*',
-					},
-					// timeout: 5000,
-				}
-			);
+			const res = await this.httpRequestService.send(ps.url, {
+				method: 'GET',
+				headers: {
+					Accept: 'application/rss+xml, */*',
+				},
+				timeout: 5000,
+			});
 
 			const text = await res.text();
 

packages/backend/src/server/api/endpoints/notes/translate.ts

@@ -7,8 +7,8 @@ import { DI } from '@/di-symbols.js';
 import { NoteEntityService } from '@/core/entities/NoteEntityService.js';
 import { MetaService } from '@/core/MetaService.js';
 import { HttpRequestService } from '@/core/HttpRequestService.js';
-import { ApiError } from '../../error.js';
 import { GetterService } from '@/server/api/GetterService.js';
+import { ApiError } from '../../error.js';
 
 export const meta = {
 	tags: ['notes'],
@@ -83,20 +83,14 @@ export default class extends Endpoint<typeof meta, typeof paramDef> {
 
 			const endpoint = instance.deeplIsPro ? 'https://api.deepl.com/v2/translate' : 'https://api-free.deepl.com/v2/translate';
 
-			const res = await this.httpRequestService.fetch(
-				endpoint,
-				{
-					method: 'POST',
-					headers: {
-						'Content-Type': 'application/x-www-form-urlencoded',
-						Accept: 'application/json, */*',
-					},
-					body: params.toString(),
+			const res = await this.httpRequestService.send(endpoint, {
+				method: 'POST',
+				headers: {
+					'Content-Type': 'application/x-www-form-urlencoded',
+					Accept: 'application/json, */*',
 				},
-				{
-					noOkError: false,
-				}
-			);
+				body: params.toString(),
+			});
 
 			const json = (await res.json()) as {
 				translations: {

packages/backend/src/server/api/stream/types.ts

@@ -30,7 +30,7 @@ export interface InternalStreamTypes {
 	remoteUserUpdated: Serialized<{ id: User['id']; }>;
 	follow: Serialized<{ followerId: User['id']; followeeId: User['id']; }>;
 	unfollow: Serialized<{ followerId: User['id']; followeeId: User['id']; }>;
-	policiesUpdated: Serialized<Role['options']>;
+	policiesUpdated: Serialized<Role['policies']>;
 	roleCreated: Serialized<Role>;
 	roleDeleted: Serialized<Role>;
 	roleUpdated: Serialized<Role>;
@@ -49,6 +49,16 @@ export interface BroadcastTypes {
 	emojiAdded: {
 		emoji: Packed<'Emoji'>;
 	};
+	emojiUpdated: {
+		emojis: Packed<'Emoji'>[];
+	};
+	emojiDeleted: {
+		emojis: {
+			id?: string;
+			name: string;
+			[other: string]: any;
+		}[];
+	};
 }
 
 export interface UserStreamTypes {

packages/backend/src/server/web/boot.js

@@ -154,7 +154,7 @@
 				<path d="M5 19h14a2 2 0 0 0 1.84 -2.75l-7.1 -12.25a2 2 0 0 0 -3.5 0l-7.1 12.25a2 2 0 0 0 1.75 2.75"></path>
 			</svg>
 			<h1>An error has occurred!</h1>
-			<button class="button-big" onclick="location.reload(true);">
+			<button class="button-big" onclick="location.reload();">
 				<span class="button-label-big">Refresh</span>
 			</button>
 			<p class="dont-worry">Don't worry, it's (probably) not your fault.</p>

packages/frontend/src/components/MkAutocomplete.vue

@@ -33,7 +33,7 @@
 </template>
 
 <script lang="ts">
-import { markRaw, ref, shallowRef, onUpdated, onMounted, onBeforeUnmount, nextTick, watch } from 'vue';
+import { markRaw, ref, shallowRef, computed, onUpdated, onMounted, onBeforeUnmount, nextTick, watch } from 'vue';
 import sanitizeHtml from 'sanitize-html';
 import contains from '@/scripts/contains';
 import { char2twemojiFilePath, char2fluentEmojiFilePath } from '@/scripts/emoji-base';
@@ -61,59 +61,62 @@ type EmojiDef = {
 
 const lib = emojilist.filter(x => x.category !== 'flags');
 
-const char2path = defaultStore.state.emojiStyle === 'twemoji' ? char2twemojiFilePath : char2fluentEmojiFilePath;
+const emojiDb = computed(() => {
+	//#region Unicode Emoji
+	const char2path = defaultStore.reactiveState.emojiStyle.value === 'twemoji' ? char2twemojiFilePath : char2fluentEmojiFilePath;
 
-const emjdb: EmojiDef[] = lib.map(x => ({
-	emoji: x.char,
-	name: x.name,
-	url: char2path(x.char),
-}));
-
-for (const x of lib) {
-	if (x.keywords) {
-		for (const k of x.keywords) {
-			emjdb.push({
-				emoji: x.char,
-				name: k,
-				aliasOf: x.name,
-				url: char2path(x.char),
-			});
-		}
-	}
-}
-
-emjdb.sort((a, b) => a.name.length - b.name.length);
-
-//#region Construct Emoji DB
-const emojiDefinitions: EmojiDef[] = [];
-
-for (const x of customEmojis) {
-	emojiDefinitions.push({
+	const unicodeEmojiDB: EmojiDef[] = lib.map(x => ({
+		emoji: x.char,
 		name: x.name,
-		emoji: `:${x.name}:`,
-		isCustomEmoji: true,
-	});
+		url: char2path(x.char),
+	}));
 
-	if (x.aliases) {
-		for (const alias of x.aliases) {
-			emojiDefinitions.push({
-				name: alias,
-				aliasOf: x.name,
-				emoji: `:${x.name}:`,
-				isCustomEmoji: true,
-			});
+	for (const x of lib) {
+		if (x.keywords) {
+			for (const k of x.keywords) {
+				unicodeEmojiDB.push({
+					emoji: x.char,
+					name: k,
+					aliasOf: x.name,
+					url: char2path(x.char),
+				});
+			}
 		}
 	}
-}
 
-emojiDefinitions.sort((a, b) => a.name.length - b.name.length);
+	unicodeEmojiDB.sort((a, b) => a.name.length - b.name.length);
+	//#endregion
 
-const emojiDb = markRaw(emojiDefinitions.concat(emjdb));
-//#endregion
+	//#region Custom Emoji
+	const customEmojiDB: EmojiDef[] = [];
+
+	for (const x of customEmojis.value) {
+		customEmojiDB.push({
+			name: x.name,
+			emoji: `:${x.name}:`,
+			isCustomEmoji: true,
+		});
+
+		if (x.aliases) {
+			for (const alias of x.aliases) {
+				customEmojiDB.push({
+					name: alias,
+					aliasOf: x.name,
+					emoji: `:${x.name}:`,
+					isCustomEmoji: true,
+				});
+			}
+		}
+	}
+
+	customEmojiDB.sort((a, b) => a.name.length - b.name.length);
+	//#endregion
+
+	return markRaw([ ...customEmojiDB, ...unicodeEmojiDB ]);
+});
 
 export default {
 	emojiDb,
-	emojiDefinitions,
 	emojilist,
 };
 </script>
@@ -230,27 +233,27 @@ function exec() {
 	} else if (props.type === 'emoji') {
 		if (!props.q || props.q === '') {
 			// 最近使った絵文字をサジェスト
-			emojis.value = defaultStore.state.recentlyUsedEmojis.map(emoji => emojiDb.find(dbEmoji => dbEmoji.emoji === emoji)).filter(x => x) as EmojiDef[];
+			emojis.value = defaultStore.state.recentlyUsedEmojis.map(emoji => emojiDb.value.find(dbEmoji => dbEmoji.emoji === emoji)).filter(x => x) as EmojiDef[];
 			return;
 		}
 
 		const matched: EmojiDef[] = [];
 		const max = 30;
 
-		emojiDb.some(x => {
+		emojiDb.value.some(x => {
 			if (x.name.startsWith(props.q ?? '') && !x.aliasOf && !matched.some(y => y.emoji === x.emoji)) matched.push(x);
 			return matched.length === max;
 		});
 
 		if (matched.length < max) {
-			emojiDb.some(x => {
+			emojiDb.value.some(x => {
 				if (x.name.startsWith(props.q ?? '') && !matched.some(y => y.emoji === x.emoji)) matched.push(x);
 				return matched.length === max;
 			});
 		}
 
 		if (matched.length < max) {
-			emojiDb.some(x => {
+			emojiDb.value.some(x => {
 				if (x.name.includes(props.q ?? '') && !matched.some(y => y.emoji === x.emoji)) matched.push(x);
 				return matched.length === max;
 			});

packages/frontend/src/components/MkEmojiPicker.section.vue

@@ -18,10 +18,10 @@
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue';
+import { ref, computed, Ref } from 'vue';
 
 const props = defineProps<{
-	emojis: string[];
+	emojis: string[] | Ref<string[]>;
 	initialShown?: boolean;
 }>();
 
@@ -29,5 +29,7 @@ const emit = defineEmits<{
 	(ev: 'chosen', v: string, event: MouseEvent): void;
 }>();
 
+const emojis = computed(() => Array.isArray(props.emojis) ? props.emojis : props.emojis.value);
+
 const shown = ref(!!props.initialShown);
 </script>

packages/frontend/src/components/MkEmojiPicker.vue

@@ -60,7 +60,15 @@
 		</div>
 		<div v-once class="group">
 			<header class="_acrylic">{{ i18n.ts.customEmojis }}</header>
-			<XSection v-for="category in customEmojiCategories" :key="'custom:' + category" :initial-shown="false" :emojis="customEmojis.filter(e => e.category === category).map(e => ':' + e.name + ':')" @chosen="chosen">{{ category || i18n.ts.other }}</XSection>
+			<XSection
+				v-for="category in customEmojiCategories"
+				:key="`custom:${category}`"
+				:initial-shown="false"
+				:emojis="computed(() => customEmojis.filter(e => category === null ? (e.category === 'null' || !e.category) : e.category === category).map(e => `:${e.name}:`))"
+				@chosen="chosen"
+			>
+				{{ category || i18n.ts.other }}
+			</XSection>
 		</div>
 		<div v-once class="group">
 			<header class="_acrylic">{{ i18n.ts.emoji }}</header>
@@ -88,7 +96,7 @@ import { deviceKind } from '@/scripts/device-kind';
 import { instance } from '@/instance';
 import { i18n } from '@/i18n';
 import { defaultStore } from '@/store';
-import { getCustomEmojiCategories, customEmojis } from '@/custom-emojis';
+import { customEmojiCategories, customEmojis } from '@/custom-emojis';
 
 const props = withDefaults(defineProps<{
 	showPinned?: boolean;
@@ -104,7 +112,6 @@ const emit = defineEmits<{
 	(ev: 'chosen', v: string): void;
 }>();
 
-const customEmojiCategories = getCustomEmojiCategories();
 const searchEl = shallowRef<HTMLInputElement>();
 const emojisEl = shallowRef<HTMLDivElement>();
 
@@ -138,7 +145,7 @@ watch(q, () => {
 
 	const searchCustom = () => {
 		const max = 8;
-		const emojis = customEmojis;
+		const emojis = customEmojis.value;
 		const matches = new Set<Misskey.entities.CustomEmoji>();
 
 		const exactMatch = emojis.find(emoji => emoji.name === newQ);
@@ -323,7 +330,7 @@ function done(query?: string): boolean | void {
 	if (query == null || typeof query !== 'string') return;
 
 	const q2 = query.replace(/:/g, '');
-	const exactMatchCustom = customEmojis.find(emoji => emoji.name === q2);
+	const exactMatchCustom = customEmojis.value.find(emoji => emoji.name === q2);
 	if (exactMatchCustom) {
 		chosen(exactMatchCustom);
 		return true;

packages/frontend/src/components/MkMenu.vue

@@ -335,8 +335,7 @@ onBeforeUnmount(() => {
 }
 
 .icon {
-	margin-right: 5px;
-	width: 20px;
+	margin-right: 8px;
 }
 
 .caret {

packages/frontend/src/components/MkSuperMenu.vue

@@ -6,15 +6,15 @@
 		<div class="items">
 			<template v-for="(item, i) in group.items">
 				<a v-if="item.type === 'a'" :href="item.href" :target="item.target" :tabindex="i" class="_button item" :class="{ danger: item.danger, active: item.active }">
-					<i v-if="item.icon" class="icon ti-fw" :class="item.icon"></i>
+					<span v-if="item.icon" class="icon"><i :class="item.icon" class="ti-fw"></i></span>
 					<span class="text">{{ item.text }}</span>
 				</a>
 				<button v-else-if="item.type === 'button'" :tabindex="i" class="_button item" :class="{ danger: item.danger, active: item.active }" :disabled="item.active" @click="ev => item.action(ev)">
-					<i v-if="item.icon" class="icon ti-fw" :class="item.icon"></i>
+					<span v-if="item.icon" class="icon"><i :class="item.icon" class="ti-fw"></i></span>
 					<span class="text">{{ item.text }}</span>
 				</button>
 				<MkA v-else :to="item.to" :tabindex="i" class="_button item" :class="{ danger: item.danger, active: item.active }">
-					<i v-if="item.icon" class="icon ti-fw" :class="item.icon"></i>
+					<span v-if="item.icon" class="icon"><i :class="item.icon" class="ti-fw"></i></span>
 					<span class="text">{{ item.text }}</span>
 				</MkA>
 			</template>

packages/frontend/src/components/global/MkEmoji.vue

@@ -1,6 +1,6 @@
 <template>
 <span v-if="isCustom && errored">:{{ customEmojiName }}:</span>
-<img v-else-if="isCustom" :class="[$style.root, $style.custom, { [$style.normal]: normal, [$style.noStyle]: noStyle }]" :src="url" :alt="alt" :title="alt" decoding="async" @error="errored = true"/>
+<img v-else-if="isCustom" :class="[$style.root, $style.custom, { [$style.normal]: normal, [$style.noStyle]: noStyle }]" :src="url" :alt="alt" :title="alt" decoding="async" @error="errored = true" @load="errored = false"/>
 <img v-else-if="char && !useOsNativeEmojis" :class="$style.root" :src="url" :alt="alt" decoding="async" @pointerenter="computeTitle"/>
 <span v-else-if="char && useOsNativeEmojis" :alt="alt" @pointerenter="computeTitle">{{ char }}</span>
 <span v-else>{{ emoji }}</span>
@@ -25,29 +25,29 @@ const props = defineProps<{
 const char2path = defaultStore.state.emojiStyle === 'twemoji' ? char2twemojiFilePath : char2fluentEmojiFilePath;
 
 const isCustom = computed(() => props.emoji.startsWith(':'));
-const customEmojiName = props.emoji.substr(1, props.emoji.length - 2).replace('@.', '');
+const customEmojiName = computed(() => props.emoji.substr(1, props.emoji.length - 2).replace('@.', ''));
 const char = computed(() => isCustom.value ? undefined : props.emoji);
 const useOsNativeEmojis = computed(() => defaultStore.state.emojiStyle === 'native' && !props.isReaction);
 const url = computed(() => {
 	if (char.value) {
 		return char2path(char.value);
-	} else if (props.host == null && !customEmojiName.includes('@')) {
-		const found = customEmojis.find(x => x.name === customEmojiName);
-		return found ? found.url : null;
+	} else if (props.host == null && !customEmojiName.value.includes('@')) {
+		const found = customEmojis.value.find(x => x.name === customEmojiName.value);
+		return found ? defaultStore.state.disableShowingAnimatedImages ? getStaticImageUrl(found.url) : found.url : null;
 	} else {
-		const rawUrl = props.host ? `/emoji/${customEmojiName}@${props.host}.webp` : `/emoji/${customEmojiName}.webp`;
+		const rawUrl = props.host ? `/emoji/${customEmojiName.value}@${props.host}.webp` : `/emoji/${customEmojiName.value}.webp`;
 		return defaultStore.state.disableShowingAnimatedImages
 			? getStaticImageUrl(rawUrl)
 			: rawUrl;
 	}
 });
-const alt = computed(() => isCustom.value ? `:${customEmojiName}:` : char.value);
+const alt = computed(() => isCustom.value ? `:${customEmojiName.value}:` : char.value);
 let errored = $ref(isCustom.value && url.value == null);
 
 // Searching from an array with 2000 items for every emoji felt like too energy-consuming, so I decided to do it lazily on pointerenter
 function computeTitle(event: PointerEvent): void {
 	const title = isCustom.value
-		? `:${customEmojiName}:`
+		? `:${customEmojiName.value}:`
 		: (getEmojiName(char.value as string) ?? char.value as string);
 	(event.target as HTMLElement).title = title;
 }

packages/frontend/src/components/mfm.ts

@@ -190,19 +190,19 @@ export default defineComponent({
 							return h(MkSparkle, {}, genEl(token.children));
 						}
 						case 'rotate': {
-							const degrees = parseInt(token.props.args.deg) ?? '90';
+							const degrees = parseFloat(token.props.args.deg) ?? '90';
 							style = `transform: rotate(${degrees}deg); transform-origin: center center;`;
 							break;
 						}
 						case 'position': {
-							const x = parseInt(token.props.args.x ?? '0');
-							const y = parseInt(token.props.args.y ?? '0');
+							const x = parseFloat(token.props.args.x ?? '0');
+							const y = parseFloat(token.props.args.y ?? '0');
 							style = `transform: translateX(${x}em) translateY(${y}em);`;
 							break;
 						}
 						case 'scale': {
-							const x = Math.min(parseInt(token.props.args.x ?? '1'), 5);
-							const y = Math.min(parseInt(token.props.args.y ?? '1'), 5);
+							const x = Math.min(parseFloat(token.props.args.x ?? '1'), 5);
+							const y = Math.min(parseFloat(token.props.args.y ?? '1'), 5);
 							style = `transform: scale(${x}, ${y});`;
 							break;
 						}

packages/frontend/src/custom-emojis.ts

@@ -1,45 +1,51 @@
-import { api } from './os';
+import { shallowRef, computed, markRaw } from 'vue';
+import * as Misskey from 'misskey-js';
+import { apiGet } from './os';
 import { miLocalStorage } from './local-storage';
+import { stream } from '@/stream';
 
 const storageCache = miLocalStorage.getItem('emojis');
-export let customEmojis: {
-	name: string;
-	aliases: string[];
-	category: string;
-	url: string;
-}[] = storageCache ? JSON.parse(storageCache) : [];
+export const customEmojis = shallowRef<Misskey.entities.CustomEmoji[]>(storageCache ? JSON.parse(storageCache) : []);
+export const customEmojiCategories = computed<[ ...string[], null ]>(() => {
+	const categories = new Set<string>();
+	for (const emoji of customEmojis.value) {
+		if (emoji.category && emoji.category !== 'null') {
+			categories.add(emoji.category);
+		}
+	}
+	return markRaw([...Array.from(categories), null]);
+});
+
+stream.on('emojiAdded', emojiData => {
+	customEmojis.value = [emojiData.emoji, ...customEmojis.value];
+});
+
+stream.on('emojiUpdated', emojiData => {
+	customEmojis.value = customEmojis.value.map(item => emojiData.emojis.find(search => search.name === item.name) as Misskey.entities.CustomEmoji ?? item);
+});
+
+stream.on('emojiDeleted', emojiData => {
+	customEmojis.value = customEmojis.value.filter(item => !emojiData.emojis.some(search => search.name === item.name));
+});
 
 export async function fetchCustomEmojis() {
 	const now = Date.now();
 	const lastFetchedAt = miLocalStorage.getItem('lastEmojisFetchedAt');
-	if (lastFetchedAt && (now - parseInt(lastFetchedAt)) < 1000 * 60 * 60 * 24) return;
+	if (lastFetchedAt && (now - parseInt(lastFetchedAt)) < 1000 * 60 * 60) return;
 
-	const res = await api('emojis', {});
+	const res = await apiGet('emojis', {});
 
-	customEmojis = res.emojis;
-	miLocalStorage.setItem('emojis', JSON.stringify(customEmojis));
+	customEmojis.value = res.emojis;
+	miLocalStorage.setItem('emojis', JSON.stringify(res.emojis));
 	miLocalStorage.setItem('lastEmojisFetchedAt', now.toString());
 }
 
-let cachedCategories;
-export function getCustomEmojiCategories() {
-	if (cachedCategories) return cachedCategories;
-
-	const categories = new Set();
-	for (const emoji of customEmojis) {
-		categories.add(emoji.category);
-	}
-	const res = Array.from(categories);
-	cachedCategories = res;
-	return res;
-}
-
 let cachedTags;
 export function getCustomEmojiTags() {
 	if (cachedTags) return cachedTags;
 
 	const tags = new Set();
-	for (const emoji of customEmojis) {
+	for (const emoji of customEmojis.value) {
 		for (const tag of emoji.aliases) {
 			tags.add(tag);
 		}

packages/frontend/src/init.ts

@@ -338,11 +338,6 @@ import { fetchCustomEmojis } from './custom-emojis';
 		}
 	});
 
-	stream.on('emojiAdded', emojiData => {
-		// TODO
-		//store.commit('instance/set', );
-	});
-
 	for (const plugin of ColdDeviceStorage.get('plugins').filter(p => p.active)) {
 		import('./plugin').then(({ install }) => {
 			install(plugin);

packages/frontend/src/pages/about.emojis.vue

@@ -39,13 +39,13 @@ import MkSelect from '@/components/MkSelect.vue';
 import MkFoldableSection from '@/components/MkFoldableSection.vue';
 import MkTab from '@/components/MkTab.vue';
 import * as os from '@/os';
-import { customEmojis, getCustomEmojiCategories, getCustomEmojiTags } from '@/custom-emojis';
+import { customEmojis, customEmojiCategories, getCustomEmojiTags } from '@/custom-emojis';
 import { i18n } from '@/i18n';
+import * as Misskey from 'misskey-js';
 
-const customEmojiCategories = getCustomEmojiCategories();
 const customEmojiTags = getCustomEmojiTags();
 let q = $ref('');
-let searchEmojis = $ref(null);
+let searchEmojis = $ref<Misskey.entities.CustomEmoji[]>(null);
 let selectedTags = $ref(new Set());
 
 function search() {
@@ -55,9 +55,9 @@ function search() {
 	}
 
 	if (selectedTags.size === 0) {
-		searchEmojis = customEmojis.filter(emoji => emoji.name.includes(q) || emoji.aliases.includes(q));
+		searchEmojis = customEmojis.value.filter(emoji => emoji.name.includes(q) || emoji.aliases.includes(q));
 	} else {
-		searchEmojis = customEmojis.filter(emoji => (emoji.name.includes(q) || emoji.aliases.includes(q)) && [...selectedTags].every(t => emoji.aliases.includes(t)));
+		searchEmojis = customEmojis.value.filter(emoji => (emoji.name.includes(q) || emoji.aliases.includes(q)) && [...selectedTags].every(t => emoji.aliases.includes(t)));
 	}
 }
 

packages/frontend/src/pages/emoji-edit-dialog.vue

@@ -15,7 +15,7 @@
 			<MkInput v-model="name">
 				<template #label>{{ i18n.ts.name }}</template>
 			</MkInput>
-			<MkInput v-model="category" :datalist="categories">
+			<MkInput v-model="category" :datalist="customEmojiCategories">
 				<template #label>{{ i18n.ts.category }}</template>
 			</MkInput>
 			<MkInput v-model="aliases">
@@ -36,7 +36,7 @@ import MkInput from '@/components/MkInput.vue';
 import * as os from '@/os';
 import { unique } from '@/scripts/array';
 import { i18n } from '@/i18n';
-import { getCustomEmojiCategories } from '@/custom-emojis';
+import { customEmojiCategories } from '@/custom-emojis';
 
 const props = defineProps<{
 	emoji: any,
@@ -46,7 +46,6 @@ let dialog = $ref(null);
 let name: string = $ref(props.emoji.name);
 let category: string = $ref(props.emoji.category);
 let aliases: string = $ref(props.emoji.aliases.join(' '));
-const categories = getCustomEmojiCategories();
 
 const emit = defineEmits<{
 	(ev: 'done', v: { deleted?: boolean, updated?: any }): void,

packages/frontend/src/pages/mfm-cheat-sheet.vue

@@ -313,7 +313,7 @@ let preview_mention = $ref('@example');
 let preview_hashtag = $ref('#test');
 let preview_url = $ref('https://example.com');
 let preview_link = $ref(`[${i18n.ts._mfm.dummy}](https://example.com)`);
-let preview_emoji = $ref(customEmojis.length ? `:${customEmojis[0].name}:` : ':emojiname:');
+let preview_emoji = $ref(customEmojis.value.length ? `:${customEmojis.value[0].name}:` : ':emojiname:');
 let preview_bold = $ref(`**${i18n.ts._mfm.dummy}**`);
 let preview_small = $ref(`<small>${i18n.ts._mfm.dummy}</small>`);
 let preview_center = $ref(`<center>${i18n.ts._mfm.dummy}</center>`);

packages/frontend/src/scripts/aiscript/api.ts

@@ -10,7 +10,7 @@ export function createAiScriptEnv(opts) {
 		USER_ID: $i ? values.STR($i.id) : values.NULL,
 		USER_NAME: $i ? values.STR($i.name) : values.NULL,
 		USER_USERNAME: $i ? values.STR($i.username) : values.NULL,
-		CUSTOM_EMOJIS: utils.jsToVal(customEmojis),
+		CUSTOM_EMOJIS: utils.jsToVal(customEmojis.value),
 		'Mk:dialog': values.FN_NATIVE(async ([title, text, type]) => {
 			await os.alert({
 				type: type ? type.value : 'info',

pnpm-lock.yaml

@@ -142,7 +142,7 @@ importers:
       file-type: 18.2.0
       fluent-ffmpeg: 2.1.2
       form-data: ^4.0.0
-      got: 12.5.3
+      got: ^12.5.3
       hpagent: 1.2.0
       ioredis: 4.28.5
       ip-cidr: 3.0.11
@@ -201,7 +201,6 @@ importers:
       typeorm: 0.3.11
       typescript: 4.9.4
       ulid: 2.3.0
-      undici: ^5.16.0
       unzipper: 0.10.11
       uuid: 9.0.0
       vary: 1.1.2
@@ -265,6 +264,7 @@ importers:
       misskey-js: 0.0.14
       ms: 3.0.0-canary.1
       nested-property: 4.0.0
+      node-fetch: 3.3.0
       nodemailer: 6.9.0
       nsfwjs: 2.4.2_@tensorflow+tfjs@4.2.0
       oauth: 0.10.0
@@ -306,7 +306,6 @@ importers:
       typeorm: 0.3.11_ioredis@4.28.5+pg@8.8.0
       typescript: 4.9.4
       ulid: 2.3.0
-      undici: 5.16.0
       unzipper: 0.10.11
       uuid: 9.0.0
       vary: 1.1.2
@@ -372,7 +371,6 @@ importers:
       execa: 6.1.0
       jest: 29.3.1_@types+node@18.11.18
       jest-mock: 29.3.1
-      node-fetch: 3.3.0
 
   packages/frontend:
     specifiers:
@@ -3801,7 +3799,7 @@ packages:
   /axios/0.24.0:
     resolution: {integrity: sha512-Q6cWsys88HoPgAaFAVUb0WpPk0O8iTeisR9IMqy9G8AbO4NlpVknrnQS03zzF9PGAWgO3cgletO3VjV/P7VztA==}
     dependencies:
-      follow-redirects: 1.15.2_debug@4.3.4
+      follow-redirects: 1.15.2
     transitivePeerDependencies:
       - debug
     dev: false
@@ -3809,7 +3807,7 @@ packages:
   /axios/0.27.2_debug@4.3.4:
     resolution: {integrity: sha512-t+yRIyySRTp/wua5xEr+z1q60QmLq8ABsS5O9Me1AsE5dfKqgnCFzwiCZZ/cGNd1lq4/7akDWMxdhVlucjmnOQ==}
     dependencies:
-      follow-redirects: 1.15.2_debug@4.3.4
+      follow-redirects: 1.15.2
       form-data: 4.0.0
     transitivePeerDependencies:
       - debug
@@ -6973,7 +6971,7 @@ packages:
       readable-stream: 2.3.7
     dev: false
 
-  /follow-redirects/1.15.2_debug@4.3.4:
+  /follow-redirects/1.15.2:
     resolution: {integrity: sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==}
     engines: {node: '>=4.0'}
     peerDependencies:
@@ -6981,8 +6979,6 @@ packages:
     peerDependenciesMeta:
       debug:
         optional: true
-    dependencies:
-      debug: 4.3.4
 
   /for-each/0.3.3:
     resolution: {integrity: sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==}