Merge pull request #2018 from NicoPennec/fixes

Various fixes

Author: frankrousseau

package-lock.json

@@ -27,8 +27,8 @@
     "@fullcalendar/multimonth": "6.1.20",
     "@fullcalendar/vue3": "6.1.20",
     "@google/model-viewer": "4.2.0",
-    "@sentry/vue": "10.53.1",
-    "@unhead/vue": "3.1.0",
+    "@sentry/vue": "10.54.0",
+    "@unhead/vue": "3.1.1",
     "@vuepic/vue-datepicker": "11.0.3",
     "bowser": "2.14.1",
     "bulma": "0.3.1",
@@ -43,14 +43,14 @@
     "fabricjs-psbrush": "cgwire/fabricjs-psbrush",
     "file-saver": "2.0.5",
     "lucide-vue-next": "0.577.0",
-    "marked": "18.0.3",
+    "marked": "18.0.4",
     "marked-emoji": "2.0.3",
     "moment": "2.30.1",
     "moment-timezone": "0.6.2",
     "panzoom": "9.4.4",
     "papaparse": "5.5.3",
     "qrcode.vue": "3.9.1",
-    "sanitize-html": "2.17.3",
+    "sanitize-html": "2.17.4",
     "socket.io-client": "4.8.3",
     "superagent": "10.3.0",
     "thenby": "1.3.4",
@@ -73,24 +73,24 @@
   },
   "devDependencies": {
     "@eslint/js": "10.0.1",
-    "@vitejs/plugin-vue": "6.0.6",
+    "@vitejs/plugin-vue": "6.0.7",
     "@vue/compiler-sfc": "3.5.13",
     "@vue/test-utils": "2.4.10",
     "autoprefixer": "10.5.0",
-    "eslint": "10.3.0",
+    "eslint": "10.4.0",
     "eslint-config-prettier": "10.1.8",
     "eslint-plugin-prettier": "5.5.5",
     "eslint-plugin-promise": "7.3.0",
     "eslint-plugin-vue": "10.9.1",
     "globals": "17.6.0",
     "husky": "9.1.7",
     "jsdom": "29.1.1",
-    "lint-staged": "17.0.4",
+    "lint-staged": "17.0.5",
     "localStorage": "1.0.4",
     "prettier": "3.8.3",
-    "sass": "1.99.0",
-    "vite": "8.0.12",
-    "vitest": "4.1.6",
+    "sass": "1.100.0",
+    "vite": "8.0.14",
+    "vitest": "4.1.7",
     "vitest-localstorage-mock": "0.1.2",
     "vue-eslint-parser": "10.4.0"
   },

package.json

@@ -32,7 +32,7 @@
     </div>
 
     <div class="datatable-wrapper" ref="body" @scroll.passive="onBodyScroll">
-      <table class="datatable multi-section">
+      <table class="datatable">
         <thead class="datatable-head">
           <tr>
             <th
@@ -438,15 +438,26 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.datatable-row-header {
-  z-index: 6; // over the .vue-slider (z-index: 5)
+.datatable-head .datatable-row-header {
+  z-index: 8; // sticky <th> must be above all
+
+  &.time-spent {
+    z-index: 6; // <th> must be under the sticky <th> on horizontal scroll
+  }
+}
+
+.datatable-body .datatable-row-header {
+  z-index: 7; // <th> must be over the .vue-slider (z-index: 5) and .vue-slider-dot (z-index: 6)
 
   &.time-spent {
-    position: relative;
     z-index: 5; // <th> must be under <td> on vertical scroll
   }
 }
 
+:deep(.vue-slider-dot:hover) {
+  z-index: 6; // hack to put slider tooltip hover the header
+}
+
 .datatable-body tr:first-child th,
 .datatable-body tr:first-child td {
   border-top: 0;

src/components/lists/TimesheetList.vue

@@ -1,11 +1,11 @@
 import { mapGetters, mapActions } from 'vuex'
 
-import stringHelpers from '@/lib/string'
 import func from '@/lib/func'
 import preferences from '@/lib/preferences'
+import stringHelpers from '@/lib/string'
 
 /*
- * Common functions to shots and assets pages.
+ * Common functions to entity pages (assets, shots, sequences, edits, episodes).
  */
 export const entitiesMixin = {
   data() {
@@ -25,7 +25,7 @@ export const entitiesMixin = {
       `${this.pageName}:department`
     )
     const selectableDepartments = this.selectableDepartments(
-      stringHelpers.capitalize(this.type)
+      this.entityTypeName
     ).map(department => department.id)
 
     if (
@@ -82,12 +82,28 @@ export const entitiesMixin = {
     },
 
     entityTypeName() {
-      return `${this.type[0].toUpperCase()}${this.type.slice(1)}`
+      return stringHelpers.capitalize(this.type)
     },
 
     selectedEntities() {
-      if (['Episode', 'Sequence'].includes(this.entityTypeName)) return []
+      if (['Episode', 'Sequence'].includes(this.entityTypeName)) {
+        return new Map()
+      }
       return this[`selected${this.entityTypeName}s`]
+    },
+
+    deleteAllTasksText() {
+      const taskType = this.taskTypeForTaskDeletion
+      return taskType
+        ? this.$t('tasks.delete_all_text', { name: taskType.name })
+        : ''
+    },
+
+    restoreText() {
+      const entity = this[`${this.type}ToRestore`]
+      return entity
+        ? this.$t(`${this.type}s.restore_text`, { name: entity.name })
+        : ''
     }
   },
 
@@ -135,49 +151,57 @@ export const entitiesMixin = {
       } else {
         this.departmentFilter = [departmentId]
       }
-      this.$store.commit('CLEAR_SELECTED_TASKS')
+      this.clearSelectedTasks()
       preferences.setPreference(`${this.pageName}:department`, departmentId)
     },
 
     selectableDepartments(forEntity) {
       if (!this.currentProduction) {
         return []
       }
-      return this.currentProduction.task_types
-        .map(taskTypeId => {
-          const taskType = this.taskTypeMap.get(taskTypeId)
-          return taskType && taskType.for_entity === forEntity
-            ? this.departmentMap.get(taskType.department_id)
-            : false
-        })
-        .filter(
-          (department, index, self) =>
-            department && self.indexOf(department) === index
+      return [
+        ...new Set(
+          this.currentProduction.task_types
+            .map(id => this.taskTypeMap.get(id))
+            .filter(taskType => taskType?.for_entity === forEntity)
+            .map(taskType => this.departmentMap.get(taskType.department_id))
+            .filter(Boolean)
         )
-    },
-
-    onEntityThumbnailClicked(entityId) {
-      if (!entityId) return
-      this.previvewFileIdToShow = entityId
-      this.modals.isPreviewDisplayed = true
+      ]
     },
 
     closeMetadataModal() {
       this.modals.isAddMetadataDisplayed = false
     },
 
+    confirmAddMetadata(form) {
+      this.loading.addMetadata = true
+      form.entity_type = this.entityTypeName
+      this.addMetadataDescriptor(form)
+        .then(() => {
+          this.modals.isAddMetadataDisplayed = false
+        })
+        .catch(err => {
+          console.error(err)
+          this.errors.addMetadata = true
+        })
+        .finally(() => {
+          this.loading.addMetadata = false
+        })
+    },
+
     confirmDeleteMetadata() {
       this.errors.deleteMetadata = false
       this.loading.deleteMetadata = true
       this.deleteMetadataDescriptor(this.descriptorIdToDelete)
         .then(() => {
-          this.errors.deleteMetadata = false
-          this.loading.deleteMetadata = false
           this.modals.isDeleteMetadataDisplayed = false
         })
         .catch(err => {
           console.error(err)
           this.errors.deleteMetadata = true
+        })
+        .finally(() => {
           this.loading.deleteMetadata = false
         })
     },
@@ -204,16 +228,22 @@ export const entitiesMixin = {
       const projectId = this.currentProduction.id
       this.errors.deleteAllTasks = false
       this.loading.deleteAllTasks = true
-      this.deleteAllTasks({ projectId, taskTypeId, selectionOnly })
+      this[`deleteAll${this.entityTypeName}Tasks`]({
+        projectId,
+        taskTypeId,
+        selectionOnly
+      })
         .then(() => {
-          this.loading.deleteAllTasks = false
+          if (!selectionOnly) this.reset()
           this.modals.isDeleteAllTasksDisplayed = false
         })
         .catch(err => {
           console.error(err)
-          this.loading.deleteAllTasks = false
           this.errors.deleteAllTasks = true
         })
+        .finally(() => {
+          this.loading.deleteAllTasks = false
+        })
     },
 
     confirmAddThumbnails(forms) {
@@ -225,7 +255,7 @@ export const entitiesMixin = {
           taskStatusId: form.task.task_status_id,
           form
         })
-          .then(({ newComment, preview }) => {
+          .then(({ preview }) => {
             return this.setPreview({
               taskId: form.task.id,
               entityId: form.task.entity_id,
@@ -270,13 +300,14 @@ export const entitiesMixin = {
         })
     },
 
-    deleteAllTasksText() {
-      const taskType = this.taskTypeForTaskDeletion
-      if (taskType) {
-        return this.$t('tasks.delete_all_text', { name: taskType.name })
-      } else {
-        return ''
-      }
+    runTasksCreation(form, selectionOnly) {
+      this.errors.creatingTasks = false
+      return this.createTasks({
+        type: `${this.type}s`,
+        task_type_id: form.task_type_id,
+        project_id: this.currentProduction.id,
+        selectionOnly
+      })
     },
 
     onDeleteAllTasksClicked(taskTypeId) {
@@ -286,16 +317,52 @@ export const entitiesMixin = {
       this.modals.isDeleteAllTasksDisplayed = true
     },
 
+    onRestoreClicked(entity) {
+      this[`${this.type}ToRestore`] = entity
+      this.modals.isRestoreDisplayed = true
+    },
+
     saveScrollPosition(scrollPosition) {
-      this.$store.commit('SET_EDIT_LIST_SCROLL_POSITION', scrollPosition)
+      this.$store.commit(
+        `SET_${this.type.toUpperCase()}_LIST_SCROLL_POSITION`,
+        scrollPosition
+      )
     },
 
-    onChangeSortClicked(sortInfo) {
-      this[`change${this.type[0].toUpperCase()}${this.type.slice(1)}Sort`](
-        sortInfo
+    saveSearchQuery(searchQuery) {
+      if (this.loading.savingSearch) return
+      this.loading.savingSearch = true
+      this[`save${this.entityTypeName}Search`](searchQuery)
+        .catch(console.error)
+        .finally(() => {
+          this.loading.savingSearch = false
+        })
+    },
+
+    removeSearchQuery(searchQuery) {
+      this[`remove${this.entityTypeName}Search`](searchQuery).catch(
+        console.error
       )
     },
 
+    getPath(section) {
+      const route = {
+        name: section,
+        params: {
+          production_id: this.currentProduction.id
+        }
+      }
+      if (this.isTVShow && this.currentEpisode) {
+        route.name = `episode-${section}`
+        route.params.episode_id = this.currentEpisode.id
+      }
+      return route
+    },
+
+    onChangeSortClicked(sortInfo) {
+      this[`change${this.entityTypeName}Sort`](sortInfo)
+    },
+
     onKeepTaskPanelOpenChanged(keepOpen) {
       this.keepTaskPanelOpen = keepOpen
     },
@@ -311,6 +378,12 @@ export const entitiesMixin = {
       this.onSelectedDepartmentChanged()
     },
 
+    currentProduction(newProd, oldProd) {
+      if (!oldProd || !newProd || oldProd.id === newProd.id) return
+      this.keepTaskPanelOpen = false
+      this.clearSelection()
+    },
+
     displaySettings: {
       deep: true,
       handler(newSettings) {