lint

src/components/conversation/conversation.js

@@ -1,13 +1,13 @@
 import { storeToRefs } from 'pinia'
 import {
   computed,
+  nextTick,
   onUnmounted,
   provide,
   ref,
   toRefs,
   useTemplateRef,
   watch,
-  nextTick,
 } from 'vue'
 import { useRouter } from 'vue-router'
 
@@ -97,7 +97,9 @@ export default {
     provide('isExpanded', isExpanded)
     provide('isPage', isPage)
     provide('expandable', true)
-    watch(expanded, (val) => val ? emit('expanded') : emit('collapsed'), { flush: 'post' })
+    watch(expanded, (val) => (val ? emit('expanded') : emit('collapsed')), {
+      flush: 'post',
+    })
 
     // # Main things
     const {
@@ -189,7 +191,12 @@ export default {
       if (isPage.value) {
         return navbarSize.value + fontSize.value + panelHeaderSize.value
       } else if (expanded.value) {
-        return navbarSize.value + fontSize.value + panelHeaderSize.value * 2 + rootElementMargin.value
+        return (
+          navbarSize.value +
+          fontSize.value +
+          panelHeaderSize.value * 2 +
+          rootElementMargin.value
+        )
       } else {
         return navbarSize.value + fontSize.value
       }

src/components/timeline/timeline.js

@@ -2,13 +2,13 @@ import { debounce, throttle } from 'lodash-es'
 import { storeToRefs } from 'pinia'
 import {
   computed,
+  nextTick,
   onMounted,
   onUnmounted,
   ref,
   toRefs,
   useTemplateRef,
   watch,
-  nextTick,
 } from 'vue'
 import { useI18n } from 'vue-i18n'
 
@@ -83,17 +83,13 @@ const Timeline = {
     const body = useTemplateRef('timeline')
     const offset = computed(() => {
       if (embedded.value) {
-      // The fontsize after navbar is the little gap between navbar and content
+        // The fontsize after navbar is the little gap between navbar and content
         return navbarSize.value + fontSize.value
       } else {
         return 0
       }
     })
-    const {
-      heightChart,
-      changeSuspendState,
-      updateVirtualHeight,
-    } =
+    const { heightChart, changeSuspendState, updateVirtualHeight } =
       useVirtualScrolling({
         name: 'Timeline',
         enabled: ref(true),

src/composables/useConversation.js

@@ -1,5 +1,5 @@
 import { storeToRefs } from 'pinia'
-import { computed, provide, ref, watch, nextTick } from 'vue'
+import { computed, nextTick, provide, ref, watch } from 'vue'
 
 import { useMergedConfigStore } from 'src/stores/merged_config.js'
 import { useOAuthStore } from 'src/stores/oauth.js'
@@ -173,7 +173,9 @@ export function useConversation(statusId, expanded) {
   }
   watch(statusId, (val) => setFocused(val), { immediate: true })
 
-  const focusedId = computed(() => (expanded.value && fullyLoaded.value) ? focusedStatus.value?.id : null)
+  const focusedId = computed(() =>
+    expanded.value && fullyLoaded.value ? focusedStatus.value?.id : null,
+  )
   provide('focusedId', focusedId)
 
   watch(

src/composables/useInterfaceSizes.js

@@ -20,17 +20,17 @@ export function useInterfaceSizes() {
   watch(fontSizeSetting, updateFontSize, { immediate: true })
 
   const navbarSize = computed(() => {
-    const string =
-      window.getComputedStyle(document.body).getPropertyValue('--navbarSize')
+    const string = window
+      .getComputedStyle(document.body)
+      .getPropertyValue('--navbarSize')
 
     return fontSize.value * Number.parseInt(string.slice(0, -3), 10) // remove the 'rem'
   })
 
   const panelHeaderSize = computed(() => {
-    const string =
-      window
-        .getComputedStyle(document.body)
-        .getPropertyValue('--panelHeaderSize')
+    const string = window
+      .getComputedStyle(document.body)
+      .getPropertyValue('--panelHeaderSize')
 
     return fontSize.value * Number.parseInt(string.slice(0, -3), 10) // remove the 'rem'
   })

src/composables/useMainStatus.js

@@ -1,13 +1,12 @@
 import { computed, toValue } from 'vue'
-import { storeToRefs } from 'pinia'
 
 import { useStatusesStore } from 'src/stores/statuses.js'
 
 export function useMainStatus(statusId) {
-  const statusesStore = storeToRefs(useStatusesStore())
-  const getStatusObject = (id) => statusesStore.allStatuses.value.get(id)
+  const statusesStore = useStatusesStore()
+  const getStatusObject = (id) => statusesStore.allStatuses.get(id)
 
-  const status = computed(() => getStatusObject(statusId.value))
+  const status = computed(() => getStatusObject(toValue(statusId)))
 
   const mainStatus = computed(() => {
     if (!status.value) return null

src/composables/useVirtualScrolling.js

@@ -235,19 +235,21 @@ export function useVirtualScrolling({
 
           const expansion = (() => {
             if (newVal.length < oldVal.length) return 0
-            const oldVisible = oldVal.filter((item) => checkVisible(item) && item.real)
+            const oldVisible = oldVal.filter(
+              (item) => checkVisible(item) && item.real,
+            )
             const oldItem = first(oldVisible)
             if (!oldItem) return 0 // probably out of bounds in timeline
             const oldItemUpdated = newVal.find(({ id }) => id === oldItem.id)
 
             return (
               oldItemUpdated.top -
-                oldItem.top -
-                (oldItem.height - oldItemUpdated.height)
+              oldItem.top -
+              (oldItem.height - oldItemUpdated.height)
             )
           })()
 
-          const collapsing  = (() => {
+          const collapsing = (() => {
             if (newVal.length >= oldVal.length) return 0
             const newVisible = newVal
             const newItem = first(newVisible)
@@ -256,8 +258,8 @@ export function useVirtualScrolling({
 
             return (
               newItem.top -
-                newItemBefore.top -
-                (newItemBefore.height - newItem.height)
+              newItemBefore.top -
+              (newItemBefore.height - newItem.height)
             )
           })()
 
@@ -289,7 +291,10 @@ export function useVirtualScrolling({
 
     const element = heightChart.value.find(({ id }) => anchors.has(id))
     const elementMiddle = element.top + element.height / 2
-    const desiredTopBoundary = Math.min(element.top, elementMiddle - (windowHeight.value - offset.value) / 2)
+    const desiredTopBoundary = Math.min(
+      element.top,
+      elementMiddle - (windowHeight.value - offset.value) / 2,
+    )
 
     scrollBy(0, desiredTopBoundary - topScrollBoundary.value)