Various fixes

package.json

@@ -25,7 +25,7 @@
     "color-string": "1.9.1",
     "fabric": "cgwire/fabric.js",
     "marked": "4.3.0",
-    "marked-emoji": "1.2.2",
+    "marked-emoji": "1.2.4",
     "moment": "2.29.4",
     "moment-timezone": "0.5.43",
     "panzoom": "9.4.3",
@@ -36,8 +36,8 @@
     "superagent": "8.1.2",
     "textarea-caret": "3.1.0",
     "thenby": "1.3.4",
-    "three": "0.155.0",
-    "uuid": "9.0.0",
+    "three": "0.156.1",
+    "uuid": "9.0.1",
     "v-autocomplete": "1.8.2",
     "vue": "2.7.14",
     "vue-at": "2.5.1",
@@ -62,8 +62,8 @@
     "@vitejs/plugin-vue2": "2.2.0",
     "@vue/compiler-sfc": "2.7.14",
     "@vue/test-utils": "1.3.6",
-    "autoprefixer": "10.4.15",
-    "eslint": "8.48.0",
+    "autoprefixer": "10.4.16",
+    "eslint": "8.50.0",
     "eslint-config-prettier": "9.0.0",
     "eslint-plugin-prettier": "5.0.0",
     "eslint-plugin-vue": "9.17.0",
@@ -72,12 +72,12 @@
     "jsdom": "22.1.0",
     "lint-staged": "14.0.1",
     "localStorage": "1.0.4",
-    "postcss": "8.4.28",
+    "postcss": "8.4.30",
     "prettier": "3.0.3",
-    "sass": "1.66.1",
+    "sass": "1.68.0",
     "vite": "4.4.9",
     "vite-plugin-eslint": "1.8.1",
-    "vitest": "0.34.2",
+    "vitest": "0.34.5",
     "vitest-localstorage-mock": "0.0.1",
     "vue-template-compiler": "2.7.14"
   },

src/components/lists/ProductionTeamList.vue

@@ -16,7 +16,7 @@
             <th scope="col" class="role">
               {{ $t('people.list.role') }}
             </th>
-            <th scope="col" class="departments">
+            <th scope="col">
               {{ $t('people.list.departments') }}
             </th>
             <th scope="col" class="actions"></th>
@@ -30,17 +30,17 @@
             />
             <td class="email">{{ person.email }}</td>
             <td class="phone">{{ person.phone }}</td>
-            <td class="role">{{ $t('people.role.' + person.role) }}</td>
-            <department-names-cell
-              class="departemnts"
-              :departments="person.departments"
-            />
-            <td class="actions" v-if="isCurrentUserAdmin">
-              <button class="button" @click="removePerson(person)">
+            <td class="role">{{ $t(`people.role.${person.role}`) }}</td>
+            <department-names-cell :departments="person.departments" />
+            <td class="actions">
+              <button
+                class="button"
+                @click="removePerson(person)"
+                v-if="isCurrentUserAdmin"
+              >
                 {{ $t('main.remove') }}
               </button>
             </td>
-            <td class="actions" v-else></td>
           </tr>
         </tbody>
       </table>
@@ -50,7 +50,7 @@
       {{ $t('people.empty_team') }}
     </p>
 
-    <p class="has-text-centered footer-info">
+    <p class="has-text-centered footer-info" v-else>
       {{ entries.length }} {{ $tc('people.persons', entries.length) }}
     </p>
   </div>
@@ -68,13 +68,18 @@ export default {
     PeopleNameCell
   },
 
-  props: ['entries'],
+  props: {
+    entries: {
+      type: Array,
+      default: () => []
+    }
+  },
 
   computed: {
     ...mapGetters(['isCurrentUserAdmin']),
 
     isEmpty() {
-      return !this.entries || this.entries.length === 0
+      return !this.entries?.length
     }
   },
 

src/components/lists/TaskList.vue

@@ -437,9 +437,8 @@ export default {
     displayedTasks() {
       if (this.tasks && this.tasks.length > 0) {
         return this.tasks.slice(0, 60 * this.page)
-      } else {
-        return []
       }
+      return []
     },
 
     tasksByParent() {
@@ -507,10 +506,9 @@ export default {
 
     getTaskName(task) {
       if (this.entityType === 'Shot') {
-        return task.sequence_name + ' / ' + this.getEntity(task.entity.id).name
-      } else {
-        return task.entity_name
+        return `${task.sequence_name} / ${this.getEntity(task.entity.id).name}`
       }
+      return task.entity_name
     },
 
     isTaskChanged(task, data) {
@@ -629,7 +627,7 @@ export default {
 
     formatDate(date) {
       if (date) return moment(date).format('YYYY-MM-DD')
-      else return ''
+      return ''
     },
 
     isEstimationBurned(task) {
@@ -650,7 +648,7 @@ export default {
     },
 
     getEntity(entityId) {
-      return this[`${this.entityType.toLowerCase()}Map`].get(entityId)
+      return this[`${this.entityType.toLowerCase()}Map`].get(entityId) || {}
     },
 
     onKeyDown(event) {
@@ -720,7 +718,7 @@ export default {
     },
 
     scrollToLine(taskId) {
-      const taskLine = this.$refs['task-' + taskId]
+      const taskLine = this.$refs[`task-${taskId}`]
       if (taskLine && this.$refs.body) {
         const margin = 30
         const rect = taskLine[0].getBoundingClientRect()
@@ -744,16 +742,14 @@ export default {
       } else if (this.isCurrentUserSupervisor) {
         if (this.user.departments.length === 0) {
           return true
-        } else {
-          const taskType = this.taskTypeMap.get(task.task_type_id)
-          return (
-            taskType.department_id &&
-            this.user.departments.includes(taskType.department_id)
-          )
         }
-      } else {
-        return false
+        const taskType = this.taskTypeMap.get(task.task_type_id)
+        return (
+          taskType.department_id &&
+          this.user.departments.includes(taskType.department_id)
+        )
       }
+      return false
     },
 
     resetSelection() {
@@ -788,7 +784,7 @@ export default {
           .map(personId => {
             const person = this.personMap.get(personId)
             if (person) return person.name
-            else return ''
+            return ''
           })
           .join(', ')
 

src/components/modals/AddMetadataModal.vue

@@ -308,9 +308,16 @@ export default {
       const newValue = this.$refs.addChoiceField.value
       if (!this.form.values.find(v => v === newValue) && newValue) {
         this.form.values.push(newValue)
+        if (this.form.data_type === 'taglist') {
+          this.form.values.sort()
+        }
         this.valueToAdd = ''
         this.$nextTick(() => {
-          this.valueList.scrollTop = this.valueList.scrollHeight
+          const newValueIndex = this.form.values.findIndex(v => v === newValue)
+          const newValuePosition =
+            (this.valueList.scrollHeight / this.form.values.length) *
+            newValueIndex
+          this.valueList.scrollTop = newValuePosition
         })
       }
       return newValue
@@ -374,6 +381,9 @@ export default {
         this.checklist = this.getDescriptorChecklistValues(
           this.descriptorToEdit
         )
+        if (this.form.data_type === 'taglist') {
+          this.form.values.sort()
+        }
       } else {
         this.form = {
           name: '',

src/components/modals/AddThumbnailsModal.vue

@@ -64,7 +64,10 @@
             v-if="thumbnailInfo.src"
           />
           <span class="flexrow-item">
-            {{ thumbnailInfo.parentName }} / {{ thumbnailInfo.name }}
+            <template v-if="thumbnailInfo.parentName">
+              {{ thumbnailInfo.parentName }} /
+            </template>
+            {{ thumbnailInfo.name }}
           </span>
           <spinner v-if="loading[thumbnailInfo.id]" :size="10" />
           <check-icon v-if="uploaded[thumbnailInfo.id]" />
@@ -83,13 +86,14 @@
 </template>
 
 <script>
-import { mapGetters, mapActions } from 'vuex'
+import { mapGetters } from 'vuex'
 import { modalMixin } from '@/components/modals/base_modal'
 
 import { CheckIcon } from 'vue-feather-icons'
 
 import stringHelpers from '@/lib/string'
 import assetStore from '@/store/modules/assets'
+import editStore from '@/store/modules/edits'
 import shotStore from '@/store/modules/shots'
 
 import ComboboxTaskType from '@/components/widgets/ComboboxTaskType'
@@ -114,6 +118,11 @@ export default {
       type: Boolean,
       default: false
     },
+    entityType: {
+      type: String,
+      required: true,
+      validator: value => ['Asset', 'Edit', 'Shot'].includes(value)
+    },
     isLoading: {
       type: Boolean,
       default: false
@@ -130,7 +139,7 @@ export default {
 
   data() {
     return {
-      extensions: '.png,.jpg,.mp4,.mov',
+      extensions: '.png,.jpg,.jpeg,.mp4,.mov',
       forms: [],
       loading: {},
       taskTypeId: null,
@@ -146,6 +155,7 @@ export default {
   computed: {
     ...mapGetters([
       'assetValidationColumns',
+      'editValidationColumns',
       'shotValidationColumns',
       'taskTypeMap',
       'taskMap'
@@ -156,25 +166,31 @@ export default {
     },
 
     taskTypeList() {
+      let validationColumns = []
       if (this.isAssets) {
-        return this.assetValidationColumns.map(taskTypeId =>
-          this.taskTypeMap.get(taskTypeId)
-        )
-      } else {
-        return this.shotValidationColumns.map(taskTypeId =>
-          this.taskTypeMap.get(taskTypeId)
-        )
+        validationColumns = this.assetValidationColumns
+      } else if (this.isEdits) {
+        validationColumns = this.editValidationColumns
+      } else if (this.isShots) {
+        validationColumns = this.shotValidationColumns
       }
+      return validationColumns.map(taskTypeId =>
+        this.taskTypeMap.get(taskTypeId)
+      )
     },
 
     isAssets() {
-      return this.$route.path.indexOf('assets') > -1
+      return this.entityType === 'Asset'
+    },
+    isEdits() {
+      return this.entityType === 'Edit'
+    },
+    isShots() {
+      return this.entityType === 'Shot'
     }
   },
 
   methods: {
-    ...mapActions([]),
-
     reset() {
       if (this.taskTypeList.length > 0) {
         this.taskTypeId = this.taskTypeList[0].id
@@ -198,13 +214,18 @@ export default {
         fullName = stringHelpers.slugify(
           `${entity.asset_type_name}_${entity.name}`
         )
-      } else {
+      } else if (this.isEdits) {
+        fullName = stringHelpers.slugify(
+          entity.episode_name
+            ? `${entity.episode_name}_${entity.name}`
+            : entity.name
+        )
+      } else if (this.isShots) {
         fullName = stringHelpers.slugify(
           `${entity.sequence_name}_${entity.name}`
         )
       }
       this.entityMap[fullName] = entity
-      return this.entityMap
     },
 
     addTaskInformation(form) {
@@ -218,13 +239,17 @@ export default {
     onFileSelected(forms) {
       this.entityMap = {}
       this.uploaded = {}
+      let cachedEntities = []
       if (this.isAssets) {
-        assetStore.cache.assets.forEach(this.addEntityToEntityMap)
-      } else {
-        shotStore.cache.shots.forEach(this.addEntityToEntityMap)
+        cachedEntities = assetStore.cache.assets
+      } else if (this.isEdits) {
+        cachedEntities = editStore.cache.edits
+      } else if (this.isShots) {
+        cachedEntities = shotStore.cache.shots
       }
+      cachedEntities.forEach(this.addEntityToEntityMap)
       this.forms = this.filterForms(forms)
-      return this.buildThumbnailList()
+      this.buildThumbnailList()
     },
 
     filterForms(forms) {
@@ -239,9 +264,14 @@ export default {
       this.thumbnailList = this.forms.map(form => {
         const asset = this.entityMap[this.slugifyFilename(form)]
         const url = this.prepareImagePreview(form)
-        const parentName = this.isAssets
-          ? asset.asset_type_name
-          : asset.sequence_name
+        let parentName = ''
+        if (this.isAssets) {
+          parentName = asset.asset_type_name
+        } else if (this.isEdits) {
+          parentName = asset.episode_name
+        } else if (this.isShots) {
+          parentName = asset.sequence_name
+        }
         form.asset = asset
         return {
           parentName,

src/components/modals/EditTaskTypeModal.vue

@@ -141,7 +141,8 @@ export default {
   },
 
   computed: {
-    ...mapGetters(['taskTypes', 'taskTypeStatusOptions', 'departments']),
+    ...mapGetters(['taskTypeStatusOptions', 'departments']),
+
     isEditing() {
       return this.taskTypeToEdit && this.taskTypeToEdit.id
     }