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(
-			await queryRunner.query(`ALTER TABLE "meta" ALTER COLUMN "smtpPass" TYPE character varying(1024)`, undefined);
+			`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: name.to_lowercase(),
-                username_lower: name.to_lowercase().to_string(),
+                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(),
+            users: vec![],
-            instances: vec![].into(),
+            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}\"",
+		"lint": "pnpm rome check **/*.ts --apply && pnpm run lint:vue",
-		"format": "pnpm rome format * --write && pnpm prettier --write '**/*.{scss,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 enabled = true,
-let majorGraduationColor = $ref<string>();
+	majorGraduationColor = $ref<string>(),
-//let minorGraduationColor = $ref<string>();
+	// let minorGraduationColor = $ref<string>();
-let sHandColor = $ref<string>();
+	sHandColor = $ref<string>(),
-let mHandColor = $ref<string>();
+	mHandColor = $ref<string>(),
-let hHandColor = $ref<string>();
+	hHandColor = $ref<string>(),
-let nowColor = $ref<string>();
+	nowColor = $ref<string>(),
-let h = $ref<number>(0);
+	h = $ref<number>(0),
-let m = $ref<number>(0);
+	m = $ref<number>(0),
-let s = $ref<number>(0);
+	s = $ref<number>(0),
-let hAngle = $ref<number>(0);
+	hAngle = $ref<number>(0),
-let mAngle = $ref<number>(0);
+	mAngle = $ref<number>(0),
-let sAngle = $ref<number>(0);
+	sAngle = $ref<number>(0),
-let disableSAnimate = $ref(false);
+	disableSAnimate = $ref(false),
-let sOneRound = false;
+	sOneRound = false;
 
 function tick() {
 	const now = new Date();
@@ -230,7 +230,7 @@ function calcColors() {
 	majorGraduationColor = dark
 		? "rgba(255, 255, 255, 0.3)"
 		: "rgba(0, 0, 0, 0.3)";
-	//minorGraduationColor = dark ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
+	// minorGraduationColor = dark ? 'rgba(255, 255, 255, 0.2)' : 'rgba(0, 0, 0, 0.2)';
 	sHandColor = dark ? "rgba(255, 255, 255, 0.5)" : "rgba(0, 0, 0, 0.3)";
 	mHandColor = tinycolor(
 		computedStyle.getPropertyValue("--fg"),

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");
 
@@ -140,7 +140,7 @@ for (const x of lib) {
 
 emjdb.sort((a, b) => a.name.length - b.name.length);
 
-//#region Construct Emoji DB
+// #region Construct Emoji DB
 const customEmojis = instance.emojis;
 const emojiDefinitions: EmojiDef[] = [];
 
@@ -168,7 +168,7 @@ for (const x of customEmojis) {
 emojiDefinitions.sort((a, b) => a.name.length - b.name.length);
 
 const emojiDb = markRaw(emojiDefinitions.concat(emjdb));
-//#endregion
+// #endregion
 
 export default {
 	emojiDb,

packages/client/src/components/MkButton.vue

@@ -49,8 +49,8 @@ const emit = defineEmits<{
 	(ev: "click", payload: MouseEvent): void;
 }>();
 
-let el = $ref<HTMLElement | null>(null);
+const el = $ref<HTMLElement | null>(null);
-let ripples = $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,30 +8,31 @@
 </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,
+	Chart,
-	TimeScale,
+	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";
 import zoomPlugin from "chartjs-plugin-zoom";
 // https://github.com/misskey-dev/misskey/pull/8575#issuecomment-1114242002
 // We can't use gradient because Vite throws a error.
-//import gradient from 'chartjs-plugin-gradient';
+// import gradient from 'chartjs-plugin-gradient';
 import * as os from "@/os";
 import { defaultStore } from "@/store";
 import { useChartTooltip } from "@/scripts/use-chart-tooltip";
@@ -92,7 +93,7 @@ Chart.register(
 	SubTitle,
 	Filler,
 	zoomPlugin,
-	//gradient,
+	// gradient,
 );
 
 const sum = (...arr) => arr.reduce((r, a) => r.map((b, i) => a[i] + b));
@@ -127,8 +128,8 @@ const getColor = (i) => {
 };
 
 const now = new Date();
-let chartInstance: Chart = null;
+let chartInstance: Chart = null,
-let chartData: {
+	chartData: {
 		series: {
 			name: string;
 			type: "line" | "area";
@@ -140,7 +141,7 @@ let chartData: {
 				y: number;
 			}[];
 		}[];
-} = null;
+	} = null;
 
 const chartEl = ref<HTMLCanvasElement>(null);
 const fetching = ref(true);
@@ -210,7 +211,7 @@ const render = () => {
 						? x.color
 						: getColor(i)
 					: alpha(x.color ? x.color : getColor(i), 0.1),
-				/*gradient: props.bar ? undefined : {
+				/* gradient: props.bar ? undefined : {
 					backgroundColor: {
 						axis: 'y',
 						colors: {
@@ -218,7 +219,7 @@ const render = () => {
 							[maxes[i]]: alpha(x.color ? x.color : getColor(i), 0.2),
 						},
 					},
-				},*/
+				}, */
 				barPercentage: 0.9,
 				categoryPercentage: 0.9,
 				fill: x.type === "area",
@@ -271,7 +272,7 @@ const render = () => {
 					},
 					ticks: {
 						display: props.detailed,
-						//mirror: true,
+						// mirror: true,
 					},
 				},
 			},
@@ -331,7 +332,7 @@ const render = () => {
 							},
 					  }
 					: undefined,
-				//gradient,
+				// gradient,
 			},
 		},
 		plugins: [

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 left = props.ev.pageX + 1, // 間違って右ダブルクリックした場合に意図せずアイテムがクリックされるのを防ぐため + 1
-	let top = props.ev.pageY + 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>>();
+const dialogEl = $ref<InstanceType<typeof XModalWindow>>();
-let imgEl = $ref<HTMLImageElement>();
+const imgEl = $ref<HTMLImageElement>();
-let cropper: Cropper | null = null;
+let cropper: Cropper | null = null,
-let loading = $ref(true);
+	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
+		<MkTab v-model="tab" :style="'underline'" @update:modelValue="loadTab">
-			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"
+		:custom-emojis="customEmojis"
-		:isNote="isNote"
+		: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 ro: ResizeObserver,
-let root = $ref<HTMLElement>();
+	root = $ref<HTMLElement>(),
-let content = $ref<HTMLElement>();
+	content = $ref<HTMLElement>(),
-let margin = $ref(0);
+	margin = $ref(0);
 const shouldSpacerMin = inject("shouldSpacerMin", false);
 
 const adjust = (rect: { width: number; height: number }) => {

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

@@ -11,19 +11,20 @@
 
 <script lang="ts">
 // なんか動かない
-//const CURRENT_STICKY_TOP = Symbol('CURRENT_STICKY_TOP');
+// const CURRENT_STICKY_TOP = Symbol('CURRENT_STICKY_TOP');
 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 headerHeight = $ref<string | undefined>(),
-let childStickyTop = $ref(0);
+	childStickyTop = $ref(0);
 const parentStickyTop = inject<Ref<number>>(CURRENT_STICKY_TOP, ref(0));
 provide(CURRENT_STICKY_TOP, $$(childStickyTop));
 

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

@@ -42,7 +42,7 @@ const relative = $computed<string>(() => {
 	if (props.mode === "absolute") return ""; // absoluteではrelativeを使わないので計算しない
 	if (invalid) return i18n.ts._ago.invalid;
 
-	const ago = (now - _time) / 1000; /*ms*/
+	const ago = (now - _time) / 1000; /* ms */
 	return ago >= 31536000
 		? i18n.t("_ago.yearsAgo", { n: Math.round(ago / 31536000).toString() })
 		: ago >= 2592000
@@ -66,11 +66,11 @@ let tickId: number;
 
 function tick() {
 	const _now = new Date().getTime();
-	const agoPrev = (now - _time) / 1000; /*ms*/ // 現状のinterval
+	const agoPrev = (now - _time) / 1000; /* ms */ // 現状のinterval
 
 	now = _now;
 
-	const ago = (now - _time) / 1000; /*ms*/ // 次のinterval
+	const ago = (now - _time) / 1000; /* ms */ // 次のinterval
 	const prev = agoPrev < 60 ? 10000 : agoPrev < 3600 ? 60000 : 180000;
 	const next = ago < 60 ? 10000 : ago < 3600 ? 60000 : 180000;
 

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,11 +56,11 @@ function resolveNested(current: Resolved, d = 0): Resolved | null {
 }
 
 const current = resolveNested(router.current)!;
-let currentPageComponent = $shallowRef(current.route.component);
+let currentPageComponent = $shallowRef(current.route.component),
-let currentPageProps = $ref(current.props);
+	currentPageProps = $ref(current.props),
-let key = $ref(
+	key = $ref(
 		current.route.path + JSON.stringify(Object.fromEntries(current.props)),
-);
+	);
 
 function onChange({ resolved, key: newKey }) {
 	const current = resolveNested(resolved);

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,
+	deckStore,
-	getProfiles,
-	renameProfile as renameProfile_,
 	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,
+	updateColumn,
-	stackLeftColumn,
-	popRightColumn,
-	removeColumn,
-	swapColumn,
-	Column,
-	deckStore,
 } 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 draghover = $ref(false),
-let dropready = $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 disabled = $ref(false),
-let indicated = $ref(false);
+	indicated = $ref(false),
-let columnActive = $ref(true);
+	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 { computed, defineAsyncComponent, onMounted, provide, ref } from "vue";
-import XCommon from "./_common_/common.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);
+const editMode = $ref(false);
-let rootEl = $ref<HTMLDivElement>();
+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);
+const showMenu = $ref(false);
-let isDesktop = $ref(window.innerWidth >= DESKTOP_THRESHOLD);
+let isDesktop = $ref(window.innerWidth >= DESKTOP_THRESHOLD),
-let narrow = $ref(window.innerWidth < 1280);
+	narrow = $ref(window.innerWidth < 1280),
-let meta = $ref();
+	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);
+const viewBoxX: number = $ref(147);
-let viewBoxY: number = $ref(60);
+const viewBoxY: number = $ref(60);
-let zoom: number = $ref(1);
+let zoom: number = $ref(1),
-let pos: number = $ref(0);
+	pos: number = $ref(0),
-let pointsNote: any = $ref(null);
+	pointsNote: any = $ref(null),
-let pointsReply: any = $ref(null);
+	pointsReply: any = $ref(null),
-let pointsRenote: any = $ref(null);
+	pointsRenote: any = $ref(null),
-let pointsTotal: 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;
+		const moveLeft = me.clientX - clickX;
-		let moveTop = me.clientY - clickY;
+		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";
@@ -79,8 +78,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -60,8 +59,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -43,8 +42,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -69,8 +68,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 
@@ -113,7 +112,7 @@ const tick = () => {
 	][now.getDay()];
 
 	const dayNumer = now.getTime() - new Date(ny, nm, nd).getTime();
-	const dayDenom = 1000 /*ms*/ * 60 /*s*/ * 60 /*m*/ * 24; /*h*/
+	const dayDenom = 1000 /* ms */ * 60 /* s */ * 60 /* m */ * 24; /* h */
 	const monthNumer = now.getTime() - new Date(ny, nm, 1).getTime();
 	const monthDenom =
 		new Date(ny, nm + 1, 1).getTime() - new Date(ny, nm, 1).getTime();

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";
@@ -189,8 +188,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
 
@@ -66,8 +65,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -76,8 +75,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps> & { foldable?: boolean; scrollable?: boolean; }>();
+// const props = defineProps<WidgetComponentProps<WidgetProps> & { foldable?: boolean; scrollable?: boolean; }>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{
 	widget?: Widget<WidgetProps>;
 	foldable?: boolean;

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";
@@ -46,8 +46,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 
@@ -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";
@@ -154,8 +153,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -49,8 +48,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // Currently, due to a limitation of vue, imported types cannot be passed to generics.
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -65,8 +64,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -45,8 +44,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -58,8 +57,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -26,8 +25,8 @@ const widgetPropsDef = {};
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -91,8 +90,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -62,8 +61,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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);
+const viewBoxX: number = $ref(50);
-let viewBoxY: number = $ref(30);
+const viewBoxY: number = $ref(30);
-let stats: any[] = $ref([]);
+const stats: any[] = $ref([]);
 const cpuGradientId = uuid();
 const cpuMaskId = uuid();
 const memGradientId = uuid();
 const memMaskId = uuid();
-let cpuPolylinePoints: string = $ref("");
+let cpuPolylinePoints: string = $ref(""),
-let memPolylinePoints: string = $ref("");
+	memPolylinePoints: string = $ref(""),
-let cpuPolygonPoints: string = $ref("");
+	cpuPolygonPoints: string = $ref(""),
-let memPolygonPoints: string = $ref("");
+	memPolygonPoints: string = $ref(""),
-let cpuHeadX: any = $ref(null);
+	cpuHeadX: any = $ref(null),
-let cpuHeadY: any = $ref(null);
+	cpuHeadY: any = $ref(null),
-let memHeadX: any = $ref(null);
+	memHeadX: any = $ref(null),
-let memHeadY: any = $ref(null);
+	memHeadY: any = $ref(null),
-let cpuP: string = $ref("");
+	cpuP: string = $ref(""),
-let memP: 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";
@@ -92,8 +91,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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 progress: number = $ref(0),
-let serverStats = $ref(null);
+	serverStats = $ref(null),
-let totalSize: number = $ref(0);
+	totalSize: number = $ref(0),
-let indexCount: number = $ref(0);
+	indexCount: number = $ref(0),
-let available: string = $ref("unavailable");
+	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 usage: number = $ref(0),
-let total: number = $ref(0);
+	total: number = $ref(0),
-let used: number = $ref(0);
+	used: number = $ref(0),
-let free: 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);
+const viewBoxX: number = $ref(50);
-let viewBoxY: number = $ref(30);
+const viewBoxY: number = $ref(30);
-let stats: any[] = $ref([]);
+const stats: any[] = $ref([]);
-let inPolylinePoints: string = $ref("");
+let inPolylinePoints: string = $ref(""),
-let outPolylinePoints: string = $ref("");
+	outPolylinePoints: string = $ref(""),
-let inPolygonPoints: string = $ref("");
+	inPolygonPoints: string = $ref(""),
-let outPolygonPoints: string = $ref("");
+	outPolygonPoints: string = $ref(""),
-let inHeadX: any = $ref(null);
+	inHeadX: any = $ref(null),
-let inHeadY: any = $ref(null);
+	inHeadY: any = $ref(null),
-let outHeadX: any = $ref(null);
+	outHeadX: any = $ref(null),
-let outHeadY: any = $ref(null);
+	outHeadY: any = $ref(null),
-let inRecent: number = $ref(0);
+	inRecent: number = $ref(0),
-let outRecent: 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";
@@ -53,8 +52,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -113,8 +112,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
@@ -64,8 +63,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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";
 
@@ -52,8 +51,8 @@ const widgetPropsDef = {
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 

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

@@ -28,8 +28,9 @@
 </template>
 
 <script lang="ts" setup>
-import { useWidgetPropsManager, Widget, WidgetComponentExpose } from "./widget";
+import type { Widget, WidgetComponentExpose } from "./widget";
-import { GetFormResultType } from "@/scripts/form";
+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";
@@ -51,8 +52,8 @@ const widgetPropsDef = {
 };
 type WidgetProps = GetFormResultType<typeof widgetPropsDef>;
 // 現時点ではvueの制限によりimportしたtypeをジェネリックに渡せない
-//const props = defineProps<WidgetComponentProps<WidgetProps>>();
+// const props = defineProps<WidgetComponentProps<WidgetProps>>();
-//const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
+// const emit = defineEmits<WidgetComponentEmits<WidgetProps>>();
 const props = defineProps<{ widget?: Widget<WidgetProps> }>();
 const emit = defineEmits<{ (ev: "updateProps", props: WidgetProps) }>();
 const { widgetProps, configure, save } = useWidgetPropsManager(
@@ -61,9 +62,9 @@ const { widgetProps, configure, save } = useWidgetPropsManager(
 	props,
 	emit,
 );
-let list = $ref();
+let list = $ref(),
-let users = $ref([]);
+	users = $ref([]),
-let fetching = $ref(true);
+	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)
+		super(msg);
-    this.isCancel = true
+		this.isCancel = true;
-    Object.setPrototypeOf(this, RequestCanceledError)
+		Object.setPrototypeOf(this, RequestCanceledError);
 	}
 }
 
 export const isCancel = (value: any): boolean => {
-  return value && value.isCancel
+	return value && value.isCancel;
-}
+};