refactor

routes/_actions/instances.js

@@ -33,8 +33,7 @@ export async function logOutOfInstance (instanceName) {
   let loggedInInstances = store.get('loggedInInstances')
   let instanceThemes = store.get('instanceThemes')
   let loggedInInstancesInOrder = store.get('loggedInInstancesInOrder')
-  let composeText = store.get('composeText')
+  let composeData = store.get('composeData')
-  let uploadedMedia = store.get('uploadedMedia')
   let currentInstance = store.get('currentInstance')
   loggedInInstancesInOrder.splice(loggedInInstancesInOrder.indexOf(instanceName), 1)
   let newInstance = instanceName === currentInstance
@@ -42,8 +41,7 @@ export async function logOutOfInstance (instanceName) {
     : currentInstance
   delete loggedInInstances[instanceName]
   delete instanceThemes[instanceName]
-  delete composeText[instanceName]
+  delete composeData[instanceName]
-  delete uploadedMedia[instanceName]
   store.set({
     loggedInInstances: loggedInInstances,
     instanceThemes: instanceThemes,
@@ -52,8 +50,7 @@ export async function logOutOfInstance (instanceName) {
     searchResults: null,
     queryInSearch: '',
     rawComposeText: '',
-    composeText: composeText,
+    composeData: composeData
-    uploadedMedia: uploadedMedia
   })
   store.save()
   toast.say(`Logged out of ${instanceName}`)

routes/_actions/media.js

@@ -9,21 +9,15 @@ export async function doMediaUpload (realm, file) {
   store.set({uploadingMedia: true})
   try {
     let response = await uploadMedia(instanceName, accessToken, file)
-    let uploadedMedia = store.get('uploadedMedia')
+    let composeMedia = store.getComposeData(realm, 'media') || []
-    uploadedMedia[instanceName] = uploadedMedia[instanceName] || {}
+    composeMedia.push({
-    uploadedMedia[instanceName][realm] = uploadedMedia[instanceName][realm] || []
-    uploadedMedia[instanceName][realm].push({
       data: response,
-      file: {
+      file: { name: file.name }
-        name: file.name
-      }
     })
     let rawComposeText = store.get('rawComposeText') || ''
     rawComposeText += ' ' + response.text_url
-    store.set({
+    store.setComposeData(realm, 'media', composeMedia)
-      uploadedMedia,
+    store.set({rawComposeText})
-      rawComposeText
-    })
     scheduleIdleTask(() => store.save())
   } catch (e) {
     console.error(e)
@@ -34,18 +28,14 @@ export async function doMediaUpload (realm, file) {
 }
 
 export function deleteMedia (realm, i) {
-  let uploadedMedia = store.get('uploadedMedia')
+  let composeMedia = store.getComposeData(realm, 'media')
-  let instanceName = store.get('currentInstance')
+  let deletedMedia = composeMedia.splice(i, 1)[0]
-  let uploadedMediaArray = uploadedMedia[instanceName][realm]
-  let deletedMedia = uploadedMediaArray.splice(i, 1)[0]
 
   let rawComposeText = store.get('rawComposeText') || ''
 
   rawComposeText = rawComposeText.replace(' ' + deletedMedia.data.text_url, '')
 
-  store.set({
+  store.setComposeData(realm, 'media', composeMedia)
-    uploadedMedia,
+  store.set({rawComposeText})
-    rawComposeText
-  })
   scheduleIdleTask(() => store.save())
 }

routes/_actions/postPrivacy.js

@@ -0,0 +1,6 @@
+
+import { store } from '../_store/store'
+
+export function setPostPrivacy (realm, postPrivacyKey) {
+  store.setComposeData(realm, 'postPrivacy', postPrivacyKey)
+}

routes/_components/compose/ComposeInput.html

@@ -41,22 +41,17 @@
     },
     methods: {
       setupSyncFromStore() {
-        let currentComposeText = store.get('currentComposeText')
+        let composeText = this.get('composeText')
-        let realm = this.get('realm')
         this.store.set({
-          rawComposeText: currentComposeText[realm] || ''
+          rawComposeText: composeText
         })
       },
       setupSyncToStore() {
         const saveText = debounce(() => scheduleIdleTask(() => this.store.save()), 1000)
 
         this.observe('rawComposeText', rawComposeText => {
-          let composeText = this.store.get('composeText')
-          let currentInstance = this.store.get('currentInstance')
           let realm = this.get('realm')
-          composeText[currentInstance] = composeText[currentInstance] || {}
+          this.store.setComposeData(realm, 'text', rawComposeText)
-          composeText[currentInstance][realm] = rawComposeText || ''
-          this.store.set({composeText: composeText})
           saveText()
         }, {init: false})
       },
@@ -79,8 +74,8 @@
     store: () => store,
     computed: {
       rawComposeText: ($rawComposeText) => $rawComposeText,
-      currentComposeText: ($currentComposeText) => $currentComposeText,
+      composeData: ($currentComposeData, realm) => $currentComposeData[realm] || {},
-      uploadedMedia: ($currentUploadedMedia, realm) => $currentUploadedMedia[realm] || []
+      composeText: (composeData) => composeData.text || ''
     }
   }
 </script>

routes/_components/compose/ComposeMedia.html

@@ -1,6 +1,6 @@
-{{#if uploadedMedia.length}}
+{{#if composeMedia.length}}
-  <div class="compose-media-container" style="grid-template-columns: repeat({{uploadedMedia.length}}, 1fr);">
+  <div class="compose-media-container" style="grid-template-columns: repeat({{composeMedia.length}}, 1fr);">
-    {{#each uploadedMedia as media, i}}
+    {{#each composeMedia as media, i}}
       <div class="compose-media">
         <img src="{{media.data.preview_url}}" alt="{{media.file.name}}"/>
         <div class="compose-media-delete">
@@ -100,7 +100,8 @@
       }
     },
     computed: {
-      uploadedMedia: ($currentUploadedMedia, realm) => $currentUploadedMedia[realm] || []
+      composeData: ($currentComposeData, realm) => $currentComposeData[realm] || {},
+      composeMedia: (composeData) => composeData.media || []
     }
   }
 </script>

routes/_components/compose/ComposeToolbar.html

@@ -9,7 +9,7 @@
     label="Add media"
     href="{{$uploadingMedia ? '#fa-spinner' : '#fa-camera'}}"
     on:click="onMediaClick()"
-    disabled="{{$uploadingMedia || (uploadedMedia.length === 4)}}"
+    disabled="{{$uploadingMedia || (composeMedia.length === 4)}}"
   />
   <IconButton
     label="Adjust privacy (currently {{postPrivacy.label}})"
@@ -78,12 +78,13 @@
       }
     },
     computed: {
-      uploadedMedia: ($currentUploadedMedia, realm) => $currentUploadedMedia[realm] || [],
+      composeData: ($currentComposeData, realm) => $currentComposeData[realm] || {},
+      composeMedia: (composeData) => composeData.media || [],
       postPrivacy: (postPrivacyKey) => {
         return POST_PRIVACY_OPTIONS.find(_ => _.key === postPrivacyKey)
       },
-      postPrivacyKey: ($currentPostPrivacy, $currentVerifyCredentials, realm) => {
+      postPrivacyKey: (composeData, $currentVerifyCredentials) => {
-        return $currentPostPrivacy[realm] || $currentVerifyCredentials.source.privacy
+        return composeData.postPrivacy || $currentVerifyCredentials.source.privacy
       }
     }
   }

routes/_components/dialog/PostPrivacyDialog.html

@@ -60,6 +60,7 @@
   import ModalDialog from './ModalDialog.html'
   import { store } from '../../_store/store'
   import { POST_PRIVACY_OPTIONS } from '../../_static/statuses'
+  import { setPostPrivacy } from '../../_actions/postPrivacy'
 
   export default {
     components: {
@@ -77,21 +78,17 @@
         this.set({shown: true})
       },
       onClick(option) {
-        let postPrivacy = store.get('postPrivacy')
+        setPostPrivacy(this.get('realm'), option.key)
-        let instanceName = store.get('currentInstance')
-        let realm = this.get('realm')
-        postPrivacy[instanceName] = postPrivacy[instanceName] || {}
-        postPrivacy[instanceName][realm] = option.key
-        store.set({postPrivacy})
         this.set({closed: true})
       }
     },
     computed: {
+      composeData: ($currentComposeData, realm) => $currentComposeData[realm] || {},
       postPrivacy: (postPrivacyKey) => {
         return POST_PRIVACY_OPTIONS.find(_ => _.key === postPrivacyKey)
       },
-      postPrivacyKey: ($currentPostPrivacy, $currentVerifyCredentials, realm) => {
+      postPrivacyKey: (composeData, $currentVerifyCredentials) => {
-        return $currentPostPrivacy[realm] || $currentVerifyCredentials.source.privacy
+        return composeData.postPrivacy || $currentVerifyCredentials.source.privacy
       }
     }
   }

routes/_store/computations/instanceComputations.js

@@ -11,10 +11,8 @@ export function instanceComputations (store) {
   computeForInstance(store, 'pinnedPage', 'pinnedPages', '/local')
   computeForInstance(store, 'lists', 'instanceLists', [])
   computeForInstance(store, 'currentStatusModifications', 'statusModifications', null)
-  computeForInstance(store, 'currentComposeText', 'composeText', {})
-  computeForInstance(store, 'currentUploadedMedia', 'uploadedMedia', {})
   computeForInstance(store, 'currentCustomEmoji', 'customEmoji', [])
-  computeForInstance(store, 'currentPostPrivacy', 'postPrivacy', {})
+  computeForInstance(store, 'currentComposeData', 'composeData', {})
 
   store.compute(
     'isUserLoggedIn',

routes/_store/computations/statusComputations.js

@@ -1,5 +1,5 @@
-import { CHAR_LIMIT } from '../_static/statuses'
+import { CHAR_LIMIT } from '../../_static/statuses'
-import { measureText } from '../_utils/measureText'
+import { measureText } from '../../_utils/measureText'
 
 export function statusComputations (store) {
   store.compute('rawComposeTextLength',

routes/_store/mixins/instanceMixins.js

@@ -0,0 +1,18 @@
+export function instanceMixins (Store) {
+  Store.prototype.setComposeData = function (realm, key, value) {
+    let composeData = this.get('composeData')
+    let instanceName = this.get('currentInstance')
+    composeData[instanceName] = composeData[instanceName] || {}
+    composeData[instanceName][realm] = composeData[instanceName][realm] || {}
+    composeData[instanceName][realm][key] = value
+    this.set({composeData})
+  }
+
+  Store.prototype.getComposeData = function (realm, key) {
+    let composeData = this.get('composeData')
+    let instanceName = this.get('currentInstance')
+    return composeData[instanceName] &&
+      composeData[instanceName][realm] &&
+      composeData[instanceName][realm][key]
+  }
+}

routes/_store/mixins/mixins.js

@@ -0,0 +1,7 @@
+import { timelineMixins } from './timelineMixins'
+import { instanceMixins } from './instanceMixins'
+
+export function mixins (Store) {
+  instanceMixins(Store)
+  timelineMixins(Store)
+}

routes/_store/mixins/timelineMixins.js

@@ -1,4 +1,4 @@
-function timelineMixins (Store) {
+export function timelineMixins (Store) {
   Store.prototype.setForTimeline = function (instanceName, timelineName, obj) {
     let timelines = this.get('timelines') || {}
     let timelineData = timelines[instanceName] || {}
@@ -19,7 +19,3 @@ function timelineMixins (Store) {
     this.setForTimeline(instanceName, timelineName, obj)
   }
 }
-
-export function mixins (Store) {
-  timelineMixins(Store)
-}

routes/_store/observers/instanceObservers.js

@@ -1,6 +1,6 @@
-import { updateInstanceInfo, updateVerifyCredentialsForInstance } from '../_actions/instances'
+import { updateInstanceInfo, updateVerifyCredentialsForInstance } from '../../_actions/instances'
-import { updateLists } from '../_actions/lists'
+import { updateLists } from '../../_actions/lists'
-import { createStream } from '../_actions/streaming'
+import { createStream } from '../../_actions/streaming'
 
 export function instanceObservers (store) {
   // stream to watch for home timeline updates and notifications

routes/_store/observers/notificationObservers.js

@@ -1,5 +1,5 @@
-import { setFavicon } from '../_utils/setFavicon'
+import { setFavicon } from '../../_utils/setFavicon'
-import { scheduleIdleTask } from '../_utils/scheduleIdleTask'
+import { scheduleIdleTask } from '../../_utils/scheduleIdleTask'
 
 let currentFaviconHasNotifications = false
 

routes/_store/observers/timelineObservers.js

@@ -1,5 +1,5 @@
-import { updateInstanceInfo } from '../_actions/instances'
+import { updateInstanceInfo } from '../../_actions/instances'
-import { createStream } from '../_actions/streaming'
+import { createStream } from '../../_actions/streaming'
 
 export function timelineObservers (store) {
   // stream to watch for local/federated/etc. updates. home and notification

routes/_store/store.js

@@ -1,6 +1,6 @@
-import { observers } from './observers'
+import { observers } from './observers/observers'
-import { computations } from './computations'
+import { computations } from './computations/computations'
-import { mixins } from './mixins'
+import { mixins } from './mixins/mixins'
 import { LocalStorageStore } from './LocalStorageStore'
 
 const KEYS_TO_STORE_IN_LOCAL_STORAGE = new Set([
@@ -14,9 +14,7 @@ const KEYS_TO_STORE_IN_LOCAL_STORAGE = new Set([
   'autoplayGifs',
   'markMediaAsSensitive',
   'pinnedPages',
-  'composeText',
+  'composeData'
-  'uploadedMedia',
-  'postPrivacy'
 ])
 
 class PinaforeStore extends LocalStorageStore {
@@ -41,11 +39,9 @@ export const store = new PinaforeStore({
   pinnedStatuses: {},
   instanceInfos: {},
   statusModifications: {},
-  composeText: {},
   rawComposeText: '',
   customEmoji: {},
-  uploadedMedia: {},
+  composeData: {},
-  postPrivacy: {},
   verifyCredentials: {}
 })