From 378325a8a246619e467d38f67944f4ccfe4fbb61 Mon Sep 17 00:00:00 2001
From: tsukimi2 <shigotoganbatte4@gmail.com>
Date: Tue, 5 May 2020 22:14:31 +0800
Subject: [PATCH] =?UTF-8?q?Changed=20private=20message"=20button=20to=20us?=
 =?UTF-8?q?e=20<a=20href>=20to=20open=20Private=20Messa=E2=80=A6=20(#12010?=
 =?UTF-8?q?)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Changed private message" button to use <a href> to open Private Message page in same tab.

Changed private message" button to use <a href> to open Private Message page in same tab with normal mouse click, and open in a new tab with right mouse click mouse context menu.

* Use router-link and navigation guard as requested.

Change from <a href to router-link in profile.vue and use navigation guard to obtain selected user data from server instead of doing so in mount method as requested.

* Added habitica::dismiss-modal to hide members modal

* Suggestion from lint

* Use replace in router-link to as per suggestion

* Suggestion by lint

* Remove sendMessage function in profile.vue as suggested in PR review
---
 .../src/components/userMenu/profile.vue       | 30 ++++++++-----------
 website/client/src/pages/private-messages.vue | 22 +++++++++++++-
 2 files changed, 34 insertions(+), 18 deletions(-)

diff --git a/website/client/src/components/userMenu/profile.vue b/website/client/src/components/userMenu/profile.vue
index 52fd90b66e..e27d9a05c8 100644
--- a/website/client/src/components/userMenu/profile.vue
+++ b/website/client/src/components/userMenu/profile.vue
@@ -5,16 +5,20 @@
   >
     <div class="header">
       <div class="profile-actions">
-        <button
-          v-b-tooltip.hover.left="$t('sendMessage')"
-          class="btn btn-secondary message-icon"
-          @click="sendMessage()"
+        <router-link
+          :to="{ path: '/private-messages', query: { uuid: user._id } }"
+          replace
         >
-          <div
-            class="svg-icon message-icon"
-            v-html="icons.message"
-          ></div>
-        </button>
+          <button
+            v-b-tooltip.hover.left="$t('sendMessage')"
+            class="btn btn-secondary message-icon"
+          >
+            <div
+              class="svg-icon message-icon"
+              v-html="icons.message"
+            ></div>
+          </button>
+        </router-link>
         <button
           v-b-tooltip.hover.bottom="$t('sendGems')"
           class="btn btn-secondary gift-icon"
@@ -858,14 +862,6 @@ export default {
       this.selectedPage = page || 'profile';
       window.history.replaceState(null, null, '');
     },
-    sendMessage () {
-      this.$store.dispatch('user:newPrivateMessageTo', {
-        member: this.user,
-      });
-
-      this.$router.push('/private-messages');
-      this.$root.$emit('bv::hide::modal', 'profile');
-    },
     getProgressDisplay () {
       // let currentLoginDay = Content.loginIncentives[this.user.loginIncentives];
       // if (!currentLoginDay) return this.$t('checkinReceivedAllRewardsMessage');
diff --git a/website/client/src/pages/private-messages.vue b/website/client/src/pages/private-messages.vue
index 071b902f0b..0e5d0a6f3b 100644
--- a/website/client/src/pages/private-messages.vue
+++ b/website/client/src/pages/private-messages.vue
@@ -608,6 +608,23 @@ export default {
       MAX_MESSAGE_LENGTH: MAX_MESSAGE_LENGTH.toString(),
     };
   },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {
+      const data = vm.$store.state.privateMessageOptions;
+
+      if ((!data || (data && !data.userIdToMessage)) && vm.$route.query && vm.$route.query.uuid) {
+        vm.$store.dispatch('user:userLookup', { uuid: vm.$route.query.uuid }).then(res => {
+          if (res && res.data && res.data.data) {
+            vm.$store.dispatch('user:newPrivateMessageTo', {
+              member: res.data.data,
+            });
+          }
+        });
+      } else {
+        vm.hasPrivateMessageOptionsOnPageLoad = true;
+      }
+    });
+  },
   async mounted () {
     // notification click to refresh
     this.$root.$on(EVENTS.PM_REFRESH, async () => {
@@ -625,8 +642,11 @@ export default {
 
     await this.reload();
 
-    const data = this.$store.state.privateMessageOptions;
+    // close members modal if the Private Messages page is opened in an existing tab
+    this.$root.$emit('habitica::dismiss-modal', 'profile');
+    this.$root.$emit('habitica::dismiss-modal', 'members-modal');
 
+    const data = this.$store.state.privateMessageOptions;
     if (data && data.userIdToMessage) {
       this.initiatedConversation = {
         uuid: data.userIdToMessage,