From 56c8ad9df37d6c1a697fb6cdbe7ccf56752b14c6 Mon Sep 17 00:00:00 2001
From: Satsuki Yanagi <17376330+u1-liquid@users.noreply.github.com>
Date: Sat, 20 Jul 2019 03:23:16 +0900
Subject: [PATCH] Improve usability of quote note by pasting url (#5196)

---
 src/client/app/common/scripts/post-form.ts    |  3 +-
 .../desktop/views/components/post-form.vue    | 34 +++++++++++--------
 .../app/mobile/views/components/post-form.vue | 13 +++++--
 3 files changed, 32 insertions(+), 18 deletions(-)

diff --git a/src/client/app/common/scripts/post-form.ts b/src/client/app/common/scripts/post-form.ts
index 7cf26f65bf..ff3fd0792b 100644
--- a/src/client/app/common/scripts/post-form.ts
+++ b/src/client/app/common/scripts/post-form.ts
@@ -328,6 +328,7 @@ export default (opts) => ({
 			this.text = '';
 			this.files = [];
 			this.poll = false;
+			this.quoteId = null;
 			this.$emit('change-attached-files', this.files);
 		},
 
@@ -357,7 +358,7 @@ export default (opts) => ({
 
 			const paste = e.clipboardData.getData('text');
 
-			if (paste.startsWith(url + '/notes/')) {
+			if (!this.renote && !this.quoteId && paste.startsWith(url + '/notes/')) {
 				e.preventDefault();
 
 				this.$root.dialog({
diff --git a/src/client/app/desktop/views/components/post-form.vue b/src/client/app/desktop/views/components/post-form.vue
index 39b7781a1c..5ce5eba730 100644
--- a/src/client/app/desktop/views/components/post-form.vue
+++ b/src/client/app/desktop/views/components/post-form.vue
@@ -6,18 +6,18 @@
 	@drop.stop="onDrop"
 >
 	<div class="content">
-		<div v-if="visibility == 'specified'" class="visibleUsers">
+		<div class="hashtags" v-if="recentHashtags.length > 0 && $store.state.settings.suggestRecentHashtags">
+			<b>{{ $t('@.post-form.recent-tags') }}:</b>
+			<a v-for="tag in recentHashtags.slice(0, 5)" @click="addTag(tag)" :title="$t('@.post-form.click-to-tagging')">#{{ tag }}</a>
+		</div>
+		<div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }} <a @click="quoteId = null">[x]</a></div>
+		<div v-if="visibility === 'specified'" class="visibleUsers">
 			<span v-for="u in visibleUsers">
 				<mk-user-name :user="u"/><a @click="removeVisibleUser(u)">[x]</a>
 			</span>
 			<a @click="addVisibleUser">{{ $t('@.post-form.add-visible-user') }}</a>
 		</div>
-		<div class="hashtags" v-if="recentHashtags.length > 0 && $store.state.settings.suggestRecentHashtags">
-			<b>{{ $t('@.post-form.recent-tags') }}:</b>
-			<a v-for="tag in recentHashtags.slice(0, 5)" @click="addTag(tag)" :title="$t('@.post-form.click-to-tagging')">#{{ tag }}</a>
-		</div>
-		<div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }}</div>
-		<div class="local-only" v-if="localOnly == true">{{ $t('@.post-form.local-only-message') }}</div>
+		<div class="local-only" v-if="localOnly === true">{{ $t('@.post-form.local-only-message') }}</div>
 		<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('@.post-form.cw-placeholder')" v-autocomplete="{ model: 'cw' }">
 		<div class="textarea">
 			<textarea :class="{ with: (files.length != 0 || poll) }"
@@ -190,14 +190,6 @@ export default Vue.extend({
 				border-radius 0 0 4px 4px
 				transition border-color .3s ease
 
-		> .visibleUsers
-			margin-bottom 8px
-			font-size 14px
-
-			> span
-				margin-right 16px
-				color var(--primary)
-
 		> .hashtags
 			margin 0 0 8px 0
 			overflow hidden
@@ -211,6 +203,18 @@ export default Vue.extend({
 				margin-right 8px
 				white-space nowrap
 
+		> .with-quote
+			margin 0 0 8px 0
+			color var(--primary)
+
+		> .visibleUsers
+			margin-bottom 8px
+			font-size 14px
+
+			> span
+				margin-right 16px
+				color var(--primary)
+
 		> .local-only
 			margin 0 0 8px 0
 			color var(--primary)
diff --git a/src/client/app/mobile/views/components/post-form.vue b/src/client/app/mobile/views/components/post-form.vue
index 495fa0cf2a..9828430446 100644
--- a/src/client/app/mobile/views/components/post-form.vue
+++ b/src/client/app/mobile/views/components/post-form.vue
@@ -17,16 +17,17 @@
 		<div class="form">
 			<mk-note-preview class="preview" v-if="reply" :note="reply"/>
 			<mk-note-preview class="preview" v-if="renote" :note="renote"/>
-			<div v-if="visibility == 'specified'" class="visibleUsers">
+			<div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }} <a @click="quoteId = null">[x]</a></div>
+			<div v-if="visibility === 'specified'" class="visibleUsers">
 				<span v-for="u in visibleUsers">
 					<mk-user-name :user="u"/>
 					<a @click="removeVisibleUser(u)">[x]</a>
 				</span>
 				<a @click="addVisibleUser">+{{ $t('@.post-form.add-visible-user') }}</a>
 			</div>
+			<div class="local-only" v-if="localOnly === true">{{ $t('@.post-form.local-only-message') }}</div>
 			<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('@.post-form.cw-placeholder')" v-autocomplete="{ model: 'cw' }">
 			<textarea v-model="text" ref="text" :disabled="posting" :placeholder="placeholder" v-autocomplete="{ model: 'text' }" @paste="onPaste"></textarea>
-			<div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }}</div>
 			<x-post-form-attaches class="attaches" :files="files"/>
 			<x-poll-editor v-if="poll" ref="poll" @destroyed="poll = false" @updated="onPollUpdate()"/>
 			<mk-uploader ref="uploader" @uploaded="attachMedia" @change="onChangeUploadings"/>
@@ -140,6 +141,10 @@ export default Vue.extend({
 			> .preview
 				padding 16px
 
+			> .with-quote
+				margin 0 0 8px 0
+				color var(--primary)
+
 			> .visibleUsers
 				margin 5px
 				font-size 14px
@@ -148,6 +153,10 @@ export default Vue.extend({
 					margin-right 16px
 					color var(--text)
 
+			> .local-only
+				margin 0 0 8px 0
+				color var(--primary)
+
 			> input
 				z-index 1