From 7378c4a9d8c8c48a8ecf043d7a8e27b0d013f335 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Thu, 15 Apr 2021 12:37:58 +0900
Subject: fix #7444

---
 src/client/components/mfm.ts | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

(limited to 'src/client/components')

diff --git a/src/client/components/mfm.ts b/src/client/components/mfm.ts
index b8e948a188..3b08c83c7f 100644
--- a/src/client/components/mfm.ts
+++ b/src/client/components/mfm.ts
@@ -58,10 +58,13 @@ export default defineComponent({
 					const text = token.props.text.replace(/(\r\n|\n|\r)/g, '\n');
 
 					if (!this.plain) {
-						const x = text.split('\n')
-							.map(t => t == '' ? [h('br')] : [t, h('br')]);
-						x[x.length - 1].pop();
-						return x;
+						const res = [];
+						for (const t of text.split('\n')) {
+							res.push(h('br'));
+							res.push(t);
+						}
+						res.shift();
+						return res;
 					} else {
 						return [text.replace(/\n/g, ' ')];
 					}
-- 
cgit v1.2.3-freya


From c2b3436770eef87b82626ca785449e38b9af5c8a Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Thu, 15 Apr 2021 20:26:02 +0900
Subject: better list rendering

---
 src/client/components/date-separated-list.vue | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

(limited to 'src/client/components')

diff --git a/src/client/components/date-separated-list.vue b/src/client/components/date-separated-list.vue
index 433655d6ed..833cdfc898 100644
--- a/src/client/components/date-separated-list.vue
+++ b/src/client/components/date-separated-list.vue
@@ -24,11 +24,9 @@ export default defineComponent({
 	methods: {
 		focus() {
 			this.$slots.default[0].elm.focus();
-		}
-	},
+		},
 
-	render() {
-		const getDateText = (time: string) => {
+		getDateText(time: string) {
 			const date = new Date(time).getDate();
 			const month = new Date(time).getMonth() + 1;
 			return this.$t('monthAndDay', {
@@ -36,9 +34,13 @@ export default defineComponent({
 				day: date.toString()
 			});
 		}
+	},
 
+	render() {
 		const noGap = [...document.querySelectorAll('._noGap_')].some(el => el.contains(this.$parent.$el));
 
+		if (this.items.length === 0) return;
+
 		return h(this.$store.state.animation ? TransitionGroup : 'div', this.$store.state.animation ? {
 			class: 'sqadhkmv' + (noGap ? ' _block' : ''),
 			name: 'list',
@@ -72,10 +74,10 @@ export default defineComponent({
 							class: 'icon',
 							icon: faAngleUp,
 						}),
-						getDateText(item.createdAt)
+						this.getDateText(item.createdAt)
 					]),
 					h('span', [
-						getDateText(this.items[i + 1].createdAt),
+						this.getDateText(this.items[i + 1].createdAt),
 						h(FontAwesomeIcon, {
 							class: 'icon',
 							icon: faAngleDown,
-- 
cgit v1.2.3-freya


From 05ba1d0fd458e92f63a2d979117e11ff7270267e Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Thu, 15 Apr 2021 20:55:54 +0900
Subject: fix style

---
 src/client/components/notifications.vue |  5 ++---
 src/client/pages/page.vue               |  6 ++----
 src/client/pages/timeline.vue           |  5 ++---
 src/client/style.scss                   | 10 ++++++----
 4 files changed, 12 insertions(+), 14 deletions(-)

(limited to 'src/client/components')

diff --git a/src/client/components/notifications.vue b/src/client/components/notifications.vue
index baafa86f4d..0891108d8b 100644
--- a/src/client/components/notifications.vue
+++ b/src/client/components/notifications.vue
@@ -1,7 +1,6 @@
 <template>
-<div class="mfcuwfyp _noGap_">
-	<div class="_magnet"></div>
-	<XList class="notifications" :items="items" v-slot="{ item: notification }">
+<div class="mfcuwfyp _noGap_ _magnetParent">
+	<XList class="notifications _magnetChild" :items="items" v-slot="{ item: notification }">
 		<XNote v-if="['reply', 'quote', 'mention'].includes(notification.type)" :note="notification.note" @update:note="noteUpdated(notification.note, $event)" :key="notification.id"/>
 		<XNotification v-else :notification="notification" :with-time="true" :full="true" class="_panel notification" :key="notification.id"/>
 	</XList>
diff --git a/src/client/pages/page.vue b/src/client/pages/page.vue
index 57bbeba6b2..6ff09e2b68 100644
--- a/src/client/pages/page.vue
+++ b/src/client/pages/page.vue
@@ -1,8 +1,6 @@
 <template>
-<div class="xcukqgmh _root" v-if="page" :key="page.id" v-size="{ max: [450] }">
-	<div class="_magnet"></div>
-
-	<div class="_block main">
+<div class="xcukqgmh _root _magnetParent" v-if="page" :key="page.id" v-size="{ max: [450] }">
+	<div class="_block _magnetChild main">
 		<!--
 		<div class="header">
 			<h1>{{ page.title }}</h1>
diff --git a/src/client/pages/timeline.vue b/src/client/pages/timeline.vue
index 1d92dbba81..0e0116465c 100644
--- a/src/client/pages/timeline.vue
+++ b/src/client/pages/timeline.vue
@@ -1,11 +1,10 @@
 <template>
-<div class="cmuxhskf _root" v-hotkey.global="keymap">
+<div class="cmuxhskf _root _magnetParent" v-hotkey.global="keymap">
 	<div class="new" v-if="queue > 0"><button class="_buttonPrimary" @click="top()">{{ $ts.newNoteRecived }}</button></div>
 
-	<div class="_magnet"></div>
 	<XTutorial v-if="$store.reactiveState.tutorial.value != -1" class="tutorial _block"/>
 	<XPostForm v-if="$store.reactiveState.showFixedPostForm.value" class="post-form _block" fixed/>
-	<div class="tabs _block">
+	<div class="tabs _block _magnetChild">
 		<div class="left">
 			<button class="_button tab" @click="() => { src = 'home'; saveSrc(); }" :class="{ active: src === 'home' }" v-tooltip="$ts._timelines.home"><Fa :icon="faHome"/></button>
 			<button class="_button tab" @click="() => { src = 'local'; saveSrc(); }" :class="{ active: src === 'local' }" v-tooltip="$ts._timelines.local" v-if="isLocalTimelineAvailable"><Fa :icon="faComments"/></button>
diff --git a/src/client/style.scss b/src/client/style.scss
index e9c28f1827..63433109ff 100644
--- a/src/client/style.scss
+++ b/src/client/style.scss
@@ -366,10 +366,6 @@ hr {
 		border-radius: var(--radius);
 	}
 
-	._magnet {
-		margin-bottom: calc(var(--margin) * -1);
-	}	
-
 	@media (max-width: 500px) {
 		._root {
 			--root-margin: 0;
@@ -377,6 +373,12 @@ hr {
 	}
 }
 
+._magnetParent {
+	._magnetChild:not(* + ._magnetChild) {
+		margin-top: 0;
+	}
+}
+
 ._narrow_ ._card {
 	> ._title {
 		padding: 16px;
-- 
cgit v1.2.3-freya


From ef6b370d0e482e59b9a4747d543afa4b4a465367 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Fri, 16 Apr 2021 00:13:20 +0900
Subject: Improve usability

---
 locales/ja-JP.yml                   |  1 +
 src/client/components/post-form.vue | 48 ++++++++++++++++++++++++++++++++++++-
 2 files changed, 48 insertions(+), 1 deletion(-)

(limited to 'src/client/components')

diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 561e1ed2f8..741a5a6191 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -718,6 +718,7 @@ fullView: "フルビュー"
 quitFullView: "フルビュー解除"
 addDescription: "説明を追加"
 userPagePinTip: "個々のノートのメニューから「ピン留め」を選択することで、ここにノートを表示しておくことができます。"
+notSpecifiedMentionWarning: "宛先に含まれていないメンションがあります"
 
 _email:
   _follow:
diff --git a/src/client/components/post-form.vue b/src/client/components/post-form.vue
index ce79f34d62..4c6a9ebc95 100644
--- a/src/client/components/post-form.vue
+++ b/src/client/components/post-form.vue
@@ -34,6 +34,7 @@
 				<button @click="addVisibleUser" class="_buttonPrimary"><Fa :icon="faPlus" fixed-width/></button>
 			</div>
 		</div>
+		<MkInfo warn v-if="hasNotSpecifiedMentions" class="hasNotSpecifiedMentions">{{ $ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ $ts.add }}</button></MkInfo>
 		<input v-show="useCw" ref="cw" class="cw" v-model="cw" :placeholder="$ts.annotation" @keydown="onKeydown">
 		<textarea v-model="text" class="text" :class="{ withCw: useCw }" ref="text" :disabled="posting" :placeholder="placeholder" @keydown="onKeydown" @paste="onPaste" @compositionupdate="onCompositionUpdate" @compositionend="onCompositionEnd" />
 		<XPostFormAttaches class="attaches" :files="files" @updated="updateFiles" @detach="detachFile" @changeSensitive="updateFileSensitive" @changeName="updateFileName"/>
@@ -71,12 +72,14 @@ import { selectFile } from '@client/scripts/select-file';
 import { notePostInterruptors, postFormActions } from '@client/store';
 import { isMobile } from '@client/scripts/is-mobile';
 import { throttle } from 'throttle-debounce';
+import MkInfo from '@client/components/ui/info.vue';
 
 export default defineComponent({
 	components: {
 		XNotePreview,
 		XPostFormAttaches: defineAsyncComponent(() => import('./post-form-attaches.vue')),
-		XPollEditor: defineAsyncComponent(() => import('./poll-editor.vue'))
+		XPollEditor: defineAsyncComponent(() => import('./poll-editor.vue')),
+		MkInfo,
 	},
 
 	inject: ['modal'],
@@ -143,6 +146,7 @@ export default defineComponent({
 			autocomplete: null,
 			draghover: false,
 			quoteId: null,
+			hasNotSpecifiedMentions: false,
 			recentHashtags: JSON.parse(localStorage.getItem('hashtags') || '[]'),
 			imeText: '',
 			typing: throttle(3000, () => {
@@ -214,6 +218,18 @@ export default defineComponent({
 		}
 	},
 
+	watch: {
+		text() {
+			this.checkMissingMention();
+		},
+		visibleUsers: {
+			handler() {
+				this.checkMissingMention();
+			},
+			deep: true
+		}
+	},
+
 	mounted() {
 		if (this.initialText) {
 			this.text = this.initialText;
@@ -338,6 +354,32 @@ export default defineComponent({
 			this.$watch('localOnly', () => this.saveDraft());
 		},
 
+		checkMissingMention() {
+			if (this.visibility === 'specified') {
+				const ast = mfm.parse(this.text);
+
+				for (const x of extractMentions(ast)) {
+					if (!this.visibleUsers.some(u => (u.username === x.username) && (u.host == x.host))) {
+						this.hasNotSpecifiedMentions = true;
+						return;
+					}
+				}
+				this.hasNotSpecifiedMentions = false;
+			}
+		},
+
+		addMissingMention() {
+			const ast = mfm.parse(this.text);
+
+			for (const x of extractMentions(ast)) {
+				if (!this.visibleUsers.some(u => (u.username === x.username) && (u.host == x.host))) {
+					os.api('users/show', { username: x.username, host: x.host }).then(user => {
+						this.visibleUsers.push(user);
+					});
+				}
+			}
+		},
+
 		togglePoll() {
 			if (this.poll) {
 				this.poll = null;
@@ -741,6 +783,10 @@ export default defineComponent({
 			}
 		}
 
+		> .hasNotSpecifiedMentions {
+			margin: 0 20px 16px 20px;
+		}
+
 		> .cw,
 		> .text {
 			display: block;
-- 
cgit v1.2.3-freya