lint

src/components/conversation/conversation.js

@@ -1,4 +1,3 @@
-import { get } from 'lodash-es'
 import { storeToRefs } from 'pinia'
 import {
   computed,
@@ -20,7 +19,6 @@ import ThreadTree from 'src/components/thread_tree/thread_tree.vue'
 
 import { useInterfaceStore } from 'src/stores/interface.js'
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
-import { useStatusesStore } from 'src/stores/statuses.js'
 
 import { useConversation } from 'src/composables/useConversation.js'
 import { useInterfaceSizes } from 'src/composables/useInterfaceSizes.js'
@@ -28,8 +26,6 @@ import { useScrollPosition } from 'src/composables/useScrollPosition.js'
 import { useTreeConversationTopology } from 'src/composables/useTreeConversationTopology.js'
 import { useVirtualScrolling } from 'src/composables/useVirtualScrolling.js'
 
-import { WSConnectionStatus } from 'src/api/websocket.js'
-
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
   faAngleDoubleDown,
@@ -116,7 +112,9 @@ export default {
       fetchConversation,
       loadError,
     } = useConversation(statusId, isExpanded)
-    const conversationLite = computed(() => conversation.value.map(({ id }) => ({ id })))
+    const conversationLite = computed(() =>
+      conversation.value.map(({ id }) => ({ id })),
+    )
 
     watch(
       expanded,
@@ -187,7 +185,9 @@ export default {
     // # Linear style stuff
     const isLinearView = computed(() => displayStyle.value !== 'tree')
     const linearElement = useTemplateRef('linear')
-    const linearScrollCompensation = computed(() => isExpanded.value && isLinearView.value)
+    const linearScrollCompensation = computed(
+      () => isExpanded.value && isLinearView.value,
+    )
     const {
       heightChart: heightChartLinear,
       changeSuspendState: changeSuspendStateLinear,
@@ -231,9 +231,13 @@ export default {
       { flush: 'post' },
     )
 
-    const currentAncestorsLite = computed(() => currentAncestors.value.map(({ id }) => ({ id })))
+    const currentAncestorsLite = computed(() =>
+      currentAncestors.value.map(({ id }) => ({ id })),
+    )
     const ancestorsElement = useTemplateRef('ancestors')
-    const treeScrollCompensation = computed(() => isExpanded.value && isTreeView.value)
+    const treeScrollCompensation = computed(
+      () => isExpanded.value && isTreeView.value,
+    )
     const {
       heightChart: heightChartAncestors,
       changeSuspendState: changeSuspendStateAncestors,

src/composables/useConversation.js

@@ -1,4 +1,3 @@
-import { get } from 'lodash-es'
 import { storeToRefs } from 'pinia'
 import { computed, provide, ref, watch } from 'vue'
 
@@ -13,6 +12,7 @@ import {
   fetchConversation as apiFetchConversation,
   fetchStatus as apiFetchStatus,
 } from 'src/api/public.js'
+import { WSConnectionStatus } from 'src/api/websocket.js'
 
 export function useConversation(statusId, expanded) {
   const loadError = ref(null)
@@ -42,9 +42,13 @@ export function useConversation(statusId, expanded) {
     }
   })
 
-  watch(expanded, (value) => {
+  watch(
-    setFocused(value ? statusId.value : null)
+    expanded,
-  }, { immediate: true })
+    (value) => {
+      setFocused(value ? statusId.value : null)
+    },
+    { immediate: true },
+  )
 
   watch(
     focusedStatus,

src/composables/useVirtualScrolling.js

@@ -1,4 +1,4 @@
-import { last, first } from 'lodash-es'
+import { first, last } from 'lodash-es'
 import { computed, nextTick, ref, toValue, watch } from 'vue'
 
 import { useWindowSize } from 'src/composables/useWindowSize.js'
@@ -127,7 +127,8 @@ export function useVirtualScrolling({
 
     // Include buffer zone
     const finalTopScrollBoundary = topScrollBoundary.value - bufferZone.value
-    const finalBottomScrollBoundary = bottomScrollBoundary.value + bufferZone.value
+    const finalBottomScrollBoundary =
+      bottomScrollBoundary.value + bufferZone.value
 
     // To be visible, item's bottom boundary shoud be below top scroll boundary)
     const isBelowTopBoundary = itemBottomBoundary > finalTopScrollBoundary
@@ -142,7 +143,7 @@ export function useVirtualScrolling({
     heightChart.value.map((heightChartItem) => ({
       ...heightChartItem,
       visible: checkVisible(heightChartItem),
-    }))
+    })),
   )
 
   // ## Scroll compensation
@@ -173,19 +174,20 @@ export function useVirtualScrolling({
 
           return 0 - oldBottomElement.top - oldBottomElement.height
         } else {
-          console.log('COMPENSATE', oldVal, newVal, topScrollBoundary.value)
           const oldVisible = oldVal.filter((item) => checkVisible(item))
           const oldItem = first(oldVisible)
           if (!oldItem) return 0 // probably out of bounds in timeline
           const oldItemUpdated = newVal.find(({ id }) => id === oldItem.id)
-          console.log('OLD', oldItem, oldItemUpdated)
           if (!oldItemUpdated) return 0 // context change?
-          return oldItemUpdated.top - oldItem.top - (oldItem.height - oldItemUpdated.height)
+          return (
+            oldItemUpdated.top -
+            oldItem.top -
+            (oldItem.height - oldItemUpdated.height)
+          )
         }
       })()
 
       if (diff !== 0) {
-        console.log('DIFF', diff)
         // Scroll by amount offset changed to keep it in view
         topScrollBoundary.value += diff
         bottomScrollBoundary.value += diff
@@ -195,14 +197,13 @@ export function useVirtualScrolling({
 
       resumeWatchers()
     },
-    { flush: 'post' }
+    { flush: 'post' },
   )
 
   const heightChartGrouped = computed(() =>
     // Group invisible items into spacers
     heightChartVisibility.value.reduce((acc, heightChartItem) => {
-      const { suspendable, visible, height, top, bottom, id } =
+      const { suspendable, visible, height, top, bottom, id } = heightChartItem
-        heightChartItem
       // Bottom value isn't really used otherwise for debugging
       const present = visible || !suspendable
       if (present) {
@@ -237,7 +238,7 @@ export function useVirtualScrolling({
           return [...acc, spacer]
         }
       }
-    }, [])
+    }, []),
   )
 
   const reset = async () => {