refactor: remove autobind-decorator dep

packages/frontend/package.json

@@ -19,7 +19,6 @@
 		"@tabler/icons-webfont": "2.12.0",
 		"@vitejs/plugin-vue": "4.1.0",
 		"@vue/compiler-sfc": "3.2.47",
-		"autobind-decorator": "2.4.0",
 		"autosize": "5.0.2",
 		"blurhash": "2.0.5",
 		"broadcast-channel": "4.20.2",

packages/frontend/src/directives/user-preview.ts

@@ -1,5 +1,4 @@
 import { defineAsyncComponent, Directive, ref } from 'vue';
-import autobind from 'autobind-decorator';
 import { popup } from '@/os';
 
 export class UserPreview {
@@ -15,9 +14,16 @@ export class UserPreview {
 		this.user = user;
 
 		this.attach();
+
+		this.show = this.show.bind(this);
+		this.close = this.close.bind(this);
+		this.onMouseover = this.onMouseover.bind(this);
+		this.onMouseleave = this.onMouseleave.bind(this);
+		this.onClick = this.onClick.bind(this);
+		this.attach = this.attach.bind(this);
+		this.detach = this.detach.bind(this);
 	}
 
-	@autobind
 	private show() {
 		if (!document.body.contains(this.el)) return;
 		if (this.promise) return;
@@ -53,7 +59,6 @@ export class UserPreview {
 		}, 1000);
 	}
 
-	@autobind
 	private close() {
 		if (this.promise) {
 			window.clearInterval(this.checkTimer);
@@ -62,34 +67,29 @@ export class UserPreview {
 		}
 	}
 
-	@autobind
 	private onMouseover() {
 		window.clearTimeout(this.showTimer);
 		window.clearTimeout(this.hideTimer);
 		this.showTimer = window.setTimeout(this.show, 500);
 	}
 
-	@autobind
 	private onMouseleave() {
 		window.clearTimeout(this.showTimer);
 		window.clearTimeout(this.hideTimer);
 		this.hideTimer = window.setTimeout(this.close, 500);
 	}
 
-	@autobind
 	private onClick() {
 		window.clearTimeout(this.showTimer);
 		this.close();
 	}
 
-	@autobind
 	public attach() {
 		this.el.addEventListener('mouseover', this.onMouseover);
 		this.el.addEventListener('mouseleave', this.onMouseleave);
 		this.el.addEventListener('click', this.onClick);
 	}
 
-	@autobind
 	public detach() {
 		this.el.removeEventListener('mouseover', this.onMouseover);
 		this.el.removeEventListener('mouseleave', this.onMouseleave);

packages/frontend/src/scripts/hpml/evaluator.ts

@@ -1,4 +1,3 @@
-import autobind from 'autobind-decorator';
 import { ref, Ref, unref } from 'vue';
 import { collectPageVars } from '../collect-page-vars';
 import { initHpmlLib } from './lib';
@@ -51,7 +50,6 @@ export class Hpml {
 		this.eval();
 	}
 
-	@autobind
 	public eval() {
 		try {
 			this.vars.value = this.evaluateVars();
@@ -60,7 +58,6 @@ export class Hpml {
 		}
 	}
 
-	@autobind
 	public interpolate(str: string) {
 		if (str == null) return null;
 		return str.replace(/{(.+?)}/g, match => {
@@ -69,12 +66,10 @@ export class Hpml {
 		});
 	}
 
-	@autobind
 	public registerCanvas(id: string, canvas: any) {
 		this.canvases[id] = canvas;
 	}
 
-	@autobind
 	public updatePageVar(name: string, value: any) {
 		const pageVar = this.pageVars.find(v => v.name === name);
 		if (pageVar !== undefined) {
@@ -84,13 +79,11 @@ export class Hpml {
 		}
 	}
 
-	@autobind
 	public updateRandomSeed(seed: string) {
 		this.opts.randomSeed = seed;
 		this.envVars.SEED = seed;
 	}
 
-	@autobind
 	private _interpolateScope(str: string, scope: HpmlScope) {
 		return str.replace(/{(.+?)}/g, match => {
 			const v = scope.getState(match.slice(1, -1).trim());
@@ -98,7 +91,6 @@ export class Hpml {
 		});
 	}
 
-	@autobind
 	public evaluateVars(): Record<string, any> {
 		const values: Record<string, any> = {};
 
@@ -117,7 +109,6 @@ export class Hpml {
 		return values;
 	}
 
-	@autobind
 	private evaluate(expr: Expr, scope: HpmlScope): any {
 		if (isLiteralValue(expr)) {
 			if (expr.type === null) {

packages/frontend/src/scripts/hpml/index.ts

@@ -2,7 +2,6 @@
  * Hpml
  */
 
-import autobind from 'autobind-decorator';
 import { Hpml } from './evaluator';
 import { funcDefs } from './lib';
 
@@ -61,7 +60,6 @@ export class HpmlScope {
 		this.name = name ?? 'anonymous';
 	}
 
-	@autobind
 	public createChildScope(states: Record<string, any>, name?: HpmlScope['name']): HpmlScope {
 		const layer = [states, ...this.layerdStates];
 		return new HpmlScope(layer, name);
@@ -71,7 +69,6 @@ export class HpmlScope {
 	 * 指定した名前の変数の値を取得します
 	 * @param name 変数名
 	 */
-	@autobind
 	public getState(name: string): any {
 		for (const later of this.layerdStates) {
 			const state = later[name];

packages/frontend/src/scripts/hpml/type-checker.ts

@@ -1,4 +1,3 @@
-import autobind from 'autobind-decorator';
 import { isLiteralValue } from './expr';
 import { funcDefs } from './lib';
 import { envVarsDef } from '.';
@@ -23,7 +22,6 @@ export class HpmlTypeChecker {
 		this.pageVars = pageVars;
 	}
 
-	@autobind
 	public typeCheck(v: Expr): TypeError | null {
 		if (isLiteralValue(v)) return null;
 
@@ -61,7 +59,6 @@ export class HpmlTypeChecker {
 		return null;
 	}
 
-	@autobind
 	public getExpectedType(v: Expr, slot: number): Type {
 		const def = funcDefs[v.type ?? ''];
 		if (def == null) {
@@ -89,7 +86,6 @@ export class HpmlTypeChecker {
 		}
 	}
 
-	@autobind
 	public infer(v: Expr): Type {
 		if (v.type === null) return null;
 		if (v.type === 'text') return 'string';
@@ -144,7 +140,6 @@ export class HpmlTypeChecker {
 		}
 	}
 
-	@autobind
 	public getVarByName(name: string): Variable {
 		const v = this.variables.find(x => x.name === name);
 		if (v !== undefined) {
@@ -154,25 +149,21 @@ export class HpmlTypeChecker {
 		}
 	}
 
-	@autobind
 	public getVarsByType(type: Type): Variable[] {
 		if (type == null) return this.variables;
 		return this.variables.filter(x => (this.infer(x) === null) || (this.infer(x) === type));
 	}
 
-	@autobind
 	public getEnvVarsByType(type: Type): string[] {
 		if (type == null) return Object.keys(envVarsDef);
 		return Object.entries(envVarsDef).filter(([k, v]) => v === null || type === v).map(([k, v]) => k);
 	}
 
-	@autobind
 	public getPageVarsByType(type: Type): string[] {
 		if (type == null) return this.pageVars.map(v => v.name);
 		return this.pageVars.filter(v => type === v.type).map(v => v.name);
 	}
 
-	@autobind
 	public isUsedName(name: string) {
 		if (this.variables.some(v => v.name === name)) {
 			return true;

packages/misskey-js/package.json

@@ -40,7 +40,6 @@
 	"dependencies": {
 		"@swc/cli": "0.1.62",
 		"@swc/core": "1.3.42",
-		"autobind-decorator": "^2.4.0",
 		"eventemitter3": "5.0.0",
 		"reconnecting-websocket": "^4.4.0"
 	}

packages/misskey-js/src/streaming.ts

@@ -1,4 +1,3 @@
-import autobind from 'autobind-decorator';
 import { EventEmitter } from 'eventemitter3';
 import ReconnectingWebsocket from 'reconnecting-websocket';
 import type { BroadcastEvents, Channels } from './streaming.types.js';
@@ -36,6 +35,20 @@ export default class Stream extends EventEmitter<StreamEvents> {
 		WebSocket?: any;
 	}) {
 		super();
+
+		this.genId = this.genId.bind(this);
+		this.useChannel = this.useChannel.bind(this);
+		this.useSharedConnection = this.useSharedConnection.bind(this);
+		this.removeSharedConnection = this.removeSharedConnection.bind(this);
+		this.removeSharedConnectionPool = this.removeSharedConnectionPool.bind(this);
+		this.connectToChannel = this.connectToChannel.bind(this);
+		this.disconnectToChannel = this.disconnectToChannel.bind(this);
+		this.onOpen = this.onOpen.bind(this);
+		this.onClose = this.onClose.bind(this);
+		this.onMessage = this.onMessage.bind(this);
+		this.send = this.send.bind(this);
+		this.close = this.close.bind(this);
+
 		options = options ?? { };
 
 		const query = urlQuery({
@@ -56,12 +69,10 @@ export default class Stream extends EventEmitter<StreamEvents> {
 		this.stream.addEventListener('message', this.onMessage);
 	}
 
-	@autobind
 	private genId(): string {
 		return (++this.idCounter).toString();
 	}
 
-	@autobind
 	public useChannel<C extends keyof Channels>(channel: C, params?: Channels[C]['params'], name?: string): Connection<Channels[C]> {
 		if (params) {
 			return this.connectToChannel(channel, params);
@@ -70,7 +81,6 @@ export default class Stream extends EventEmitter<StreamEvents> {
 		}
 	}
 
-	@autobind
 	private useSharedConnection<C extends keyof Channels>(channel: C, name?: string): SharedConnection<Channels[C]> {
 		let pool = this.sharedConnectionPools.find(p => p.channel === channel);
 
@@ -84,24 +94,20 @@ export default class Stream extends EventEmitter<StreamEvents> {
 		return connection;
 	}
 
-	@autobind
 	public removeSharedConnection(connection: SharedConnection): void {
 		this.sharedConnections = this.sharedConnections.filter(c => c !== connection);
 	}
 
-	@autobind
 	public removeSharedConnectionPool(pool: Pool): void {
 		this.sharedConnectionPools = this.sharedConnectionPools.filter(p => p !== pool);
 	}
 
-	@autobind
 	private connectToChannel<C extends keyof Channels>(channel: C, params: Channels[C]['params']): NonSharedConnection<Channels[C]> {
 		const connection = new NonSharedConnection(this, channel, this.genId(), params);
 		this.nonSharedConnections.push(connection);
 		return connection;
 	}
 
-	@autobind
 	public disconnectToChannel(connection: NonSharedConnection): void {
 		this.nonSharedConnections = this.nonSharedConnections.filter(c => c !== connection);
 	}
@@ -109,7 +115,6 @@ export default class Stream extends EventEmitter<StreamEvents> {
 	/**
 	 * Callback of when open connection
 	 */
-	@autobind
 	private onOpen(): void {
 		const isReconnect = this.state === 'reconnecting';
 
@@ -126,7 +131,6 @@ export default class Stream extends EventEmitter<StreamEvents> {
 	/**
 	 * Callback of when close connection
 	 */
-	@autobind
 	private onClose(): void {
 		if (this.state === 'connected') {
 			this.state = 'reconnecting';
@@ -137,7 +141,6 @@ export default class Stream extends EventEmitter<StreamEvents> {
 	/**
 	 * Callback of when received a message from connection
 	 */
-	@autobind
 	private onMessage(message: { data: string; }): void {
 		const { type, body } = JSON.parse(message.data);
 
@@ -167,7 +170,6 @@ export default class Stream extends EventEmitter<StreamEvents> {
 	/**
 	 * Send a message to connection
 	 */
-	@autobind
 	public send(typeOrPayload: any, payload?: any): void {
 		const data = payload === undefined ? typeOrPayload : {
 			type: typeOrPayload,
@@ -180,7 +182,6 @@ export default class Stream extends EventEmitter<StreamEvents> {
 	/**
 	 * Close this connection
 	 */
-	@autobind
 	public close(): void {
 		this.stream.close();
 	}
@@ -197,6 +198,12 @@ class Pool {
 	private isConnected = false;
 
 	constructor(stream: Stream, channel: string, id: string) {
+		this.onStreamDisconnected = this.onStreamDisconnected.bind(this);
+		this.inc = this.inc.bind(this);
+		this.dec = this.dec.bind(this);
+		this.connect = this.connect.bind(this);
+		this.disconnect = this.disconnect.bind(this);
+	
 		this.channel = channel;
 		this.stream = stream;
 		this.id = id;
@@ -204,12 +211,10 @@ class Pool {
 		this.stream.on('_disconnected_', this.onStreamDisconnected);
 	}
 
-	@autobind
 	private onStreamDisconnected(): void {
 		this.isConnected = false;
 	}
 
-	@autobind
 	public inc(): void {
 		if (this.users === 0 && !this.isConnected) {
 			this.connect();
@@ -224,7 +229,6 @@ class Pool {
 		}
 	}
 
-	@autobind
 	public dec(): void {
 		this.users--;
 
@@ -238,7 +242,6 @@ class Pool {
 		}
 	}
 
-	@autobind
 	public connect(): void {
 		if (this.isConnected) return;
 		this.isConnected = true;
@@ -248,7 +251,6 @@ class Pool {
 		});
 	}
 
-	@autobind
 	private disconnect(): void {
 		this.stream.off('_disconnected_', this.onStreamDisconnected);
 		this.stream.send('disconnect', { id: this.id });
@@ -268,12 +270,13 @@ export abstract class Connection<Channel extends AnyOf<Channels> = any> extends
 	constructor(stream: Stream, channel: string, name?: string) {
 		super();
 
+		this.send = this.send.bind(this);
+
 		this.stream = stream;
 		this.channel = channel;
 		this.name = name;
 	}
 
-	@autobind
 	public send<T extends keyof Channel['receives']>(type: T, body: Channel['receives'][T]): void {
 		this.stream.send('ch', {
 			id: this.id,
@@ -297,11 +300,12 @@ class SharedConnection<Channel extends AnyOf<Channels> = any> extends Connection
 	constructor(stream: Stream, channel: string, pool: Pool, name?: string) {
 		super(stream, channel, name);
 
+		this.dispose = this.dispose.bind(this);
+
 		this.pool = pool;
 		this.pool.inc();
 	}
 
-	@autobind
 	public dispose(): void {
 		this.pool.dec();
 		this.removeAllListeners();
@@ -316,13 +320,15 @@ class NonSharedConnection<Channel extends AnyOf<Channels> = any> extends Connect
 	constructor(stream: Stream, channel: string, id: string, params: Channel['params']) {
 		super(stream, channel);
 
+		this.connect = this.connect.bind(this);
+		this.dispose = this.dispose.bind(this);
+
 		this.params = params;
 		this.id = id;
 
 		this.connect();
 	}
 
-	@autobind
 	public connect(): void {
 		this.stream.send('connect', {
 			channel: this.channel,
@@ -331,7 +337,6 @@ class NonSharedConnection<Channel extends AnyOf<Channels> = any> extends Connect
 		});
 	}
 
-	@autobind
 	public dispose(): void {
 		this.removeAllListeners();
 		this.stream.send('disconnect', { id: this.id });

pnpm-lock.yaml

@@ -612,9 +612,6 @@ importers:
       '@vue/compiler-sfc':
         specifier: 3.2.47
         version: 3.2.47
-      autobind-decorator:
-        specifier: 2.4.0
-        version: 2.4.0
       autosize:
         specifier: 5.0.2
         version: 5.0.2
@@ -865,9 +862,6 @@ importers:
       '@swc/core':
         specifier: 1.3.42
         version: 1.3.42
-      autobind-decorator:
-        specifier: ^2.4.0
-        version: 2.4.0
       eventemitter3:
         specifier: 5.0.0
         version: 5.0.0