Merge pull request #469 from h3poteto/iss-461

closes #461 Add toot visibility setting and use it in new toot modal

src/constants/visibility.js

@@ -0,0 +1,18 @@
+export default {
+  Public: {
+    name: 'public',
+    value: 0
+  },
+  Unlisted: {
+    name: 'unlisted',
+    value: 1
+  },
+  Private: {
+    name: 'private',
+    value: 2
+  },
+  Direct: {
+    name: 'direct',
+    value: 3
+  }
+}

src/main/preferences.js

@@ -1,5 +1,6 @@
 import storage from 'electron-json-storage'
 import objectAssignDeep from 'object-assign-deep'
+import Visibility from '../constants/visibility'
 
 const Base = {
   general: {
@@ -9,7 +10,8 @@ const Base = {
     },
     theme: 'white',
     fontSize: 14,
-    displayNameStyle: 0
+    displayNameStyle: 0,
+    tootVisibility: Visibility.Public.value
   },
   state: {
     collapse: false

src/renderer/components/Preferences/General.vue

@@ -34,6 +34,26 @@
       </tbody>
     </table>
   </div>
+  <div class="toot">
+    <h3>Toot</h3>
+    <table>
+      <tbody>
+        <tr>
+          <td class="title">Default Visibility:</td>
+          <td class="status">
+            <el-select v-model="tootVisibility" placeholder="visibility">
+              <el-option
+                v-for="v in visibilities"
+                :key="v.value"
+                :label="v.name"
+                :value="v.value">
+              </el-option>
+            </el-select>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
   <div class="sounds">
     <h3>Sounds</h3>
     <table>
@@ -64,6 +84,7 @@
 
 <script>
 import { mapState } from 'vuex'
+import Visibility from '../../../constants/visibility'
 
 export default {
   name: 'general',
@@ -82,6 +103,11 @@ export default {
           name: 'username',
           value: 2
         }
+      ],
+      visibilities: [
+        Visibility.Public,
+        Visibility.Unlisted,
+        Visibility.Private
       ]
     }
   },
@@ -106,6 +132,14 @@ export default {
         this.$store.dispatch('Preferences/General/updateDisplayNameStyle', value)
       }
     },
+    tootVisibility: {
+      get () {
+        return this.$store.state.Preferences.General.general.tootVisibility
+      },
+      set (value) {
+        this.$store.dispatch('Preferences/General/updateTootVisibility', value)
+      }
+    },
     sound_fav_rb: {
       get () {
         return this.$store.state.Preferences.General.general.sound.fav_rb
@@ -146,52 +180,40 @@ export default {
 
 <style lang="scss" scoped>
 #general {
+  table {
+    width: 100%;
+  }
+
+  td {
+    padding: 16px 0;
+  }
+
+  .title {
+    text-align: right;
+    width: 50%;
+  }
+
+  .status {
+    width: 50%;
+    text-align: center;
+  }
+
   .appearance {
     color: var(--theme-secondary-color);
     width: 100%;
     box-sizing: border-box;
+  }
 
-    table {
+  .toot {
-      width: 100%;
+    color: var(--theme-secondary-color);
-    }
+    width: 100%;
-
+    box-sizing: border-box;
-    td {
-      padding: 16px 0;
-    }
-
-    .title {
-      text-align: right;
-      width: 50%;
-    }
-
-    .status {
-      width: 50%;
-      text-align: center;
-    }
   }
 
   .sounds {
     color: var(--theme-secondary-color);
     width: 100%;
     box-sizing: border-box;
-
-    table {
-      width: 100%;
-    }
-
-    td {
-      padding: 16px 0;
-    }
-
-    .title {
-      text-align: right;
-      width: 50%;
-    }
-
-    .status {
-      width: 50%;
-      text-align: center;
-    }
   }
 }
 </style>

src/renderer/components/TimelineSpace/Modals/NewToot.vue

@@ -55,6 +55,7 @@
 
 <script>
 import { mapState } from 'vuex'
+import Visibility from '../../../../constants/visibility'
 
 export default {
   name: 'new-toot',
@@ -79,13 +80,13 @@ export default {
       sensitive: state => state.TimelineSpace.Modals.NewToot.sensitive,
       visibilityIcon: (state) => {
         switch (state.TimelineSpace.Modals.NewToot.visibility) {
-          case 'public':
+          case Visibility.Public.value:
             return 'globe'
-          case 'unlisted':
+          case Visibility.Unlisted.value:
             return 'unlock'
-          case 'private':
+          case Visibility.Private.value:
             return 'lock'
-          case 'direct':
+          case Visibility.Direct.value:
             return 'envelope'
           default:
             return 'globe'
@@ -146,9 +147,12 @@ export default {
           type: 'error'
         })
       }
+      const visibilityKey = Object.keys(Visibility).find((key) => {
+        return Visibility[key].value === this.visibility
+      })
       let form = {
         status: this.status,
-        visibility: this.visibility,
+        visibility: Visibility[visibilityKey].name,
         sensitive: this.sensitive,
         spoiler_text: this.spoiler
       }
@@ -209,7 +213,7 @@ export default {
       this.$store.commit('TimelineSpace/Modals/NewToot/removeMedia', media)
     },
     changeVisibility (level) {
-      this.$store.commit('TimelineSpace/Modals/NewToot/changeVisibility', level)
+      this.$store.dispatch('TimelineSpace/Modals/NewToot/changeVisibility', level)
     },
     changeSensitive () {
       this.$store.commit('TimelineSpace/Modals/NewToot/changeSensitive', !this.sensitive)

src/renderer/store/Preferences/General.js

@@ -1,4 +1,5 @@
 import { ipcRenderer } from 'electron'
+import Visibility from '../../../constants/visibility'
 
 const General = {
   namespaced: true,
@@ -10,7 +11,8 @@ const General = {
       },
       theme: 'white',
       fontSize: 14,
-      displayNameStyle: 0
+      displayNameStyle: 0,
+      tootVisibility: Visibility.Public.value
     },
     loading: false
   },
@@ -94,6 +96,23 @@ const General = {
         commit('updateGeneral', conf.general)
       })
     },
+    updateTootVisibility ({ dispatch, commit, state }, value) {
+      const newGeneral = Object.assign({}, state.general, {
+        tootVisibility: value
+      })
+      const config = {
+        general: newGeneral
+      }
+      ipcRenderer.send('save-preferences', config)
+      ipcRenderer.once('error-save-preferences', (event, err) => {
+        ipcRenderer.removeAllListeners('response-save-preferences')
+      })
+      ipcRenderer.once('response-save-preferences', (event, conf) => {
+        ipcRenderer.removeAllListeners('error-save-preferences')
+        dispatch('App/loadPreferences', null, { root: true })
+        commit('updateGeneral', conf.general)
+      })
+    },
     updateSound ({ commit, state }, sound) {
       commit('changeLoading', true)
       const newSound = Object.assign({}, state.general.sound, sound)

src/renderer/store/TimelineSpace/Modals/NewToot.js

@@ -1,5 +1,6 @@
 import Mastodon from 'megalodon'
 import { ipcRenderer } from 'electron'
+import Visibility from '../../../../constants/visibility'
 
 const NewToot = {
   namespaced: true,
@@ -9,7 +10,7 @@ const NewToot = {
     replyToMessage: null,
     blockSubmit: false,
     attachedMedias: [],
-    visibility: 'public',
+    visibility: Visibility.Public.value,
     sensitive: false,
     spoiler: '',
     attachedMediaId: 0
@@ -36,7 +37,22 @@ const NewToot = {
     removeMedia (state, media) {
       state.attachedMedias = state.attachedMedias.filter(m => m.id !== media.id)
     },
-    changeVisibility (state, value) {
+    /**
+     * changeVisibility
+     * Update visibility using Visibility constants
+     * @param state vuex state object
+     * @param visibility Visibility constants object
+     **/
+    changeVisibility (state, visibility) {
+      state.visibility = visibility.value
+    },
+    /**
+     * changeVisibilityValue
+     * Update visibility using direct value
+     * @param state vuex state object
+     * @param value visibility value
+     **/
+    changeVisibilityValue (state, value) {
       state.visibility = value
     },
     changeSensitive (state, value) {
@@ -64,17 +80,21 @@ const NewToot = {
           return res.data
         })
     },
-    openReply ({ commit, rootState }, message) {
+    openReply ({ dispatch, commit, rootState }, message) {
       commit('setReplyTo', message)
       const mentionAccounts = [message.account.acct].concat(message.mentions.map(a => a.acct))
         .filter((a, i, self) => self.indexOf(a) === i)
         .filter((a) => a !== rootState.TimelineSpace.account.username)
       commit('changeModal', true)
       commit('updateStatus', `${mentionAccounts.map(m => `@${m}`).join(' ')} `)
-      commit('changeVisibility', message.visibility)
+      dispatch('changeVisibility', message.visibility)
     },
-    openModal ({ commit }) {
+    openModal ({ dispatch, commit }) {
       commit('changeModal', true)
+      ipcRenderer.send('get-preferences')
+      ipcRenderer.once('response-get-preferences', (event, conf) => {
+        commit('changeVisibilityValue', conf.general.tootVisibility)
+      })
     },
     closeModal ({ commit }) {
       commit('changeModal', false)
@@ -84,7 +104,7 @@ const NewToot = {
       commit('clearAttachedMedias')
       commit('changeSensitive', false)
       commit('updateSpoiler', '')
-      commit('changeVisibility', 'public')
+      commit('changeVisibility', Visibility.Public)
     },
     uploadImage ({ state, commit, rootState }, image) {
       commit('changeBlockSubmit', true)
@@ -115,6 +135,18 @@ const NewToot = {
     },
     resetMediaId ({ commit }) {
       commit('updateMediaId', 0)
+    },
+    /**
+     * changeVisibility
+     * @param commit vuex commit object
+     * @param level visibility level string object
+     **/
+    changeVisibility ({ commit }, level) {
+      Object.keys(Visibility).map((key, index) => {
+        if (Visibility[key].name === level) {
+          commit('changeVisibility', Visibility[key])
+        }
+      })
     }
   }
 }