From c5fbb2fae8b914c1f06ff1f97f795a41bde1faa7 Mon Sep 17 00:00:00 2001
From: taiy <53635909+taiyme@users.noreply.github.com>
Date: Tue, 13 Aug 2024 01:28:16 +0900
Subject: [PATCH] =?UTF-8?q?enhance(frontend):=20=E3=83=A1=E3=83=A2?=
 =?UTF-8?q?=E3=83=BB=E3=83=A2=E3=83=87=E3=83=AC=E3=83=BC=E3=82=B7=E3=83=A7?=
 =?UTF-8?q?=E3=83=B3=E3=83=8E=E3=83=BC=E3=83=88=E3=81=8C=E5=85=B1=E6=9C=89?=
 =?UTF-8?q?=E3=81=95=E3=82=8C=E3=82=8B=E3=81=8B=E3=81=A9=E3=81=86=E3=81=8B?=
 =?UTF-8?q?=E3=82=92=E6=98=8E=E8=A8=98=E3=81=99=E3=82=8B=20(#244)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 locales/index.d.ts                            |  8 +++++
 locales/ja-JP.yml                             |  2 ++
 .../src/components/TmsUserMemo.input.vue      | 29 +++++++++++++++++--
 .../frontend/src/components/TmsUserMemo.vue   |  4 ++-
 4 files changed, 39 insertions(+), 4 deletions(-)

diff --git a/locales/index.d.ts b/locales/index.d.ts
index 0e70aa8dec4e..325f5f1c41b4 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -10281,6 +10281,14 @@ export interface Locale extends ILocale {
          * まだ提供されていません
          */
         readonly "notYetProvided": string;
+        /**
+         * モデレーションノートはモデレーター間で共有されます。
+         */
+        readonly "moderationNoteIsSharedAmongModerators": string;
+        /**
+         * あなたのメモは他のユーザーと共有されません。
+         */
+        readonly "memoIsNotShared": string;
         readonly "_about": {
             /**
              * taiymeについて
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 5809e6d8e6db..bd84c0175789 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -2741,6 +2741,8 @@ _tms:
   resolvedBy: "{user}によって解決済み"
   forwardedReport: "リモートサーバーに転送済み"
   notYetProvided: "まだ提供されていません"
+  moderationNoteIsSharedAmongModerators: "モデレーションノートはモデレーター間で共有されます。"
+  memoIsNotShared: "あなたのメモは他のユーザーと共有されません。"
   _about:
     title: "taiymeについて"
     description: "taiymeは、Misskeyから派生したオープンソースのソフトウェアです。"
diff --git a/packages/frontend/src/components/TmsUserMemo.input.vue b/packages/frontend/src/components/TmsUserMemo.input.vue
index 1230b898ecee..7af626981251 100644
--- a/packages/frontend/src/components/TmsUserMemo.input.vue
+++ b/packages/frontend/src/components/TmsUserMemo.input.vue
@@ -4,7 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<div class="_gaps_s">
+<div>
 	<div :class="$style.textarea" @click="focus">
 		<div :class="$style.heading"><slot name="heading"></slot></div>
 		<textarea
@@ -15,8 +15,9 @@ SPDX-License-Identifier: AGPL-3.0-only
 			@input="adjustInputEl"
 		/>
 	</div>
-	<div v-if="changed" class="_buttons">
-		<MkButton small primary @click="update"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
+	<div v-if="changed" :class="$style.footer">
+		<div :class="$style.caption"><slot name="caption"></slot></div>
+		<MkButton small primary :class="$style.save" @click="update"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
 	</div>
 </div>
 </template>
@@ -100,4 +101,26 @@ defineExpose({
 	background: transparent;
 	font-family: inherit;
 }
+
+.footer {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	flex-wrap: wrap;
+	gap: 4px;
+	padding: 6px 0 0 0;
+}
+
+.caption {
+	font-size: 0.85em;
+	color: var(--fgTransparentWeak);
+
+	&:empty {
+		display: none;
+	}
+}
+
+.save {
+	margin-left: auto;
+}
 </style>
diff --git a/packages/frontend/src/components/TmsUserMemo.vue b/packages/frontend/src/components/TmsUserMemo.vue
index 53a794a92b4a..aa0213a398a7 100644
--- a/packages/frontend/src/components/TmsUserMemo.vue
+++ b/packages/frontend/src/components/TmsUserMemo.vue
@@ -7,16 +7,18 @@ SPDX-License-Identifier: AGPL-3.0-only
 <div v-if="$i != null" class="_gaps_s">
 	<XMemoInput v-if="iAmModerator" v-model="moderationNote" @update:modelValue="updateModerationNote">
 		<template #heading>{{ i18n.ts.moderationNote }}</template>
+		<template #caption>{{ i18n.ts._tms.moderationNoteIsSharedAmongModerators }}</template>
 	</XMemoInput>
 	<XMemoInput v-model="userMemo" @update:modelValue="updateUserMemo">
 		<template #heading>{{ i18n.ts.memo }}</template>
+		<template #caption>{{ i18n.ts._tms.memoIsNotShared }}</template>
 	</XMemoInput>
 </div>
 </template>
 
 <script lang="ts" setup>
 import { defineAsyncComponent, ref } from 'vue';
-import * as Misskey from 'misskey-js';
+import type * as Misskey from 'misskey-js';
 import { $i, iAmModerator } from '@/account.js';
 import { i18n } from '@/i18n.js';
 import { apiWithDialog } from '@/os.js';