refactor: 🚨 linting fix

package.json

@@ -57,7 +57,7 @@
 		"gulp-replace": "1.1.4",
 		"gulp-terser": "2.1.0",
 		"install-peers": "^1.0.4",
-		"rome": "^12.1.3",
+		"rome": "^v12.1.3-nightly.f65b0d9",
 		"start-server-and-test": "1.15.2",
 		"typescript": "5.1.6"
 	}

packages/backend/migration/1678426061773-tweak-varchar-length.js

@@ -1,9 +1,15 @@
 export class tweakVarcharLength1678426061773 {
-		name = 'tweakVarcharLength1678426061773'
+	name = "tweakVarcharLength1678426061773";
 
 	async up(queryRunner) {
-			await queryRunner.query(`ALTER TABLE "meta" ALTER COLUMN "smtpUser" TYPE character varying(1024)`, undefined);
-			await queryRunner.query(`ALTER TABLE "meta" ALTER COLUMN "smtpPass" TYPE character varying(1024)`, undefined);
+		await queryRunner.query(
+			`ALTER TABLE "meta" ALTER COLUMN "smtpUser" TYPE character varying(1024)`,
+			undefined,
+		);
+		await queryRunner.query(
+			`ALTER TABLE "meta" ALTER COLUMN "smtpPass" TYPE character varying(1024)`,
+			undefined,
+		);
 	}
 
 	async down(queryRunner) {}

packages/backend/native-utils/package.json

@@ -43,6 +43,7 @@
 		"universal": "napi universal",
 		"version": "napi version",
 		"format": "cargo fmt --all",
+		"lint": "cargo clippy --fix",
 		"cargo:test": "pnpm run cargo:unit && pnpm run cargo:integration",
 		"cargo:unit": "cargo test unit_test && cargo test -F napi unit_test",
 		"cargo:integration": "cargo test -F noarray int_test -- --test-threads=1"

packages/backend/native-utils/src/model/repository/antenna.rs

@@ -46,7 +46,7 @@ impl Repository<Antenna> for antenna::Model {
             src: self.src.try_into()?,
             user_list_id: self.user_list_id,
             user_group_id,
-            users: self.users.into(),
+            users: self.users,
             instances: self.instances.into(),
             case_sensitive: self.case_sensitive,
             notify: self.notify,

packages/backend/native-utils/src/model/schema/antenna.rs

@@ -58,7 +58,7 @@ impl TryFrom<AntennaSrcEnum> for super::AntennaSrc {
 
 // ---- TODO: could be macro
 impl Schema<Self> for super::Antenna {}
-pub static VALIDATOR: Lazy<JSONSchema> = Lazy::new(|| super::Antenna::validator());
+pub static VALIDATOR: Lazy<JSONSchema> = Lazy::new(super::Antenna::validator);
 // ----
 
 cfg_if! {

packages/backend/native-utils/src/model/schema/app.rs

@@ -91,7 +91,7 @@ pub enum AppPermission {
 
 impl Schema<Self> for App {}
 
-pub static VALIDATOR: Lazy<JSONSchema> = Lazy::new(|| App::validator());
+pub static VALIDATOR: Lazy<JSONSchema> = Lazy::new(App::validator);
 
 #[cfg(test)]
 mod unit_test {

packages/backend/native-utils/tests/common.rs

@@ -148,8 +148,8 @@ async fn setup_model(db: &DbConn) {
             let user_model = entity::user::Model {
                 id: user_id.to_owned(),
                 created_at: Utc::now().into(),
-                username: name.to_lowercase().to_string(),
-                username_lower: name.to_lowercase().to_string(),
+                username: name.to_lowercase(),
+                username_lower: name.to_lowercase(),
                 name: Some(name.to_string()),
                 token: Some(gen_string(16)),
                 is_admin: true,

packages/backend/native-utils/tests/model/repository/antenna.rs

@@ -43,18 +43,16 @@ mod int_test {
             keywords: vec![
                 vec!["foo".to_string(), "bar".to_string()],
                 vec!["foobar".to_string()],
-            ]
-            .into(),
+            ],
             exclude_keywords: vec![
                 vec!["abc".to_string()],
                 vec!["def".to_string(), "ghi".to_string()],
-            ]
-            .into(),
+            ],
             src: schema::AntennaSrc::All,
             user_list_id: None,
             user_group_id: None,
-            users: vec![].into(),
-            instances: vec![].into(),
+            users: vec![],
+            instances: vec![],
             case_sensitive: true,
             notify: true,
             with_replies: false,

packages/backend/src/const.ts

@@ -1,5 +1,8 @@
 import config from "@/config/index.js";
-import { DB_MAX_NOTE_TEXT_LENGTH, DB_MAX_IMAGE_COMMENT_LENGTH } from "@/misc/hard-limits.js";
+import {
+	DB_MAX_NOTE_TEXT_LENGTH,
+	DB_MAX_IMAGE_COMMENT_LENGTH,
+} from "@/misc/hard-limits.js";
 
 export const MAX_NOTE_TEXT_LENGTH = Math.min(
 	config.maxNoteLength ?? 3000,

packages/backend/src/misc/download-url.ts

@@ -24,7 +24,7 @@ export async function downloadUrl(url: string, path: string): Promise<void> {
 		.stream(url, {
 			headers: {
 				"User-Agent": config.userAgent,
-				"Host": new URL(url).hostname,
+				Host: new URL(url).hostname,
 			},
 			timeout: {
 				lookup: timeout,

packages/client/.eslintrc.json

@@ -0,0 +1,7 @@
+{
+  "extends": ["@eslint-sets/vue3", "@eslint-sets/vue3-ts"],
+	"plugins": ["file-progress", "prettier"],
+	"rules": {
+		"file-progress/activate": 1
+	}
+}

packages/client/package.json

@@ -4,11 +4,14 @@
 	"scripts": {
 		"watch": "pnpm vite build --watch --mode development",
 		"build": "pnpm vite build",
-		"lint": "pnpm rome check \"src/**/*.{ts,vue}\"",
-		"format": "pnpm rome format * --write && pnpm prettier --write '**/*.{scss,vue}'"
+		"lint": "pnpm rome check **/*.ts --apply && pnpm run lint:vue",
+		"lint:vue": "pnpm paralint --ext .vue --fix '**/*.vue' --cache",
+		"format": "pnpm rome format * --write && pnpm prettier --write '**/*.{scss,vue}' --cache --cache-strategy metadata"
 	},
 	"devDependencies": {
 		"@discordapp/twemoji": "14.1.2",
+		"@eslint-sets/eslint-config-vue3": "^5.6.1",
+		"@eslint-sets/eslint-config-vue3-ts": "^3.3.0",
 		"@phosphor-icons/web": "^2.0.3",
 		"@rollup/plugin-alias": "3.1.9",
 		"@rollup/plugin-json": "4.1.0",
@@ -46,6 +49,8 @@
 		"date-fns": "2.30.0",
 		"emojilib": "github:thatonecalculator/emojilib",
 		"escape-regexp": "0.0.1",
+		"eslint-config-prettier": "^8.6.0",
+		"eslint-plugin-file-progress": "^1.3.0",
 		"eventemitter3": "5.0.1",
 		"fast-blurhash": "^1.1.2",
 		"focus-trap": "^7.5.2",
@@ -57,6 +62,7 @@
 		"katex": "0.16.8",
 		"matter-js": "0.18.0",
 		"mfm-js": "0.23.3",
+		"paralint": "^1.2.1",
 		"photoswipe": "5.3.8",
 		"prettier": "3.0.0",
 		"prettier-plugin-vue": "1.1.6",

packages/client/src/components/MkAbuseReport.vue

@@ -80,11 +80,11 @@ const emit = defineEmits<{
 	(ev: "resolved", reportId: string): void;
 }>();
 
-let forward = $ref(props.report.forwarded);
+const forward = $ref(props.report.forwarded);
 
 function resolve() {
 	os.apiWithDialog("admin/resolve-abuse-user-report", {
-		forward: forward,
+		forward,
 		reportId: props.report.id,
 	}).then(() => {
 		emit("resolved", props.report.id);

packages/client/src/components/MkAbuseReportWindow.vue

@@ -41,7 +41,7 @@
 
 <script setup lang="ts">
 import { ref } from "vue";
-import * as Misskey from "calckey-js";
+import type * as Misskey from "calckey-js";
 import XWindow from "@/components/MkWindow.vue";
 import MkTextarea from "@/components/form/textarea.vue";
 import MkButton from "@/components/MkButton.vue";

packages/client/src/components/MkAnalogClock.vue

@@ -109,12 +109,12 @@
 
 <script lang="ts" setup>
 import {
-	ref,
 	computed,
-	onMounted,
-	onBeforeUnmount,
-	shallowRef,
 	nextTick,
+	onBeforeUnmount,
+	onMounted,
+	ref,
+	shallowRef,
 } from "vue";
 import tinycolor from "tinycolor2";
 import { globalEvents } from "@/events.js";
@@ -173,21 +173,21 @@ const texts = computed(() => {
 	return angles;
 });
 
-let enabled = true;
-let majorGraduationColor = $ref<string>();
+let enabled = true,
+	majorGraduationColor = $ref<string>(),
 	// let minorGraduationColor = $ref<string>();
-let sHandColor = $ref<string>();
-let mHandColor = $ref<string>();
-let hHandColor = $ref<string>();
-let nowColor = $ref<string>();
-let h = $ref<number>(0);
-let m = $ref<number>(0);
-let s = $ref<number>(0);
-let hAngle = $ref<number>(0);
-let mAngle = $ref<number>(0);
-let sAngle = $ref<number>(0);
-let disableSAnimate = $ref(false);
-let sOneRound = false;
+	sHandColor = $ref<string>(),
+	mHandColor = $ref<string>(),
+	hHandColor = $ref<string>(),
+	nowColor = $ref<string>(),
+	h = $ref<number>(0),
+	m = $ref<number>(0),
+	s = $ref<number>(0),
+	hAngle = $ref<number>(0),
+	mAngle = $ref<number>(0),
+	sAngle = $ref<number>(0),
+	disableSAnimate = $ref(false),
+	sOneRound = false;
 
 function tick() {
 	const now = new Date();

packages/client/src/components/MkAutocomplete.vue

@@ -85,11 +85,11 @@
 <script lang="ts">
 import {
 	markRaw,
-	ref,
-	onUpdated,
-	onMounted,
-	onBeforeUnmount,
 	nextTick,
+	onBeforeUnmount,
+	onMounted,
+	onUpdated,
+	ref,
 	watch,
 } from "vue";
 import contains from "@/scripts/contains";
@@ -99,17 +99,17 @@ import { acct } from "@/filters/user";
 import * as os from "@/os";
 import { MFM_TAGS } from "@/scripts/mfm-tags";
 import { defaultStore } from "@/store";
-import { emojilist, addSkinTone } from "@/scripts/emojilist";
+import { addSkinTone, emojilist } from "@/scripts/emojilist";
 import { instance } from "@/instance";
 import { i18n } from "@/i18n";
 
-type EmojiDef = {
+interface EmojiDef {
 	emoji: string;
 	name: string;
 	aliasOf?: string;
 	url?: string;
 	isCustomEmoji?: boolean;
-};
+}
 
 const lib = emojilist.filter((x) => x.category !== "flags");
 

packages/client/src/components/MkButton.vue

@@ -49,8 +49,8 @@ const emit = defineEmits<{
 	(ev: "click", payload: MouseEvent): void;
 }>();
 
-let el = $ref<HTMLElement | null>(null);
-let ripples = $ref<HTMLElement | null>(null);
+const el = $ref<HTMLElement | null>(null);
+const ripples = $ref<HTMLElement | null>(null);
 
 onMounted(() => {
 	if (props.autofocus) {

packages/client/src/components/MkCaptcha.vue

@@ -6,11 +6,11 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, computed, onMounted, onBeforeUnmount, watch } from "vue";
+import { computed, onBeforeUnmount, onMounted, ref, watch } from "vue";
 import { defaultStore } from "@/store";
 import { i18n } from "@/i18n";
 
-type Captcha = {
+interface Captcha {
 	render(
 		container: string | Node,
 		options: {
@@ -31,7 +31,7 @@ type Captcha = {
 	execute(id: string): void;
 	reset(id?: string): void;
 	getResponse(id: string): string;
-};
+}
 
 type CaptchaProvider = "hcaptcha" | "recaptcha";
 
@@ -105,7 +105,7 @@ function requestRender() {
 		captcha.value.render(captchaEl.value, {
 			sitekey: props.sitekey,
 			theme: defaultStore.state.darkMode ? "dark" : "light",
-			callback: callback,
+			callback,
 			"expired-callback": callback,
 			"error-callback": callback,
 		});

packages/client/src/components/MkChannelList.vue

@@ -24,7 +24,8 @@
 
 <script lang="ts" setup>
 import MkChannelPreview from "@/components/MkChannelPreview.vue";
-import MkPagination, { Paging } from "@/components/MkPagination.vue";
+import type { Paging } from "@/components/MkPagination.vue";
+import MkPagination from "@/components/MkPagination.vue";
 import { i18n } from "@/i18n";
 
 const props = withDefaults(

packages/client/src/components/MkChart.vue

@@ -8,23 +8,24 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, ref, watch, PropType, onUnmounted } from "vue";
+import type { PropType } from "vue";
+import { onMounted, onUnmounted, ref, watch } from "vue";
 import {
-	Chart,
 	ArcElement,
-	LineElement,
-	BarElement,
-	PointElement,
 	BarController,
-	LineController,
+	BarElement,
 	CategoryScale,
-	LinearScale,
-	TimeScale,
+	Chart,
+	Filler,
 	Legend,
+	LineController,
+	LineElement,
+	LinearScale,
+	PointElement,
+	SubTitle,
+	TimeScale,
 	Title,
 	Tooltip,
-	SubTitle,
-	Filler,
 } from "chart.js";
 import "chartjs-adapter-date-fns";
 import { enUS } from "date-fns/locale";
@@ -127,8 +128,8 @@ const getColor = (i) => {
 };
 
 const now = new Date();
-let chartInstance: Chart = null;
-let chartData: {
+let chartInstance: Chart = null,
+	chartData: {
 		series: {
 			name: string;
 			type: "line" | "area";

packages/client/src/components/MkChatPreview.vue

@@ -26,7 +26,7 @@
 						: message.user
 				"
 				:show-indicator="true"
-				disableLink
+				disable-link
 			/>
 			<header v-if="message.groupId">
 				<span class="name">{{ message.group.name }}</span>

packages/client/src/components/MkContextMenu.vue

@@ -12,9 +12,9 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, onBeforeUnmount } from "vue";
+import { onBeforeUnmount, onMounted } from "vue";
 import MkMenu from "./MkMenu.vue";
-import { MenuItem } from "./types/menu.vue";
+import type { MenuItem } from "./types/menu.vue";
 import contains from "@/scripts/contains";
 import * as os from "@/os";
 
@@ -27,13 +27,13 @@ const emit = defineEmits<{
 	(ev: "closed"): void;
 }>();
 
-let rootEl = $ref<HTMLDivElement>();
+const rootEl = $ref<HTMLDivElement>();
 
-let zIndex = $ref<number>(os.claimZIndex("high"));
+const zIndex = $ref<number>(os.claimZIndex("high"));
 
 onMounted(() => {
-	let left = props.ev.pageX + 1; // 間違って右ダブルクリックした場合に意図せずアイテムがクリックされるのを防ぐため + 1
-	let top = props.ev.pageY + 1; // 間違って右ダブルクリックした場合に意図せずアイテムがクリックされるのを防ぐため + 1
+	let left = props.ev.pageX + 1, // 間違って右ダブルクリックした場合に意図せずアイテムがクリックされるのを防ぐため + 1
+		top = props.ev.pageY + 1; // 間違って右ダブルクリックした場合に意図せずアイテムがクリックされるのを防ぐため + 1
 
 	const width = rootEl.offsetWidth;
 	const height = rootEl.offsetHeight;

packages/client/src/components/MkCropperDialog.vue

@@ -37,7 +37,7 @@
 
 <script lang="ts" setup>
 import { nextTick, onMounted } from "vue";
-import * as misskey from "calckey-js";
+import type * as misskey from "calckey-js";
 import Cropper from "cropperjs";
 import tinycolor from "tinycolor2";
 import XModalWindow from "@/components/MkModalWindow.vue";
@@ -62,10 +62,10 @@ const props = defineProps<{
 const imgUrl = `${url}/proxy/image.webp?${query({
 	url: props.file.url,
 })}`;
-let dialogEl = $ref<InstanceType<typeof XModalWindow>>();
-let imgEl = $ref<HTMLImageElement>();
-let cropper: Cropper | null = null;
-let loading = $ref(true);
+const dialogEl = $ref<InstanceType<typeof XModalWindow>>();
+const imgEl = $ref<HTMLImageElement>();
+let cropper: Cropper | null = null,
+	loading = $ref(true);
 
 const ok = async () => {
 	const promise = new Promise<misskey.entities.DriveFile>(async (res) => {

packages/client/src/components/MkCwButton.vue

@@ -15,7 +15,7 @@
 <script lang="ts" setup>
 import { computed, ref } from "vue";
 import { length } from "stringz";
-import * as misskey from "calckey-js";
+import type * as misskey from "calckey-js";
 import { concat } from "@/scripts/array";
 import { i18n } from "@/i18n";
 

packages/client/src/components/MkDateSeparatedList.vue

@@ -1,5 +1,6 @@
 <script lang="ts">
-import { defineComponent, h, PropType, TransitionGroup } from "vue";
+import type { PropType } from "vue";
+import { TransitionGroup, defineComponent, h } from "vue";
 import MkAd from "@/components/global/MkAd.vue";
 import { i18n } from "@/i18n";
 import { defaultStore } from "@/store";
@@ -51,7 +52,7 @@ export default defineComponent({
 				if (!slots || !slots.default) return;
 
 				const el = slots.default({
-					item: item,
+					item,
 				})[0];
 				if (el.key == null && item.id) el.key = item.id;
 

packages/client/src/components/MkDialog.vue

@@ -57,17 +57,17 @@
 				<Mfm :text="text" />
 			</div>
 			<MkInput
-				ref="inputEl"
 				v-if="input && input.type !== 'paragraph'"
+				ref="inputEl"
 				v-model="inputValue"
 				autofocus
 				:autocomplete="input.autocomplete"
 				:type="input.type == 'search' ? 'search' : input.type || 'text'"
 				:placeholder="input.placeholder || undefined"
-				@keydown="onInputKeydown"
 				:style="{
 					width: input.type === 'search' ? '300px' : null,
 				}"
+				@keydown="onInputKeydown"
 			>
 				<template v-if="input.type === 'password'" #prefix
 					><i class="ph-password ph-bold ph-lg"></i
@@ -100,9 +100,9 @@
 				</template>
 				<template v-if="input.type === 'search'" #suffix>
 					<button
+						v-tooltip.noDelay="i18n.ts.filter"
 						class="_buttonIcon"
 						@click.stop="openSearchFilters"
-						v-tooltip.noDelay="i18n.ts.filter"
 					>
 						<i class="ph-funnel ph-bold"></i>
 					</button>
@@ -200,6 +200,7 @@
 
 <script lang="ts" setup>
 import { onBeforeUnmount, onMounted, ref, shallowRef } from "vue";
+import * as Acct from "calckey-js/built/acct";
 import MkModal from "@/components/MkModal.vue";
 import MkButton from "@/components/MkButton.vue";
 import MkInput from "@/components/form/input.vue";
@@ -207,18 +208,17 @@ import MkTextarea from "@/components/form/textarea.vue";
 import MkSelect from "@/components/form/select.vue";
 import * as os from "@/os";
 import { i18n } from "@/i18n";
-import * as Acct from "calckey-js/built/acct";
 
-type Input = {
+interface Input {
 	type: HTMLInputElement["type"];
 	placeholder?: string | null;
 	autocomplete?: string;
 	default: string | number | null;
 	minLength?: number;
 	maxLength?: number;
-};
+}
 
-type Select = {
+interface Select {
 	items: {
 		value: string;
 		text: string;
@@ -231,7 +231,7 @@ type Select = {
 		}[];
 	}[];
 	default: string | null;
-};
+}
 
 const props = withDefaults(
 	defineProps<{

packages/client/src/components/MkDonation.vue

@@ -49,8 +49,8 @@
 			<button
 				class="_button"
 				:class="$style.close"
-				@click="close"
 				:aria-label="i18n.t('close')"
+				@click="close"
 			>
 				<i class="ph-x ph-bold ph-lg"></i>
 			</button>
@@ -59,14 +59,14 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, nextTick } from "vue";
+import { nextTick, ref } from "vue";
 import MkButton from "@/components/MkButton.vue";
 import { host } from "@/config";
 import { i18n } from "@/i18n";
 import * as os from "@/os";
 import { instance } from "@/instance";
 
-let show = ref(false);
+const show = ref(false);
 
 const emit = defineEmits<{
 	(ev: "closed"): void;

packages/client/src/components/MkEmojiPickerDialog.vue

@@ -59,7 +59,6 @@ const emit = defineEmits<{
 const modal = ref<InstanceType<typeof MkModal>>();
 const picker = ref<InstanceType<typeof MkEmojiPicker>>();
 
-
 function checkForShift(ev?: MouseEvent) {
 	if (ev?.shiftKey) return;
 	modal.value?.close(ev);

packages/client/src/components/MkMedia.vue

@@ -108,7 +108,9 @@ const url =
 		: props.media.thumbnailUrl;
 
 const mediaType = computed(() => {
-	return props.media.type === 'video/quicktime' ? 'video/mp4' : props.media.type;
+	return props.media.type === "video/quicktime"
+		? "video/mp4"
+		: props.media.type;
 });
 
 function captionPopup() {

packages/client/src/components/MkNoteDetailed.vue

@@ -33,11 +33,7 @@
 			detailedView
 		></MkNote>
 
-		<MkTab
-			v-model="tab"
-			:style="'underline'"
-			@update:modelValue="loadTab"
-		>
+		<MkTab v-model="tab" :style="'underline'" @update:modelValue="loadTab">
 			<option value="replies">
 				<!-- <i class="ph-arrow-u-up-left ph-bold ph-lg"></i> -->
 				<span v-if="note.repliesCount > 0" class="count">{{

packages/client/src/components/form/input.vue

@@ -47,13 +47,13 @@
 
 <script lang="ts" setup>
 import {
+	computed,
+	nextTick,
 	onMounted,
 	onUnmounted,
-	nextTick,
 	ref,
-	watch,
-	computed,
 	toRefs,
+	watch,
 } from "vue";
 import { debounce } from "throttle-debounce";
 import MkButton from "@/components/MkButton.vue";

packages/client/src/components/form/radio.vue

@@ -4,7 +4,7 @@
 			type="radio"
 			:disabled="disabled"
 			:checked="checked"
-			v-on:change="(x) => toggle(x)"
+			@change="(x) => toggle(x)"
 		/>
 		<span class="button">
 			<span></span>
@@ -26,7 +26,7 @@ const emit = defineEmits<{
 	(ev: "update:modelValue", value: any): void;
 }>();
 
-let checked = $computed(() => props.modelValue === props.value);
+const checked = $computed(() => props.modelValue === props.value);
 
 function toggle(x) {
 	if (props.disabled) return;

packages/client/src/components/form/range.vue

@@ -12,7 +12,7 @@
 					:list="id"
 					:value="modelValue"
 					:disabled="disabled"
-					v-on:change="(x) => onChange(x)"
+					@change="(x) => onChange(x)"
 					@focus="tooltipShow"
 					@blur="tooltipHide"
 					@touchstart="tooltipShow"
@@ -35,7 +35,7 @@
 </template>
 
 <script lang="ts" setup>
-import { ref, computed, defineAsyncComponent } from "vue";
+import { computed, defineAsyncComponent, ref } from "vue";
 import * as os from "@/os";
 
 const id = os.getUniqueId();
@@ -59,7 +59,7 @@ const props = withDefaults(
 );
 
 const inputEl = ref<HTMLElement>();
-let inputVal = $ref(props.modelValue);
+const inputVal = $ref(props.modelValue);
 
 const emit = defineEmits<{
 	(ev: "update:modelValue", value: number): void;

packages/client/src/components/form/select.vue

@@ -43,15 +43,15 @@
 </template>
 
 <script lang="ts" setup>
+import type { VNode } from "vue";
 import {
-	onMounted,
-	nextTick,
-	ref,
-	watch,
 	computed,
+	nextTick,
+	onMounted,
+	ref,
 	toRefs,
-	VNode,
 	useSlots,
+	watch,
 } from "vue";
 import MkButton from "@/components/MkButton.vue";
 import * as os from "@/os";
@@ -151,7 +151,7 @@ function show(ev: MouseEvent) {
 	opening.value = true;
 
 	const menu = [];
-	let options = slots.default!();
+	const options = slots.default!();
 
 	const pushOption = (option: VNode) => {
 		menu.push({

packages/client/src/components/form/suspense.vue

@@ -22,7 +22,8 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref, watch } from "vue";
+import type { PropType } from "vue";
+import { defineComponent, ref, watch } from "vue";
 import MkButton from "@/components/MkButton.vue";
 import { i18n } from "@/i18n";
 

packages/client/src/components/form/switch.vue

@@ -4,7 +4,7 @@
 			type="checkbox"
 			:checked="modelValue"
 			:disabled="disabled"
-			v-on:change="(x) => toggle(x)"
+			@change="(x) => toggle(x)"
 		/>
 		<div class="button">
 			<div class="knob"></div>
@@ -18,7 +18,7 @@
 </template>
 
 <script lang="ts" setup>
-import { Ref } from "vue";
+import type { Ref } from "vue";
 
 const props = defineProps<{
 	modelValue: boolean | Ref<boolean>;

packages/client/src/components/form/textarea.vue

@@ -39,14 +39,14 @@
 
 <script lang="ts">
 import {
+	computed,
 	defineComponent,
+	nextTick,
 	onMounted,
 	onUnmounted,
-	nextTick,
 	ref,
-	watch,
-	computed,
 	toRefs,
+	watch,
 } from "vue";
 import { debounce } from "throttle-debounce";
 import MkButton from "@/components/MkButton.vue";

packages/client/src/components/global/MkAcct.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script lang="ts" setup>
-import * as misskey from "calckey-js";
+import type * as misskey from "calckey-js";
 import { toUnicode } from "punycode/";
 import { host as hostRaw } from "@/config";
 

packages/client/src/components/global/MkAd.vue

@@ -1,7 +1,7 @@
 <template>
 	<div
-		v-if="chosen && chosen.length > 0 && defaultStore.state.showAds"
 		v-for="chosenItem in chosen"
+		v-if="chosen && chosen.length > 0 && defaultStore.state.showAds"
 		class="qiivuoyo"
 	>
 		<div v-if="!showMenu" class="main" :class="chosenItem.place">

packages/client/src/components/global/MkAvatar.vue

@@ -37,7 +37,7 @@
 
 <script lang="ts" setup>
 import { onMounted, watch } from "vue";
-import * as misskey from "calckey-js";
+import type * as misskey from "calckey-js";
 import { getStaticImageUrl } from "@/scripts/get-static-image-url";
 import { extractAvgColorFromBlurhash } from "@/scripts/extract-avg-color-from-blurhash";
 import { acct, userPage } from "@/filters/user";

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

@@ -22,7 +22,7 @@
 
 <script lang="ts" setup>
 import { computed, ref, watch } from "vue";
-import { CustomEmoji } from "calckey-js/built/entities";
+import type { CustomEmoji } from "calckey-js/built/entities";
 import { getStaticImageUrl } from "@/scripts/get-static-image-url";
 import { char2filePath } from "@/scripts/twemoji-base";
 import { defaultStore } from "@/store";

packages/client/src/components/global/MkMisskeyFlavoredMarkdown.vue

@@ -4,8 +4,8 @@
 		:plain="plain"
 		:nowrap="nowrap"
 		:author="author"
-		:customEmojis="customEmojis"
-		:isNote="isNote"
+		:custom-emojis="customEmojis"
+		:is-note="isNote"
 		class="mfm-object"
 		:class="{
 			nowrap,

packages/client/src/components/global/MkPageHeader.vue

@@ -11,10 +11,10 @@
 			<div class="buttons">
 				<button
 					v-if="displayBackButton"
+					v-tooltip.noDelay="i18n.ts.goBack"
 					class="_buttonIcon button icon backButton"
 					@click.stop="goBack()"
 					@touchstart="preventDrag"
-					v-tooltip.noDelay="i18n.ts.goBack"
 				>
 					<i class="ph-caret-left ph-bold ph-lg"></i>
 				</button>
@@ -23,7 +23,7 @@
 					class="avatar button"
 					:user="$i"
 					:disable-preview="true"
-					disableLink
+					disable-link
 					@click.stop="openAccountMenu"
 				/>
 			</div>
@@ -68,8 +68,8 @@
 		</div>
 		<template v-if="metadata">
 			<nav
-				ref="tabsEl"
 				v-if="hasTabs"
+				ref="tabsEl"
 				class="tabs"
 				:class="{ collapse: hasTabs && tabs.length > 3 }"
 			>
@@ -123,14 +123,14 @@
 <script lang="ts" setup>
 import {
 	computed,
+	inject,
+	nextTick,
 	onMounted,
 	onUnmounted,
-	ref,
-	inject,
-	watch,
-	shallowReactive,
-	nextTick,
 	reactive,
+	ref,
+	shallowReactive,
+	watch,
 } from "vue";
 import MkFollowButton from "@/components/MkFollowButton.vue";
 import { popupMenu } from "@/os";
@@ -140,13 +140,13 @@ import { injectPageMetadata } from "@/scripts/page-metadata";
 import { $i, openAccountMenu as openAccountMenu_ } from "@/account";
 import { i18n } from "@/i18n";
 
-type Tab = {
+interface Tab {
 	key?: string | null;
 	title: string;
 	icon?: string;
 	iconOnly?: boolean;
 	onClick?: (ev: MouseEvent) => void;
-};
+}
 
 const props = defineProps<{
 	tabs?: Tab[];

packages/client/src/components/global/MkSpacer.vue

@@ -24,10 +24,10 @@ const props = withDefaults(
 	},
 );
 
-let ro: ResizeObserver;
-let root = $ref<HTMLElement>();
-let content = $ref<HTMLElement>();
-let margin = $ref(0);
+let ro: ResizeObserver,
+	root = $ref<HTMLElement>(),
+	content = $ref<HTMLElement>(),
+	margin = $ref(0);
 const shouldSpacerMin = inject("shouldSpacerMin", false);
 
 const adjust = (rect: { width: number; height: number }) => {

packages/client/src/components/global/MkStickyContainer.vue

@@ -16,14 +16,15 @@ const CURRENT_STICKY_TOP = "CURRENT_STICKY_TOP";
 </script>
 
 <script lang="ts" setup>
-import { onMounted, onUnmounted, provide, inject, Ref, ref, watch } from "vue";
+import type { Ref } from "vue";
+import { inject, onMounted, onUnmounted, provide, ref, watch } from "vue";
 
 const rootEl = $ref<HTMLElement>();
 const headerEl = $ref<HTMLElement>();
 const bodyEl = $ref<HTMLElement>();
 
-let headerHeight = $ref<string | undefined>();
-let childStickyTop = $ref(0);
+let headerHeight = $ref<string | undefined>(),
+	childStickyTop = $ref(0);
 const parentStickyTop = inject<Ref<number>>(CURRENT_STICKY_TOP, ref(0));
 provide(CURRENT_STICKY_TOP, $$(childStickyTop));
 

packages/client/src/components/global/MkUserName.vue

@@ -10,7 +10,7 @@
 
 <script lang="ts" setup>
 import {} from "vue";
-import * as misskey from "calckey-js";
+import type * as misskey from "calckey-js";
 
 const props = withDefaults(
 	defineProps<{

packages/client/src/components/global/RouterView.vue

@@ -5,8 +5,8 @@
 				:is="currentPageComponent"
 				:key="key"
 				v-bind="Object.fromEntries(currentPageProps)"
-				tabindex="-1"
 				v-focus
+				tabindex="-1"
 				style="outline: none"
 			/>
 
@@ -27,7 +27,7 @@ import {
 	provide,
 	watch,
 } from "vue";
-import { Resolved, Router } from "@/nirax";
+import type { Resolved, Router } from "@/nirax";
 import { defaultStore } from "@/store";
 
 const props = defineProps<{
@@ -56,9 +56,9 @@ function resolveNested(current: Resolved, d = 0): Resolved | null {
 }
 
 const current = resolveNested(router.current)!;
-let currentPageComponent = $shallowRef(current.route.component);
-let currentPageProps = $ref(current.props);
-let key = $ref(
+let currentPageComponent = $shallowRef(current.route.component),
+	currentPageProps = $ref(current.props),
+	key = $ref(
 		current.route.path + JSON.stringify(Object.fromEntries(current.props)),
 	);
 

packages/client/src/ui/deck.vue

@@ -193,12 +193,12 @@ import {
 import { v4 as uuid } from "uuid";
 import XCommon from "./_common_/common.vue";
 import {
-	deckStore,
 	addColumn as addColumnToStore,
-	loadDeck,
-	getProfiles,
-	renameProfile as renameProfile_,
+	deckStore,
 	deleteProfile as deleteProfile_,
+	getProfiles,
+	loadDeck,
+	renameProfile as renameProfile_,
 } from "./deck/deck-store";
 import DeckColumnCore from "@/ui/deck/column-core.vue";
 import XSidebar from "@/ui/_common_/navbar.vue";
@@ -253,7 +253,7 @@ function showSettings() {
 	os.pageWindow("/settings/deck");
 }
 
-let columnsEl = $ref<HTMLElement>();
+const columnsEl = $ref<HTMLElement>();
 
 const addColumn = async (ev) => {
 	const columns = [

packages/client/src/ui/deck/antenna-column.vue

@@ -23,7 +23,8 @@
 <script lang="ts" setup>
 import { onMounted } from "vue";
 import XColumn from "./column.vue";
-import { updateColumn, Column } from "./deck-store";
+import type { Column } from "./deck-store";
+import { updateColumn } from "./deck-store";
 import XTimeline from "@/components/MkTimeline.vue";
 import * as os from "@/os";
 import { i18n } from "@/i18n";
@@ -38,7 +39,7 @@ const emit = defineEmits<{
 	(ev: "parent-focus", direction: "up" | "down" | "left" | "right"): void;
 }>();
 
-let timeline = $ref<InstanceType<typeof XTimeline>>();
+const timeline = $ref<InstanceType<typeof XTimeline>>();
 
 onMounted(() => {
 	if (props.column.antennaId == null) {

packages/client/src/ui/deck/channel-column.vue

@@ -23,7 +23,8 @@
 <script lang="ts" setup>
 import {} from "vue";
 import XColumn from "./column.vue";
-import { updateColumn, Column } from "./deck-store";
+import type { Column } from "./deck-store";
+import { updateColumn } from "./deck-store";
 import XTimeline from "@/components/MkTimeline.vue";
 import * as os from "@/os";
 import { i18n } from "@/i18n";
@@ -38,7 +39,7 @@ const emit = defineEmits<{
 	(ev: "parent-focus", direction: "up" | "down" | "left" | "right"): void;
 }>();
 
-let timeline = $ref<InstanceType<typeof XTimeline>>();
+const timeline = $ref<InstanceType<typeof XTimeline>>();
 
 if (props.column.channelId == null) {
 	setChannel();

packages/client/src/ui/deck/column-core.vue

@@ -68,7 +68,7 @@ import XWidgetsColumn from "./widgets-column.vue";
 import XMentionsColumn from "./mentions-column.vue";
 import XDirectColumn from "./direct-column.vue";
 import XChannelColumn from "./channel-column.vue";
-import { Column } from "./deck-store";
+import type { Column } from "./deck-store";
 
 defineProps<{
 	column?: Column;

packages/client/src/ui/deck/column.vue

@@ -56,23 +56,23 @@
 </template>
 
 <script lang="ts" setup>
-import { onBeforeUnmount, onMounted, provide, Ref, watch } from "vue";
+import { Ref, onBeforeUnmount, onMounted, provide, watch } from "vue";
+import type { Column } from "./deck-store";
 import {
-	updateColumn,
+	deckStore,
+	popRightColumn,
+	removeColumn,
+	stackLeftColumn,
+	swapColumn,
+	swapDownColumn,
 	swapLeftColumn,
 	swapRightColumn,
 	swapUpColumn,
-	swapDownColumn,
-	stackLeftColumn,
-	popRightColumn,
-	removeColumn,
-	swapColumn,
-	Column,
-	deckStore,
+	updateColumn,
 } from "./deck-store";
 import * as os from "@/os";
 import { i18n } from "@/i18n";
-import { MenuItem } from "@/types/menu";
+import type { MenuItem } from "@/types/menu";
 
 provide("shouldHeaderThin", true);
 provide("shouldOmitHeaderTitle", true);
@@ -99,15 +99,15 @@ const emit = defineEmits<{
 	(ev: "headerWheel", ctx: WheelEvent): void;
 }>();
 
-let body = $ref<HTMLDivElement>();
+const body = $ref<HTMLDivElement>();
 
 let dragging = $ref(false);
 watch($$(dragging), (v) =>
 	os.deckGlobalEvents.emit(v ? "column.dragStart" : "column.dragEnd"),
 );
 
-let draghover = $ref(false);
-let dropready = $ref(false);
+let draghover = $ref(false),
+	dropready = $ref(false);
 
 const isMainColumn = $computed(() => props.column.type === "main");
 const active = $computed(() => props.column.active !== false);

packages/client/src/ui/deck/deck-store.ts

@@ -20,6 +20,7 @@ export type Column = {
 		| "notifications"
 		| "tl"
 		| "antenna"
+		| "channel"
 		| "list"
 		| "mentions"
 		| "direct";
@@ -29,9 +30,10 @@ export type Column = {
 	active?: boolean;
 	flexible?: boolean;
 	antennaId?: string;
+	channelId?: string;
 	listId?: string;
 	includingTypes?: typeof notificationTypes[number][];
-	tl?: "home" | "local" | "social" | "global";
+	tl?: "home" | "local" | "social" | "recommended" | "global";
 };
 
 export const deckStore = markRaw(

packages/client/src/ui/deck/direct-column.vue

@@ -19,8 +19,8 @@
 <script lang="ts" setup>
 import {} from "vue";
 import XColumn from "./column.vue";
+import type { Column } from "./deck-store";
 import XNotes from "@/components/MkNotes.vue";
-import { Column } from "./deck-store";
 
 defineProps<{
 	column: Column;

packages/client/src/ui/deck/list-column.vue

@@ -23,7 +23,8 @@
 <script lang="ts" setup>
 import {} from "vue";
 import XColumn from "./column.vue";
-import { updateColumn, Column } from "./deck-store";
+import type { Column } from "./deck-store";
+import { updateColumn } from "./deck-store";
 import XTimeline from "@/components/MkTimeline.vue";
 import * as os from "@/os";
 import { i18n } from "@/i18n";
@@ -38,7 +39,7 @@ const emit = defineEmits<{
 	(ev: "parent-focus", direction: "up" | "down" | "left" | "right"): void;
 }>();
 
-let timeline = $ref<InstanceType<typeof XTimeline>>();
+const timeline = $ref<InstanceType<typeof XTimeline>>();
 
 if (props.column.listId == null) {
 	setList();

packages/client/src/ui/deck/main-column.vue

@@ -20,14 +20,16 @@
 </template>
 
 <script lang="ts" setup>
-import { ComputedRef, provide } from "vue";
+import type { ComputedRef } from "vue";
+import { provide } from "vue";
 import XColumn from "./column.vue";
-import { deckStore, Column } from "@/ui/deck/deck-store";
+import type { Column } from "@/ui/deck/deck-store";
+import { deckStore } from "@/ui/deck/deck-store";
 import * as os from "@/os";
 import { i18n } from "@/i18n";
 import { mainRouter } from "@/router";
+import type { PageMetadata } from "@/scripts/page-metadata";
 import {
-	PageMetadata,
 	provideMetadataReceiver,
 	setPageMetadata,
 } from "@/scripts/page-metadata";
@@ -67,7 +69,7 @@ function onContextmenu(ev: MouseEvent) {
 		["INPUT", "TEXTAREA", "IMG", "VIDEO", "CANVAS"].includes(
 			(ev.target as HTMLElement).tagName,
 		) ||
-		(ev.target as HTMLElement).attributes["contenteditable"]
+		(ev.target as HTMLElement).attributes.contenteditable
 	)
 		return;
 	if (window.getSelection()?.toString() !== "") return;

packages/client/src/ui/deck/mentions-column.vue

@@ -16,8 +16,8 @@
 <script lang="ts" setup>
 import {} from "vue";
 import XColumn from "./column.vue";
+import type { Column } from "./deck-store";
 import XNotes from "@/components/MkNotes.vue";
-import { Column } from "./deck-store";
 
 defineProps<{
 	column: Column;

packages/client/src/ui/deck/notifications-column.vue

@@ -44,7 +44,7 @@ function func(): void {
 			done: async (res) => {
 				const { includingTypes } = res;
 				updateColumn(props.column.id, {
-					includingTypes: includingTypes,
+					includingTypes,
 				});
 			},
 		},

packages/client/src/ui/deck/tl-column.vue

@@ -46,7 +46,8 @@
 <script lang="ts" setup>
 import { onMounted } from "vue";
 import XColumn from "./column.vue";
-import { removeColumn, updateColumn, Column } from "./deck-store";
+import type { Column } from "./deck-store";
+import { removeColumn, updateColumn } from "./deck-store";
 import XTimeline from "@/components/MkTimeline.vue";
 import * as os from "@/os";
 import { $i } from "@/account";
@@ -63,9 +64,9 @@ const emit = defineEmits<{
 	(ev: "parent-focus", direction: "up" | "down" | "left" | "right"): void;
 }>();
 
-let disabled = $ref(false);
-let indicated = $ref(false);
-let columnActive = $ref(true);
+let disabled = $ref(false),
+	indicated = $ref(false),
+	columnActive = $ref(true);
 
 onMounted(() => {
 	if (props.column.tl == null) {

packages/client/src/ui/deck/widgets-column.vue

@@ -34,9 +34,9 @@
 <script lang="ts" setup>
 import {} from "vue";
 import XColumn from "./column.vue";
+import type { Column } from "./deck-store";
 import {
 	addColumnWidget,
-	Column,
 	removeColumnWidget,
 	setColumnWidgets,
 	updateColumnWidget,

packages/client/src/ui/universal.vue

@@ -169,10 +169,10 @@
 </template>
 
 <script lang="ts" setup>
-import { defineAsyncComponent, provide, onMounted, computed, ref } from "vue";
-import XCommon from "./_common_/common.vue";
+import { computed, defineAsyncComponent, onMounted, provide, ref } from "vue";
 import * as Acct from "calckey-js/built/acct";
 import type { ComputedRef } from "vue";
+import XCommon from "./_common_/common.vue";
 import type { PageMetadata } from "@/scripts/page-metadata";
 import { instanceName, ui } from "@/config";
 import XDrawerMenu from "@/ui/_common_/navbar-for-mobile.vue";
@@ -232,7 +232,7 @@ const menuIndicated = computed(() => {
 });
 
 function updateButtonState(): void {
-	let routerState = window.location.pathname;
+	const routerState = window.location.pathname;
 	if (routerState === "/") {
 		buttonAnimIndex.value = 0;
 		return;
@@ -246,7 +246,6 @@ function updateButtonState(): void {
 		return;
 	}
 	buttonAnimIndex.value = 3;
-	return;
 }
 
 updateButtonState();
@@ -358,7 +357,7 @@ const onContextmenu = (ev: MouseEvent) => {
 		["INPUT", "TEXTAREA", "IMG", "VIDEO", "CANVAS"].includes(
 			ev.target.tagName,
 		) ||
-		ev.target.attributes["contenteditable"]
+		ev.target.attributes.contenteditable
 	)
 		return;
 	if (window.getSelection()?.toString() !== "") return;

packages/client/src/ui/universal.widgets.vue

@@ -39,8 +39,8 @@ const emit = defineEmits<{
 	(ev: "mounted", el: Element): void;
 }>();
 
-let editMode = $ref(false);
-let rootEl = $ref<HTMLDivElement>();
+const editMode = $ref(false);
+const rootEl = $ref<HTMLDivElement>();
 
 onMounted(() => {
 	emit("mounted", rootEl);

packages/client/src/ui/visitor.vue

@@ -4,7 +4,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, defineAsyncComponent } from "vue";
+import { defineAsyncComponent, defineComponent } from "vue";
 import DesignA from "./visitor/a.vue";
 import DesignB from "./visitor/b.vue";
 import XCommon from "./_common_/common.vue";

packages/client/src/ui/visitor/a.vue

@@ -74,7 +74,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, defineAsyncComponent } from "vue";
+import { defineAsyncComponent, defineComponent } from "vue";
 import XHeader from "./header.vue";
 import { host, instanceName } from "@/config";
 import { search } from "@/scripts/search";

packages/client/src/ui/visitor/b.vue

@@ -71,7 +71,8 @@
 </template>
 
 <script lang="ts" setup>
-import { ComputedRef, onMounted, provide } from "vue";
+import type { ComputedRef } from "vue";
+import { onMounted, provide } from "vue";
 import XHeader from "./header.vue";
 import XKanban from "./kanban.vue";
 import { host, instanceName } from "@/config";
@@ -84,8 +85,8 @@ import XSignupDialog from "@/components/MkSignupDialog.vue";
 import MkButton from "@/components/MkButton.vue";
 import { ColdDeviceStorage, defaultStore } from "@/store";
 import { mainRouter } from "@/router";
+import type { PageMetadata } from "@/scripts/page-metadata";
 import {
-	PageMetadata,
 	provideMetadataReceiver,
 	setPageMetadata,
 } from "@/scripts/page-metadata";
@@ -111,10 +112,10 @@ const isTimelineAvailable =
 	!instance.disableLocalTimeline ||
 	!instance.disableRecommendedTimeline ||
 	!instance.disableGlobalTimeline;
-let showMenu = $ref(false);
-let isDesktop = $ref(window.innerWidth >= DESKTOP_THRESHOLD);
-let narrow = $ref(window.innerWidth < 1280);
-let meta = $ref();
+const showMenu = $ref(false);
+let isDesktop = $ref(window.innerWidth >= DESKTOP_THRESHOLD),
+	narrow = $ref(window.innerWidth < 1280),
+	meta = $ref();
 
 const keymap = $computed(() => {
 	return {

packages/client/src/ui/visitor/kanban.vue

@@ -81,7 +81,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, defineAsyncComponent } from "vue";
+import { defineAsyncComponent, defineComponent } from "vue";
 import { host, instanceName } from "@/config";
 import * as os from "@/os";
 import MkPagination from "@/components/MkPagination.vue";

packages/client/src/ui/zen.vue

@@ -7,11 +7,12 @@
 </template>
 
 <script lang="ts" setup>
-import { provide, ComputedRef } from "vue";
+import type { ComputedRef } from "vue";
+import { provide } from "vue";
 import XCommon from "./_common_/common.vue";
 import { mainRouter } from "@/router";
+import type { PageMetadata } from "@/scripts/page-metadata";
 import {
-	PageMetadata,
 	provideMetadataReceiver,
 	setPageMetadata,
 } from "@/scripts/page-metadata";

packages/client/src/widgets/activity.chart.vue

@@ -36,14 +36,14 @@ const props = defineProps<{
 	activity: any[];
 }>();
 
-let viewBoxX: number = $ref(147);
-let viewBoxY: number = $ref(60);
-let zoom: number = $ref(1);
-let pos: number = $ref(0);
-let pointsNote: any = $ref(null);
-let pointsReply: any = $ref(null);
-let pointsRenote: any = $ref(null);
-let pointsTotal: any = $ref(null);
+const viewBoxX: number = $ref(147);
+const viewBoxY: number = $ref(60);
+let zoom: number = $ref(1),
+	pos: number = $ref(0),
+	pointsNote: any = $ref(null),
+	pointsReply: any = $ref(null),
+	pointsRenote: any = $ref(null),
+	pointsTotal: any = $ref(null);
 
 function dragListen(fn) {
 	window.addEventListener("mousemove", fn);
@@ -65,8 +65,8 @@ function onMousedown(ev) {
 
 	// 動かした時
 	dragListen((me) => {
-		let moveLeft = me.clientX - clickX;
-		let moveTop = me.clientY - clickY;
+		const moveLeft = me.clientX - clickX;
+		const moveTop = me.clientY - clickY;
 
 		zoom = Math.max(1, baseZoom + -moveTop / 20);
 		pos = Math.min(0, basePos + moveLeft);

packages/client/src/widgets/activity.vue

@@ -38,17 +38,16 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, reactive, ref, watch } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
 import XCalendar from "./activity.calendar.vue";
 import XChart from "./activity.chart.vue";
 import MkHeatmap from "@/components/MkHeatmap.vue";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import MkContainer from "@/components/MkContainer.vue";
 import { $i } from "@/account";

packages/client/src/widgets/aiscript.vue

@@ -28,14 +28,13 @@
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref, watch } from "vue";
 import { AiScript, parse, utils } from "@syuilo/aiscript";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import MkContainer from "@/components/MkContainer.vue";
 import { createAiScriptEnv } from "@/scripts/aiscript/api";

packages/client/src/widgets/button.vue

@@ -9,14 +9,13 @@
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref, watch } from "vue";
 import { AiScript, parse, utils } from "@syuilo/aiscript";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import { createAiScriptEnv } from "@/scripts/aiscript/api";
 import { $i } from "@/account";

packages/client/src/widgets/calendar.vue

@@ -45,14 +45,13 @@
 
 <script lang="ts" setup>
 import { onUnmounted, ref } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import { i18n } from "@/i18n";
 import { useInterval } from "@/scripts/use-interval";
 import { $i } from "@/account";

packages/client/src/widgets/clock.vue

@@ -47,14 +47,13 @@
 
 <script lang="ts" setup>
 import {} from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import MkContainer from "@/components/MkContainer.vue";
 import MkAnalogClock from "@/components/MkAnalogClock.vue";
 import MkDigitalClock from "@/components/MkDigitalClock.vue";

packages/client/src/widgets/digital-clock.vue

@@ -16,14 +16,13 @@
 
 <script lang="ts" setup>
 import { onUnmounted, ref, watch } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import { timezones } from "@/scripts/timezones";
 import MkDigitalClock from "@/components/MkDigitalClock.vue";
 

packages/client/src/widgets/federation.vue

@@ -49,14 +49,13 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import MkContainer from "@/components/MkContainer.vue";
 import MkMiniChart from "@/components/MkMiniChart.vue";
 import * as os from "@/os";

packages/client/src/widgets/instance-cloud.vue

@@ -22,9 +22,9 @@
 <script lang="ts" setup>
 import {} from "vue";
 import {
-	useWidgetPropsManager,
 	WidgetComponentEmits,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
 import type { Widget, WidgetComponentExpose } from "./widget";
 import type { GetFormResultType } from "@/scripts/form";
@@ -58,7 +58,7 @@ const { widgetProps, configure } = useWidgetPropsManager(
 	emit,
 );
 
-let cloud = $ref<InstanceType<typeof MkTagCloud> | null>();
+const cloud = $ref<InstanceType<typeof MkTagCloud> | null>();
 let activeInstances = $shallowRef(null);
 
 function onInstanceClick(i) {

packages/client/src/widgets/job-queue.vue

@@ -124,14 +124,13 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, reactive, ref } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import { stream } from "@/stream";
 import number from "@/filters/number";
 import * as sound from "@/scripts/sound";

packages/client/src/widgets/memo.vue

@@ -24,14 +24,13 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, reactive, ref, watch } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import MkContainer from "@/components/MkContainer.vue";
 import { defaultStore } from "@/store";

packages/client/src/widgets/notifications.vue

@@ -31,14 +31,13 @@
 
 <script lang="ts" setup>
 import { defineAsyncComponent } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import MkContainer from "@/components/MkContainer.vue";
 import XNotifications from "@/components/MkNotifications.vue";
 import * as os from "@/os";

packages/client/src/widgets/online-users.vue

@@ -21,14 +21,13 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import { useInterval } from "@/scripts/use-interval";
 import { i18n } from "@/i18n";

packages/client/src/widgets/photos.vue

@@ -27,14 +27,13 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, reactive, ref } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import { stream } from "@/stream";
 import { getStaticImageUrl } from "@/scripts/get-static-image-url";
 import * as os from "@/os";

packages/client/src/widgets/post-form.vue

@@ -9,14 +9,13 @@
 
 <script lang="ts" setup>
 import {} from "vue";
-import { GetFormResultType } from "@/scripts/form";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
+import type { GetFormResultType } from "@/scripts/form";
 import XPostForm from "@/components/MkPostForm.vue";
 
 const name = "postForm";

packages/client/src/widgets/rss-ticker.vue

@@ -38,15 +38,14 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref, watch } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
 import MarqueeText from "@/components/MkMarquee.vue";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import MkContainer from "@/components/MkContainer.vue";
 import { useInterval } from "@/scripts/use-interval";

packages/client/src/widgets/rss.vue

@@ -30,14 +30,13 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref, watch } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import MkContainer from "@/components/MkContainer.vue";
 import { useInterval } from "@/scripts/use-interval";

packages/client/src/widgets/server-info.vue

@@ -30,14 +30,13 @@
 </template>
 
 <script lang="ts" setup>
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import { host } from "@/config";
 
 const name = "serverInfo";

packages/client/src/widgets/server-metric/cpu-mem.vue

@@ -82,7 +82,7 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, onBeforeUnmount } from "vue";
+import { onBeforeUnmount, onMounted } from "vue";
 import { v4 as uuid } from "uuid";
 
 const props = defineProps<{
@@ -90,23 +90,23 @@ const props = defineProps<{
 	meta: any;
 }>();
 
-let viewBoxX: number = $ref(50);
-let viewBoxY: number = $ref(30);
-let stats: any[] = $ref([]);
+const viewBoxX: number = $ref(50);
+const viewBoxY: number = $ref(30);
+const stats: any[] = $ref([]);
 const cpuGradientId = uuid();
 const cpuMaskId = uuid();
 const memGradientId = uuid();
 const memMaskId = uuid();
-let cpuPolylinePoints: string = $ref("");
-let memPolylinePoints: string = $ref("");
-let cpuPolygonPoints: string = $ref("");
-let memPolygonPoints: string = $ref("");
-let cpuHeadX: any = $ref(null);
-let cpuHeadY: any = $ref(null);
-let memHeadX: any = $ref(null);
-let memHeadY: any = $ref(null);
-let cpuP: string = $ref("");
-let memP: string = $ref("");
+let cpuPolylinePoints: string = $ref(""),
+	memPolylinePoints: string = $ref(""),
+	cpuPolygonPoints: string = $ref(""),
+	memPolygonPoints: string = $ref(""),
+	cpuHeadX: any = $ref(null),
+	cpuHeadY: any = $ref(null),
+	memHeadX: any = $ref(null),
+	memHeadY: any = $ref(null),
+	cpuP: string = $ref(""),
+	memP: string = $ref("");
 
 onMounted(() => {
 	props.connection.on("stats", onStats);
@@ -125,11 +125,11 @@ function onStats(connStats) {
 	stats.push(connStats);
 	if (stats.length > 50) stats.shift();
 
-	let cpuPolylinePointsStats = stats.map((s, i) => [
+	const cpuPolylinePointsStats = stats.map((s, i) => [
 		viewBoxX - (stats.length - 1 - i),
 		(1 - s.cpu) * viewBoxY,
 	]);
-	let memPolylinePointsStats = stats.map((s, i) => [
+	const memPolylinePointsStats = stats.map((s, i) => [
 		viewBoxX - (stats.length - 1 - i),
 		(1 - s.mem.active / props.meta.mem.total) * viewBoxY,
 	]);

packages/client/src/widgets/server-metric/cpu.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, onBeforeUnmount } from "vue";
+import { onBeforeUnmount, onMounted } from "vue";
 import XPie from "./pie.vue";
 
 const props = defineProps<{

packages/client/src/widgets/server-metric/index.vue

@@ -51,12 +51,11 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref } from "vue";
+import type { Widget, WidgetComponentExpose } from "../widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "../widget";
 import XCpuMemory from "./cpu-mem.vue";
 import XNet from "./net.vue";
@@ -65,7 +64,7 @@ import XMemory from "./mem.vue";
 import XDisk from "./disk.vue";
 import XMeili from "./meilisearch.vue";
 import MkContainer from "@/components/MkContainer.vue";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import { stream } from "@/stream";
 import { i18n } from "@/i18n";

packages/client/src/widgets/server-metric/meilisearch.vue

@@ -18,8 +18,8 @@
 
 <script lang="ts" setup>
 import { onBeforeUnmount, onMounted } from "vue";
-import bytes from "@/filters/bytes";
 import XPie from "./pie.vue";
+import bytes from "@/filters/bytes";
 import { i18n } from "@/i18n";
 import * as os from "@/os";
 
@@ -28,11 +28,11 @@ const props = defineProps<{
 	meta: any;
 }>();
 
-let progress: number = $ref(0);
-let serverStats = $ref(null);
-let totalSize: number = $ref(0);
-let indexCount: number = $ref(0);
-let available: string = $ref("unavailable");
+let progress: number = $ref(0),
+	serverStats = $ref(null),
+	totalSize: number = $ref(0),
+	indexCount: number = $ref(0),
+	available: string = $ref("unavailable");
 
 function onStats(stats) {
 	totalSize = stats.meilisearch.size;

packages/client/src/widgets/server-metric/mem.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, onBeforeUnmount } from "vue";
+import { onBeforeUnmount, onMounted } from "vue";
 import XPie from "./pie.vue";
 import bytes from "@/filters/bytes";
 
@@ -20,10 +20,10 @@ const props = defineProps<{
 	meta: any;
 }>();
 
-let usage: number = $ref(0);
-let total: number = $ref(0);
-let used: number = $ref(0);
-let free: number = $ref(0);
+let usage: number = $ref(0),
+	total: number = $ref(0),
+	used: number = $ref(0),
+	free: number = $ref(0);
 
 function onStats(stats) {
 	usage = stats.mem.active / props.meta.mem.total;

packages/client/src/widgets/server-metric/net.vue

@@ -40,7 +40,7 @@
 </template>
 
 <script lang="ts" setup>
-import { onMounted, onBeforeUnmount } from "vue";
+import { onBeforeUnmount, onMounted } from "vue";
 import bytes from "@/filters/bytes";
 
 const props = defineProps<{
@@ -48,19 +48,19 @@ const props = defineProps<{
 	meta: any;
 }>();
 
-let viewBoxX: number = $ref(50);
-let viewBoxY: number = $ref(30);
-let stats: any[] = $ref([]);
-let inPolylinePoints: string = $ref("");
-let outPolylinePoints: string = $ref("");
-let inPolygonPoints: string = $ref("");
-let outPolygonPoints: string = $ref("");
-let inHeadX: any = $ref(null);
-let inHeadY: any = $ref(null);
-let outHeadX: any = $ref(null);
-let outHeadY: any = $ref(null);
-let inRecent: number = $ref(0);
-let outRecent: number = $ref(0);
+const viewBoxX: number = $ref(50);
+const viewBoxY: number = $ref(30);
+const stats: any[] = $ref([]);
+let inPolylinePoints: string = $ref(""),
+	outPolylinePoints: string = $ref(""),
+	inPolygonPoints: string = $ref(""),
+	outPolygonPoints: string = $ref(""),
+	inHeadX: any = $ref(null),
+	inHeadY: any = $ref(null),
+	outHeadX: any = $ref(null),
+	outHeadY: any = $ref(null),
+	inRecent: number = $ref(0),
+	outRecent: number = $ref(0);
 
 onMounted(() => {
 	props.connection.on("stats", onStats);
@@ -85,11 +85,11 @@ function onStats(connStats) {
 		Math.max(...stats.map((s) => s.net.tx)),
 	);
 
-	let inPolylinePointsStats = stats.map((s, i) => [
+	const inPolylinePointsStats = stats.map((s, i) => [
 		viewBoxX - (stats.length - 1 - i),
 		(1 - s.net.rx / inPeak) * viewBoxY,
 	]);
-	let outPolylinePointsStats = stats.map((s, i) => [
+	const outPolylinePointsStats = stats.map((s, i) => [
 		viewBoxX - (stats.length - 1 - i),
 		(1 - s.net.tx / outPeak) * viewBoxY,
 	]);

packages/client/src/widgets/slideshow.vue

@@ -24,14 +24,13 @@
 
 <script lang="ts" setup>
 import { nextTick, onMounted, onUnmounted, reactive, ref } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import { useInterval } from "@/scripts/use-interval";
 import { i18n } from "@/i18n";

packages/client/src/widgets/timeline.vue

@@ -68,14 +68,13 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, reactive, ref, watch } from "vue";
-import { GetFormResultType } from "@/scripts/form";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
+import type { GetFormResultType } from "@/scripts/form";
 import * as os from "@/os";
 import MkContainer from "@/components/MkContainer.vue";
 import XTimeline from "@/components/MkTimeline.vue";

packages/client/src/widgets/trends.vue

@@ -38,14 +38,13 @@
 
 <script lang="ts" setup>
 import { onMounted, onUnmounted, ref } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 import MkContainer from "@/components/MkContainer.vue";
 import MkMiniChart from "@/components/MkMiniChart.vue";
 import * as os from "@/os";

packages/client/src/widgets/unix-clock.vue

@@ -18,14 +18,13 @@
 
 <script lang="ts" setup>
 import { onUnmounted, ref, watch } from "vue";
+import type { Widget, WidgetComponentExpose } from "./widget";
 import {
-	useWidgetPropsManager,
-	Widget,
 	WidgetComponentEmits,
-	WidgetComponentExpose,
 	WidgetComponentProps,
+	useWidgetPropsManager,
 } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { GetFormResultType } from "@/scripts/form";
 
 const name = "unixClock";
 

packages/client/src/widgets/user-list.vue

@@ -28,8 +28,9 @@
 </template>
 
 <script lang="ts" setup>
-import { useWidgetPropsManager, Widget, WidgetComponentExpose } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+import type { Widget, WidgetComponentExpose } from "./widget";
+import { useWidgetPropsManager } from "./widget";
+import type { GetFormResultType } from "@/scripts/form";
 import MkContainer from "@/components/MkContainer.vue";
 import MkAvatars from "@/components/MkAvatars.vue";
 import * as os from "@/os";
@@ -61,9 +62,9 @@ const { widgetProps, configure, save } = useWidgetPropsManager(
 	props,
 	emit,
 );
-let list = $ref();
-let users = $ref([]);
-let fetching = $ref(true);
+let list = $ref(),
+	users = $ref([]),
+	fetching = $ref(true);
 async function chooseList() {
 	const lists = await os.api("users/lists/list");
 	const { canceled, result: list } = await os.select({

packages/megalodon/package.json

@@ -5,7 +5,7 @@
   "typings": "./lib/src/index.d.ts",
   "scripts": {
     "build": "tsc -p ./",
-    "lint": "pnpm rome check --apply src/**/*.ts",
+    "lint": "pnpm rome check **/*.ts --apply",
 		"format": "pnpm rome format --write src/**/*.ts",
     "doc": "typedoc --out ../docs ./src",
     "test": "NODE_ENV=test jest -u --maxWorkers=3"

packages/megalodon/src/axios.d.ts

@@ -1 +1 @@
-declare module 'axios/lib/adapters/http'
+declare module "axios/lib/adapters/http";

packages/megalodon/src/cancel.ts

@@ -1,13 +1,13 @@
 export class RequestCanceledError extends Error {
-  public isCancel: boolean
+	public isCancel: boolean;
 
 	constructor(msg: string) {
-    super(msg)
-    this.isCancel = true
-    Object.setPrototypeOf(this, RequestCanceledError)
+		super(msg);
+		this.isCancel = true;
+		Object.setPrototypeOf(this, RequestCanceledError);
 	}
 }
 
 export const isCancel = (value: any): boolean => {
-  return value && value.isCancel
-}
+	return value && value.isCancel;
+};

packages/megalodon/src/converter.ts

@@ -1,3 +1,3 @@
 import MisskeyAPI from "./misskey/api_client";
 
-export default MisskeyAPI.Converter
+export default MisskeyAPI.Converter;