Merge pull request #1198 from NicoPennec/fix/comments

Improve comments
cgwire · Sep 25, 2023 · 042a0b7 · 042a0b7
2 parents 2100b82 + 62310ea
commit 042a0b7
Show file tree

Hide file tree

Showing 8 changed files with 27 additions and 38 deletions.
diff --git a/src/components/cells/MetadataHeader.vue b/src/components/cells/MetadataHeader.vue
@@ -22,7 +22,7 @@
         @click="$emit('show-metadata-header-menu', $event)"
         v-if="!noMenu"
       >
-        <chevron-down-icon :size="'12'" />
+        <chevron-down-icon size="12" />
       </span>
     </div>
   </th>

diff --git a/src/components/mixins/player.js b/src/components/mixins/player.js
@@ -1268,7 +1268,6 @@ export const playerMixin = {
 
   watch: {
     isCommentsHidden() {
-      if (!this.isCommentsHidden) this.$refs['task-info'].loadTaskData()
       if (this.isCurrentPreviewSound) {
         this.soundPlayer.redraw()
       }

diff --git a/src/components/pages/Edit.vue b/src/components/pages/Edit.vue
@@ -157,17 +157,14 @@
           </div>
           <task-info
             ref="task-info"
-            :class="{
-              'flexrow-item': true,
-              'task-info-column': true,
-              hidden: isCommentsHidden
-            }"
+            class="flexrow-item task-info-column"
             :task="task"
             :is-preview="false"
             :silent="isCommentsHidden"
             :current-time-raw="currentTimeRaw - frameDuration"
             :current-parent-preview="currentPreview"
             @time-code-clicked="onTimeCodeClicked"
+            v-show="!isCommentsHidden"
           />
         </div>
 
@@ -421,6 +418,7 @@
           <div class="separator"></div>
           <button-simple
             class="button player-button flexrow-item"
+            :active="!isCommentsHidden"
             :title="$t('playlists.actions.comments')"
             @click="onCommentClicked"
             icon="comment"

diff --git a/src/components/pages/playlists/PlaylistPlayer.vue b/src/components/pages/playlists/PlaylistPlayer.vue
@@ -265,18 +265,14 @@
 
       <task-info
         ref="task-info"
-        :class="{
-          'flexrow-item': true,
-          'task-info-column': true,
-          hidden: isCommentsHidden
-        }"
+        class="flexrow-item task-info-column"
         :task="task"
         :is-preview="false"
         :silent="isCommentsHidden"
         :current-time-raw="currentTimeRaw"
         :current-parent-preview="currentPreview"
-        panel-name="playlist-side-panel"
         @time-code-clicked="onTimeCodeClicked"
+        v-show="!isCommentsHidden"
       />
     </div>
 
@@ -670,13 +666,15 @@
       <div class="separator"></div>
       <button-simple
         class="button playlist-button flexrow-item"
+        :active="!isCommentsHidden"
         :title="$t('playlists.actions.comments')"
         @click="onCommentClicked"
         icon="comment"
       />
       <button-simple
         class="playlist-button flexrow-item"
         :title="$t('playlists.actions.entity_list')"
+        :active="!isEntitiesHidden"
         @click="onFilmClicked"
         icon="film"
       />
@@ -1425,7 +1423,7 @@ export default {
         if (this.$refs['video-container']) {
           this.$refs['video-container'].style.height = `${height}px`
         }
-        if (!this.isCommentsHidden) {
+        if (this.$refs['task-info'] && !this.isCommentsHidden) {
           this.$refs['task-info'].$el.style.height = `${height}px`
         }
         if (this.$refs['picture-preview-wrapper']) {

diff --git a/src/components/previews/PreviewPlayer.vue b/src/components/previews/PreviewPlayer.vue
@@ -89,19 +89,16 @@
         </div>
 
         <task-info
-          name="task-info"
           ref="task-info-player"
-          :class="{
-            'flexrow-item': true,
-            'task-info-column': true,
-            hidden: isCommentsHidden
-          }"
+          class="flexrow-item task-info-column"
           :task="task"
           :is-preview="false"
+          :silent="isCommentsHidden"
           :current-time-raw="currentTimeRaw"
           :current-parent-preview="currentPreview"
           @comment-added="$emit('comment-added')"
           @time-code-clicked="timeCodeClicked"
+          v-show="!isCommentsHidden"
         />
       </div>
     </div>
@@ -348,6 +345,7 @@
             <button-simple
               class="button playlist-button flexrow-item"
               icon="comment"
+              :active="!isCommentsHidden"
               :title="$t('playlists.actions.comments')"
               @click="onCommentClicked"
               v-if="!readOnly && fullScreen"
@@ -1590,8 +1588,6 @@ export default {
       this.$nextTick(() => {
         if (!this.isCommentsHidden) {
           this.$refs['task-info-player'].$el.style.height = `${height}px`
-        }
-        if (this.$refs['task-info-player']) {
           this.$refs['task-info-player'].focusCommentTextarea()
         }
         this.previewViewer.resetVideo()

diff --git a/src/components/sides/TaskInfo.vue b/src/components/sides/TaskInfo.vue
@@ -339,10 +339,6 @@ export default {
       type: Boolean,
       default: false
     },
-    panelName: {
-      type: String,
-      default: 'todefine'
-    },
     withActions: {
       type: Boolean,
       default: false
@@ -408,7 +404,6 @@ export default {
   },
 
   mounted() {
-    this.loadTaskData()
     if (this.$refs['add-comment']) {
       const draft = drafts.getTaskDraft(this.task.id)
       if (draft) {
@@ -804,7 +799,7 @@ export default {
     },
 
     focusCommentTextarea() {
-      if (this.$refs['add-comment']) this.$refs['add-comment'].focus()
+      this.$refs['add-comment']?.focus()
     },
 
     getOriginalPath() {
@@ -1278,6 +1273,14 @@ export default {
       if (!this.silent) {
         this.loadTaskData()
       }
+    },
+    silent: {
+      immediate: true,
+      handler() {
+        if (!this.silent) {
+          this.loadTaskData()
+        }
+      }
     }
   },
 
@@ -1568,7 +1571,7 @@ export default {
 
 .side {
   flex: 1;
-  overflow: scroll;
+  overflow: auto;
 }
 
 .extend-bar {

diff --git a/src/components/widgets/Comment.vue b/src/components/widgets/Comment.vue
@@ -982,6 +982,7 @@ article.comment {
 .date {
   font-size: 0.8em;
   margin-right: 0.5em;
+  white-space: nowrap;
 }
 
 .preview-info {

diff --git a/src/store/api/tasks.js b/src/store/api/tasks.js
@@ -9,10 +9,6 @@ export default {
     return client.pput(`/api/data/tasks/${taskId}`, data, callback)
   },
 
-  getTaskStatuses(callback) {
-    client.get('/api/data/task-status', callback)
-  },
-
   getTaskSubscribed(taskId, callback) {
     return client.pget(`/api/data/user/tasks/${taskId}/subscribed`)
   },
@@ -39,12 +35,10 @@ export default {
       comment: data.comment,
       checklist: data.checklist || []
     }
-    if (data.attachment && data.attachment.length > 0) {
+    if (data.attachment?.length) {
       commentData = new FormData()
-      let i = 0
-      data.attachment.forEach(attachment => {
-        commentData.append('file-' + i, attachment.get('file'))
-        i++
+      data.attachment.forEach((attachment, index) => {
+        commentData.append(`file-${index}`, attachment.get('file'))
       })
       commentData.set('task_status_id', data.taskStatusId)
       commentData.set('comment', data.comment)