diff --git a/biome.json b/biome.json
index 9bf08ad553..80f0d63eb4 100644
--- a/biome.json
+++ b/biome.json
@@ -21,7 +21,8 @@
 						"useImportType": "warn",
 						"useShorthandFunctionType": "warn",
 						"useTemplate": "warn",
-						"noNonNullAssertion": "off"
+						"noNonNullAssertion": "off",
+						"useNodejsImportProtocol": "off"
 					}
 				}
 			}
diff --git a/packages/client/src/components/MkDrive.file.vue b/packages/client/src/components/MkDrive.file.vue
index 9d09da663e..80a428adc3 100644
--- a/packages/client/src/components/MkDrive.file.vue
+++ b/packages/client/src/components/MkDrive.file.vue
@@ -181,12 +181,15 @@ function describe() {
 			image: props.file,
 		},
 		{
-			done: (result) => {
+			done: (result: {
+				canceled: boolean,
+				result?: string | null,
+			}) => {
 				if (!result || result.canceled) return;
 				const comment = result.result;
 				os.api("drive/files/update", {
 					fileId: props.file.id,
-					comment: comment.length === 0 ? null : comment,
+					comment: comment || null,
 				});
 			},
 		},
diff --git a/packages/client/src/components/MkLaunchPad.vue b/packages/client/src/components/MkLaunchPad.vue
index d17857dc43..084283c270 100644
--- a/packages/client/src/components/MkLaunchPad.vue
+++ b/packages/client/src/components/MkLaunchPad.vue
@@ -73,7 +73,10 @@ import { deviceKind } from "@/scripts/device-kind";
 const props = withDefaults(
 	defineProps<{
 		src?: HTMLElement;
-		anchor?: { x: string; y: string };
+		anchor?: { 
+			x: "left" | "center" | "right";
+			y: "top" | "center" | "bottom";
+		};
 	}>(),
 	{
 		anchor: () => ({ x: "right", y: "center" }),
diff --git a/packages/client/src/components/MkMediaCaption.vue b/packages/client/src/components/MkMediaCaption.vue
index 815b7c5adf..32ecceda21 100644
--- a/packages/client/src/components/MkMediaCaption.vue
+++ b/packages/client/src/components/MkMediaCaption.vue
@@ -100,7 +100,7 @@ const props = withDefaults(
 );
 
 const emit = defineEmits<{
-	done: [v: { canceled: boolean; result?: string | null }];
+	done: [result: { canceled: boolean; result?: string | null }];
 	closed: [];
 }>();
 
diff --git a/packages/client/src/components/MkMediaList.vue b/packages/client/src/components/MkMediaList.vue
index af93e24165..39f618779f 100644
--- a/packages/client/src/components/MkMediaList.vue
+++ b/packages/client/src/components/MkMediaList.vue
@@ -22,7 +22,7 @@
 							media.type.startsWith('video') ||
 							media.type.startsWith('image')
 						"
-						:key="media.id"
+						:key="`m-${media.id}`"
 						:class="{ image: media.type.startsWith('image') }"
 						:data-id="media.id"
 						:media="media"
@@ -30,7 +30,7 @@
 					/>
 					<XModPlayer
 						v-else-if="isModule(media)"
-						:key="media.id"
+						:key="`p-${media.id}`"
 						:module="media"
 					/>
 				</template>
@@ -48,7 +48,7 @@ import "photoswipe/style.css";
 import XBanner from "@/components/MkMediaBanner.vue";
 import XMedia from "@/components/MkMedia.vue";
 import XModPlayer from "@/components/MkModPlayer.vue";
-import * as os from "@/os";
+// import * as os from "@/os";
 import {
 	FILE_EXT_TRACKER_MODULES,
 	FILE_TYPE_BROWSERSAFE,
@@ -61,8 +61,8 @@ const props = defineProps<{
 	inDm?: boolean;
 }>();
 
-const gallery = ref(null);
-const pswpZIndex = os.claimZIndex("middle");
+const gallery = ref<HTMLElement | null>(null);
+// const pswpZIndex = os.claimZIndex("middle");
 
 onMounted(() => {
 	const lightbox = new PhotoSwipeLightbox({
@@ -79,7 +79,7 @@ onMounted(() => {
 					src: media.url,
 					w: media.properties.width,
 					h: media.properties.height,
-					alt: media.comment,
+					alt: media.comment || undefined,
 				};
 				if (
 					media.properties.orientation != null &&
@@ -89,7 +89,7 @@ onMounted(() => {
 				}
 				return item;
 			}),
-		gallery: gallery.value,
+		gallery: gallery.value || undefined,
 		children: ".image",
 		thumbSelector: ".image img",
 		loop: false,
@@ -119,9 +119,13 @@ onMounted(() => {
 		// element is children
 		const { element } = itemData;
 
+		if (element == null) return;
+
 		const id = element.dataset.id;
 		const file = props.mediaList.find((media) => media.id === id);
 
+		if (file == null) return;
+
 		itemData.src = file.url;
 		itemData.w = Number(file.properties.width);
 		itemData.h = Number(file.properties.height);
@@ -132,12 +136,12 @@ onMounted(() => {
 			[itemData.w, itemData.h] = [itemData.h, itemData.w];
 		}
 		itemData.msrc = file.thumbnailUrl;
-		itemData.alt = file.comment;
+		itemData.alt = file.comment || undefined;
 		itemData.thumbCropped = true;
 	});
 
 	lightbox.on("uiRegister", () => {
-		lightbox.pswp.ui.registerElement({
+		lightbox.pswp?.ui?.registerElement({
 			name: "altText",
 			className: "pwsp__alt-text-container",
 			appendTo: "wrapper",
@@ -146,7 +150,7 @@ onMounted(() => {
 				textBox.className = "pwsp__alt-text";
 				el.appendChild(textBox);
 
-				const preventProp = function (ev: Event): void {
+				const preventProp = (ev: Event): void => {
 					ev.stopPropagation();
 				};
 
@@ -158,7 +162,7 @@ onMounted(() => {
 				el.onpointermove = preventProp;
 
 				pwsp.on("change", () => {
-					textBox.textContent = pwsp.currSlide.data.alt?.trim();
+					textBox.textContent = pwsp.currSlide?.data.alt?.trim() ?? null;
 				});
 			},
 		});
@@ -168,7 +172,7 @@ onMounted(() => {
 		history.pushState(null, "", location.href);
 		addEventListener("popstate", close);
 		// This is a workaround. Not sure why, but when clicking to open, it doesn't move focus to the photoswipe. Preventing using esc to close. However when using keyboard to open it already focuses the lightbox fine.
-		lightbox.pswp.element.focus();
+		lightbox.pswp?.element?.focus();
 	});
 	lightbox.on("close", () => {
 		removeEventListener("popstate", close);
@@ -180,7 +184,7 @@ onMounted(() => {
 	function close() {
 		removeEventListener("popstate", close);
 		history.forward();
-		lightbox.pswp.close();
+		lightbox.pswp?.close();
 	}
 });
 
@@ -198,7 +202,7 @@ const isModule = (file: entities.DriveFile): boolean => {
 	return (
 		FILE_TYPE_TRACKER_MODULES.includes(file.type) ||
 		FILE_EXT_TRACKER_MODULES.some((ext) => {
-			return file.name.toLowerCase().endsWith("." + ext);
+			return file.name.toLowerCase().endsWith(`.${ext}`);
 		})
 	);
 };
diff --git a/packages/client/src/components/MkMention.vue b/packages/client/src/components/MkMention.vue
index c2c38d313e..f943997459 100644
--- a/packages/client/src/components/MkMention.vue
+++ b/packages/client/src/components/MkMention.vue
@@ -23,7 +23,6 @@
 		:href="url"
 		target="_blank"
 		rel="noopener"
-		:style="{ background: bgCss }"
 		@click.stop
 	>
 		<span class="main">
@@ -54,7 +53,7 @@ const url = `/${canonical}`;
 const isMe =
 	isSignedIn &&
 	`@${props.username}@${toUnicode(props.host)}`.toLowerCase() ===
-		`@${me.username}@${toUnicode(localHost)}`.toLowerCase();
+		`@${me!.username}@${toUnicode(localHost)}`.toLowerCase();
 </script>
 
 <style lang="scss" scoped>
diff --git a/packages/client/src/components/MkMenu.child.vue b/packages/client/src/components/MkMenu.child.vue
index 688b3ce3a4..ed788c4375 100644
--- a/packages/client/src/components/MkMenu.child.vue
+++ b/packages/client/src/components/MkMenu.child.vue
@@ -37,8 +37,8 @@ function setPosition() {
 	const rect = props.targetElement.getBoundingClientRect();
 	const left = props.targetElement.offsetWidth;
 	const top = rect.top - rootRect.top - 8;
-	el.value.style.left = left + "px";
-	el.value.style.top = top + "px";
+	el.value!.style.left = `${left}px`;
+	el.value!.style.top = `${top}px`;
 }
 
 function onChildClosed(actioned?: boolean) {
@@ -58,7 +58,7 @@ onMounted(() => {
 
 defineExpose({
 	checkHit: (ev: MouseEvent) => {
-		return ev.target === el.value || el.value.contains(ev.target);
+		return ev.target === el.value || el.value?.contains(ev.target as Node);
 	},
 });
 </script>
diff --git a/packages/client/src/components/MkMenu.vue b/packages/client/src/components/MkMenu.vue
index 2a7db40be8..c778f0f6f1 100644
--- a/packages/client/src/components/MkMenu.vue
+++ b/packages/client/src/components/MkMenu.vue
@@ -89,7 +89,8 @@
 						></span>
 					</a>
 					<button
-						v-else-if="item.type === 'user' && !items.hidden"
+						v-else-if="item.type === 'user'"
+						v-show="!item.hidden"
 						class="_button item"
 						:class="{ active: item.active }"
 						:disabled="item.active"
@@ -206,6 +207,7 @@ import {
 	onMounted,
 	ref,
 	watch,
+	shallowRef,
 } from "vue";
 import { FocusTrap } from "focus-trap-vue";
 import FormSwitch from "@/components/form/switch.vue";
@@ -213,6 +215,7 @@ import type {
 	InnerMenuItem,
 	MenuAction,
 	MenuItem,
+	MenuParent,
 	MenuPending,
 } from "@/types/menu";
 import * as os from "@/os";
@@ -234,20 +237,24 @@ const props = defineProps<{
 }>();
 
 const emit = defineEmits<{
-	(ev: "close", actioned?: boolean): void;
+	close: [actioned?: boolean];
 }>();
 
 const itemsEl = ref<HTMLDivElement>();
 
-const items2: InnerMenuItem[] = ref([]);
+const items2 = shallowRef<InnerMenuItem[]>([]);
 
 const child = ref<InstanceType<typeof XChild>>();
 
 const childShowingItem = ref<MenuItem | null>();
 
+// FIXME: this is not used
+const isActive = ref();
+
 watch(
 	() => props.items,
 	() => {
+		// FIXME: what's this?
 		const items: (MenuItem | MenuPending)[] = [...props.items].filter(
 			(item) => item !== undefined,
 		);
@@ -288,29 +295,29 @@ function onGlobalMousedown(event: MouseEvent) {
 	if (
 		childTarget.value &&
 		(event.target === childTarget.value ||
-			childTarget.value.contains(event.target))
+			childTarget.value.contains(event.target as Node))
 	)
 		return;
-	if (child.value && child.value.checkHit(event)) return;
+	if (child.value?.checkHit(event)) return;
 	closeChild();
 }
 
 let childCloseTimer: null | number = null;
-function onItemMouseEnter(item) {
+function onItemMouseEnter(_item) {
 	childCloseTimer = window.setTimeout(() => {
 		closeChild();
 	}, 300);
 }
-function onItemMouseLeave(item) {
+function onItemMouseLeave(_item) {
 	if (childCloseTimer) window.clearTimeout(childCloseTimer);
 }
 
-async function showChildren(item: MenuItem, ev: MouseEvent) {
+async function showChildren(item: MenuParent, ev: MouseEvent) {
 	if (props.asDrawer) {
-		os.popupMenu(item.children, ev.currentTarget ?? ev.target);
+		os.popupMenu(item.children, (ev.currentTarget ?? ev.target) as HTMLElement);
 		close();
 	} else {
-		childTarget.value = ev.currentTarget ?? ev.target;
+		childTarget.value = (ev.currentTarget ?? ev.target) as HTMLElement;
 		childMenu.value = item.children;
 		childShowingItem.value = item;
 	}
diff --git a/packages/client/src/components/MkMiniChart.vue b/packages/client/src/components/MkMiniChart.vue
index bfa83f3d80..e82733c715 100644
--- a/packages/client/src/components/MkMiniChart.vue
+++ b/packages/client/src/components/MkMiniChart.vue
@@ -20,7 +20,7 @@
 			:stroke="color"
 			stroke-width="2"
 		/>
-		<circle :cx="headX" :cy="headY" r="3" :fill="color" />
+		<circle :cx="headX ?? undefined" :cy="headY ?? undefined" r="3" :fill="color" />
 	</svg>
 </template>
 
diff --git a/packages/client/src/components/MkModal.vue b/packages/client/src/components/MkModal.vue
index 6a2897cebf..57ecc1b0d8 100644
--- a/packages/client/src/components/MkModal.vue
+++ b/packages/client/src/components/MkModal.vue
@@ -108,8 +108,11 @@ type ModalTypes = "popup" | "dialog" | "dialog:top" | "drawer";
 const props = withDefaults(
 	defineProps<{
 		manualShowing?: boolean | null;
-		anchor?: { x: string; y: string };
-		src?: HTMLElement;
+		anchor?: { 
+			x: "left" | "center" | "right";
+			y: "top" | "center" | "bottom";
+		};
+		src?: HTMLElement | null;
 		preferType?: ModalTypes | "auto";
 		zPriority?: "low" | "middle" | "high";
 		noOverlap?: boolean;
@@ -118,7 +121,7 @@ const props = withDefaults(
 	}>(),
 	{
 		manualShowing: null,
-		src: undefined,
+		src: null,
 		anchor: () => ({ x: "center", y: "bottom" }),
 		preferType: "auto",
 		zPriority: "low",
@@ -139,6 +142,9 @@ const emit = defineEmits<{
 
 provide("modal", true);
 
+// FIXME: this may not used
+const isActive = ref();
+
 const maxHeight = ref<number>();
 const fixed = ref(false);
 const transformOrigin = ref("center");
@@ -189,7 +195,7 @@ const transitionDuration = computed(() =>
 
 let contentClicking = false;
 
-const focusedElement = document.activeElement;
+const focusedElement = document.activeElement as HTMLElement;
 function close(_ev?, opts: { useSendAnimation?: boolean } = {}) {
 	// removeEventListener("popstate", close);
 	// if (props.preferType == "dialog") {
@@ -204,7 +210,7 @@ function close(_ev?, opts: { useSendAnimation?: boolean } = {}) {
 	showing.value = false;
 	emit("close");
 	if (!props.noReturnFocus) {
-		focusedElement.focus();
+		focusedElement?.focus();
 	}
 }
 
@@ -235,8 +241,8 @@ const align = () => {
 	const width = content.value!.offsetWidth;
 	const height = content.value!.offsetHeight;
 
-	let left: number;
-	let top: number;
+	let left = 0;
+	let top = MARGIN;
 
 	const x = srcRect.left + (fixed.value ? 0 : window.scrollX);
 	const y = srcRect.top + (fixed.value ? 0 : window.scrollY);
diff --git a/packages/client/src/components/MkPopupMenu.vue b/packages/client/src/components/MkPopupMenu.vue
index 9a98648ea2..1bee69a0b2 100644
--- a/packages/client/src/components/MkPopupMenu.vue
+++ b/packages/client/src/components/MkPopupMenu.vue
@@ -35,7 +35,7 @@ defineProps<{
 	align?: "center" | string;
 	width?: number;
 	viaKeyboard?: boolean;
-	src?: any;
+	src?: HTMLElement | null;
 	noReturnFocus?;
 }>();
 
diff --git a/packages/client/src/os.ts b/packages/client/src/os.ts
index 426fd29084..32d84396ef 100644
--- a/packages/client/src/os.ts
+++ b/packages/client/src/os.ts
@@ -213,7 +213,7 @@ interface VueComponentConstructor<P, E> {
 export async function popup<Props, Emits>(
 	component: VueComponentConstructor<Props, Emits>,
 	props: Props & Record<string, unknown>,
-	events: Partial<NonNullable<Emits>> | Record<string, never> = {},
+	events: Partial<Emits> = {},
 	disposeEvent?: string,
 ) {
 	markRaw(component);
@@ -858,7 +858,7 @@ export async function openEmojiPicker(
 
 export function popupMenu(
 	items: MenuItem[] | Ref<MenuItem[]>,
-	src?: HTMLElement,
+	src?: HTMLElement | null,
 	options?: {
 		align?: string;
 		width?: number;