summaryrefslogtreecommitdiff
path: root/packages/frontend/src/ui
diff options
context:
space:
mode:
authorsyuilo <4439005+syuilo@users.noreply.github.com>2026-01-09 22:06:40 +0900
committerGitHub <noreply@github.com>2026-01-09 22:06:40 +0900
commit41592eafb363e3c62ab2d3e5f41b38d7d083d3fb (patch)
tree8f69243a5482ad4161eb28b69769684a221aa05c /packages/frontend/src/ui
parentfix(frontend): popupのemit型が正しく利用できるように修正 (#16... (diff)
downloadmisskey-41592eafb363e3c62ab2d3e5f41b38d7d083d3fb.tar.gz
misskey-41592eafb363e3c62ab2d3e5f41b38d7d083d3fb.tar.bz2
misskey-41592eafb363e3c62ab2d3e5f41b38d7d083d3fb.zip
refactor: make noImplicitAny true (#17083)
* wip * Update emojis.emoji.vue * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * Update manager.ts * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * Update analytics.ts
Diffstat (limited to 'packages/frontend/src/ui')
-rw-r--r--packages/frontend/src/ui/_common_/common.ts4
-rw-r--r--packages/frontend/src/ui/_common_/navbar-h.vue12
-rw-r--r--packages/frontend/src/ui/_common_/navbar.vue10
-rw-r--r--packages/frontend/src/ui/_common_/statusbar-federation.vue2
-rw-r--r--packages/frontend/src/ui/_common_/widgets.vue28
-rw-r--r--packages/frontend/src/ui/deck.vue8
-rw-r--r--packages/frontend/src/ui/deck/column.vue18
-rw-r--r--packages/frontend/src/ui/deck/main-column.vue4
-rw-r--r--packages/frontend/src/ui/deck/widgets-column.vue13
-rw-r--r--packages/frontend/src/ui/universal.vue8
10 files changed, 62 insertions, 45 deletions
diff --git a/packages/frontend/src/ui/_common_/common.ts b/packages/frontend/src/ui/_common_/common.ts
index a9ad36c97a..7ad18fc2a8 100644
--- a/packages/frontend/src/ui/_common_/common.ts
+++ b/packages/frontend/src/ui/_common_/common.ts
@@ -50,7 +50,7 @@ function toolsMenuItems(): MenuItem[] {
return items;
}
-export function openInstanceMenu(ev: MouseEvent) {
+export function openInstanceMenu(ev: PointerEvent) {
const menuItems: MenuItem[] = [];
menuItems.push({
@@ -175,7 +175,7 @@ export function openInstanceMenu(ev: MouseEvent) {
});
}
-export function openToolsMenu(ev: MouseEvent) {
+export function openToolsMenu(ev: PointerEvent) {
os.popupMenu(toolsMenuItems(), ev.currentTarget ?? ev.target, {
align: 'left',
});
diff --git a/packages/frontend/src/ui/_common_/navbar-h.vue b/packages/frontend/src/ui/_common_/navbar-h.vue
index 594c398d8b..eb1d99f0aa 100644
--- a/packages/frontend/src/ui/_common_/navbar-h.vue
+++ b/packages/frontend/src/ui/_common_/navbar-h.vue
@@ -10,18 +10,18 @@ SPDX-License-Identifier: AGPL-3.0-only
<button v-click-anime :class="[$style.item, $style.instance]" class="_button" @click="openInstanceMenu">
<img :class="$style.instanceIcon" :src="instance.iconUrl ?? '/favicon.ico'" draggable="false"/>
</button>
- <MkA v-click-anime v-tooltip="i18n.ts.timeline" :class="$style.item" activeClass="active" to="/" exact>
+ <MkA v-click-anime v-tooltip="i18n.ts.timeline" :class="$style.item" :activeClass="$style.active" to="/" exact>
<i :class="$style.itemIcon" class="ti ti-home ti-fw"></i>
</MkA>
<template v-for="item in menu">
<div v-if="item === '-'" :class="$style.divider"></div>
- <component :is="navbarItemDef[item].to ? 'MkA' : 'button'" v-else-if="navbarItemDef[item] && (navbarItemDef[item].show !== false)" v-click-anime v-tooltip="navbarItemDef[item].title" class="_button" :class="$style.item" activeClass="active" :to="navbarItemDef[item].to" v-on="navbarItemDef[item].action ? { click: navbarItemDef[item].action } : {}">
+ <component :is="navbarItemDef[item].to ? 'MkA' : 'button'" v-else-if="navbarItemDef[item] && (navbarItemDef[item].show == null || navbarItemDef[item].show.value !== false)" v-click-anime v-tooltip="navbarItemDef[item].title" class="_button" :class="$style.item" :activeClass="$style.active" :to="navbarItemDef[item].to" v-on="navbarItemDef[item].action ? { click: navbarItemDef[item].action } : {}">
<i :class="[$style.itemIcon, navbarItemDef[item].icon]" class="ti-fw"></i>
<span v-if="navbarItemDef[item].indicated" :class="$style.indicator" class="_blink"><i class="_indicatorCircle"></i></span>
</component>
</template>
<div :class="$style.divider"></div>
- <MkA v-if="$i && ($i.isAdmin || $i.isModerator)" v-click-anime v-tooltip="i18n.ts.controlPanel" class="item" activeClass="active" to="/admin" :behavior="settingsWindowed ? 'window' : null">
+ <MkA v-if="$i && ($i.isAdmin || $i.isModerator)" v-click-anime v-tooltip="i18n.ts.controlPanel" class="item" :activeClass="$style.active" to="/admin" :behavior="settingsWindowed ? 'window' : null">
<i :class="$style.itemIcon" class="ti ti-dashboard ti-fw"></i>
</MkA>
<button v-click-anime :class="$style.item" class="_button" @click="more">
@@ -30,7 +30,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</button>
</div>
<div :class="$style.right">
- <MkA v-click-anime v-tooltip="i18n.ts.settings" :class="$style.item" activeClass="active" to="/settings" :behavior="settingsWindowed ? 'window' : null">
+ <MkA v-click-anime v-tooltip="i18n.ts.settings" :class="$style.item" :activeClass="$style.active" to="/settings" :behavior="settingsWindowed ? 'window' : null">
<i :class="$style.itemIcon" class="ti ti-settings ti-fw"></i>
</MkA>
<button v-if="$i" v-click-anime :class="[$style.item, $style.account]" class="_button" @click="openAccountMenu">
@@ -76,7 +76,7 @@ const otherNavItemIndicated = computed<boolean>(() => {
return false;
});
-async function more(ev: MouseEvent) {
+async function more(ev: PointerEvent) {
const target = getHTMLElementOrNull(ev.currentTarget ?? ev.target);
if (!target) return;
@@ -88,7 +88,7 @@ async function more(ev: MouseEvent) {
});
}
-async function openAccountMenu(ev: MouseEvent) {
+async function openAccountMenu(ev: PointerEvent) {
const menuItems = await getAccountMenu({
withExtraOperation: true,
});
diff --git a/packages/frontend/src/ui/_common_/navbar.vue b/packages/frontend/src/ui/_common_/navbar.vue
index ee76412476..10cbd22809 100644
--- a/packages/frontend/src/ui/_common_/navbar.vue
+++ b/packages/frontend/src/ui/_common_/navbar.vue
@@ -26,10 +26,10 @@ SPDX-License-Identifier: AGPL-3.0-only
<div v-if="item === '-'" :class="$style.divider"></div>
<component
:is="navbarItemDef[item].to ? 'MkA' : 'button'"
- v-else-if="navbarItemDef[item] && (navbarItemDef[item].show !== false)"
+ v-else-if="navbarItemDef[item] && (navbarItemDef[item].show == null || navbarItemDef[item].show.value !== false)"
v-tooltip.noDelay.right="navbarItemDef[item].title"
class="_button"
- :class="[$style.item, { [$style.active]: navbarItemDef[item].active }]"
+ :class="[$style.item]"
:activeClass="$style.active"
:to="navbarItemDef[item].to"
v-on="navbarItemDef[item].action ? { click: navbarItemDef[item].action } : {}"
@@ -161,7 +161,7 @@ function toggleIconOnly() {
}
}
-function toggleRealtimeMode(ev: MouseEvent) {
+function toggleRealtimeMode(ev: PointerEvent) {
os.popupMenu([{
type: 'label',
text: i18n.ts.realtimeMode,
@@ -175,7 +175,7 @@ function toggleRealtimeMode(ev: MouseEvent) {
}], ev.currentTarget ?? ev.target);
}
-async function openAccountMenu(ev: MouseEvent) {
+async function openAccountMenu(ev: PointerEvent) {
const menuItems = await getAccountMenu({
withExtraOperation: true,
});
@@ -183,7 +183,7 @@ async function openAccountMenu(ev: MouseEvent) {
os.popupMenu(menuItems, ev.currentTarget ?? ev.target);
}
-async function more(ev: MouseEvent) {
+async function more(ev: PointerEvent) {
const target = getHTMLElementOrNull(ev.currentTarget ?? ev.target);
if (!target) return;
const { dispose } = await os.popupAsyncWithDialog(import('@/components/MkLaunchPad.vue').then(x => x.default), {
diff --git a/packages/frontend/src/ui/_common_/statusbar-federation.vue b/packages/frontend/src/ui/_common_/statusbar-federation.vue
index 079f1f92bb..23093e60d7 100644
--- a/packages/frontend/src/ui/_common_/statusbar-federation.vue
+++ b/packages/frontend/src/ui/_common_/statusbar-federation.vue
@@ -67,7 +67,7 @@ useInterval(tick, Math.max(5000, props.refreshIntervalSec * 1000), {
afterMounted: true,
});
-function getInstanceIcon(instance): string {
+function getInstanceIcon(instance: Misskey.entities.FederationInstance): string {
return getProxiedImageUrlNullable(instance.iconUrl, 'preview') ?? getProxiedImageUrlNullable(instance.faviconUrl, 'preview') ?? '/client-assets/dummy.png';
}
</script>
diff --git a/packages/frontend/src/ui/_common_/widgets.vue b/packages/frontend/src/ui/_common_/widgets.vue
index ed084af6ee..4087c4d517 100644
--- a/packages/frontend/src/ui/_common_/widgets.vue
+++ b/packages/frontend/src/ui/_common_/widgets.vue
@@ -5,7 +5,15 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<div>
- <XWidgets :edit="editMode" :widgets="widgets" @addWidget="addWidget" @removeWidget="removeWidget" @updateWidget="updateWidget" @updateWidgets="updateWidgets" @exit="editMode = false"/>
+ <XWidgets
+ :edit="editMode"
+ :widgets="widgets"
+ @addWidget="addWidget"
+ @removeWidget="removeWidget"
+ @updateWidget="updateWidget"
+ @updateWidgets="updateWidgets"
+ @exit="editMode = false"
+ />
<button v-if="editMode" class="_textButton" style="font-size: 0.9em;" @click="editMode = false"><i class="ti ti-check"></i> {{ i18n.ts.editWidgetsExit }}</button>
<button v-else class="_textButton" data-cy-widget-edit :class="$style.edit" style="font-size: 0.9em; margin-top: 16px;" @click="editMode = true"><i class="ti ti-pencil"></i> {{ i18n.ts.editWidgets }}</button>
@@ -16,7 +24,9 @@ SPDX-License-Identifier: AGPL-3.0-only
import { computed, ref } from 'vue';
const editMode = ref(false);
</script>
+
<script lang="ts" setup>
+import type { DefaultStoredWidget, Widget } from '@/components/MkWidgets.vue';
import XWidgets from '@/components/MkWidgets.vue';
import { i18n } from '@/i18n.js';
import { prefer } from '@/preferences.js';
@@ -36,30 +46,31 @@ const widgets = computed(() => {
return prefer.r.widgets.value.filter(w => w.place !== 'left');
});
-function addWidget(widget) {
+function addWidget(widget: Widget) {
prefer.commit('widgets', [{
...widget,
place: props.place,
}, ...prefer.s.widgets]);
}
-function removeWidget(widget) {
+function removeWidget(widget: Widget) {
prefer.commit('widgets', prefer.s.widgets.filter(w => w.id !== widget.id));
}
-function updateWidget({ id, data }) {
- prefer.commit('widgets', prefer.s.widgets.map(w => w.id === id ? {
+function updateWidget(widget: { id: Widget['id']; data: Widget['data']; }) {
+ prefer.commit('widgets', prefer.s.widgets.map(w => w.id === widget.id ? {
...w,
- data,
+ data: widget.data,
place: props.place,
} : w));
}
-function updateWidgets(thisWidgets) {
+function updateWidgets(thisWidgets: Widget[]) {
if (props.place === null) {
- prefer.commit('widgets', thisWidgets);
+ prefer.commit('widgets', thisWidgets as DefaultStoredWidget[]);
return;
}
+
if (props.place === 'left') {
prefer.commit('widgets', [
...thisWidgets.map(w => ({ ...w, place: 'left' })),
@@ -67,6 +78,7 @@ function updateWidgets(thisWidgets) {
]);
return;
}
+
prefer.commit('widgets', [
...prefer.s.widgets.filter(w => w.place === 'left' && !thisWidgets.some(t => w.id === t.id)),
...thisWidgets.map(w => ({ ...w, place: 'right' })),
diff --git a/packages/frontend/src/ui/deck.vue b/packages/frontend/src/ui/deck.vue
index fabff28eb6..0bafa1074c 100644
--- a/packages/frontend/src/ui/deck.vue
+++ b/packages/frontend/src/ui/deck.vue
@@ -174,7 +174,7 @@ const addColumnButtonEl = useTemplateRef('addColumnButtonEl');
const settingsButtonEl = useTemplateRef('settingsButtonEl');
const swicthProfileButtonEl = useTemplateRef('swicthProfileButtonEl');
-const addColumn = async (ev) => {
+async function addColumn(ev: PointerEvent) {
const { canceled, result: column } = await os.select({
title: i18n.ts._deck.addColumn,
items: columnTypes.filter(column => column !== 'chat' || $i == null || $i.policies.chatAvailability !== 'unavailable').map(column => ({
@@ -190,14 +190,14 @@ const addColumn = async (ev) => {
width: 330,
soundSetting: { type: null, volume: 1 },
});
-};
+}
-const onContextmenu = (ev) => {
+function onContextmenu(ev: PointerEvent) {
os.contextMenu([{
text: i18n.ts._deck.addColumn,
action: addColumn,
}], ev);
-};
+}
// タッチでスクロールしてるときはスナップスクロールを有効にする
function pointerEvent(ev: PointerEvent) {
diff --git a/packages/frontend/src/ui/deck/column.vue b/packages/frontend/src/ui/deck/column.vue
index 312ca51c83..410faf11f9 100644
--- a/packages/frontend/src/ui/deck/column.vue
+++ b/packages/frontend/src/ui/deck/column.vue
@@ -247,15 +247,15 @@ function getMenu() {
return menuItems;
}
-function showSettingsMenu(ev: MouseEvent) {
+function showSettingsMenu(ev: PointerEvent) {
os.popupMenu(getMenu(), ev.currentTarget ?? ev.target);
}
-function onContextmenu(ev: MouseEvent) {
+function onContextmenu(ev: PointerEvent) {
os.contextMenu(getMenu(), ev);
}
-function goTop(ev: MouseEvent) {
+function goTop(ev: PointerEvent) {
emit('headerClick', ev);
if (!props.handleScrollToTop) return;
@@ -267,7 +267,9 @@ function goTop(ev: MouseEvent) {
}
}
-function onDragstart(ev) {
+function onDragstart(ev: DragEvent) {
+ if (ev.dataTransfer == null) return;
+
ev.dataTransfer.effectAllowed = 'move';
setDragData(ev, 'deckColumn', props.column.id);
@@ -278,11 +280,13 @@ function onDragstart(ev) {
}, 10);
}
-function onDragend(ev) {
+function onDragend(ev: DragEvent) {
dragging.value = false;
}
-function onDragover(ev) {
+function onDragover(ev: DragEvent) {
+ if (ev.dataTransfer == null) return;
+
// 自分自身がドラッグされている場合
if (dragging.value) {
// 自分自身にはドロップさせない
@@ -300,7 +304,7 @@ function onDragleave() {
draghover.value = false;
}
-function onDrop(ev) {
+function onDrop(ev: DragEvent) {
draghover.value = false;
os.deckGlobalEvents.emit('column.dragEnd');
diff --git a/packages/frontend/src/ui/deck/main-column.vue b/packages/frontend/src/ui/deck/main-column.vue
index 1388cbdc18..8757ec0941 100644
--- a/packages/frontend/src/ui/deck/main-column.vue
+++ b/packages/frontend/src/ui/deck/main-column.vue
@@ -58,11 +58,11 @@ function back() {
history.back();
}
*/
-function onContextmenu(ev: MouseEvent) {
+function onContextmenu(ev: PointerEvent) {
if (!ev.target) return;
if (isLink(ev.target as HTMLElement)) return;
- if (['INPUT', 'TEXTAREA', 'IMG', 'VIDEO', 'CANVAS'].includes((ev.target as HTMLElement).tagName) || (ev.target as HTMLElement).attributes['contenteditable']) return;
+ if (['INPUT', 'TEXTAREA', 'IMG', 'VIDEO', 'CANVAS'].includes((ev.target as HTMLElement).tagName) || (ev.target as HTMLElement).attributes.getNamedItem('contenteditable') != null) return;
if (window.getSelection()?.toString() !== '') return;
const path = mainRouter.currentRoute.value.path;
os.contextMenu([{
diff --git a/packages/frontend/src/ui/deck/widgets-column.vue b/packages/frontend/src/ui/deck/widgets-column.vue
index 4e84ef0ba0..0985e95653 100644
--- a/packages/frontend/src/ui/deck/widgets-column.vue
+++ b/packages/frontend/src/ui/deck/widgets-column.vue
@@ -17,8 +17,9 @@ SPDX-License-Identifier: AGPL-3.0-only
<script lang="ts" setup>
import { ref } from 'vue';
import XColumn from './column.vue';
-import { addColumnWidget, removeColumnWidget, setColumnWidgets, updateColumnWidget } from '@/deck.js';
import type { Column } from '@/deck.js';
+import type { Widget } from '@/components/MkWidgets.vue';
+import { addColumnWidget, removeColumnWidget, setColumnWidgets, updateColumnWidget } from '@/deck.js';
import XWidgets from '@/components/MkWidgets.vue';
import { i18n } from '@/i18n.js';
@@ -29,19 +30,19 @@ const props = defineProps<{
const edit = ref(false);
-function addWidget(widget) {
+function addWidget(widget: Widget) {
addColumnWidget(props.column.id, widget);
}
-function removeWidget(widget) {
+function removeWidget(widget: Widget) {
removeColumnWidget(props.column.id, widget);
}
-function updateWidget({ id, data }) {
- updateColumnWidget(props.column.id, id, data);
+function updateWidget(widget: { id: Widget['id']; data: Widget['data']; }) {
+ updateColumnWidget(props.column.id, widget.id, widget.data);
}
-function updateWidgets(widgets) {
+function updateWidgets(widgets: Widget[]) {
setColumnWidgets(props.column.id, widgets);
}
diff --git a/packages/frontend/src/ui/universal.vue b/packages/frontend/src/ui/universal.vue
index 497ef72d04..95582edea1 100644
--- a/packages/frontend/src/ui/universal.vue
+++ b/packages/frontend/src/ui/universal.vue
@@ -103,9 +103,9 @@ if (window.innerWidth > 1024) {
}
}
-const onContextmenu = (ev) => {
- if (isLink(ev.target)) return;
- if (['INPUT', 'TEXTAREA', 'IMG', 'VIDEO', 'CANVAS'].includes(ev.target.tagName) || ev.target.attributes['contenteditable']) return;
+function onContextmenu(ev: PointerEvent) {
+ if (isLink(ev.target as HTMLElement)) return;
+ if (['INPUT', 'TEXTAREA', 'IMG', 'VIDEO', 'CANVAS'].includes((ev.target as HTMLElement).tagName) || (ev.target as HTMLElement).attributes.getNamedItem('contenteditable') != null) return;
if (window.getSelection()?.toString() !== '') return;
const path = mainRouter.getCurrentFullPath();
os.contextMenu([{
@@ -118,7 +118,7 @@ const onContextmenu = (ev) => {
os.pageWindow(path);
},
}], ev);
-};
+}
</script>
<style lang="scss" module>