Various fixes

package.json

@@ -64,7 +64,7 @@
     "autoprefixer": "10.4.16",
     "eslint": "8.51.0",
     "eslint-config-prettier": "9.0.0",
-    "eslint-plugin-prettier": "5.0.0",
+    "eslint-plugin-prettier": "5.0.1",
     "eslint-plugin-vue": "9.17.0",
     "esm": "3.2.25",
     "husky": "8.0.3",
@@ -73,7 +73,7 @@
     "localStorage": "1.0.4",
     "postcss": "8.4.31",
     "prettier": "3.0.3",
-    "sass": "1.69.0",
+    "sass": "1.69.3",
     "vite": "4.4.11",
     "vite-plugin-eslint": "1.8.1",
     "vitest": "0.34.6",

src/components/Main.vue

@@ -30,6 +30,5 @@ export default {
   height: 100%;
   display: flex;
   flex-direction: column;
-  background: $white-grey;
 }
 </style>

src/components/cells/TaskStatusName.vue → src/components/cells/TaskStatusCell.vue

@@ -18,7 +18,7 @@
 import { mapGetters, mapActions } from 'vuex'
 
 export default {
-  name: 'task-status-name',
+  name: 'task-status-cell',
   components: {},
   props: {
     entry: {

src/components/cells/TimeSliderCell.vue

@@ -6,24 +6,21 @@
       </span>
       <vue-slider
         class="flexrow-item slider"
-        ref="slider"
         v-model="value"
         v-bind="options"
+        :max="maxHoursByDay"
       />
       <button class="button flexrow-item" @click="setValue(1)">1</button>
       <button class="button flexrow-item" @click="setValue(4)">4</button>
-      <button
-        class="button flexrow-item"
-        @click="setValue(organisation.hours_by_day || 8)"
-      >
-        {{ organisation.hours_by_day || 8 }}
+      <button class="button flexrow-item" @click="setValue(hoursByDay)">
+        {{ hoursByDay }}
       </button>
     </div>
   </td>
 </template>
 
 <script>
-import { mapGetters, mapActions } from 'vuex'
+import { mapGetters } from 'vuex'
 import VueSlider from 'vue-slider-component'
 
 export default {
@@ -33,22 +30,15 @@ export default {
     return {
       value: this.duration,
       options: {
-        show: true,
         width: 400,
         min: 0,
-        max: 10,
         interval: 0.25,
         lazy: true,
-        marks: true,
-        hideLabel: true,
         piecewise: true,
-        tooltip: 'focus',
-        tooltipPlacement: 'bottom',
+        useKeyboard: true,
+        tooltip: 'hover',
         processStyle: {
           'background-color': '#8F91EB'
-        },
-        railStyle: {
-          background: '#CCC'
         }
       }
     }
@@ -70,12 +60,18 @@ export default {
   },
 
   computed: {
-    ...mapGetters(['organisation'])
+    ...mapGetters(['organisation']),
+
+    hoursByDay() {
+      return this.organisation.hours_by_day || 8
+    },
+
+    maxHoursByDay() {
+      return Math.min(this.hoursByDay + 4, 24)
+    }
   },
 
   methods: {
-    ...mapActions([]),
-
     setValue(value) {
       this.value = value
     }
@@ -96,11 +92,10 @@ export default {
 .value {
   font-size: 1.5em;
   font-weight: bold;
-  width: 30px;
+  width: 40px;
 }
 
 .slider {
   cursor: pointer;
-  z-index: 0;
 }
 </style>

src/components/lists/DepartmentList.vue

@@ -42,7 +42,7 @@ import RowActionsCell from '@/components/cells/RowActionsCell'
 import TableInfo from '@/components/widgets/TableInfo'
 
 export default {
-  name: 'departments-list',
+  name: 'department-list',
   props: ['entries', 'isLoading', 'isError'],
   data() {
     return {}

src/components/lists/EntityTaskList.vue

@@ -108,7 +108,7 @@ import { mapGetters, mapActions } from 'vuex'
 
 import { formatListMixin } from '@/components/mixins/format'
 
-import TaskTypeCell from '@/components/cells/TaskTypeName'
+import TaskTypeCell from '@/components/cells/TaskTypeCell'
 import TableInfo from '@/components/widgets/TableInfo'
 import ValidationTag from '@/components/widgets/ValidationTag'
 import PeopleAvatar from '@/components/widgets/PeopleAvatar'

src/components/lists/EpisodeStatsList.vue

@@ -207,7 +207,7 @@ import StatsCell from '@/components/cells/StatsCell'
 import TableInfo from '@/components/widgets/TableInfo'
 
 export default {
-  name: 'episode-list',
+  name: 'episode-stats-list',
   mixins: [entityListMixin],
 
   components: {

src/components/lists/PreviewFileList.vue

@@ -50,7 +50,7 @@
             <td class="entity-name">
               {{ previewFile.full_entity_name }}
             </td>
-            <task-type-name
+            <task-type-cell
               class="task-type"
               :task-type="taskTypeMap.get(previewFile.task_type_id)"
             />
@@ -63,7 +63,7 @@
             <td class="end-cell has-text-right">
               <button-simple
                 class="mark-broken-button"
-                text="Mark as broken"
+                :text="$t('logs.preview_files.mark_broken')"
                 @click="$emit('mark-broken-clicked', previewFile.id)"
                 v-if="previewFile.status === 'processing'"
               />
@@ -84,17 +84,17 @@ import { getTaskPath } from '@/lib/path'
 import ButtonSimple from '@/components/widgets/ButtonSimple'
 import TableInfo from '@/components/widgets/TableInfo'
 import ProductionNameCell from '@/components/cells/ProductionNameCell'
-import TaskTypeName from '@/components/cells/TaskTypeName'
+import TaskTypeCell from '@/components/cells/TaskTypeCell'
 
 export default {
-  name: 'entity-task-list',
+  name: 'preview-file-list',
   mixins: [formatListMixin],
 
   components: {
     ButtonSimple,
     ProductionNameCell,
     TableInfo,
-    TaskTypeName
+    TaskTypeCell
   },
 
   props: {