Merge pull request #617 from h3poteto/iss-610

closes #610 Pin hashtag in new toot
2018-09-19 22:36:07 +09:00 · 2018-09-19 22:36:07 +09:00 · 8181a11582
parent 1bde284a79 951ac2f511
commit 8181a11582
9 changed files with 85 additions and 21 deletions
--- a/src/config/locales/de/translation.json
+++ b/src/config/locales/de/translation.json
@ -147,7 +147,8 @@
      "add_image": "Bild hinzufügen",
      "change_visibility": "Sichtbarkeit ändern",
      "add_cw": "Inhalt hinzufügen Warnung",
-      "change_sensitive": "Ändern Sie empfindlich"
+      "change_sensitive": "Ändern Sie empfindlich",
+      "pined_hashtag": "Pin the hashtag"
    },
    "jump": {
      "jump_to": "Springe zu..."
--- a/src/config/locales/en/translation.json
+++ b/src/config/locales/en/translation.json
@ -152,7 +152,8 @@
      "add_image": "Add images",
      "change_visibility": "Change visibility",
      "add_cw": "Add contents warning",
-      "change_sensitive": "Change sensitive"
+      "change_sensitive": "Change sensitive",
+      "pined_hashtag": "Pin the hashtag"
    },
    "jump": {
      "jump_to": "Jump to..."
--- a/src/config/locales/fr/translation.json
+++ b/src/config/locales/fr/translation.json
@ -147,7 +147,8 @@
      "add_image": "Ajouter une image",
      "change_visibility": "Changer la visibilité",
      "add_cw": "Ajouter un avertissement de contenu",
-      "change_sensitive": "Changer sensible"
+      "change_sensitive": "Changer sensible",
+      "pined_hashtag": "Pin the hashtag"
    },
    "jump": {
      "jump_to": "Aller à..."
--- a/src/config/locales/ja/translation.json
+++ b/src/config/locales/ja/translation.json
@ -147,7 +147,8 @@
      "add_image": "画像を添付",
      "change_visibility": "プライバシー設定",
      "add_cw": "閲覧注意を追加",
-      "change_sensitive": "メディアの閲覧注意設定"
+      "change_sensitive": "メディアの閲覧注意設定",
+      "pined_hashtag": "ハッシュタグを固定する"
    },
    "jump": {
      "jump_to": "移動..."
--- a/src/config/locales/ko/translation.json
+++ b/src/config/locales/ko/translation.json
@ -152,7 +152,8 @@
      "add_image": "이미지 추가",
      "change_visibility": "공개 범위 변경",
      "add_cw": "경고 문구 추가",
-      "change_sensitive": "민감한 미디어 설정"
+      "change_sensitive": "민감한 미디어 설정",
+      "pined_hashtag": "Pin the hashtag"
    },
    "jump": {
      "jump_to": "이동"
--- a/src/config/locales/pl/translation.json
+++ b/src/config/locales/pl/translation.json
@ -147,7 +147,8 @@
      "add_image": "Dodaj obraz",
      "change_visibility": "Zmień widoczność",
      "add_cw": "Dodaj ostrzeżenie zawartości",
-      "change_sensitive": "Zmień wrażliwy"
+      "change_sensitive": "Zmień wrażliwy",
+      "pined_hashtag": "Pin the hashtag"
    },
    "jump": {
      "jump_to": "Przejdź do…"
--- a/src/renderer/components/TimelineSpace/Modals/NewToot.vue
+++ b/src/renderer/components/TimelineSpace/Modals/NewToot.vue
@ -12,6 +12,7 @@
      <Status
        v-model="status"
        :opened="newTootModal"
+        :fixCursorPos="hashtagInserting"
        @paste="onPaste"
        @toot="toot"
        />
@ -61,10 +62,15 @@
        </el-button>
      </div>
      <div class="content-warning">
-        <el-button size="small" type="text" @click="showContentWarning = !showContentWarning" :title="$t('modals.new_toot.add_cw')">
+        <el-button size="small" type="text" @click="showContentWarning = !showContentWarning" :title="$t('modals.new_toot.add_cw')" :class="showContentWarning? '' : 'clickable'">
          <span class="cw-text">CW</span>
        </el-button>
      </div>
+      <div class="pined-hashtag">
+        <el-button size="small" type="text" @click="pinedHashtag = !pinedHashtag" :title="$t('modals.new_toot.pined_hashtag')" :class="pinedHashtag? '' : 'clickable'">
+          <icon name="hashtag"></icon>
+        </el-button>
+      </div>
      <span class="text-count">{{ 500 - status.length }}</span>
      <el-button @click="closeConfirm(close)">{{ $t('modals.new_toot.cancel') }}</el-button>
      <el-button type="primary" @click="toot" v-loading="blockSubmit">{{ $t('modals.new_toot.toot') }}</el-button>
@ -74,7 +80,7 @@
 </template>

 <script>
-import { mapState } from 'vuex'
+import { mapState, mapGetters } from 'vuex'
 import { clipboard } from 'electron'
 import Visibility from '~/src/constants/visibility'
 import Status from './NewToot/Status'
@ -91,21 +97,21 @@ export default {
    }
  },
  computed: {
-    ...mapState({
+    ...mapState('TimelineSpace/Modals/NewToot', {
      replyToId: (state) => {
-        if (state.TimelineSpace.Modals.NewToot.replyToMessage !== null) {
-          return state.TimelineSpace.Modals.NewToot.replyToMessage.id
+        if (state.replyToMessage !== null) {
+          return state.replyToMessage.id
        } else {
          return null
        }
      },
-      attachedMedias: state => state.TimelineSpace.Modals.NewToot.attachedMedias,
-      attachedMediaId: state => state.TimelineSpace.Modals.NewToot.attachedMediaId,
-      blockSubmit: state => state.TimelineSpace.Modals.NewToot.blockSubmit,
-      visibility: state => state.TimelineSpace.Modals.NewToot.visibility,
-      sensitive: state => state.TimelineSpace.Modals.NewToot.sensitive,
+      attachedMedias: state => state.attachedMedias,
+      attachedMediaId: state => state.attachedMediaId,
+      blockSubmit: state => state.blockSubmit,
+      visibility: state => state.visibility,
+      sensitive: state => state.sensitive,
      visibilityIcon: (state) => {
-        switch (state.TimelineSpace.Modals.NewToot.visibility) {
+        switch (state.visibility) {
          case Visibility.Public.value:
            return 'globe'
          case Visibility.Unlisted.value:
@ -119,6 +125,9 @@ export default {
        }
      }
    }),
+    ...mapGetters('TimelineSpace/Modals/NewToot', [
+      'hashtagInserting'
+    ]),
    newTootModal: {
      get () {
        return this.$store.state.TimelineSpace.Modals.NewToot.modalOpen
@ -146,6 +155,14 @@ export default {
      set (value) {
        this.$store.commit('TimelineSpace/Modals/NewToot/updateSpoiler', value)
      }
+    },
+    pinedHashtag: {
+      get () {
+        return this.$store.state.TimelineSpace.Modals.NewToot.pinedHashtag
+      },
+      set (value) {
+        this.$store.commit('TimelineSpace/Modals/NewToot/changePinedHashtag', value)
+      }
    }
  },
  watch: {
@ -161,7 +178,7 @@ export default {
      this.$store.dispatch('TimelineSpace/Modals/NewToot/resetMediaId')
      this.$store.dispatch('TimelineSpace/Modals/NewToot/closeModal')
    },
-    toot () {
+    async toot () {
      if (!this.newTootModal) {
        return
      }
@ -197,13 +214,14 @@ export default {
        })
      }

-      this.$store.dispatch('TimelineSpace/Modals/NewToot/postToot', form)
+      const status = await this.$store.dispatch('TimelineSpace/Modals/NewToot/postToot', form)
        .catch(() => {
          this.$message({
            message: this.$t('message.toot_error'),
            type: 'error'
          })
        })
+      this.$store.dispatch('TimelineSpace/Modals/NewToot/updateHashtags', status.tags)
      this.close()
    },
    selectImage () {
@ -362,6 +380,15 @@ export default {
      }
    }

+    .pined-hashtag {
+      float: left;
+      margin-left: 8px;
+    }
+
+    .clickable {
+      color: #909399;
+    }
+
    .text-count {
      padding-right: 24px;
      color: #909399;
--- a/src/renderer/components/TimelineSpace/Modals/NewToot/Status.vue
+++ b/src/renderer/components/TimelineSpace/Modals/NewToot/Status.vue
@ -50,6 +50,10 @@ export default {
    opened: {
      type: Boolean,
      default: false
+    },
+    fixCursorPos: {
+      type: Boolean,
+      default: false
    }
  },
  data () {
@ -82,12 +86,18 @@ export default {
    // When change account, the new toot modal is recreated.
    // So can not catch open event in watch.
    this.$refs.status.focus()
+    if (this.fixCursorPos) {
+      this.$refs.status.setSelectionRange(0, 0)
+    }
  },
  watch: {
    opened: function (newState, oldState) {
      if (!oldState && newState) {
        this.$nextTick(function () {
          this.$refs.status.focus()
+          if (this.fixCursorPos) {
+            this.$refs.status.setSelectionRange(0, 0)
+          }
        })
      } else if (oldState && !newState) {
        this.closeSuggest()
--- a/src/renderer/store/TimelineSpace/Modals/NewToot.js
+++ b/src/renderer/store/TimelineSpace/Modals/NewToot.js
@ -17,7 +17,9 @@ const NewToot = {
    visibility: Visibility.Public.value,
    sensitive: false,
    spoiler: '',
-    attachedMediaId: 0
+    attachedMediaId: 0,
+    pinedHashtag: false,
+    hashtags: []
  },
  mutations: {
    changeModal (state, value) {
@ -58,6 +60,17 @@ const NewToot = {
    },
    updateMediaId (state, value) {
      state.attachedMediaId = value
+    },
+    changePinedHashtag (state, value) {
+      state.pinedHashtag = value
+    },
+    updateHashtags (state, tags) {
+      state.hashtags = tags
+    }
+  },
+  getters: {
+    hashtagInserting (state) {
+      return !state.replyToMessage && state.pinedHashtag
    }
  },
  actions: {
@ -91,8 +104,11 @@ const NewToot = {
      })
      commit('changeVisibilityValue', value)
    },
-    openModal ({ dispatch, commit, rootState }) {
+    openModal ({ dispatch, commit, state, rootState }) {
      commit('changeModal', true)
+      if (!state.replyToMessage && state.pinedHashtag) {
+        commit('updateStatus', state.hashtags.map(t => ` #${t.name}`).join())
+      }
      commit('changeVisibilityValue', rootState.App.tootVisibility)
    },
    closeModal ({ commit }) {
@ -134,6 +150,11 @@ const NewToot = {
    },
    resetMediaId ({ commit }) {
      commit('updateMediaId', 0)
+    },
+    updateHashtags ({ commit, state }, tags) {
+      if (state.pinedHashtag) {
+        commit('updateHashtags', tags)
+      }
    }
  }
 }