From eb9915baf880146007bf035a8fe770acee016358 Mon Sep 17 00:00:00 2001 From: syuilo <4439005+syuilo@users.noreply.github.com> Date: Tue, 26 Aug 2025 10:56:09 +0900 Subject: [PATCH] refactor and fix --- CHANGELOG.md | 1 + packages/frontend/src/os.ts | 21 +----------------- .../src/pages/settings/avatar-decoration.vue | 22 ++++++++++++++----- .../pages/settings/drive.WatermarkItem.vue | 2 +- 4 files changed, 20 insertions(+), 26 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index dd9b4ff183..770b37a206 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -55,6 +55,7 @@ - Fix: メンションとしての条件を満たしていても、特定の条件(`-`が含まれる場合など)で正しくサジェストされない問題を一部修正 - Fix: ユーザーの前後ノートを閲覧する機能が動作しない問題を修正 - Fix: 照会ダイアログでap/showでローカルユーザーを解決した際@username@nullに飛ばされる問題を修正 +- Fix: アイコンのデコレーションを付ける際にデコレーションが表示されなくなる問題を修正 ### Server - Feat: サーバー管理コマンド diff --git a/packages/frontend/src/os.ts b/packages/frontend/src/os.ts index bf0e5e1b37..6ba3af72b9 100644 --- a/packages/frontend/src/os.ts +++ b/packages/frontend/src/os.ts @@ -9,7 +9,7 @@ import { markRaw, ref, defineAsyncComponent, nextTick } from 'vue'; import { EventEmitter } from 'eventemitter3'; import * as Misskey from 'misskey-js'; import type { Component, Ref } from 'vue'; -import type { ComponentProps as CP } from 'vue-component-type-helpers'; +import type { ComponentEmit, ComponentProps as CP } from 'vue-component-type-helpers'; import type { Form, GetFormResultType } from '@/utility/form.js'; import type { MenuItem } from '@/types/menu.js'; import type { PostFormProps } from '@/types/post-form.js'; @@ -157,28 +157,9 @@ export function claimZIndex(priority: keyof typeof zIndexes = 'low'): number { return zIndexes[priority]; } -// InstanceType['$emit'] だとインターセクション型が返ってきて -// 使い物にならないので、代わりに ['$props'] から色々省くことで emit の型を生成する -// FIXME: 何故か *.ts ファイルからだと型がうまく取れない？ことがあるのをなんとかしたい -type ComponentEmit = T extends new () => { $props: infer Props } - ? [keyof Pick>] extends [never] - ? Record // *.ts ファイルから型がうまく取れないとき用（これがないと {} になって型エラーがうるさい） - : EmitsExtractor - : T extends (...args: any) => any - ? ReturnType extends { [x: string]: any; __ctx?: { [x: string]: any; props: infer Props } } - ? [keyof Pick>] extends [never] - ? Record - : EmitsExtractor - : never - : never; - // props に ref を許可するようにする type ComponentProps = { [K in keyof CP]: CP[K] | Ref[K]> }; -type EmitsExtractor = { - [K in keyof T as K extends `onVnode${string}` ? never : K extends `on${infer E}` ? Uncapitalize : K extends string ? never : K]: T[K]; -}; - export function popup( component: T, props: ComponentProps, diff --git a/packages/frontend/src/pages/settings/avatar-decoration.vue b/packages/frontend/src/pages/settings/avatar-decoration.vue index c58cd57c65..4b8ac9a26c 100644 --- a/packages/frontend/src/pages/settings/avatar-decoration.vue +++ b/packages/frontend/src/pages/settings/avatar-decoration.vue @@ -17,13 +17,13 @@ SPDX-License-Identifier: AGPL-3.0-only
@@ -50,6 +50,7 @@ SPDX-License-Identifier: AGPL-3.0-only import { ref, defineAsyncComponent, computed } from 'vue'; import * as Misskey from 'misskey-js'; import XDecoration from './avatar-decoration.decoration.vue'; +import XDialog from './avatar-decoration.dialog.vue'; import MkButton from '@/components/MkButton.vue'; import * as os from '@/os.js'; import { misskeyApi } from '@/utility/misskey-api.js'; @@ -68,14 +69,24 @@ misskeyApi('get-avatar-decorations').then(_avatarDecorations => { loading.value = false; }); -async function openDecoration(avatarDecoration, index?: number) { - const { dispose } = await os.popupAsyncWithDialog(import('./avatar-decoration.dialog.vue').then(x => x.default), { +function openAttachedDecoration(index: number) { + openDecoration(avatarDecorations.value.find(d => d.id === $i.avatarDecorations[index].id) ?? { id: '', url: '', name: '?', roleIdsThatCanBeUsedThisDecoration: [] }, index); +} + +async function openDecoration(avatarDecoration: { + id: string; + url: string; + name: string; + roleIdsThatCanBeUsedThisDecoration: string[]; +}, index?: number) { + const { dispose } = os.popup(XDialog, { decoration: avatarDecoration, - usingIndex: index, + usingIndex: index ?? null, }, { 'attach': async (payload) => { const decoration = { id: avatarDecoration.id, + url: avatarDecoration.url, angle: payload.angle, flipH: payload.flipH, offsetX: payload.offsetX, @@ -90,6 +101,7 @@ async function openDecoration(avatarDecoration, index?: number) { 'update': async (payload) => { const decoration = { id: avatarDecoration.id, + url: avatarDecoration.url, angle: payload.angle, flipH: payload.flipH, offsetX: payload.offsetX, diff --git a/packages/frontend/src/pages/settings/drive.WatermarkItem.vue b/packages/frontend/src/pages/settings/drive.WatermarkItem.vue index b466f35fc5..bb91d5e212 100644 --- a/packages/frontend/src/pages/settings/drive.WatermarkItem.vue +++ b/packages/frontend/src/pages/settings/drive.WatermarkItem.vue @@ -43,7 +43,7 @@ async function edit() { const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkWatermarkEditorDialog.vue')), { preset: deepClone(props.preset), }, { - ok: (preset: WatermarkPreset) => { + ok: (preset) => { emit('updatePreset', preset); }, closed: () => dispose(),