From 54ad905059c95ea68e1ea3f09ca8dcd410f6681c Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Sat, 23 May 2020 22:03:30 +0900
Subject: [PATCH 1/2] refs #1451 Update megalodon version to 3.2.2

---
 package-lock.json | 22 ++++++++++++++--------
 package.json      |  2 +-
 2 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index d631de01..dcf975a9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -20017,9 +20017,9 @@
       "dev": true
     },
     "megalodon": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/megalodon/-/megalodon-3.2.1.tgz",
-      "integrity": "sha512-hAzzg99pkrAkT1Ky56rWXbBFVACKcgziQZ4HcxqrQeyH7FPKz/p35pByVP/1jxSRIkpQKLHqrFAEdGWRxmCB/w==",
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/megalodon/-/megalodon-3.2.2.tgz",
+      "integrity": "sha512-cdwswLbE4Vkss4W4vT8hZ/4RnDocP8oqVRBpQsPLsWLywAAmMhSBeFuYlrJLU3Sg2oPdyhCjGJz50UPVhfewtw==",
       "requires": {
         "@types/oauth": "^0.9.0",
         "@types/ws": "^7.2.0",
@@ -20028,15 +20028,20 @@
         "moment": "^2.24.0",
         "oauth": "^0.9.15",
         "socks-proxy-agent": "^5.0.0",
-        "typescript": "3.8.3",
+        "typescript": "3.9.3",
         "uuid": "^8.0.0",
         "ws": "^7.2.1"
       },
       "dependencies": {
+        "typescript": {
+          "version": "3.9.3",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.3.tgz",
+          "integrity": "sha512-D/wqnB2xzNFIcoBG9FG8cXRDjiqSTbG2wd8DMZeQyJlP1vfTkIxH4GKveWaEBYySKIg+USu+E+EDIR47SqnaMQ=="
+        },
         "uuid": {
-          "version": "8.0.0",
-          "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.0.0.tgz",
-          "integrity": "sha512-jOXGuXZAWdsTH7eZLtyXMqUb9EcWMGZNbL9YcGBJl4MH4nrxHmZJhEHvyLFrkxo+28uLb/NYRcStH48fnD0Vzw=="
+          "version": "8.1.0",
+          "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.1.0.tgz",
+          "integrity": "sha512-CI18flHDznR0lq54xBycOVmphdCYnQLKn8abKn7PXUiKUGdEd+/l9LWNJmugXel4hXq7S+RMNl34ecyC9TntWg=="
         }
       }
     },
@@ -27656,7 +27661,8 @@
     "typescript": {
       "version": "3.8.3",
       "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.8.3.tgz",
-      "integrity": "sha512-MYlEfn5VrLNsgudQTVJeNaQFUAI7DkhnOjdpAp4T+ku1TfQClewlbSuTVHiA+8skNBgaf02TL/kLOvig4y3G8w=="
+      "integrity": "sha512-MYlEfn5VrLNsgudQTVJeNaQFUAI7DkhnOjdpAp4T+ku1TfQClewlbSuTVHiA+8skNBgaf02TL/kLOvig4y3G8w==",
+      "dev": true
     },
     "uglify-js": {
       "version": "3.4.9",
diff --git a/package.json b/package.json
index 520f7db5..be07db5d 100644
--- a/package.json
+++ b/package.json
@@ -184,7 +184,7 @@
     "hoek": "^6.1.3",
     "i18next": "^19.4.1",
     "lodash": "^4.17.15",
-    "megalodon": "3.2.1",
+    "megalodon": "3.2.2",
     "moment": "^2.24.0",
     "mousetrap": "^1.6.5",
     "nedb": "^1.8.0",

From ab13cd18920ea01fe0f474a6ad7d0bca05df43be Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Sat, 23 May 2020 22:41:17 +0900
Subject: [PATCH 2/2] refs #1451 Show quoted status notification in
 notification

---
 src/config/locales/en/translation.json        |   4 +
 src/main/index.ts                             |  18 +-
 .../components/organisms/Notification.vue     |  17 +-
 .../organisms/Notification/Quote.vue          | 479 ++++++++++++++++++
 4 files changed, 511 insertions(+), 7 deletions(-)
 create mode 100644 src/renderer/components/organisms/Notification/Quote.vue

diff --git a/src/config/locales/en/translation.json b/src/config/locales/en/translation.json
index ef453ae5..e762b070 100644
--- a/src/config/locales/en/translation.json
+++ b/src/config/locales/en/translation.json
@@ -455,6 +455,10 @@
       "title": "Reblog",
       "body": "{{username}} boosted your status"
     },
+    "quote": {
+      "title": "Quote",
+      "body": "{{username}} quoted your status"
+    },
     "reaction": {
       "title": "Reaction",
       "body": "{{username}} reacted your status"
diff --git a/src/main/index.ts b/src/main/index.ts
index 370f7c70..f5bb5c3c 100644
--- a/src/main/index.ts
+++ b/src/main/index.ts
@@ -1435,11 +1435,19 @@ const createNotification = (notification: Entity.Notification, notifyConfig: Not
       break
     case 'reblog':
       if (notifyConfig.reblog) {
-        return {
-          title: i18next.t('notification.reblog.title'),
-          body: i18next.t('notification.reblog.body', { username: username(notification.account) }),
-          silent: false
-        } as NotificationConstructorOptions
+        if (notification.status && notification.status.quote) {
+          return {
+            title: i18next.t('notification.quote.title'),
+            body: i18next.t('notification.quote.body', { username: username(notification.account) }),
+            silent: false
+          } as NotificationConstructorOptions
+        } else {
+          return {
+            title: i18next.t('notification.reblog.title'),
+            body: i18next.t('notification.reblog.body', { username: username(notification.account) }),
+            silent: false
+          } as NotificationConstructorOptions
+        }
       }
       break
     case 'emoji_reaction':
diff --git a/src/renderer/components/organisms/Notification.vue b/src/renderer/components/organisms/Notification.vue
index 191e4aee..24d76350 100644
--- a/src/renderer/components/organisms/Notification.vue
+++ b/src/renderer/components/organisms/Notification.vue
@@ -37,8 +37,20 @@
       @select="$emit('selectNotification')"
     >
     </mention>
+    <quote
+      v-else-if="message.type === 'reblog' && message.status.quote"
+      :message="message"
+      :filter="filter"
+      :focused="focused"
+      :overlaid="overlaid"
+      @focusNext="$emit('focusNext')"
+      @focusPrev="$emit('focusPrev')"
+      @focusRight="$emit('focusRight')"
+      @select="$emit('selectNotification')"
+    >
+    </quote>
     <reblog
-      v-else-if="message.type === 'reblog'"
+      v-else-if="message.type === 'reblog' && !message.status.quote"
       :message="message"
       :filter="filter"
       :focused="focused"
@@ -68,6 +80,7 @@
 import Favourite from './Notification/Favourite'
 import Follow from './Notification/Follow'
 import Mention from './Notification/Mention'
+import Quote from './Notification/Quote'
 import Reblog from './Notification/Reblog'
 import Reaction from './Notification/Reaction'
 
@@ -91,7 +104,7 @@ export default {
       default: false
     }
   },
-  components: { Favourite, Follow, Mention, Reblog, Reaction },
+  components: { Favourite, Follow, Mention, Quote, Reblog, Reaction },
   methods: {
     updateToot(message) {
       return this.$emit('update', message)
diff --git a/src/renderer/components/organisms/Notification/Quote.vue b/src/renderer/components/organisms/Notification/Quote.vue
new file mode 100644
index 00000000..546315da
--- /dev/null
+++ b/src/renderer/components/organisms/Notification/Quote.vue
@@ -0,0 +1,479 @@
+<template>
+  <div
+    class="status"
+    tabIndex="0"
+    v-shortkey="shortcutEnabled ? { next: ['j'], prev: ['k'], right: ['l'], left: ['h'], open: ['o'], profile: ['p'] } : {}"
+    @shortkey="handleStatusControl"
+    ref="status"
+    @click="$emit('select')"
+    role="article"
+    aria-label="quoted toot"
+  >
+    <div v-show="filtered(message)" class="filtered">
+      Filtered
+    </div>
+    <div v-show="!filtered(message)" class="quoted">
+      <div class="action">
+        <div class="action-mark">
+          <icon name="retweet" scala="0.7"></icon>
+        </div>
+        <div class="action-detail">
+          <span class="bold" @click="openUser(message.account)"><bdi v-html="username(message.account)"></bdi></span
+          >{{ $t('notification.quote.body') }}
+        </div>
+        <div class="action-icon" role="presentation">
+          <FailoverImg :src="message.account.avatar" :alt="`Avatar of ${message.account.username}`" />
+        </div>
+      </div>
+      <div class="clearfix"></div>
+      <div class="target" v-on:dblclick="openDetail(message.status)">
+        <div class="icon" @click="openUser(message.status.account)" role="presentation">
+          <FailoverImg :src="message.status.account.avatar" :alt="`Avatar of ${message.status.account.username}`" />
+        </div>
+        <div class="detail">
+          <div class="toot-header">
+            <div class="user">
+              <span class="display-name">
+                <bdi v-html="username(message.status.account)"></bdi>
+              </span>
+            </div>
+            <div class="timestamp">
+              {{ parseDatetime(message.status.created_at) }}
+            </div>
+            <div class="clearfix"></div>
+          </div>
+          <div class="content-wrapper">
+            <div class="spoiler" v-show="spoilered(message.status)">
+              <span v-html="spoilerText(message.status)"></span>
+              <el-button
+                v-if="!isShowContent(message.status)"
+                plain
+                type="primary"
+                size="medium"
+                class="spoil-button"
+                @click="showContent = true"
+              >
+                {{ $t('cards.toot.show_more') }}
+              </el-button>
+              <el-button v-else plain type="primary" size="medium" class="spoil-button" @click="showContent = false">
+                {{ $t('cards.toot.hide') }}
+              </el-button>
+            </div>
+            <div
+              class="content"
+              v-show="isShowContent(message.status)"
+              v-html="status(message.status)"
+              @click.capture.prevent="tootClick"
+            ></div>
+          </div>
+          <div class="attachments">
+            <el-button
+              v-show="sensitive(message.status) && !isShowAttachments(message.status)"
+              class="show-sensitive"
+              type="info"
+              @click="showAttachments = true"
+            >
+              {{ $t('cards.toot.sensitive') }}
+            </el-button>
+            <div v-show="isShowAttachments(message.status)">
+              <el-button
+                v-show="sensitive(message.status) && isShowAttachments(message.status)"
+                class="hide-sensitive"
+                type="text"
+                @click="showAttachments = false"
+                :title="$t('cards.toot.hide')"
+              >
+                <icon name="eye" class="hide"></icon>
+              </el-button>
+              <div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments(message.status)">
+                <FailoverImg :src="media.preview_url" :title="media.description" :readExif="true" />
+                <el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag>
+                <el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag>
+              </div>
+            </div>
+            <div class="clearfix"></div>
+          </div>
+          <Quote
+            v-if="message.status.quote"
+            :icon="message.status.reblog.account.avatar"
+            :username="username(message.status.reblog.account)"
+            :accountName="''"
+            :body="message.status.reblog.content"
+            @select="openDetail(message.status.reblog)"
+          />
+          <LinkPreview
+            v-if="message.status.card && message.status.card.type === 'link'"
+            :icon="message.status.card.image"
+            :title="message.status.card.title"
+            :description="message.status.card.description"
+            :url="message.status.card.url"
+          />
+        </div>
+      </div>
+      <div class="clearfix"></div>
+    </div>
+    <div class="fill-line"></div>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import moment from 'moment'
+import { findAccount, findLink, findTag } from '~/src/renderer/utils/tootParser'
+import emojify from '~/src/renderer/utils/emojify'
+import TimeFormat from '~/src/constants/timeFormat'
+import FailoverImg from '~/src/renderer/components/atoms/FailoverImg'
+import LinkPreview from '~/src/renderer/components/molecules/Toot/LinkPreview'
+import Quote from '@/components/molecules/Toot/Quote'
+
+export default {
+  name: 'quote',
+  components: {
+    FailoverImg,
+    LinkPreview,
+    Quote
+  },
+  props: {
+    message: {
+      type: Object,
+      default: {}
+    },
+    filter: {
+      type: String,
+      default: ''
+    },
+    focused: {
+      type: Boolean,
+      default: false
+    },
+    overlaid: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      showContent: false,
+      showAttachments: false
+    }
+  },
+  computed: {
+    ...mapState({
+      timeFormat: state => state.App.timeFormat,
+      language: state => state.App.language
+    }),
+    shortcutEnabled: function () {
+      return this.focused && !this.overlaid
+    }
+  },
+  mounted() {
+    if (this.focused) {
+      this.$refs.status.focus()
+    }
+  },
+  watch: {
+    focused: function (newState, oldState) {
+      if (newState) {
+        this.$nextTick(function () {
+          this.$refs.status.focus()
+        })
+      } else if (oldState && !newState) {
+        this.$nextTick(function () {
+          this.$refs.status.blur()
+        })
+      }
+    }
+  },
+  methods: {
+    username(account) {
+      if (account.display_name !== '') {
+        return emojify(account.display_name, account.emojis)
+      } else {
+        return account.username
+      }
+    },
+    parseDatetime(datetime) {
+      switch (this.timeFormat) {
+        case TimeFormat.Absolute.value:
+          return moment(datetime).format('YYYY-MM-DD HH:mm:ss')
+        case TimeFormat.Relative.value:
+          moment.locale(this.language)
+          return moment(datetime).fromNow()
+      }
+    },
+    tootClick(e) {
+      const parsedTag = findTag(e.target, 'quoted')
+      if (parsedTag !== null) {
+        const tag = `/${this.$route.params.id}/hashtag/${parsedTag}`
+        this.$router.push({ path: tag })
+        return tag
+      }
+      const parsedAccount = findAccount(e.target, 'quoted')
+      if (parsedAccount !== null) {
+        this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
+        this.$store
+          .dispatch('TimelineSpace/Contents/SideBar/AccountProfile/searchAccount', parsedAccount)
+          .then(account => {
+            this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
+            this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
+          })
+          .catch(() => {
+            this.openLink(e)
+            this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', false)
+          })
+        return parsedAccount
+      }
+      this.openLink(e)
+    },
+    openLink(e) {
+      const link = findLink(e.target, 'quoted')
+      if (link !== null) {
+        return window.shell.openExternal(link)
+      }
+    },
+    openUser(account) {
+      this.$store.dispatch('TimelineSpace/Contents/SideBar/openAccountComponent')
+      this.$store.dispatch('TimelineSpace/Contents/SideBar/AccountProfile/changeAccount', account)
+      this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
+    },
+    openDetail(message) {
+      this.$store.dispatch('TimelineSpace/Contents/SideBar/openTootComponent')
+      this.$store.dispatch('TimelineSpace/Contents/SideBar/TootDetail/changeToot', message)
+      this.$store.commit('TimelineSpace/Contents/SideBar/changeOpenSideBar', true)
+    },
+    mediaAttachments(message) {
+      return message.media_attachments
+    },
+    filtered(message) {
+      return this.filter.length > 0 && message.status.content.search(this.filter) >= 0
+    },
+    spoilered(message) {
+      return message.spoiler_text.length > 0
+    },
+    isShowContent(message) {
+      return !this.spoilered(message) || this.showContent
+    },
+    sensitive(message) {
+      return message.sensitive && this.mediaAttachments(message).length > 0
+    },
+    isShowAttachments(message) {
+      return !this.sensitive(message) || this.showAttachments
+    },
+    status(message) {
+      return emojify(message.content, message.emojis)
+    },
+    spoilerText(message) {
+      return emojify(message.spoiler_text, message.emojis)
+    },
+    handleStatusControl(event) {
+      switch (event.srcKey) {
+        case 'next':
+          this.$emit('focusNext')
+          break
+        case 'prev':
+          this.$emit('focusPrev')
+          break
+        case 'right':
+          this.$emit('focusRight')
+          break
+        case 'left':
+          this.$emit('focusLeft')
+          break
+        case 'open':
+          this.openDetail(this.message.status)
+          break
+        case 'profile':
+          this.openUser(this.message.account)
+          break
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.bold {
+  font-weight: bold;
+}
+
+.quoted {
+  padding: 8px 0 0 16px;
+
+  .fa-icon {
+    font-size: 0.9em;
+    width: auto;
+    height: 1em;
+    max-width: 100%;
+    max-height: 100%;
+  }
+
+  .action {
+    margin-right: 8px;
+
+    .action-mark {
+      color: #409eff;
+      float: left;
+      width: 32px;
+      text-align: right;
+    }
+
+    .action-detail {
+      margin-left: 10px;
+      font-size: var(--base-font-size);
+      float: left;
+      max-width: 80%;
+
+      .bold /deep/ {
+        cursor: pointer;
+
+        .emojione {
+          max-width: 14px;
+          max-height: 14px;
+        }
+      }
+    }
+
+    .action-icon {
+      width: 100%;
+      text-align: right;
+
+      img {
+        width: 16px;
+        height: 16px;
+        border-radius: 2px;
+      }
+    }
+  }
+
+  .target {
+    .icon {
+      float: left;
+      width: 42px;
+      cursor: pointer;
+
+      img {
+        width: 32px;
+        height: 32px;
+        border-radius: 4px;
+      }
+    }
+
+    .detail {
+      margin: 8px 8px 0 42px;
+      color: #909399;
+
+      .content-wrapper /deep/ {
+        font-size: var(--base-font-size);
+        margin: 0;
+
+        .content {
+          font-size: var(--base-font-size);
+          word-wrap: break-word;
+        }
+
+        .emojione {
+          width: 20px;
+          height: 20px;
+        }
+      }
+
+      .toot-header {
+        height: 24px;
+
+        .user {
+          float: left;
+          font-size: var(--base-font-size);
+
+          .display-name /deep/ {
+            .emojione {
+              max-width: 14px;
+              max-height: 14px;
+            }
+          }
+        }
+
+        .timestamp {
+          font-size: var(--base-font-size);
+          text-align: right;
+          width: 100%;
+        }
+      }
+
+      .spoiler {
+        margin: 8px 0;
+
+        .spoil-button {
+          background-color: var(--theme-selected-background-color);
+          border-color: var(--theme-border-color);
+          padding: 2px 4px;
+        }
+      }
+
+      .attachments {
+        position: relative;
+        margin: 4px 0 8px;
+
+        .show-sensitive {
+          padding: 20px 32px;
+          margin-bottom: 4px;
+        }
+
+        .hide-sensitive {
+          position: absolute;
+          top: 2px;
+          left: 2px;
+          background-color: rgba(0, 0, 0, 0.5);
+          padding: 4px;
+
+          &:hover {
+            background-color: rgba(0, 0, 0, 0.9);
+          }
+        }
+
+        .media {
+          float: left;
+          margin-right: 8px;
+          width: 200px;
+          height: 200px;
+
+          img {
+            cursor: zoom-in;
+            object-fit: cover;
+            max-width: 200px;
+            max-height: 200px;
+            width: 100%;
+            height: 100%;
+            border-radius: 8px;
+          }
+
+          .media-label {
+            position: absolute;
+            bottom: 6px;
+            left: 4px;
+            color: #fff;
+            background: rgba(0, 0, 0, 0.5);
+          }
+        }
+      }
+    }
+  }
+}
+
+.filtered {
+  align-items: center;
+  display: flex;
+  height: 40px;
+  justify-content: center;
+}
+
+.status:focus {
+  background-color: var(--theme-selected-background-color);
+  outline: 0;
+}
+
+.fill-line {
+  height: 1px;
+  background-color: var(--theme-border-color);
+  margin: 4px 0 0;
+}
+</style>