diff --git a/CHANGELOG.md b/CHANGELOG.md
index b6fcbba1b5..cd8027b050 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -14,6 +14,9 @@
- Enhance: CWの注釈テキストが入力されていない場合, Postボタンを非アクティブに
- Enhance: CWを無効にした場合, 注釈テキストが最大入力文字数を超えていても投稿できるように
- Enhance: テーマ設定画面のデザインを改善
+- Enhance: 投稿フォームの設定メニューを改良
+ - 投稿フォームをリセットできるように
+ - 文字数カウントを復活
- Fix: テーマ切り替え時に一部の色が変わらない問題を修正
### Server
diff --git a/locales/index.d.ts b/locales/index.d.ts
index c9f67c8110..3b56563149 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -5346,6 +5346,10 @@ export interface Locale extends ILocale {
* 投稿フォーム
*/
"postForm": string;
+ /**
+ * 文字数
+ */
+ "textCount": string;
"_emojiPalette": {
/**
* パレット
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 605aab919d..ad96549160 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -1332,6 +1332,7 @@ preferenceSyncConflictChoiceCancel: "同期の有効化をキャンセル"
paste: "ペースト"
emojiPalette: "絵文字パレット"
postForm: "投稿フォーム"
+textCount: "文字数"
_emojiPalette:
palettes: "パレット"
diff --git a/packages/frontend/src/components/MkMenu.vue b/packages/frontend/src/components/MkMenu.vue
index aa53c19c33..954cfa58be 100644
--- a/packages/frontend/src/components/MkMenu.vue
+++ b/packages/frontend/src/components/MkMenu.vue
@@ -15,9 +15,6 @@ SPDX-License-Identifier: AGPL-3.0-only
@focusin.passive.stop="() => {}"
>
{}"
@contextmenu.self.prevent="() => {}"
>
-
-
-
- {{ item.text }}
+
+
+
+
+
+ {{ item.text }}
+
+
+
+
+
+
+
+
+ {{ item.text }}
+
+
+
+
+
+
+ {{ item.text }}
+
+
+
+
+
+
+
+
+
+
+
+ {{ i18n.ts.none }}
-
-
-
-
-
-
-
- {{ item.text }}
-
-
-
-
-
-
- {{ item.text }}
-
-
-
-
-
-
-
-
-
-
-
- {{ i18n.ts.none }}
-
+
+
@@ -429,7 +435,7 @@ onBeforeUnmount(() => {
.root {
&.center {
> .menu {
- > .item {
+ .item {
text-align: center;
}
}
@@ -439,7 +445,7 @@ onBeforeUnmount(() => {
> .menu {
min-width: 230px;
- > .item {
+ .item {
padding: 6px 20px;
font-size: 0.95em;
line-height: 24px;
@@ -452,36 +458,38 @@ onBeforeUnmount(() => {
margin: auto;
> .menu {
- padding: 12px 0 max(env(safe-area-inset-bottom, 0px), 12px) 0;
width: 100%;
border-radius: 24px;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
- > .item {
- font-size: 1em;
- padding: 12px 24px;
+ > .menuItems {
+ padding: 12px 0 max(env(safe-area-inset-bottom, 0px), 12px) 0;
- &::before {
- width: calc(100% - 24px);
- border-radius: 12px;
+ > .item {
+ font-size: 1em;
+ padding: 12px 24px;
+
+ &::before {
+ width: calc(100% - 24px);
+ border-radius: 12px;
+ }
+
+ > .icon {
+ margin-right: 14px;
+ width: 24px;
+ }
}
- > .icon {
- margin-right: 14px;
- width: 24px;
+ > .divider {
+ margin: 12px 0;
}
}
-
- > .divider {
- margin: 12px 0;
- }
}
}
}
.menu {
- padding: 8px 0;
box-sizing: border-box;
max-width: 100vw;
min-width: 200px;
@@ -493,6 +501,11 @@ onBeforeUnmount(() => {
}
}
+.menuItems {
+ padding: 8px 0;
+ box-sizing: border-box;
+}
+
.item {
display: flex;
align-items: center;
diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue
index d57300f647..e31c33149f 100644
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -20,7 +20,7 @@ SPDX-License-Identifier: AGPL-3.0-only
-
-
+
-
-
-
-
-
+
@@ -111,6 +107,7 @@ import { toASCII } from 'punycode.js';
import { host, url } from '@@/js/config.js';
import type { ShallowRef } from 'vue';
import type { PostFormProps } from '@/types/post-form.js';
+import type { MenuItem } from '@/types/menu.js';
import type { PollEditorModelValue } from '@/components/MkPollEditor.vue';
import MkNotePreview from '@/components/MkNotePreview.vue';
import XPostFormAttaches from '@/components/MkPostFormAttaches.vue';
@@ -171,6 +168,7 @@ const textareaEl = shallowRef
(null);
const cwInputEl = shallowRef(null);
const hashtagsInputEl = shallowRef(null);
const visibilityButton = shallowRef();
+const otherSettingsButton = shallowRef();
const posting = ref(false);
const posted = ref(false);
@@ -556,6 +554,47 @@ async function toggleReactionAcceptance() {
reactionAcceptance.value = select.result;
}
+//#region その他の設定メニューpopup
+function showOtherSettings() {
+ let reactionAcceptanceIcon = 'ti ti-icons';
+
+ if (reactionAcceptance.value === 'likeOnly') {
+ reactionAcceptanceIcon = 'ti ti-heart _love';
+ } else if (reactionAcceptance.value === 'likeOnlyForRemote') {
+ reactionAcceptanceIcon = 'ti ti-heart-plus';
+ }
+
+ const menuDef = [{
+ icon: reactionAcceptanceIcon,
+ text: i18n.ts.reactionAcceptance,
+ action: () => {
+ toggleReactionAcceptance();
+ },
+ }, { type: 'divider' }, {
+ icon: 'ti ti-trash',
+ text: i18n.ts.reset,
+ danger: true,
+ action: async () => {
+ if (props.mock) return;
+ const { canceled } = await os.confirm({
+ type: 'question',
+ text: i18n.ts.resetAreYouSure,
+ });
+ if (canceled) return;
+ clear();
+ },
+ }] satisfies MenuItem[];
+
+ const { dispose } = os.popup(defineAsyncComponent(() => import('@/components/MkPostFormOtherMenu.vue')), {
+ items: menuDef,
+ textLength: textLength.value,
+ src: otherSettingsButton.value,
+ }, {
+ closed: () => dispose(),
+ });
+}
+//#endregion
+
function pushVisibleUser(user: Misskey.entities.UserDetailed) {
if (!visibleUsers.value.some(u => u.username === user.username && u.host === user.host)) {
visibleUsers.value.push(user);
diff --git a/packages/frontend/src/components/MkPostFormOtherMenu.vue b/packages/frontend/src/components/MkPostFormOtherMenu.vue
new file mode 100644
index 0000000000..7b3e6625f1
--- /dev/null
+++ b/packages/frontend/src/components/MkPostFormOtherMenu.vue
@@ -0,0 +1,128 @@
+
+
+
+
+
+
+
+
{{ i18n.ts.textCount }}
+
+
+
{{ number(textLength) }} / {{ number(maxTextLength) }}
+
+
+
+
+
+
+
+
+
+
diff --git a/packages/frontend/src/filters/number.ts b/packages/frontend/src/filters/number.ts
index 10fb64deb4..479afd58d4 100644
--- a/packages/frontend/src/filters/number.ts
+++ b/packages/frontend/src/filters/number.ts
@@ -5,4 +5,4 @@
import { numberFormat } from '@@/js/intl-const.js';
-export default n => n == null ? 'N/A' : numberFormat.format(n);
+export default (n?: number) => n == null ? 'N/A' : numberFormat.format(n);
diff --git a/packages/frontend/src/style.scss b/packages/frontend/src/style.scss
index 43a97d49eb..c449b0e956 100644
--- a/packages/frontend/src/style.scss
+++ b/packages/frontend/src/style.scss
@@ -436,6 +436,10 @@ rt {
color: var(--MI_THEME-link);
}
+._love {
+ color: var(--MI_THEME-love);
+}
+
._caption {
font-size: 0.8em;
opacity: 0.7;