diff --git a/CHANGELOG.md b/CHANGELOG.md index 57d8a528f3..7339dbd3ff 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,6 +23,7 @@ (Based on https://github.com/Otaku-Social/maniakey/pull/14) - Enhance: AiScriptの拡張API関数において引数の型チェックをより厳格に - Enhance: クエリパラメータでuiを一時的に変更できるように #15240 +- Enhance: リモート絵文字のインポート時に詳細を確認できるように #15336 - Fix: 画面サイズが変わった際にナビゲーションバーが自動で折りたたまれない問題を修正 - Fix: サーバー情報メニューに区切り線が不足していたのを修正 - Fix: ノートがログインしているユーザーしか見れない場合にログインダイアログを閉じるとその後の動線がなくなる問題を修正 diff --git a/locales/index.d.ts b/locales/index.d.ts index b98fd5d423..83159337ae 100644 --- a/locales/index.d.ts +++ b/locales/index.d.ts @@ -10635,6 +10635,10 @@ export interface Locale extends ILocale { "logNothing": string; }; "_remote": { + /** + * 選択行の詳細 + */ + "selectionRowDetail": string; /** * 選択行をインポート */ diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 638f2a69c3..42c25a58a6 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -2837,6 +2837,7 @@ _customEmojisManager: failureLogNothing: "失敗ログはありません。" logNothing: "ログはありません。" _remote: + selectionRowDetail: "選択行の詳細" importSelectionRows: "選択行をインポート" importSelectionRangesRows: "選択範囲の行をインポート" importEmojisButton: "チェックされた絵文字をインポート" diff --git a/packages/frontend/src/components/MkRemoteEmojiEditDialog.vue b/packages/frontend/src/components/MkRemoteEmojiEditDialog.vue new file mode 100644 index 0000000000..873b276b3d --- /dev/null +++ b/packages/frontend/src/components/MkRemoteEmojiEditDialog.vue @@ -0,0 +1,132 @@ + + + + + + + diff --git a/packages/frontend/src/pages/admin/custom-emojis-manager.remote.vue b/packages/frontend/src/pages/admin/custom-emojis-manager.remote.vue index 9a9d2990ba..14a3b71e53 100644 --- a/packages/frontend/src/pages/admin/custom-emojis-manager.remote.vue +++ b/packages/frontend/src/pages/admin/custom-emojis-manager.remote.vue @@ -34,6 +34,16 @@ SPDX-License-Identifier: AGPL-3.0-only > + + + + import { computed, onMounted, ref, useCssModule } from 'vue'; import * as Misskey from 'misskey-js'; +import MkRemoteEmojiEditDialog from '@/components/MkRemoteEmojiEditDialog.vue'; import { misskeyApi } from '@/scripts/misskey-api.js'; import { i18n } from '@/i18n.js'; import MkButton from '@/components/MkButton.vue'; @@ -135,7 +146,7 @@ import { deviceKind } from '@/scripts/device-kind.js'; import MkPagingButtons from '@/components/MkPagingButtons.vue'; import MkSortOrderEditor from '@/components/MkSortOrderEditor.vue'; import { SortOrder } from '@/components/MkSortOrderEditor.define.js'; -import { useLoading } from "@/components/hook/useLoading.js"; +import { useLoading } from '@/components/hook/useLoading.js'; type GridItem = { checked: boolean; @@ -178,12 +189,37 @@ function setupGrid(): GridSetting { { bindTo: 'url', icon: 'ti-icons', type: 'image', editable: false, width: 'auto' }, { bindTo: 'name', title: 'name', type: 'text', editable: false, width: 'auto' }, { bindTo: 'host', title: 'host', type: 'text', editable: false, width: 'auto' }, + { bindTo: 'license', title: 'license', type: 'text', editable: false, width: 200 }, { bindTo: 'uri', title: 'uri', type: 'text', editable: false, width: 'auto' }, { bindTo: 'publicUrl', title: 'publicUrl', type: 'text', editable: false, width: 'auto' }, ], cells: { contextMenuFactory: (col, row, value, context) => { return [ + { + type: 'button', + text: i18n.ts._customEmojisManager._remote.selectionRowDetail, + icon: 'ti ti-info-circle', + action: async () => { + const target = customEmojis.value[row.index]; + const { dispose } = os.popup(MkRemoteEmojiEditDialog, { + emoji: { + id: target.id, + name: target.name, + host: target.host!, + license: target.license, + url: target.publicUrl, + }, + }, { + done: () => { + dispose(); + }, + closed: () => { + dispose(); + }, + }); + }, + }, { type: 'button', text: i18n.ts._customEmojisManager._remote.importSelectionRangesRows, @@ -207,6 +243,7 @@ const currentPage = ref(0); const queryName = ref(null); const queryHost = ref(null); +const queryLicense = ref(null); const queryUri = ref(null); const queryPublicUrl = ref(null); const previousQuery = ref(undefined); @@ -229,6 +266,7 @@ async function onSearchRequest() { function onQueryResetButtonClicked() { queryName.value = null; queryHost.value = null; + queryLicense.value = null; queryUri.value = null; queryPublicUrl.value = null; } @@ -306,6 +344,7 @@ async function refreshCustomEmojis() { const query: Misskey.entities.V2AdminEmojiListRequest['query'] = { name: emptyStrToUndefined(queryName.value), host: emptyStrToUndefined(queryHost.value), + license: emptyStrToUndefined(queryLicense.value), uri: emptyStrToUndefined(queryUri.value), publicUrl: emptyStrToUndefined(queryPublicUrl.value), hostType: 'remote', @@ -330,6 +369,7 @@ async function refreshCustomEmojis() { id: it.id, url: it.publicUrl, name: it.name, + license: it.license, host: it.host!, })); } @@ -356,6 +396,10 @@ onMounted(async () => { grid-column: 2 / 3; } +.col3 { + grid-column: 3 / 4; +} + .root { padding: 16px; } @@ -366,7 +410,7 @@ onMounted(async () => { .searchArea { display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: 1fr 1fr 1fr; gap: 16px; } diff --git a/packages/frontend/src/pages/custom-emojis-manager.vue b/packages/frontend/src/pages/custom-emojis-manager.vue index 789a63eb90..82c6d8df4e 100644 --- a/packages/frontend/src/pages/custom-emojis-manager.vue +++ b/packages/frontend/src/pages/custom-emojis-manager.vue @@ -78,6 +78,7 @@ import { computed, defineAsyncComponent, ref, shallowRef } from 'vue'; import MkButton from '@/components/MkButton.vue'; import MkInput from '@/components/MkInput.vue'; import MkPagination from '@/components/MkPagination.vue'; +import MkRemoteEmojiEditDialog from '@/components/MkRemoteEmojiEditDialog.vue'; import MkSwitch from '@/components/MkSwitch.vue'; import FormSplit from '@/components/form/split.vue'; import { selectFile } from '@/scripts/select-file.js'; @@ -159,6 +160,19 @@ const edit = (emoji) => { }); }; +const detailRemoteEmoji = (emoji) => { + const { dispose } = os.popup(MkRemoteEmojiEditDialog, { + emoji: emoji, + }, { + done: () => { + dispose(); + }, + closed: () => { + dispose(); + }, + }); +}; + const importEmoji = (emoji) => { os.apiWithDialog('admin/emoji/copy', { emojiId: emoji.id, @@ -169,6 +183,10 @@ const remoteMenu = (emoji, ev: MouseEvent) => { os.popupMenu([{ type: 'label', text: ':' + emoji.name + ':', + }, { + text: i18n.ts.details, + icon: 'ti ti-info-circle', + action: () => { detailRemoteEmoji(emoji); }, }, { text: i18n.ts.import, icon: 'ti ti-plus',