Fixing some race condition errors when quickly switching between editor and projects page

src/store/index.js

@@ -94,6 +94,9 @@ export default createStore({
       state.files.push(fileObj)
     },
     updateFileThumbnail(state, payload) {
+      if (!state.project?.url || !Array.isArray(payload.obj.projects)) {
+        return
+      }
       if (payload.obj.projects.includes(state.project.url)) {
         state.files = [
           ...state.files = state.files.filter(file => file.id != payload.obj.id),
@@ -124,6 +127,9 @@ export default createStore({
       state.clips = state.clips.filter(clip => clip.id != clip_id)
     },
     updateClipThumbnail(state, payload) {
+      if (!state.project?.url) {
+        return
+      }
       if (state.project.url == payload.obj.project) {
         state.clips = [
           ...state.clips = state.clips.filter(clip => clip.id != payload.obj.id),
@@ -232,7 +238,7 @@ export default createStore({
         commit('setUser', user_object)
       } catch(err) {
         commit('setUser', null)
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async loadProjects({commit, dispatch}) {
@@ -253,7 +259,7 @@ export default createStore({
       try {
         return instance.get(`projects/${project_id}/`)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async createProject({commit, dispatch}, payload) {
@@ -264,7 +270,7 @@ export default createStore({
         dispatch('attachThumbnail', thumbnail_payload)
         return response.data
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
         return null
       }
     },
@@ -288,7 +294,7 @@ export default createStore({
         await instance.patch(`${payload.url}`, payload)
         commit('setProject', payload)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async deleteProject({commit}, project_id) {
@@ -296,7 +302,7 @@ export default createStore({
         await instance.delete(`projects/${project_id}/`)
         commit('deleteProject', project_id)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async loadFiles({commit, dispatch}, project_id) {
@@ -313,7 +319,7 @@ export default createStore({
         }
         commit('setFiles', files)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async loadClips({commit, dispatch}, project_id) {
@@ -332,7 +338,7 @@ export default createStore({
           dispatch('attachThumbnail', thumbnail_payload)
         }
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async createClip({dispatch, commit}, payload) {
@@ -348,7 +354,7 @@ export default createStore({
         await dispatch('attachThumbnail', thumbnail_payload)
         return clipObj
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
         return null
       }
     },
@@ -364,7 +370,7 @@ export default createStore({
           commit('setScrollToClip', payload.data)
         }
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async moveClip({dispatch, getters}, payload) {
@@ -402,7 +408,7 @@ export default createStore({
         commit('deleteClip', clip_id)
         await dispatch('normalizeClipPositions')
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async deleteFile({commit, dispatch, state}, file_id) {
@@ -428,7 +434,7 @@ export default createStore({
         await instance.delete(`files/${file_id}/`)
         commit('deleteFile', normalizedFileId)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async createFile({commit, dispatch}, payload) {
@@ -455,17 +461,21 @@ export default createStore({
         dispatch('attachThumbnail', thumbnail_payload)
       } catch(err) {
         commit('removeUpload', uploadID)
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async attachThumbnail({commit}, payload) {
       let Obj = payload.obj
+      if (!Obj) {
+        console.warn('attachThumbnail: missing object data', payload)
+        return
+      }
       let objectType = null
-      if (payload.obj.file) {
+      if (Obj.file) {
         // Clip passed in
-        Obj = payload.obj.fileObj
+        Obj = Obj.fileObj
         objectType = 'clip'
-      } else if (payload.obj.media) {
+      } else if (Obj.media) {
         // File passed in
         objectType = 'file'
       } else {
@@ -473,7 +483,11 @@ export default createStore({
         objectType = 'project'
       }
       if (!Obj) {
-        console.warn('attachThumbnail: missing object data', payload)
+        console.warn('attachThumbnail: missing nested object data', payload)
+        return
+      }
+      if (!Obj.url) {
+        console.warn('attachThumbnail: object missing url', payload)
         return
       }
       let sessionKey = `${objectType}-${Obj.id}-frame${payload.frame}`
@@ -522,7 +536,7 @@ export default createStore({
         }
 
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async createExport({commit}, payload) {
@@ -530,7 +544,7 @@ export default createStore({
         const response = await instance.post('/exports/', payload)
         commit('setExport', response.data)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async loadExports({commit}, project_id) {
@@ -543,7 +557,7 @@ export default createStore({
           commit('setExport', export_response.data)
         }
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async checkExportProgress({commit}, exportObj) {
@@ -551,7 +565,7 @@ export default createStore({
         const export_response = await instance.get(exportObj.url)
         commit('setExport', export_response.data)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async loadEffects({commit}, project_id) {
@@ -559,7 +573,7 @@ export default createStore({
         const effects_response = await instance.get(`projects/${project_id}/effects/`)
         commit('setEffects', effects_response.data.results)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async loadEffectCatalog({state, commit}) {
@@ -581,7 +595,7 @@ export default createStore({
         const response = await instance.post('/effects/', payload)
         commit('addEffect', response.data)
       } catch(err) {
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async updateEffect({commit}, payload) {
@@ -590,7 +604,7 @@ export default createStore({
         commit('setEffect', payload)
       } catch(err) {
         console.log(err)
-        commit('addError', err.response.data)
+        commit('addError', err.response?.data || err.message)
       }
     },
     async normalizeClipPositions({getters, dispatch}) {

src/views/Editor.vue

@@ -61,15 +61,17 @@ export default {
       this.hasData = true
     } catch(err) {
       // Handle 404
-      this.addError(err.response.data)
+      this.addError(err.response?.data || err.message)
       await this.$router.push(`/`)
     }
     this.exportPollInterval = setInterval(this.pollForExports, 1000)
   },
   unmounted() {
     // Update project thumbnail
-    let thumbnail_payload = { obj: this.project, frame: 1, clobber: true }
-    this.attachThumbnail(thumbnail_payload)
+    if (this.project) {
+      let thumbnail_payload = { obj: this.project, frame: 1, clobber: true }
+      this.attachThumbnail(thumbnail_payload)
+    }
     this.setProject(null)
     this.setExports([])
     if (this.exportPollInterval) {